/* ── Glass theme for the admin panel ─────────────────────────────────
   The portal's look (portal/public/css/glass.css), mapped onto the admin
   panel's own class names: switched on by <body class="glass"> and scoped
   under .glass, so it outranks the base single-class rules without
   depending on load order.

   A five-colour wash that drifts slowly behind everything, with the
   sidebar, top bar and cards as frosted, partly transparent white.

   Lessons carried over from the portal:
   - the wash sits on fixed ::before/::after layers, not
     background-attachment:fixed, which Chromium repaints badly under
     frosted blur;
   - cards are translucent but not backdrop-blurred (blurring every card
     drops repaints while scrolling). Real blur is kept for the sidebar,
     top bar and dropdowns, where content moves underneath. */

.glass{
  --glass-bg:rgba(255,255,255,.62);
  --glass-bg-strong:rgba(255,255,255,.82);
  --glass-border:rgba(255,255,255,.8);
  --glass-shadow:0 10px 30px rgba(27,58,107,.08),inset 0 1px 0 rgba(255,255,255,.7);
  --glass-blur:blur(16px) saturate(160%);
  background:#D6E2F5;
  font-family:'DM Sans',system-ui,sans-serif;
}
.glass h1,.glass h2,.glass h3,.glass .kpi-val,.glass .stat-tile .v,.glass .tb-title h1{font-family:'Sora',sans-serif}

.glass::before,.glass::after{
  content:"";position:fixed;inset:-18%;z-index:-1;pointer-events:none;will-change:transform;
}
.glass::before{
  background:
    radial-gradient(820px 620px at 12% 8%,rgba(27,99,227,.62),transparent 62%),
    radial-gradient(760px 600px at 52% 50%,rgba(124,92,224,.32),transparent 66%),
    radial-gradient(900px 700px at 90% 94%,rgba(22,184,166,.56),transparent 62%),
    linear-gradient(160deg,#D9E0F2 0%,#E4DDF0 50%,#D8EAE8 100%);
  animation:dgDriftA 52s ease-in-out infinite alternate;
}
.glass::after{
  background:
    radial-gradient(720px 560px at 90% 10%,rgba(236,72,153,.40),transparent 60%),
    radial-gradient(700px 580px at 12% 90%,rgba(245,165,36,.46),transparent 62%);
  animation:dgDriftB 41s ease-in-out infinite alternate;
}
@keyframes dgDriftA{
  0%{transform:translate3d(0,0,0) rotate(0deg) scale(1)}
  35%{transform:translate3d(5%,-3%,0) rotate(4deg) scale(1.04)}
  70%{transform:translate3d(-3%,4%,0) rotate(-3deg) scale(1.02)}
  100%{transform:translate3d(4%,5%,0) rotate(5deg) scale(1.06)}
}
@keyframes dgDriftB{
  0%{transform:translate3d(0,0,0) rotate(0deg)}
  40%{transform:translate3d(-6%,4%,0) rotate(-5deg)}
  75%{transform:translate3d(4%,-5%,0) rotate(3deg)}
  100%{transform:translate3d(-2%,-3%,0) rotate(-2deg)}
}
@media (prefers-reduced-motion: reduce){.glass::before,.glass::after{animation:none}}

/* Shells go transparent so the wash shows through. */
.glass .app,.glass .main,.glass .content{background:transparent}

/* ── Sidebar ─────────────────────────────────────────────────────── */
.glass .sidebar{
  background:rgba(255,255,255,.55);
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  border-right:1px solid var(--glass-border);
  box-shadow:6px 0 30px rgba(27,58,107,.05);
}
.glass .sb-brand{position:relative;border-bottom:0;justify-content:center}
.glass .sb-brand::after{
  content:"";position:absolute;left:8px;right:8px;bottom:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,rgba(12,27,51,0),rgba(12,27,51,.16) 18%,rgba(12,27,51,.16) 82%,rgba(12,27,51,0));
}
/* Menu text and icons solid black; the active item is a brand pill. */
.glass .sb-link:not(.active),.glass .sb-link:not(.active) i,.glass .sb-group-label,.glass .sb-group-label .group-caret{color:#0C1B33}
.glass .sb-link:not(.active):hover{background:rgba(255,255,255,.75)}
.glass .sb-link.active{
  background:linear-gradient(135deg,#1B63E3,#37A4F5);color:#fff;
  box-shadow:0 8px 18px rgba(27,99,227,.28);
}
.glass .sb-link.active::before{display:none}
.glass .sb-link.active i{color:#fff}

/* ── Top bar ─────────────────────────────────────────────────────── */
.glass .topbar{
  background:rgba(255,255,255,.5);
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  border-bottom:1px solid var(--glass-border);
}
/* The website header's centre-weighted shadow: densest below the middle. */
.glass .topbar::after{
  content:"";position:absolute;left:0;right:0;top:100%;height:18px;pointer-events:none;
  background:radial-gradient(60% 100% at 50% 0%,
    rgba(12,27,51,.22) 0%,rgba(12,27,51,.12) 40%,rgba(12,27,51,.04) 72%,rgba(12,27,51,0) 100%);
}
/* Header controls read as controls on the frosted bar. */
.glass .tb-toggle,.glass .tb-icon-btn,.glass .tb-search{background:rgba(255,255,255,.72);border:1px solid #CDD8E8}
.glass .tb-toggle:hover,.glass .tb-icon-btn:hover{background:#fff}
.glass .tb-profile{border:1px solid #CDD8E8;background:rgba(255,255,255,.72)}
.glass .tb-profile:hover{background:#fff}
.glass .tb-profile-av{background:linear-gradient(135deg,#1B63E3,#37A4F5)}
.glass .tb-divider{display:none}
/* Theme switch: moon in light, sun in dark. */
.theme-toggle .theme-ic-light{display:none}
html.theme-dark .theme-toggle .theme-ic-light{display:inline}
html.theme-dark .theme-toggle .theme-ic-dark{display:none}

/* ── Cards, KPI tiles and stat tiles ───────────────────────────── */
.glass .card,.glass .kpi,.glass .stat-tile,.glass .fac-card,.glass .q-doc-card{
  background:var(--glass-bg);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow);
}
.glass .card:hover,.glass .kpi:hover{box-shadow:0 16px 38px rgba(27,58,107,.12),inset 0 1px 0 rgba(255,255,255,.7)}
.glass .card-h{border-color:rgba(12,27,51,.08)}

/* KPI icons: the pale inline tints become solid gradient tiles with white
   glyphs, mapped from each tint so every tile keeps its own colour. */
.glass .kpi-ic{box-shadow:0 8px 18px rgba(27,58,107,.16);background:linear-gradient(135deg,#1B63E3,#37A4F5)!important}
.glass .kpi-ic i{color:#fff!important}
.glass .kpi-ic[style*="accent-50"],.glass .kpi-ic[style*="green"]{background:linear-gradient(135deg,#16B8A6,#0FA89A)!important}
.glass .kpi-ic[style*="amber-50"],.glass .kpi-ic[style*="FEECC7"],.glass .kpi-ic[style*="FBF1DF"]{background:linear-gradient(135deg,#F5A524,#E08A00)!important}
.glass .kpi-ic[style*="red-50"]{background:linear-gradient(135deg,#EF5466,#F76C5E)!important}
.glass .kpi-ic[style*="purple-50"]{background:linear-gradient(135deg,#7C5CE0,#9B7CF0)!important}

/* ── Menus and popovers stand clear of the glass ──────────────────── */
.glass .bell-panel,.glass .profile-dropdown{
  background:rgba(255,255,255,.97) !important;
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  border:1px solid rgba(12,27,51,.10) !important;
  box-shadow:0 2px 6px rgba(12,27,51,.08),0 24px 56px rgba(12,27,51,.22) !important;
}
.glass .modal-box{background:rgba(255,255,255,.97);box-shadow:0 2px 6px rgba(12,27,51,.08),0 24px 56px rgba(12,27,51,.22)}

/* ── Standard controls: the portal's button scale ─────────────────── */
.glass .btn{min-height:40px;padding:0 18px;font-size:13.5px;font-weight:600;gap:7px;line-height:1.2;justify-content:center}
.glass .btn i{font-size:17px}
.glass .btn-sm{min-height:34px;padding:0 13px;font-size:13px}
.glass .btn-sm i{font-size:15px}
.glass .btn-primary{background:linear-gradient(135deg,#1B63E3,#2F7CF0);box-shadow:0 6px 16px rgba(27,99,227,.25)}
.glass .btn-primary:hover{background:linear-gradient(135deg,#1450BF,#1B63E3)}
.glass .btn-ghost{background:rgba(255,255,255,.85);border-color:#CBD5E1}
.glass .btn-ghost:hover{background:#fff;border-color:#1B63E3;color:#1B63E3}
.glass .f-input{border-color:#CBD5E1;background:#fff}
.glass .seg{background:#fff;border-color:#CBD5E1;box-shadow:0 2px 8px rgba(12,27,51,.05)}
.glass .seg button:not(.active),.glass .seg a:not(.active){color:#0C1B33}
.glass .seg button.active,.glass .seg a.active{background:linear-gradient(135deg,#1B63E3,#37A4F5)}
.glass .chip{border:1.5px solid #CBD5E1;background:#fff;color:#0C1B33}
.glass .chip.on{background:#1B63E3;border-color:#1B63E3;color:#fff}

/* ── One table style (as in the portal): white rows, grey rules ───── */
@media (min-width: 641px) {
  .glass .content table:not(.grid):not([role=presentation]){border-collapse:collapse}
  .glass .content table:not(.grid):not([role=presentation]) > thead th{background:transparent;border:0;border-bottom:1px solid #C3CEDD;color:#0C1B33}
  .glass .content table:not(.grid):not([role=presentation]) > tbody > tr > td{background:#fff;border:0;border-bottom:1px solid #C3CEDD}
  .glass .content table:not(.grid):not([role=presentation]) > tbody > tr:last-child > td{border-bottom:0}
}
.glass table tbody tr{transition:background-color .12s}
.glass table tbody tr:hover > td{background-color:#EEF4FE !important}

/* ── Status badges and tags: a real border and deeper text ────────── */
.glass .badge,.glass .tag{border:1.5px solid transparent}
.glass .b-green,.glass .t-green{color:#0B7A55;background:#E3F6EE;border-color:#8FD3B6}
.glass .b-red{color:#B42318;background:#FDE8E8;border-color:#F0A3A3}
.glass .b-amber,.glass .t-amber{color:#8F5B0A;background:#FCF1DC;border-color:#EDC77A}
.glass .b-blue,.glass .t-blue{color:#1450BF;background:#E7EFFD;border-color:#A9C6F5}
.glass .b-purple,.glass .t-purple{color:#5B3FC4;background:#EFEAFD;border-color:#C4B5F5}
.glass .t-gray{color:#0C1B33;background:#F1F4F9;border-color:#CBD5E1}

/* The wash as one still image, for anything that covers the page. */
:root{--dg-wash:
  radial-gradient(820px 620px at -8% -12%,rgba(27,99,227,.62),transparent 62%),
  radial-gradient(720px 560px at 108% -6%,rgba(236,72,153,.40),transparent 60%),
  radial-gradient(760px 600px at 50% 46%,rgba(124,92,224,.32),transparent 66%),
  radial-gradient(700px 580px at 4% 104%,rgba(245,165,36,.46),transparent 62%),
  radial-gradient(900px 700px at 98% 106%,rgba(22,184,166,.56),transparent 62%),
  linear-gradient(160deg,#D9E0F2 0%,#E4DDF0 50%,#D8EAE8 100%)}

/* Off-canvas sidebar on smaller screens sits over content: more body. */
@media(max-width:1024px){.glass .sidebar{background:rgba(255,255,255,.92)}}

/* Trend chips on KPI tiles: bordered, like the status badges. */
.glass .kpi-trend{border:1.5px solid transparent}
.glass .kpi-trend.trend-up{color:#0B7A55;background:#E3F6EE;border-color:#8FD3B6}
.glass .kpi-trend.trend-dn{color:#B42318;background:#FDE8E8;border-color:#F0A3A3}