/*member/index页面css*/
/* ===== 会员卡片网格 ===== */
.member-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 24px;
margin-bottom: 40px;
}

/* ===== 单个卡片 ===== */
.member-card {
background: #ffffff;
border-radius: 20px;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04), 0 1px 4px rgba(0, 0, 0, 0.02);
padding: 24px 22px 20px;
transition: all 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
border: 1px solid #f1f5f9;
display: flex;
flex-direction: column;
position: relative;
}

/* 卡片顶部：头像 + 姓名 + 更多操作 */
.card-top {
display: flex;
align-items: center;
gap: 16px;
margin-bottom: 10px;
}
.avatar {
display: flex;
align-items: center;
justify-content: center;
position: relative;
margin-right:10px;
}
.avatar img {
width: 56px;
height: 56px;
border-radius:50%;
border:1px solid #eeeeee;
}

.avatar .online-dot {
position: absolute;
bottom: 0;
right: 0;
width: 14px;
height: 14px;
background: #22c55e;
border: 2.5px solid #ffffff;
border-radius: 50%;
}

.card-top .name-group {
flex: 1;
min-width: 0;
}

.card-top .name-group .member-name {
font-size: 17px;
font-weight: 600;
color: #0f172a;
line-height: 1.3;
}

.card-top .name-group .member-account {
font-size: 13px;
color: #64748b;
margin-top: 2px;
font-weight: 450;
}

.card-top .action-menu {
flex-shrink: 0;
position: relative;
}

.card-top .action-menu .more-btn {
background: transparent;
border: none;
width: 34px;
height: 34px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: #94a3b8;
cursor: pointer;
transition: background 0.2s, color 0.2s;
}

.card-top .action-menu .more-btn:hover {
background: #f1f5f9;
color: #1e293b;
}

/* ===== 卡片信息列表 ===== */
.card-info {
display: flex;
flex-direction: column;
flex: 1;
}

.card-info .info-item {
display: flex;
align-items: center;
font-size: 14px;
color: #334155;
margin-bottom:10px;
}
.card-info .info-item:last-of-type{margin-bottom:0;}
.card-info .info-item .info-icon {
width: 20px;
text-align: center;
color: #94a3b8;
font-size: 14px;
flex-shrink: 0;
}

.card-info .info-item .info-text {
flex: 1;
word-break: break-word;
}

.card-info .info-item .info-text .dept-tag {
display: inline-block;
background: #eff6ff;
color: #2563eb;
font-size: 12px;
font-weight: 500;
padding: 1px 14px;
border-radius: 40px;
line-height: 24px;
}

.card-info .info-item .login-time {
font-size: 13px;
color: #64748b;
}

/* ===== 卡片底部：编辑 & 删除按钮 ===== */
.card-actions {
display: flex;
gap: 10px;
border-top: 1px solid #f1f5f9;
padding-top: 16px;
margin-top: 10px;
}
.card-actions a:last-of-type{margin-left:10px;}
.card-actions .btn-edit,
.card-actions .btn-delete {
flex: 1;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
padding: 8px 0;
border-radius: 10px;
font-size: 13px;
font-weight: 500;
cursor: pointer;
transition: all 0.2s;
border: none;
background: #f8fafc;
color: #475569;
}

.card-actions .btn-edit {
background: #f8fafc;
color: #2563eb;
}

.card-actions .btn-edit:hover {
background: #eff6ff;
color: #1d4ed8;
}

.card-actions .btn-delete {
background: #fef2f2;
color: #dc2626;
}

.card-actions .btn-delete:hover {
background: #fee2e2;
color: #b91c1c;
}