/* ==========================================================================
   绩效管家 · PC 端布局（在 app.css 之上）
   ========================================================================== */

body { padding-bottom: 30px; min-height: 100vh; }

/* ---------- 顶部导航 ---------- */
.app-navbar {
    background: var(--brand-grad);
    box-shadow: 0 2px 10px rgba(79, 70, 229, .35);
}
.app-navbar .navbar-brand { font-weight: 800; letter-spacing: .5px; }
.app-navbar .nav-link {
    color: rgba(255, 255, 255, .82);
    border-radius: 8px;
    padding: .35rem .8rem !important;
    font-size: .92rem;
}
.app-navbar .nav-link:hover { color: #fff; background: rgba(255, 255, 255, .12); }
.app-navbar .nav-link.active { color: #fff; background: rgba(255, 255, 255, .18); font-weight: 600; }
.app-navbar .dropdown-menu { border-radius: var(--radius-sm); border: 1px solid var(--border); box-shadow: var(--shadow); }
.app-navbar .user-chip {
    color: #fff;
    background: rgba(255, 255, 255, .16);
    border-radius: 999px;
    padding: .3rem .85rem;
    font-size: .88rem;
}

/* ---------- 布局 ---------- */
.pc-container { max-width: 1200px; margin: 0 auto; padding: 1rem .75rem 2rem; }

/* ---------- 表格密度 ---------- */
.table-scroll-container { max-height: 68vh; }
.table-scroll-container thead th { font-size: .78rem; padding: 9px 8px; }
.table-scroll-container tbody td { font-size: .82rem; padding: 7px 9px; }
.table-scroll-container tbody tr:hover td { background: #f8fafc; }
.table-footer td { font-size: .82rem; padding: 8px 9px !important; }
.employee-list-table tbody td { padding: 8px 10px; font-size: .88rem; }

/* ---------- 统计卡（桌面 4 列，管理员首页用） ---------- */
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; }
.stat-card .num { font-size: 1.5rem; }
@media (max-width: 768px) {
    .stat-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- 首页快捷操作 ---------- */
.hero-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }

/* ---------- 模态 ---------- */
.modal-content { border-radius: var(--radius); border: none; box-shadow: var(--shadow); }
.modal-header { border-bottom: 1px solid var(--border); }
.modal-footer { border-top: 1px solid var(--border); }