*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --forest:#015441;--forest-2:#017a5e;--forest-3:#01a878;--forest-pale:rgba(1,84,65,0.06);--forest-pale2:rgba(1,84,65,0.1);
  --bg:#f0f2f5;--card:#fff;--border:rgba(0,0,0,0.07);--border2:#e2e8f0;
  --charcoal:#0f172a;--slate:#334155;--mid:#64748b;
  --red:#dc2626;--red-pale:rgba(220,38,38,0.08);
  --amber:#d97706;--amber-pale:rgba(217,119,6,0.08);
  --green:#059669;--green-pale:rgba(5,150,105,0.08);
  --sidebar-w:224px;--sidebar-w-collapsed:64px;
}
html{font-size:13px;}
html{scroll-behavior:smooth;}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--charcoal);min-height:100vh;-webkit-font-smoothing:antialiased;display:flex;}

/* ── SIDEBAR — enterprise 3-zone layout ───────────────────────── */
.sidebar{
  width:var(--sidebar-w);
  height:100vh;
  background:linear-gradient(180deg,#014736 0%, #015441 100%);
  display:flex;
  flex-direction:column;
  position:fixed;
  top:0;
  left:0;
  z-index:100;
  box-shadow:2px 0 18px rgba(0,0,0,0.16);
  transition:width 250ms ease;
  overflow:hidden;
}

.sidebar-top{
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  padding-top:10px;
}

/* Zone 1: fixed top */
.sidebar-brand{
  flex-shrink:0;
  padding:0 0 10px;
  border-bottom:1px solid rgba(255,255,255,0.08);
  background:rgba(0,0,0,0.05);
}

.brand-logo{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 18px 8px;
  min-width:0;
}

.brand-copy{
  min-width:0;
}

.brand-logo svg{
  width:30px;
  height:30px;
  flex-shrink:0;
}

.brand-name{
  font-size:1rem;
  font-weight:700;
  color:#fff;
  letter-spacing:-0.02em;
  white-space:nowrap;
  transition:opacity 200ms ease;
  line-height:1.15;
}

.brand-tagline{
  font-size:.62rem;
  color:rgba(255,255,255,0.48);
  margin-top:2px;
  letter-spacing:.10em;
  text-transform:uppercase;
  white-space:nowrap;
  transition:opacity 200ms ease;
}

.sidebar-data-strip{
  margin:8px 18px 0;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:10px;
  background:rgba(255,255,255,0.05);
}

.sidebar-data-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.sidebar-data-row + .sidebar-data-row{
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,0.06);
}

.sidebar-data-label{
  font-size:.62rem;
  font-weight:600;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.42);
}

.sidebar-data-val{
  font-size:.8rem;
  font-weight:700;
  color:rgba(255,255,255,0.9);
}

.sidebar-data-val.live{
  color:#8ff0c7;
}

.sidebar-api-status{
  display:flex;
  align-items:center;
  gap:6px;
}

.proxy-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#4a5568;
  flex-shrink:0;
}

.proxy-dot.live{
  background:var(--forest-3);
  animation:blink 2s infinite;
}

@keyframes blink{
  0%,100%{opacity:1;}
  50%{opacity:.4;}
}

/* Zone 2: scrollable nav only */
.sidebar-nav{
  flex:1 1 0;
  min-height:0;
  padding:8px 0 24px;
  overflow-y:scroll;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,0.24) rgba(255,255,255,0.05);
}

.sidebar-nav::-webkit-scrollbar{
  width:8px;
}

.sidebar-nav::-webkit-scrollbar-track{
  background:rgba(255,255,255,0.05);
}

.sidebar-nav::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,0.24);
  border-radius:999px;
}

.sidebar-nav::-webkit-scrollbar-thumb:hover{
  background:rgba(255,255,255,0.36);
}

.nav-section-label{
  font-size:.52rem;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.30);
  padding:16px 18px 6px;
  margin:0;
  white-space:nowrap;
  transition:opacity 200ms ease,height 250ms ease,padding 250ms ease,margin 250ms ease;
  overflow:hidden;
}

.nav-item{
  display:flex;
  align-items:center;
  gap:9px;
  padding:8px 18px;
  border-radius:0;
  font-size:.76rem;
  font-weight:500;
  color:rgba(255,255,255,0.56);
  cursor:pointer;
  border:none;
  background:none;
  width:100%;
  text-align:left;
  font-family:'Inter',sans-serif;
  transition:background .14s ease,color .14s ease,padding 250ms ease,justify-content 250ms ease;
  position:relative;
  white-space:nowrap;
  overflow:hidden;
}

.nav-item:hover{
  background:rgba(255,255,255,0.06);
  color:rgba(255,255,255,0.88);
}

.nav-item.active{
  background:linear-gradient(90deg,rgba(0,196,113,0.20) 0%, rgba(0,196,113,0.08) 100%);
  color:#7ff0b8;
  font-weight:600;
  border-left:3px solid #00c471;
  padding-left:15px;
}

.nav-item.active::before{
  display:none;
}

.nav-item.soon{
  opacity:.4;
  cursor:not-allowed;
  pointer-events:none;
}

.nav-soon-badge{
  font-size:.5rem;
  font-weight:700;
  letter-spacing:.08em;
  background:rgba(255,255,255,0.08);
  color:rgba(255,255,255,0.34);
  padding:2px 7px;
  border-radius:999px;
  text-transform:uppercase;
  margin-left:auto;
  flex-shrink:0;
  white-space:nowrap;
  border:none;
}

.nav-item svg{
  flex-shrink:0;
  opacity:.48;
}

.nav-item.active svg{
  opacity:1;
}

.nav-item:hover svg{
  opacity:.78;
}

.nav-label{
  white-space:nowrap;
  transition:opacity 200ms ease;
}

/* Zone 3: fixed bottom */
.sidebar-footer{
  flex:0 0 auto;
  margin-top:auto;
  padding:12px 18px 14px;
  border-top:1px solid rgba(255,255,255,0.08);
  background:rgba(0,0,0,0.08);
}


.sidebar-version{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-size:.58rem;
  color:rgba(255,255,255,0.22);
  font-weight:500;
}

.sidebar-version-meta{
  font-size:.55rem;
  color:rgba(255,255,255,0.18);
  letter-spacing:.04em;
}

/* ── SIDEBAR TOGGLE BUTTON ───────────────────── */
.sidebar-toggle-btn{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:4px;
  width:36px;
  height:36px;
  padding:8px;
  background:none;
  border:none;
  cursor:pointer;
  border-radius:8px;
  flex-shrink:0;
  transition:background .15s;
  margin:0 0 8px 14px;
}

.sidebar-toggle-btn:hover{
  background:rgba(255,255,255,0.08);
}

.sidebar-toggle-btn span{
  display:block;
  width:18px;
  height:2px;
  background:#00c471;
  border-radius:2px;
  transition:background .15s;
}

.sidebar-toggle-btn:hover span{
  background:#00c471;
}

/* ── SIDEBAR COLLAPSED STATE ── */
.sidebar.collapsed{
  width:var(--sidebar-w-collapsed);
}

.sidebar.collapsed .sidebar-top{
  padding-top:10px;
}

.sidebar.collapsed .sidebar-brand{
  padding:0 0 10px;
  display:flex;
  justify-content:center;
  align-items:center;
}

.sidebar.collapsed .brand-logo{
  justify-content:center;
  gap:0;
  padding-left:0;
  padding-right:0;
}

.sidebar.collapsed .brand-copy,
.sidebar.collapsed .brand-name,
.sidebar.collapsed .brand-tagline{
  opacity:0;
  width:0;
  overflow:hidden;
  margin:0;
}

.sidebar.collapsed .sidebar-data-strip{
  opacity:0;
  height:0;
  overflow:hidden;
  padding:0;
  margin:0;
  border:none;
  transition:opacity 150ms ease,height 250ms ease;
}

.sidebar.collapsed .nav-section-label{
  opacity:0;
  height:0;
  padding:0;
  margin:0;
}

.sidebar.collapsed .nav-item{
  justify-content:center;
  /* Left padding compensates for the scrollbar gutter `.sidebar-nav`
     reserves on the right (scrollbar-gutter:stable + overflow-y:scroll).
     Tuned by eye against the 30x30 brand-logo svg at the top of the
     sidebar — pure-math 8px gets close but visual centring of the
     smaller 15x15 nav icons against the bigger brand icon needs more.
     20px lands them in the same vertical column. */
  padding:11px 0 11px 20px;
}

.sidebar.collapsed .nav-item.active{
  padding-left:20px;
  border-left:none;
  box-shadow:inset 3px 0 0 #00c471;
}

.sidebar.collapsed .nav-label{
  opacity:0;
  width:0;
  overflow:hidden;
}

.sidebar.collapsed .nav-soon-badge{
  display:none;
}

.sidebar.collapsed .sar-nav-badge{
  display:none !important;
}

.sidebar.collapsed .sidebar-footer{
  padding:12px 0 14px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
}

.sidebar.collapsed .sidebar-version{
  display:none !important;
}

.sidebar.collapsed .sidebar-footer{
  padding:12px 0 14px;
  display:flex;
  flex-direction:column;
  align-items:center;
}

/* ── MAIN CONTENT ── */
.main{margin-left:var(--sidebar-w);flex:1;min-height:100vh;display:flex;flex-direction:column;transition:margin-left 250ms ease;}
.main.sidebar-collapsed{margin-left:var(--sidebar-w-collapsed);}

/* ── TOP BAR ── */
.topbar{height:56px;background:#fff;border-bottom:1px solid var(--border2);display:flex;align-items:center;justify-content:space-between;padding:0 32px;position:sticky;top:0;z-index:90;box-shadow:0 1px 4px rgba(0,0,0,0.06);}
.topbar-title{font-size:.95rem;font-weight:700;color:var(--charcoal);letter-spacing:-.02em;}
.topbar-breadcrumb{font-size:.72rem;color:var(--mid);margin-top:1px;font-weight:400;}
.topbar-right{display:flex;align-items:center;gap:10px;}
.topbar-user{display:flex;align-items:center;gap:10px;}
.topbar-avatar{width:32px;height:32px;border-radius:50%;background:var(--forest);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.62rem;font-weight:700;letter-spacing:.03em;flex-shrink:0;cursor:pointer;border:none;padding:0;font-family:'Inter',sans-serif;outline:none;transition:box-shadow .15s ease, transform .12s ease;}
.topbar-avatar:hover{box-shadow:0 0 0 3px rgba(1,84,65,0.16);}
.topbar-avatar:focus-visible{box-shadow:0 0 0 3px rgba(1,84,65,0.32);}
.topbar-avatar[aria-expanded="true"]{box-shadow:0 0 0 3px rgba(1,84,65,0.22);}

/* ── PAGE CONTENT ── */
.page-content{padding:20px 24px;flex:1;}
.tab-panel{display:none;}
.tab-panel.active{display:block;}

/* ── PLACEHOLDER PANELS ── */
.placeholder-panel{background:var(--card);border:1px solid var(--border2);border-radius:14px;padding:60px 40px;text-align:center;}
.placeholder-panel h2{font-size:1rem;font-weight:700;color:var(--charcoal);margin-bottom:8px;}
.placeholder-panel p{font-size:.8rem;color:var(--mid);}
.ph-badge{display:inline-flex;align-items:center;gap:6px;background:var(--forest-pale);color:var(--forest);font-size:.7rem;font-weight:700;padding:5px 12px;border-radius:100px;margin-bottom:16px;letter-spacing:.04em;}

/* ── MODAL ── */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:200;align-items:flex-start;justify-content:center;padding:40px 20px;overflow-y:auto;}
.modal-overlay.open{display:flex;}
.modal{background:var(--card);border-radius:10px;width:100%;max-width:640px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,0.2);}
.modal-header{padding:16px 22px;border-bottom:1px solid var(--border2);display:flex;align-items:center;justify-content:space-between;background:var(--forest);}
.modal-title{font-size:.92rem;font-weight:700;color:#fff;}
.modal-close{background:rgba(255,255,255,0.15);border:none;cursor:pointer;color:#fff;font-size:1rem;line-height:1;padding:4px 9px;border-radius:6px;transition:background .13s;}
.modal-close:hover{background:rgba(255,255,255,0.25);}
.modal-body{padding:0;max-height:80vh;overflow-y:auto;}
.modal-block{padding:18px 22px;border-bottom:1px solid var(--border2);}
.modal-block:last-child{border-bottom:none;}
.modal-block-title{font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--forest);margin-bottom:10px;}
.detail-grid{display:grid;grid-template-columns:150px 1fr;gap:0;}
.dg-row{display:contents;}
.dg-k{font-size:.7rem;color:var(--mid);font-weight:500;padding:5px 0;border-bottom:1px solid rgba(0,0,0,0.04);}
.dg-v{font-size:.76rem;color:var(--charcoal);padding:5px 0;border-bottom:1px solid rgba(0,0,0,0.04);font-weight:500;}
.dg-v.mono{font-family:'DM Mono',monospace;font-size:.68rem;}
.dg-v.green{color:var(--green);font-weight:700;}
.psc-item{background:var(--bg);border-radius:7px;padding:10px 12px;margin-bottom:6px;}
.psc-item:last-child{margin-bottom:0;}
.psc-name{font-size:.78rem;font-weight:600;color:var(--charcoal);}
.psc-meta{font-size:.68rem;color:var(--mid);margin-top:2px;}
.psc-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px;}
.psc-tag{font-size:.58rem;background:var(--forest-pale);color:var(--forest);padding:2px 6px;border-radius:100px;font-weight:600;}
.accounts-list{display:flex;flex-direction:column;gap:5px;}
.account-row{display:flex;align-items:center;justify-content:space-between;background:var(--bg);border-radius:7px;padding:9px 12px;}
.account-date{font-size:.8rem;font-weight:700;color:var(--charcoal);}
.account-desc{font-size:.66rem;color:var(--mid);margin-top:2px;}
.pdf-btn{display:flex;align-items:center;gap:5px;font-size:.7rem;font-weight:600;color:var(--forest);background:#fff;border:1.5px solid var(--border2);padding:5px 12px;border-radius:7px;text-decoration:none;white-space:nowrap;transition:all .13s;}
.pdf-btn:hover{background:var(--forest);color:#fff;border-color:var(--forest);}
.no-pdf{font-size:.66rem;color:var(--mid);}
.ai-summary-block{background:linear-gradient(135deg,rgba(1,84,65,0.05) 0%,rgba(1,168,120,0.09) 100%);border-left:3px solid var(--forest-3);}
.ai-summary-label{font-size:.58rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--forest);margin-bottom:10px;display:flex;align-items:center;gap:6px;}
.ai-summary-label svg{flex-shrink:0;color:var(--forest-3);}
.ai-summary-text{font-size:.8rem;color:var(--charcoal);line-height:1.72;font-weight:400;}
.ai-summary-loading{display:flex;align-items:center;gap:8px;font-size:.76rem;color:var(--mid);}
.ai-summary-error{font-size:.73rem;color:var(--slate);font-style:italic;}

/* Login styles moved to login.css */



/* ── DASHBOARD ── */
.dash-wrap{padding:0;display:flex;flex-direction:column;gap:20px;}
.dash-hero{background:linear-gradient(135deg,var(--forest) 0%,#0a6b4f 60%,#1a8a68 100%);border-radius:14px;padding:28px 32px;display:flex;align-items:flex-start;justify-content:space-between;gap:24px;position:relative;overflow:hidden;}
.dash-hero::before{content:'';position:absolute;top:-40px;right:-40px;width:220px;height:220px;background:rgba(255,255,255,0.04);border-radius:50%;}
.dash-hero::after{content:'';position:absolute;bottom:-60px;right:80px;width:160px;height:160px;background:rgba(255,255,255,0.03);border-radius:50%;}
.dash-hero-left{position:relative;z-index:1;}
.dash-hero-greeting{font-size:.72rem;font-weight:600;color:rgba(255,255,255,0.5);letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px;}
.dash-hero-title{font-size:1.55rem;font-weight:800;color:#fff;letter-spacing:-.03em;line-height:1.2;margin-bottom:10px;}
.dash-hero-sub{font-size:.82rem;color:rgba(255,255,255,0.6);font-weight:400;max-width:380px;line-height:1.5;}
.dash-hero-right{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-end;gap:10px;}
.dash-live-pill{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.15);border-radius:100px;padding:6px 14px;font-size:.72rem;font-weight:600;color:rgba(255,255,255,0.85);}
.dash-live-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 8px #4ade80;animation:livepulse 1.8s ease-in-out infinite;}
@keyframes livepulse{0%,100%{opacity:1;box-shadow:0 0 8px #4ade80;}50%{opacity:.5;box-shadow:0 0 16px #4ade80;}}
.dash-last-sync{font-size:.65rem;color:rgba(255,255,255,0.35);font-weight:500;}

.dash-kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.dash-kpi{background:#fff;border:1px solid var(--border2);border-radius:12px;padding:20px 22px;position:relative;overflow:hidden;transition:box-shadow .18s,transform .18s;}
.dash-kpi:hover{box-shadow:0 4px 20px rgba(0,0,0,0.09);transform:translateY(-1px);}
.dash-kpi-label{font-size:.65rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mid);margin-bottom:10px;display:flex;align-items:center;gap:6px;}
.dash-kpi-val{font-size:2rem;font-weight:800;color:var(--charcoal);letter-spacing:-.04em;line-height:1;margin-bottom:4px;transition:color .3s;}
.dash-kpi-delta{font-size:.7rem;font-weight:600;color:var(--mid);}
.dash-kpi-delta.up{color:#059669;}
.dash-kpi-delta.down{color:#dc2626;}
.dash-kpi-bar{position:absolute;bottom:0;left:0;right:0;height:3px;border-radius:0 0 12px 12px;}
.dash-kpi-bar.green{background:linear-gradient(90deg,#059669,#34d399);}
.dash-kpi-bar.amber{background:linear-gradient(90deg,#d97706,#fbbf24);}
.dash-kpi-bar.red{background:linear-gradient(90deg,#dc2626,#f87171);}
.dash-kpi-bar.blue{background:linear-gradient(90deg,#2563eb,#60a5fa);}

.dash-mid-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;}
.dash-card{background:#fff;border:1px solid var(--border2);border-radius:12px;padding:20px 22px;}
.dash-card-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.dash-card-title{font-size:.78rem;font-weight:700;color:var(--charcoal);letter-spacing:-.01em;}
.dash-card-badge{font-size:.6rem;font-weight:700;padding:3px 8px;border-radius:100px;letter-spacing:.04em;text-transform:uppercase;}
.dash-card-badge.live{background:rgba(74,222,128,0.15);color:#059669;}
.dash-card-badge.ai{background:rgba(37,99,235,0.1);color:#2563eb;}

.dash-rag-row{display:flex;align-items:center;justify-content:space-around;padding:8px 0;}
.dash-rag-item{display:flex;flex-direction:column;align-items:center;gap:6px;}
.dash-rag-circle{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.3rem;font-weight:800;position:relative;}
.dash-rag-circle.green{background:rgba(5,150,105,0.1);color:#059669;border:2px solid rgba(5,150,105,0.2);}
.dash-rag-circle.amber{background:rgba(217,119,6,0.1);color:#d97706;border:2px solid rgba(217,119,6,0.2);}
.dash-rag-circle.red{background:rgba(220,38,38,0.1);color:#dc2626;border:2px solid rgba(220,38,38,0.2);}
.dash-rag-lbl{font-size:.62rem;font-weight:600;color:var(--mid);text-transform:uppercase;letter-spacing:.05em;}

.dash-period-tabs{display:flex;gap:4px;background:#f1f5f9;border-radius:8px;padding:3px;}
.dash-period-tab{font-size:.65rem;font-weight:600;padding:4px 10px;border-radius:6px;border:none;background:transparent;color:var(--mid);cursor:pointer;transition:all .15s;font-family:'Inter',sans-serif;}
.dash-period-tab.active{background:#fff;color:var(--charcoal);box-shadow:0 1px 4px rgba(0,0,0,0.1);}

.dash-activity{display:flex;flex-direction:column;gap:0;}
.dash-act-item{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);position:relative;}
.dash-act-item:last-child{border-bottom:none;}
.dash-act-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:4px;}
.dash-act-dot.green{background:#059669;}
.dash-act-dot.amber{background:#d97706;}
.dash-act-dot.red{background:#dc2626;}
.dash-act-dot.blue{background:#2563eb;}
.dash-act-dot.pulse{animation:actpulse 2s ease-in-out infinite;}
@keyframes actpulse{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.6);opacity:.6;}}
.dash-act-body{flex:1;min-width:0;}
.dash-act-name{font-size:.78rem;font-weight:600;color:var(--charcoal);}
.dash-act-detail{font-size:.7rem;color:var(--mid);margin-top:1px;}
.dash-act-time{font-size:.62rem;color:var(--mid);white-space:nowrap;flex-shrink:0;margin-top:3px;}

/* Live Sanctions Feed — continuous vertical scroll. The viewport clips
   the track; the track translates upward at a constant rate and loops
   seamlessly because its rows are rendered twice (translateY 0 → -50%
   wraps to the start of the second copy without a visible jump).
   Pause on hover so a compliance user can read a passing designation
   without having to chase it. */
.dash-sanctions-feed-viewport{position:relative;max-height:280px;overflow:hidden;}
.dash-sanctions-feed-track{display:flex;flex-direction:column;gap:0;animation:dash-sanctions-scroll 30s linear infinite;will-change:transform;}
.dash-sanctions-feed-viewport:hover .dash-sanctions-feed-track{animation-play-state:paused;}
@keyframes dash-sanctions-scroll{from{transform:translateY(0);}to{transform:translateY(-50%);}}
/* Row layout. Horizontal padding (8px) gives the spotlight card box
   breathing room from the feed container edges; non-highlighted rows
   inherit the same indent so the row content alignment is consistent. */
.dash-sanction-item{display:flex;align-items:flex-start;gap:10px;padding:9px 8px;border-bottom:1px solid var(--border);position:relative;border-radius:8px;background-color:transparent;box-shadow:inset 0 0 0 2px rgba(1,168,120,0),0 2px 8px rgba(1,168,120,0);transition:background-color .5s ease,box-shadow .5s ease,border-bottom-color .5s ease;}
.dash-sanction-item:last-child{border-bottom:none;}
/* Spotlight: the row currently at the top of the visible viewport
   gets a card box around it. Border uses --forest-2 (#017a5e) —
   noticeably darker than --forest-3 to make the spotlight read
   clearly without dropping into the deep --forest. Rendered via
   inset box-shadow (no layout cost) so row height never changes when
   the class toggles — critical for the seamless scroll loop. */
.dash-sanction-item.sanctions-entry--latest{background-color:var(--forest-pale);box-shadow:inset 0 0 0 2px var(--forest-2),0 2px 8px rgba(1,122,94,0.22);border-bottom-color:transparent;}
.dash-sanction-flag{font-size:.95rem;flex-shrink:0;width:22px;text-align:center;}
.dash-sanction-body{flex:1;min-width:0;}
.dash-sanction-name{font-size:.75rem;font-weight:700;color:var(--charcoal);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dash-sanction-detail{font-size:.66rem;color:var(--slate);font-weight:500;margin-top:1px;}
.dash-sanction-badge{font-size:.55rem;font-weight:700;padding:2px 7px;border-radius:100px;text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;align-self:flex-start;margin-top:2px;}
.dash-sanction-badge.new{background:#fef2f2;color:#dc2626;border:1px solid rgba(220,38,38,0.2);}
.dash-sanction-badge.updated{background:#fffbeb;color:#d97706;border:1px solid rgba(217,119,6,0.2);}
.dash-sanction-badge.removed{background:#f0fdf4;color:#059669;border:1px solid rgba(5,150,105,0.2);}
/* Change-event badges are rendered as anchors so a click opens the
   gov.uk source — keep the status colour but strip default link
   chrome and add a subtle hover lift. */
a.dash-sanction-badge{text-decoration:none;cursor:pointer;transition:filter .15s ease,box-shadow .15s ease;}
a.dash-sanction-badge:hover{filter:brightness(0.96);box-shadow:0 1px 3px rgba(0,0,0,0.08);}
/* "View source" button on LISTED rows. Replaces the old "View on
   gov.uk →" link that lived inside the detail text. Subtle outlined
   button — readable, clearly clickable, no decorative arrow. */
.dash-sanction-source-btn{display:inline-flex;align-items:center;font-size:.6rem;font-weight:600;color:var(--slate);background:#fff;border:1px solid #cbd5e1;border-radius:6px;padding:4px 10px;text-decoration:none;white-space:nowrap;flex-shrink:0;align-self:flex-start;margin-top:1px;transition:background .15s ease,border-color .15s ease,color .15s ease;}
.dash-sanction-source-btn:hover{background:#f1f5f9;border-color:var(--forest-2);color:var(--forest);}
/* Header right cluster (count indicator + pulsing UPDATING pill). */
.dash-sanctions-hdr-right{display:flex;align-items:center;gap:10px;}
.dash-sanctions-count{font-size:.62rem;font-weight:600;color:var(--mid);letter-spacing:.02em;font-variant-numeric:tabular-nums;white-space:nowrap;}
/* UPDATED pill is a <button> (opens the diff popover) so we strip
   default browser button chrome and inherit the pill look from the
   existing .dash-sanction-badge.updated rule. The cursor and the
   subtle hover lift signal click-through. */
.dash-sanction-badge--clickable{font-family:inherit;cursor:pointer;transition:filter .15s ease,box-shadow .15s ease;}
.dash-sanction-badge--clickable:hover{filter:brightness(0.96);box-shadow:0 1px 3px rgba(0,0,0,0.08);}
.dash-sanction-badge--clickable:focus-visible{outline:2px solid var(--forest-2);outline-offset:2px;}

/* Pause the continuous scroll while the diff popover is open so the
   anchored popover stays aligned with its source row. Triggered via
   _showSanctionsDiffPopover / _closeSanctionsDiffPopover. */
.dash-sanctions-feed-viewport--paused .dash-sanctions-feed-track{animation-play-state:paused;}

/* ── UPDATED diff popover ─────────────────────────────────────
   Floating panel anchored near the clicked UPDATED pill on the
   Live Sanctions Feed. Renders the before/after audit trail for
   the four hashed semantic fields of an UPDATED designation. */
.dash-sanctions-diff-popover{position:fixed;z-index:1000;width:560px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);background:#fff;border:1px solid var(--border2);border-radius:10px;box-shadow:0 12px 32px rgba(15,23,42,0.18),0 2px 6px rgba(15,23,42,0.08);display:flex;flex-direction:column;font-family:'Inter',sans-serif;overflow:hidden;}
.dash-sanctions-diff-popover__hdr{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border2);background:#fafbfc;}
.dash-sanctions-diff-popover__title{display:flex;flex-direction:column;gap:3px;min-width:0;}
.dash-sanctions-diff-popover__title-name{font-size:.88rem;font-weight:700;color:var(--charcoal);letter-spacing:-.01em;line-height:1.25;word-break:break-word;}
.dash-sanctions-diff-popover__title-meta{font-size:.66rem;font-weight:600;color:#d97706;letter-spacing:.04em;text-transform:uppercase;}
.dash-sanctions-diff-popover__close{flex-shrink:0;width:28px;height:28px;border-radius:6px;border:1px solid var(--border2);background:#fff;color:var(--slate);font-size:1.05rem;line-height:1;cursor:pointer;transition:background .15s,color .15s,border-color .15s;font-family:inherit;}
.dash-sanctions-diff-popover__close:hover{background:#f1f5f9;color:var(--charcoal);border-color:#cbd5e1;}
.dash-sanctions-diff-popover__body{padding:14px 16px;overflow-y:auto;flex:1;}
.dash-sanctions-diff-popover__ftr{padding:10px 16px;border-top:1px solid var(--border2);background:#fafbfc;}
.dash-sanctions-diff-popover__src{font-size:.7rem;font-weight:600;color:var(--forest);text-decoration:none;display:inline-flex;align-items:center;gap:4px;}
.dash-sanctions-diff-popover__src:hover{text-decoration:underline;}

/* Full audit grid: 3 columns (label · before · after). Each changed
   field gets an amber left-stripe + a small CHANGED tag so the eye
   is drawn to the actual delta. */
.dash-diff-grid-head{display:grid;grid-template-columns:130px 1fr 1fr;gap:10px;padding-bottom:6px;border-bottom:1px solid var(--border2);margin-bottom:6px;}
.dash-diff-grid-head-lbl,.dash-diff-grid-head-col{font-size:.6rem;font-weight:700;color:var(--mid);text-transform:uppercase;letter-spacing:.06em;}
.dash-diff-grid{display:flex;flex-direction:column;gap:6px;}
.dash-diff-grid-row{display:grid;grid-template-columns:130px 1fr 1fr;gap:10px;padding:8px 8px 8px 10px;border-radius:6px;background:#fff;border-left:3px solid transparent;align-items:start;}
.dash-diff-grid-row--changed{background:rgba(217,119,6,0.06);border-left-color:#d97706;}
.dash-diff-grid-row-lbl{font-size:.7rem;font-weight:700;color:var(--slate);display:flex;flex-direction:column;gap:4px;}
.dash-diff-grid-row-tag{font-size:.55rem;font-weight:800;color:#d97706;background:#fffbeb;border:1px solid rgba(217,119,6,0.3);padding:1px 6px;border-radius:100px;letter-spacing:.06em;align-self:flex-start;}
.dash-diff-grid-row-before,.dash-diff-grid-row-after{font-size:.72rem;color:var(--charcoal);line-height:1.5;word-break:break-word;}
.dash-diff-grid-row--changed .dash-diff-grid-row-after{font-weight:600;}

/* Partial-audit fallback: single-column current state + info note. */
.dash-diff-note{font-size:.72rem;color:var(--slate);background:#fffbeb;border:1px solid rgba(217,119,6,0.25);border-radius:6px;padding:10px 12px;margin-bottom:12px;line-height:1.5;}
.dash-diff-current-title{font-size:.6rem;font-weight:700;color:var(--mid);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;}
.dash-diff-current{display:flex;flex-direction:column;gap:6px;}
.dash-diff-row{display:grid;grid-template-columns:140px 1fr;gap:10px;padding:6px 8px;border-radius:6px;background:#f8fafc;align-items:start;}
.dash-diff-row-lbl{font-size:.7rem;font-weight:700;color:var(--slate);}
.dash-diff-row-val{font-size:.72rem;color:var(--charcoal);line-height:1.5;word-break:break-word;}

/* Pulsing red dot on the UPDATING pill — same 1.6s ease-in-out opacity
   pulse as the Regulatory Intelligence ticker count dot (see
   regulatory-intelligence.css reg-intel__count-pulse). */
.dash-sanctions-updating-pill{display:inline-flex;align-items:center;gap:6px;}
.dash-sanctions-updating-dot{width:6px;height:6px;border-radius:50%;background:#dc2626;animation:dash-sanctions-pulse 1.6s ease-in-out infinite;flex-shrink:0;}
@keyframes dash-sanctions-pulse{0%,100%{opacity:1;}50%{opacity:0.4;}}
/* Summary block below the header (total records + last-refreshed). */
.dash-sanctions-summary{margin-bottom:10px;}
.dash-sanctions-summary-main{font-size:.68rem;color:var(--mid);}
.dash-sanctions-refreshed{font-size:.62rem;color:var(--mid);opacity:0.7;font-weight:500;margin-top:2px;font-variant-numeric:tabular-nums;}

.dash-ai-stream{display:flex;flex-direction:column;gap:8px;}
.dash-ai-row{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:8px;background:var(--forest-pale);border:1px solid var(--forest-pale2);animation:aifadein .4s ease;}
@keyframes aifadein{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}}
.dash-ai-icon{width:22px;height:22px;border-radius:6px;background:var(--forest);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.dash-ai-text{font-size:.72rem;color:var(--charcoal);line-height:1.5;flex:1;}
.dash-ai-text strong{font-weight:700;color:var(--forest);}
.dash-ai-cursor{display:inline-block;width:2px;height:10px;background:var(--forest);animation:blink .8s step-end infinite;vertical-align:middle;margin-left:2px;}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:0;}}

.dash-bottom-row{display:grid;grid-template-columns:2fr 1fr;gap:14px;}
.dash-sparkline-wrap{position:relative;height:60px;margin-top:8px;}
.dash-trend-lbl{font-size:.65rem;color:var(--mid);font-weight:500;}
.dash-ticker{display:flex;flex-direction:column;gap:6px;}
.dash-ticker-item{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;border-radius:8px;background:#f8fafc;border:1px solid var(--border2);}
.dash-ticker-name{font-size:.72rem;font-weight:600;color:var(--charcoal);}
.dash-ticker-count{font-size:.72rem;font-weight:700;color:var(--forest);}
.dash-ticker-delta{font-size:.62rem;color:var(--mid);}
@media(max-width:1200px){.dash-kpi-row{grid-template-columns:repeat(2,1fr);}.dash-mid-row{grid-template-columns:1fr 1fr;}.dash-bottom-row{grid-template-columns:1fr;}}

/* ── AI FEED OVERRIDES ── */
.dash-card-badge.ai{background:rgba(5,150,105,0.12);color:var(--forest);animation:pulse-badge 2s ease infinite;}
@keyframes pulse-badge{0%,100%{opacity:1;}50%{opacity:.55;}}
.dash-ai-card{padding:24px 28px;}
.dash-ai-card .dash-card-hdr{margin-bottom:20px;}
.dash-ai-sectors{display:flex;gap:5px;flex-wrap:wrap;padding:6px 0 14px;border-bottom:1px solid var(--border2);margin-bottom:14px;}
.dash-ai-sector-btn{font-size:.64rem;font-weight:600;padding:3px 10px;border-radius:100px;border:1px solid var(--border2);background:#fff;color:var(--mid);cursor:pointer;transition:all .15s;font-family:'Inter',sans-serif;white-space:nowrap;}
.dash-ai-sector-btn:hover{border-color:var(--forest);color:var(--forest);}
.dash-ai-sector-btn.active{background:var(--forest);color:#fff;border-color:var(--forest);}
.dash-ai-stream{display:flex;flex-direction:column;gap:10px;max-height:340px;overflow-y:auto;scrollbar-width:thin;}
.dash-ai-row{border-radius:8px;background:var(--forest-pale);border:1px solid var(--forest-pale2);animation:aifadein .4s ease;}
.dash-ai-row-inner{padding:12px 14px;}
.dash-ai-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;}
.dash-ai-sector-tag{font-size:.59rem;font-weight:700;padding:2px 7px;border-radius:100px;letter-spacing:.03em;}
.dash-ai-time{font-size:.59rem;color:var(--mid);}
.dash-ai-body{display:flex;align-items:flex-start;gap:8px;}
.dash-ai-icon{width:20px;height:20px;border-radius:5px;background:var(--forest);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;}
.dash-ai-text{font-size:.71rem;color:var(--charcoal);line-height:1.55;flex:1;}
.dash-ai-date{font-size:.59rem;color:var(--mid);background:var(--border2);padding:1px 6px;border-radius:4px;font-weight:500;}
.dash-ai-footer{padding:10px 14px 12px;border-top:1px solid var(--forest-pale2);margin-top:6px;}
.dash-ai-link{font-size:.65rem;font-weight:600;color:var(--forest);text-decoration:none;display:inline-flex;align-items:center;gap:3px;transition:opacity .15s;}
.dash-ai-link:hover{opacity:.7;text-decoration:underline;}

/* ═══════════════════════════════════════════════════
   MLRO COPILOT — ENTERPRISE VISUAL OVERRIDES
   Applied on top of base styles
═══════════════════════════════════════════════════ */

/* ── CORE TOKENS ── */
:root {
  --bg: #f4f6f9;
  --card: #ffffff;
  --border2: #e1e7ef;
  --charcoal: #0c1526;
  --slate: #2d3f58;
  --mid: #5a6b82;
  --sidebar-w: 240px;
  --topbar-h: 52px;
  --forest: #014d3c;
  --forest-2: #016b52;
  --forest-3: #019a73;
  --forest-pale: rgba(1,77,60,0.05);
  --forest-pale2: rgba(1,77,60,0.1);
}

/* ── BODY ── */
body { font-family: 'Inter', sans-serif; background: var(--bg); }
html { font-size: 13.5px; }

/* ── SIDEBAR ── */
.sidebar {
  width: var(--sidebar-w);
  background: #0c1526;
  border-right: none;
  box-shadow: none;
}

.sidebar-brand {
  padding: 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.brand-logo {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 18px 20px 14px;
}

.brand-logo svg rect { stroke: rgba(255,255,255,0.2); }
.brand-name { font-size: .92rem; font-weight: 700; color: #fff; letter-spacing: -.025em; }
.brand-tagline { font-size: .59rem; color: rgba(255,255,255,0.3); margin-top: 2px; letter-spacing: .06em; text-transform: uppercase; }

/* Sidebar status strip */
.sidebar-status {
  margin: 0;
  padding: 7px 20px 10px;
  border-radius: 0;
  background: none;
  display: flex;
  align-items: center;
  gap: 6px;
}
.proxy-status-text { font-size: .62rem; color: rgba(255,255,255,0.3); font-weight: 500; }
.proxy-dot.live { background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,0.15); }

/* Nav */
.sidebar-nav { padding: 8px 0 0; gap: 1px; }
.nav-section-label {
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.22);
  padding: 14px 20px 5px;
  margin: 0;
}

.nav-item {
  padding: 9px 20px;
  border-radius: 0;
  font-size: .78rem;
  font-weight: 500;
  color: rgba(255,255,255,0.5);
  gap: 10px;
  transition: color .12s, background .12s;
}
.nav-item:hover { background: rgba(255,255,255,0.04); color: rgba(255,255,255,0.85); }
.nav-item.active {
  background: rgba(1,154,115,0.15);
  color: #34d399;
  font-weight: 600;
  border-left: 2px solid #019a73;
  padding-left: 18px;
}
.nav-item.active::before { display: none; }
.nav-item.active svg { opacity: 1; color: #34d399; }
.nav-item svg { opacity: .5; }
.nav-soon-badge {
  font-size: .54rem;
  background: rgba(255,255,255,0.07);
  color: rgba(255,255,255,0.25);
  padding: 2px 6px;
  border-radius: 3px;
  border: none;
  letter-spacing: .06em;
}
.nav-item.soon { opacity: .45; }

/* Sidebar footer */
.sidebar-footer {
  padding: 14px 20px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.sidebar-version { font-size: .58rem; color: rgba(255,255,255,0.15); margin-top: 8px; }

/* ── TOPBAR ── */
.topbar {
  height: var(--topbar-h);
  background: #fff;
  border-bottom: 1px solid var(--border2);
  padding: 0 28px;
  box-shadow: none;
}
.topbar-title { font-size: .88rem; font-weight: 700; color: var(--charcoal); letter-spacing: -.02em; }
.topbar-breadcrumb { font-size: .65rem; color: var(--mid); margin-top: 1px; }
.topbar-avatar {
  width: 30px; height: 30px; border-radius: 8px;
  background: var(--forest); font-size: .6rem;
}

/* ── PAGE CONTENT ── */
.main { margin-left: var(--sidebar-w); }
.page-content { padding: 22px 28px; }

/* ── DASHBOARD ── */
.dash-wrap { gap: 16px; }

/* Hero — stripped back, data-first */
.dash-hero {
  background: linear-gradient(120deg, #0c1526 0%, #0a2540 55%, #013d30 100%);
  border-radius: 10px;
  padding: 22px 28px;
  box-shadow: 0 2px 12px rgba(12,21,38,0.18);
}
.dash-hero::before, .dash-hero::after { display: none; }
.dash-hero-greeting {
  font-size: .6rem;
  letter-spacing: .14em;
  color: rgba(255,255,255,0.35);
  margin-bottom: 4px;
}
.dash-hero-title {
  font-size: 1.22rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.025em;
  margin-bottom: 6px;
}
.dash-hero-sub { font-size: .72rem; color: rgba(255,255,255,0.45); }
.dash-live-pill {
  background: rgba(34,197,94,0.12);
  border: 1px solid rgba(34,197,94,0.25);
  font-size: .65rem;
  padding: 4px 12px;
}
.dash-live-dot { background: #22c55e; box-shadow: 0 0 6px #22c55e; width: 6px; height: 6px; }
.dash-last-sync { font-size: .6rem; color: rgba(255,255,255,0.25); }

/* KPI tiles */
.dash-kpi-row { gap: 12px; }
.dash-kpi {
  padding: 18px 20px;
  border-radius: 8px;
  border: 1px solid var(--border2);
  box-shadow: none;
  transition: box-shadow .15s;
}
.dash-kpi:hover { box-shadow: 0 2px 10px rgba(0,0,0,0.07); transform: none; }
.dash-kpi-label {
  font-size: .6rem;
  letter-spacing: .1em;
  color: var(--mid);
  margin-bottom: 8px;
}
.dash-kpi-val { font-size: 1.8rem; letter-spacing: -.04em; }
.dash-kpi-bar { height: 2px; border-radius: 0 0 8px 8px; }

/* Cards */
.dash-card {
  background: #fff;
  border: 1px solid var(--border2);
  border-radius: 8px;
  padding: 16px 18px;
  box-shadow: none;
}
.dash-card-title { font-size: .78rem; font-weight: 700; color: var(--charcoal); }
.dash-card-hdr { margin-bottom: 12px; }
.dash-card-badge.live { font-size: .58rem; padding: 2px 7px; }
.dash-card-badge.ai { font-size: .58rem; padding: 2px 7px; }
.dash-mid-row, .dash-bottom-row { gap: 12px; }

/* Sanctions ticker */
.dash-ticker-item {
  padding: 8px 0;
  font-size: .72rem;
}
.dash-ticker-val { font-size: .82rem; font-weight: 700; }

/* Activity feed */
.dash-act-dot { width: 7px; height: 7px; }
.dash-act-name { font-size: .75rem; }
.dash-act-detail { font-size: .65rem; }
.dash-act-time { font-size: .62rem; }

/* RAG circles */
.dash-rag-circle {
  width: 54px; height: 54px;
  font-size: 1.2rem;
  border-width: 2.5px;
}
.dash-rag-lbl { font-size: .62rem; }

/* Period tabs */
.dash-period-tab { font-size: .68rem; padding: 4px 10px; border-radius: 5px; }

/* Sanction feed — horizontal padding keeps the View source button and
   change pill clear of the 2px spotlight border on the .latest row. */
.dash-sanction-item { padding: 7px 12px; }
.dash-sanction-flag { font-size: 1rem; width: 28px; height: 28px; border-radius: 5px; }
.dash-sanction-name { font-size: .72rem; }
.dash-sanction-detail { font-size: .62rem; }

/* AI feed */
.dash-ai-row-inner { padding: 7px 10px; }
.dash-ai-sector-tag { font-size: .58rem; }
.dash-ai-time { font-size: .58rem; }
.dash-ai-text { font-size: .7rem; }
.dash-ai-link { font-size: .63rem; }
.dash-ai-sector-btn { font-size: .62rem; padding: 2px 9px; }

/* ── SECTION CARDS (screening, case management etc) ── */
.reg-card { border-radius: 8px; box-shadow: none; }
.reg-card-header { padding: 20px 24px 16px; }
.customers-wrap, .om-card, .edd-card { border-radius: 8px; box-shadow: none; }
.ob-card { border-radius: 8px; box-shadow: none; }
.ob-card-header { padding: 18px 24px 14px; }

/* ── MODAL ── */
.modal { border-radius: 8px; }
.modal-overlay.open { backdrop-filter: blur(4px); }

/* ── MISC ── */
.section-card { border-radius: 8px; box-shadow: none; border: 1px solid var(--border2); }
.placeholder-panel { border-radius: 8px; }
.ph-badge { font-size: .65rem; }

/* Topbar environment badge */
/* Topbar environment badge — neutral base; colour comes from env-- modifier */
.topbar-env-badge {
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .08em;
  padding: 3px 9px;
  border-radius: 4px;
  border: 1px solid transparent;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  line-height: 1;
}
/* Env modifiers — APP_ENV in app.js drives which class is applied at runtime */
.env--dev     { background: #F3F4F6; color: #374151; border-color: rgba(55,65,81,0.18); }
.env--staging { background: #FEF3C7; color: #92400E; border-color: rgba(146,64,14,0.22); }
.env--prod    { background: #D1FAE5; color: #0F3D24; border-color: rgba(15,61,36,0.20); }

/* ── TOP-RIGHT USER MENU (dropdown) ── */
.topbar-user-menu-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.topbar-user-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 240px;
  background: #FFFFFF;
  color: #015441;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(2,30,22,0.16), 0 2px 6px rgba(2,30,22,0.08);
  padding: 6px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity .14s ease, transform .14s ease, visibility 0s linear .14s;
  z-index: 200;
}
.topbar-user-menu.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity .14s ease, transform .14s ease, visibility 0s linear 0s;
}
.topbar-user-menu-header {
  padding: 10px 12px 8px;
}
.topbar-user-menu-name {
  font-size: .82rem;
  font-weight: 700;
  color: #015441;
  line-height: 1.3;
}
.topbar-user-menu-role {
  font-size: .65rem;
  font-weight: 600;
  color: rgba(1,84,65,0.65);
  letter-spacing: .04em;
  margin-top: 2px;
  text-transform: uppercase;
}
.topbar-user-menu-email {
  font-size: .68rem;
  color: rgba(1,84,65,0.55);
  margin-top: 4px;
  word-break: break-all;
}
.topbar-user-menu-divider {
  height: 1px;
  background: #BDBDBD;
  margin: 4px 0;
  opacity: .55;
}
.topbar-user-menu-item {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 9px 12px;
  font-family: 'Inter', sans-serif;
  font-size: .78rem;
  font-weight: 500;
  color: #015441;
  background: transparent;
  border: none;
  border-radius: 6px;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: background .12s ease, color .12s ease;
}
.topbar-user-menu-item:hover,
.topbar-user-menu-item:focus-visible {
  background: rgba(1,84,65,0.07);
  outline: none;
}
.topbar-user-menu-signout {
  color: #015441;
  font-weight: 600;
}
.topbar-user-menu-signout:hover,
.topbar-user-menu-signout:focus-visible {
  background: rgba(220,38,38,0.06);
  color: #B91C1C;
}

/* Sidebar data strip */
.sidebar-data-strip {
  padding: 8px 20px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.sidebar-data-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sidebar-data-label { font-size: .58rem; color: rgba(255,255,255,0.3); font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.sidebar-data-val { font-size: .68rem; font-weight: 700; color: rgba(255,255,255,0.65); font-variant-numeric: tabular-nums; }
.sidebar-data-val.live { color: #34d399; }

/* Topbar right zone */
.topbar-right-zone {
  display: flex;
  align-items: center;
  gap: 16px;
}
/* ═══════════════════════════════════════════════════
   MLRO COPILOT — FINAL PALETTE SYSTEM
   Darker forest base · Deep green panels · Off-white content
═══════════════════════════════════════════════════ */

:root {
  /* Core palette */
  --forest:        #01522f;
  --forest-2:      #016b3d;
  --forest-3:      #00c471;
  --forest-pale:   rgba(1,82,47,0.06);
  --forest-pale2:  rgba(1,82,47,0.11);

  /* Sidebar tones */
  --sidebar-base:  #02321f;
  --sidebar-panel: #013d26;
  --sidebar-mid:   #01522f;

  /* Content surfaces */
  --bg:            #f7f8fa;
  --card:          #ffffff;
  --border2:       #e4e9f0;
  --border:        rgba(0,0,0,0.07);

  /* Text */
  --charcoal:      #0c1a12;
  --slate:         #2d3f58;
  --mid:           #5a6b82;

  /* Accents — status only */
  --green:         #00a35a;
  --green-pale:    rgba(0,163,90,0.08);
  --amber:         #d97706;
  --amber-pale:    rgba(217,119,6,0.08);
  --red:           #dc2626;
  --red-pale:      rgba(220,38,38,0.08);

  /* Live accent */
  --live:          #00c471;

  --sidebar-w:     240px;
}

/* ── SIDEBAR — final palette overrides ── */

/* Zone 1: Fixed top */
.sidebar { background: var(--sidebar-base); box-shadow: none; border-right: none; }
.sidebar-brand { border-bottom: 1px solid rgba(255,255,255,0.07); padding: 0; flex-shrink: 0; }
.brand-logo { padding: 13px 18px 9px; }
.brand-name { font-size: .88rem; font-weight: 700; color: #fff; letter-spacing: -.025em; }
.brand-tagline { font-size: .57rem; color: rgba(255,255,255,0.3); letter-spacing: .07em; text-transform: uppercase; margin-top: 2px; }

/* Data strip: horizontal row to minimise height */
.sidebar-data-strip {
  padding: 4px 18px 9px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 8px;
}
.sidebar-data-row { display: flex; flex-direction: column; gap: 1px; }
.sidebar-data-label { font-size: .54rem; color: rgba(255,255,255,0.25); text-transform: uppercase; letter-spacing: .09em; font-weight: 600; }
.sidebar-data-val { font-size: .66rem; font-weight: 700; color: rgba(255,255,255,0.55); font-variant-numeric: tabular-nums; }
.sidebar-data-val.live { color: var(--live); }
#sidebarSanctionsCount { color: var(--live); }

.proxy-dot.live { background: var(--live); box-shadow: 0 0 0 3px rgba(0,196,113,0.15); }

/* Zone 2: Scrollable nav — structural properties repeated here so the override block is self-contained */
.sidebar-nav {
  padding: 4px 0 16px;
  gap: 0;
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.nav-section-label {
  font-size: .56rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.22);
  padding: 20px 18px 5px;
  margin: 0;
}
.nav-item {
  padding: 8px 18px;
  border-radius: 0;
  font-size: .77rem;
  font-weight: 500;
  color: rgba(255,255,255,0.5);
  gap: 10px;
  transition: color .12s, background .12s;
}
.nav-item:hover { background: rgba(255,255,255,0.05); color: rgba(255,255,255,0.85); }
.nav-item:hover svg { opacity: .75; }
.nav-item.active {
  background: rgba(0,196,113,0.1);
  border-left: 2px solid var(--live);
  padding-left: 16px;
  color: var(--live);
  font-weight: 600;
}
.nav-item.active::before { display: none; }
.nav-item.active svg { opacity: 1; color: var(--live); }
.nav-item svg { opacity: .4; }
.nav-item.soon { opacity: .4; }
.nav-soon-badge {
  font-size: .52rem;
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.22);
  padding: 2px 6px;
  border-radius: 3px;
  letter-spacing: .05em;
  border: none;
}

/* Zone 3: Fixed bottom */
.sidebar-footer { padding: 12px 18px; border-top: 1px solid rgba(255,255,255,0.07); flex-shrink: 0; }
.sidebar-version { font-size: .57rem; color: rgba(255,255,255,0.15); margin-top: 6px; }

/* ── TOPBAR ── */
.topbar {
  height: 50px; background: #fff;
  border-bottom: 1px solid var(--border2);
  padding: 0 28px; box-shadow: none;
}
.topbar-title { font-size: .87rem; font-weight: 700; color: var(--charcoal); letter-spacing: -.02em; }
.topbar-breadcrumb { font-size: .64rem; color: var(--mid); margin-top: 1px; }
.topbar-avatar { width: 30px; height: 30px; border-radius: 7px; background: var(--sidebar-base); font-size: .6rem; }
.topbar-env-badge {
  font-size: .58rem; font-weight: 700; letter-spacing: .08em;
  padding: 3px 8px; border-radius: 4px;
  text-transform: uppercase;
}

/* ── BODY / PAGE ── */
body { background: var(--bg); }
.main { margin-left: var(--sidebar-w); }
.page-content { padding: 22px 28px; }

/* ── DASHBOARD HERO ── */
.dash-hero {
  background: linear-gradient(120deg, var(--sidebar-panel) 0%, var(--sidebar-base) 55%, var(--sidebar-mid) 100%);
  border-radius: 9px; padding: 22px 28px;
  box-shadow: 0 2px 10px rgba(2,50,31,0.18);
}
.dash-hero::before, .dash-hero::after { display: none; }
.dash-hero-greeting { font-size: .6rem; letter-spacing: .14em; color: rgba(255,255,255,0.32); margin-bottom: 4px; }
.dash-hero-title { font-size: 1.2rem; font-weight: 700; color: #fff; letter-spacing: -.025em; margin-bottom: 6px; }
.dash-hero-sub { font-size: .71rem; color: rgba(255,255,255,0.42); }

.dash-live-pill {
  background: rgba(0,196,113,0.12); border: 1px solid rgba(0,196,113,0.22);
  font-size: .64rem; padding: 4px 12px;
}
.dash-live-dot { background: var(--live); box-shadow: 0 0 5px var(--live); width: 6px; height: 6px; }
.dash-last-sync { font-size: .59rem; color: rgba(255,255,255,0.22); }

/* OFAC/UN etc badges on hero */
.dash-hero-right > div:last-child > div {
  background: rgba(255,255,255,0.06) !important;
  color: rgba(255,255,255,0.4) !important;
  border-radius: 5px !important;
  font-size: .62rem !important;
}

/* ── KPI CARDS ── */
.dash-kpi-row { gap: 12px; }
.dash-kpi {
  padding: 16px 18px; border-radius: 8px;
  border: 1px solid var(--border2); box-shadow: none;
  transition: box-shadow .15s;
}
.dash-kpi:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.06); transform: none; }
.dash-kpi-label { font-size: .59rem; letter-spacing: .1em; color: var(--mid); margin-bottom: 8px; }
.dash-kpi-val { font-size: 1.75rem; letter-spacing: -.04em; }
.dash-kpi-bar { height: 2px; border-radius: 0 0 8px 8px; }
.dash-kpi-bar.green { background: var(--live); }
.dash-kpi-bar.amber { background: var(--amber); }
.dash-kpi-bar.blue  { background: var(--forest-3); }
.dash-kpi-bar.red   { background: var(--red); }

/* ── DASHBOARD CARDS ── */
.dash-wrap { gap: 14px; }
.dash-card {
  background: #fff; border: 1px solid var(--border2);
  border-radius: 8px; padding: 15px 17px; box-shadow: none;
}
.dash-card-title { font-size: .77rem; font-weight: 700; color: var(--charcoal); }
.dash-mid-row, .dash-bottom-row { gap: 12px; }
.dash-period-tab { font-size: .67rem; padding: 3px 10px; border-radius: 5px; }
.dash-period-tab.active { background: #fff; color: var(--charcoal); box-shadow: 0 1px 3px rgba(0,0,0,0.08); }

/* RAG circles */
.dash-rag-circle { width: 52px; height: 52px; font-size: 1.15rem; border-width: 2.5px; }
.dash-rag-circle.green { border-color: var(--live); color: var(--live); }
.dash-rag-circle.amber { border-color: var(--amber); color: var(--amber); }
.dash-rag-circle.red   { border-color: var(--red);   color: var(--red); }

/* Activity dots */
.dash-act-dot.green  { background: var(--live); }
.dash-act-dot.red    { background: var(--red); }
.dash-act-dot.amber  { background: var(--amber); }
.dash-act-dot.blue   { background: var(--forest-3); }

/* AI feed */
.dash-ai-row { background: rgba(1,82,47,0.04); border: 1px solid rgba(1,82,47,0.09); }
.dash-ai-icon { background: var(--sidebar-mid); }
.dash-ai-text strong { color: var(--sidebar-mid); }
.dash-ai-cursor { background: var(--forest-3); }
.dash-ai-link { color: var(--forest-2); }
.dash-ai-sector-btn.active { background: var(--sidebar-mid); border-color: var(--sidebar-mid); }
.dash-ai-sector-btn:hover { border-color: var(--sidebar-mid); color: var(--sidebar-mid); }

/* Sanctions feed */
.dash-sanction-badge { font-size: .58rem; }

/* Badge colours */
.dash-card-badge.live { background: rgba(0,163,90,0.1); color: var(--green); }
.dash-card-badge.ai   { background: rgba(1,82,47,0.08); color: var(--sidebar-mid); }

/* ── SECTION CARDS (screening etc) ── */
.reg-card { border-radius: 8px; box-shadow: none; border: 1px solid var(--border2); }
.reg-card-header { background: linear-gradient(160deg, var(--sidebar-base) 0%, var(--sidebar-mid) 100%) !important; }
.results-panel { border: 1px solid var(--border2); border-radius: 8px; background: #fff; }
.section-card { border-radius: 8px; box-shadow: none; }
.customers-wrap, .om-card, .edd-card, .ob-card { border-radius: 8px; box-shadow: none; border: 1px solid var(--border2); }

/* Buttons */
.screen-btn { background: var(--sidebar-mid); border-radius: 7px; }
.screen-btn:hover { background: var(--forest-2); }
.lookup-btn { background: var(--sidebar-mid); border-radius: 7px; }
.lookup-btn:hover { background: var(--forest-2); }
.ob-btn-primary { background: var(--sidebar-mid); border-radius: 7px; }
.ob-btn-primary:hover { background: var(--forest-2); }
.om-run-btn { background: var(--sidebar-mid); border-radius: 7px; }
.om-run-btn:hover { background: var(--forest-2); }
.edd-refresh-btn { background: var(--sidebar-mid); border-radius: 7px; }
.edd-refresh-btn:hover { background: var(--forest-2); }

/* Status chips */
.status-chip.active { background: rgba(0,163,90,0.08); color: var(--green); }
.ct-badge.clear { background: rgba(0,163,90,0.08); color: var(--green); }
.ct-badge.possible { background: var(--amber-pale); color: var(--amber); }
.ct-badge.match { background: var(--red-pale); color: var(--red); }
.sbadge.neutral { background: var(--forest-pale); color: var(--forest); }

/* Inputs */
.reg-input:focus, .ob-input:focus, .om-search:focus, .edd-notes-area:focus {
  border-color: var(--forest); box-shadow: 0 0 0 3px rgba(1,82,47,0.08);
}
.ob-country-select:focus { border-color: var(--forest); box-shadow: 0 0 0 3px rgba(1,82,47,0.08); }

/* Scope toggle */
.scope-option.selected { border-color: var(--forest); background: var(--forest-pale); }
.scope-option.selected .scope-check { background: var(--forest); border-color: var(--forest); }


/* Modal */
.modal { border-radius: 8px; }
.modal-overlay.open { backdrop-filter: blur(3px); }

/* Ongoing monitoring */
.om-schedule-dot { background: var(--live); }
.om-status-badge.om-status-clear { background: rgba(0,163,90,0.08); color: var(--green); }

/* EDD */
.edd-ai-icon { background: var(--sidebar-mid); }
.edd-ai-summary-hdr { background: rgba(1,82,47,0.05); }
.edd-ai-summary-hdr { color: var(--sidebar-mid); }
.edd-ai-btn { background: var(--sidebar-mid); }
.edd-ai-btn:hover { background: var(--forest-2); }
.edd-ai-bullets li { border-left-color: var(--forest-3); }
.edd-ai-bullets li strong { color: var(--sidebar-mid); }
.edd-progress-fill { background: linear-gradient(90deg, var(--sidebar-mid), var(--forest-3)); }
.edd-check-item:hover { border-color: var(--forest); background: var(--forest-pale); }
.edd-check-item.edd-check-done { border-color: var(--green); background: var(--green-pale); }
.edd-check-item input { accent-color: var(--forest); }
.edd-fatf-update { font-size: .62rem; }

/* Onboarding stepper */
.ob-ts-step.active .ob-ts-num { background: var(--sidebar-mid); }
.ob-ts-step.done .ob-ts-num { background: var(--green); }
.ob-ts-line.done { background: var(--green); }
.ob-fatf-black { background: var(--red-pale); color: var(--red); border-color: rgba(220,38,38,0.18); }
.ob-fatf-grey  { background: var(--amber-pale); color: #92400e; border-color: rgba(217,119,6,0.18); }

/* Dashboard hero period selector */
.dash-period-row { background: rgba(255,255,255,0.06); border-radius: 7px; padding: 3px; }

/* ── HERO OPTION B REDESIGN ── */
.dash-hero {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
  border-radius: 9px;
  overflow: hidden;
}
.dash-hero-top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 22px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.dash-hero-label {
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
}
.dash-hero-right-row {
  display: flex;
  align-items: center;
  gap: 16px;
}
.dash-hero-datetime {
  display: flex;
  align-items: center;
  gap: 10px;
  font-variant-numeric: tabular-nums;
}
.dash-hero-date {
  font-size: .72rem;
  font-weight: 500;
  color: rgba(255,255,255,0.5);
}
.dash-hero-clock {
  font-size: .78rem;
  font-weight: 700;
  color: rgba(255,255,255,0.75);
  font-variant-numeric: tabular-nums;
  letter-spacing: .04em;
  background: rgba(255,255,255,0.06);
  padding: 3px 10px;
  border-radius: 5px;
  font-family: 'DM Mono', 'Courier New', monospace;
}
.dash-hero-greeting-row {
  padding: 16px 22px 14px;
  display: flex;
  align-items: baseline;
  gap: 6px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.dash-hero-greeting {
  font-size: 1.05rem;
  font-weight: 400;
  color: rgba(255,255,255,0.55);
  letter-spacing: -.01em;
}
.dash-hero-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.02em;
  margin: 0;
}
.dash-hero-metrics {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
}
.dash-hero-metric {
  padding: 14px 18px;
  border-right: 1px solid rgba(255,255,255,0.07);
  background: rgba(255,255,255,0.03);
}
.dash-hero-metric:last-child { border-right: none; }
.dash-hero-metric-label {
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  margin-bottom: 5px;
}
.dash-hero-metric-val {
  font-size: 1.6rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -.04em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.dash-hero-metric-sub {
  font-size: .62rem;
  color: rgba(255,255,255,0.25);
  margin-top: 4px;
}

/* Keep live pill correct in new layout */
.dash-hero .dash-live-pill {
  background: rgba(0,196,113,0.12);
  border: 1px solid rgba(0,196,113,0.22);
  font-size: .65rem;
  padding: 4px 12px;
}

/* ── HERO REDESIGN — UNIFIED ── */
.page-content { padding: 0; }
.dash-wrap { gap: 0; }
.dash-wrap > *:not(.dash-hero) { margin: 14px 28px 0; }
.dash-wrap > *:last-child { margin-bottom: 28px; }
.dash-hero { border-radius: 0; width: 100%; }

/* Single unified top bar — label · date · clock · pill all on one line */
.dash-hero-top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 32px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.dash-hero-label {
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.32);
}
/* Date and clock sit together in the middle */
.dash-hero-right-row {
  display: flex;
  align-items: center;
  gap: 20px;
}
.dash-hero-datetime {
  display: flex;
  align-items: center;
  gap: 10px;
}
.dash-hero-date {
  font-size: .75rem;
  font-weight: 400;
  color: rgba(255,255,255,0.45);
  letter-spacing: .01em;
}
/* Clock — no box, just clean mono text */
.dash-hero-clock {
  font-size: .78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.6);
  font-variant-numeric: tabular-nums;
  letter-spacing: .06em;
  font-family: 'DM Mono', 'Courier New', monospace;
  background: none;
  padding: 0;
  border-radius: 0;
}
/* Separator dot between date and clock */
.dash-hero-datetime::before {
  display: none;
}
/* All systems operational pill — pushed right */
.dash-hero .dash-live-pill {
  background: rgba(0,196,113,0.1);
  border: 1px solid rgba(0,196,113,0.2);
  font-size: .68rem;
  font-weight: 600;
  padding: 4px 13px;
  color: rgba(255,255,255,0.75);
  border-radius: 100px;
}

/* Greeting row */
.dash-hero-greeting-row {
  padding: 18px 32px 16px;
  display: flex;
  align-items: baseline;
  gap: 7px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.dash-hero-greeting {
  font-size: 1.3rem;
  font-weight: 300;
  color: rgba(255,255,255,0.45);
  letter-spacing: -.01em;
  font-family: 'Sora', 'DM Sans', 'Inter', sans-serif;
}
.dash-hero-title {
  font-size: 1.3rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.025em;
  margin: 0;
  font-family: 'Sora', 'DM Sans', 'Inter', sans-serif;
}

/* Metric strip */
.dash-hero-metrics {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
}
.dash-hero-metric {
  padding: 14px 24px;
  border-right: 1px solid rgba(255,255,255,0.07);
  background: rgba(0,0,0,0.08);
}
.dash-hero-metric:last-child { border-right: none; }
.dash-hero-metric-label {
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.28);
  margin-bottom: 6px;
}
.dash-hero-metric-val {
  font-size: 1.55rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -.04em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.dash-hero-metric-sub {
  font-size: .6rem;
  color: rgba(255,255,255,0.22);
  margin-top: 4px;
}

/* Non-dashboard tab padding */
#tab-customer-screening,
#tab-company-screening,
#tab-case-management,
#tab-onboarding,
#tab-sar-drafting,
#tab-ongoing-monitoring,
#tab-reports,
#tab-edd { padding: 22px 28px; }

/* ═══════════════════════════════════════════════════
   MLRO COPILOT — NAV GROUPS
   Collapsible sidebar sections with chevron disclosure
═══════════════════════════════════════════════════ */

.nav-group {
  display: flex;
  flex-direction: column;
}

/* Group header — the clickable section label row */
.nav-group-header {
  display: flex;
  align-items: center;
  padding: 18px 18px 5px;
  background: none;
  border: none;
  cursor: pointer;
  width: 100%;
  font-family: 'Inter', sans-serif;
  white-space: nowrap;
  overflow: hidden;
  transition: opacity 200ms ease, height 250ms ease, padding 250ms ease, margin 250ms ease;
}

.nav-group-label {
  font-size: .56rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.22);
  flex: 1;
  text-align: left;
  transition: opacity 200ms ease;
}

.nav-group-chevron {
  color: rgba(255,255,255,0.22);
  flex-shrink: 0;
  margin-left: 4px;
  transition: transform 220ms ease, opacity 200ms ease;
}

.nav-group-header:hover .nav-group-label { color: rgba(255,255,255,0.50); }
.nav-group-header:hover .nav-group-chevron { color: rgba(255,255,255,0.50); }

/* Chevron points down when open */
.nav-group.open .nav-group-chevron {
  transform: rotate(180deg);
}

/* Group body — collapses/expands via max-height */
.nav-group-body {
  overflow: hidden;
  max-height: 0;
  transition: max-height 260ms ease;
}

.nav-group.open .nav-group-body {
  max-height: 600px;
}

/* ── COLLAPSED SIDEBAR OVERRIDES ──
   When the sidebar is icon-only: hide group headers so only nav icons show.
   Force all group bodies open so every icon is always reachable. */
.sidebar.collapsed .nav-group-header {
  opacity: 0;
  height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
  pointer-events: none;
  transition: none;
}

.sidebar.collapsed .nav-group-body {
  max-height: 600px !important;
  transition: none !important;
}

/* SAR badge base style */
.sar-nav-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 100px;
  background: var(--red);
  color: #fff;
  font-size: .55rem;
  font-weight: 700;
  margin-left: auto;
  flex-shrink: 0;
}

.sidebar.collapsed .sar-nav-badge { display: none !important; }

/* ── BRAND LOGO AS BUTTON ── */
button.brand-logo {
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  border-radius: 8px;
  transition: background 150ms ease;
}
button.brand-logo:hover {
  background: rgba(255,255,255,0.06);
}

/* ── HERO TOP ROW FINAL ── */
.dash-hero-top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 32px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.dash-hero-label {
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.28);
  flex: 1;
}
.dash-hero-datetime {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  justify-content: center;
  font-variant-numeric: tabular-nums;
}
.dash-hero-date {
  font-size: .76rem;
  font-weight: 400;
  color: rgba(255,255,255,0.42);
}
.dash-hero-sep {
  color: rgba(255,255,255,0.18);
  font-size: .7rem;
}
.dash-hero-clock {
  font-size: .76rem;
  font-weight: 500;
  color: rgba(255,255,255,0.55);
  font-variant-numeric: tabular-nums;
  letter-spacing: .05em;
  font-family: 'DM Mono','Courier New',monospace;
  background: none;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
}
.dash-hero .dash-live-pill {
  flex: 1;
  justify-content: flex-end;
  display: flex;
  align-items: center;
  gap: 7px;
  background: rgba(0,196,113,0.1);
  border: 1px solid rgba(0,196,113,0.2);
  border-radius: 100px;
  padding: 4px 13px;
  font-size: .67rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  width: fit-content;
  margin-left: auto;
}

.main{
  display: flex !important;
  flex-direction: column !important;
  width: calc(100% - var(--sidebar-w)) !important;
  min-height: 100vh;
}

.topbar{
  width: 100%;
  flex: 0 0 auto;
}

.page-content{
  width: 100%;
  flex: 1 1 auto;
}

/* ═══════════════════════════════════════════════════════════════
   DASHBOARD REDESIGN 2.0 — Bloomberg Status Bar + SAR Tiles
   ═══════════════════════════════════════════════════════════════ */

/* ── Hide topbar when on dashboard ── */
.main.dash-mode .topbar { display: none; }
.main.dash-mode .page-content { padding-top: 0; }

/* ── Bloomberg-style status bar ── */
.dash-hero.dash-statusbar-mode {
  padding: 0;
  background: linear-gradient(90deg, #020e0a 0%, #011a14 40%, #021007 100%);
  border-radius: 0;
}
.dash-sb-inner {
  display: flex;
  align-items: center;
  padding: 11px 32px;
  border-bottom: 1px solid rgba(0,196,113,0.1);
  gap: 0;
}
.dash-sb-brand {
  font-family: 'Sora', 'DM Sans', sans-serif;
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: rgba(247,248,250,0.38);
  flex: 1;
}
.dash-sb-center {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  justify-content: center;
}
.dash-sb-date {
  font-family: 'Sora', 'DM Sans', sans-serif;
  font-size: .82rem;
  font-weight: 400;
  color: #f7f8fa;
  letter-spacing: .01em;
}
.dash-sb-sep {
  color: rgba(255,255,255,0.18);
  font-size: .75rem;
}
.dash-sb-clock {
  font-family: 'IBM Plex Mono', 'DM Mono', monospace;
  font-size: 1rem;
  font-weight: 700;
  color: #00c471;
  letter-spacing: .06em;
  font-variant-numeric: tabular-nums;
}
.dash-sb-right {
  flex: 1;
  display: flex;
  justify-content: flex-end;
}
.dash-sb-live-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: 'Sora', 'DM Sans', sans-serif;
  font-size: .62rem;
  font-weight: 500;
  color: rgba(247,248,250,0.6);
  letter-spacing: .02em;
}
.dash-sb-live-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #00c471;
  flex-shrink: 0;
  box-shadow: 0 0 0 0 rgba(0,196,113,0.7);
  animation: sbdotpulse 2.2s ease-in-out infinite;
}
@keyframes sbdotpulse {
  0%   { box-shadow: 0 0 0 0 rgba(0,196,113,0.7); }
  70%  { box-shadow: 0 0 0 7px rgba(0,196,113,0); }
  100% { box-shadow: 0 0 0 0 rgba(0,196,113,0); }
}

/* ── SAR Workflow Tiles ── */
.dash-sar-section {
  background: var(--bg);
  padding: 0;
  /* Inherits margin: 14px 28px 0 from .dash-wrap > *:not(.dash-hero) */
}
.dash-sar-tiles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.dash-sar-tile {
  background: #fff;
  border: 1px solid var(--border2);
  border-left-width: 4px;
  border-radius: 10px;
  padding: 22px 26px;
  position: relative;
  overflow: hidden;
  transition: box-shadow 0.18s, transform 0.15s;
}
.dash-sar-tile:hover {
  box-shadow: 0 4px 18px rgba(0,0,0,0.08);
  transform: translateY(-1px);
}
/* Clickable SAR tiles drill into SAR Management pre-filtered by status. */
.dash-sar-tile-clickable { cursor: pointer; }
.dash-sar-tile-clickable:hover { box-shadow: 0 6px 22px rgba(0,0,0,0.12); transform: translateY(-2px); }
.dash-sar-tile-clickable:focus-visible { outline: 2px solid var(--forest, #015441); outline-offset: 2px; }
.dash-sar-tile-label {
  font-family: 'Sora', 'Inter', sans-serif;
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 12px;
}
.dash-sar-tile-val {
  font-size: 3rem;
  font-weight: 800;
  color: var(--charcoal);
  letter-spacing: -.05em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  margin-bottom: 8px;
  transition: color 0.3s;
}
.dash-sar-tile-sub {
  font-size: .68rem;
  color: #94a3b8;
  font-weight: 400;
}
/* Border + value color variants */
.dash-sar-tile.sar-tile-green { border-left-color: #00c471; }
.dash-sar-tile.sar-tile-amber { border-left-color: #d97706; }
.dash-sar-tile.sar-tile-red   { border-left-color: #dc2626; }
.dash-sar-tile.sar-tile-amber .dash-sar-tile-val { color: #d97706; }
.dash-sar-tile.sar-tile-red   .dash-sar-tile-val { color: #dc2626; }

/* ── SAR Badge on sidebar nav item ── */
.sar-nav-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: #dc2626;
  color: #fff;
  font-size: .55rem;
  font-weight: 800;
  border-radius: 100px;
  letter-spacing: 0;
  margin-left: auto;
  flex-shrink: 0;
  line-height: 1;
}

/* Responsive SAR tiles */
@media (max-width: 1100px) {
  .dash-sar-tiles { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .dash-sar-tiles { grid-template-columns: 1fr; }
}

/* ── OPTIONS PANEL ── */
.options-overlay{
  position:fixed;inset:0;z-index:9999;
  display:none; /* shown via .open class */
  align-items:center;justify-content:center;
  background:rgba(0,0,0,0.38);
  backdrop-filter:blur(2px);
}
.options-overlay.open{display:flex;}

.options-panel{
  background:var(--card);
  border:1px solid var(--border2);
  border-radius:14px;
  width:400px;max-width:calc(100vw - 40px);
  box-shadow:0 20px 60px rgba(0,0,0,0.18);
  overflow:hidden;
  animation:optionsPanelIn 160ms ease;
}
@keyframes optionsPanelIn{from{opacity:0;transform:scale(.97) translateY(6px);}to{opacity:1;transform:none;}}

.options-panel-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 20px 16px;
  border-bottom:1px solid var(--border);
}
.options-panel-title{font-family:'Sora',sans-serif;font-size:.9rem;font-weight:700;color:var(--charcoal);letter-spacing:-.01em;}
.options-close-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;border:none;background:none;color:var(--mid);cursor:pointer;transition:background .15s,color .15s;}
.options-close-btn:hover{background:var(--border);color:var(--charcoal);}

.options-panel-body{padding:8px 0 12px;}

.options-row{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:12px 20px;
  transition:background .12s;
}
.options-row:hover{background:var(--forest-pale);}
.options-row-info{display:flex;flex-direction:column;gap:2px;min-width:0;}
.options-row-name{font-size:.82rem;font-weight:600;color:var(--charcoal);}
.options-row-sub{font-size:.68rem;color:var(--mid);}

.options-select{
  appearance:none;-webkit-appearance:none;
  padding:5px 26px 5px 10px;
  border:1.5px solid var(--border2);
  border-radius:7px;
  font-family:'Inter',sans-serif;font-size:.75rem;font-weight:500;
  color:var(--charcoal);background:var(--card);
  cursor:pointer;outline:none;
  background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2364748b' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 8px center;
  transition:border-color .15s;
  flex-shrink:0;
}
.options-select:focus{border-color:var(--forest);box-shadow:0 0 0 2px var(--forest-pale);}

.options-divider{height:1px;background:var(--border);margin:8px 0;}

.options-link-row{
  display:flex;align-items:center;gap:10px;
  width:100%;padding:11px 20px;
  border:none;background:none;
  font-family:'Inter',sans-serif;font-size:.8rem;font-weight:500;
  color:var(--slate);cursor:pointer;
  text-decoration:none;
  transition:background .12s,color .12s;
}
.options-link-row:hover{background:var(--forest-pale);color:var(--forest);}
.options-link-row svg{flex-shrink:0;}
.options-link-row span{flex:1;text-align:left;}
.options-link-chevron{color:var(--mid);flex-shrink:0;}