:root{
  --sidebar-w:260px;

  /* Brand — polished teal palette */
  --brand:#069494;
  --brand-2:#14b8b8;               /* lighter, more vibrant hover */
  --brand-3:#22d3d3;               /* light glow */
  --brand-dark:#047878;            /* deeper for gradients */
  --brand-darker:#03595a;          /* darkest for text on brand-soft */
  --brand-soft:#e0f5f5;
  --brand-soft-2:#f0fafa;
  --brand-glow:rgba(6,148,148,.14);
  --brand-glow-strong:rgba(6,148,148,.28);
  --brand-gradient:linear-gradient(135deg, #069494 0%, #047878 100%);
  --brand-gradient-light:linear-gradient(135deg, #14b8b8 0%, #069494 100%);

  /* Surfaces */
  --sidebar-bg:#fbfaf7;            /* cleaner near-white with warm hint */
  --sidebar-border:#ecebe5;
  --content-bg:#f2f6f7;
  --content-bg-2:#f8fafb;
  --card-bg:#ffffff;
  --card-border:rgba(15,23,42,.06);

  /* Ink */
  --ink:#0b1b2b;
  --ink-soft:#334155;
  --ink-mute:#64748b;
  --ink-fade:#94a3b8;

  /* Elevation tokens */
  --shadow-sm:0 1px 2px rgba(15,23,42,.04);
  --shadow-md:0 2px 6px rgba(15,23,42,.05), 0 8px 20px rgba(15,23,42,.06);
  --shadow-lg:0 4px 12px rgba(15,23,42,.06), 0 20px 40px rgba(6,148,148,.10);
  --radius-md:12px;
  --radius-lg:16px;
}
[data-bs-theme="dark"]{
  --sidebar-bg:#0b1220;
  --sidebar-border:#1e2a3d;
  --content-bg:#0b1220;
  --content-bg-2:#111a2b;
  --card-bg:#111a2b;
  --card-border:#1e2a3d;
  --ink:#e6edf6;
  --ink-soft:#c9d3e0;
  --ink-mute:#8a97ab;
  --ink-fade:#5f6d82;
  --brand-soft:rgba(6,148,148,.14);
  --brand-soft-2:rgba(6,148,148,.08);
}

*{ scrollbar-width:thin; }

/* ============ Body: soft teal wash with subtle dot pattern + radial glow ============ */
body{
  background-color:#f2f7f7;
  background-image:
    /* subtle dot pattern instead of dense grid */
    radial-gradient(circle at 1px 1px, rgba(6,148,148,.10) 1px, transparent 0),
    /* soft radial teal glow bleeding in from top-left */
    radial-gradient(900px 500px at 10% -10%, rgba(20,184,184,.14), transparent 60%),
    /* subtle secondary glow bottom-right for balance */
    radial-gradient(700px 400px at 100% 100%, rgba(6,148,148,.08), transparent 65%),
    /* base */
    linear-gradient(180deg, #f4faf9 0%, #eaf3f2 100%);
  background-size: 22px 22px, 100% 100%, 100% 100%, 100% 100%;
  background-attachment: fixed;
  color:var(--ink-soft);
  min-height:100vh;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
  -webkit-font-smoothing: antialiased;
}
[data-bs-theme="dark"] body{
  background-color:#0a1220;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(6,148,148,.12) 1px, transparent 0),
    radial-gradient(1000px 600px at 10% -10%, rgba(6,148,148,.18), transparent 60%),
    linear-gradient(180deg, #0a1220 0%, #0d1826 100%);
  background-size: 22px 22px, 100% 100%, 100% 100%;
  background-attachment: fixed;
}

/* ============ Layout ============ */
.app-shell{ display:flex; min-height:100vh; }

/* ============ Sidebar — panel only (rail hidden) ============ */
:root{
  --rail-w: 0px;
  --panel-w: 260px;
}

.sidebar{
  position:fixed; top:0; bottom:0; left:0;
  display:flex; align-items:stretch; z-index:1030;
  width:var(--panel-w);
  transition:width .25s ease;
}
.sidebar.expanded{ width:var(--panel-w); }

/* ---- Dark rail — hidden ---- */
.sidebar-rail{ display:none; }
.sidebar-toggle{
  position:absolute; top:14px; right:10px;
  width:24px; height:24px; border:0; padding:0;
  background:transparent; color:rgba(255,255,255,.55);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; border-radius:6px;
  font-size:.95rem;
}
.sidebar-toggle:hover{ background:rgba(255,255,255,.08); color:#fff; }

.rail-brand{
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(135deg, #fff 0%, var(--brand-soft) 100%);
  color:var(--brand);
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:.95rem; letter-spacing:.5px;
  margin-bottom:14px;
  box-shadow:0 2px 6px rgba(0,0,0,.15), inset 0 -2px 0 rgba(0,0,0,.05);
  text-decoration:none;
}
.rail-brand:hover{ color:var(--brand); filter:brightness(1.05); }

.rail-nav{
  flex:1 1 auto; display:flex; flex-direction:column; align-items:center; gap:10px;
  padding-top:8px; width:100%; overflow-y:auto; overflow-x:hidden;
}
.rail-nav::-webkit-scrollbar{ width:0; }

.rail-item{
  width:44px; height:44px; border-radius:12px;
  display:inline-flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,.72); text-decoration:none; font-size:1.15rem;
  transition:background .15s ease, color .15s ease, transform .15s ease;
  border:0; background:transparent; cursor:pointer;
  flex-shrink:0;
}
.rail-item:hover{ background:rgba(255,255,255,.08); color:#fff; transform:translateY(-1px); }
.rail-item.active{
  background:var(--brand-gradient); color:#fff;
  box-shadow:0 4px 12px rgba(6,148,148,.55), inset 0 1px 0 rgba(255,255,255,.20);
}
.rail-item.rail-item--super{ color:#fbbf24; }
.rail-item.rail-item--super:hover{ background:rgba(251,191,36,.12); color:#fcd34d; }

.rail-foot{
  padding-top:10px;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  width:100%;
  border-top:1px solid rgba(255,255,255,.08);
  margin-top:8px;
}
.rail-foot .rail-item{ color:rgba(255,180,180,.85); }
.rail-foot .rail-item:hover{ background:rgba(220,38,38,.15); color:#fecaca; }

/* ---- White panel (always visible) ---- */
.sidebar-panel{
  width:var(--panel-w); flex:0 0 var(--panel-w);
  background:var(--sidebar-bg);
  border-radius:0;
  box-shadow:none;
  border-right:1px solid var(--sidebar-border);
  display:flex; flex-direction:column;
  overflow:hidden;
  opacity:1; transform:translateX(0);
  pointer-events:auto;
}

.sidebar-brand{
  font-size:1.2rem; font-weight:800;
  height:52px; padding:0 1.1rem;
  display:flex; align-items:center; gap:.55rem;
  text-decoration:none;
  transition:opacity .15s ease;
  background:var(--brand-gradient);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  letter-spacing:-.01em;
  border-bottom:1px solid var(--sidebar-border);
  flex-shrink:0;
}
.sidebar-brand:hover{ opacity:.85; }
.sidebar-brand i{
  color:var(--brand); font-size:1.4rem;
  -webkit-text-fill-color:var(--brand);
  filter:drop-shadow(0 2px 4px rgba(6,148,148,.35));
}

/* Workspace card */
.workspace-card{
  margin:0 .75rem .5rem; padding:.6rem .7rem;
  background:#fff; border:1px solid var(--sidebar-border); border-radius:10px;
  display:flex; align-items:center; gap:.6rem; font-size:.82rem;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.workspace-card .ws-icon{
  width:26px; height:26px; border-radius:6px;
  background:var(--brand-soft); color:var(--brand);
  display:inline-flex; align-items:center; justify-content:center; font-size:.85rem; flex-shrink:0;
}
.workspace-card .ws-name{ font-weight:700; color:var(--ink); line-height:1.15; font-size:.82rem; }
.workspace-card .ws-sub{ font-size:.72rem; color:var(--brand); font-weight:500; }
.workspace-card .ws-role{
  margin-left:auto; font-size:.66rem;
  background:#f1f5f9; color:#475569;
  padding:.15rem .5rem; border-radius:10px; font-weight:600; flex-shrink:0;
}

.sidebar-search{ padding:0 .75rem .75rem; }
.sidebar-search input{
  width:100%; padding:.5rem .6rem .5rem 2rem; font-size:.85rem;
  border:1px solid var(--sidebar-border); border-radius:9px;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16' fill='%2394a3b8'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E") no-repeat .7rem center;
  color:var(--ink);
}
.sidebar-search input:focus{
  outline:0; border-color:var(--brand);
  box-shadow:0 0 0 3px var(--brand-glow);
}

/* ============ Sidebar nav — one visible pane at a time ============ */
.sidebar-nav{ padding:0; overflow-y:auto; flex:1; }

/* Panes — all visible, pane-head toggles body open/closed */
.panel-pane{ display:flex; flex-direction:column; }
.panel-pane.collapsed .pane-body{ display:none; }

.pane-head{
  padding:.9rem 1.1rem .7rem;
  font-size:.75rem; font-weight:800; text-transform:uppercase;
  letter-spacing:.09em;
  color:var(--brand);
  border-bottom:1px solid var(--sidebar-border);
  background:var(--sidebar-bg);
  display:flex; align-items:center; gap:.5rem;
  cursor:pointer; user-select:none;
}
.pane-head:hover{ background:var(--brand-soft-2); }
.pane-head i{ font-size:.9rem; color:var(--brand); }
.pane-check i{ color:#fff !important; }

/* Dashboard link above panes */
.sidebar-dashboard-link{ padding:.6rem .6rem .3rem; }
.sidebar-dashboard-link .nav-item{ font-weight:600; }
.pane-caret{ transition:transform .2s ease; margin-left:auto; }
.panel-pane.collapsed .pane-caret{ transform:rotate(-90deg); }

.pane-body{ padding:.5rem .6rem 1rem; }

.nav-section{
  border-bottom:1px solid var(--sidebar-border);
}
.nav-section:last-child{ border-bottom:0; }

.section-head{
  display:flex; align-items:center; justify-content:space-between; width:100%;
  padding:.85rem 1.1rem; background:transparent; border:0; cursor:pointer;
  font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em;
  color:var(--ink-mute); text-align:left; transition:color .15s ease, background .15s ease;
}
.section-head:hover{ color:var(--brand); background:rgba(6,148,148,.04); }
.section-head .caret{ font-size:.72rem; transition:transform .2s ease; color:var(--ink-fade); }
.section-head[aria-expanded="true"] .caret{ transform:rotate(90deg); color:var(--brand); }
.section-head[aria-expanded="true"]{ color:var(--brand); }

.section-body{ padding:.15rem .6rem .55rem; }

.nav-section-header{
  display:flex; align-items:center; justify-content:space-between; width:100%;
  padding:1rem 1.1rem .35rem;
  font-size:.68rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.08em; color:var(--ink-fade);
  margin-top:.35rem;
  border-top:1px solid var(--sidebar-border);
  background:transparent; border-left:0; border-right:0; border-bottom:0;
  cursor:pointer; text-align:left;
  transition:color .15s ease, background .15s ease;
}
.nav-section-header:hover{ color:var(--brand); background:rgba(6,148,148,.04); }
.section-caret{ font-size:.65rem; transition:transform .2s ease; color:var(--ink-fade); }
.nav-section-header.collapsed .section-caret{ transform:rotate(-90deg); }
.pane-body > .nav-section-header:first-child{ border-top:0; margin-top:0; padding-top:.5rem; }
.nav-item, .nav-toggle{
  display:flex; align-items:center; gap:.7rem; padding:.5rem .75rem; margin-bottom:2px;
  color:var(--ink-soft); text-decoration:none; border-radius:8px; font-size:.86rem; font-weight:500;
  background:transparent; border:0; width:100%; text-align:left; cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.nav-item > i:first-child, .nav-toggle > i:first-child{
  font-size:1rem; width:18px; text-align:center; color:var(--ink-mute); flex-shrink:0;
}
.nav-item:hover, .nav-toggle:hover{ background:var(--brand-soft); color:var(--brand); }
.nav-item:hover > i:first-child, .nav-toggle:hover > i:first-child{ color:var(--brand); }
.nav-item.active{
  background:var(--brand-gradient); color:#fff;
  box-shadow:0 4px 10px rgba(6,148,148,.32), inset 0 1px 0 rgba(255,255,255,.15);
}
.nav-item.active > i:first-child{ color:#fff; }
.nav-item.active:hover{ background:var(--brand-gradient); color:#fff; }

.nav-toggle .caret{ margin-left:auto; font-size:.75rem; color:var(--ink-fade); transition:transform .2s ease; }
.nav-toggle[aria-expanded="true"] .caret{ transform:rotate(90deg); color:var(--brand); }

/* Sub-menu */
.nav-sub{ padding:.15rem 0 .35rem 2rem; display:flex; flex-direction:column; gap:2px; }
.nav-sub a{
  color:var(--ink-mute); text-decoration:none; font-size:.82rem; padding:.35rem .6rem;
  border-radius:6px; display:flex; align-items:center; gap:.5rem;
  transition:background .15s ease, color .15s ease;
}
.nav-sub a:hover{ background:var(--brand-soft); color:var(--brand); }
.nav-sub a.active{
  background:var(--brand-gradient); color:#fff; font-weight:600;
  box-shadow:0 4px 10px rgba(6,148,148,.32), inset 0 1px 0 rgba(255,255,255,.15);
}
.nav-sub a.active i{ color:#fff; }
.nav-sub a.active:hover{ background:var(--brand-gradient); color:#fff; }

/* Locked / disabled */
.nav-item.locked, .nav-sub a.locked{ color:var(--ink-fade); }
.nav-item.locked:hover, .nav-sub a.locked:hover{ background:transparent; color:var(--ink-fade); cursor:not-allowed; }
.nav-lock{ margin-left:auto; font-size:.7rem; color:var(--ink-fade); }
/* "Soon" badge — the feature is not built yet, so the row is a disabled
   <span>, never an <a href="#"> that navigates nowhere. */
.nav-soon{
  margin-left:auto; font-size:.62rem; font-weight:700;
  letter-spacing:.04em; text-transform:uppercase;
  padding:.1rem .38rem; border-radius:999px;
  background:var(--brand-soft); color:var(--ink-fade);
}
.nav-item.locked{ cursor:not-allowed; user-select:none; }

/* Sidebar footer (user + sign out) */
.sidebar-footer{
  padding:.6rem .75rem; border-top:1px solid var(--sidebar-border); background:var(--sidebar-bg);
}
.user-card{ display:flex; align-items:center; gap:.55rem; padding:.35rem; border-radius:8px; }
.user-card .avatar{ background:var(--brand); }
.user-card .u-name{ font-size:.82rem; font-weight:600; color:var(--ink); line-height:1.1; }
.user-card .u-mail{ font-size:.7rem; color:var(--ink-mute); }
.sidebar-footer .sign-out{
  display:flex; align-items:center; gap:.55rem; padding:.4rem .55rem; margin-top:.35rem;
  font-size:.82rem; color:#dc2626; text-decoration:none; border-radius:6px; font-weight:600;
}
.sidebar-footer .sign-out:hover{ background:#fef2f2; }

/* ============ Main area ============ */
.main{ flex:1 1 auto; margin-left:var(--panel-w); min-width:0;
  display:flex; flex-direction:column;
  transition:margin-left .25s ease; }
.sidebar.expanded ~ .main{
  margin-left:var(--panel-w);
}

/* News ticker */
.news-ticker{
  display:flex; align-items:stretch; overflow:hidden;
  background:var(--card-bg); border-bottom:1px solid var(--card-border);
  font-size:.75rem;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.news-ticker .news-cat{
  padding:.4rem .7rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  color:var(--brand); background:var(--brand-soft); font-size:.68rem;
  display:flex; align-items:center; gap:.3rem; flex-shrink:0;
}
.news-ticker .news-cat.red{ color:#dc2626; background:#fef2f2; }
.news-ticker .news-track{ display:flex; gap:1.25rem; padding:.4rem .8rem; overflow:hidden;
  white-space:nowrap; flex:1; }
.news-ticker .news-track a{
  color:var(--ink-soft); text-decoration:none; font-size:.75rem;
  display:inline-flex; align-items:center; gap:.35rem;
}
.news-ticker .news-track a:hover{ color:var(--brand); }
.news-ticker .news-track .src{ color:var(--ink-fade); font-size:.7rem; }

/* Topbar */
.topbar{
  height:52px; background:var(--card-bg); border-bottom:1px solid var(--card-border);
  display:flex; align-items:center; gap:1rem; padding:0 1.25rem;
  position:sticky; top:0; z-index:1020;
  box-shadow:0 1px 3px rgba(15,23,42,.04);
}
.topbar-org{ font-size:.85rem; color:var(--ink-mute); font-weight:600; }
.topbar-right{ margin-left:auto; display:flex; align-items:center; gap:.5rem; }
.btn-icon{ background:transparent; border:0; font-size:1.15rem; color:var(--ink-mute); }
.btn-icon:hover{ color:var(--brand); }
.user-menu{ display:flex; align-items:center; gap:.5rem; background:transparent; border:0; color:var(--ink-soft); }
.avatar{
  width:32px; height:32px; border-radius:50%;
  background:var(--brand); color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:700; font-size:.85rem;
  box-shadow:0 2px 6px rgba(6,148,148,.35);
}

.content{ padding:1.75rem; flex:1; }
.page-head{ display:flex; align-items:flex-end; justify-content:space-between;
  margin-bottom:1.25rem; gap:1rem; flex-wrap:wrap; }
.page-title{ font-size:1.5rem; font-weight:700; margin:0; color:var(--ink); }
.breadcrumb{ margin:0; font-size:.8rem; }

/* Dashboard welcome header */
.welcome-head h1{ font-size:1.6rem; font-weight:700; margin:0 0 .25rem; color:var(--ink); }
.welcome-head p{ color:var(--ink-mute); margin:0; font-size:.9rem; }

/* ============ 3D-elevated cards ============ */

/* Base card look: crisp white surface with layered "3D box" shadow so cards
   sit noticeably above the grid backdrop */
.overview-card,
.module-card,
.recent-item,
.card{
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:14px;
  box-shadow:
    0 1px 1px  rgba(15,23,42,.04),
    0 2px 4px  rgba(15,23,42,.05),
    0 8px 20px rgba(15,23,42,.06),
    0 16px 40px rgba(6,148,148,.06),
    inset 0 1px 0 rgba(255,255,255,.95);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
[data-bs-theme="dark"] .overview-card,
[data-bs-theme="dark"] .module-card,
[data-bs-theme="dark"] .recent-item,
[data-bs-theme="dark"] .card{
  box-shadow:
    0 1px 2px rgba(0,0,0,.5),
    0 4px 12px rgba(0,0,0,.35),
    0 16px 40px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.03);
}

/* KPI overview cards */
.overview-card{
  padding:1.1rem 1.25rem;
  display:flex; flex-direction:column; gap:.45rem; min-height:110px;
  position:relative; overflow:hidden;
}
.overview-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--brand), var(--brand-2));
  opacity:0; transition:opacity .2s ease;
}
.overview-card:hover::before{ opacity:1; }
.overview-card:hover{
  transform:translateY(-2px);
  box-shadow:
    0 4px 8px rgba(15,23,42,.05),
    0 12px 28px rgba(6,148,148,.12),
    inset 0 1px 0 rgba(255,255,255,.9);
  border-color:var(--brand);
}
.overview-card .ovc-head{
  display:flex; align-items:center; gap:.55rem;
  color:var(--ink-fade); font-size:.7rem; text-transform:uppercase;
  letter-spacing:.06em; font-weight:700;
}
.overview-card .ovc-head i{ font-size:.9rem; color:var(--brand); }
.overview-card .ovc-value{ font-size:1.85rem; font-weight:700; color:var(--ink); line-height:1.1; }

/* Modules head row */
.modules-head{
  display:flex; align-items:center; justify-content:space-between;
  margin:1.75rem 0 .9rem;
}
.modules-head h5{ font-size:1.05rem; font-weight:700; margin:0; color:var(--ink); }
.plan-actions{ display:flex; align-items:center; gap:.5rem; }
.plan-badge{
  font-size:.75rem; color:var(--ink-mute); display:inline-flex; align-items:center; gap:.3rem;
  padding:.3rem .6rem; background:var(--card-bg); border:1px dashed #cbd5e1; border-radius:8px;
}
.btn-upgrade{
  background:linear-gradient(135deg, var(--brand), #6d28d9);
  color:#fff; border:0; padding:.4rem .85rem; border-radius:8px;
  font-size:.78rem; font-weight:600;
  display:inline-flex; align-items:center; gap:.3rem;
  box-shadow:0 4px 10px rgba(109,40,217,.25);
}
.btn-upgrade:hover{ opacity:.95; color:#fff; transform:translateY(-1px); }

/* Module cards — the "3D box" hero */
.module-card{
  padding:1.15rem;
  display:flex; flex-direction:column; gap:.55rem;
  height:100%; text-decoration:none; color:inherit;
  position:relative; overflow:hidden;
}
.module-card:hover{
  border-color:var(--brand);
  transform:translateY(-3px);
  box-shadow:
    0 6px 12px rgba(15,23,42,.05),
    0 16px 32px rgba(6,148,148,.15),
    inset 0 1px 0 rgba(255,255,255,.95);
  color:inherit;
}
.module-card .mc-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem; }
.module-card .mc-icon{
  width:42px; height:42px; border-radius:12px;
  background:var(--brand-gradient);
  color:#fff;
  display:inline-flex; align-items:center; justify-content:center; font-size:1.2rem;
  box-shadow:
    0 4px 10px rgba(6,148,148,.30),
    inset 0 1px 0 rgba(255,255,255,.20);
  transition:transform .2s ease, box-shadow .2s ease;
}
.module-card:hover .mc-icon{
  transform:scale(1.05) rotate(-3deg);
  box-shadow:0 6px 16px rgba(6,148,148,.42), inset 0 1px 0 rgba(255,255,255,.25);
}
.module-card .mc-title{ font-weight:700; color:var(--ink); font-size:.95rem; margin:0; }
.module-card .mc-desc{ font-size:.78rem; color:var(--ink-mute); line-height:1.4; margin:0; flex:1; }
.module-card .mc-tag{
  font-size:.65rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
  padding:.2rem .5rem; border-radius:10px;
}
.mc-tag.compliance{ background:#eef2ff; color:#4f46e5; }
.mc-tag.security  { background:#fef2f2; color:#dc2626; }
.mc-tag.governance{ background:#f0fdf4; color:#15803d; }
.mc-tag.enterprise{ background:#fff7ed; color:#c2410c; }
.mc-tag.reports   { background:#faf5ff; color:#9333ea; }
.module-card .mc-cta{
  margin-top:.25rem; display:flex; align-items:center; justify-content:space-between;
  font-size:.82rem; color:var(--brand); font-weight:600;
}
.module-card:hover .mc-cta i{ transform:translateX(3px); transition:transform .2s ease; }

.module-card.locked{ opacity:.85; }
.module-card.locked:hover{ transform:none; border-color:var(--card-border);
  box-shadow:0 1px 2px rgba(15,23,42,.04), 0 4px 12px rgba(15,23,42,.04); }
.module-card.locked .mc-cta{
  color:var(--ink-mute); justify-content:center;
  padding:.5rem; background:#f8fafc; border-radius:8px;
  border:1px dashed #cbd5e1;
}

/* Recent assessments */
.recent-list{ display:flex; flex-direction:column; gap:.6rem; }
.recent-item{
  padding:.95rem 1.1rem;
  display:flex; align-items:center; justify-content:space-between;
  text-decoration:none; color:var(--ink);
}
.recent-item:hover{
  border-color:var(--brand); color:var(--ink);
  transform:translateX(3px);
  box-shadow:
    0 2px 4px rgba(15,23,42,.04),
    0 8px 20px rgba(6,148,148,.08),
    inset 0 1px 0 rgba(255,255,255,.9);
}
.recent-item .r-name{ font-weight:600; font-size:.9rem; }
.recent-item .r-meta{ font-size:.75rem; color:var(--ink-mute); }
.recent-item > i{ color:var(--brand); font-size:1rem; }

/* ============ Legacy KPI / cards (for other pages) ============ */
.kpi{ padding:1.1rem 1.25rem; }
.kpi .kpi-label{
  font-size:.78rem; text-transform:uppercase; letter-spacing:.05em;
  color:var(--ink-mute); font-weight:600;
}
.kpi .kpi-value{ font-size:1.9rem; font-weight:700; line-height:1.1; color:var(--ink); }
.kpi .kpi-icon{
  width:44px; height:44px; border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center; font-size:1.3rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
.tint-blue{ background:var(--brand-soft); color:var(--brand); }
.tint-red{ background:#fdeaea; color:#dc3545; }
.tint-green{ background:#e6f7ee; color:#198754; }
.tint-amber{ background:#fff5e6; color:#fd7e14; }
[data-bs-theme="dark"] .tint-blue{ background:#0e2b2b; }
[data-bs-theme="dark"] .tint-red{ background:#3a1a1d; }
[data-bs-theme="dark"] .tint-green{ background:#123024; }
[data-bs-theme="dark"] .tint-amber{ background:#3a2a12; }

.gauge-wrap{ position:relative; text-align:center; }
.gauge-value{ position:absolute; top:58%; left:50%; transform:translate(-50%,-50%);
  font-size:1.8rem; font-weight:800; color:var(--ink); }

/* Support widget bubble bottom-right */
.support-bubble{
  position:fixed; right:1.5rem; bottom:1.5rem; width:54px; height:54px;
  border-radius:50%; background:var(--brand-gradient-light);
  color:#fff; border:0;
  display:flex; align-items:center; justify-content:center; font-size:1.4rem;
  box-shadow:
    0 6px 12px rgba(6,148,148,.30),
    0 14px 32px rgba(6,148,148,.40),
    inset 0 1px 0 rgba(255,255,255,.30);
  z-index:1040; cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease;
}
.support-bubble:hover{
  color:#fff; transform:translateY(-3px) scale(1.06);
  box-shadow:
    0 8px 16px rgba(6,148,148,.35),
    0 18px 40px rgba(6,148,148,.50),
    inset 0 1px 0 rgba(255,255,255,.35);
}

/* Auth pages */
.auth-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(1000px 600px at 100% 0%, rgba(20,184,184,.35), transparent 60%),
    radial-gradient(700px 500px at 0% 100%, rgba(3,89,90,.4), transparent 60%),
    linear-gradient(135deg, #03595a 0%, #069494 60%, #14b8b8 100%);
  padding:1.5rem;
}
.auth-card{
  width:100%; max-width:440px; background:#fff; border-radius:20px;
  box-shadow:
    0 24px 60px rgba(0,0,0,.28),
    0 8px 20px rgba(6,148,148,.15),
    inset 0 1px 0 rgba(255,255,255,.9);
  padding:2.5rem;
  backdrop-filter:blur(20px);
}
.auth-brand{
  font-size:1.4rem; font-weight:800; color:var(--ink); margin-bottom:.25rem;
  display:flex; align-items:center; gap:.5rem;
}
.auth-brand i{ color:var(--brand); }

.badge-risk-high{ background:#dc3545; }
.badge-risk-medium{ background:#fd7e14; }
.badge-risk-low{ background:#198754; }

@media (max-width: 991.98px){
  .main{ margin-left:0; }
  .sidebar.expanded ~ .main{ margin-left:0; }
}

/* ============ Webscanner / legacy admin surfaces ============ */
.hero{
  background:linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 60%, #0f172a 100%);
  color:#fff; border-radius:14px; overflow:hidden; position:relative;
  box-shadow:0 8px 24px rgba(6,148,148,.2), inset 0 1px 0 rgba(255,255,255,.15);
}
.hero h3{ color:#fff; font-weight:700; }
.hero .text-white-50{ color:rgba(255,255,255,.75) !important; }
.hero .form-control{ background:rgba(255,255,255,.95); border:0; color:#0f172a; }
.hero .form-control:focus{ box-shadow:0 0 0 .2rem rgba(255,255,255,.35); }
.hero .btn-light{ font-weight:600; }

.stat-label{
  color:var(--ink-mute); font-size:.72rem; font-weight:600;
  text-transform:uppercase; letter-spacing:.05em; margin-bottom:.25rem;
}
.stat{ font-size:1.75rem; font-weight:700; line-height:1.1; color:var(--ink); }
.card canvas{ max-height:180px !important; }

.table-clean{ margin-bottom:0; }
.table-clean thead th{
  background:transparent; border-bottom:2px solid var(--card-border);
  color:var(--ink-mute); font-size:.72rem;
  text-transform:uppercase; letter-spacing:.05em; font-weight:600;
}
.table-clean tbody tr:hover{ background:var(--content-bg-2); }

.score-ring{
  width:110px; height:110px; margin:.5rem auto; border-radius:50%;
  background:conic-gradient(var(--brand) calc(var(--score,0) * 1%), #e2e8f0 0);
  display:flex; align-items:center; justify-content:center;
  position:relative; font-weight:700; font-size:1.75rem; color:var(--brand);
  box-shadow:0 4px 12px rgba(6,148,148,.15);
}
.score-ring::after{
  content:""; position:absolute; inset:10px; border-radius:50%;
  background:var(--card-bg); z-index:0;
}
.score-ring > *{ position:relative; z-index:1; }
.score-ring.no-ring{ background:#e2e8f0; }

.check-pass{ color:#198754; font-size:1.1rem; }
.check-fail{ color:#dc3545; font-size:1.1rem; }
.bi-dash-circle.check-fail{ color:#94a3b8; }

.badge-risk-critical{ background:#b91c1c; color:#fff; }
.badge-risk-minimal { background:var(--brand); color:#fff; }
.badge-risk-unknown { background:#64748b; color:#fff; }
.badge-risk-none    { background:#64748b; color:#fff; }

/* ============ Bootstrap primary override — teal brand ============ */
.btn-primary{
  background:var(--brand-gradient); border-color:var(--brand);
  box-shadow:0 2px 6px rgba(6,148,148,.25), inset 0 1px 0 rgba(255,255,255,.15);
  font-weight:600;
  transition:transform .15s ease, box-shadow .2s ease, filter .15s ease;
}
.btn-primary:hover, .btn-primary:focus{
  background:var(--brand-gradient); border-color:var(--brand-dark);
  box-shadow:0 6px 14px rgba(6,148,148,.35), inset 0 1px 0 rgba(255,255,255,.2);
  filter:brightness(1.05);
  transform:translateY(-1px);
}
.btn-primary:active{ transform:translateY(0); filter:brightness(.95); }
.btn-outline-primary{ color:var(--brand); border-color:var(--brand); font-weight:600; }
.btn-outline-primary:hover{
  background:var(--brand-gradient); border-color:var(--brand); color:#fff;
  box-shadow:0 4px 10px rgba(6,148,148,.25);
}
a{ color:var(--brand); text-decoration:none; }
a:hover{ color:var(--brand-dark); }
.text-primary{ color:var(--brand) !important; }
.bg-primary{ background:var(--brand-gradient) !important; }
.form-control, .form-select{
  border-color:#dfe6e6;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.form-control:focus, .form-select:focus{
  border-color:var(--brand); box-shadow:0 0 0 .22rem var(--brand-glow);
}

/* Selection colour */
::selection{ background:var(--brand-glow-strong); color:var(--brand-darker); }

.homeColor{
  background-color: #856819;
}

/* =========================================================================
   Dashboard UI refresh — brand block, search kbd, pane heads, topbar
   greeting/bell, welcome banner, filter row, KPI sparkline cards,
   colored module tiles, trust banner.
   ========================================================================= */

/* Sidebar brand block */
.sidebar-brand{
  align-items:center;
  -webkit-text-fill-color:initial;
  background:none;
  height:52px; padding:0 1.1rem;
  border-bottom:1px solid var(--sidebar-border);
  flex-shrink:0;
}
.sidebar-brand .brand-badge{
  width:34px; height:34px; border-radius:9px;
  background:var(--brand-gradient); color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1.05rem; flex-shrink:0;
  box-shadow:0 4px 10px rgba(6,148,148,.30);
}
.sidebar-brand .brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.sidebar-brand .brand-name{
  font-size:1.05rem; font-weight:800; color:var(--ink); letter-spacing:-.01em;
}
.sidebar-brand .brand-tag{
  font-size:.68rem; font-weight:600; color:var(--ink-mute); margin-top:.1rem;
}

/* Search bar with Ctrl K hint */
.sidebar-search{ position:relative; }
.sidebar-search .search-kbd{
  position:absolute; right:1.05rem; top:50%; transform:translateY(-50%);
  font-size:.62rem; font-weight:700; letter-spacing:.03em;
  background:#eef3f4; color:var(--ink-mute);
  padding:.15rem .38rem; border-radius:5px;
  border:1px solid var(--sidebar-border);
}

/* Pane-head — green check + label + caret */
.pane-head{
  background:transparent; border-bottom:0;
  color:var(--ink); text-transform:none; letter-spacing:0;
  font-weight:700; font-size:.88rem;
  padding:.85rem 1rem .55rem;
}
.pane-head .pane-check{
  width:22px; height:22px; border-radius:6px;
  background:var(--brand-gradient); color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:.72rem; flex-shrink:0;
  box-shadow:0 2px 4px rgba(6,148,148,.28);
}
.pane-head .pane-label{ flex:1; }
.pane-head .pane-caret{
  font-size:.75rem; color:var(--ink-fade); margin-left:auto;
}

/* Topbar greeting + notification bell */
.btn-bell{ position:relative; }
.btn-bell .bell-dot{
  position:absolute; top:6px; right:6px;
  width:7px; height:7px; border-radius:50%;
  background:#ef4444; border:1.5px solid var(--card-bg);
}
.greeting-menu{ padding:.15rem .5rem .15rem .15rem !important; }
.greeting-menu .greet-block{
  flex-direction:column; align-items:flex-start; line-height:1.15;
  margin-left:.15rem;
}
.greeting-menu .greet-hi{ font-size:.7rem; color:var(--ink-mute); font-weight:500; }
.greeting-menu .greet-name{ font-size:.88rem; color:var(--ink); font-weight:700; }

/* =========== Welcome banner =========== */
.welcome-banner{
  position:relative; overflow:hidden;
  background:linear-gradient(120deg,#d8f0ee 0%, #c1e9e5 55%, #a9dfda 100%);
  border-radius:20px;
  padding:1.75rem 1.75rem;
  display:flex; align-items:center; gap:1.5rem;
  margin-bottom:1.25rem;
  box-shadow:0 4px 18px rgba(6,148,148,.10);
}
.welcome-banner::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,255,255,.35), transparent 40%),
    radial-gradient(circle at 85% 90%, rgba(6,148,148,.18), transparent 45%);
  pointer-events:none;
}
.welcome-banner .wb-copy{ position:relative; flex:1; }
.welcome-banner h1{
  font-size:1.9rem; font-weight:800; margin:0 0 .25rem;
  color:#053f42; letter-spacing:-.01em;
}
.welcome-banner p{ color:#0b5c60; margin:0; font-size:.9rem; }
.welcome-banner .wb-date{
  position:relative; display:flex; align-items:center; gap:.65rem;
  color:#053f42;
}
.welcome-banner .wb-date-icon{
  width:36px; height:36px; border-radius:10px;
  background:rgba(255,255,255,.55); color:var(--brand-dark);
  display:inline-flex; align-items:center; justify-content:center; font-size:1rem;
}
.welcome-banner .wb-day{ font-size:.8rem; font-weight:600; opacity:.75; }
.welcome-banner .wb-full{ font-size:1.05rem; font-weight:700; }

/* =========== Filter row =========== */
.filter-row{
  display:grid;
  grid-template-columns: 1fr 1fr auto;
  gap:1rem; margin-bottom:.35rem;
}
.filter-card{
  background:var(--card-bg); border:1px solid var(--card-border);
  border-radius:12px; padding:.65rem .85rem;
  box-shadow:var(--shadow-sm);
}
.filter-card label{
  display:flex; align-items:center; gap:.4rem;
  font-size:.78rem; color:var(--ink-mute); font-weight:600; margin-bottom:.25rem;
}
.filter-card label i{ color:var(--brand); }
.filter-card select.form-select{
  border:0; padding:0; font-size:.95rem; font-weight:600; color:var(--ink);
  background-position: right .1rem center; box-shadow:none;
}
.filter-card select.form-select:focus{ box-shadow:none; }
.btn-generate{
  display:flex; align-items:center; justify-content:center; gap:.55rem;
  background:linear-gradient(135deg,#0f4b52 0%, #0b3a40 100%);
  color:#fff; font-weight:700; padding:0 1.6rem;
  border-radius:14px; text-decoration:none; font-size:.95rem;
  min-width:200px;
  box-shadow:0 6px 16px rgba(11,58,64,.28);
  transition:transform .15s ease, box-shadow .15s ease;
}
.btn-generate:hover{ color:#fff; transform:translateY(-1px); box-shadow:0 10px 22px rgba(11,58,64,.35); }
.btn-generate i{ font-size:1.1rem; }
.filter-hint{
  font-size:.75rem; color:var(--ink-mute); margin:.5rem .15rem 1.25rem;
}

/* =========== KPI cards with sparkline =========== */
.kpi-row{ margin-bottom:1.25rem; }
.kpi-card{
  background:var(--card-bg); border:1px solid var(--card-border);
  border-radius:16px; padding:1rem 1.1rem;
  box-shadow:var(--shadow-md);
  display:flex; flex-direction:column; gap:.7rem;
  transition:transform .18s ease, box-shadow .18s ease;
}
.kpi-card:hover{ transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.kpi-head{ display:flex; align-items:center; gap:.6rem; }
.kpi-ico{
  width:34px; height:34px; border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1rem; color:#fff;
}
.kpi-label{
  font-size:.72rem; font-weight:700; letter-spacing:.08em;
  color:var(--ink-mute); text-transform:uppercase;
}
.kpi-body{
  display:grid; grid-template-columns: auto auto 1fr; align-items:end; gap:.75rem;
}
.kpi-value{ font-size:1.9rem; font-weight:800; color:var(--ink); line-height:1; }
.kpi-delta{
  font-size:.78rem; font-weight:700; color:#059669;
  display:inline-flex; align-items:center; gap:.15rem; margin-bottom:.25rem;
}
.kpi-spark{ width:100%; height:40px; }

/* Icon color tiles — used by KPI + module cards */
.ico-blue    { background:linear-gradient(135deg,#3b82f6,#2563eb); }
.ico-teal    { background:linear-gradient(135deg,#14b8b8,#069494); }
.ico-purple  { background:linear-gradient(135deg,#a855f7,#7c3aed); }
.ico-green   { background:linear-gradient(135deg,#22c55e,#15803d); }
.ico-orange  { background:linear-gradient(135deg,#fb923c,#ea580c); }
.ico-pink    { background:linear-gradient(135deg,#f472b6,#db2777); }

/* =========== Modules head with view-all =========== */
.modules-head{ margin:1.5rem 0 1rem; }
.modules-head .view-all{
  color:var(--brand); font-size:.85rem; font-weight:600; text-decoration:none;
  display:inline-flex; align-items:center; gap:.35rem;
}
.modules-head .view-all:hover{ color:var(--brand-dark); }
.modules-head .view-all i{ transition:transform .18s ease; }
.modules-head .view-all:hover i{ transform:translateX(3px); }

/* =========== Fresh module card =========== */
.module-card.mc-fresh{
  border-radius:16px; padding:1.1rem 1.15rem;
  min-height:180px;
  gap:.55rem;
}
.module-card.mc-fresh .mc-icon{
  width:44px; height:44px; border-radius:12px;
  color:#fff; font-size:1.2rem;
  background:var(--brand-gradient);
  box-shadow:0 4px 10px rgba(6,148,148,.25);
}
.module-card.mc-fresh:hover .mc-icon{ transform:scale(1.06); }
.module-card.mc-fresh .mc-tag{
  font-size:.68rem; font-weight:700; text-transform:none; letter-spacing:.02em;
  padding:.28rem .7rem; border-radius:999px;
}
.tag-core     { background:#e0f5f5; color:var(--brand-dark); }
.tag-docs     { background:#e0edff; color:#1d4ed8; }
.tag-discovery{ background:#f3e8ff; color:#7c3aed; }
.tag-consent  { background:#dcfce7; color:#166534; }
.tag-rights   { background:#ffedd5; color:#c2410c; }
.tag-public   { background:#fce7f3; color:#be185d; }
.module-card.mc-fresh .mc-cta{
  color:var(--brand); font-weight:700; margin-top:.4rem;
}

/* =========== Trust banner =========== */
.trust-banner{
  margin-top:1.75rem; position:relative; overflow:hidden;
  background:linear-gradient(120deg,#0f4b52 0%, #0b3a40 100%);
  color:#e6f7f6; border-radius:18px;
  padding:1.4rem 1.6rem;
  display:flex; align-items:center; gap:1.5rem;
  box-shadow:0 12px 26px rgba(15,75,82,.28);
}
.trust-banner .tb-copy{ display:flex; align-items:center; gap:1rem; flex:1; }
.trust-banner .tb-badge{
  width:52px; height:52px; border-radius:14px;
  background:rgba(255,255,255,.10); color:#8fe4de;
  display:inline-flex; align-items:center; justify-content:center; font-size:1.4rem;
  flex-shrink:0;
}
.trust-banner h5{ margin:0 0 .15rem; font-size:1.15rem; font-weight:700; color:#fff; }
.trust-banner p{ margin:0; font-size:.85rem; color:#b7dcd9; }
.trust-banner .tb-globe{
  width:120px; height:120px; flex-shrink:0;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.14), transparent 55%),
    radial-gradient(circle, rgba(143,228,222,.28), transparent 62%),
    repeating-linear-gradient(0deg, transparent 0 8px, rgba(143,228,222,.14) 8px 9px),
    repeating-linear-gradient(90deg, transparent 0 8px, rgba(143,228,222,.14) 8px 9px);
  border-radius:50%;
}

/* Responsive tweaks */
@media (max-width: 900px){
  .filter-row{ grid-template-columns: 1fr; }
  .btn-generate{ min-width:0; padding:.75rem 1rem; }
  .welcome-banner{ flex-direction:column; align-items:flex-start; }
  .trust-banner{ flex-direction:column; align-items:flex-start; }
  .trust-banner .tb-globe{ width:80px; height:80px; }
}