/* QuickPass-style professional UI */
:root{
  --brand:#3b82f6; --brand-dark:#1e3a8a; --bg:#f3f4f6; --text:#1f2937; --muted:#6b7280;
  --sidebar-bg:#ffffff; --sidebar-border:#e5e7eb; --sidebar-width:260px;
}
body{background:linear-gradient(180deg,#eef2ff 0%,#f8fafc 100%); color:var(--text); font-family:"Segoe UI",system-ui,Arial,sans-serif;}
.headerbar{background:#fff;border-bottom:1px solid var(--sidebar-border);box-shadow:0 2px 10px rgba(0,0,0,.04);position:sticky;top:0;z-index:1030;}
.brand-title{font-weight:700;letter-spacing:.2px;color:var(--brand-dark);}
.main-wrapper{display:flex;min-height:calc(100vh - 56px);}
.sidebar{width:var(--sidebar-width);background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);padding:14px 10px;}
.sidebar .group-title{font-size:.75rem;letter-spacing:.12em;color:var(--muted);margin:18px 10px 8px;text-transform:uppercase;}
.sidebar .nav-link{display:flex;align-items:center;gap:10px;color:#374151;padding:10px 12px;border-radius:10px;transition:.15s background,.15s color,.15s transform;}
.sidebar .nav-link .bi{font-size:1.05rem;opacity:.9;}
.sidebar .nav-link:hover{background:#eef2ff;color:#111827;transform:translateX(2px);}
.sidebar .nav-link.active{background:var(--brand);color:#fff;box-shadow:0 6px 12px rgba(59,130,246,.2);}
.content{flex:1;background:var(--bg);padding:24px;}
.card{border:none;border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.06);}
.footer{color:var(--muted);font-size:.9rem;padding:18px 0;}
@media (max-width: 992px){.sidebar{position:fixed;inset:56px auto 0 0;height:calc(100vh - 56px);transform:translateX(-100%);transition:transform .2s ease;z-index:1040;}
.sidebar.show{transform:translateX(0);} .content{padding:16px;}}
.table-responsive { overflow-x: auto; }