/* @AI_CRITICAL_GUARD: UNTOUCHABLE ZONE. Strictly protects Enterprise UI/UX, Realtime Sync Logic, Core State Management, and Database/API Adapters. Do NOT modify existing logic or layout in this file without explicitly asking Thunter BOY for clearance. If overlapping changes are required, STOP and provide a RISK IMPACT REPORT first. */
/*
===============================================================================
SYSTEM PROMPT INSTRUCTION / AI CONTRACT — STRICT DESIGN TOKEN ARCHITECTURE
-------------------------------------------------------------------------------
1) CORE LAYOUT CLASSES (.card, .btn, .sidebar, grids, tables, modals, etc.)
   MUST contain structure/spacing/typography only and MUST consume semantic tokens.
2) THEME BLOCKS (body[data-theme="..."]) are aesthetic overrides only.
   NEVER place structural layout rules inside theme blocks.
3) NEVER hardcode colors/shadows/borders in core components.
   Always use semantic variables from :root token registry.
4) Adding/editing/removing a theme must NOT break application layout.
===============================================================================
*/
:root{
  /* Enterprise theme (offline-first) */
  --bg:#f5f7fb;
  --bg2:#eef2f8;
  --panel:#ffffff;
  --panel2:#ffffff;
  --border:#d7dee9;
  --border2:#c8d1e0;
  --text:#0f172a;
  --muted:#6b7280;
  --muted2:#94a3b8;
  --primary:#2563eb;
  --primary2:#1d4ed8;
  --danger:#dc2626;
  --warn:#d97706;
  --ok:#16a34a;

  --shadow: 0 8px 24px rgba(15,23,42,.08);
  --shadow2: 0 2px 10px rgba(15,23,42,.06);

  --radius:14px;
  --radius2:10px;

  --focus: 0 0 0 3px rgba(37,99,235,.18);

  --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}

*{box-sizing:border-box}html,body{height:100%}
body{margin:0;font-family:var(--font);background:linear-gradient(180deg,var(--bg) 0%, var(--bg2) 100%);color:var(--text)}
a{color:inherit}

/* Global enterprise controls */
::selection{background: rgba(37,99,235,.18)}
.card{background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow2);border-radius:var(--radius)}
.pad{padding:16px}
.small{color:var(--muted);font-size:12px}
.muted{color:var(--muted)}
.section-title{font-weight:700;color:var(--text)}
hr{border:0;border-top:1px solid var(--border);margin:12px 0}

/* Buttons */
.btn{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:12px;padding:10px 12px;font-weight:600;cursor:pointer;transition:background .12s,border-color .12s,transform .06s}
.btn:hover{background:rgba(2,6,23,.02);border-color:var(--border2)}
.btn:active{transform:translateY(1px)}
.btn:focus{outline:none;box-shadow:var(--focus)}
.btn.primary{background:var(--primary);border-color:var(--primary);color:#fff}
.btn.primary:hover{background:var(--primary2);border-color:var(--primary2)}
.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.btn.ghost{background:transparent}
.btn.iconbtn{width:38px;height:38px;padding:0;display:grid;place-items:center}
.btn.iconbtn .ico{width:18px;height:18px;display:inline-block;background:currentColor;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;flex:0 0 auto}

/* Inputs */
input,select,textarea{border:1px solid var(--border);border-radius:12px;padding:10px 12px;font:inherit;background:var(--panel);color:var(--text);outline:none;transition:border-color .12s,box-shadow .12s}
input:focus,select:focus,textarea:focus{border-color:rgba(37,99,235,.65);box-shadow:var(--focus)}
textarea{resize:vertical}

/* Tables */
table{border-collapse:separate;border-spacing:0;width:100%}
th,td{border-bottom:1px solid var(--border);padding:10px 10px;text-align:left;vertical-align:top}
th{font-size:12px;color:var(--muted);font-weight:700;background:rgba(2,6,23,.02)}
tr:hover td{background:rgba(2,6,23,.015)}

/* Pills / badges */
.badge{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:700;color:var(--text);background:rgba(2,6,23,.02)}
.badge.ok{border-color:rgba(22,163,74,.35);background:rgba(22,163,74,.08);color:#0b3d1f}
.badge.danger{border-color:rgba(220,38,38,.35);background:rgba(220,38,38,.08);color:#5a0b0b}
.badge.warn{border-color:rgba(217,119,6,.35);background:rgba(217,119,6,.08);color:#5a3106}
.badge.info{border-color:rgba(37,99,235,.35);background:rgba(37,99,235,.10);color:#0b234a}
.badge.muted{background:rgba(2,6,23,.02);color:var(--muted)}

/* Task status controls */
.task-status-wrap{display:flex;flex-direction:column;gap:6px}
.task-status-select{min-width:150px;max-width:190px}
.task-status-select.badge{padding:6px 10px}
.task-problem-note{font-size:12px;color:var(--muted);max-width:240px;white-space:normal}

/* Modals */
.modal .panel{background:var(--panel);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow)}
.modal .head{border-bottom:1px solid var(--border);padding:14px 16px}
.modal .body{padding:16px}
.btn{appearance:none;border:1px solid var(--border);background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));color:var(--text);padding:10px 12px;border-radius:12px;cursor:pointer;box-shadow:var(--shadow)}
.btn:hover{border-color:rgba(255,255,255,.18)}
.btn.primary{background:linear-gradient(180deg, rgba(var(--accent-rgb,74,163,255),.45), rgba(var(--accent-rgb,74,163,255),.18));border-color:rgba(var(--accent-rgb,74,163,255),.55)}
.btn.danger{background:linear-gradient(180deg, rgba(255,91,110,.45), rgba(255,91,110,.16));border-color:rgba(255,91,110,.55)}
.btn.ghost{box-shadow:none;background:transparent}
.btn.tiny{padding:6px 8px;border-radius:10px;box-shadow:none;font-size:12px;line-height:1}
.input,.select,.textarea,select{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
  outline:none;
}

/* Date/Time picker icon visibility (Chrome/Edge/Safari)
   NOTE: Some Windows/Edge builds render the calendar icon very dark.
   We force high-contrast so the icon is always visible on our dark UI. */
input[type="date"], .input[type="date"],
input[type="time"], .input[type="time"]{color-scheme:light}
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator{
  filter:none;
  opacity: 1;
  cursor: pointer;
}


select option,.select option{
  color:#111;
  background:#fff;
}

/* Ensure select text stays readable in Edge/Windows high-contrast quirks */
select:disabled{opacity:.65;color:var(--text)}
.textarea{min-height:110px;resize:vertical}
.input:focus,.select:focus,.textarea:focus{border-color:rgba(var(--accent-rgb,74,163,255),.6)}
.small{font-size:12px;color:var(--muted)}
.badge{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);padding:4px 8px;border-radius:999px;font-size:12px;color:var(--muted);background:rgba(255,255,255,.03)}

/* Login */
.auth-wrap{min-height:100%;display:grid;place-items:center;padding:24px}
.auth-card{width:min(980px,100%);display:grid;grid-template-columns:1.05fr .95fr;gap:18px}
@media(max-width:900px){.auth-card{grid-template-columns:1fr}}
.card{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.card.pad{padding:20px}
.h1{font-size:28px;margin:0 0 8px}
.h2{font-size:16px;margin:0 0 10px;color:var(--muted)}
.row{display:flex;gap:10px;align-items:center}

/* Topbar actions (settings + logout) */
.topbar-actions{display:flex;gap:10px;align-items:center}

#mobilePanelToggle{display:none}
.iconbtn{padding:10px 10px;min-width:44px;display:grid;place-items:center}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.err{display:none;margin-top:10px;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,91,110,.5);background:rgba(255,91,110,.12);color:#ffd7dc}

/* App layout */
.app{height:100%;display:grid;grid-template-columns:260px 1fr 320px;grid-template-rows:auto 1fr;gap:14px;padding:14px;padding-bottom:92px}
@media(max-width:1100px){.app{grid-template-columns:240px 1fr;grid-template-rows:auto auto 1fr;}.right{grid-column:1/-1;grid-row:2}.main{grid-column:1/-1;grid-row:3}}
.topbar{grid-column:1/-1;display:grid;grid-template-columns:260px 1fr auto;align-items:center;gap:12px}
.topbar-center{display:flex;justify-content:center;align-items:center;min-width:0}
.topbrand{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02)}
@media(max-width:1100px){.topbar{grid-template-columns:1fr auto}.topbrand{display:none}.topbar-center{justify-content:flex-start}}

/* === Logo polish (MUMS) === */
.brand-name{
  /* subtle glow so the logo feels "alive" without being distracting */
  text-shadow:
    0 0 10px rgba(110,231,255,.35),
    0 0 18px rgba(167,139,250,.22);
}
.brand-mark{
  box-shadow:
    0 10px 30px rgba(0,0,0,.30),
    0 0 18px rgba(110,231,255,.22),
    0 0 26px rgba(167,139,250,.18),
    inset 0 0 0 1px rgba(255,255,255,.20);
}
.brand-build{
  /* requested: smaller build number (<50%) */
  font-size:6px;
  opacity:.65;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-top:2px;
}
.announce-bar{width:100%;max-width:none;display:flex;flex-direction:row;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;border:1px solid var(--border);background:rgba(255,255,255,.03);cursor:pointer;min-height:52px;min-width:0}
.announce-bar:hover{border-color:rgba(255,255,255,.16)}
.announce-msg{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.announce-title{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.announce-meta{display:none}

.side,.right,.main{min-height:0}
.side.card.pad{display:flex;flex-direction:column;gap:12px}
/* Sidebar user container: keep it transparent so the profile card itself is the single background layer */
.usercard{padding:0;border-radius:0;border:none;background:transparent;position:relative}

/* Sidebar profile (compact by default to maximize nav space) */
.sp-compact{display:flex;gap:10px;align-items:center;padding:10px 8px 8px 8px}
/* Sidebar profile v2: name above avatar; avatar aligned to role badge row */
.sp-compact-v2{flex-direction:column;align-items:stretch;gap:8px}
.sp-name-top{padding-left:2px}
/* Row with avatar + role/shift; align avatar to the role badge row (top) */
.sp-row{display:flex;gap:10px;align-items:flex-start;min-width:0}
.sp-info-row{min-width:0;flex:1 1 auto}
.sp-photo-sm{width:52px;height:52px;border-radius:14px;overflow:hidden;
  border:1px solid var(--border-0, var(--border));
  background:rgba(var(--accent-rgb,74,163,255),.10);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto}
body[data-mode="light"] .sp-photo-sm{background:rgba(15,23,42,.04)}
.sp-photo-sm img{width:100%;height:100%;object-fit:cover;display:block}
.sp-photo-sm .initials{font-weight:950;color:var(--text-0, var(--text))}
.sp-info{min-width:0;flex:1 1 auto}
.sp-name-sm{font-weight:950;line-height:1.12;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:4px}
.sp-role{font-size:10px;font-weight:950;letter-spacing:.10em;text-transform:uppercase;
  padding:4px 8px;border-radius:999px;
  background:rgba(var(--accent-rgb,74,163,255),.10);
  border:1px solid rgba(var(--accent-rgb,74,163,255),.22);
  color:var(--text-0, var(--text))}
.sp-shift-sm{font-size:10px;font-weight:950;letter-spacing:.10em;text-transform:uppercase;color:var(--text-muted, var(--muted))}
.sp-dot{opacity:.6}
.sp-dutyline{margin-top:4px;font-size:11px;font-weight:900;color:var(--text-0, var(--text));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-dutyline .muted{color:var(--text-muted, var(--muted))}
.sp-tz{margin-top:3px;font-size:10px;opacity:.65}

/* Bottom quick links bar */
.quicklinks-bar{
  position:fixed;
  left:0;right:0;bottom:0;
  /* Keep bottom bar above all in-page cards so clocks never get clipped behind panels.
     Modals/popovers use higher z-index values. */
  z-index:2000;
  padding:10px 14px;
  background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.28) 40%, rgba(0,0,0,.45));
  backdrop-filter: blur(10px);
}
.quicklinks-inner{max-width:1400px;margin:0 auto;display:flex;justify-content:center;align-items:flex-end;
  /* Bring circles closer together (~30% tighter than previous gap) */
  gap:4px;
  flex-wrap:nowrap}
.qitem{display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;min-width:0}
.qlabel{font-size:11px;line-height:1.1;color:var(--muted);max-width:72px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Tooltip for quick link circles */
.qitem[data-tip]:hover::after,.qitem[data-tip]:focus-within::after{content:attr(data-tip);position:absolute;bottom:58px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.82);color:#fff;font-size:11px;padding:6px 8px;border-radius:10px;border:1px solid rgba(255,255,255,.12);white-space:nowrap;pointer-events:none;z-index:100}
.qitem[data-tip]:hover::before,.qitem[data-tip]:focus-within::before{content:"";position:absolute;bottom:50px;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:rgba(0,0,0,.82);pointer-events:none;z-index:100}

@media(max-width:1100px){.quicklinks-inner{flex-wrap:wrap;row-gap:10px}.quicklinks-bar{padding-bottom:14px}}
.qcircle{height:44px;width:44px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.04);display:grid;place-items:center;cursor:pointer;user-select:none;box-shadow:var(--shadow);position:relative}
.qcircle:hover{border-color:rgba(255,255,255,.18)}
.qcircle .qtxt{font-size:12px;color:var(--muted);font-weight:700}
.qcircle.filled{background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02));}
.qcircle.filled .qtxt{color:var(--text)}
.qcircle:focus{outline:2px solid rgba(74,163,255,.55);outline-offset:2px}

/* Keep app content from being covered by the bottom bar.
   Increased to account for: quick links labels + circles + world clocks. */
.app{padding-bottom:120px}

/* Theme picker */
.theme-grid{display:grid;grid-template-columns:repeat(5, 1fr);gap:12px}
@media(max-width:900px){.theme-grid{grid-template-columns:repeat(2,1fr)}}
.theme-tile{border:1px solid var(--border);border-radius:16px;padding:12px;background:rgba(255,255,255,.03);cursor:pointer;display:flex;flex-direction:column;gap:10px}

/* =========================================================
   GLOBAL PROPORTIONAL LAYOUT SCALING (v4.2 layout-scale)
   Keep the app shell stable when the viewport shrinks by scaling
   the entire UI (like browser zoom) instead of reflowing columns.
   Scale factor is controlled by CSS variable --app-scale (set in
   public/js/env_runtime.js so it applies to login + app shells).
   ========================================================= */

html{
  --app-scale: 1;
  overflow-x: hidden;
}

body{
  transform: scale(var(--app-scale));
  transform-origin: top left;
  width: calc(100% / var(--app-scale));
  min-height: calc(100vh / var(--app-scale));
  overflow-x: hidden;
}

/* Disable narrow-screen grid reflow that causes "layout shatter".
   We keep the desktop 3-column layout and rely on scaling to fit. */
@media (max-width:1100px) and (min-width: 769px){
  .app{
    grid-template-columns:260px 1fr 320px !important;
    grid-template-rows:auto 1fr !important;
  }
  .side{grid-column:1 !important;grid-row:2 !important;}
  .main{grid-column:2 !important;grid-row:2 !important;}
  .right{grid-column:3 !important;grid-row:2 !important;}

  .topbar{grid-template-columns:260px 1fr auto !important;}
  .topbrand{display:flex !important;}
  .topbar-center{justify-content:center !important;}

  /* Keep quick links structure intact; allow overflow rather than wrap */
  .quicklinks-bar{overflow-x:auto; padding-bottom:10px !important;}
  .quicklinks-inner{flex-wrap:nowrap !important;row-gap:0 !important;}
}
.theme-tile:hover{border-color:rgba(255,255,255,.18)}
.theme-swatch{height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(90deg, var(--sw1), var(--sw2))}
.theme-tile .tname{font-weight:800}
.theme-tile .tmeta{font-size:12px;color:var(--muted)}
.theme-tile.active{border-color:rgba(var(--accent-rgb,74,163,255),.60);box-shadow:0 0 0 2px rgba(74,163,255,.18)}

/* ==========================================================================
   ULTRA PREMIUM ENTERPRISE THEME SETTINGS
   ========================================================================== */
#themeModal .panel {
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(145deg, rgba(10, 15, 30, 0.85), rgba(4, 8, 15, 0.95));
  backdrop-filter: blur(40px) saturate(120%);
  -webkit-backdrop-filter: blur(40px) saturate(120%);
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  border-radius: 24px;
}
#themeModal .head {
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  background: rgba(255, 255, 255, 0.01);
  padding: 18px 24px;
}
#themeModal .body {
  display: grid;
  gap: 18px;
  padding: 24px;
}

/* --- Theme Summary (KPI Style) --- */
.th-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 8px;
}
.th-summary-item {
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 18px;
  padding: 16px 20px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.005));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 8px 20px rgba(0,0,0,0.2);
  overflow: hidden;
}
.th-summary-item::before {
  content: "";
  position: absolute;
  top: 0; left: 0; width: 100%; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(56, 189, 248, 0.6), transparent);
}
.th-summary-label {
  display: block;
  font-size: 10px;
  color: #94a3b8;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.th-summary-value {
  display: block;
  margin-top: 6px;
  font-size: 18px;
  font-weight: 950;
  color: #f8fafc;
  text-shadow: 0 0 15px rgba(255, 255, 255, 0.2);
}

/* --- Toolbar (Control Deck) --- */
.th-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 18px 20px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.6), rgba(2, 132, 199, 0.08));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 12px 30px rgba(0,0,0,0.3);
  backdrop-filter: blur(20px);
}
.th-toolbar-copy { min-width: 0; }
.th-toolbar-title {
  font-weight: 950;
  font-size: 18px;
  background: linear-gradient(90deg, #ffffff, #94a3b8);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: 0.02em;
}
.th-toolbar-subtitle { margin-top: 6px; font-size: 12px; color: #cbd5e1; }
.th-toolbar-controls { display: flex; flex-direction: column; gap: 12px; min-width: min(420px, 100%); }
.th-toolbar-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }

.th-global-default-panel {
  border: 1px solid rgba(56, 189, 248, 0.2);
  border-radius: 16px;
  padding: 14px 16px;
  background: rgba(8, 47, 73, 0.35);
  box-shadow: inset 0 0 20px rgba(56, 189, 248, 0.05);
}
.th-global-default-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; margin-top: 8px; align-items: center; }
.th-global-default-row .input { min-width: 200px; background: rgba(2, 6, 23, 0.6); border-color: rgba(56, 189, 248, 0.3); color: #e0f2fe; font-weight: 700; }
#globalDefaultThemeStatus { margin-top: 8px; font-weight: 800; font-size: 12px; }

/* --- Theme Grid & Cards (The Masterpiece) --- */
.th-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.th-card {
  position: relative;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.4), rgba(15, 23, 42, 0.6));
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
  padding: 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  cursor: pointer;
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  overflow: hidden;
  transform: translateZ(0); /* Hardware Acceleration */
}
/* Glass Rim Reflection */
.th-card::before {
  content: ""; position: absolute; inset: 0; border-radius: 20px; padding: 1px;
  background: linear-gradient(135deg, rgba(255,255,255,0.15), rgba(255,255,255,0));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; pointer-events: none;
}
.th-card:hover {
  transform: translateY(-4px) scale(1.02);
  border-color: rgba(56, 189, 248, 0.4);
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.5), 0 0 20px rgba(56, 189, 248, 0.15);
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.6), rgba(15, 23, 42, 0.8));
}
.th-card.is-active {
  background: rgba(14, 116, 144, 0.25);
  border-color: rgba(56, 189, 248, 0.8);
  box-shadow: 
    0 0 0 1px rgba(56, 189, 248, 0.8),
    0 20px 50px rgba(14, 116, 144, 0.5),
    inset 0 0 30px rgba(56, 189, 248, 0.15);
  animation: themeActivePulse 3s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
}
@keyframes themeActivePulse {
  0% { box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.8), 0 20px 50px rgba(14, 116, 144, 0.4), inset 0 0 30px rgba(56, 189, 248, 0.1); }
  100% { box-shadow: 0 0 0 1px rgba(56, 189, 248, 1), 0 20px 60px rgba(14, 116, 144, 0.7), inset 0 0 50px rgba(56, 189, 248, 0.25); }
}
.th-card.is-hidden { opacity: 0.5; border-style: dashed; filter: grayscale(0.8); }
.th-card.is-hidden:hover { opacity: 0.9; border-color: rgba(248, 113, 113, 0.8); filter: grayscale(0); }
.th-jiggle { animation: thJiggle 0.3s ease-in-out infinite alternate; }
@keyframes thJiggle { from { transform: rotate(-1deg); } to { transform: rotate(1deg); } }

/* --- Theme Swatch (The Lens) --- */
.th-swatch {
  width: 58px; height: 58px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.08);
  background: var(--t-bg);
  position: relative;
  flex-shrink: 0;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.5), inset 0 4px 10px rgba(255, 255, 255, 0.15);
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.th-card:hover .th-swatch { transform: scale(1.08) rotate(-5deg); }
.th-swatch::after {
  content: ""; position: absolute;
  width: 22px; height: 22px;
  border-radius: 999px;
  right: -4px; bottom: -4px;
  background: var(--t-acc);
  border: 3px solid #0b1220;
  box-shadow: 0 0 18px var(--t-acc), inset 0 2px 4px rgba(255,255,255,0.4);
}

/* --- Theme Typography & Badges --- */
.th-info { min-width: 0; flex: 1; }
.th-title { font-weight: 950; color: #f8fafc; font-size: 15px; letter-spacing: 0.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.th-meta, .th-mode { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; color: #94a3b8; margin-top: 4px; }
.th-desc { margin-top: 8px; font-size: 12px; line-height: 1.4; color: #cbd5e1; max-height: 34px; overflow: hidden; opacity: 0.85; }
.th-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.th-badge {
  display: inline-flex; padding: 4px 10px; border-radius: 999px;
  font-size: 10px; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase;
  border: 1px solid transparent; backdrop-filter: blur(4px);
}
.th-badge-active { color: #38bdf8; border-color: rgba(56, 189, 248, 0.4); background: rgba(14, 116, 144, 0.3); box-shadow: 0 0 10px rgba(56, 189, 248, 0.2); }
.th-badge-hidden { color: #fca5a5; border-color: rgba(248, 113, 113, 0.4); background: rgba(127, 29, 29, 0.4); }
.th-badge-default { color: #fcd34d; border-color: rgba(251, 191, 36, 0.4); background: rgba(146, 64, 14, 0.4); }

/* --- Admin Bar (Swipe/Hover actions) --- */
.th-admin-bar {
  position: absolute; top: 0; right: 0; bottom: 0;
  display: flex; flex-direction: column; min-width: 140px;
  background: rgba(2, 6, 23, 0.95);
  border-left: 1px solid rgba(148, 163, 184, 0.2);
  transform: translateX(100%);
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  backdrop-filter: blur(10px);
}
.th-card.show-admin .th-admin-bar { transform: translateX(0); box-shadow: -10px 0 30px rgba(0,0,0,0.5); }
.th-admin-btn {
  flex: 1; border: none; background: transparent; color: #e2e8f0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.1);
  font-size: 11px; font-weight: 900; letter-spacing: 0.05em; text-transform: uppercase;
  display: flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer;
  transition: all 0.2s;
}
.th-admin-btn:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.th-admin-btn.del:hover { background: rgba(239, 68, 68, 0.2); color: #fca5a5; }

.th-empty { grid-column: 1 / -1; text-align: center; padding: 40px 20px; border: 2px dashed rgba(148, 163, 184, 0.2); border-radius: 20px; color: #94a3b8; font-weight: 700; }

/* --- Theme Lab / Audit --- */
.theme-lab-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.theme-lab-card {
  border: 1px solid rgba(148, 163, 184, 0.15); border-radius: 16px; padding: 16px;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.6), rgba(2, 6, 23, 0.8));
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}
.theme-lab-k { font-weight: 900; color: #f8fafc; font-size: 14px; }
.theme-lab-v { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; color: #94a3b8; margin-top: 4px; }
.theme-lab-status { padding: 6px 14px; border-radius: 999px; font-size: 11px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; border: 1px solid; }
.theme-lab-guide { margin-top: 18px; border-left: 4px solid #38bdf8; padding: 12px 16px; line-height: 1.5; background: rgba(56, 189, 248, 0.05); border-radius: 0 12px 12px 0; }

@media(max-width: 900px) {
  .th-summary { grid-template-columns: 1fr; }
  .th-toolbar { padding: 16px; flex-direction: column; align-items: stretch; }
  .th-toolbar-controls { min-width: 0; }
  .th-toolbar-actions { justify-content: flex-start; }
  .th-global-default-row { grid-template-columns: 1fr; }
  .th-grid { grid-template-columns: 1fr; }
}


/* Quick links settings */
.links-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:900px){.links-grid{grid-template-columns:1fr}}
.link-row{border:1px solid var(--border);border-radius:16px;padding:12px;background:rgba(255,255,255,.03)}
.link-row .lr-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.link-row .lr-slot{font-weight:900}
.link-row .lr-actions{display:flex;gap:8px;align-items:center}


.link-actions{display:flex;gap:8px}
.usercard .uc-head{display:flex;gap:12px;align-items:center;justify-content:space-between}
.usercard .uc-left{display:flex;gap:12px;align-items:center;min-width:0}
.usercard .uc-name{
  font-weight:900;
  /* Make long names readable without breaking layout */
  font-size: clamp(14px, 1.6vw, 18px);
  line-height: 1.15;
  white-space: normal;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.usercard .uc-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;
  border:1px solid var(--border-0, var(--border));
  background:rgba(0,0,0,.10);
  font-size:12px;color:var(--text-muted, var(--muted));font-weight:700}
body[data-mode="light"] .pill{background:rgba(15,23,42,.04)}
.avatar{width:44px;height:44px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);display:grid;place-items:center;flex:0 0 auto}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.avatar .initials{font-weight:900;color:var(--text-0, var(--text))}
.avatar-lg{width:56px;height:56px;border-radius:18px}
.uc-name-lg{font-size:clamp(16px, 1.7vw, 20px)}

/* Profile layout: Full-width banner */
.uc-banner{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:6px 0}
.uc-banner-left{flex:0 0 auto}
.uc-banner-mid{flex:1 1 auto}
.uc-banner-right{flex:0 0 auto}
.uc-banner-stats{margin-top:10px;display:flex;justify-content:space-between;gap:10px;align-items:flex-end}

/* Photo-left profile (MUMS theme) */
.up-badge{display:flex;gap:14px;align-items:flex-start;justify-content:space-between}
.up-photo-col{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px}
.up-role{font-size:12px;font-weight:900;letter-spacing:.08em;padding:6px 10px;border-radius:999px;
  background:rgba(var(--accent-rgb,74,163,255),.10);
  border:1px solid rgba(var(--accent-rgb,74,163,255),.22);
  color:var(--text-0, var(--text));
  text-transform:uppercase}
.up-info{flex:1 1 auto;min-width:0;padding-top:2px}
.up-name{font-weight:900;line-height:1.05;
  font-size:clamp(18px, 2.3vw, 24px);
  word-break:break-word;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.up-sub{margin-top:6px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted, var(--muted))}
.up-duty{margin-top:10px;font-size:13px;font-weight:800}
.up-duty .muted{font-weight:700;margin-right:6px}
.up-actions{flex:0 0 auto;padding-top:2px}

/* Sidebar profile (single-layer, centered) */
.sp-wrap{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  gap:6px; padding:10px 6px 6px 6px; text-align:center;
  background:transparent; border:none; box-shadow:none}
.sp-photo{width:74px;height:74px;border-radius:16px;overflow:hidden;
  border:1px solid var(--border-0, var(--border));
  background:rgba(var(--accent-rgb,74,163,255),.10);
  display:flex;align-items:center;justify-content:center}
body[data-mode="light"] .sp-photo{background:rgba(15,23,42,.04)}
.sp-photo img{width:100%;height:100%;object-fit:cover;display:block}
.sp-photo .initials{font-weight:900;color:var(--text-0, var(--text))}
.sp-duty{margin-top:2px;font-size:13px;font-weight:900;color:var(--text-0, var(--text));line-height:1.2;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sp-duty .muted{color:var(--text-muted, var(--muted));margin-right:6px;letter-spacing:.06em}
.sp-name{margin-top:2px;font-weight:950;line-height:1.1;
  font-size:clamp(15px, 2.2vw, 20px);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  word-break:break-word}
.sp-shift{margin-top:2px;font-size:12px;font-weight:900;letter-spacing:.10em;text-transform:uppercase;color:var(--text-muted, var(--muted))}
.sp-position{margin-top:4px;font-size:12px;font-weight:950;letter-spacing:.10em;text-transform:uppercase;
  padding:5px 10px;border-radius:999px;
  background:rgba(var(--accent-rgb,74,163,255),.10);
  border:1px solid rgba(var(--accent-rgb,74,163,255),.22);
  color:var(--text-0, var(--text))}
.sp-team{margin-top:2px;font-size:11px;font-weight:900;letter-spacing:.10em;text-transform:uppercase;color:var(--text-muted, var(--muted))}

/* Edit icon pinned to upper-right of the left sidebar */
.sidebar-edit{position:absolute;top:8px;right:8px;z-index:3}

/* small icon button used in header/profile controls */
.icon-btn{width:34px;height:34px;border-radius:12px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);color:var(--text);cursor:pointer;display:grid;place-items:center;
  box-shadow:0 10px 26px rgba(0,0,0,.22)}
.icon-btn:hover{background:rgba(255,255,255,.09)}
.icon-btn:active{transform:translateY(1px)}

/* Inline profile edit icon removed (edit is inside Settings). */
.sidebar-edit{display:none !important;}

/* Sidebar profile (centered, single-layer, no background overlays) */
.sp-wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center;
  gap:6px;
  padding:10px 8px 6px 8px;
  background:transparent;
  border:none;
  box-shadow:none;
}

.sp-photo{width:78px;height:78px;border-radius:18px;overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  display:flex;align-items:center;justify-content:center;
}
.sp-photo img{width:100%;height:100%;object-fit:cover;display:block}
.sp-photo .initials{font-weight:900;color:rgba(255,255,255,.92)}

.sp-duty{font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.88)}
.sp-duty .muted{color:rgba(255,255,255,.72);font-weight:900;margin-right:6px}

.sp-name{font-weight:950;line-height:1.08;
  font-size:clamp(16px, 2.2vw, 22px);
  max-width: 100%;
  word-break:break-word;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

.sp-shift{font-size:12px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.82)}

.sp-position{margin-top:2px;font-size:12px;font-weight:900;letter-spacing:.09em;
  padding:6px 10px;border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  text-transform:uppercase;
}

.sp-team{font-size:11px;font-weight:900;letter-spacing:.10em;text-transform:uppercase;color:rgba(255,255,255,.68)}

/* Edit icon pinned to the upper-right of the sidebar */
.sidebar-edit{
  position:absolute;
  top:8px;
  right:8px;
  z-index:5;
}

/* Inline profile edit icon removed (edit is inside Settings). */
.sidebar-edit{display:none !important;}

.sp-duty{
  margin-top:4px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  color:rgba(255,255,255,.92);
}
.sp-duty .muted{color:rgba(255,255,255,.70);margin-right:6px}
.sp-dutyvalue{font-weight:900}

.sp-name{
  font-weight:950;
  line-height:1.05;
  font-size:clamp(16px, 2.2vw, 22px);
  max-width:100%;
}

.sp-shift{
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,.82);
}

.sp-photo{
  width:78px;
  height:78px;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top:4px;
}
.sp-photo img{width:100%;height:100%;object-fit:cover;display:block}
.sp-photo .initials{font-weight:950;color:rgba(255,255,255,.92)}

.sp-position{
  margin-top:6px;
  font-size:12px;
  font-weight:950;
  letter-spacing:.10em;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  text-transform:uppercase;
}

.sp-team{
  margin-top:2px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:rgba(255,255,255,.70);
}

.avatar.avatar-xl{width:74px;height:74px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center}
.avatar.avatar-xl img{width:100%;height:100%;object-fit:cover;display:block}
.uc-sched{margin-top:4px;font-weight:900}
.avatar-xl{width:110px;height:110px;border-radius:26px;overflow:hidden;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);display:grid;place-items:center;margin:0 auto}
.avatar-xl img{width:100%;height:100%;object-fit:cover;display:block}
.usercard .line .small{margin:0}
.usercard .name{font-weight:800}
.usercard .value{color:var(--text)}
.brand{display:flex;align-items:center;gap:12px}
.brand-login{justify-content:flex-start}
.brand-mark{width:42px;height:42px;border-radius:14px;position:relative;flex:0 0 auto;
  background:linear-gradient(135deg, rgba(110,231,255,.95), rgba(167,139,250,.90));
  box-shadow:0 10px 30px rgba(0,0,0,.30), inset 0 0 0 1px rgba(255,255,255,.20);
}
.brand-mark::after{content:"M";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-weight:900;letter-spacing:.02em;color:rgba(0,0,0,.70);font-size:18px;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}
.brand-text{line-height:1.1}
.brand-name{font-weight:900;letter-spacing:.06em;
  /* Glowing effect (requested) */
  text-shadow:
    0 0 10px rgba(110,231,255,.35),
    0 0 22px rgba(167,139,250,.22);
}
.brand-sub{font-size:12px;color:var(--muted);font-weight:700}
.brand-build{
  /* Build number less prominent (requested) */
  font-size:7px; /* ~50% smaller */
  opacity:.75;
  margin-top:2px;
}
.nav{display:flex;flex-direction:column;gap:4px;flex:1 1 auto;min-height:0;overflow:auto;padding-right:4px}
.nav a{display:flex;gap:10px;align-items:center;text-decoration:none;
  padding:8px 10px;border-radius:12px;border:1px solid transparent;color:var(--muted);
  font-size:13px;line-height:1.2}
.nav a.active{color:var(--text);border-color:var(--border);background:rgba(255,255,255,.03)}
.nav a:hover{border-color:rgba(255,255,255,.12)}

/* Tree nav */
.nav-group{border:1px solid transparent;border-radius:14px;overflow:visible}
.nav-group.active{border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.02)}
.nav-group-head{width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:transparent;border:0;color:var(--muted);cursor:pointer}
.nav-group-head:hover{background:rgba(255,255,255,.03)}
.nav-group-head .chev{margin-left:auto;opacity:.7}
.nav-group-kids{padding:4px 0 10px;overflow:visible}

/* Profile modal */
.profile-grid{display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:start}

.cropper-wrap{display:flex;justify-content:center;align-items:center;padding:8px}
#cropCanvas{width:320px;height:320px;border-radius:18px;background:rgba(0,0,0,.45);touch-action:none;cursor:grab;box-shadow:0 10px 28px rgba(0,0,0,.35)}
#cropCanvas:active{cursor:grabbing}
@media(max-width:520px){#cropCanvas{width:280px;height:280px}}
@media(max-width:800px){.profile-grid{grid-template-columns:1fr}}
.profile-photo{text-align:center}
.profile-fields{display:grid;gap:12px}

/* Master schedule table */
.ms-table{display:flex;flex-direction:column;gap:10px}
.ms-head{display:grid;grid-template-columns: 1.3fr 1.2fr .9fr .5fr;gap:10px;padding:10px 12px;border:1px solid rgba(255,255,255,.10);border-radius:14px;background:rgba(255,255,255,.02);font-size:12px;color:var(--muted);font-weight:800;letter-spacing:.02em;text-transform:uppercase}
.ms-row{display:grid;grid-template-columns: 1.3fr 1.2fr .9fr .5fr;gap:10px;align-items:start;padding:12px;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:rgba(0,0,0,.10)}
.ms-name{display:flex;flex-direction:column;gap:2px}

/* Master schedule (v2) */
.ms-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}
.ms-actions{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.ms-actions label{min-width:220px}
.ms-list{display:flex;flex-direction:column;gap:10px}
.ms-item{display:grid;grid-template-columns: 1.1fr 1.5fr .9fr auto;gap:12px;align-items:center;padding:14px;border:1px solid rgba(255,255,255,.10);border-radius:18px;background:rgba(255,255,255,.03)}
@media(max-width:980px){.ms-item{grid-template-columns:1fr;align-items:start}.ms-save{justify-content:flex-start}}
.ms-id{display:flex;gap:10px;align-items:center;min-width:240px}
.ms-avatar{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;font-weight:900;border:1px solid rgba(255,255,255,.14);background:rgba(var(--accent-rgb,74,163,255),.12)}
.ms-title{font-weight:900}
.weekday-chips{display:flex;flex-wrap:wrap;gap:6px}
.chipbtn{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.02);color:var(--muted);padding:6px 8px;border-radius:12px;cursor:pointer;font-size:12px;line-height:1}
.chipbtn:hover{border-color:rgba(255,255,255,.22)}
.chipbtn.on{color:var(--text);border-color:rgba(74,163,255,.55);background:rgba(var(--accent-rgb,74,163,255),.12)}
.ms-save{display:flex;justify-content:flex-end}

/* === Master Schedule (enterprise refresh) === */
.ms-shell{display:flex;flex-direction:column;gap:12px}
.ms-topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap}
.ms-meta{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.ms-controls{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.ms-controls label{min-width:220px}

.ms-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:12px;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:rgba(255,255,255,.03)}
.ms-toolbar-left{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ms-toolbar-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ms-search{display:flex;align-items:center;gap:10px}
.ms-search input{width: min(360px, 76vw)}

.ms-bulk{display:none;flex-direction:column;gap:10px;padding:12px;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:rgba(255,255,255,.02)}
.ms-bulk.show{display:flex}
.ms-bulk-title{font-weight:950}
.ms-bulk-controls{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
.ms-bulk-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

.ms-grid{display:flex;flex-direction:column;gap:10px}
.ms-grid-head{display:grid;grid-template-columns:44px 1.3fr 1.6fr .9fr 140px;gap:12px;padding:10px 12px;border:1px solid rgba(255,255,255,.10);border-radius:14px;background:rgba(255,255,255,.02);font-size:12px;color:var(--muted);font-weight:900;letter-spacing:.02em;text-transform:uppercase}
.ms-grid-body{display:flex;flex-direction:column;gap:10px}
.ms-grid-row{display:grid;grid-template-columns:44px 1.3fr 1.6fr .9fr 140px;gap:12px;align-items:center;padding:12px;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:rgba(0,0,0,.10)}
.ms-check{display:flex;justify-content:center}
.ms-user{display:flex;gap:10px;align-items:flex-start;min-width:0}
.ms-user-text{min-width:0}
.ms-user-name{font-weight:950;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-actions-cell{display:flex;justify-content:flex-end}

@media(max-width:980px){
  .ms-grid-head{display:none}
  .ms-grid-row{grid-template-columns:1fr;align-items:flex-start}
  .ms-actions-cell{justify-content:flex-start}
  .ms-check{justify-content:flex-start}
}
.main.card.pad{overflow:auto;overflow-x:hidden}
.right.card.pad{display:flex;flex-direction:column;gap:12px;overflow:auto}

/* Keep logs at the bottom so nav can use available vertical space */
.side-logs{margin-top:auto}
.section-title{margin:0;font-size:14px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.table{width:100%;border-collapse:separate;border-spacing:0 8px}
.table th{font-size:12px;color:var(--muted);text-align:left;padding:0 8px}
.table td{background:rgba(255,255,255,.03);border:1px solid var(--border);padding:10px 8px}
.table tr td:first-child{border-top-left-radius:12px;border-bottom-left-radius:12px}
.table tr td:last-child{border-top-right-radius:12px;border-bottom-right-radius:12px}

/* Modal */
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(0,0,0,.55);z-index:10000}
.modal.open{display:flex}
.modal .panel{width:min(820px,100%);max-height:min(86vh,900px);overflow:auto;background:linear-gradient(180deg, rgba(12,27,51,.98), rgba(10,22,43,.98));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.modal .panel .head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px;border-bottom:1px solid var(--border)}
.modal .panel .body{padding:16px}

/* Dictionary */
.dict-top{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
@media(max-width:900px){.dict-top{grid-template-columns:1fr}}
.dict-meta{margin-top:12px;padding:10px 12px;border:1px solid rgba(255,255,255,.10);border-radius:14px;background:rgba(255,255,255,.03)}
.dict-content{margin-top:12px;display:flex;flex-direction:column;gap:10px}
.dict-card{padding:14px;border:1px solid rgba(255,255,255,.10);border-radius:18px;background:rgba(0,0,0,.12)}
.dict-card h3{margin:0 0 8px;font-size:14px;letter-spacing:.01em}
.dict-card .small{line-height:1.6}
.dict-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:900px){.dict-grid{grid-template-columns:1fr}}
.dict-illus{width:100%;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.02);padding:10px}

/* Tabs */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.tab{padding:8px 10px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.03);color:var(--muted);cursor:pointer}
.tab.active{color:var(--text);border-color:rgba(74,163,255,.45);background:rgba(var(--accent-rgb,74,163,255),.12)}

/* Rich text editor */
.rte{border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.02)}
.rte-toolbar{display:flex;flex-wrap:wrap;gap:6px;padding:10px;border-bottom:1px solid var(--border)}
.rte-toolbar .btn{box-shadow:none;padding:8px 10px}
.rte-editor{min-height:160px;padding:12px;outline:none}

/* Members scheduling timeline */
.members-wrap{display:flex;flex-direction:column;gap:12px}
.members-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.members-table{width:100%;border-collapse:separate;border-spacing:0 10px}
.members-row{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:14px;padding:12px;display:grid;grid-template-columns:260px 1fr 86px;gap:12px;align-items:center}
.members-row.inactive{opacity:.75}
.status-pill{display:inline-flex;align-items:center;padding:2px 8px;margin-left:8px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);font-weight:800;font-size:11px;color:var(--text)}
.members-meta .m-name{font-weight:800;font-size:15px}
.members-meta .m-sub{color:var(--muted);font-size:12px;margin-top:2px}
.timeline{position:relative;height:34px;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.02);overflow:hidden}
.timeline-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.9);background:linear-gradient(90deg, rgba(0,0,0,.50), rgba(0,0,0,.35));backdrop-filter:blur(2px);}
.timeline .tick{position:absolute;top:0;bottom:0;width:0;border-left:2px dashed rgba(255,255,255,.45)}
.timeline .seg{position:absolute;top:4px;bottom:4px;border-radius:10px;border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-size:11px;color:#0b1220;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 6px}
.timeline .seg{cursor:grab;user-select:none}

/* Locked schedule blocks (Members → timeline)
   Label must be visible directly under the icon/label within the block.
   NOTE: timeline has overflow:hidden, so the label is rendered *inside* the block.
*/
.timeline .seg.is-locked{cursor:not-allowed}
.timeline .seg.is-locked::after{
  content:"🔒 Locked";
  position:absolute;
  left:50%;
  bottom:2px;
  transform:translateX(-50%);
  font-size:9px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:inherit;
  opacity:.9;
  padding:1px 6px;
  border-radius:999px;
  background:rgba(255,255,255,.22);
}
.timeline .seg.selected{outline:2px solid rgba(74,163,255,.95);box-shadow:0 0 0 4px rgba(74,163,255,.15);}
.select-rect{position:absolute;top:0;height:100%;border:1px dashed rgba(74,163,255,.95);background:rgba(var(--accent-rgb,74,163,255),.12);border-radius:10px;pointer-events:none;}
.timeline .seg.ghost{opacity:.85}
.timeline .seg.bad{outline:2px solid rgba(255,91,110,.95);box-shadow:0 0 0 4px rgba(255,91,110,.15);}
.timeline .seg.ok{outline:2px dashed rgba(54,211,153,.75)}

.sched-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:10px 0 6px}
.sched-toolbar .left{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.sched-toolbar .right{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* Member scheduling floating actions */
.sched-swap{position:relative}
.sched-float-actions{position:absolute;top:12px;right:12px;display:flex;align-items:center;justify-content:flex-end;gap:10px;z-index:5}
.sched-float-actions .iconrow{display:flex;gap:8px;align-items:center;justify-content:flex-end}
.sched-float-actions .iconrow .iconbtn{width:32px;height:32px;border-radius:12px}
.sched-float-actions .iconrow .iconbtn.flat{background:transparent;border:1px solid transparent}
.sched-float-actions .iconrow .iconbtn.flat:hover{border-color:var(--border);background:rgba(255,255,255,.02)}
.sched-float-actions #sendSchedule{box-shadow:0 10px 24px rgba(0,0,0,.25)}

/* Paint mode (hour grid) */
.paintbar{display:flex;align-items:center;gap:8px}
.paintbar-inner{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,0.02)}
.paintbar-inner.on{border-color:rgba(125,211,252,0.55);box-shadow:0 0 0 3px rgba(125,211,252,0.12)}
.btn.ghost.active{border-color:rgba(125,211,252,0.55);box-shadow:0 0 0 3px rgba(125,211,252,0.12)}
.grid.paint-enabled .timeline{cursor:crosshair}
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.03);font-size:12px;color:var(--muted)}

/* Week selector helpers */
.weekctl{display:flex;flex-direction:column;gap:6px;align-items:flex-end}
.iconbtn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:10px;border:1px solid var(--border);background:rgba(255,255,255,.03);color:var(--text);cursor:pointer}
.iconbtn:hover{filter:brightness(1.08)}
.week-warn{max-width:520px;text-align:right;padding:8px 10px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);font-weight:700}
.week-warn.locked{border-color:rgba(255,210,77,.35);background:rgba(255,210,77,.10)}
.week-warn.past{border-color:rgba(255,91,110,.35);background:rgba(255,91,110,.10)}
.week-warn.future{border-color:rgba(74,163,255,.35);background:rgba(74,163,255,.10)}

/* Swap animation when changing week/day */
.sched-swap{transition:opacity .18s ease, transform .18s ease}
.sched-swap.swap-anim{opacity:.55;transform:translateY(4px)}

/* Popover */
/* Use theme surfaces so popovers follow Aurora (Ecommerce Light) and any future themes. */
.popover{position:fixed;z-index:9999;min-width:280px;max-width:380px;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb, var(--surface-1) 96%, transparent);box-shadow:var(--shadow);padding:12px 12px 10px 12px;backdrop-filter:blur(6px);color:var(--text)}
.popover .pop-title{font-weight:900;margin-bottom:6px}

/* Audit + trend */
.audit-row{display:flex;justify-content:space-between;gap:14px;padding:10px 12px;border:1px solid rgba(255,255,255,.10);border-radius:14px;background:rgba(255,255,255,.02);margin-bottom:8px}
.audit-left{min-width:0}
.audit-right{white-space:nowrap}
.trend-card{border:1px solid rgba(255,255,255,.10);border-radius:18px;background:rgba(255,255,255,.02);padding:12px}
.trend-svg{width:100%;height:auto;display:block;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(0,0,0,.14);padding:10px;margin-bottom:12px;color:rgba(255,255,255,.92)}
.trend-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(180px,1fr));gap:10px}
.trend-item{border:1px solid rgba(255,255,255,.10);border-radius:16px;padding:10px 12px;background:rgba(255,255,255,.02)}

.role-picker{position:fixed;z-index:9999;min-width:240px;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb, var(--surface-1) 96%, transparent);box-shadow:var(--shadow);padding:10px;backdrop-filter:blur(6px);color:var(--text)}
.role-picker .row{display:flex;gap:8px;align-items:center;justify-content:space-between}
.role-picker .quick{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.role-picker .quick button{font-size:12px;padding:6px 8px;border-radius:10px}
.timeline .seg.dragging{cursor:grabbing;opacity:.9;outline:2px solid rgba(255,255,255,.35)}
.timeline .seg .handle{position:absolute;top:0;bottom:0;width:8px;background:rgba(0,0,0,.12)}
.timeline .seg .handle.l{left:0;cursor:ew-resize}
.timeline .seg .handle.r{right:0;cursor:ew-resize}
.timeline .seg[data-role="lunch"] .handle{display:none} /* fixed 1hr lunch */

/* Keep the timeline ruler column widths perfectly in-sync with .members-row (prevents label/tick drift). */
.timeline-ruler{display:grid;grid-template-columns:300px 1fr 120px;gap:12px;align-items:end;height:22px;margin-bottom:8px}
.timeline-ruler .ruler-track{position:relative;height:22px}
.timeline-ruler .ruler-tick{position:absolute;top:0;bottom:0;width:0;border-left:2px dashed rgba(255,255,255,.45)}
.timeline-ruler .mark{position:absolute;top:0;transform:translateX(-50%);font-size:11px;color:var(--muted);white-space:nowrap}
.timeline-ruler .mark.first{transform:none;left:0}
.timeline-ruler .mark.last{transform:translateX(-100%)}

/* Sidebar activity logs (anchored to bottom so nav gets maximum room) */
.side-logs{margin-top:auto;padding-top:12px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:8px}
.side-logs.side-logs-minimal{padding-top:14px}
.side-logs.side-logs-minimal .side-logs-viewall{width:100%}
.side-logs-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.side-logs-list{display:flex;flex-direction:column;gap:6px;max-height:220px;overflow:hidden}
.logline{display:flex;gap:8px;align-items:baseline;font-size:12px;color:var(--muted);line-height:1.2}
.logline .t{color:var(--muted);min-width:48px}
.logline .m{color:var(--text);opacity:.9;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.logs{display:flex;flex-direction:column;gap:8px}
.logcard{padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.03);display:flex;gap:10px;align-items:flex-start}
.logcard .meta{min-width:170px}
.logcard .meta .when{font-size:12px;color:var(--muted)}
.logcard .meta .who{font-weight:800}
.logcard .detail{flex:1}
.logcard .detail .msg{font-weight:700}
.logcard .detail .small{color:var(--muted)}
.logs{overflow-x:hidden}
.logcard{max-width:100%}
.logcard .detail{min-width:0;overflow:hidden}
.logcard .detail .msg{overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap}
.logcard.is-error{border-color:rgba(255,91,110,.55);background:rgba(255,91,110,.06)}
.logcard.is-error .detail .msg{color:rgba(255,91,110,.95)}
.logcard.is-error .meta .when{color:rgba(255,91,110,.85)}
.logcard.is-error .meta .who{color:rgba(255,255,255,.95)}

/* Team-colored text (matches theme) */
.team-morning .m{color:#6fb7ff}
.team-mid .m{color:#ffb86b}
.team-night .m{color:#c6a4ff}
.seg[data-role="mailbox_manager"]{background:#4aa3ff}
.seg[data-role="back_office"]{background:#ff9f1c} /* Orange */
.seg[data-role="call_onqueue"]{background:#2ecc71} /* Green (Call Available) */
.seg[data-role="call_available"]{background:#2ecc71} /* Green (alias) */
.seg[data-role="lunch"]{background:#22d3ee} /* Cyan */
.seg[data-role="mailbox_call"]{background:#00c853} /* Solid Green */
.seg[data-role="block"]{background:#ff6b6b}
.time-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:6px}
.attach{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.attach-list{display:flex;flex-direction:column;gap:6px}
.attach-item{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 10px;border-radius:12px;border:1px solid var(--border);background:rgba(255,255,255,.03)}
.kv{display:grid;grid-template-columns:160px 1fr;gap:10px;margin:8px 0}
.iconpill{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.03);font-size:12px;color:var(--muted)}
.icon{font-size:14px}

/* Mailbox duty header */
.duty{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:stretch;margin-bottom:14px}
.duty .box{padding:12px;border-radius:14px;border:1px solid var(--border);background:rgba(255,255,255,.03)}
.duty .mid{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:180px}
.timer{font-size:18px;font-weight:800}

/* Chips */
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{padding:4px 8px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.03);font-size:12px;color:var(--muted)}

/* Tabs */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.tab{padding:8px 10px;border-radius:12px;border:1px solid var(--border);background:rgba(255,255,255,.03);cursor:pointer;color:var(--muted)}
.tab.active{color:var(--text);border-color:rgba(74,163,255,.55);background:rgba(var(--accent-rgb,74,163,255),.12)}

/* Rich editor */
.editor{border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.03);overflow:hidden}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;padding:10px;border-bottom:1px solid var(--border)}
.tool{padding:8px 10px;border-radius:12px;border:1px solid var(--border);background:rgba(255,255,255,.03);color:var(--text);cursor:pointer;font-size:12px}
.tool select,.tool input{
  border:1px solid var(--border);
  border-radius:10px;
  padding:6px 8px;
  background:rgba(18,24,38,.92);
  color:var(--text);
}
.tool select option{color:#111;background:#fff}
.editable{min-height:160px;padding:12px;outline:none}
.attachments{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.attach-row{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.03)}

/* Timeline advanced interactions */
.timeline .seg.ghost{pointer-events:none;opacity:.55;filter:saturate(.85);border-style:dashed}
.timeline .seg.ghost.ok{outline:2px solid rgba(127,211,140,.75)}
.timeline .seg.ghost.bad{outline:2px solid rgba(255,107,107,.9)}
.timeline .seg.conflict{outline:2px solid rgba(255,107,107,.95);animation:conflictPulse .35s ease-in-out 0s 2}
@keyframes conflictPulse{0%{transform:translateX(0)}25%{transform:translateX(-2px)}50%{transform:translateX(2px)}75%{transform:translateX(-1px)}100%{transform:translateX(0)}}

/* Day tabs indicator */
.daytabs{display:flex;gap:8px;flex-wrap:wrap}
.daytab{position:relative}
.daytab.hasdata::after{content:"";position:absolute;top:6px;right:8px;width:6px;height:6px;border-radius:999px;background:rgba(74,163,255,.95);box-shadow:0 0 0 3px rgba(74,163,255,.16)}

.daytab .dot{display:inline-block;width:6px;height:6px;border-radius:999px;background:rgba(74,163,255,.95);margin-left:6px;vertical-align:middle;box-shadow:0 0 0 3px rgba(74,163,255,.12)}
.daytab .lock{display:inline-block;margin-left:6px;font-size:11px;opacity:.85;vertical-align:middle}
.lock-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:rgba(255,255,255,.9);font-size:12px;font-weight:800}

/* Coverage meter */
.coverage-meter{display:flex;gap:6px;flex-wrap:wrap}
.coverage-panel{border:1px solid var(--border);border-radius:14px;padding:12px;background:transparent}
.coverage-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.coverage-left{min-width:240px}
.coverage-day-center{flex:1;display:flex;justify-content:center;align-items:center;font-weight:800;letter-spacing:.2px;font-size:14px;line-height:1;padding:8px 10px;border-radius:12px;border:1px solid var(--border);background:rgba(255,255,255,.03);margin-bottom:2px;text-align:center}
.coverage-title{font-size:13px;font-weight:900;letter-spacing:.2px}
.coverage-sub{font-size:11px;color:var(--muted);font-weight:700;max-width:720px}
.coverage-kpis{display:flex;gap:10px;flex-wrap:wrap}
.kpi{
  /* KPI chips (OK HOURS / HEALTH): remove overlay background + reduce size (~70%) */
  min-width:63px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  padding:6px 7px;
  background:transparent;
}
.kpi-label{font-size:10px;color:var(--muted);font-weight:900;text-transform:uppercase;letter-spacing:.8px}
.kpi-val{font-size:14px;font-weight:950;margin-top:2px}
.coverage-scroll{overflow-x:auto;padding-bottom:6px;margin-top:10px}
.coverage-scroll .coverage-meter{flex-wrap:nowrap}
.coverage-scroll .cm-col{min-width:86px}

.toolgroup{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cm-col{min-width:84px;flex:1;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.03);padding:8px}
.cm-col.ok{border-color:rgba(54,211,153,.28);background:rgba(54,211,153,.06)}
.cm-col.bad{border-color:rgba(255,107,107,.28);background:rgba(255,107,107,.06)}
.cm-label{font-size:11px;color:var(--muted);font-weight:800;margin-bottom:6px}
.cm-bars{display:flex;gap:6px;flex-wrap:wrap}
.cm-bar{font-size:11px;font-weight:900;padding:6px 8px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04)}
.cm-bar[data-kind="mailbox"]{color:#9ed3ff}
.cm-bar[data-kind="call"]{color:#ffe0a3}

/* Assign Tasks legend (timeline) */
.timeline-legend{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:10px}
.legend-item{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.02);font-size:12px;color:var(--text);font-weight:800}
.legend-dot{width:10px;height:10px;border-radius:999px;display:inline-block;box-shadow:0 0 0 4px rgba(255,255,255,.06)}

/* Match block colors */
.legend-dot.role-mailbox_manager{background:#4aa3ff}
.legend-dot.role-call_onqueue{background:#36d399} /* Call Available = Green */
.legend-dot.role-back_office{background:#ff9800} /* Back Office = Orange */
.legend-dot.role-lunch{background:#00e5ff}      /* Lunch = Cyan */
.legend-dot.role-mailbox_call{background:#00c853}/* Mailbox + Call = Solid Green */
.legend-dot.role-block{background:#ff6b6b}

/* Settings hub */
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.settings-card{border:1px solid var(--border);background:rgba(255,255,255,.03);border-radius:16px;padding:10px 12px;display:flex;flex-direction:column;gap:6px;min-width:0}
.settings-card-title{font-weight:900;letter-spacing:.2px}
@media (max-width:860px){.settings-grid{grid-template-columns:1fr}}

/* System Check (Settings) */
.syscheck-top{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:flex-end}
.syscheck-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;justify-content:flex-end}
.syscheck-timer{min-width:140px;text-align:right;border:1px solid var(--border);border-radius:14px;padding:10px 12px;background:rgba(255,255,255,.03)}
.syscheck-progress .bar{height:12px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);overflow:hidden}
.syscheck-progress .fill{height:100%;background:rgba(var(--accent-rgb), .65);box-shadow:0 0 0 1px rgba(var(--accent-rgb), .35) inset}
.syscheck-item{border:1px solid rgba(255,255,255,.10);border-radius:16px;padding:12px;background:rgba(255,255,255,.02)}
.syscheck-item+.syscheck-item{margin-top:10px}
.syscheck-item.crit{border-color:rgba(255,90,90,.28);background:rgba(255,90,90,.06)}
.syscheck-item.minor{border-color:rgba(255,255,255,.12)}
.syscheck-item .t{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap}
.syscheck-item .sev{font-weight:900}
.syscheck-item .sev.crit{color:#ff8b8b}
.syscheck-item .sev.minor{color:rgba(255,255,255,.85)}
.syscheck-item .desc{margin-top:8px;white-space:pre-wrap}
.syscheck-item .rec{margin-top:8px}

/* Avoid horizontal page scrolling on complex dashboards */
.page{overflow-x:hidden}

/* Right sidebar tabs */
.rtabs{display:flex;gap:8px;margin-bottom:12px;padding:6px;border:1px solid var(--border);border-radius:16px;background:rgba(255,255,255,.02)}
.rtab{flex:1;border:0;background:transparent;color:var(--muted);padding:8px 10px;border-radius:12px;font-weight:900;letter-spacing:.2px;cursor:pointer}
.rtab:hover{background:rgba(255,255,255,.04);color:var(--text)}
.rtab.active{background:rgba(255,255,255,.08);color:var(--text);border:1px solid rgba(255,255,255,.12)}
.rtab-panels{position:relative;min-height:220px}
.rtab-panel{display:none;animation:rtabIn .18s ease-out}
.rtab-panel.active{display:block}
@keyframes rtabIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* Right sidebar dynamic Guide (Summary tab) */
.rsummary-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}
.rsummary-body{display:flex;flex-direction:column;gap:10px}
.rguide-card{border:1px solid var(--border);background:rgba(255,255,255,.03);border-radius:16px;padding:12px}
.rguide-card details{border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:10px 12px;background:rgba(0,0,0,.08)}
.rguide-card details+details{margin-top:10px}
.rguide-card summary{cursor:pointer;list-style:none;font-weight:900;color:var(--text);display:flex;align-items:center;justify-content:space-between}
.rguide-card summary::-webkit-details-marker{display:none}
.rguide-card .sicon{color:var(--muted);font-size:12px}
.rguide-card .gbody{margin-top:10px;color:var(--text);line-height:1.55}
.rguide-card .gbody ul{margin:8px 0 0 18px}
.rguide-card .gbody li{margin:6px 0}
.rlegend{width:100%;border-collapse:collapse;margin-top:8px}
.rlegend th,.rlegend td{border:1px solid rgba(255,255,255,.08);padding:6px 8px;font-size:12px}
.rlegend th{color:var(--muted);text-align:left}
.rqa{margin-top:8px}
.rqa .q{font-weight:900;margin-top:10px}
.rqa .a{margin-top:4px;color:var(--text)}

/* Guide (Summary) tools + professional layout */
.gtools{display:flex;align-items:center;gap:10px;margin:8px 0 10px}
.gswitch{display:flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.02);cursor:pointer;user-select:none}
.gswitch input{accent-color:var(--accent);transform:translateY(1px)}
.gswitch span{font-weight:900;color:var(--text);font-size:12px}
.gsearch{flex:1;display:flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.02)}
.gsearch-ico{opacity:.85}
.gsearch input{flex:1;background:transparent;border:0;outline:none;color:var(--text);font-weight:700}

.gtabs{
  display:flex;
  gap:8px;
  margin:6px 0 10px;
  padding:6px;
  border:1px solid var(--border);
  border-radius:16px;
  background:rgba(255,255,255,.02);
  /* Prevent any horizontal scrollbar inside the right sidebar */
  flex-wrap:nowrap;
  overflow:hidden;
}
.gtab{
  flex:1;
  min-width:0;
  border:0;
  background:transparent;
  color:var(--muted);
  padding:8px 8px;
  border-radius:12px;
  font-weight:900;
  letter-spacing:.2px;
  cursor:pointer;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.gtab:hover{background:rgba(255,255,255,.04);color:var(--text)}
.gtab.active{background:rgba(255,255,255,.08);color:var(--text);border:1px solid rgba(255,255,255,.12)}

.gask{display:flex;gap:8px;align-items:center;margin-bottom:10px}
.gask input{flex:1;background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:14px;padding:10px 12px;color:var(--text);font-weight:700;outline:none}
.gask input:focus{border-color:rgba(255,255,255,.22)}

.gpanel{border:1px solid var(--border);background:rgba(255,255,255,.02);border-radius:18px;overflow:hidden}
.gpanel-head{padding:12px 12px 10px;border-bottom:1px solid rgba(255,255,255,.08)}
.gpanel-title{font-weight:1000;letter-spacing:.2px}
.gpanel-body{padding:12px}
.gpanel-foot{padding:10px 12px;border-top:1px solid rgba(255,255,255,.08)}
.gpanel-disabled{padding:18px}
.gpanel-disabled-title{font-weight:1000;margin-bottom:6px}

.gqa{display:flex;flex-direction:column;gap:10px}
.gqa-item{border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.12);border-radius:16px;padding:10px 12px}
.gqa-q{font-weight:1000}
.gqa-a{margin-top:6px;color:var(--text);line-height:1.55}

.gnotes{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.gleg{width:100%;border-collapse:collapse}
.gleg th,.gleg td{border:1px solid rgba(255,255,255,.08);padding:7px 8px;font-size:12px}
.gleg th{color:var(--muted);text-align:left}

.gmanual{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:900px){.gmanual{grid-template-columns:1fr}}
.gthumb{border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.10);border-radius:16px;padding:10px;text-align:left;cursor:pointer}
.gthumb:hover{background:rgba(255,255,255,.04)}
.gthumb-img{border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden;background:rgba(0,0,0,.18)}
.gthumb-cap{margin-top:8px;font-weight:900;font-size:12px;color:var(--text)}
.gimg-wrap{display:flex;align-items:center;justify-content:center}
.gimg-wrap svg{width:100%;height:auto;max-height:520px}

.gqs{margin-top:10px}
.gqs-item{margin-top:4px}


/* === Fix: Right sidebar should not be scrollable (fit content) === */
.right.card.pad{overflow:hidden}
.right .tabs{font-size:11px}
.right .rtabs{gap:6px}
.right .rtab{padding:8px 10px;font-size:12px}
.right .guideClassic, .right .guide-tabs, .right .guide-wrap, .right .guide-body{font-size:11.5px;line-height:1.22}
.right .guide-wrap{gap:6px}
.right .guide-body{max-height:none;overflow:visible}
.right input.input, .right select.input{font-size:11.5px;padding:7px 9px}
.right .btn{font-size:11.5px}
.right .gpanel-head{padding:10px 10px 8px}
.right .gpanel-body{padding:10px}
.right .gpanel-foot{padding:8px 10px}
.right .gask input{padding:9px 10px}
.right .gtools{margin:6px 0 8px}
.right .gtools .btn{padding:7px 9px}
.right .section-title{font-size:12px}
.right .small{font-size:11px}

/* === Member multi-select checkbox (clickable + visible) === */
.m-selwrap{display:inline-flex;align-items:center;justify-content:center;margin-right:10px;padding:3px;border-radius:8px;position:relative;z-index:5}
.m-selwrap:hover{background:rgba(255,255,255,.06)}
.m-selwrap .m-select{width:16px;height:16px;cursor:pointer;pointer-events:auto}
.members-row .members-meta{display:flex;flex-direction:column;gap:4px}
.members-row.m-selected{outline:2px solid rgba(74,163,255,.55);box-shadow:0 0 0 4px rgba(74,163,255,.12)}


/* Members Assign Tasks: locked indicator below the timeline (prevents overlap with REST DAY overlay) */
.timeline-wrap{display:flex;flex-direction:column;gap:6px}
.locked-below{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;font-weight:900;letter-spacing:.14em;color:rgba(255,255,255,.78)}
.locked-below .lk-ic{font-size:14px;line-height:1}
body[data-mode="light"] .locked-below{color:rgba(15,23,42,.68)}


/* === World clocks in bottom bar === */
.quicklinks-bar{display:flex;align-items:flex-end;justify-content:flex-start;gap:14px}
.clocks-wrap{flex:0 0 auto;display:flex;gap:10px;align-items:flex-end;justify-content:flex-start;min-width:0;overflow-x:auto;padding-bottom:4px}
.clocks-wrap::-webkit-scrollbar{height:8px}
.clocks-wrap::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:10px}
.quicklinks-inner{flex:1 1 auto;min-width:0}

/* Clock card base */
.wclock{min-width:128px;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:8px 10px;background:rgba(0,0,0,.14);backdrop-filter:blur(10px)}
.wclock .wc-label{font-size:11px;font-weight:900;letter-spacing:.08em;color:rgba(255,255,255,.80);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}
.wclock .wc-time{display:flex;align-items:baseline;gap:6px;margin-top:4px;font-variant-numeric: tabular-nums}
.wclock .wc-h{font-size:20px;font-weight:950}
.wclock .wc-m{font-size:18px;font-weight:950;opacity:.96}
.wclock .wc-sec{font-size:12px;font-weight:900;opacity:.75}
.wclock .wc-sep{opacity:.85}

/* 10 clock design presets (using .wc-<id>) */
.wclock.wc-classic{background:rgba(0,0,0,.14)}
.wclock.wc-round{border-radius:999px}
.wclock.wc-glass{background:rgba(255,255,255,.06)}
.wclock.wc-dashed{border-style:dashed}
.wclock.wc-shadow{box-shadow:0 10px 30px rgba(0,0,0,.25)}
.wclock.wc-gradient{background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(0,0,0,.10))}
.wclock.wc-bold{border-width:2px}
.wclock.wc-saturated{filter:saturate(1.1)}
.wclock.wc-dark{background:rgba(0,0,0,.18)}
.wclock.wc-accent{background:rgba(255,255,255,.04);border-color:rgba(74,163,255,.25)}

/* Clock style ids used by Settings (10 designs) */
.wclock.wc-neon{
  background:rgba(0,0,0,.28);
  border-color:rgba(54,211,153,.35);
  box-shadow:
    0 0 0 1px rgba(54,211,153,.12) inset,
    0 0 22px rgba(54,211,153,.14),
    0 14px 40px rgba(0,0,0,.35);
}
.wclock.wc-neon .wc-time{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
.wclock.wc-neon .wc-h,.wclock.wc-neon .wc-m{ text-shadow: 0 0 10px currentColor, 0 0 24px rgba(54,211,153,.15); }
.wclock.wc-neon .wc-sec{ text-shadow: 0 0 10px rgba(255,255,255,.18); }
.wclock.wc-mono{background:rgba(0,0,0,.14);filter:grayscale(1)}
.wclock.wc-minimal{background:transparent;box-shadow:none;border-color:rgba(255,255,255,.10);padding:6px 8px}
.wclock.wc-terminal{
  background:rgba(0,0,0,.38);
  border-color:rgba(54,211,153,.22);
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  box-shadow: 0 0 0 1px rgba(54,211,153,.10) inset;
}
.wclock.wc-terminal .wc-label{color:rgba(54,211,153,.72)}
.wclock.wc-terminal .wc-h,.wclock.wc-terminal .wc-m{ text-shadow: 0 0 10px currentColor; }
.wclock.wc-chip{background:linear-gradient(180deg, rgba(255,255,255,.09), rgba(0,0,0,.12));border-color:rgba(255,255,255,.16);border-radius:12px}
.wclock.wc-rounded{border-radius:999px;padding:8px 14px}
.wclock.wc-outline{background:transparent;box-shadow:none;border-color:rgba(255,255,255,.18)}


/* clocks modal */
.clocks-grid{display:grid;grid-template-columns:repeat(3, minmax(240px,1fr));gap:14px}
@media(max-width:900px){.clocks-grid{grid-template-columns:1fr}}
.clock-card{border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:12px;background:rgba(255,255,255,.04)}
.clocks-preview-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-top:14px}
.clocks-preview-strip{display:flex;gap:10px;align-items:stretch;margin-top:8px}
.cprev{flex:1;min-width:0;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:10px;background:rgba(0,0,0,.10);cursor:grab;user-select:none;display:flex;flex-direction:column;gap:6px}
.cprev:active{cursor:grabbing}
.cprev.disabled{opacity:.55}
.cprev.dragging{opacity:.55}
.cprev.over{outline:2px solid rgba(74,163,255,.55);box-shadow:0 0 0 4px rgba(74,163,255,.12)}
.cprev-top{display:flex;justify-content:space-between;gap:10px;align-items:center}
.cprev-label{font-size:11px;font-weight:950;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.9}
.cprev-badge{font-size:10px;font-weight:900;color:var(--muted)}
.cprev-time{display:flex;align-items:baseline;gap:5px;font-variant-numeric:tabular-nums}
.cprev-h{font-size:18px;font-weight:950}
.cprev-sep{opacity:.85}
.cprev-m{font-size:16px;font-weight:950;opacity:.96}
.cprev-note{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clock-card .row{gap:10px}
.clock-card .title{font-weight:900;margin-bottom:6px}


/* === MUMS FIX7: Logo glow + build label + clocks preview + logs error styling === */
.brand-build{font-size:6px;opacity:.65;font-weight:800;letter-spacing:.10em;text-transform:uppercase;margin-top:2px}
.brand-name{
  text-shadow:0 0 12px rgba(74,163,255,.40), 0 0 22px rgba(74,163,255,.20);
}
@keyframes mumsGlow{0%,100%{filter:drop-shadow(0 0 10px rgba(74,163,255,.25))}50%{filter:drop-shadow(0 0 18px rgba(74,163,255,.38))}}
.brand-mark{animation:mumsGlow 4.5s ease-in-out infinite}

/* Right sidebar sizing (no internal scroll) */
#summaryNowChip{display:none !important}
.gtabs{gap:6px;padding:5px}
.gtab{font-size:11px;padding:6px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gpanel-title{font-size:12px}
.gpanel-body{padding:10px}
.gqa-q{font-size:12px}
.gqa-a{font-size:11.5px}

/* Clocks settings preview strip */
.clocks-preview{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.02);border-radius:18px;padding:12px;margin-bottom:12px}
.clocks-preview-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:8px}
.clocks-preview-strip{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.wclock.wc-preview{min-width:0;flex:1;max-width:280px;cursor:grab;position:relative;user-select:none}
.wclock.wc-preview.dragging{opacity:.75;cursor:grabbing}
.wclock.wc-preview.dragover{outline:2px dashed rgba(74,163,255,.55);outline-offset:4px}
.wclock.wc-preview .wc-drag{position:absolute;top:6px;right:8px;font-size:12px;opacity:.75}
.wclock.wc-preview.off{opacity:.55;filter:grayscale(.30)}

/* Activity logs page: prevent horizontal scroll + highlight errors */
.logs{overflow-x:hidden}
.logcard{overflow:hidden}
.logcard .detail{overflow-wrap:anywhere;word-break:break-word}

/* Error highlighting in Activity Logs */
.logcard.is-error{
  border-color: rgba(255,107,107,.38);
  background: rgba(255,107,107,.06);
}
.logcard.is-error .meta{
  color: rgba(255,170,170,.92);
}
.logcard.is-error .detail{
  color: rgba(255,215,215,.95);
}

/* === Release Notes (editor + markdown preview) === */
.rn-toolbar{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.rn-editor-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;align-items:start}
@media(max-width:900px){.rn-editor-grid{grid-template-columns:1fr}}
.rn-preview{min-height:140px;max-height:320px;overflow:auto}
.rn-md{font-size:13px;line-height:1.55;color:var(--text)}
.rn-md strong{font-weight:900}
.rn-md em{opacity:.95}
.rn-code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  padding:2px 6px;border-radius:8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10)}
.rn-pre{margin:10px 0;padding:10px 12px;border-radius:14px;overflow:auto;
  background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.10)}
.rn-pre code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:12px}
.rn-h1{font-size:16px;font-weight:950;margin:10px 0 6px}
.rn-h2{font-size:14px;font-weight:950;margin:10px 0 6px}
.rn-h3{font-size:13px;font-weight:950;margin:10px 0 6px;opacity:.95}
.rn-ul,.rn-ol{margin:8px 0 8px 18px}
.rn-ul li,.rn-ol li{margin:4px 0}

/* light mode tweaks */
body[data-mode="light"] .rn-code{background:rgba(15,23,42,.04);border-color:rgba(15,23,42,.12)}
body[data-mode="light"] .rn-pre{background:rgba(15,23,42,.04);border-color:rgba(15,23,42,.12)}

/* === Aurora Light: fix sidebar profile visibility (Shift/Avatar/Initials) === */
body[data-mode="light"] .sp-wrap{color:var(--text)}
body[data-mode="light"] .sp-duty{color:var(--text)}
body[data-mode="light"] .sp-duty .muted{color:var(--muted)}
body[data-mode="light"] .sp-name{color:var(--text)}
body[data-mode="light"] .sp-shift{color:var(--muted)}
body[data-mode="light"] .sp-photo{border-color:rgba(15,23,42,.12);background:rgba(255,255,255,.85)}
body[data-mode="light"] .sp-photo .initials{color:rgba(15,23,42,.92)}
body[data-mode="light"] .sp-position{background:rgba(var(--accent-rgb,74,163,255),.10);border-color:rgba(var(--accent-rgb,74,163,255),.22);color:rgba(15,23,42,.86)}

/* Profile modal (top-right badge) visibility in light themes */
body[data-mode="light"] .up-role{background:rgba(15,23,42,.04);border-color:rgba(15,23,42,.12);color:rgba(15,23,42,.78)}
body[data-mode="light"] .up-sub{color:var(--muted)}

/* === Aurora Light: clocks settings readability === */
body[data-mode="light"] .clock-card{background:rgba(255,255,255,.82);border-color:rgba(15,23,42,.12)}
body[data-mode="light"] .clocks-preview{background:rgba(255,255,255,.72);border-color:rgba(15,23,42,.12)}
body[data-mode="light"] .wclock.wc-preview{border-color:rgba(15,23,42,.12)}

/* === Aurora Light: Guide / Dictionary / Manual readability === */
body[data-mode="light"] .gpanel-body, body[data-mode="light"] .dict-content{color:var(--text)}
body[data-mode="light"] .gpanel-body .muted, body[data-mode="light"] .dict-content .muted{color:var(--muted)}
.logcard.is-error .small{
  color: rgba(255,190,190,.82);
}

/* Prevent any horizontal scroll on log lines */
.logcard .meta,
.logcard .detail{min-width:0}

.logcard.error{
  border-color:rgba(255,107,107,.38);
  background:rgba(255,107,107,.05);
}
.logcard.error .meta{color:rgba(255,200,200,.92)}
.logcard.error .detail{color:rgba(255,230,230,.95)}
.logcard.error .small{color:rgba(255,170,170,.90)}

/* Logs: hard prevent horizontal scroll from long strings */
#logsList, .logs{min-width:0}
.logcard .meta{min-width:170px;flex:0 0 170px}
.logcard .detail{min-width:0}
.logcard .msg, .logcard .small{overflow-wrap:anywhere;word-break:break-word}
.logcard .detail .msg{overflow-wrap:anywhere}
.logcard.is-error{border-color:rgba(255,90,90,.40);background:rgba(255,90,90,.06)}
.logcard.is-error .msg,.logcard.is-error .who{color:#ff6b6b}
.logcard.is-error .small{color:rgba(255,140,140,.90)}


/* === MUMS FIX7.1: Right sidebar tabs fit + logs wrap improvements === */
.gtabs{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:6px;padding:5px}
.gtab{min-width:0}

.logcard{flex-wrap:wrap;min-width:0}
.logcard .meta{flex:0 0 auto}
.logcard .detail{flex:1 1 320px;min-width:0}

/* Error toggle button state */
.btn.active{border-color:rgba(255,90,90,.45);background:rgba(255,90,90,.10)}

/* Right sidebar: prevent horizontal overflow */
.right .gtools{flex-wrap:wrap}
.right .gsearch{min-width:0}
.right .gask{flex-wrap:wrap}
.right .gask input{min-width:0}
.right .rtabs{overflow:hidden}


/* Right sidebar hard lock (no scrollbars) */
.right.card.pad{overflow:hidden !important;overflow-x:hidden !important;overflow-y:hidden !important}
.right.card.pad .rtab-panels,.right.card.pad .rtab-panel,.right.card.pad .rsummary-body{overflow:hidden}
.right.card.pad .gtools,.right.card.pad .gtabs,.right.card.pad .gask{max-width:100%}
.right.card.pad *{box-sizing:border-box}

/* === Clock style ids used by Settings (10 designs) ===
   Align CSS with CLOCK_STYLES in app.js: classic, neon, mono, glass, bold, minimal, terminal, chip, rounded, outline.
   (We keep legacy classes above for backward compatibility.)
*/
.wclock.wc-neon{
  background:rgba(0,0,0,.18);
  border-color:rgba(54,211,153,.35);
  box-shadow:0 0 0 1px rgba(54,211,153,.16), 0 0 18px rgba(54,211,153,.14);
}
.wclock.wc-mono{background:rgba(0,0,0,.14);filter:grayscale(1)}
.wclock.wc-minimal{background:transparent;box-shadow:none;border-color:rgba(255,255,255,.10);padding:6px 8px}
.wclock.wc-terminal{
  background:rgba(0,0,0,.32);
  border-color:rgba(54,211,153,.20);
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
}
.wclock.wc-chip{background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(0,0,0,.14));border-color:rgba(255,255,255,.16);border-radius:12px}
.wclock.wc-rounded{border-radius:999px;padding:8px 14px}
.wclock.wc-outline{background:transparent;box-shadow:none;border-color:rgba(255,255,255,.18)}

/* Small polish: keep clock label readable in rounded styles */
.wclock.wc-rounded .wc-label{max-width:140px}

/* Align world clocks with the main content column (so they don't sit under the left sidebar) */
.clocks-wrap{margin-left:calc(260px + 14px)}
@media(max-width:1100px){.clocks-wrap{margin-left:0}}

/* =====================================================================
   Build 20260119-aurora-fix13
   Aurora Light polish + announcement formatting + quick link glow
   + improved Members Assign Tasks layout (weekly workload pills)
   ===================================================================== */

/* Announcement: show user + time (meta) and keep a clean horizontal bar */
.announce-meta{display:inline !important;white-space:nowrap;margin-left:8px;opacity:.95}

/* Quick links: slightly tighter spacing + glow when configured */
.quicklinks-inner{gap:3px}
.qcircle.filled.glowing{
  box-shadow:
    0 0 0 1px rgba(255,255,255,.10),
    0 0 18px var(--glow, rgba(74,163,255,.35));
}

/* Generic flat icon button (used outside the send-icon row as well) */
.iconbtn.flat{background:transparent;border-color:transparent}
.iconbtn.flat:hover{border-color:var(--border);background:rgba(255,255,255,.02)}

/* Coverage meter edit icon */
.coverage-title-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.coverage-title-row .iconbtn{width:30px;height:30px;border-radius:12px}

/* Members: more readable name + weekly workload pills */
.members-row{grid-template-columns:300px 1fr 120px}
.members-meta .m-name{display:flex;align-items:center;gap:10px}
.members-meta .m-name-text{font-weight:900;font-size:15px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.members-meta .m-stats{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.statpill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);font-size:11px;font-weight:800;color:var(--text)}
.statpill b{font-weight:950}
.statpill[data-kind="mailbox"]{border-color:rgba(74,163,255,.28);background:rgba(74,163,255,.08)}
.statpill[data-kind="back"]{border-color:rgba(255,183,77,.28);background:rgba(255,183,77,.08)}
.statpill[data-kind="call"]{border-color:rgba(54,211,153,.28);background:rgba(54,211,153,.08)}
.statpill[data-kind="case"]{border-color:rgba(167,139,250,.26);background:rgba(167,139,250,.08)}

/* Aurora Light mode: ensure ALL controls + icons remain visible/readable */
body[data-mode="light"]{color-scheme:light}
body[data-mode="light"] .card{background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.88))}
body[data-mode="light"] .btn{background:rgba(15,23,42,.03);border-color:rgba(15,23,42,.12)}
body[data-mode="light"] .btn:hover{filter:brightness(.98)}
body[data-mode="light"] .btn.ghost{background:rgba(255,255,255,.72)}
body[data-mode="light"] .btn.ghost:hover{background:rgba(255,255,255,.82)}
body[data-mode="light"] .btn.primary{color:#fff}
body[data-mode="light"] .input{background:rgba(255,255,255,.90);border-color:rgba(15,23,42,.12);color:var(--text)}
body[data-mode="light"] .badge{background:rgba(15,23,42,.03);border-color:rgba(15,23,42,.12)}
body[data-mode="light"] .timeline{background:rgba(255,255,255,.70)}
body[data-mode="light"] .timeline .tick{border-left:2px dashed rgba(15,23,42,.18)}
body[data-mode="light"] .timeline-overlay{background:linear-gradient(90deg, rgba(255,255,255,.75), rgba(255,255,255,.60));color:rgba(15,23,42,.86)}
body[data-mode="light"] .tab{background:rgba(15,23,42,.03);border-color:rgba(15,23,42,.12)}
body[data-mode="light"] .week-warn{background:rgba(15,23,42,.03);border-color:rgba(15,23,42,.12)}
body[data-mode="light"] .popover{background:rgba(255,255,255,.96);color:var(--text)}
body[data-mode="light"] .popover .small{color:var(--muted)}

/* In dark mode we invert the native calendar icon; in light mode keep it natural */
input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1) brightness(1.75) contrast(1.15);opacity:.9}
body[data-mode="light"] input[type="date"]::-webkit-calendar-picker-indicator{filter:none;opacity:.75}

/* Light mode quick link glow border */
body[data-mode="light"] .qcircle.filled.glowing{
  box-shadow:
    0 0 0 1px rgba(15,23,42,.10),
    0 0 16px var(--glow, rgba(59,130,246,.25));
}

body[data-mode="light"] .statpill{border-color:rgba(15,23,42,.12);background:rgba(15,23,42,.04)}

/* Aurora Light: navigation + modals + non-card grids */
body[data-mode="light"] .nav a.active{background:rgba(15,23,42,.03)}
body[data-mode="light"] .nav a:hover{border-color:rgba(15,23,42,.14)}
body[data-mode="light"] .nav-group.active{border-color:rgba(15,23,42,.12);background:rgba(15,23,42,.02)}
body[data-mode="light"] .nav-group-head:hover{background:rgba(15,23,42,.03)}

body[data-mode="light"] .announce-bar{background:rgba(15,23,42,.02)}
body[data-mode="light"] .announce-bar:hover{border-color:rgba(15,23,42,.18)}

body[data-mode="light"] .quicklinks-bar{background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.55) 40%, rgba(255,255,255,.75))}
body[data-mode="light"] .wclock{background:rgba(255,255,255,.72);border-color:rgba(15,23,42,.12)}
body[data-mode="light"] .wclock .wc-label{color:rgba(15,23,42,.70)}
body[data-mode="light"] .wclock .wc-h, body[data-mode="light"] .wclock .wc-m{color:rgba(15,23,42,.92)}
body[data-mode="light"] .wclock .wc-sec{color:rgba(15,23,42,.62)}


body[data-mode="light"] .modal{background:rgba(15,23,42,.40)}
body[data-mode="light"] .modal .panel{background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.94))}

body[data-mode="light"] .ms-head{border-color:rgba(15,23,42,.12);background:rgba(255,255,255,.70);color:rgba(15,23,42,.68)}
body[data-mode="light"] .ms-row{border-color:rgba(15,23,42,.12);background:rgba(15,23,42,.03)}
body[data-mode="light"] .ms-item{border-color:rgba(15,23,42,.12);background:rgba(255,255,255,.72)}
body[data-mode="light"] .ms-avatar{border-color:rgba(15,23,42,.12);background:rgba(var(--accent-rgb,74,163,255),.12)}
body[data-mode="light"] .ms-toolbar{border-color:rgba(15,23,42,.12);background:rgba(255,255,255,.72)}
body[data-mode="light"] .ms-bulk{border-color:rgba(15,23,42,.12);background:rgba(255,255,255,.70)}
body[data-mode="light"] .ms-grid-head{border-color:rgba(15,23,42,.12);background:rgba(255,255,255,.70);color:rgba(15,23,42,.68)}
body[data-mode="light"] .ms-grid-row{border-color:rgba(15,23,42,.12);background:rgba(15,23,42,.03)}

body[data-mode="light"] .members-row{background:rgba(255,255,255,.72)}
body[data-mode="light"] .qcircle{background:rgba(15,23,42,.04)}
body[data-mode="light"] .avatar, body[data-mode="light"] .avatar-xl{border-color:rgba(15,23,42,.12);background:rgba(15,23,42,.04)}

body[data-mode="light"] .input,
body[data-mode="light"] .select,
body[data-mode="light"] .textarea,
body[data-mode="light"] select{background:rgba(255,255,255,.92);border-color:rgba(15,23,42,.12);color:var(--text)}


/* =====================================================================
   Build 20260120-aurora-fix16
   Design tokens + responsive typography + automatic readability support
   ===================================================================== */

:root{
  /* Semantic surfaces (fallback to existing theme vars) */
  --surface-0: var(--bg);
  --surface-1: var(--panel);
  --surface-2: var(--panel2);

  /* Semantic text */
  --text-0: var(--text);
  --text-muted: var(--muted);

  /* Semantic borders */
  --border-0: var(--border);
  --border-1: color-mix(in srgb, var(--border-0) 70%, transparent);

  /* Controls + overlays */
  --control-bg: rgba(18,24,38,.92);
  --control-border: var(--border-0);
  --control-text: var(--text-0);
  --overlay-scrim: rgba(0,0,0,.55);

  /* Button glass (dark default) */
  --btn-glass-top: rgba(255,255,255,.08);
  --btn-glass-bot: rgba(255,255,255,.02);

  /* Typography scale (responsive, stable across layouts) */
  --fs-xs: clamp(11px, 0.25vw + 10px, 12px);
  --fs-sm: clamp(12px, 0.30vw + 11px, 13px);
  --fs-base: clamp(13px, 0.35vw + 11px, 14px);
  --fs-lg: clamp(14px, 0.55vw + 12px, 16px);
  --fs-xl: clamp(18px, 0.95vw + 14px, 22px);
  --fs-2xl: clamp(22px, 1.45vw + 16px, 28px);

  --lh-tight: 1.15;
  --lh-base: 1.45;
}

body{font-size:var(--fs-base);line-height:var(--lh-base);color:var(--text-0)}
.small{font-size:var(--fs-xs);color:var(--text-muted)}
.h1{font-size:var(--fs-2xl);line-height:var(--lh-tight)}
.h2{font-size:var(--fs-lg)}

/* Unify component styling on semantic tokens (prevents theme regressions) */
.card{background:linear-gradient(180deg, color-mix(in srgb, var(--surface-1) 92%, transparent), color-mix(in srgb, var(--surface-1) 86%, transparent));border-color:var(--border-0)}

.btn{
  border-color:var(--border-0);
  color:var(--text-0);
  background:linear-gradient(180deg, var(--btn-glass-top), var(--btn-glass-bot));
}
.btn:hover{border-color:color-mix(in srgb, var(--border-0) 70%, var(--text-0))}
.btn.primary{color:var(--accent-contrast, #fff)}

.input,.select,.textarea,select{
  background:var(--control-bg);
  border-color:var(--control-border);
  color:var(--control-text);
}

.modal{background:var(--overlay-scrim)}
.modal .panel{background:linear-gradient(180deg, color-mix(in srgb, var(--surface-1) 98%, transparent), color-mix(in srgb, var(--surface-1) 94%, transparent))}

/* Native date/time pickers: use correct scheme per mode */
body[data-mode="dark"] input[type="date"], body[data-mode="dark"] .input[type="date"],
body[data-mode="dark"] input[type="time"], body[data-mode="dark"] .input[type="time"]{color-scheme:dark}
body[data-mode="light"] input[type="date"], body[data-mode="light"] .input[type="date"],
body[data-mode="light"] input[type="time"], body[data-mode="light"] .input[type="time"]{color-scheme:light}

/* Light mode token overrides (Aurora Light and any future light themes) */
body[data-mode="light"]{
  --overlay-scrim: rgba(15,23,42,.40);
  --control-bg: rgba(255,255,255,.92);
  --control-border: rgba(15,23,42,.12);
  /* Make default buttons visibly clickable on light panels */
  --btn-glass-top: rgba(15,23,42,.06);
  --btn-glass-bot: rgba(15,23,42,.03);
}

/* =====================================================================
   Build 20260120-aurora-fix18
   UI visibility hardening: sticky modal headers (close X), stronger
   primary buttons in light mode, and Aurora Light coverage readability.
   ===================================================================== */

/* 1) Close (X) buttons: keep them anchored in the upper-right and visible
      while scrolling long modal bodies */
.modal .panel .head,
.modal .panel .modal-head{
  position: sticky;
  top: 0;
  z-index: 50;
  /* Keep header readable over scrolled content */
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--surface-1) 96%, transparent),
    color-mix(in srgb, var(--surface-1) 90%, transparent)
  );
  backdrop-filter: blur(10px);
}

.modal .panel .head{padding-right:56px}
.modal .panel .modal-head{padding-right:56px}

/* Target the close icon button in modal heads */
.modal .panel .head > .btn.ghost,
.modal .panel .modal-head > .btn.ghost{
  position: absolute;
  right: 14px;
  top: 12px;
  margin: 0;
}

/* 2) Buttons: ensure primary buttons remain high-contrast in light mode.
      The default .btn.primary is intentionally translucent for dark UIs;
      on Aurora Light this can become too faint and "disappear". */
body[data-mode="light"] .btn.primary{
  background: linear-gradient(180deg,
    rgba(var(--accent-rgb,74,163,255), .95),
    rgba(var(--accent-rgb,74,163,255), .78)
  );
  border-color: rgba(var(--accent-rgb,74,163,255), .85);
  color: var(--accent-contrast, #fff);
}
body[data-mode="light"] .btn.danger{
  background: linear-gradient(180deg, rgba(255,91,110,.92), rgba(255,91,110,.75));
  border-color: rgba(255,91,110,.80);
  color: #fff;
}
body[data-mode="light"] .btn{
  /* Improve visibility for non-primary buttons as well */
  border-color: rgba(15,23,42,.16);
}
body[data-mode="light"] .btn.ghost{
  background: rgba(255,255,255,.86);
  border-color: rgba(15,23,42,.12);
}

/* 3) Aurora Light: Coverage Meter parameter colors and chips */
body[data-mode="light"] .coverage-day-center{
  background: rgba(15,23,42,.03);
  border-color: rgba(15,23,42,.12);
  color: rgba(15,23,42,.92);
}
body[data-mode="light"] .cm-col{background:rgba(15,23,42,.02);border-color:rgba(15,23,42,.12)}
body[data-mode="light"] .cm-col.ok{border-color:rgba(16,185,129,.35);background:rgba(16,185,129,.10)}
body[data-mode="light"] .cm-col.bad{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.10)}
body[data-mode="light"] .cm-label{color:rgba(15,23,42,.72)}
body[data-mode="light"] .cm-bar{
  border-color: rgba(15,23,42,.14);
  background: rgba(255,255,255,.92);
}
/* Darken mailbox/call colors for readability on light surfaces */
body[data-mode="light"] .cm-bar[data-kind="mailbox"]{color:#0b5ed7}
body[data-mode="light"] .cm-bar[data-kind="call"]{color:#92400e}


/* Theme Audit panel */
.theme-audit{margin-top:14px}
.theme-audit .audit-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:900px){.theme-audit .audit-grid{grid-template-columns:1fr}}
.audit-row{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 10px;border-radius:12px;border:1px solid var(--border-0);background:rgba(255,255,255,.03)}
body[data-mode="light"] .audit-row{background:rgba(15,23,42,.03)}
.audit-pill{font-size:11px;font-weight:950;padding:4px 8px;border-radius:999px;border:1px solid var(--border-0);background:rgba(255,255,255,.04)}
body[data-mode="light"] .audit-pill{background:rgba(255,255,255,.85)}
.audit-pill.pass{border-color:rgba(54,211,153,.35)}
.audit-pill.warn{border-color:rgba(251,191,36,.40)}
.audit-pill.fail{border-color:rgba(255,91,110,.40)}


/* Theme audit (Theme Lab) */
.theme-audit{margin-top:14px;border:1px solid var(--border-0);border-radius:16px;padding:12px;background:rgba(255,255,255,.03)}
.theme-audit .ta-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
@media(max-width:900px){.theme-audit .ta-grid{grid-template-columns:1fr}}
.theme-audit .ta-row{display:flex;justify-content:space-between;gap:10px;align-items:center;border:1px solid var(--border-0);border-radius:14px;padding:10px;background:rgba(255,255,255,.02)}
.theme-audit .ta-k{font-weight:900}
.theme-audit .ta-v{font-variant-numeric:tabular-nums;color:var(--text-muted)}
.theme-audit .ta-badge{padding:4px 10px;border-radius:999px;font-size:11px;font-weight:900;border:1px solid var(--border-0)}
.theme-audit .ta-badge.pass{background:rgba(54,211,153,.10);border-color:rgba(54,211,153,.26)}
.theme-audit .ta-badge.fail{background:rgba(255,91,110,.10);border-color:rgba(255,91,110,.30)}


/* Mailbox time override (Super Admin) */
.time-override-preview{
  border:1px solid var(--border);
  background: var(--surface-2);
  border-radius: 14px;
  padding: 12px 14px;
  margin-bottom: 12px;
}

.badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface-2);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
}
.badge.override{
  border-color: rgba(var(--accent-rgb), 0.55);
  background: rgba(var(--accent-rgb), 0.12);
  color: var(--text);
}



/* =========================
   Reminders (My / Team)
   ========================= */
.topbar-center{ position:relative; }

.reminder-float-host{
  position:absolute;
  left:0;
  top:0;
  height:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 10px 10px 12px;
  pointer-events:none; /* cards re-enable */
  z-index:50;
}

.reminder-card{
  pointer-events:auto;
  min-width: 240px;
  max-width: 440px;
  border-radius: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(148,163,184,.35);
  background: color-mix(in srgb, var(--surface-1) 92%, transparent);
  box-shadow: 0 6px 14px rgba(0,0,0,.18);
  backdrop-filter: blur(10px);
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
  position:relative;
}
.reminder-card:hover{ transform: translateY(-1px); }
.reminder-card.my{
  border-color: rgba(34,197,94,.55);
  box-shadow: 0 6px 14px rgba(0,0,0,.18);
  background: color-mix(in srgb, var(--surface-1) 90%, rgba(34,197,94,.10));
}
.reminder-card.team{
  border-color: rgba(239,68,68,.55);
  box-shadow: 0 6px 14px rgba(0,0,0,.18);
  background: color-mix(in srgb, var(--surface-1) 90%, rgba(239,68,68,.10));
}
.reminder-card.high.my{
  border-color: rgba(34,197,94,.75);
  box-shadow: 0 10px 22px rgba(0,0,0,.22);
}
.reminder-card.high.team{
  border-color: rgba(239,68,68,.75);
  box-shadow: 0 10px 22px rgba(0,0,0,.22);
}

.reminder-card.escalated{
  animation: reminderPulse 1.1s ease-in-out infinite;
}
@keyframes reminderPulse{
  0%{ transform: translateY(0); }
  50%{ transform: translateY(-1px); }
  100%{ transform: translateY(0); }
}


.reminder-card.more{
  border-color: rgba(var(--accent-rgb), .55) !important;
  background: rgba(var(--accent-rgb), .10) !important;
  box-shadow: 0 0 0 1px rgba(var(--accent-rgb), .20), 0 10px 22px rgba(0,0,0,.25) !important;
}

.rem-days{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding:10px 10px 8px;
  border: 1px dashed rgba(255,255,255,.14);
  border-radius: 12px;
  background: rgba(0,0,0,.06);
}
.rem-day{
  display:flex;
  align-items:center;
  gap:8px;
  font-size: 12px;
  user-select:none;
}
.rem-day input{
  transform: translateY(0.5px);
}
.rem-settings-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 820px){
  .rem-settings-grid{ grid-template-columns: 1fr; }
}


.reminder-card .rc-top{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.reminder-card .rc-badge{
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 5px 8px;
  border-radius: 999px;
  line-height: 1;
  border: 1px solid rgba(34,197,94,.55);
  background: rgba(34,197,94,.10);
  color: var(--text);
  flex:0 0 auto;
}
.reminder-card.team .rc-badge{
  border-color: rgba(239,68,68,.55);
  background: rgba(239,68,68,.12);
}
.reminder-card .rc-title{
  font-weight: 700;
  font-size: 14px;
  margin:0;
  color: var(--text);
  line-height:1.2;
}
.reminder-card .rc-meta{
  margin-top:2px;
  font-size: 12px;
  opacity:.85;
}
.reminder-card .rc-actions{
  display:flex;
  gap:8px;
  align-items:center;
  margin-left:auto;
  flex:0 0 auto;
}
.reminder-card .rc-close{
  appearance:none;
  border: 1px solid var(--border);
  background: rgba(0,0,0,.12);
  color: var(--text);
  border-radius: 10px;
  padding: 6px 10px;
  font-size: 12px;
  cursor:pointer;
}
.reminder-card.my .rc-close{ border-color: rgba(34,197,94,.45); }
.reminder-card.team .rc-close{ border-color: rgba(239,68,68,.45); }
.reminder-card .rc-close:hover{ filter: brightness(1.08); }

.reminder-card .rc-body{
  display:none;
  margin-top:10px;
  padding-top:10px;
  border-top: 1px solid rgba(148,163,184,.22);
  font-size: 13px;
}
.reminder-card.expanded .rc-body{ display:block; }
.reminder-card .rc-details{
  white-space: pre-wrap;
  opacity:.92;
}
.reminder-card .rc-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:8px;
  font-size:12px;
  opacity:.9;
}
.reminder-card .rc-pills{
  display:flex;
  gap:8px;
  margin-top:10px;
  flex-wrap:wrap;
}
.reminder-pill{
  border:1px solid var(--border);
  background: rgba(0,0,0,.12);
  color: var(--text);
  border-radius: 999px;
  padding: 7px 10px;
  font-size: 12px;
  cursor:pointer;
}
.reminder-card.my .reminder-pill{ border-color: rgba(34,197,94,.45); }
.reminder-card.team .reminder-pill{ border-color: rgba(239,68,68,.45); }
.reminder-pill:hover{ filter: brightness(1.08); }
.reminder-pill.primary{
  background: rgba(var(--accent-rgb), .18);
  border-color: rgba(var(--accent-rgb), .35);
}

.reminder-form{ max-width: 980px; }
.reminder-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 820px){
  .reminder-grid{ grid-template-columns: 1fr; }
  .reminder-card{ min-width: 180px; max-width: 92vw; }
  .reminder-float-host{ padding-left: 8px; }
}


/* =========================
   Reminders Pages (Enterprise)
   ========================= */
.rem-page{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.rem-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.rem-head .title{
  font-size:18px;
  font-weight:800;
  margin:0;
}
.rem-head .sub{
  margin-top:6px;
  font-size:12px;
  opacity:.82;
}
.rem-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.rem-kpis{
  display:grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap:10px;
}
@media (max-width: 980px){
  .rem-kpis{ grid-template-columns: repeat(2, minmax(160px, 1fr)); }
}
@media (max-width: 520px){
  .rem-kpis{ grid-template-columns: 1fr; }
}
.rem-kpi{
  border:1px solid rgba(148,163,184,.22);
  border-radius: 12px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--surface-1) 96%, transparent);
}
.rem-kpi .k{
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.75;
}
.rem-kpi .v{
  margin-top:6px;
  font-size:22px;
  font-weight:800;
}
.rem-kpi .h{
  margin-top:4px;
  font-size:12px;
  opacity:.78;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rem-layout{
  display:grid;
  grid-template-columns: 360px 1fr;
  gap:12px;
  align-items:start;
}
@media (max-width: 980px){
  .rem-layout{ grid-template-columns: 1fr; }
}
.rem-panel{
  border:1px solid rgba(148,163,184,.22);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface-1) 96%, transparent);
  box-shadow: 0 6px 14px rgba(0,0,0,.12);
}
.rem-panel .ph{
  padding: 12px 12px 10px;
  border-bottom: 1px solid rgba(148,163,184,.18);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.rem-panel .ph h3{
  margin:0;
  font-size:14px;
  font-weight:800;
}
.rem-panel .pb{
  padding:12px;
}
.rem-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:10px;
}
.rem-field .lbl{
  font-size:12px;
  opacity:.85;
}
.rem-inline{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
}
@media (max-width:520px){
  .rem-inline{ grid-template-columns: 1fr; }
}
.rem-badges{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.rem-badge{
  font-size:11px;
  padding: 4px 8px;
  border-radius: 999px;
  border:1px solid rgba(148,163,184,.26);
  background: rgba(0,0,0,.10);
}
.rem-badge.ok{ border-color: rgba(34,197,94,.45); }
.rem-badge.warn{ border-color: rgba(234,179,8,.50); }
.rem-badge.danger{ border-color: rgba(239,68,68,.50); }
.rem-badge.neutral{ border-color: rgba(148,163,184,.26); }
.rem-filterbar{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  padding: 12px 12px 10px;
  border-bottom: 1px solid rgba(148,163,184,.18);
}
.rem-filterbar .left{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.rem-filterbar .right{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.table .actions{
  display:flex;
  gap:6px;
  justify-content:flex-end;
  flex-wrap:wrap;
}
.btn.tiny{
  padding: 5px 9px;
  font-size: 12px;
  border-radius: 10px;
}
.rem-note{
  padding: 10px 12px;
  font-size: 12px;
  opacity:.8;
  border-top: 1px solid rgba(148,163,184,.18);
}


/* =======================================================================
   OFFLINE-FIRST REBUILD: Cursor + Sidebar + Modern Icons
   ======================================================================= */

/* Always-visible custom cursor (mouse). Native cursor is hidden. */
body.app-cursor-on, body.app-cursor-on * { cursor: none !important; }
input, textarea, [contenteditable="true"] { caret-color: var(--text); }

/* Cursor element (high contrast, OS-independent) */
.app-cursor{
  position: fixed;
  left: 0; top: 0;
  width: 18px; height: 18px;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  border: 2px solid rgba(15,23,42,.85);
  background: rgba(15,23,42,.12);
  box-shadow: 0 6px 18px rgba(0,0,0,.25);
  pointer-events: none;
  z-index: 999999;
  opacity: 1;
  transition: opacity .15s ease, transform .06s linear, background .15s ease, border-color .15s ease;
}
body[data-mode="light"] .app-cursor{
  border-color: rgba(15,23,42,.92);
  background: rgba(255,255,255,.35);
  box-shadow: 0 6px 18px rgba(15,23,42,.14);
}
.app-cursor.is-hidden{ opacity: 0; }
.app-cursor.is-down{ transform: translate(-50%, -50%) scale(.92); }
.app-cursor .app-cursor-dot{
  position:absolute; left:50%; top:50%;
  width:4px; height:4px;
  border-radius:999px;
  background: rgba(255,255,255,.95);
  transform: translate(-50%, -50%);
}
body[data-mode="light"] .app-cursor .app-cursor-dot{ background: rgba(15,23,42,.92); }

/* I-beam indicator when hovering inputs/textareas/contenteditable */
.app-cursor .app-cursor-ibar{
  position:absolute; left:50%; top:50%;
  width:2px; height:14px;
  border-radius:2px;
  background: rgba(255,255,255,.92);
  transform: translate(-50%, -50%);
  opacity: 0;
}
body[data-mode="light"] .app-cursor .app-cursor-ibar{ background: rgba(15,23,42,.92); }
.app-cursor.is-text{
  width: 14px; height: 22px;
  border-radius: 12px;
  background: rgba(15,23,42,.06);
}
body[data-mode="light"] .app-cursor.is-text{ background: rgba(255,255,255,.55); }
.app-cursor.is-text .app-cursor-dot{ opacity: 0; }
.app-cursor.is-text .app-cursor-ibar{ opacity: 1; }

/* ── Sidebar nav: layout + overflow fix ───────────────────────────────────── */
/* .side uses flex-column so the nav gets all remaining height and scrolls    */
/* internally — the parent must NOT clip Y axis or nav items get cut off.     */
.side{
  position:relative;
  overflow:hidden;          /* clip X only; flex children manage Y */
  display:flex;
  flex-direction:column;
}

/* Ensure sidebar navigation is always visible/clickable when expanded */
body:not(.sidebar-collapsed) .side #nav,
body:not(.sidebar-collapsed) .side .nav{
  display:flex;
  flex-direction:column;
  visibility:visible;
  pointer-events:auto;
}
body:not(.sidebar-collapsed) .side .nav{position:relative; z-index:4;}
body:not(.sidebar-collapsed) .side .usercard{position:relative; z-index:3;}

/* Nav scrolls within its own flex area — no parent clip needed */
.side .nav{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  margin-top:6px;
  padding-right:2px;
}

/* Nav items: always full-width, box-sizing prevents padding overflow */
.nav .nav-item,.nav .nav-group-head{
  display:flex;align-items:center;gap:10px;
  width:100%;box-sizing:border-box;
  border-radius:10px;padding:8px 10px;
  color:var(--text);text-decoration:none;
  border:1px solid transparent;background:transparent;
  cursor:pointer;transition:background .12s,border-color .12s;
}
.nav .nav-item:hover,.nav .nav-group-head:hover{background:rgba(37,99,235,.06);border-color:rgba(37,99,235,.18)}
.nav .nav-item.active{background:rgba(37,99,235,.10);border-color:rgba(37,99,235,.30);box-shadow:inset 3px 0 0 var(--accent)}
.nav .nav-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700;letter-spacing:.2px}
/* Icon: fixed-width so labels always align regardless of icon presence */
.nav .nav-ico{width:18px;height:18px;flex:0 0 18px;background:currentColor;opacity:.85}

/* Collapsed sidebar */
body.sidebar-collapsed .side{width:72px;padding:12px}
body.sidebar-collapsed .side .usercard, 
body.sidebar-collapsed .side .small,
body.sidebar-collapsed .side .side-logs{display:none}
body.sidebar-collapsed .nav .nav-label{display:none}
body.sidebar-collapsed .nav .nav-item,
body.sidebar-collapsed .nav .nav-group-head{justify-content:center;padding:10px}
body.sidebar-collapsed .nav .nav-item::after,
body.sidebar-collapsed .nav .nav-group-head::after{
  content:attr(data-label);
  position:absolute;
  left:78px;
  background:var(--text);
  color:#fff;
  padding:6px 10px;
  border-radius:10px;
  font-size:12px;
  white-space:nowrap;
  opacity:0;
  transform:translateY(-4px);
  pointer-events:none;
  transition:opacity .12s,transform .12s;
  box-shadow:var(--shadow2);
}
body.sidebar-collapsed .nav .nav-item:hover::after,
body.sidebar-collapsed .nav .nav-group-head:hover::after{
  opacity:1;
  transform:translateY(0);
}


#nav.nav{
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 2px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.nav a,
.nav-group-head{
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  font-size: clamp(11px, 1.05vw, 13px);
  letter-spacing: .1px;
}
.nav a{ position: relative; }
.nav a > span,
.nav-group-head > span{ min-width: 0; }
.nav a .nav-label,
.nav-group-head .lbl{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Selected/hover effects (enterprise, clean) */
.nav a.active{
  background: rgba(110,231,255,.10);
  border-color: rgba(110,231,255,.28);
}
body[data-mode="light"] .nav a.active{
  background: rgba(2,132,199,.10);
  border-color: rgba(2,132,199,.25);
}
.nav a.active::before{
  content: "";
  position:absolute;
  left: 2px; top: 8px; bottom: 8px;
  width: 3px;
  border-radius: 6px;
  background: rgba(110,231,255,.95);
}
body[data-mode="light"] .nav a.active::before{ background: rgba(2,132,199,.95); }
.nav a:hover{
  background: color-mix(in srgb, var(--surface-1) 68%, transparent);
}
body[data-mode="light"] .nav a:hover{
  background: rgba(15,23,42,.03);
}

/* Modern consistent monochrome icons using SVG masks */
.nav-ico{
  width: 18px; height: 18px;
  flex: 0 0 18px;
  display:inline-block;
  background: currentColor;
  opacity: .9;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}
.nav a.active .nav-ico{ opacity: 1; }

/* Icon masks (inline SVG data URIs) */
.nav-ico[data-ico="dashboard"]{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M3 13h8V3H3v10zM13 21h8V11h-8v10zM13 3h8v6h-8V3zM3 21h8v-6H3v6z'/%3E%3C/svg%3E");
  mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M3 13h8V3H3v10zM13 21h8V11h-8v10zM13 3h8v6h-8V3zM3 21h8v-6H3v6z'/%3E%3C/svg%3E\");
}
.nav-ico[data-ico="mailbox"]{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4 4h16v12H4z'/%3E%3Cpath d='M22 16H2v4h20v-4z'/%3E%3Cpath d='M7 16v-2h10v2'/%3E%3C/svg%3E");
  mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4 4h16v12H4z'/%3E%3Cpath d='M22 16H2v4h20v-4z'/%3E%3Cpath d='M7 16v-2h10v2'/%3E%3C/svg%3E\");
}
.nav-ico[data-ico="members"]{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
  mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E\");
}
.nav-ico[data-ico="tasks"]{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M9 11l3 3L22 4'/%3E%3Cpath d='M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11'/%3E%3C/svg%3E");
  mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M9 11l3 3L22 4'/%3E%3Cpath d='M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11'/%3E%3C/svg%3E\");
}
.nav-ico[data-ico="schedule"]{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
  mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E\");
}
.nav-ico[data-ico="users"]{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M19 8v6'/%3E%3Cpath d='M22 11h-6'/%3E%3C/svg%3E");
  mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M19 8v6'/%3E%3Cpath d='M22 11h-6'/%3E%3C/svg%3E\");
}
.nav-ico[data-ico="announce"]{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M3 11l18-5v12L3 13v-2z'/%3E%3Cpath d='M11 19a2 2 0 0 1-2-2v-4'/%3E%3C/svg%3E");
  mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M3 11l18-5v12L3 13v-2z'/%3E%3Cpath d='M11 19a2 2 0 0 1-2-2v-4'/%3E%3C/svg%3E\");
}
.nav-ico[data-ico="reminder_me"]{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 22a2 2 0 0 0 2-2H10a2 2 0 0 0 2 2z'/%3E%3Cpath d='M18 16v-5a6 6 0 1 0-12 0v5l-2 2h16l-2-2z'/%3E%3C/svg%3E");
  mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 22a2 2 0 0 0 2-2H10a2 2 0 0 0 2 2z'/%3E%3Cpath d='M18 16v-5a6 6 0 1 0-12 0v5l-2 2h16l-2-2z'/%3E%3C/svg%3E\");
}
.nav-ico[data-ico="reminder_team"]{
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 22a2 2 0 0 0 2-2H10a2 2 0 0 0 2 2z'/%3E%3Cpath d='M18 16v-5a6 6 0 1 0-12 0v5l-2 2h16l-2-2z'/%3E%3Cpath d='M18 8a3 3 0 0 1 3 3'/%3E%3Cpath d='M6 8a3 3 0 0 0-3 3'/%3E%3C/svg%3E");
  mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 22a2 2 0 0 0 2-2H10a2 2 0 0 0 2 2z'/%3E%3Cpath d='M18 16v-5a6 6 0 1 0-12 0v5l-2 2h16l-2-2z'/%3E%3Cpath d='M18 8a3 3 0 0 1 3 3'/%3E%3Cpath d='M6 8a3 3 0 0 0-3 3'/%3E%3C/svg%3E\");
}

/* Sidebar padding - balanced so nav items fill full width */
.side.card.pad{ padding: 12px 10px 12px 12px; }

/* Topbar icons */
.ico[data-ico="notes"]{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M6%202h9l5%205v15a2%202%200%200%201-2%202H6a2%202%200%200%201-2-2V4a2%202%200%200%201%202-2z%22/%3E%3Cpath%20d=%22M14%202v6h6%22%20fill=%22none%22/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M6%202h9l5%205v15a2%202%200%200%201-2%202H6a2%202%200%200%201-2-2V4a2%202%200%200%201%202-2z%22/%3E%3Cpath%20d=%22M14%202v6h6%22%20fill=%22none%22/%3E%3C/svg%3E")}
.ico[data-ico="book"]{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M6%203h11a2%202%200%200%201%202%202v14a1%201%200%200%201-1%201H7a3%203%200%200%200-3%203V5a2%202%200%200%201%202-2z%22/%3E%3Cpath%20d=%22M6%203v16a1%201%200%200%200%201%201h11%22%20fill=%22none%22/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M6%203h11a2%202%200%200%201%202%202v14a1%201%200%200%201-1%201H7a3%203%200%200%200-3%203V5a2%202%200%200%201%202-2z%22/%3E%3Cpath%20d=%22M6%203v16a1%201%200%200%200%201%201h11%22%20fill=%22none%22/%3E%3C/svg%3E")}
.ico[data-ico="gear"]{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M12%2015.5a3.5%203.5%200%201%200%200-7%203.5%203.5%200%200%200%200%207z%22/%3E%3Cpath%20d=%22M19.4%2015a7.9%207.9%200%200%200%20.1-1l2-1.5-2-3.5-2.4%201a8.4%208.4%200%200%200-1.7-1l-.4-2.6h-4l-.4%202.6a8.4%208.4%200%200%200-1.7%201l-2.4-1-2%203.5%202%201.5a7.9%207.9%200%200%200%20.1%201%207.9%207.9%200%200%200-.1%201l-2%201.5%202%203.5%202.4-1a8.4%208.4%200%200%200%201.7%201l.4%202.6h4l.4-2.6a8.4%208.4%200%200%200%201.7-1l2.4%201%202-3.5-2-1.5a7.9%207.9%200%200%200-.1-1z%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M12%2015.5a3.5%203.5%200%201%200%200-7%203.5%203.5%200%200%200%200%207z%22/%3E%3Cpath%20d=%22M19.4%2015a7.9%207.9%200%200%200%20.1-1l2-1.5-2-3.5-2.4%201a8.4%208.4%200%200%200-1.7-1l-.4-2.6h-4l-.4%202.6a8.4%208.4%200%200%200-1.7%201l-2.4-1-2%203.5%202%201.5a7.9%207.9%200%200%200%20.1%201%207.9%207.9%200%200%200-.1%201l-2%201.5%202%203.5%202.4-1a8.4%208.4%200%200%200%201.7%201l.4%202.6h4l.4-2.6a8.4%208.4%200%200%200%201.7-1l2.4%201%202-3.5-2-1.5a7.9%207.9%200%200%200-.1-1z%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22/%3E%3C/svg%3E")}
.ico[data-ico="menu"]{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M4%206h16v2H4V6zm0%205h16v2H4v-2zm0%205h16v2H4v-2z%22/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M4%206h16v2H4V6zm0%205h16v2H4v-2zm0%205h16v2H4v-2z%22/%3E%3C/svg%3E")}

/* Mobile-only controls (hidden on desktop; shown by mobile media query) */
#toggleUserOnlineBar, #toggleQuickLinksBar{display:none}
.mob-sheet-head{display:none}
.mobile-fab-stack{display:none}

/* Additional topbar/FAB icons */
.ico[data-ico="users"]{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M16%2011a3%203%200%201%200-2.999-3A3%203%200%200%200%2016%2011zm-8%200a3%203%200%201%200-3-3a3%203%200%200%200%203%203zm0%202c-2.67%200-8%201.34-8%204v2h12v-2c0-2.66-5.33-4-8-4zm8%200c-.32%200-.68.02-1.06.06A4.8%204.8%200%200%201%2018%2017v2h6v-2c0-2.66-5.33-4-8-4z%22%2F%3E%3C%2Fsvg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M16%2011a3%203%200%201%200-2.999-3A3%203%200%200%200%2016%2011zm-8%200a3%203%200%201%200-3-3a3%203%200%200%200%203%203zm0%202c-2.67%200-8%201.34-8%204v2h12v-2c0-2.66-5.33-4-8-4zm8%200c-.32%200-.68.02-1.06.06A4.8%204.8%200%200%201%2018%2017v2h6v-2c0-2.66-5.33-4-8-4z%22%2F%3E%3C%2Fsvg%3E")}
.ico[data-ico="link"]{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M10.59%2013.41a1%201%200%200%201%200-1.41l2.12-2.12a1%201%200%201%201%201.41%201.41l-2.12%202.12a1%201%200%200%201-1.41%200z%22%2F%3E%3Cpath%20d%3D%22M8%2012a4%204%200%200%201%204-4h2a1%201%200%201%201%200%202h-2a2%202%200%200%200%200%204h2a1%201%200%201%201%200%202h-2a4%204%200%200%201-4-4z%22%2F%3E%3Cpath%20d%3D%22M14%208a1%201%200%201%201%200-2h2a4%204%200%201%201%200%208h-2a1%201%200%201%201%200-2h2a2%202%200%200%200%200-4h-2z%22%2F%3E%3C%2Fsvg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M10.59%2013.41a1%201%200%200%201%200-1.41l2.12-2.12a1%201%200%201%201%201.41%201.41l-2.12%202.12a1%201%200%200%201-1.41%200z%22%2F%3E%3Cpath%20d%3D%22M8%2012a4%204%200%200%201%204-4h2a1%201%200%201%201%200%202h-2a2%202%200%200%200%200%204h2a1%201%200%201%201%200%202h-2a4%204%200%200%201-4-4z%22%2F%3E%3Cpath%20d%3D%22M14%208a1%201%200%201%201%200-2h2a4%204%200%201%201%200%208h-2a1%201%200%201%201%200-2h2a2%202%200%200%200%200-4h-2z%22%2F%3E%3C%2Fsvg%3E")}


body.app-cursor-on, body.app-cursor-on *{cursor:none !important}


/* Autofill readability (Chrome/Edge) */
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill{
  -webkit-text-fill-color: var(--text);
  box-shadow: 0 0 0 1000px var(--panel) inset;
  transition: background-color 9999s ease-in-out 0s;
}


/* Collapsed sidebar: pinned + auto-expand on hover (overlay) */
body.sidebar-collapsed.sidebar-hoverable .side{width:72px}
body.sidebar-collapsed.sidebar-hoverable .side:hover{width:280px; z-index:50; box-shadow: var(--shadow);}
body.sidebar-collapsed.sidebar-hoverable .side:hover .usercard,
body.sidebar-collapsed.sidebar-hoverable .side:hover .small,
body.sidebar-collapsed.sidebar-hoverable .side:hover .side-logs{display:block}
body.sidebar-collapsed.sidebar-hoverable .side:hover .nav .nav-label{display:block}
body.sidebar-collapsed.sidebar-hoverable .side:hover .nav .nav-item,
body.sidebar-collapsed.sidebar-hoverable .side:hover .nav .nav-group-head{justify-content:flex-start; padding:10px 10px}


/* Compact density mode */
body.density-compact .pad{padding:12px}
body.density-compact .btn{padding:8px 10px;border-radius:10px}
body.density-compact .input, body.density-compact .select, body.density-compact .textarea, body.density-compact select{padding:8px 10px;border-radius:10px}
body.density-compact .table th, body.density-compact .table td{padding:8px 10px}
body.density-compact .nav .nav-item, body.density-compact .nav .nav-group-head{padding:8px 9px}
body.density-compact .nav .nav-label{font-size:clamp(11.5px, 1.15vw, 12.5px)}


/* Accessibility: focus visible */
:focus-visible{outline:none; box-shadow: var(--focus);}

.ico[data-ico="search"]{-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Ccircle%20cx=%2211%22%20cy=%2211%22%20r=%227%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22/%3E%3Cpath%20d=%22M20%2020l-3.5-3.5%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22%20stroke-linecap=%22round%22/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Ccircle%20cx=%2211%22%20cy=%2211%22%20r=%227%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22/%3E%3Cpath%20d=%22M20%2020l-3.5-3.5%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22%20stroke-linecap=%22round%22/%3E%3C/svg%3E")}

/* Top global search (enterprise) */

.top-global-search{
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--control-border);
  background:var(--control-bg);
  border-radius:14px;
  padding:5px 8px;
  min-width:160px;
  box-shadow:var(--shadow2);
}
.top-global-search input{
  border:0;
  outline:none;
  background:transparent;
  min-width:100px;
  width:160px;
  color:var(--control-text);
  font-weight:700;
  font-size:13px;
}
.top-global-search .ico{width:16px;height:16px;opacity:.7;background:currentColor;color:var(--control-text)}
.top-global-search .iconbtn{padding:5px;border-radius:12px;box-shadow:none;border:0;background:transparent}
.top-global-search:focus-within{box-shadow:var(--focus);border-color:rgba(var(--accent-rgb),.45)}
@media(max-width:1100px){.top-global-search{min-width:130px} .top-global-search input{width:130px}}
@media(max-width:900px){.top-global-search{display:none}}
/* Global search results */
.gresults{display:grid;gap:10px}
.gresults .gsec{border:1px solid var(--border);border-radius:12px;background:var(--panel);padding:10px 10px}
.gresults .gsec-title{display:flex;justify-content:space-between;align-items:center;font-weight:800;margin-bottom:6px}
.gresults .glist{display:grid;gap:6px}
.gresults .gitem{display:flex;gap:10px;align-items:flex-start;border:1px solid rgba(15,23,42,.06);border-radius:10px;padding:8px 10px;background:rgba(2,6,23,.02);cursor:pointer}
.gresults .gitem:hover{border-color:rgba(37,99,235,.35);background:rgba(37,99,235,.06)}
.gresults .gitem.active{border-color:rgba(37,99,235,.55);background:rgba(37,99,235,.10)}
.gresults .gmeta{font-size:12px;color:var(--muted);margin-top:2px}
.gresults .glabel{font-size:12px;color:var(--muted2);font-weight:700}

/* Row focus highlight (global search) */
.row-focus{outline:2px solid rgba(var(--accent-rgb),.55); box-shadow:0 0 0 4px rgba(var(--accent-rgb),.12); border-radius:10px}



/* Login input readability fix */
.auth-wrap input.input{
  background: var(--panel) !important;
  color: var(--text) !important;
  -webkit-text-fill-color: var(--text) !important;
  caret-color: var(--text) !important;
}
.auth-wrap input.input::placeholder{
  color: rgba(107,114,128,.9) !important;
}


/* ===== Enterprise hotfix: icon masks, cursor, sidebar/rightbar behaviors ===== */

/* Base icon mask rendering */
.ico{
  display:inline-block;
  width:18px;
  height:18px;
  background: currentColor;
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}

/* Add chevron icon for right panel toggle */
.ico[data-ico="chev"]{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M15%206l-6%206%206%206%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M15%206l-6%206%206%206%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3C/svg%3E");
}

body.rightbar-collapsed .ico[data-ico="chev"]{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M9%206l6%206-6%206%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M9%206l6%206-6%206%22%20fill=%22none%22%20stroke=%22currentColor%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3C/svg%3E");
}

/* Make toggle overlay sit on the brand mark without consuming layout */
.topbrand{gap:10px}
.brand-mark{position:relative}
.sidebar-toggle-overlay{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border-radius:14px;
  opacity:.0;
  background:transparent;
  z-index:6;
  pointer-events:auto;
}

.topbrand:hover .sidebar-toggle-overlay{opacity:1}
.sidebar-toggle-overlay:hover{background:rgba(0,0,0,.04)}
body[data-mode="dark"] .sidebar-toggle-overlay:hover{background:rgba(255,255,255,.06)}

/* Sidebar rail + tooltips */
.sidebar-collapsed aside.side{padding:14px 10px}
.sidebar-collapsed .nav a.nav-item, .sidebar-collapsed .nav button.nav-group-head{justify-content:center}
.sidebar-collapsed .nav .nav-text{display:none}
.sidebar-collapsed .nav a.nav-item::after, .sidebar-collapsed .nav button.nav-group-head::after{
  content: attr(data-label);
  position:absolute;
  left: calc(100% + 10px);
  top:50%;
  transform:translateY(-50%);
  background: var(--card);
  color: var(--text);
  border:1px solid var(--border);
  padding:6px 10px;
  border-radius:10px;
  font-size:12px;
  white-space:nowrap;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
  opacity:0;
  pointer-events:none;
  z-index:9999;
}
.sidebar-collapsed .nav a.nav-item:hover::after, .sidebar-collapsed .nav button.nav-group-head:hover::after{opacity:1}

/* Right panel toggle placement */
.rtabs{display:flex;align-items:center;gap:6px}
.rtabs-spacer{flex:1}
.rtab-toggle{margin-left:auto;min-width:36px;padding:8px 10px}
body.rightbar-collapsed aside.right{display:none}

/* When rightbar is collapsed, reclaim space */
body.rightbar-collapsed .app{grid-template-columns:260px 1fr 0px}

/* Compact density */
body.density-compact{--pad:12px}
body.density-compact .card.pad{padding:12px}
body.density-compact .btn{padding:7px 10px}
body.density-compact .input, body.density-compact input, body.density-compact select, body.density-compact textarea{padding:8px 10px}
body.density-compact .nav a.nav-item{padding:8px 10px}
body.density-compact .table th, body.density-compact .table td{padding:8px}

/* Inputs: enforce enterprise readability (prevents black fields / invisible text) */
input, textarea, select, .input{
  background: var(--card);
  color: var(--text);
  border: 1px solid var(--border);
}
input::placeholder, textarea::placeholder{color: var(--muted)}
input:focus, textarea:focus, select:focus, .input:focus{outline:none; box-shadow: 0 0 0 3px rgba(59,130,246,.18); border-color: rgba(59,130,246,.55)}
input:-webkit-autofill{
  -webkit-text-fill-color: var(--text) !important;
  transition: background-color 99999s ease-in-out 0s;
}

/* Theme-adaptive custom cursor (no delay). Uses current theme vars. */
body.app-cursor-on, body.app-cursor-on *{cursor:none !important}
.app-cursor{
  position:fixed;
  left:0;top:0;
  width:22px;height:22px;
  transform:translate(-100px,-100px);
  pointer-events:none;
  z-index:2147483647;
  color: var(--text);
  opacity:1;
}
.app-cursor .app-cursor-arrow{
  width:18px;height:18px;
  background: currentColor;
  -webkit-mask-size:contain;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-size:contain;
  mask-repeat:no-repeat;
  mask-position:center;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M5%204l14%209-7%202%202%207-3%201-2-7-7-2z%22/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%3E%3Cpath%20d=%22M5%204l14%209-7%202%202%207-3%201-2-7-7-2z%22/%3E%3C/svg%3E");
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.20));
}
body[data-mode="dark"] .app-cursor .app-cursor-arrow{
  filter: drop-shadow(0 2px 10px rgba(0,0,0,.55));
}
.app-cursor.is-text .app-cursor-arrow{display:none}
.app-cursor .app-cursor-ibar{
  display:none;
  width:10px;height:18px;
  border-left:2px solid currentColor;
  border-right:2px solid currentColor;
  border-radius:4px;
  margin-left:6px;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.18));
}
.app-cursor.is-text .app-cursor-ibar{display:block}

body.sidebar-collapsed.rightbar-collapsed .app{grid-template-columns:72px 1fr 0px}


/* Ensure modal close buttons are always clickable */
.modal{position:fixed;inset:0;z-index:10000}
.modal .panel{position:relative;z-index:10001}
.modal .head{position:relative;z-index:10002}
.modal .head .btn{position:relative;z-index:10003;pointer-events:auto}

/* Global modal stack safety: keep active dialogs above sticky bars/overlays across pages */
.modal.open,
.confirm-modal.open,
.attendance-modal.open{
  z-index: 2147483000;
}
.modal.open .panel,
.confirm-modal.open .panel,
.attendance-modal.open .panel{
  position: relative;
  z-index: 2147483001;
}


/* Native cursor baseline (always visible) */
body{cursor:default}
a,button,[role="button"],.btn{cursor:pointer}
input,textarea,select,[contenteditable="true"]{cursor:text}


/* Sidebar temporary open state */
body.sidebar-tempopen .side{box-shadow:0 12px 28px rgba(0,0,0,.18)}


/* Expand main content when sidebar is collapsed */
body.sidebar-collapsed .app{ grid-template-columns:72px 1fr 320px; }
@media(max-width: 980px){ body.sidebar-collapsed .app{ grid-template-columns:72px 1fr; } }


/* Announcement bar: avatar + name (enterprise layout) */
.announce-bar{ display:flex; align-items:stretch; gap:10px; }
.announce-left{ display:flex; flex-direction:column; align-items:center; justify-content:center; width:56px; flex:0 0 56px; }
.announce-avatar{ width:36px; height:36px; border-radius:12px; overflow:hidden; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); display:flex; align-items:center; justify-content:center; }
.announce-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.announce-avatar .initials{ font-size:12px; font-weight:800; letter-spacing:.04em; }
.announce-who{ font-size:10px; line-height:1.2; text-align:center; opacity:.9; max-width:56px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.announce-body{ display:flex; flex-direction:column; min-width:0; }


/* Theme-adaptive enterprise scrollbars */
:root{
  --scroll-track: rgba(255,255,255,.06);
  --scroll-thumb: rgba(255,255,255,.18);
  --scroll-thumb-hover: rgba(255,255,255,.26);
}
body[data-mode="light"]{
  --scroll-track: rgba(0,0,0,.06);
  --scroll-thumb: rgba(0,0,0,.18);
  --scroll-thumb-hover: rgba(0,0,0,.28);
}
*{ scrollbar-color: var(--scroll-thumb) var(--scroll-track); scrollbar-width: thin; }
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-track{ background: var(--scroll-track); border-radius:999px; }
*::-webkit-scrollbar-thumb{ background: var(--scroll-thumb); border-radius:999px; border:2px solid transparent; background-clip: padding-box; }
*::-webkit-scrollbar-thumb:hover{ background: var(--scroll-thumb-hover); background-clip: padding-box; }
.vscroll{ scrollbar-gutter: stable; }


/* Login / schedule notifications readability */
#schedNotifBody{ font-size:14px; line-height:1.6; color:var(--text); max-height:52vh; overflow:auto; }
#schedNotifMeta{ opacity:.9; }


/* Mini avatars for lists */
.mini-avatar{ width:30px; height:30px; border-radius:10px; overflow:hidden; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); display:inline-flex; align-items:center; justify-content:center; flex:0 0 30px; }
.mini-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.mini-avatar .initials{ font-size:11px; font-weight:800; letter-spacing:.04em; }


/* Enterprise Toasts */
.toast-host{
  position: fixed;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  display: grid;
  gap: 10px;
  z-index: 99999;
  width: min(540px, calc(100vw - 20px));
  justify-items: center;
}
.toast{
  width: 100%;
  max-width: 520px;
  padding: 11px 14px;
  border-radius: 14px;
  border: 1px solid rgba(148,163,184,.5);
  background: linear-gradient(120deg, rgba(15,23,42,.96), rgba(30,41,59,.95));
  box-shadow: 0 16px 38px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
  font-size: 13px;
  color: #f8fafc;
  font-weight: 600;
  letter-spacing: .01em;
  transform: translateY(-6px);
  opacity: 0;
  transition: opacity .18s ease, transform .18s ease;
}
.toast.show{ opacity: 1; transform: translateY(0); }
.toast.ok{ border-color: rgba(16,185,129,.72); background: linear-gradient(120deg, rgba(6,78,59,.96), rgba(6,95,70,.95)); }
.toast.warn{ border-color: rgba(245,158,11,.75); background: linear-gradient(120deg, rgba(120,53,15,.96), rgba(146,64,14,.95)); }
.toast.danger{ border-color: rgba(239,68,68,.78); background: linear-gradient(120deg, rgba(127,29,29,.96), rgba(153,27,27,.95)); }

/* Confirmation modal */
.confirm-modal .panel{ max-width: 520px; }
.confirm-modal .btn.danger{
  background: rgba(239,68,68,.12);
  border-color: rgba(239,68,68,.35);
  color: var(--text);
}

/* Mandatory Attendance */
body.attendance-locked #app{
  pointer-events: none;
  user-select: none;
  filter: blur(0.5px);
}
.attendance-modal{ z-index: 100000; }
.attendance-modal .panel{ max-width: 640px; }
.avatar-lg{
  width: 56px;
  height: 56px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: var(--soft);
  display: grid;
  place-items: center;
  font-weight: 900;
  letter-spacing: .5px;
  overflow: hidden;
}
.avatar-lg img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}

/* Reduce top search width for enterprise density */
.top-global-search{
  max-width: 420px;
}
@media (max-width: 980px){
  .top-global-search{ max-width: 280px; }
}

/* ===============================
   Enterprise bottom dock layout
   - Clocks: bottom-left
   - Quick links: lower center
   - Online users bar: above dock (4 sections incl. Developer Access)
================================ */
:root{ --mums-dock-h: 86px; --mums-onlinebar-h: 44px; }


.online-users-bar{
  position:fixed;
  left:0; right:0;
  bottom: var(--mums-dock-h);
  z-index: 1999;
  padding: 6px 14px;
  /* Theme-adaptive enterprise surface (visible across all themes) */
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--surface-1) 0%, transparent) 0%,
    color-mix(in srgb, var(--surface-1) 72%, transparent) 55%,
    color-mix(in srgb, var(--surface-1) 88%, transparent) 100%
  );
  border-top: 1px solid color-mix(in srgb, var(--border-0) 55%, transparent);
  backdrop-filter: blur(10px);
}

.onlinebar-inner{
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 12px;
  align-items: center;
}
.onlinebar-sec{
  border: 1px solid color-mix(in srgb, var(--border-0) 55%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-1) 68%, transparent);
  padding: 6px 10px;
  min-height: var(--mums-onlinebar-h);
  display:flex;
  flex-direction: column;
  justify-content:center;
  gap: 4px;
}
.onlinebar-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.onlinebar-title{font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.onlinebar-count{font-size:11px;font-weight:900;color:var(--muted)}
.onlinebar-list{display:flex;gap:6px;align-items:center;min-height:24px;overflow:hidden}
.online-pill{
  width: 22px; height: 22px;
  border-radius: 999px;
  display:inline-grid;
  place-items:center;
  overflow:hidden;
  border: 2px solid rgba(34,197,94,.75); /* green by default */
  background: rgba(255,255,255,.06);
  box-shadow: 0 6px 14px rgba(0,0,0,.22);
  flex: 0 0 22px;
}
.online-pill.is-red{ border-color: rgba(255,91,110,.82); }
.online-pill img{width:100%;height:100%;object-fit:cover;display:block}
.online-pill .ini{font-size:10px;font-weight:950;color:var(--text);opacity:.95}

.quicklinks-bar{
  height: var(--mums-dock-h);
  display:block;
  padding: 10px 14px;
}
.quicklinks-bar{position:fixed;left:0;right:0;bottom:0;}
.quicklinks-bar{z-index:2000;}
.quicklinks-bar{overflow:hidden;}
.quicklinks-bar{align-items:stretch;}

/* Absolute positioning inside the dock ensures "true center" quick links */
.quicklinks-bar{position:fixed;}
.quicklinks-bar{display:block;}
.quicklinks-bar{contain:layout paint;}

.clocks-wrap{
  position:absolute;
  left:14px;
  bottom:10px;
  margin-left:0 !important;
  max-width: 46vw;
}

.quicklinks-inner{
  position:absolute;
  left:50%;
  bottom:10px;
  transform: translateX(-50%);
  justify-content:center;
  width: min(980px, 70vw);
}

/* Ensure the app body never gets hidden behind the online bar + dock.
   Keep this tight so we don't waste vertical real estate. */
.app{ padding-bottom: calc(var(--mums-dock-h) + var(--mums-onlinebar-h) + 18px); }

/* When a modal is open, prevent fixed overlays (dock + online bar) from intercepting clicks.
   This also avoids visual "overlap" when modals are positioned close to the bottom. */
body.modal-open .online-users-bar,
body.modal-open .quicklinks-bar{pointer-events:none;opacity:.22;filter:saturate(.9)}

@media (max-width: 980px){
  :root{ --mums-onlinebar-h: 40px; }
  .onlinebar-inner{grid-template-columns: 1fr; gap: 8px; }
  .clocks-wrap{ max-width: 100%; }
  .quicklinks-inner{ width: 92vw; }
}


/* === My Schedule (enterprise) === */
/* Namespace is `mys-*` to avoid collisions with the Master Schedule (`ms-*`). */
.mys-header{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:10px}
.mys-title{font-size:22px;font-weight:900;letter-spacing:-.01em}
.mys-kpis{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:10px}
@media(max-width:1100px){.mys-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.mys-kpis{grid-template-columns:1fr}}
.mys-kpi-card{min-height:86px;display:flex;flex-direction:column;justify-content:center}
.mys-kpi-main{font-size:16px;font-weight:900;margin-top:2px}
.mys-card-title{font-weight:900;font-size:14px}
.mys-timeline{display:flex;flex-direction:column;gap:12px;position:relative}
.mys-item{display:grid;grid-template-columns:14px 1fr;gap:12px;align-items:flex-start;position:relative}
.mys-item:before{content:"";position:absolute;left:6px;top:14px;bottom:-14px;width:2px;background:rgba(2,6,23,.08)}
.mys-item:last-child:before{display:none}
.mys-dot{width:14px;height:14px;border-radius:999px;border:2px solid rgba(37,99,235,.35);background:rgba(37,99,235,.12);margin-top:2px}
.mys-item.past .mys-dot{border-color:rgba(2,6,23,.12);background:rgba(2,6,23,.04)}
.mys-item.now .mys-dot{border-color:rgba(22,163,74,.40);background:rgba(22,163,74,.16)}
.mys-item-main{min-width:0}
.mys-item-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.mys-time{font-size:12px;color:var(--muted);font-weight:800}
.mys-task{font-weight:900;font-size:14px;margin-top:2px}
.mys-empty{padding:14px;border:1px dashed var(--border);border-radius:14px;background:rgba(2,6,23,.01)}
.mys-empty-title{font-weight:900;margin-bottom:4px}
.mys-week{margin-top:10px}
.mys-week-grid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:10px;margin-top:12px}
@media(max-width:960px){.mys-week-grid{grid-template-columns:1fr}}
.mys-week-card{border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.02);padding:12px}
.mys-week-card.today{border-color:rgba(37,99,235,.45);box-shadow:0 0 0 3px rgba(37,99,235,.10)}
.mys-week-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.mys-week-day{font-weight:950}
.mys-week-range{margin-top:6px;font-size:12px;color:var(--muted);font-weight:800}
.mys-week-list{margin-top:10px;display:flex;flex-direction:column;gap:8px}
.mys-week-row{display:flex;gap:10px;align-items:flex-start;min-width:0}
.mys-week-time{font-size:11px;color:var(--muted);font-weight:900;flex:0 0 auto}
.mys-week-task{font-size:12px;font-weight:800;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* === GMT Overview (World Clocks modal) === */
.gmt-overview{margin-top:14px;border:1px solid var(--border);background:rgba(255,255,255,.03);border-radius:16px;padding:14px}
.gmt-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.gmt-controls{flex:1 1 320px;max-width:520px}
.gmt-grid{margin-top:12px;display:grid;grid-template-columns:repeat(auto-fit, minmax(140px,1fr));gap:10px}
.gmt-page{overflow-x:hidden}
.gmt-grid,.gmt-page-layout{min-width:0}
.gmt-tile{min-width:0}
@media (max-width:1100px){.gmt-grid{grid-template-columns:repeat(4, minmax(120px,1fr))}}
@media (max-width:760px){.gmt-grid{grid-template-columns:repeat(2, minmax(120px,1fr))}}
.gmt-tile{border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.14);border-radius:14px;padding:12px;text-align:left;cursor:pointer}
.gmt-tile:hover{border-color:rgba(255,255,255,.18);background:rgba(0,0,0,.18)}
.gmt-tile-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.gmt-tile-time{font-size:22px;font-weight:900;letter-spacing:.4px;line-height:1.1}

/* === Settings hub: compact enterprise density === */
.settings-card .small.muted{margin-top:4px !important;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.settings-card > div[style]{margin-top:0 !important}
#settingsModal .panel{width:min(860px,100%)}
#settingsModal .panel .body{padding-bottom:22px}

/* === GMT Overview page: prevent horizontal scroll === */
.gmt-page-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:start}
.gmt-page-layout > *{min-width:0}
@media (max-width:1100px){.gmt-page-layout{grid-template-columns:1fr}}
/* Ensure all app panels can shrink without forcing overflow */
.main, .right, .side, .topbar, .app, .card{min-width:0}


/* =========================
   Mailbox Counter (enterprise)
   ========================= */
.mbx-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}
.mbx-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.mbx-card{
  border:1px solid var(--card-border);
  background: var(--card-bg);
  border-radius: 18px;
  padding: 14px;
  box-shadow: var(--shadow);
}
.mbx-card-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.mbx-title{ display:flex; flex-direction:column; gap:2px; }
.mbx-shift-title{
  font-size:18px;
  font-weight:900;
  letter-spacing:0.2px;
}
.mbx-tools{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; justify-content:flex-end; }
.mbx-tools-right{ margin-left:auto; }
.mbx-shift-subtitle{
  display:block;
  font-size:12px;
  margin-top:2px;
  letter-spacing:0.12em;
  font-weight:750;
  text-transform:uppercase;
  color: color-mix(in srgb, var(--text-muted) 88%, transparent);
}
.mbx-info-btn{
  appearance:none;
  border:0;
  background:transparent;
  color:inherit;
  cursor:help;
  font-size:13px;
  padding:0 2px;
}
.mbx-table-wrap{ width:100%; overflow:auto; border-radius:10px; border:1px solid color-mix(in srgb, var(--card-border) 68%, transparent); }
.table.mbx-table{
  width:100%;
  min-width: 760px;
  border-collapse: collapse;
}
.table.mbx-table th, .table.mbx-table td{
  /* Compact enterprise density (~70% of default row height) */
  padding: 8px 9px;
  vertical-align: middle;
  border-bottom:1px solid color-mix(in srgb, var(--card-border) 62%, transparent);
}
.table.mbx-table tbody tr:last-child td{ border-bottom:1px solid color-mix(in srgb, var(--card-border) 62%, transparent); }
.table.mbx-table thead th{
  border-bottom:1px solid color-mix(in srgb, var(--card-border) 75%, transparent);
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgba(10,18,32,0.88);
  /* Theme-adaptive header surface (prevents unreadable text in light themes) */
  background: color-mix(in srgb, var(--surface-2) 78%, transparent);
  backdrop-filter: blur(10px);
}
.table.mbx-table tfoot td{
  background: rgba(10,18,32,0.55);
  background: color-mix(in srgb, var(--surface-1) 74%, transparent);
  font-weight: 800;
}
.mbx-name{ cursor: default; }
.mbx-tr.mbx-assignable{ cursor: pointer; }
.mbx-tr.mbx-assignable:hover td{
  background: rgba(64,160,255,0.06);
}
.mbx-member-grid{
  display:grid;
  grid-template-columns: 30px minmax(0,1fr);
  gap: 10px;
  align-items: center;
}
.mbx-avatar{
  width:28px;
  height:28px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  font-weight:900;
  color:var(--text-0);
  background:color-mix(in srgb, var(--accent) 26%, var(--surface-2));
  border:1px solid color-mix(in srgb, var(--accent) 44%, transparent);
}
.mbx-name-col{ min-width:0; }
.mbx-name-main{
  font-weight: 850;
  font-size: 13px;
  letter-spacing:0.1px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mbx-name-sub{
  margin-top: 2px;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.12px;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-muted) 90%, transparent);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mbx-th{ display:flex; flex-direction:column; align-items:center; gap:2px; }
.mbx-duty-col{
  text-align:center;
  min-width:170px;
}
.mbx-duty-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  max-width:100%;
  padding:4px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:0.03em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  border:1px solid color-mix(in srgb, var(--card-border) 70%, transparent);
  background:color-mix(in srgb, var(--surface-2) 80%, transparent);
  color:var(--text-muted);
}
.mbx-duty-pill[data-tone="manager"]{
  color:#dbeafe;
  border-color:rgba(56,189,248,0.55);
  background:rgba(14,116,144,0.34);
}
.mbx-duty-pill[data-tone="call"]{
  color:#dcfce7;
  border-color:rgba(52,211,153,0.55);
  background:rgba(6,95,70,0.34);
}
.mbx-duty-pill[data-tone="active"]{
  color:#e0e7ff;
  border-color:rgba(129,140,248,0.52);
  background:rgba(67,56,202,0.3);
}
.mbx-duty-pill[data-tone="break"]{
  color:#fef3c7;
  border-color:rgba(251,191,36,0.55);
  background:rgba(146,64,14,0.32);
}
.mbx-duty-pill[data-tone="idle"]{
  color:color-mix(in srgb, var(--text-muted) 88%, transparent);
  border-color:color-mix(in srgb, var(--card-border) 70%, transparent);
  background:color-mix(in srgb, var(--surface-2) 75%, transparent);
}
.mbx-group-row th{
  top:0;
  z-index:3;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:0.08em;
  color:color-mix(in srgb, var(--text-muted) 88%, transparent);
  background:color-mix(in srgb, var(--surface-3) 72%, transparent);
}
.mbx-group-th{ text-align:center; }
.mbx-th-top{ font-size:10px; font-weight:800; opacity:0.68; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; min-height:12px; display:inline-block; }
.mbx-th-time{ font-weight:850; }
.mbx-num{
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}
.mbx-num[data-zero="1"]{
  color: color-mix(in srgb, var(--text-muted) 75%, transparent);
  font-weight:700;
}
.mbx-time-th{ text-align: center; }
.mbx-count-td{ text-align: center; }
.mbx-total{ text-align: center; }
.mbx-foot{ font-weight: 900; letter-spacing:0.2px; }

.table.mbx-table .active-col{
  box-shadow: inset 0 0 0 1px rgba(64,160,255,0.28);
  background: rgba(64,160,255,0.04);
}
@media (max-width: 920px){
  .table.mbx-table{ min-width: 680px; }
  .mbx-card{ padding: 12px; border-radius: 16px; }
  .mbx-actions .btn{ padding: 10px 12px; }
}

/* Compact export/import controls (enterprise density) */
.btn[id*="Export"],
.btn[id*="Import"],
.btn[data-act="export"],
.btn[data-act="import"]{
  padding: 6px 10px;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.1;
}


/* Mailbox: My Assigned Cases panel */
.mbx-mine-wrap{display:grid;gap:10px}
.mbx-mine-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--card-border);
  border-radius:14px;
  background: color-mix(in srgb, var(--surface-1) 70%, transparent);
}
.mbx-mine-title{font-weight:900;letter-spacing:0.2px}

/* Small button size (enterprise compact) */
.btn.sm{
  padding: 6px 10px;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.1;
}

/* Mailbox: Case monitoring table */
.mbx-monitor-wrap{width:100%}
.mbx-mon-scroll{overflow:auto;border-radius:14px;border:1px solid var(--card-border)}
.mbx-mon-table{width:100%;border-collapse:separate;border-spacing:0;min-width:740px}
.mbx-mon-table th,.mbx-mon-table td{
  padding: 8px 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--border-0, var(--border)) 60%, transparent);
  border-right: 1px solid color-mix(in srgb, var(--border-0, var(--border)) 40%, transparent);
  background: color-mix(in srgb, var(--surface-0) 74%, transparent);
  font-variant-numeric: tabular-nums;
}
.mbx-mon-table th{
  position: sticky;
  top: 0;
  z-index: 2;
  background: color-mix(in srgb, var(--surface-2) 78%, transparent);
  backdrop-filter: blur(10px);
}
.mbx-mon-table th:last-child,.mbx-mon-table td:last-child{border-right:0}
.mbx-mon-cell{font-weight:850;text-align:center}
.mbx-mon-cell[data-case-action="1"]{cursor:pointer;user-select:none}
.mbx-mon-cell[data-case-action="1"]:hover{background:color-mix(in srgb, var(--surface-2) 62%, transparent)}
.mbx-mon-cell.empty{background: color-mix(in srgb, var(--surface-0) 55%, transparent)}
.mbx-mon-cell.confirmed{
  background: rgba(148,163,184,0.25);
  color: color-mix(in srgb, var(--text-0) 80%, transparent);
}
.mbx-mon-case{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.mbx-mon-status{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;margin-left:6px}
.mbx-mon-wait{gap:6px;font-size:11px;font-weight:700;opacity:.95}
.mbx-mon-wait-dot{
  width:12px;height:12px;border:2px solid rgba(158,211,255,.45);border-top-color:#9ed3ff;border-radius:999px;
  display:inline-block;animation:mbxSpin .9s linear infinite;
}
.mbx-mon-done{
  width:18px;height:18px;border-radius:999px;background:rgba(34,197,94,.16);border:1px solid rgba(34,197,94,.45);
  color:#22c55e;font-size:12px;font-weight:900;line-height:1;
}
@keyframes mbxSpin{to{transform:rotate(360deg)}}
.mbx-mon-head .mbx-mon-name{
  display:flex;
  justify-content:center;
  gap:6px;
  white-space:nowrap;
}
/* --------------------------------------------------------------------------
   Theme visibility hardening
   Ensures text remains readable across all theme presets (esp. light themes).
   -------------------------------------------------------------------------- */
.sp-photo{
  border:1px solid var(--border-0, var(--border));
  background:rgba(var(--accent-rgb,74,163,255),.10);
}
body[data-mode="light"] .sp-photo{background:rgba(15,23,42,.04)}
.sp-photo .initials{color:var(--text-0, var(--text))}

.sp-duty{color:var(--text-0, var(--text))}
.sp-duty .muted{color:var(--text-muted, var(--muted))}
.sp-shift,.sp-team{color:var(--text-muted, var(--muted))}

.sp-position{
  background:rgba(var(--accent-rgb,74,163,255),.10);
  border:1px solid rgba(var(--accent-rgb,74,163,255),.22);
  color:var(--text-0, var(--text));
}

/* Generic initials should follow theme text token */
.avatar .initials{color:var(--text-0, var(--text))}

/* --------------------------------------------------------------------------
   Mobile layout hardening (enterprise look on small screens)
   -------------------------------------------------------------------------- */
@media (max-width: 768px){
  /* =========================================================
     MOBILE LAYOUT (Rebuild v2 — ≤768px)
     Goals:
     - Enterprise-grade single-column content with drawers
     - Main content always visible (no fixed overlay bars blocking)
     - Bottom utility bars hidden by default; accessible via toggles / FABs
     ========================================================= */

  /* Keep touch targets readable on mobile (disable global downscaling). */
  html{ --app-scale: 1 !important; }
  body{ font-size: 13px; line-height: 1.35; }

  /* Single-column shell */
  .app{
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr !important;
    height: 100vh;
    min-height: 100vh;
    padding-bottom: calc(88px + env(safe-area-inset-bottom));
  }

  /* Topbar: clean + compact */
  .topbar{
    grid-template-columns: 1fr !important;
    gap: 10px;
    padding: 12px 12px 10px;
  }
  .topbar-center{ display:none !important; }

  /* Reduce action clutter on mobile; keep essential controls */
  .top-global-search{ display:none !important; }
  #realtimeSyncStatus{ display:none !important; }
  #releaseNotesBtn, #dictionaryBtn{ display:none !important; }
  #settingsBtn{ display:inline-grid !important; }
  #mobilePanelToggle{ display:inline-grid !important; }

  /* Ensure mobile-only toggles are visible */
  #toggleUserOnlineBar, #toggleQuickLinksBar{ display:inline-grid !important; }

  /* Cards + controls density */
  .card.pad{ padding: 14px !important; border-radius: 16px !important; }
  .btn{ padding: 9px 10px; border-radius: 12px; font-size: 13px; }
  .btn.iconbtn{ width: 36px; height: 36px; }
  #logoutBtn{ padding: 9px 12px; }
  .input, .select, .textarea, select{ padding: 9px 10px; border-radius: 12px; font-size: 13px; }

  /* Hide desktop sidebar/right panel; use drawers */
  aside.side, aside.right{
    position: fixed !important;
    top: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom));
    height: auto !important;
    max-height: none !important;
    width: 86vw !important;
    max-width: 380px;
    z-index: 5000;
    transform: translateX(-110%);
    transition: transform .18s ease;
  }
  aside.right{
    left: auto;
    right: 12px;
    transform: translateX(110%);
  }

  body.mobile-nav-open aside.side{ transform: translateX(0); }
  body.mobile-panel-open aside.right{ transform: translateX(0); }

  /* Mobile drawer overlay (also used by bottom sheets) */
  .mobile-drawer-overlay{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.46);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
    z-index: 4500;
  }
  body.mobile-nav-open .mobile-drawer-overlay,
  body.mobile-panel-open .mobile-drawer-overlay,
  body.mobile-online-open .mobile-drawer-overlay,
  body.mobile-quicklinks-open .mobile-drawer-overlay{
    opacity: 1;
    pointer-events: auto;
  }

  /* Main content: full width */
  .main.card.pad{ border-radius: 18px !important; }
  .main{ padding: 12px !important; }

  /* ==========================================
     Bottom sheets (Quick Links + Online Users)
     Hidden by default; slide in on toggle.
     ========================================== */
  .online-users-bar,
  .quicklinks-bar{
    left: 10px !important;
    right: 10px !important;
    bottom: calc(10px + env(safe-area-inset-bottom)) !important;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--border-0) 75%, transparent);
    background: color-mix(in srgb, var(--surface-1) 92%, transparent);
    box-shadow: 0 22px 60px rgba(0,0,0,.40);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transform: translateY(130%);
    opacity: 0;
    pointer-events: none;
    transition: transform .18s ease, opacity .18s ease;
    overflow: hidden;
    z-index: 5200;
  }
  body.mobile-online-open .online-users-bar,
  body.mobile-quicklinks-open .quicklinks-bar{
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }

  /* Sheet headers (injected/templated) */
  .mob-sheet-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid color-mix(in srgb, var(--border-0) 70%, transparent);
  }
  .mob-sheet-title{
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .mob-sheet-actions{ display:flex; align-items:center; gap: 8px; }
  .mob-sheet-close{
    width: 34px;
    height: 34px;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--border-0) 70%, transparent);
    background: transparent;
    color: var(--text);
    display:grid;
    place-items:center;
    cursor:pointer;
  }

  /* Online Users sheet */
  .online-users-bar{ max-height: 64vh; }
  .online-users-bar .onlinebar-inner{ padding: 10px 12px 12px; overflow:auto; -webkit-overflow-scrolling:touch; }
  .online-users-bar .onlinebar-col{ border:0; background:transparent; padding: 0; }
  .online-users-bar details.onlinebar-acc{
    border: 1px solid color-mix(in srgb, var(--border-0) 70%, transparent);
    border-radius: 14px;
    background: color-mix(in srgb, var(--surface-0) 60%, transparent);
    overflow:hidden;
    margin: 10px 0 0;
  }
  .online-users-bar details.onlinebar-acc:first-child{ margin-top: 0; }
  .online-users-bar details.onlinebar-acc > summary{
    list-style:none;
    cursor:pointer;
    padding: 10px 12px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-weight: 900;
  }
  .online-users-bar details.onlinebar-acc > summary::-webkit-details-marker{ display:none; }
  .online-users-bar details.onlinebar-acc .onlinebar-badges{ padding: 0 12px 12px; }

  /* Quick Links sheet */
  .quicklinks-bar{
    height: auto !important;
    max-height: 64vh;
    padding: 0;
  }
  .quicklinks-bar .clocks-wrap{
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 100%;
    max-width: 100%;
    padding: 10px 12px 0;
    overflow:auto;
    -webkit-overflow-scrolling: touch;
    justify-content:flex-start;
  }
  .quicklinks-bar .wclock{ min-width: 116px; padding: 6px 8px; border-radius: 14px; }
  .quicklinks-bar .wclock .wc-h{ font-size: 18px; }
  .quicklinks-bar .wclock .wc-m{ font-size: 16px; }
  .quicklinks-bar .wclock .wc-sec{ font-size: 11px; }

  .quicklinks-bar .quicklinks-inner{
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 100% !important;
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 10px;
    justify-items: center;
  }
  .quicklinks-bar .qitem{ width: 100%; max-width: none; }
  .quicklinks-bar .qlabel{ max-width: 100%; }
  .quicklinks-bar .qcircle{ width: 40px; height: 40px; }

  /* Floating action buttons (quick access) */
  .mobile-fab-stack{
    position: fixed;
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom));
    display:flex;
    flex-direction:column;
    gap: 10px;
    z-index: 5300;
  }
  .mobile-fab-stack .fab{
    width: 46px;
    height: 46px;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--border-0) 70%, transparent);
    background: color-mix(in srgb, var(--surface-1) 88%, transparent);
    color: var(--text);
    box-shadow: 0 18px 50px rgba(0,0,0,.35);
    display:grid;
    place-items:center;
  }
  .mobile-fab-stack .fab .ico{ width: 20px; height: 20px; }

  /* Make all tables horizontally scrollable */
  .table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .table thead,.table tbody,.table tr{display:table;width:100%;table-layout:fixed}
  table{min-width:680px}
}


/* Realtime Sync Status badge */
.sync-status{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--border);border-radius:999px;background:rgba(255,255,255,.72);box-shadow:var(--shadow2);font-size:12px;color:var(--muted);line-height:1}
.sync-status .dot{width:8px;height:8px;border-radius:50%;background:var(--muted2)}
.sync-status.ok .dot{background:var(--ok)}
.sync-status.poll .dot{background:var(--warn)}
.sync-status.off .dot{background:var(--danger)}
.sync-status .label{font-weight:700;color:var(--muted)}
.sync-status .state{font-weight:700;color:var(--text)}

/* Mandatory realtime blocker (enterprise-safe: prevents divergent edits) */
.realtime-blocker{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;background:rgba(10,12,16,.62);backdrop-filter:blur(5px)}
.realtime-blocker-card{width:min(560px,calc(100% - 32px));background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow4);padding:18px 18px 14px;color:var(--text)}
.realtime-blocker-card .rt-head{margin-bottom:12px}
.realtime-blocker-card .rt-title{font-size:16px;font-weight:800;letter-spacing:.2px;margin-bottom:4px}
.realtime-blocker-card .rt-sub{font-size:12px;color:var(--muted);line-height:1.4}
.realtime-blocker-card .rt-body{display:flex;flex-direction:column;gap:10px}
.realtime-blocker-card .rt-status{display:flex;align-items:center;gap:10px;font-weight:700}
.realtime-blocker-card .rt-dot{width:10px;height:10px;border-radius:50%;background:var(--warn);box-shadow:0 0 0 4px rgba(255,184,0,.15)}
.realtime-blocker-card .rt-detail{font-size:12px;color:var(--muted);line-height:1.4;word-break:break-word}
.realtime-blocker-card .rt-hint{font-size:12px;color:var(--muted);line-height:1.4;background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:10px}
.realtime-blocker-card .rt-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}

@media (max-width:720px){
  .sync-status{display:none}
}

/* =====================================================================
   Classic Style Theme (Enterprise UI/UX)
   - Timeless admin dashboard layout + hierarchy
   - Applies only when Settings > THEME = Classic Style
   ===================================================================== */

body[data-theme="classic_style"]{
  background: var(--bg);
  color: var(--text);
}

/* Remove glossy/aurora effects; prefer clean, flat surfaces */
body[data-theme="classic_style"] .card{
  background: var(--panel);
  border-color: var(--border);
  box-shadow: var(--shadow2);
  border-radius: 10px;
}
body[data-theme="classic_style"] .card.pad{ padding: 18px; }

/* App grid spacing (tight, classic) */
body[data-theme="classic_style"] .app{
  gap: 12px;
  padding: 12px;
}

/* Top bar: fixed/sticky classic header */
body[data-theme="classic_style"] .topbar{
  position: sticky;
  top: 0;
  z-index: 40;
  padding: 10px 12px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: var(--shadow2);
}

body[data-theme="classic_style"] .topbrand{
  border: 0;
  background: transparent;
  padding: 0;
}
body[data-theme="classic_style"] .brand-name{
  text-shadow: none;
  letter-spacing: .02em;
}
body[data-theme="classic_style"] .brand-mark{
  box-shadow: none;
}
body[data-theme="classic_style"] .brand-sub{ color: var(--muted); }

/* Manila clock pill (injected by app.js for Classic Style) */
body[data-theme="classic_style"] #classicManilaClock{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(var(--accent-rgb), .08);
  font-weight: 800;
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}
body[data-theme="classic_style"] .topbar-center{
  flex-direction: column;
  gap: 8px;
}

/* Global search: classic input sizing */
body[data-theme="classic_style"] .top-global-search{
  border: 1px solid var(--border);
  background: var(--panel);
  border-radius: 10px;
}
body[data-theme="classic_style"] #globalSearchInput{
  font-size: 13px;
  padding: 10px 10px;
}

/* Sidebar: fixed nav, classic emphasis */
body[data-theme="classic_style"] aside.side{
  padding: 14px !important;
}
body[data-theme="classic_style"] .nav .nav-item,
body[data-theme="classic_style"] .nav .nav-group-head{
  border-radius: 8px;
  padding: 9px 10px;
}
body[data-theme="classic_style"] .nav .nav-label{
  font-size: 13px;
  font-weight: 800;
}
body[data-theme="classic_style"] .nav .nav-item:hover,
body[data-theme="classic_style"] .nav .nav-group-head:hover{
  background: rgba(var(--accent-rgb), .06);
  border-color: rgba(var(--accent-rgb), .18);
}
body[data-theme="classic_style"] .nav .nav-item.active{
  background: rgba(var(--accent-rgb), .10);
  border-color: rgba(var(--accent-rgb), .30);
  box-shadow: inset 3px 0 0 var(--accent);
}

/* Right panel: scrollable + sticky header */
body[data-theme="classic_style"] aside.right{
  overflow: auto;
}
body[data-theme="classic_style"] .rtabs{
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--panel);
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
}

/* Tables: zebra striping + classic header */
body[data-theme="classic_style"] table tr:nth-child(even) td{
  background: rgba(15,23,42,.02);
}
body[data-theme="classic_style"] th{
  background: rgba(15,23,42,.03);
  color: var(--muted);
}

/* Footer bars: neutral + enterprise borders */
body[data-theme="classic_style"] .online-users-bar,
body[data-theme="classic_style"] .quicklinks-bar{
  background: var(--panel);
  border-top: 1px solid var(--border);
}

/* Responsive: tighten spacing on tablets/mobiles while preserving classic layout */
@media(max-width: 980px){
  body[data-theme="classic_style"] .topbar{ border-radius: 12px; }
}

/* Classic Style: dark mode fine-tuning (auto mode) */
body[data-theme="classic_style"][data-mode="dark"] table tr:nth-child(even) td{
  background: rgba(255,255,255,.035);
}
body[data-theme="classic_style"][data-mode="dark"] th{
  background: rgba(255,255,255,.05);
  color: var(--muted);
}
body[data-theme="classic_style"][data-mode="dark"] #classicManilaClock{
  background: rgba(var(--accent-rgb), .14);
}

/* Sidebar enterprise refresh: profile hierarchy + grouped nav + timeline logs */
.sp-compact-v3{padding:8px 4px 12px}
.sp-compact-v3 .sp-row{align-items:center;gap:12px}
.sp-photo-circle,
.sp-photo-sm.sp-photo-circle{border-radius:999px;position:relative;overflow:visible}
.sp-photo-circle img,
.sp-photo-circle .initials{border-radius:999px}
.sp-photo-circle .initials{display:grid;place-items:center;width:100%;height:100%}
.sp-name-strong{font-weight:900;line-height:1.2;color:var(--text-0,var(--text))}
.sp-meta-subtitle{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-presence-dot{position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:999px;border:2px solid var(--surface-1,#0b1220);box-shadow:0 0 0 2px rgba(0,0,0,.15)}
.sp-presence-dot.is-active{background:#22c55e}
.sp-presence-dot.is-idle{background:#94a3b8}

.side .nav{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.nav-section-label{margin:10px 8px 2px;font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;opacity:.9}
.nav .nav-item,.nav .nav-group-head{min-height:44px}
.nav .nav-group-kids{padding-top:6px;padding-bottom:8px}
.nav-group.is-record-group .nav-group-kids{position:relative;margin-left:16px;padding-left:12px}
.nav-group.is-record-group .nav-group-kids::before{content:"";position:absolute;left:4px;top:8px;bottom:10px;width:1px;background:rgba(148,163,184,.35)}
.nav-group.is-record-group .nav-item.nav-subitem{padding-left:10px !important;box-sizing:border-box}

.side-logs{gap:10px}
.side-logs-title{font-weight:800;font-size:20px;color:var(--text-0,var(--text))}
.side-logs-list{position:relative;gap:8px;max-height:236px;overflow:hidden}
.logline{position:relative;display:grid;grid-template-columns:44px 12px minmax(0,1fr);gap:10px;align-items:start;font-size:12px;line-height:1.25;color:var(--muted)}
.logline .t{min-width:0;color:var(--muted);font-variant-numeric:tabular-nums}
.logline .tl-dot{position:relative;width:8px;height:8px;border-radius:999px;background:rgba(148,163,184,.9);margin-top:4px}
.logline .tl-dot::after{content:"";position:absolute;left:50%;top:8px;transform:translateX(-50%);width:1px;height:22px;background:rgba(148,163,184,.35)}
.logline:last-child .tl-dot::after{display:none}
.logline .m{min-width:0;color:var(--text-0,var(--text));opacity:.95;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.log-empty{font-size:12px;color:var(--muted);padding:8px 0}
.side-logs-viewall{width:100%;justify-content:center;font-weight:700}

body.sidebar-collapsed .nav-section-label,
body.sidebar-collapsed .side-logs-title{display:none}

/* ============================================================
   High Alert Error Notifications (Upper Center + Red Overlay)
   ============================================================ */
.high-alert-overlay{
  position: fixed;
  inset: 0;
  background: rgba(255, 59, 59, 0.28);
  backdrop-filter: blur(1px);
  display: none;
  z-index: 2147483645;
}
.high-alert-host{
  position: fixed;
  top: 18px;
  left: 50%;
  transform: translateX(-50%);
  width: min(760px, calc(100vw - 24px));
  display: none;
  justify-content: center;
  z-index: 2147483646;
}
.high-alert-box{
  width: 100%;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.22);
  background: rgba(255, 42, 64, 0.92);
  color: #fff;
  box-shadow: 0 18px 60px rgba(0,0,0,0.35);
  padding: 14px 16px;
  display: grid;
  gap: 8px;
}
.high-alert-title{
  font-weight: 900;
  letter-spacing: 0.02em;
}
.high-alert-message{
  font-size: 14px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}
.high-alert-actions{
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
.high-alert-box .btn.danger{
  background: rgba(0,0,0,0.18);
  border-color: rgba(255,255,255,0.35);
  color: #fff;
}

/* =====================================================================
   Monday Workspace Theme (inspired by Monday.com)
   - Fully isolated under body[data-theme="monday_workspace"]
   ===================================================================== */
body[data-theme="monday_workspace"]{
  background: #f4f5f7;
  color: #1f2937;
  font-family: 'Poppins', 'Inter', 'Segoe UI', Roboto, system-ui, -apple-system, Arial, sans-serif;
}

body[data-theme="monday_workspace"] .app{
  gap: 14px;
  padding: 14px;
  background: linear-gradient(180deg, #f8f9fc 0%, #f4f5f7 100%);
}

body[data-theme="monday_workspace"] .topbar{
  position: sticky;
  top: 0;
  z-index: 60;
  padding: 10px 14px;
  border: 1px solid #e6e9ef;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, .06);
}

body[data-theme="monday_workspace"] .topbrand,
body[data-theme="monday_workspace"] .brand-mark{
  background: transparent;
  box-shadow: none;
  border: 0;
}

body[data-theme="monday_workspace"] .brand-name{
  color: #1f2937;
  font-weight: 800;
  letter-spacing: .01em;
}

body[data-theme="monday_workspace"] .brand-sub{
  color: #6b7280;
}

body[data-theme="monday_workspace"] .top-global-search{
  border: 1px solid #e6e9ef;
  border-radius: 10px;
  background: #f7f8fb;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}

body[data-theme="monday_workspace"] #globalSearchInput{
  color: #1f2937;
  font-size: 13px;
}

body[data-theme="monday_workspace"] #globalSearchInput::placeholder{
  color: #9aa4b2;
}

body[data-theme="monday_workspace"] aside.side,
body[data-theme="monday_workspace"] aside.right{
  border-radius: 12px;
  border: 1px solid #e6e9ef;
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .05);
}

body[data-theme="monday_workspace"] aside.side{
  padding: 14px !important;
}

body[data-theme="monday_workspace"] .nav{
  gap: 8px;
}

body[data-theme="monday_workspace"] .nav .nav-item,
body[data-theme="monday_workspace"] .nav .nav-group-head{
  border: 1px solid transparent;
  border-radius: 10px;
  min-height: 42px;
  padding: 9px 11px;
  transition: background-color .16s ease, border-color .16s ease, transform .16s ease;
}

body[data-theme="monday_workspace"] .nav .nav-label{
  color: #334155;
  font-size: 13px;
  font-weight: 700;
}

body[data-theme="monday_workspace"] .nav .nav-item:hover,
body[data-theme="monday_workspace"] .nav .nav-group-head:hover{
  background: #f4f8ff;
  border-color: #d7e5fb;
  transform: translateY(-1px);
}

body[data-theme="monday_workspace"] .nav .nav-item.active{
  background: #e9f2ff;
  border-color: #b9d6ff;
  box-shadow: inset 3px 0 0 #0073ea;
}

body[data-theme="monday_workspace"] .card{
  background: #ffffff;
  border: 1px solid #e6e9ef;
  border-radius: 12px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .05);
}

body[data-theme="monday_workspace"] .card.pad{
  padding: 18px;
}

body[data-theme="monday_workspace"] .btn,
body[data-theme="monday_workspace"] button,
body[data-theme="monday_workspace"] input[type="button"],
body[data-theme="monday_workspace"] input[type="submit"]{
  border-radius: 10px;
  border: 1px solid #d6deea;
  background: #ffffff;
  color: #1f2937;
  font-weight: 700;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
}

body[data-theme="monday_workspace"] .btn:hover,
body[data-theme="monday_workspace"] button:hover,
body[data-theme="monday_workspace"] input[type="button"]:hover,
body[data-theme="monday_workspace"] input[type="submit"]:hover{
  background: #f5f9ff;
  border-color: #bdd7ff;
}

body[data-theme="monday_workspace"] .btn.btn-primary,
body[data-theme="monday_workspace"] .btn.primary,
body[data-theme="monday_workspace"] .btn[data-variant="primary"]{
  background: #0073ea;
  border-color: #0073ea;
  color: #ffffff;
  box-shadow: 0 8px 16px rgba(0, 115, 234, .24);
}

body[data-theme="monday_workspace"] .btn.btn-primary:hover,
body[data-theme="monday_workspace"] .btn.primary:hover,
body[data-theme="monday_workspace"] .btn[data-variant="primary"]:hover{
  background: #0066cf;
  border-color: #0066cf;
}

body[data-theme="monday_workspace"] table,
body[data-theme="monday_workspace"] .table{
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #e6e9ef;
  border-radius: 12px;
  overflow: hidden;
  background: #ffffff;
}

body[data-theme="monday_workspace"] th{
  background: #f7f8fb;
  color: #64748b;
  font-weight: 800;
  border-bottom: 1px solid #e6e9ef;
}

body[data-theme="monday_workspace"] td{
  border-bottom: 1px solid #edf1f6;
  color: #1f2937;
}

body[data-theme="monday_workspace"] table tr:nth-child(even) td{
  background: #fbfcfe;
}

body[data-theme="monday_workspace"] table tr:last-child td{
  border-bottom: 0;
}

body[data-theme="monday_workspace"] input,
body[data-theme="monday_workspace"] select,
body[data-theme="monday_workspace"] textarea{
  border: 1px solid #d7dfea;
  border-radius: 10px;
  background: #ffffff;
  color: #1f2937;
}

body[data-theme="monday_workspace"] input:focus,
body[data-theme="monday_workspace"] select:focus,
body[data-theme="monday_workspace"] textarea:focus{
  border-color: #0073ea;
  box-shadow: 0 0 0 3px rgba(0, 115, 234, .16);
  outline: none;
}

body[data-theme="monday_workspace"] .online-users-bar,
body[data-theme="monday_workspace"] .quicklinks-bar{
  border-top: 1px solid #e6e9ef;
  background: #ffffff;
}

body[data-theme="monday_workspace"] .rtabs{
  position: sticky;
  top: 0;
  z-index: 2;
  border-bottom: 1px solid #e6e9ef;
  background: #ffffff;
}

@media (max-width: 980px){
  body[data-theme="monday_workspace"] .app{
    gap: 10px;
    padding: 10px;
  }

  body[data-theme="monday_workspace"] .topbar,
  body[data-theme="monday_workspace"] aside.side,
  body[data-theme="monday_workspace"] aside.right,
  body[data-theme="monday_workspace"] .card,
  body[data-theme="monday_workspace"] table,
  body[data-theme="monday_workspace"] .table{
    border-radius: 10px;
  }
}


/* Programmable Status Widgets (Enterprise Refinement) */
#right-sidebar-container {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.status-widget-grid {
order: -1;
width: 100%;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 8px;
margin: 0 0 12px;
}

/* Idle (Stealth/Grayscale) State */
.status-widget-tile {
aspect-ratio: 1/1;
min-height: 72px;
border-radius: 18px;
/* Base Frosted Glass */
background: rgba(15, 23, 42, 0.4);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
/* Rim Lighting */
border: 1px solid transparent;
border-top: 1px solid rgba(255, 255, 255, 0.08);
border-bottom: 1px solid rgba(0, 0, 0, 0.3);

display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 4px;
cursor: pointer;

/* Smooth Transitions for interactions */
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
transform: translateZ(0); /* Force GPU */

/* Default text state */
color: rgba(255, 255, 255, 0.5);
filter: grayscale(1) opacity(0.7);
}

.status-widget-title {
font-size: 11px;
font-weight: 800;
line-height: 1.1;
letter-spacing: 0.05em;
text-transform: uppercase;
text-align: center;
}

.status-widget-sub {
font-size: 10px;
font-weight: 700;
line-height: 1;
opacity: 0.7;
text-transform: uppercase;
}

/* Tactile Hover */
.status-widget-tile:hover {
transform: translateY(-2px) translateZ(0);
border-color: rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.05);
filter: grayscale(0.8) opacity(0.9);
}

/* Active (Alert/Bloom) State */
.status-widget-tile.is-active {
filter: grayscale(0) opacity(1);
color: #fff;
border-color: transparent;
animation: cinematic-pulse 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

/* Specific Color Blooms (Multi-layered box-shadow) */
.status-widget-tile.is-blue.is-active {
background: rgba(59, 130, 246, 0.1);
border: 1px solid rgba(59, 130, 246, 0.3);
box-shadow:
0 0 10px rgba(59, 130, 246, 0.4),
0 0 20px rgba(59, 130, 246, 0.2),
inset 0 0 15px rgba(59, 130, 246, 0.1);
}

.status-widget-tile.is-yellow.is-active {
background: rgba(234, 179, 8, 0.1);
border: 1px solid rgba(234, 179, 8, 0.3);
box-shadow:
0 0 10px rgba(234, 179, 8, 0.4),
0 0 20px rgba(234, 179, 8, 0.2),
inset 0 0 15px rgba(234, 179, 8, 0.1);
}

.status-widget-tile.is-red.is-active {
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
box-shadow:
0 0 10px rgba(239, 68, 68, 0.4),
0 0 20px rgba(239, 68, 68, 0.2),
inset 0 0 15px rgba(239, 68, 68, 0.1);
}

/* Hardware Accelerated Pulse */
@keyframes cinematic-pulse {
0% { transform: scale(1) translateZ(0); filter: brightness(1); }
50% { transform: scale(1.02) translateZ(0); filter: brightness(1.2); }
100% { transform: scale(1) translateZ(0); filter: brightness(1); }
}


/* ============================================================================
   ENTERPRISE TOKEN REGISTRY + THEME ISOLATION LAYER (ARCHITECTURE LOCK)
   ============================================================================ */
:root{
  --surface-bg: #050914;
  --surface-bg-alt: #0b1022;
  --surface-card: #0b1022;
  --surface-card-alt: #090e1c;
  --surface-modal: #0b1022;

  --text-primary: #eef2ff;
  --text-muted: #b9c1da;
  --text-inverse: #0f172a;

  --accent-primary: #7c87ff;
  --accent-primary-hover: #6366f1;
  --accent-border: rgba(255,255,255,.12);

  --status-success: #16a34a;
  --status-warn: #d97706;
  --status-danger: #dc2626;

  --effect-shadow-soft: 0 2px 10px rgba(0,0,0,.20);
  --effect-shadow-strong: 0 12px 28px rgba(0,0,0,.30);
  --effect-glow: 0 0 0 3px rgba(124,135,255,.18);
  --effect-glass-backdrop: rgba(255,255,255,.06);

  /* Legacy alias map (backward compatibility) */
  --bg: var(--surface-bg);
  --bg2: var(--surface-bg-alt);
  --panel: var(--surface-card);
  --panel2: var(--surface-card-alt);
  --card: var(--surface-card);
  --card2: var(--surface-card-alt);
  --text: var(--text-primary);
  --muted: var(--text-muted);
  --primary: var(--accent-primary);
  --primary2: var(--accent-primary-hover);
  --border: var(--accent-border);
  --border2: var(--accent-border);
  --ok: var(--status-success);
  --warn: var(--status-warn);
  --danger: var(--status-danger);
  --shadow2: var(--effect-shadow-soft);
  --shadow: var(--effect-shadow-strong);
  --focus: var(--effect-glow);
}

body{
  background: linear-gradient(180deg,var(--surface-bg) 0%, var(--surface-bg-alt) 100%);
  color: var(--text-primary);
}
.card{background:var(--surface-card);border-color:var(--accent-border);box-shadow:var(--effect-shadow-soft);color:var(--text-primary)}
.btn{background:var(--surface-card);border-color:var(--accent-border);color:var(--text-primary);box-shadow:var(--effect-shadow-soft)}
.btn:hover{background:var(--surface-card-alt);border-color:var(--accent-border)}
.btn.primary{background:var(--accent-primary);border-color:var(--accent-primary);color:var(--text-inverse)}
.btn.primary:hover{background:var(--accent-primary-hover);border-color:var(--accent-primary-hover)}
input,select,textarea{background:var(--surface-card);border-color:var(--accent-border);color:var(--text-primary)}
th{background:var(--surface-card-alt);color:var(--text-muted)}
.badge{background:var(--surface-card-alt);border-color:var(--accent-border);color:var(--text-primary)}
.sync-status{background:var(--surface-card);border-color:var(--accent-border);box-shadow:var(--effect-shadow-soft);color:var(--text-muted)}
.realtime-blocker{background:color-mix(in srgb, var(--surface-bg) 70%, #000 30%)}
.realtime-blocker-card{background:var(--surface-modal);border-color:var(--accent-border);box-shadow:var(--effect-shadow-strong);color:var(--text-primary)}

body[data-theme="mums_dark"]{
  --surface-bg:#0f172a;
  --surface-bg-alt:#17233c;
  --surface-card:#1a2742;
  --surface-card-alt:#22314f;
  --surface-modal:#1d2b47;
  --text-primary:#f4f7ff;
  --text-muted:#c6d2ea;
  --text-inverse:#0f172a;
  --accent-primary:#7f9bff;
  --accent-primary-hover:#97adff;
  --accent-border:rgba(179,199,255,.34);
  --effect-shadow-soft:0 4px 14px rgba(6,12,28,.28);
  --effect-shadow-strong:0 18px 38px rgba(5,10,24,.34);
}
body[data-theme="aurora_light"]{
  --surface-bg:#f5f7fb;
  --surface-bg-alt:#eef2f8;
  --surface-card:#ffffff;
  --surface-card-alt:#f8fafc;
  --surface-modal:#ffffff;
  --text-primary:#0f172a;
  --text-muted:#64748b;
  --text-inverse:#ffffff;
  --accent-primary:#2563eb;
  --accent-primary-hover:#1d4ed8;
  --accent-border:#d7dee9;
  --effect-shadow-soft:0 2px 10px rgba(15,23,42,.08);
  --effect-shadow-strong:0 8px 24px rgba(15,23,42,.12);
}
body[data-theme="monday_workspace"]{
  --surface-bg:#f6f8fb;
  --surface-bg-alt:#eef3f9;
  --surface-card:#ffffff;
  --surface-card-alt:#f7f8fb;
  --surface-modal:#ffffff;
  --text-primary:#1f2937;
  --text-muted:#64748b;
  --text-inverse:#ffffff;
  --accent-primary:#0073ea;
  --accent-primary-hover:#0066cf;
  --accent-border:#d7dfea;
  --effect-shadow-soft:0 1px 2px rgba(15,23,42,.06);
  --effect-shadow-strong:0 10px 26px rgba(15,23,42,.05);
}
body[data-theme="classic_style"]{
  --surface-bg:#f4f5f7;
  --surface-bg-alt:#eceff3;
  --surface-card:#ffffff;
  --surface-card-alt:#f7f8fa;
  --surface-modal:#ffffff;
  --text-primary:#1f2937;
  --text-muted:#6b7280;
  --text-inverse:#ffffff;
  --accent-primary:#1d4ed8;
  --accent-primary-hover:#1e40af;
  --accent-border:#d6dbe4;
  --effect-shadow-soft:0 1px 2px rgba(15,23,42,.06);
  --effect-shadow-strong:0 8px 20px rgba(15,23,42,.08);
}

/* ════════════════════════════════════════════════════════════
   AURORA MIDNIGHT — Full Theme Implementation
   Deep navy base · Purple/teal accent · High contrast text
   ════════════════════════════════════════════════════════════ */
body[data-theme="aurora_midnight"] {
  /* ══════════════════════════════════════════════════════════════
     AURORA MIDNIGHT v3 — Enterprise Vivid Edition
     Color Strategy:
       PRIMARY ACCENT: Azure-Cyan #2d86e8  (replaces purple #7c6ff7)
       SECONDARY:      Teal #06d6b0        (keep — vivid, fresh)
       HIGHLIGHT:      Sky #4facf9         (electric blue accent)
       Backgrounds:    Deep Navy — NOT pitch black, has depth
       Text:           High contrast — minimum 70% white on dark bg
       Borders:        Azure-tinted, visible but not overwhelming
     ══════════════════════════════════════════════════════════════ */

  /* ── Surface tokens ── */
  --surface-1:    #0c1524;
  --surface-2:    #102030;
  --surface-3:    #152840;
  --surface-bg:   #070f1c;
  --surface-bg-alt:#08121f;
  --surface-card: #0c1524;
  --surface-card-alt:#102030;
  --surface-modal:#0d1828;
  --surface-color:#070f1c;

  /* ── Text tokens — HIGH CONTRAST ── */
  --text:         #ddeeff;
  --text-0:       #eef5ff;
  --text-muted:   #8aa8c8;
  --muted:        #8aa8c8;
  --muted2:       #5a7898;
  --text-primary: #ddeeff;
  --text-secondary:#a8c4e0;
  --text-inverse: #070f1c;

  /* ── Border tokens — azure-tinted ── */
  --border:       rgba(60,140,255,.18);
  --border-0:     rgba(60,140,255,.24);
  --border2:      rgba(60,140,255,.30);
  --accent-border:rgba(60,140,255,.28);

  /* ── Accent / brand — AZURE replaces purple ── */
  --primary:      #2d86e8;
  --primary2:     #1a6fcf;
  --accent:       #2d86e8;
  --accent-rgb:   45,134,232;
  --accent-primary:#2d86e8;
  --accent-primary-hover:#4facf9;

  /* ── Functional colors ── */
  --ok:           #3fd67a;
  --warn:         #f8c144;
  --danger:       #f46c6c;

  /* ── Panel / bg ── */
  --panel:        #0c1524;
  --panel2:       #102030;
  --bg:           #070f1c;
  --bg2:          #08121f;

  /* ── Shadows — deeper, richer ── */
  --shadow:       0 8px 32px rgba(0,0,0,.55);
  --shadow2:      0 2px 12px rgba(0,0,0,.42);
  --focus:        0 0 0 3px rgba(45,134,232,.25);
  --effect-shadow-soft:   0 4px 16px rgba(0,0,0,.42);
  --effect-shadow-strong: 0 18px 52px rgba(0,0,0,.65);

  /* ── Radius ── */
  --radius:  14px;
  --radius2: 10px;

  /* ── Font ── */
  --font: 'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;

  color-scheme: dark;
}

/* ── BASE BODY — Vivid deep-navy, azure aurora gradient ── */
body[data-theme="aurora_midnight"] {
  background:
    radial-gradient(ellipse 70% 45% at 20% -5%,  rgba(45,134,232,.12)  0%, transparent 58%),
    radial-gradient(ellipse 55% 35% at 85% 95%,  rgba(6,214,176,.09)   0%, transparent 52%),
    radial-gradient(ellipse 40% 30% at 75% 20%,  rgba(79,172,249,.06)  0%, transparent 45%),
    linear-gradient(160deg, #070f1c 0%, #080e1a 60%, #060c18 100%);
  color: #ddeeff;
  font-family: var(--font);
}

/* ══════════════════════════════════════════════════════════════════
   ⚠️  AI GUARDRAIL — CRITICAL LAYOUT RULE FOR ALL THEMES
   ══════════════════════════════════════════════════════════════════
   RULE: Themes MUST NOT override structural layout properties.
   Themes are ONLY allowed to change:
     ✅ colors, backgrounds, gradients
     ✅ border colors and styles
     ✅ box-shadows
     ✅ font-family, font-weight, letter-spacing, text-shadow
     ✅ border-radius (decorative only)
     ✅ opacity, filter (decorative only)
     ✅ CSS custom property values (--surface-1, --text, etc.)

   Themes MUST NEVER override:
     ❌ display, grid-template-*, grid-column, grid-row
     ❌ position, top, right, bottom, left, z-index
     ❌ width, height, min-height, max-height
     ❌ overflow (any variant)
     ❌ flex, flex-direction, flex-grow, flex-shrink, flex-basis
     ❌ padding (shorthand) — use padding-top/right/left only,
        NEVER padding-bottom on .app (it controls dock clearance)
     ❌ margin (shorthand that resets any axis)
     ❌ gap (on .app — affects the main 3-column grid)
     ❌ align-self, justify-self on grid children (.side/.main/.right)

   WHY: The bottom dock (.quicklinks-bar) and the online-users-bar
   are position:fixed with heights stored in CSS variables:
     --mums-dock-h: 86px
     --mums-onlinebar-h: 44px
   The .app container MUST have padding-bottom equal to their sum
   so sidebar/content is never buried under them.
   Shorthand "padding:Xpx" resets padding-bottom to X, defeating
   the base rule "padding-bottom: calc(var(--mums-dock-h) + ...)"
   and causing all column content to be clipped by the fixed bars.

   CORRECT pattern for any theme that needs custom .app spacing:
     body[data-theme="your_theme"] .app {
       gap: 12px;                    ✅ OK — just changes gap
       padding: 12px;                ❌ WRONG — resets padding-bottom
       padding-top: 12px;            ✅ CORRECT way to set top only
       padding-left: 12px;           ✅ CORRECT
       padding-right: 12px;          ✅ CORRECT
       /* padding-bottom: NEVER TOUCH — set by base layout */
     }
   ══════════════════════════════════════════════════════════════════ */

/* ── APP GRID ── */
body[data-theme="aurora_midnight"] .app {
  gap: 12px;
  padding-top: 12px;
  padding-left: 12px;
  padding-right: 12px;
}

/* ── CARDS — Brighter, deeper contrast ── */
body[data-theme="aurora_midnight"] .card {
  background: linear-gradient(155deg, rgba(255,255,255,.055) 0%, rgba(255,255,255,.022) 100%) !important;
  border: 1px solid rgba(60,140,255,.18) !important;
  box-shadow: 0 4px 22px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.055) !important;
}

/* ── TOPBAR — Deep navy, azure shimmer ── */
body[data-theme="aurora_midnight"] .topbar {
  background: linear-gradient(90deg, #08111f 0%, #0a1628 50%, #08111f 100%) !important;
  border: 1px solid rgba(60,140,255,.2) !important;
  position: relative;
}
body[data-theme="aurora_midnight"] .topbar::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(45,134,232,.7) 20%,
    rgba(79,172,249,.9) 45%,
    rgba(6,214,176,.7)  70%,
    rgba(45,134,232,.5) 85%,
    transparent 100%);
  pointer-events: none;
  z-index: 1;
}
body[data-theme="aurora_midnight"] .topbrand {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(60,140,255,.14) !important;
}
body[data-theme="aurora_midnight"] .brand-name {
  color: #eef5ff;
  font-weight: 800;
  text-shadow: 0 0 18px rgba(79,172,249,.5), 0 0 36px rgba(6,214,176,.2);
}
body[data-theme="aurora_midnight"] .brand-sub { color: #7aa8cc; }
body[data-theme="aurora_midnight"] .brand-mark {
  background: linear-gradient(135deg, #1a6fcf, #2d86e8) !important;
  box-shadow: 0 0 18px rgba(45,134,232,.6), 0 4px 14px rgba(0,0,0,.4) !important;
}

/* ── GLOBAL SEARCH ── */
body[data-theme="aurora_midnight"] .top-global-search {
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(60,140,255,.18) !important;
  border-radius: 10px !important;
}
body[data-theme="aurora_midnight"] .top-global-search:focus-within {
  border-color: rgba(45,134,232,.55) !important;
  box-shadow: 0 0 0 3px rgba(45,134,232,.14) !important;
}
body[data-theme="aurora_midnight"] #globalSearchInput {
  color: #ddeeff !important;
  background: transparent !important;
}
body[data-theme="aurora_midnight"] #globalSearchInput::placeholder { color: #7aa8cc !important; }

/* ── TOPBAR ICON BUTTONS ── */
body[data-theme="aurora_midnight"] .btn.ghost.iconbtn {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(60,140,255,.16) !important;
  color: #a8c8e8 !important;
}
body[data-theme="aurora_midnight"] .btn.ghost.iconbtn:hover {
  background: rgba(45,134,232,.14) !important;
  border-color: rgba(79,172,249,.35) !important;
  color: #c8e4ff !important;
}

/* ── LOGOUT BUTTON ── */
body[data-theme="aurora_midnight"] #logoutBtn {
  background: rgba(244,108,108,.1) !important;
  border-color: rgba(244,108,108,.28) !important;
  color: #ffb3b3 !important;
  font-weight: 700 !important;
}
body[data-theme="aurora_midnight"] #logoutBtn:hover {
  background: rgba(244,108,108,.2) !important;
  border-color: rgba(244,108,108,.45) !important;
  box-shadow: 0 4px 16px rgba(244,108,108,.25) !important;
}

/* ── SYNC STATUS ── */
body[data-theme="aurora_midnight"] .sync-status {
  background: rgba(6,214,176,.1) !important;
  border: 1px solid rgba(6,214,176,.28) !important;
  color: #06d6b0 !important;
}
body[data-theme="aurora_midnight"] .sync-status .dot {
  background: #06d6b0 !important;
  box-shadow: 0 0 8px rgba(6,214,176,.8) !important;
}

/* ══════════════════════════════════════════════════════════════
   LEFT SIDEBAR — FULL ENTERPRISE VISIBILITY REDESIGN
   ══════════════════════════════════════════════════════════════ */
body[data-theme="aurora_midnight"] aside.side {
  background: linear-gradient(180deg, #0a1628 0%, #08111f 55%, #070f1c 100%) !important;
  border-color: rgba(60,140,255,.2) !important;
  box-shadow: 2px 0 20px rgba(0,0,0,.35) !important;
}

/* ── SECTION LABELS — much brighter ── */
body[data-theme="aurora_midnight"] .nav-section-label,
body[data-theme="aurora_midnight"] .nav-label {
  color: #5a9abf !important;
  font-size: 9.5px !important;
  font-weight: 900 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
}

/* ── NAV BASE ITEMS ── */
body[data-theme="aurora_midnight"] .nav a,
body[data-theme="aurora_midnight"] .nav .nav-item,
body[data-theme="aurora_midnight"] .nav .nav-group-head {
  color: #c4daf0 !important;
  border-radius: 9px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: all .13s !important;
  border: 1px solid transparent !important;
  letter-spacing: .01em !important;
}

/* ── NAV HOVER ── */
body[data-theme="aurora_midnight"] .nav a:hover,
body[data-theme="aurora_midnight"] .nav .nav-item:hover,
body[data-theme="aurora_midnight"] .nav .nav-group-head:hover {
  background: rgba(45,134,232,.12) !important;
  color: #e8f4ff !important;
  border-color: rgba(79,172,249,.22) !important;
  box-shadow: inset 0 0 0 1px rgba(79,172,249,.08) !important;
}

/* ── NAV ACTIVE — Azure gradient, crisp indicator ── */
body[data-theme="aurora_midnight"] .nav a.active,
body[data-theme="aurora_midnight"] .nav .nav-item.active {
  background: linear-gradient(90deg, rgba(45,134,232,.25) 0%, rgba(45,134,232,.08) 100%) !important;
  border-color: rgba(79,172,249,.38) !important;
  color: #b8e0ff !important;
  font-weight: 700 !important;
  box-shadow: inset 0 0 0 1px rgba(79,172,249,.12), 0 2px 10px rgba(45,134,232,.1) !important;
}

/* ── ACTIVE LEFT INDICATOR STRIPE ── */
body[data-theme="aurora_midnight"] .nav a.active::before,
body[data-theme="aurora_midnight"] .nav .nav-item.active::before {
  content: '';
  position: absolute;
  left: 0; top: 20%; bottom: 20%;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, #4facf9, #06d6b0);
  box-shadow: 0 0 10px rgba(79,172,249,.8), 0 0 22px rgba(6,214,176,.25);
}

/* ── SUB-ITEMS — Lighter, clearly readable ── */
body[data-theme="aurora_midnight"] .nav-item.nav-subitem {
  color: #a8c8e8 !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
}
body[data-theme="aurora_midnight"] .nav-item.nav-subitem:hover {
  color: #e0f0ff !important;
  background: rgba(45,134,232,.09) !important;
}
body[data-theme="aurora_midnight"] .nav-item.nav-subitem.active {
  color: #b8e0ff !important;
  background: rgba(45,134,232,.16) !important;
}

/* ── NAV GROUP CONNECTOR LINE ── */
body[data-theme="aurora_midnight"] .nav-group.is-record-group .nav-group-kids::before {
  background: rgba(45,134,232,.28) !important;
}

/* ── SIDEBAR PROFILE / USER CARD ── */
body[data-theme="aurora_midnight"] .usercard { background: transparent !important; }
body[data-theme="aurora_midnight"] .sp-name-strong,
body[data-theme="aurora_midnight"] .uc-name { color: #f0f8ff !important; font-weight: 800 !important; }
body[data-theme="aurora_midnight"] .sp-meta-subtitle,
body[data-theme="aurora_midnight"] .sp-shift,
body[data-theme="aurora_midnight"] .sp-team,
body[data-theme="aurora_midnight"] .sp-shift-sm,
body[data-theme="aurora_midnight"] .uc-meta { color: #94b8d8 !important; }
body[data-theme="aurora_midnight"] .sp-photo,
body[data-theme="aurora_midnight"] .sp-photo-sm {
  border-color: rgba(45,134,232,.38) !important;
  background: rgba(45,134,232,.14) !important;
}
body[data-theme="aurora_midnight"] .sp-photo .initials,
body[data-theme="aurora_midnight"] .sp-photo-sm .initials { color: #ddeeff !important; }
body[data-theme="aurora_midnight"] .sp-presence-dot.is-active {
  background: #3fd67a !important;
  box-shadow: 0 0 8px rgba(63,214,122,.7) !important;
}
body[data-theme="aurora_midnight"] .sp-position {
  background: rgba(45,134,232,.14) !important;
  border-color: rgba(79,172,249,.32) !important;
  color: #90caff !important;
}

/* ── SIDE ACTIVITY LOG ── */
body[data-theme="aurora_midnight"] .logline { color: #94b8d8 !important; }
body[data-theme="aurora_midnight"] .logline .m { color: #b4cce8 !important; }
body[data-theme="aurora_midnight"] .logline .tl-dot {
  background: rgba(45,134,232,.75) !important;
  box-shadow: 0 0 6px rgba(45,134,232,.5) !important;
}
body[data-theme="aurora_midnight"] .logline .tl-dot::after { background: rgba(45,134,232,.2) !important; }

/* ── RIGHT SIDEBAR ── */
body[data-theme="aurora_midnight"] aside.right {
  background: linear-gradient(180deg, #09111f 0%, #070e1a 100%) !important;
  border-color: rgba(60,140,255,.18) !important;
}

/* ── MAIN CONTENT AREA ── */
body[data-theme="aurora_midnight"] .main.card,
body[data-theme="aurora_midnight"] main.main {
  background: linear-gradient(160deg, #080f1c 0%, #070d18 100%) !important;
  border-color: rgba(60,140,255,.14) !important;
  position: relative;
}

/* ── ANNOUNCEMENT BAR ── */
body[data-theme="aurora_midnight"] .announce-bar {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(60,140,255,.14) !important;
  border-radius: 12px !important;
  border-left: 2px solid #f8c144 !important;
  position: relative !important;
}
body[data-theme="aurora_midnight"] .announce-bar:hover {
  background: rgba(255,255,255,.05) !important;
  border-left-color: #fbbf24 !important;
}
body[data-theme="aurora_midnight"] .announce-bar::before { display: none !important; }
body[data-theme="aurora_midnight"] .announce-who { color: #7aa8cc !important; font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .06em !important; }
body[data-theme="aurora_midnight"] .announce-title { color: #eef5ff !important; font-size: 13px !important; font-weight: 800 !important; }
body[data-theme="aurora_midnight"] .announce-msg { color: #b4cce8 !important; font-size: 12px !important; }
body[data-theme="aurora_midnight"] .announce-avatar {
  width: 32px !important; height: 32px !important; border-radius: 9px !important;
  background: linear-gradient(135deg, #1a6fcf, #2d86e8) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: 12px !important; font-weight: 800 !important; color: #fff !important;
}

/* ── REMINDER FLOAT CARDS ── */
body[data-theme="aurora_midnight"] .reminder-card {
  background: rgba(10,18,38,.94) !important;
  border: 1px solid rgba(60,140,255,.22) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.03) !important;
  backdrop-filter: blur(16px) !important;
}
body[data-theme="aurora_midnight"] .reminder-card.my {
  border-color: rgba(63,214,122,.38) !important;
  background: linear-gradient(135deg, rgba(63,214,122,.08), rgba(6,214,176,.04)) !important;
}
body[data-theme="aurora_midnight"] .reminder-card.team {
  border-color: rgba(244,108,108,.35) !important;
  background: linear-gradient(135deg, rgba(244,108,108,.07), rgba(248,193,68,.04)) !important;
}
body[data-theme="aurora_midnight"] .reminder-card .rc-title { color: #ddeeff !important; font-size: 12px !important; font-weight: 700 !important; }
body[data-theme="aurora_midnight"] .reminder-card .rc-meta { color: #94b8d8 !important; font-size: 11px !important; }
body[data-theme="aurora_midnight"] .reminder-card.my .rc-badge { background: rgba(63,214,122,.14) !important; border: 1px solid rgba(63,214,122,.3) !important; color: #80f0a8 !important; }
body[data-theme="aurora_midnight"] .reminder-card.team .rc-badge { background: rgba(244,108,108,.12) !important; border: 1px solid rgba(244,108,108,.28) !important; color: #ffc0c0 !important; }

/* ── BUTTONS ── */
body[data-theme="aurora_midnight"] .btn {
  background: linear-gradient(155deg, rgba(255,255,255,.07), rgba(255,255,255,.03)) !important;
  border-color: rgba(60,140,255,.2) !important;
  color: #ddeeff !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.25) !important;
  font-weight: 600 !important;
}
body[data-theme="aurora_midnight"] .btn:hover {
  background: rgba(255,255,255,.1) !important;
  border-color: rgba(79,172,249,.32) !important;
}
body[data-theme="aurora_midnight"] .btn.primary {
  background: linear-gradient(135deg, #1a6fcf, #2d86e8) !important;
  border-color: rgba(79,172,249,.55) !important;
  color: #fff !important;
  box-shadow: 0 4px 18px rgba(45,134,232,.32) !important;
}
body[data-theme="aurora_midnight"] .btn.primary:hover {
  box-shadow: 0 6px 24px rgba(45,134,232,.48) !important;
  transform: translateY(-1px);
}
body[data-theme="aurora_midnight"] .btn.danger {
  background: linear-gradient(135deg, rgba(210,40,40,.7), rgba(180,30,30,.6)) !important;
  border-color: rgba(244,108,108,.42) !important;
  color: #ffcece !important;
  box-shadow: 0 4px 14px rgba(210,40,40,.22) !important;
}
body[data-theme="aurora_midnight"] .btn.tiny { box-shadow: none !important; }
body[data-theme="aurora_midnight"] .btn.ghost {
  background: transparent !important;
  box-shadow: none !important;
}

/* ── INPUTS ── */
body[data-theme="aurora_midnight"] input,
body[data-theme="aurora_midnight"] select,
body[data-theme="aurora_midnight"] textarea,
body[data-theme="aurora_midnight"] .input {
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(60,140,255,.2) !important;
  color: #ddeeff !important;
  border-radius: 9px !important;
}
body[data-theme="aurora_midnight"] input:focus,
body[data-theme="aurora_midnight"] select:focus,
body[data-theme="aurora_midnight"] textarea:focus,
body[data-theme="aurora_midnight"] .input:focus {
  border-color: rgba(45,134,232,.6) !important;
  box-shadow: 0 0 0 3px rgba(45,134,232,.14) !important;
  background: rgba(255,255,255,.07) !important;
}
body[data-theme="aurora_midnight"] input::placeholder,
body[data-theme="aurora_midnight"] textarea::placeholder { color: #5a8aaa !important; }

/* ── GLOBAL TABLES — Vivid headers ── */
body[data-theme="aurora_midnight"] th {
  background: linear-gradient(180deg, #0f1e38 0%, #0c1a30 100%) !important;
  color: #7aacce !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  border-bottom: 1px solid rgba(60,140,255,.22) !important;
}
body[data-theme="aurora_midnight"] td { border-bottom: 1px solid rgba(60,140,255,.08) !important; color: #b8d0ec !important; }
body[data-theme="aurora_midnight"] tr:hover td { background: rgba(45,134,232,.05) !important; }

/* ── MODALS ── */
body[data-theme="aurora_midnight"] .modal {
  background: rgba(0,0,0,.75) !important;
  backdrop-filter: blur(14px) !important;
}
body[data-theme="aurora_midnight"] .modal .panel {
  background: linear-gradient(145deg, #0a1525, #0c1a2e) !important;
  border: 1px solid rgba(60,140,255,.2) !important;
  box-shadow: 0 32px 80px rgba(0,0,0,.72), 0 0 0 1px rgba(255,255,255,.04) !important;
  border-radius: 16px !important;
  color: #ddeeff !important;
}
body[data-theme="aurora_midnight"] .modal .head {
  border-bottom: 1px solid rgba(60,140,255,.14) !important;
}

/* ── POPOVER / ROLE PICKER ── */
body[data-theme="aurora_midnight"] .popover,
body[data-theme="aurora_midnight"] .role-picker {
  background: #0c1524 !important;
  border: 1px solid rgba(60,140,255,.22) !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.65) !important;
  color: #ddeeff !important;
}

/* ── NOTIFICATION POPOUT ── */
body[data-theme="aurora_midnight"] .notification-popout {
  background: linear-gradient(145deg, #0a1525, #0c1a2e) !important;
  border: 1px solid rgba(60,140,255,.2) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.65), 0 0 30px rgba(45,134,232,.08) !important;
  backdrop-filter: blur(20px) !important;
}
body[data-theme="aurora_midnight"] .notification-popout .notif-item {
  border-radius: 9px !important;
  border: 1px solid rgba(60,140,255,.1) !important;
  transition: all .14s !important;
}
body[data-theme="aurora_midnight"] .notification-popout .notif-item:hover {
  background: rgba(45,134,232,.08) !important;
  border-color: rgba(79,172,249,.25) !important;
}
body[data-theme="aurora_midnight"] .notification-popout .notif-item.unread {
  border-left: 2px solid #2d86e8 !important;
  background: rgba(45,134,232,.06) !important;
}
body[data-theme="aurora_midnight"] .notif-item-title { color: #ddeeff !important; font-weight: 700 !important; }
body[data-theme="aurora_midnight"] .notif-item-body { color: #94b8d8 !important; font-size: 11.5px !important; }

/* ── DASHX NOTIFICATIONS ── */
body[data-theme="aurora_midnight"] .dashx-notif {
  background: rgba(10,18,38,.92) !important;
  border: 1px solid rgba(60,140,255,.16) !important;
}
body[data-theme="aurora_midnight"] .dashx-notif.unread {
  border-color: rgba(45,134,232,.48) !important;
  background: rgba(45,134,232,.07) !important;
}

/* ── BADGES / PILLS ── */
body[data-theme="aurora_midnight"] .badge { background: rgba(255,255,255,.05) !important; border-color: rgba(60,140,255,.22) !important; color: #b4cce8 !important; }
body[data-theme="aurora_midnight"] .badge.ok { background: rgba(63,214,122,.12) !important; border-color: rgba(63,214,122,.32) !important; color: #80f0a8 !important; }
body[data-theme="aurora_midnight"] .badge.danger { background: rgba(244,108,108,.12) !important; border-color: rgba(244,108,108,.30) !important; color: #ffb8b8 !important; }
body[data-theme="aurora_midnight"] .badge.warn { background: rgba(248,193,68,.12) !important; border-color: rgba(248,193,68,.28) !important; color: #ffe090 !important; }
body[data-theme="aurora_midnight"] .badge.info { background: rgba(79,172,249,.12) !important; border-color: rgba(79,172,249,.28) !important; color: #90d0ff !important; }
body[data-theme="aurora_midnight"] .pill { background: rgba(45,134,232,.14) !important; border: 1px solid rgba(79,172,249,.28) !important; color: #90caff !important; border-radius: 6px !important; font-weight: 700 !important; }

/* ── ONLINE USERS BAR ── */
body[data-theme="aurora_midnight"] .online-users-bar {
  background: linear-gradient(
    180deg,
    rgba(7,15,28,0) 0%,
    rgba(7,15,28,.85) 50%,
    rgba(7,15,28,.97) 100%) !important;
  border-top: 1px solid rgba(60,140,255,.12) !important;
  backdrop-filter: blur(14px) !important;
}
body[data-theme="aurora_midnight"] .onlinebar-sec {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(60,140,255,.12) !important;
  border-radius: 10px !important;
}
body[data-theme="aurora_midnight"] .onlinebar-title { color: #5a8aaa !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: .1em !important; text-transform: uppercase !important; }
body[data-theme="aurora_midnight"] .onlinebar-count { color: #94b8d8 !important; }
body[data-theme="aurora_midnight"] .online-pill {
  border: 1.5px solid rgba(63,214,122,.7) !important;
  background: rgba(255,255,255,.05) !important;
}
body[data-theme="aurora_midnight"] .online-pill.is-red { border-color: rgba(244,108,108,.8) !important; }
body[data-theme="aurora_midnight"] .online-pill .ini { color: #ddeeff !important; }

/* ── QUICKLINKS DOCK ── */
body[data-theme="aurora_midnight"] .quicklinks-bar {
  background: linear-gradient(180deg, rgba(7,15,28,.55) 0%, rgba(5,10,20,.97) 100%) !important;
  border-top: 1px solid rgba(60,140,255,.12) !important;
  backdrop-filter: blur(20px) !important;
}
body[data-theme="aurora_midnight"] .qcircle {
  background: rgba(45,134,232,.1) !important;
  border: 1px solid rgba(45,134,232,.24) !important;
  box-shadow: 0 0 12px rgba(45,134,232,.1) !important;
}
body[data-theme="aurora_midnight"] .qcircle:hover {
  background: rgba(45,134,232,.22) !important;
  border-color: rgba(79,172,249,.45) !important;
  box-shadow: 0 0 20px rgba(45,134,232,.32) !important;
  transform: translateY(-2px);
}
body[data-theme="aurora_midnight"] .qcircle .qtxt { color: #ddeeff !important; }
body[data-theme="aurora_midnight"] .qlabel { color: #7aa8cc !important; font-size: 9.5px !important; }

/* ── WORLD CLOCKS ── */
body[data-theme="aurora_midnight"] .wclock {
  background: rgba(45,134,232,.08) !important;
  border: 1px solid rgba(45,134,232,.22) !important;
  border-radius: 10px !important;
  backdrop-filter: blur(10px) !important;
}
body[data-theme="aurora_midnight"] .wclock .wc-label { color: #7aa8cc !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: .08em !important; text-transform: uppercase !important; }
body[data-theme="aurora_midnight"] .wclock .wc-h,
body[data-theme="aurora_midnight"] .wclock .wc-m { color: #ddeeff !important; font-weight: 700 !important; }
body[data-theme="aurora_midnight"] .wclock .wc-sec { color: #7aa8cc !important; }

/* ── HIGH ALERT BOX ── */
body[data-theme="aurora_midnight"] .high-alert-box {
  background: rgba(200,30,60,.9) !important;
  border-color: rgba(255,255,255,.2) !important;
}

/* ── HR / SEPARATORS ── */
body[data-theme="aurora_midnight"] hr { border-color: rgba(60,140,255,.14) !important; }

/* ── GENERAL TEXT ── */
body[data-theme="aurora_midnight"] .small, body[data-theme="aurora_midnight"] .muted { color: #94b8d8 !important; }
body[data-theme="aurora_midnight"] .section-title { color: #ddeeff !important; }

/* ── SCHEDULE / SHIFT ELEMENTS ── */
body[data-theme="aurora_midnight"] .schx-kpi {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(60,140,255,.18) !important;
  color: #ddeeff !important;
}
body[data-theme="aurora_midnight"] .schx-kpi.countdown.ok { border-color: rgba(63,214,122,.40) !important; background: rgba(63,214,122,.08) !important; }
body[data-theme="aurora_midnight"] .schx-kpi.countdown.focus { border-color: rgba(79,172,249,.40) !important; background: rgba(79,172,249,.08) !important; }
body[data-theme="aurora_midnight"] .schx-kpi.countdown.warn { border-color: rgba(248,193,68,.48) !important; background: rgba(248,193,68,.09) !important; }

/* ── MEMBER / PROFILE COMPONENTS ── */
body[data-theme="aurora_midnight"] .up-role {
  background: rgba(45,134,232,.12) !important;
  border-color: rgba(79,172,249,.26) !important;
  color: #90caff !important;
}
body[data-theme="aurora_midnight"] .up-sub { color: #94b8d8 !important; }
body[data-theme="aurora_midnight"] .sp-duty { color: #b4cce8 !important; }
body[data-theme="aurora_midnight"] .sp-name { color: #eef5ff !important; }

/* ── LINK COLORS ── */
body[data-theme="aurora_midnight"] a { color: #5ab8f8; }
body[data-theme="aurora_midnight"] a:hover { color: #8ed0ff; }

/* ── SELECTION ── */
body[data-theme="aurora_midnight"] ::selection { background: rgba(45,134,232,.32); }

/* ── SCROLLBAR ── */
body[data-theme="aurora_midnight"] ::-webkit-scrollbar { width: 5px; height: 5px; }
body[data-theme="aurora_midnight"] ::-webkit-scrollbar-track { background: rgba(255,255,255,.02); }
body[data-theme="aurora_midnight"] ::-webkit-scrollbar-thumb { background: rgba(45,134,232,.25); border-radius: 999px; }
body[data-theme="aurora_midnight"] ::-webkit-scrollbar-thumb:hover { background: rgba(79,172,249,.45); }
body[data-theme="mono"]{
  --surface-bg:#0b0c10;--surface-bg-alt:#111318;--surface-card:#13151b;--surface-card-alt:#0f1116;--surface-modal:#13151b;--text-primary:#f3f4f6;--text-muted:#b7bcc6;--text-inverse:#0f172a;--accent-primary:#a3a3a3;--accent-primary-hover:#8f8f8f;--accent-border:rgba(255,255,255,.10);
}


/* ════════════════════════════════════════════════════════════
   SIDEBAR SCROLL FIX v3 — definitive
   ════════════════════════════════════════════════════════════

   Root cause (confirmed):
   Setting height:100% on a grid item that already uses the
   default align-self:stretch causes Chrome to resolve it as
   100% of the GRID CONTAINER height — not the track height.
   This makes .side taller than its track, so .nav never
   overflows it and overflow-y:auto never activates.

   Correct technique:
   Do NOT set height:100% on .side. Instead, set overflow:hidden.
   overflow:hidden on a grid item creates a new BFC and PREVENTS
   the flex container from growing past its grid track boundary.
   Now .side's intrinsic height = the track height (definite).
   flex:1 1 0px on .nav then correctly fills the remaining
   bounded space and overflow-y:auto activates when content
   exceeds that space.

   Specificity note:
   Line ~2318 has: body:not(.sidebar-collapsed) .side .nav
   { display:block } at specificity 0-3-1.
   We must use an equal or higher specificity selector below,
   placed later in the file, to override it.
   ════════════════════════════════════════════════════════════ */

/* 1 ── Sidebar shell: flex column, bounded by overflow:hidden
        DO NOT add height:100% — grid stretch + overflow:hidden
        is what actually constrains the height. */
aside.side,
.side.card.pad {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  min-height: 0 !important;
}

/* 2 ── Nav: fills remaining space and scrolls.
        Selector specificity 0-3-1 beats the display:block rule
        at line ~2318. !important ensures it sticks. */
body:not(.sidebar-collapsed) .side #nav,
body:not(.sidebar-collapsed) .side .nav {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 0px !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: 3px !important;
}
/* Low-specificity fallback for non-collapsed state without body class */
.side #nav,
.side .nav {
  flex: 1 1 0px !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* 3 ── Fixed-size siblings — never grow, never push nav out */
.side .usercard {
  flex: 0 0 auto !important;
}
.side .side-logs {
  flex: 0 0 auto !important;
  margin-top: auto !important;
}

/* 4 ── Thin scrollbar — appears only when nav overflows */
.side #nav::-webkit-scrollbar,
.side .nav::-webkit-scrollbar { width: 3px; }
.side #nav::-webkit-scrollbar-track,
.side .nav::-webkit-scrollbar-track { background: transparent; }
.side #nav::-webkit-scrollbar-thumb,
.side .nav::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.15);
  border-radius: 999px;
}
.side #nav::-webkit-scrollbar-thumb:hover,
.side .nav::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,.30);
}

/* 5 ── Collapsed sidebar: icon-only, no scroll */
body.sidebar-collapsed aside.side,
body.sidebar-collapsed .side.card.pad {
  overflow: hidden !important;
}


/* ═══════════════════════════════════════════════════════════════════════
   MUMS BUILD 2 — SIDEBAR NAV ALIGNMENT FIX
   Overrides legacy overflow:hidden rules that were clipping nav items.
   ═══════════════════════════════════════════════════════════════════════ */

/* 1. Side panel: flex column so nav fills remaining height, scrolls inside */
aside.side.card.pad,
aside.side {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;   /* clip X; flex children manage Y */
}

/* 2. Nav: takes all available height, scrolls vertically */
aside.side .nav,
aside.side #nav {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 3. Nav group wrapper: never clip children (was cutting off MEMBERS etc.) */
.nav-group {
  overflow: visible !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 4. All nav items & group heads: full width, never overflow parent */
.nav .nav-item,
.nav .nav-group-head {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  overflow: hidden !important;  /* clip text only, not layout */
}

/* 5. Nav label text: clip with ellipsis, never cause layout overflow */
.nav .nav-label {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* 6. Icon: fixed width so labels always line up */
.nav .nav-ico {
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
}

/* 7. Sub-items (inside nav-group-kids): indented but still full-width */
.nav-group-kids {
  overflow: visible !important;
  padding: 2px 0 8px 0 !important;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.nav .nav-item.nav-subitem {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 8. Side-logs pushed to bottom of flex column */
.side .side-logs {
  flex-shrink: 0 !important;
  margin-top: auto !important;
}
.side .usercard {
  flex-shrink: 0 !important;
}

/* =============================================================================
   MUMS – LIGHT  |  Monday.com Work OS Theme  |  Phase 1-618
   Theme ID : mums_light  |  mode : light
   ─────────────────────────────────────────────────────────────────────────────
   RULES:  Aesthetic overrides ONLY — NO structural layout changes.
           All dark-background components across every page overridden here.
           Other themes (aurora_midnight, mono, classic_style) are UNTOUCHED.
   ============================================================================= */

/* ── 0. CSS variable root overrides for light mode ─────────────────────────── */
body[data-theme="mums_light"] {
  --bg:           #f6f7fb;
  --bg2:          #ecedf2;
  --panel:        #ffffff;
  --panel2:       #f0f2f8;
  --border:       #e6e9ef;
  --border2:      #d0d4de;
  --text:         #1f2633;
  --muted:        #676879;
  --muted2:       #9699a6;
  --primary:      #0073ea;
  --primary2:     #0060c2;
  --danger:       #e2445c;
  --warn:         #fdab3d;
  --ok:           #00ca72;
  --accent:       #0073ea;
  --accent-rgb:   0,115,234;
  --shadow:       0 4px 16px rgba(31,38,51,.08), 0 1px 4px rgba(31,38,51,.04);
  --shadow2:      0 2px 8px rgba(31,38,51,.06);
  --radius:       8px;
  --radius2:      6px;
  --focus:        0 0 0 3px rgba(0,115,234,.18);
  --ux-shadow-soft: 0 2px 8px rgba(31,38,51,.06);
  --ux-focus:     0 0 0 3px rgba(0,115,234,.18);
  --ux-radius:    8px;
  background: #f6f7fb;
  color: #1f2633;
}

/* ── 1. App shell ───────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .app {
  gap: 0; padding: 0; padding-bottom: 120px; background: #f6f7fb;
}

/* ── 2. Topbar ──────────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .topbar {
  background: #ffffff; border: none;
  border-bottom: 1px solid #e6e9ef; border-radius: 0;
  box-shadow: 0 1px 4px rgba(31,38,51,.06);
  padding: 0 20px; height: 56px; align-items: center;
}
body[data-theme="mums_light"] .topbrand { background: transparent; border: none; padding: 0; gap: 10px; }
body[data-theme="mums_light"] .brand-mark {
  background: linear-gradient(135deg,#0073ea,#a25ddc) !important;
  box-shadow: 0 2px 8px rgba(0,115,234,.28); border-radius: 8px;
}
body[data-theme="mums_light"] .brand-mark::after { color:#fff !important; font-weight:900; text-shadow:none; }
body[data-theme="mums_light"] .brand-name { color:#1f2633; text-shadow:none; font-weight:900; letter-spacing:.03em; }
body[data-theme="mums_light"] .brand-sub,
body[data-theme="mums_light"] .brand-build { color:#676879; }

/* Search */
body[data-theme="mums_light"] .top-global-search {
  background: #f6f7fb; border: 1px solid #d0d4de; border-radius: 6px; box-shadow: none;
}
body[data-theme="mums_light"] #globalSearchInput { background: transparent; color: #1f2633; font-size:13px; }
body[data-theme="mums_light"] #globalSearchInput::placeholder { color: #9699a6; }

/* Icon buttons */
body[data-theme="mums_light"] .topbar-actions .btn.ghost.iconbtn {
  background: #fff; border: 1px solid #e6e9ef; color: #676879; border-radius: 6px; box-shadow: none;
}
body[data-theme="mums_light"] .topbar-actions .btn.ghost.iconbtn:hover {
  background: #f0f2f8; border-color: #d0d4de; color: #1f2633;
}

/* Sync pill */
body[data-theme="mums_light"] .sync-status {
  background: rgba(0,202,114,.08); border-color: rgba(0,202,114,.28);
  color: #007a45; box-shadow: none;
}
body[data-theme="mums_light"] .sync-status .dot { background:#00ca72; box-shadow:0 0 0 3px rgba(0,202,114,.18); }
body[data-theme="mums_light"] .sync-status .label { color:#007a45; }
body[data-theme="mums_light"] .sync-status .state { color:#007a45; font-weight:800; }
body[data-theme="mums_light"] .sync-status.poll .dot { background:#fdab3d; box-shadow:0 0 0 3px rgba(253,171,61,.18); }
body[data-theme="mums_light"] .sync-status.off  .dot { background:#e2445c; box-shadow:0 0 0 3px rgba(226,68,92,.18); }

/* Logout */
body[data-theme="mums_light"] #logoutBtn {
  background: #e2445c; border-color: #e2445c; color: #fff; border-radius: 6px; font-weight: 700; box-shadow: none;
}
body[data-theme="mums_light"] #logoutBtn:hover { background:#c0001e; border-color:#c0001e; }

/* ── 3. Sidebar ─────────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] aside.side {
  background: #ffffff !important; border: none !important;
  border-right: 1px solid #e6e9ef !important; border-radius: 0 !important; box-shadow: none !important;
  padding: 16px 12px !important;
}
body[data-theme="mums_light"] .usercard { padding-bottom:12px; margin-bottom:4px; border-bottom:1px solid #e6e9ef; }
body[data-theme="mums_light"] .usercard .uc-name,
body[data-theme="mums_light"] .usercard .name { color:#1f2633; text-shadow:none; }
body[data-theme="mums_light"] .usercard .uc-meta,
body[data-theme="mums_light"] .usercard .value,
body[data-theme="mums_light"] .usercard .small { color:#676879; }
body[data-theme="mums_light"] .uc-avatar,
body[data-theme="mums_light"] .usercard .uc-avatar {
  background: linear-gradient(135deg,#0073ea,#a25ddc);
  box-shadow: 0 2px 8px rgba(0,115,234,.25); border:2px solid #fff;
}

/* ── 4. Navigation ──────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .nav a,
body[data-theme="mums_light"] .nav .nav-item,
body[data-theme="mums_light"] .nav .nav-group-head {
  color: #676879; border-color: transparent; border-radius: 6px;
}
body[data-theme="mums_light"] .nav .nav-label { font-size:13px; font-weight:600; color:inherit; }
body[data-theme="mums_light"] .nav a:hover,
body[data-theme="mums_light"] .nav .nav-item:hover,
body[data-theme="mums_light"] .nav .nav-group-head:hover {
  background: #f0f2f8; border-color: transparent; color: #1f2633;
}
body[data-theme="mums_light"] .nav a.active,
body[data-theme="mums_light"] .nav .nav-item.active {
  background: rgba(0,115,234,.08) !important; border-color: transparent !important;
  color: #0073ea !important; font-weight:700;
  box-shadow: inset 3px 0 0 #0073ea !important;
}
body[data-theme="mums_light"] .nav .nav-group.active { background:transparent; border-color:#e6e9ef; }
body[data-theme="mums_light"] .nav-badge { background:#e2445c; color:#fff; }

/* ── 5. Main content area ───────────────────────────────────────────────────── */
body[data-theme="mums_light"] .main,
body[data-theme="mums_light"] .main.card.pad {
  background: #f6f7fb !important; border: none !important;
  border-radius: 0 !important; box-shadow: none !important;
}

/* ── 6. Right Sidebar ───────────────────────────────────────────────────────── */
body[data-theme="mums_light"] aside.right {
  background: #ffffff !important; border: none !important;
  border-left: 1px solid #e6e9ef !important; border-radius: 0 !important; box-shadow: none !important;
}
body[data-theme="mums_light"] .rtabs { background:#f6f7fb; border:1px solid #e6e9ef; border-radius:8px; padding:4px; }
body[data-theme="mums_light"] .rtab { color:#676879; font-weight:700; border-radius:6px; font-size:11px; }
body[data-theme="mums_light"] .rtab:hover { background:#ecedf2; color:#1f2633; }
body[data-theme="mums_light"] .rtab.active { background:#ffffff; color:#0073ea; border:1px solid #e6e9ef; box-shadow:0 1px 4px rgba(31,38,51,.08); }

/* ── 7. Cards ───────────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .card {
  background: #ffffff; border: 1px solid #e6e9ef;
  box-shadow: 0 2px 8px rgba(31,38,51,.06); border-radius: 10px;
}
body[data-theme="mums_light"] .card.pad { padding: 20px; }

/* UX cards (enterprise_ux) */
body[data-theme="mums_light"] .ux-card {
  background: #ffffff; border-color: #e6e9ef;
  box-shadow: 0 2px 8px rgba(31,38,51,.06);
}
body[data-theme="mums_light"] .ux-chip { background:rgba(0,115,234,.08); border-color:rgba(0,115,234,.2); color:#0060c2; }

/* ── 8. Buttons ─────────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .btn {
  background: #ffffff; border: 1px solid #d0d4de;
  color: #1f2633; border-radius: 6px; box-shadow: none; font-weight:600;
}
body[data-theme="mums_light"] .btn:hover { background:#f0f2f8; border-color:#b8bcc8; }
body[data-theme="mums_light"] .btn:focus { box-shadow:0 0 0 3px rgba(0,115,234,.18); outline:none; }
body[data-theme="mums_light"] .btn.primary { background:#0073ea; border-color:#0073ea; color:#fff; }
body[data-theme="mums_light"] .btn.primary:hover { background:#0060c2; border-color:#0060c2; }
body[data-theme="mums_light"] .btn.danger  { background:#e2445c; border-color:#e2445c; color:#fff; }
body[data-theme="mums_light"] .btn.danger:hover { background:#c0001e; border-color:#c0001e; }
body[data-theme="mums_light"] .btn.ghost   { background:transparent; border-color:transparent; box-shadow:none; color:#676879; }
body[data-theme="mums_light"] .btn.ghost:hover { background:#f0f2f8; border-color:#e6e9ef; color:#1f2633; }
body[data-theme="mums_light"] .btn.tiny    { box-shadow:none; }

/* Glass buttons (mailbox inline style) */
body[data-theme="mums_light"] .btn-glass-ghost {
  background: rgba(31,38,51,.05) !important; color: #1f2633 !important;
  border: 1px solid #d0d4de !important;
}
body[data-theme="mums_light"] .btn-glass-ghost:hover {
  background: rgba(31,38,51,.10) !important; color: #1f2633 !important; border-color: #b8bcc8 !important;
}
body[data-theme="mums_light"] .btn-glass-primary {
  background: linear-gradient(145deg,#0073ea,#0060c2) !important; color:#fff !important;
  border: 1px solid rgba(0,115,234,.4) !important;
  box-shadow: 0 4px 12px rgba(0,115,234,.25) !important;
}
body[data-theme="mums_light"] .btn-glass-primary:hover:not(:disabled) {
  background: linear-gradient(145deg,#0284c7,#0073ea) !important;
  box-shadow: 0 6px 16px rgba(0,115,234,.35) !important;
}

/* ── 9. Inputs / Selects ────────────────────────────────────────────────────── */
body[data-theme="mums_light"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
body[data-theme="mums_light"] select,
body[data-theme="mums_light"] textarea,
body[data-theme="mums_light"] .input,
body[data-theme="mums_light"] .select,
body[data-theme="mums_light"] .textarea {
  background: #ffffff; border-color: #d0d4de; color: #1f2633; border-radius: 6px;
}
body[data-theme="mums_light"] input::placeholder,
body[data-theme="mums_light"] .input::placeholder,
body[data-theme="mums_light"] textarea::placeholder { color: #9699a6; }
body[data-theme="mums_light"] input:focus,
body[data-theme="mums_light"] select:focus,
body[data-theme="mums_light"] textarea:focus,
body[data-theme="mums_light"] .input:focus,
body[data-theme="mums_light"] .select:focus {
  border-color: #0073ea; box-shadow: 0 0 0 3px rgba(0,115,234,.15);
}
body[data-theme="mums_light"] select option,
body[data-theme="mums_light"] .select option { background:#fff; color:#1f2633; }

/* ── 10. Tables ─────────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] th {
  background: #f6f7fb; color: #676879; font-size:11px; font-weight:700;
  letter-spacing:.04em; text-transform:uppercase; border-bottom:2px solid #e6e9ef;
}
body[data-theme="mums_light"] td { border-bottom:1px solid #f0f2f8; color:#1f2633; }
body[data-theme="mums_light"] tr:hover td { background:#f9faff; }
body[data-theme="mums_light"] table tr:nth-child(even) td { background:rgba(31,38,51,.012); }

/* ── 11. Badges ─────────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .badge { background:rgba(31,38,51,.04); border-color:#e6e9ef; color:#676879; }
body[data-theme="mums_light"] .badge.ok     { background:rgba(0,202,114,.10);  border-color:rgba(0,202,114,.28);  color:#007a45; }
body[data-theme="mums_light"] .badge.danger { background:rgba(226,68,92,.10);  border-color:rgba(226,68,92,.28);  color:#c0001e; }
body[data-theme="mums_light"] .badge.warn   { background:rgba(253,171,61,.12); border-color:rgba(253,171,61,.32); color:#b87000; }
body[data-theme="mums_light"] .badge.info   { background:rgba(0,115,234,.10);  border-color:rgba(0,115,234,.28);  color:#0060c2; }

/* ── 12. Modals ─────────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .modal { background:rgba(31,38,51,.4); }
body[data-theme="mums_light"] .modal .panel {
  background:#ffffff; border:1px solid #e6e9ef;
  border-radius:12px; box-shadow:0 16px 48px rgba(31,38,51,.16);
}
body[data-theme="mums_light"] .modal .head { background:#f6f7fb; border-bottom:1px solid #e6e9ef; }
body[data-theme="mums_light"] .modal .body { color:#1f2633; }

/* Notification popout modal */
body[data-theme="mums_light"] .notification-popout {
  background:#ffffff; border:1px solid #e6e9ef;
  box-shadow:0 16px 48px rgba(31,38,51,.16); border-radius:12px;
}
body[data-theme="mums_light"] .notification-popout .head {
  background:#f6f7fb; border-bottom:1px solid #e6e9ef;
}
body[data-theme="mums_light"] .notification-popout .notif-item {
  border-bottom:1px solid #f0f2f8; background:#ffffff;
}
body[data-theme="mums_light"] .notification-popout .notif-item:hover { background:#f9faff; }
body[data-theme="mums_light"] .notification-popout .notif-item.mailbox-assign {
  border-left:3px solid #e2445c; background:rgba(226,68,92,.03);
}
body[data-theme="mums_light"] .notification-popout .notif-item-title { color:#1f2633; font-weight:700; }
body[data-theme="mums_light"] .notification-popout .notif-item-body  { color:#676879; }
body[data-theme="mums_light"] .notification-popout .announce-title    { color:#1f2633; }
body[data-theme="mums_light"] .dashx-ack,
body[data-theme="mums_light"] .notif-ack-btn,
body[data-theme="mums_light"] .mbx-accept-btn {
  background: #0073ea !important; border-color: #0073ea !important;
  color: #fff !important; border-radius: 6px; font-weight:700;
  box-shadow: 0 4px 12px rgba(0,115,234,.3) !important;
}
body[data-theme="mums_light"] .dashx-ack:hover,
body[data-theme="mums_light"] .notif-ack-btn:hover,
body[data-theme="mums_light"] .mbx-accept-btn:hover:not(:disabled) {
  background: #0060c2 !important; border-color: #0060c2 !important;
}

/* ── 13. Announce bar ───────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .announce-bar {
  background:rgba(0,115,234,.04); border:1px solid rgba(0,115,234,.16); color:#1f2633;
}
body[data-theme="mums_light"] .announce-bar:hover { background:rgba(0,115,234,.07); border-color:rgba(0,115,234,.28); }
body[data-theme="mums_light"] .announce-title { color:#1f2633; font-weight:800; }
body[data-theme="mums_light"] .announce-msg   { color:#676879; }
body[data-theme="mums_light"] .announce-meta  { color:#9699a6; }
body[data-theme="mums_light"] .announce-who   { color:#0073ea; font-weight:700; }

/* ── 14. Online users bar ───────────────────────────────────────────────────── */
body[data-theme="mums_light"] .online-users-bar {
  background:#ffffff; border-top:1px solid #e6e9ef; box-shadow:none;
}
body[data-theme="mums_light"] .onlinebar-title,
body[data-theme="mums_light"] .onlinebar-count { color:#9699a6; }
body[data-theme="mums_light"] .onlinebar-sec   { border-color:#e6e9ef; }

/* ── 15. Quicklinks dock ────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .quicklinks-bar {
  background:#ffffff; border-top:1px solid #e6e9ef; box-shadow:none;
}
body[data-theme="mums_light"] .quicklink-btn { background:#f0f2f8; border:1px solid #e6e9ef; color:#676879; }
body[data-theme="mums_light"] .quicklink-btn:hover,
body[data-theme="mums_light"] .quicklink-btn.active {
  background:#0073ea; border-color:#0073ea; color:#fff; box-shadow:0 2px 8px rgba(0,115,234,.28);
}

/* ── 16. Side-logs ──────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .side-logs { border-top:1px solid #e6e9ef; }
body[data-theme="mums_light"] .side-logs-viewall {
  background:#f0f2f8; color:#676879; border-color:#e6e9ef; border-radius:6px; font-size:12px;
}
body[data-theme="mums_light"] .side-logs-viewall:hover { background:rgba(0,115,234,.08); color:#0073ea; border-color:rgba(0,115,234,.2); }

/* ── 17. Toasts ─────────────────────────────────────────────────────────────── */
body[data-theme="mums_light"] .toast,
body[data-theme="mums_light"] .snackbar {
  background:#ffffff; border:1px solid #e6e9ef; color:#1f2633;
  box-shadow:0 8px 24px rgba(31,38,51,.14); border-radius:10px;
}
body[data-theme="mums_light"] .toast.ok,     body[data-theme="mums_light"] .snackbar.ok    { border-left:4px solid #00ca72; }
body[data-theme="mums_light"] .toast.danger, body[data-theme="mums_light"] .snackbar.danger { border-left:4px solid #e2445c; }
body[data-theme="mums_light"] .toast.warn,   body[data-theme="mums_light"] .snackbar.warn   { border-left:4px solid #fdab3d; }
body[data-theme="mums_light"] .toast.info,   body[data-theme="mums_light"] .snackbar.info   { border-left:4px solid #0073ea; }

/* ── 18. Scrollbar, selection, focus ────────────────────────────────────────── */
body[data-theme="mums_light"] ::-webkit-scrollbar-thumb { background:#d0d4de; }
body[data-theme="mums_light"] ::selection { background:rgba(0,115,234,.18); }
body[data-theme="mums_light"] *:focus-visible { outline:2px solid #0073ea; outline-offset:2px; }

/* ── 19. HR / dividers ──────────────────────────────────────────────────────── */
body[data-theme="mums_light"] hr { border-top-color:#e6e9ef; }
body[data-theme="mums_light"] code,
body[data-theme="mums_light"] pre  { background:#f0f2f8; color:#1f2633; border:1px solid #e6e9ef; border-radius:4px; }

/* =============================================================================
   DASHBOARD  — dashx / ux-card components
   ============================================================================= */
body[data-theme="mums_light"] .dashx-card {
  background: #ffffff; border:1px solid #e6e9ef;
  border-radius:10px; box-shadow:0 2px 8px rgba(31,38,51,.06);
}
body[data-theme="mums_light"] .dashx-card .k { color:#676879; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
body[data-theme="mums_light"] .dashx-card .v { color:#1f2633; font-weight:800; }
body[data-theme="mums_light"] .dashx-card .s { color:#9699a6; }
body[data-theme="mums_light"] .dashx-panel { background:#ffffff; border:1px solid #e6e9ef; border-radius:10px; box-shadow:0 2px 8px rgba(31,38,51,.06); }
body[data-theme="mums_light"] .dashx-title  { color:#1f2633; font-weight:800; }
body[data-theme="mums_light"] .dashx-cards  { gap:12px; }

/* Heatmap */
body[data-theme="mums_light"] .dashx-heatmap .hday,
body[data-theme="mums_light"] .dashx-heatmap .hhr { color:#9699a6; }
body[data-theme="mums_light"] .dashx-heatmap .cell { background:rgba(0,115,234,.06); border-color:#e6e9ef; border-radius:4px; }
body[data-theme="mums_light"] .dashx-heatmap .cell[data-count]:not([data-count="0"]) { background:rgba(0,115,234,.16); }

/* Notification filters */
body[data-theme="mums_light"] .dashx-filter {
  background:#f6f7fb; border:1px solid #e6e9ef; color:#676879;
  border-radius:999px; padding:6px 14px; font-weight:600; font-size:13px; cursor:pointer;
}
body[data-theme="mums_light"] .dashx-filter:hover { background:#ecedf2; color:#1f2633; }
body[data-theme="mums_light"] .dashx-filter.active,
body[data-theme="mums_light"] .dashx-filter[data-active="1"] {
  background:rgba(0,115,234,.10); border-color:rgba(0,115,234,.28); color:#0060c2; font-weight:700;
}

/* Quick-nav shortcuts (Role-aware shortcuts) */
body[data-theme="mums_light"] .dashx-actions { gap:8px; }
body[data-theme="mums_light"] .dashx-actions .btn { background:#f6f7fb; border-color:#e6e9ef; color:#1f2633; border-radius:8px; }
body[data-theme="mums_light"] .dashx-actions .btn:hover { background:rgba(0,115,234,.08); border-color:rgba(0,115,234,.2); color:#0073ea; }

/* Dist bars */
body[data-theme="mums_light"] .dashx-bar { background:#e6e9ef; border-radius:999px; height:6px; }
body[data-theme="mums_light"] .dashx-bar .fill { background:#0073ea; border-radius:999px; }
body[data-theme="mums_light"] .dashx-dist-left,
body[data-theme="mums_light"] .dashx-top-name  { color:#1f2633; font-weight:600; }
body[data-theme="mums_light"] .dashx-dist-right,
body[data-theme="mums_light"] .dashx-top-meta  { color:#9699a6; }

/* =============================================================================
   MAILBOX  — mbx-stat-box, mbx-analytics, mbx-counter-table, mbx-monitor-panel
   These use inline-injected <style> tags so we must override with high-specificity
   ============================================================================= */

/* Top KPI cards (Active Duty Window, Time Until Rotation, Shift Total) */
body[data-theme="mums_light"] .mbx-header-bar { border-bottom-color:#e6e9ef !important; }
body[data-theme="mums_light"] .mbx-stat-box {
  background: #ffffff !important;
  border: 1px solid #e6e9ef !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(31,38,51,.06) !important;
  color: #1f2633 !important;
}
body[data-theme="mums_light"] .mbx-stat-box:hover {
  transform: translateY(-1px);
  border-color: rgba(0,115,234,.28) !important;
  box-shadow: 0 4px 16px rgba(0,115,234,.12) !important;
}
body[data-theme="mums_light"] .mbx-stat-lbl { color:#676879 !important; }
body[data-theme="mums_light"] .mbx-stat-val { color:#1f2633 !important; }
body[data-theme="mums_light"] .mbx-stat-sub { color:#9699a6 !important; }

/* Timer (green, readable on light) */
body[data-theme="mums_light"] .timer-display {
  color: #0073ea !important;
  text-shadow: none !important;
  font-family: 'Courier New', monospace;
}

/* Analytics panel */
body[data-theme="mums_light"] .mbx-analytics-panel {
  background: #ffffff !important;
  border: 1px solid #e6e9ef !important;
  border-radius: 14px !important;
}
body[data-theme="mums_light"] .mbx-panel-head { border-bottom-color: #e6e9ef !important; }
body[data-theme="mums_light"] .mbx-panel-title { color: #1f2633 !important; }
body[data-theme="mums_light"] .mbx-panel-desc  { color: #676879 !important; }

/* Analytics cards inside panel */
body[data-theme="mums_light"] .mbx-ana-card {
  background: #f6f7fb !important;
  border: 1px solid #e6e9ef !important;
  border-radius: 10px !important;
}
body[data-theme="mums_light"] .mbx-ana-row { border-bottom-color: #f0f2f8 !important; color:#1f2633 !important; }
body[data-theme="mums_light"] .mbx-ana-badge {
  background: rgba(0,115,234,.10) !important;
  color: #0060c2 !important;
}
body[data-theme="mums_light"] .mbx-ana-bar-wrap { background: #e6e9ef !important; }
body[data-theme="mums_light"] .mbx-ana-bar-fill {
  background: linear-gradient(90deg,#0073ea,#00c2cd) !important;
}

/* Counter table (distribution matrix) */
body[data-theme="mums_light"] .mbx-counter-wrap {
  background: #ffffff !important;
  border: 1px solid #e6e9ef !important;
  box-shadow: 0 2px 8px rgba(31,38,51,.06) !important;
}
body[data-theme="mums_light"] .mbx-counter-table th {
  background: #f6f7fb !important;
  color: #676879 !important;
  border-bottom: 2px solid #e6e9ef !important;
  font-size: 11px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700;
}
body[data-theme="mums_light"] .mbx-counter-table th.active-head-col {
  background: rgba(0,115,234,.08) !important;
  color: #0060c2 !important;
  border-bottom-color: #0073ea !important;
}
body[data-theme="mums_light"] .mbx-counter-table td {
  color: #1f2633 !important;
  border-bottom: 1px solid #f0f2f8 !important;
}
body[data-theme="mums_light"] .mbx-counter-table td.active-col { background: rgba(0,115,234,.04) !important; }
body[data-theme="mums_light"] .mbx-counter-table tr:hover { background: #f9faff !important; }

/* Shift aggregates row */
body[data-theme="mums_light"] .mbx-mgr-label.syncing { color: rgba(253,171,61,.9) !important; }
body[data-theme="mums_light"] .mbx-mgr-label.empty   { color: #9699a6 !important; }

/* Monitor / Case Matrix table */
body[data-theme="mums_light"] .mbx-monitor-panel {
  background: #ffffff !important;
  border: 1px solid #e6e9ef !important;
}
body[data-theme="mums_light"] .mbx-mon-table th {
  background: #f6f7fb !important;
  color: #676879 !important;
  border-bottom: 2px solid #e6e9ef !important;
  font-size: 11px; font-weight: 700;
}
body[data-theme="mums_light"] .mbx-mon-table td {
  border-color: #f0f2f8 !important;
  color: #1f2633 !important;
}
body[data-theme="mums_light"] .mbx-mon-cell:hover {
  background: rgba(0,115,234,.06) !important;
  box-shadow: inset 0 0 0 1px rgba(0,115,234,.2) !important;
}
body[data-theme="mums_light"] .mbx-mon-cell.confirmed { background: rgba(0,202,114,.06) !important; }
body[data-theme="mums_light"] .mbx-case-badge {
  background: #f0f2f8 !important;
  border: 1px solid #e6e9ef !important;
  color: #1f2633 !important;
}

/* Duty pills — bright and readable on white */
body[data-theme="mums_light"] .duty-pill[data-tone="idle"]    { background:rgba(31,38,51,.07)  !important; color:#676879 !important; border:1px solid #e6e9ef !important; }
body[data-theme="mums_light"] .duty-pill[data-tone="active"]  { background:rgba(0,202,114,.12) !important; color:#007a45 !important; border:1px solid rgba(0,202,114,.3) !important; }
body[data-theme="mums_light"] .duty-pill[data-tone="manager"] { background:rgba(0,115,234,.12) !important; color:#0060c2 !important; border:1px solid rgba(0,115,234,.3) !important; }
body[data-theme="mums_light"] .duty-pill[data-tone="call"]    { background:rgba(253,171,61,.15) !important; color:#b87000 !important; border:1px solid rgba(253,171,61,.35) !important; }
body[data-theme="mums_light"] .duty-pill[data-tone="break"]   { background:rgba(226,68,92,.10) !important; color:#c0001e !important; border:1px solid rgba(226,68,92,.25) !important; }

/* mbx-header bar in mailbox (shift header) */
body[data-theme="mums_light"] .mbx-header { background:#ffffff !important; border-bottom:1px solid #e6e9ef !important; }
body[data-theme="mums_light"] .mbx-shift-title   { color:#1f2633 !important; }
body[data-theme="mums_light"] .mbx-shift-subtitle { color:#676879 !important; }

/* =============================================================================
   SCHEDULE PAGE  — schx-cal, schx-grid, schx-day, team-schedule-wrap
   ============================================================================= */

/* KPI bar */
body[data-theme="mums_light"] .schx-kpi {
  background:#ffffff; border-color:#e6e9ef; color:#1f2633;
  box-shadow:0 2px 8px rgba(31,38,51,.06);
}
body[data-theme="mums_light"] .schx-kpi .big { color:#1f2633; }
body[data-theme="mums_light"] .schx-kpi.countdown.ok {
  background:rgba(0,202,114,.08); border-color:rgba(0,202,114,.28);
}
body[data-theme="mums_light"] .schx-kpi.countdown.ok .big { color:#007a45; }
body[data-theme="mums_light"] .schx-kpi.countdown.focus {
  background:rgba(0,115,234,.07); border-color:rgba(0,115,234,.25);
}
body[data-theme="mums_light"] .schx-kpi.countdown.focus .big { color:#0060c2; }
body[data-theme="mums_light"] .schx-kpi.countdown.warn {
  background:rgba(253,171,61,.10); border-color:rgba(253,171,61,.30);
}
body[data-theme="mums_light"] .schx-kpi.countdown.warn .big { color:#b87000; }

/* Day tabs */
body[data-theme="mums_light"] .schx-daytab {
  color:#676879; background:transparent; border-radius:6px;
}
body[data-theme="mums_light"] .schx-daytab:hover { background:#f0f2f8; color:#1f2633; }
body[data-theme="mums_light"] .schx-daytab.active {
  background:#0073ea; color:#ffffff; box-shadow:0 2px 8px rgba(0,115,234,.28);
}
body[data-theme="mums_light"] .schx-daytab.active .dot { background:rgba(255,255,255,.7); }
body[data-theme="mums_light"] .schx-daytab.is-today:not(.active) {
  background:rgba(0,115,234,.06); color:#0073ea; border:1px solid rgba(0,115,234,.2);
}
body[data-theme="mums_light"] .schx-daytab .dot { background:#0073ea; opacity:.5; }
body[data-theme="mums_light"] .schx-daytab-date { color:#9699a6; }

/* View toggle */
body[data-theme="mums_light"] .schx-toggle .btn.active {
  background:rgba(0,115,234,.10); border-color:rgba(0,115,234,.28); color:#0073ea;
}

/* ── WEEKLY / DAILY CALENDAR GRID  (the big dark box) ── */
body[data-theme="mums_light"] .schx-cal {
  background: #ffffff !important;
  border: 1px solid #e6e9ef !important;
  border-radius: 12px !important;
}
body[data-theme="mums_light"] .schx-grid {
  border: 1px solid #e6e9ef !important;
  border-radius: 10px !important;
  overflow: hidden;
}

/* Day head (sticky column headers) */
body[data-theme="mums_light"] .schx-dayhead {
  background: #f6f7fb !important;
  border-bottom: 2px solid #e6e9ef !important;
  color: #1f2633 !important;
}
body[data-theme="mums_light"] .schx-dayname { color:#1f2633 !important; font-weight:800 !important; }
body[data-theme="mums_light"] .schx-daydate { color:#9699a6 !important; }
body[data-theme="mums_light"] .schx-dayhead.is-today {
  background: linear-gradient(180deg, rgba(0,115,234,.10), rgba(0,115,234,.04)) !important;
  border-bottom-color: rgba(0,115,234,.5) !important;
}
body[data-theme="mums_light"] .schx-dayhead.is-completed {
  background: #f0f2f8 !important; border-bottom-color: #d0d4de !important;
}

/* Day body (the time grid area) */
body[data-theme="mums_light"] .schx-daybody {
  background: #ffffff !important;
  background-image: repeating-linear-gradient(
    to bottom,
    rgba(31,38,51,.08) 0px, rgba(31,38,51,.08) 1px,
    transparent 1px, transparent var(--schx-row-h)
  ) !important;
  border-right: 1px solid #f0f2f8 !important;
}
body[data-theme="mums_light"] .schx-day.is-completed .schx-daybody { background:#fafafa !important; }
body[data-theme="mums_light"] .schx-day { border-left-color: #f0f2f8 !important; }

/* Ruler / time labels */
body[data-theme="mums_light"] .schx-tick,
body[data-theme="mums_light"] .schx-tick-label {
  color: #9699a6 !important;
  background: rgba(246,247,251,.9) !important;
  border: 1px solid #e6e9ef !important;
}
body[data-theme="mums_light"] .schx-tick span { background:#f0f2f8 !important; border-color:#e6e9ef !important; }
body[data-theme="mums_light"] .schx-ruler-row { border-right-color: #e6e9ef !important; }
body[data-theme="mums_light"] .schx-line { background: rgba(31,38,51,.07) !important; }
body[data-theme="mums_light"] .schx-vline { background: rgba(31,38,51,.08) !important; }

/* Now-line */
body[data-theme="mums_light"] .schx-nowline,
body[data-theme="mums_light"] .schx-now-line { background:#e2445c !important; box-shadow:0 0 6px rgba(226,68,92,.35) !important; }
body[data-theme="mums_light"] .schx-nowline-dot { background:#e2445c !important; }

/* Schedule blocks — brighter tints on white */
body[data-theme="mums_light"] .schedule-block {
  border-radius: 6px;
  box-shadow: 0 1px 4px rgba(31,38,51,.12);
}
body[data-theme="mums_light"] .schedule-block:hover { transform:translateY(-1px); box-shadow:0 3px 10px rgba(31,38,51,.15); }

/* Member rows (team view) */
body[data-theme="mums_light"] .member-row { border-color:#f0f2f8; background:#ffffff; }
body[data-theme="mums_light"] .member-row:hover,
body[data-theme="mums_light"] .member-row:focus { background:#f9faff; border-color:rgba(0,115,234,.14); }

/* ── TEAM SCHEDULE TABLE  (the dark table in Image 4) ── */
body[data-theme="mums_light"] .team-schedule-wrap {
  background: #ffffff !important;
  border: 1px solid #e6e9ef !important;
  border-radius: 12px !important;
}
body[data-theme="mums_light"] .team-schedule-header {
  background: #f6f7fb !important;
  border-bottom: 2px solid #e6e9ef !important;
}
body[data-theme="mums_light"] .tsg-h {
  color: #676879 !important;
  border-right-color: #e6e9ef !important;
  font-size: 11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
}
body[data-theme="mums_light"] .tsg-h.ts-name { background:#f6f7fb !important; }
body[data-theme="mums_light"] .tsg-hour-cell,
body[data-theme="mums_light"] .tsg-coverage-cell {
  color: #676879 !important;
  border-left-color: #e6e9ef !important;
  background: transparent !important;
}
body[data-theme="mums_light"] .tsg-name {
  background: #ffffff !important;
  color: #1f2633 !important;
  border-right-color: #e6e9ef !important;
  border-top-color: #f0f2f8 !important;
  font-weight: 700 !important;
}
body[data-theme="mums_light"] .tsg-avatar { background:rgba(0,115,234,.10) !important; border-color:rgba(0,115,234,.2) !important; }
body[data-theme="mums_light"] .tsg-avatar-fallback { color:#0073ea !important; }
body[data-theme="mums_light"] .team-schedule-row.member-row:hover .tsg-name {
  background: rgba(0,115,234,.06) !important;
}
body[data-theme="mums_light"] .tsg-timeline {
  background: #ffffff !important;
  border-top-color: #f0f2f8 !important;
}
body[data-theme="mums_light"] .tsg-timeline .tsg-hour-grid {
  background-image: repeating-linear-gradient(
    to right, rgba(31,38,51,.10) 0, rgba(31,38,51,.10) 1px,
    transparent 1px, transparent var(--tsg-hour-px, 120px)
  ) !important;
}
body[data-theme="mums_light"] .team-schedule-row.member-row.is-inactive .tsg-timeline {
  background: #fafafa !important;
}
body[data-theme="mums_light"] .tsg-rest-day  { color: #9699a6 !important; }
body[data-theme="mums_light"] .tsg-on-leave  { color: rgba(253,171,61,.9) !important; }

/* Team schedule: coverage row */
body[data-theme="mums_light"] .team-schedule-row.tsg-coverage { background:#f6f7fb !important; }

/* =============================================================================
   MY ATTENDANCE / LOGS
   ============================================================================= */
body[data-theme="mums_light"] .att-log-row,
body[data-theme="mums_light"] .log-entry { border-bottom:1px solid #f0f2f8; color:#1f2633; }
body[data-theme="mums_light"] .att-log-type,
body[data-theme="mums_light"] .log-type { color:#0073ea; font-weight:700; }

/* Attendance type buttons */
body[data-theme="mums_light"] .att-filter-btn,
body[data-theme="mums_light"] .log-filter-btn {
  background:#f6f7fb; border:1px solid #e6e9ef; color:#676879; border-radius:6px; font-weight:600;
}
body[data-theme="mums_light"] .att-filter-btn.active,
body[data-theme="mums_light"] .log-filter-btn.active {
  background:#0073ea; border-color:#0073ea; color:#fff;
}

/* =============================================================================
   MY REMINDERS
   ============================================================================= */
body[data-theme="mums_light"] .reminders-stat-card,
body[data-theme="mums_light"] .stat-mini-card {
  background:#ffffff; border:1px solid #e6e9ef; border-radius:10px;
  box-shadow:0 2px 8px rgba(31,38,51,.06);
}
body[data-theme="mums_light"] .reminders-stat-card .stat-val { color:#1f2633; font-weight:800; }
body[data-theme="mums_light"] .reminders-stat-card .stat-lbl { color:#676879; font-size:11px; }

/* Reminder table rows */
body[data-theme="mums_light"] .rem-row,
body[data-theme="mums_light"] .reminder-row {
  background:#ffffff; border-bottom:1px solid #f0f2f8; color:#1f2633;
}
body[data-theme="mums_light"] .rem-row:hover,
body[data-theme="mums_light"] .reminder-row:hover { background:#f9faff; }

/* =============================================================================
   THEME PICKER in Settings
   ============================================================================= */
body[data-theme="mums_light"] .th-card {
  background:#ffffff; border:2px solid #e6e9ef; border-radius:10px;
}
body[data-theme="mums_light"] .th-card:hover { border-color:#0073ea; box-shadow:0 4px 14px rgba(0,115,234,.14); }
body[data-theme="mums_light"] .th-card.is-active {
  border-color:#0073ea; box-shadow:0 0 0 3px rgba(0,115,234,.15), 0 4px 14px rgba(0,115,234,.14);
}

/* =============================================================================
   QUICKBASE PAGE
   ============================================================================= */
body[data-theme="mums_light"] .qb-page-shell { background:#f6f7fb; }
body[data-theme="mums_light"] .qb-tabbar-wrap { background:#ffffff; border-bottom:1px solid #e6e9ef; }
body[data-theme="mums_light"] .qb-tab-btn { color:#676879; }
body[data-theme="mums_light"] .qb-tab-btn:hover { background:#f0f2f8; color:#1f2633; }
body[data-theme="mums_light"] .qb-tab-btn-active {
  background:rgba(0,115,234,.08); color:#0073ea; border-bottom:2px solid #0073ea;
}
body[data-theme="mums_light"] .qb-header-card {
  background:#ffffff; border:1px solid #e6e9ef; box-shadow:0 2px 8px rgba(31,38,51,.06);
}
body[data-theme="mums_light"] .qb-search-input {
  background:#f6f7fb; border-color:#d0d4de; color:#1f2633;
}
body[data-theme="mums_light"] .qb-search-input:focus {
  border-color:#0073ea; box-shadow:0 0 0 3px rgba(0,115,234,.15);
}
body[data-theme="mums_light"] .qb-search-input::placeholder { color:#9699a6; }
body[data-theme="mums_light"] .qb-search-ico { color:#9699a6 !important; }

/* =============================================================================
   CONTROLLER LAB BUTTON
   ============================================================================= */
body[data-theme="mums_light"] #btn-controller-lab {
  background: rgba(0,115,234,.06) !important; border:1px solid rgba(0,115,234,.2) !important;
  color:#0073ea !important; border-radius:8px !important;
}
body[data-theme="mums_light"] #btn-controller-lab:hover {
  background: rgba(0,115,234,.12) !important; border-color:rgba(0,115,234,.35) !important;
}

/* =============================================================================
   RESPONSIVE
   ============================================================================= */
@media (max-width: 980px) {
  body[data-theme="mums_light"] .topbar { border-radius:0; }
  body[data-theme="mums_light"] aside.side {
    border-radius:0 !important; border-right:none !important; border-bottom:1px solid #e6e9ef !important;
  }
}

/* =============================================================================
   LOGIN PAGE
   ============================================================================= */
body[data-theme="mums_light"] .auth-wrap {
  background: linear-gradient(135deg,#f0f2f8 0%,#ecedf2 100%);
}
body[data-theme="mums_light"] .auth-card .card {
  background:#ffffff; border:1px solid #e6e9ef;
  box-shadow:0 8px 32px rgba(31,38,51,.10); border-radius:14px;
}
body[data-theme="mums_light"] .auth-card .h1 { color:#1f2633; }
body[data-theme="mums_light"] .auth-card .h2 { color:#676879; }

/* =============================================================================
   MUMS – LIGHT: Support Studio button override
   ============================================================================= */
body[data-theme="mums_light"] #btn-support-studio {
  background: rgba(0,115,234,.07) !important;
  border: 1px solid rgba(0,115,234,.22) !important;
  color: #0073ea !important;
  border-radius: 8px !important;
}
body[data-theme="mums_light"] #btn-support-studio:hover {
  background: rgba(0,115,234,.14) !important;
  border-color: rgba(0,115,234,.4) !important;
  color: #0060c2 !important;
}


/* =============================================================================
   ██╗██╗   ██╗ ██████╗ ██████╗ ██╗   ██╗    ███████╗██╗  ██╗███████╗ ██████╗
   ██║██║   ██║██╔═══██╗██╔══██╗╚██╗ ██╔╝    ██╔════╝╚██╗██╔╝██╔════╝██╔════╝
   ██║██║   ██║██║   ██║██████╔╝ ╚████╔╝     █████╗   ╚███╔╝ █████╗  ██║
   ██║╚██╗ ██╔╝██║   ██║██╔══██╗  ╚██╔╝      ██╔══╝   ██╔██╗ ██╔══╝  ██║
   ██║ ╚████╔╝ ╚██████╔╝██║  ██║   ██║       ███████╗██╔╝ ██╗███████╗╚██████╗
   ╚═╝  ╚═══╝   ╚═════╝ ╚═╝  ╚═╝   ╚═╝       ╚══════╝╚═╝  ╚═╝╚══════╝ ╚═════╝
   IVORY EXECUTIVE THEME — COMPLETE ISOLATION
   100% scoped to body[data-theme="ivory_executive"] — zero bleed to other themes
   Palette: Warm #f5f5f2 canvas · #1a1a2e ink · #1e40af cobalt · Manrope font
   ============================================================================= */

/* ── 0. CSS Variables + Base ───────────────────────────────────────────────── */
body[data-theme="ivory_executive"] {
  --bg:           #f5f5f2;
  --bg2:          #eaeae6;
  --panel:        #ffffff;
  --panel2:       #f0efe9;
  --border:       #e4e4e0;
  --border2:      #d4d4ce;
  --text:         #1a1a2e;
  --muted:        #8a8a9a;
  --muted2:       #b0b0be;
  --primary:      #1e40af;
  --primary2:     #1e3a8a;
  --danger:       #dc2626;
  --warn:         #d97706;
  --ok:           #16a34a;
  --accent:       #1e40af;
  --accent-rgb:   30,64,175;
  --shadow:       0 2px 12px rgba(26,26,46,.08), 0 1px 4px rgba(26,26,46,.05);
  --shadow2:      0 4px 20px rgba(26,26,46,.10), 0 1px 4px rgba(26,26,46,.06);
  --radius:       10px;
  --radius2:      7px;
  --focus:        0 0 0 3px rgba(30,64,175,.18);
  --ux-shadow-soft: 0 2px 8px rgba(26,26,46,.07);
  --ux-focus:     0 0 0 3px rgba(30,64,175,.18);
  --ux-radius:    10px;
  --font:         'Manrope', 'DM Sans', ui-sans-serif, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  background: #f5f5f2;
  color: #1a1a2e;
  font-family: 'Manrope', 'DM Sans', ui-sans-serif, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
}

/* ── 1. App shell ───────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .app {
  gap: 0; padding: 0; padding-bottom: 120px; background: #f5f5f2;
}

/* ── 2. Topbar ──────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .topbar {
  background: #ffffff !important;
  border: none !important;
  border-bottom: 1px solid #e4e4e0 !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 6px rgba(26,26,46,.07) !important;
  padding: 0 20px !important;
  height: 56px !important;
  align-items: center !important;
}
body[data-theme="ivory_executive"] .topbrand {
  background: transparent !important; border: none !important; padding: 0 !important; gap: 10px !important;
}
body[data-theme="ivory_executive"] .brand-mark {
  background: linear-gradient(135deg, #1e40af, #1e3a8a) !important;
  box-shadow: 0 2px 10px rgba(30,64,175,.30) !important;
  border-radius: 9px !important;
}
body[data-theme="ivory_executive"] .brand-mark::after { color: #fff !important; font-weight: 900 !important; text-shadow: none !important; }
body[data-theme="ivory_executive"] .brand-name {
  color: #1a1a2e !important; text-shadow: none !important;
  font-weight: 900 !important; letter-spacing: .02em !important;
  font-family: 'Manrope', sans-serif !important;
}
body[data-theme="ivory_executive"] .brand-sub,
body[data-theme="ivory_executive"] .brand-build { color: #8a8a9a !important; }

/* Search */
body[data-theme="ivory_executive"] .top-global-search {
  background: #f5f5f2 !important; border: 1px solid #d4d4ce !important;
  border-radius: 8px !important; box-shadow: none !important;
}
body[data-theme="ivory_executive"] #globalSearchInput {
  background: transparent !important; color: #1a1a2e !important; font-size: 13px !important;
}
body[data-theme="ivory_executive"] #globalSearchInput::placeholder { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .global-search-icon { color: #8a8a9a !important; }

/* Topbar icon buttons */
body[data-theme="ivory_executive"] .topbar-actions .btn.ghost.iconbtn {
  background: #fff !important; border: 1px solid #e4e4e0 !important;
  color: #8a8a9a !important; border-radius: 8px !important; box-shadow: none !important;
}
body[data-theme="ivory_executive"] .topbar-actions .btn.ghost.iconbtn:hover {
  background: #f0efe9 !important; border-color: #d4d4ce !important; color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .topbar-actions .btn.ghost.iconbtn svg { color: inherit !important; }

/* Sync pill */
body[data-theme="ivory_executive"] .sync-status {
  background: rgba(22,163,74,.08) !important; border-color: rgba(22,163,74,.28) !important;
  color: #15803d !important; box-shadow: none !important;
}
body[data-theme="ivory_executive"] .sync-status .dot {
  background: #22c55e !important; box-shadow: 0 0 0 3px rgba(34,197,94,.18) !important;
}

/* Logout btn */
body[data-theme="ivory_executive"] .topbar-actions .btn-logout,
body[data-theme="ivory_executive"] .topbar-actions [class*="logout"] {
  color: #8a8a9a !important; background: transparent !important;
  border: 1px solid #e4e4e0 !important; border-radius: 7px !important;
}
body[data-theme="ivory_executive"] .topbar-actions .btn-logout:hover { color: #dc2626 !important; border-color: rgba(220,38,38,.3) !important; }

/* ── 3. Sidebar ─────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .side {
  background: #ffffff !important; border-right: 1px solid #e4e4e0 !important;
  box-shadow: none !important;
}
body[data-theme="ivory_executive"] .side-user,
body[data-theme="ivory_executive"] .user-card {
  background: transparent !important; border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .side-name,
body[data-theme="ivory_executive"] .user-name,
body[data-theme="ivory_executive"] .up-name {
  color: #1a1a2e !important; font-weight: 800 !important;
  font-family: 'Manrope', sans-serif !important;
}
body[data-theme="ivory_executive"] .side-role,
body[data-theme="ivory_executive"] .up-role {
  background: rgba(30,64,175,.06) !important; border: 1px solid rgba(30,64,175,.14) !important;
  color: #1e40af !important; border-radius: 5px !important;
}
body[data-theme="ivory_executive"] .side-avatar,
body[data-theme="ivory_executive"] .user-avatar,
body[data-theme="ivory_executive"] .up-avatar {
  border: 2px solid rgba(30,64,175,.2) !important;
}

/* Nav group labels */
body[data-theme="ivory_executive"] .nav-section,
body[data-theme="ivory_executive"] .nav-group-label {
  color: #b0b0be !important; font-size: 9px !important; font-weight: 800 !important;
  letter-spacing: .14em !important; text-transform: uppercase !important;
}

/* Nav items */
body[data-theme="ivory_executive"] .nav-item,
body[data-theme="ivory_executive"] .sidebar-nav-item {
  color: #8a8a9a !important; border-radius: 8px !important;
}
body[data-theme="ivory_executive"] .nav-item:hover,
body[data-theme="ivory_executive"] .sidebar-nav-item:hover {
  background: #f0efe9 !important; color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .nav-item.active,
body[data-theme="ivory_executive"] .nav-item.selected,
body[data-theme="ivory_executive"] .sidebar-nav-item.active {
  background: rgba(30,64,175,.08) !important;
  color: #1e40af !important; font-weight: 700 !important;
  border-left: 3px solid #1e40af !important;
}
body[data-theme="ivory_executive"] .nav-item .nav-icon,
body[data-theme="ivory_executive"] .sidebar-nav-item .nav-icon { color: inherit !important; }

/* Nav sub-items */
body[data-theme="ivory_executive"] .nav-children .nav-item { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .nav-children .nav-item.active { color: #1e40af !important; }

/* Sidebar footer / version */
body[data-theme="ivory_executive"] .side-footer,
body[data-theme="ivory_executive"] .sidebar-footer { border-top: 1px solid #e4e4e0 !important; }

/* ── 4. Main content area ───────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .main { background: transparent; }
body[data-theme="ivory_executive"] .page-wrap,
body[data-theme="ivory_executive"] .ux-page-wrap { background: transparent; }

/* ── 5. Cards ───────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .card,
body[data-theme="ivory_executive"] .ux-card,
body[data-theme="ivory_executive"] .panel,
body[data-theme="ivory_executive"] .surface {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 12px rgba(26,26,46,.07), 0 1px 3px rgba(26,26,46,.04) !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .card .head,
body[data-theme="ivory_executive"] .ux-card .head,
body[data-theme="ivory_executive"] .card-header {
  background: #f5f5f2 !important; border-bottom: 1px solid #e4e4e0 !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .card-title,
body[data-theme="ivory_executive"] .ux-card-title,
body[data-theme="ivory_executive"] .section-title,
body[data-theme="ivory_executive"] .page-title { color: #1a1a2e !important; font-family: 'Manrope', sans-serif !important; }
body[data-theme="ivory_executive"] .card .muted,
body[data-theme="ivory_executive"] .ux-card .muted,
body[data-theme="ivory_executive"] .sub-title,
body[data-theme="ivory_executive"] .page-sub  { color: #8a8a9a !important; }

/* ── 6. Right panel (Cases / Reminders / Deadlines) ────────────────────────── */
body[data-theme="ivory_executive"] .right { background: #f5f5f2; }
body[data-theme="ivory_executive"] .right > .card,
body[data-theme="ivory_executive"] .right-panel,
body[data-theme="ivory_executive"] .dashx-panel {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .dashx-tab,
body[data-theme="ivory_executive"] .right-tab {
  color: #8a8a9a !important; background: #f5f5f2 !important;
  border: 1px solid #e4e4e0 !important; border-radius: 7px !important;
  font-weight: 700 !important; font-size: 11px !important;
}
body[data-theme="ivory_executive"] .dashx-tab.active,
body[data-theme="ivory_executive"] .right-tab.active {
  background: #1e40af !important; border-color: #1e40af !important;
  color: #ffffff !important; box-shadow: 0 2px 8px rgba(30,64,175,.28) !important;
}
body[data-theme="ivory_executive"] .dashx-count,
body[data-theme="ivory_executive"] .tab-count {
  background: rgba(30,64,175,.10) !important; color: #1e40af !important;
  border-radius: 4px !important; padding: 1px 5px !important;
}

/* Controller Lab */
body[data-theme="ivory_executive"] .controller-lab-widget,
body[data-theme="ivory_executive"] #controllerLabWidget {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important; color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .clw-title,
body[data-theme="ivory_executive"] .controller-lab-title { color: #8a8a9a !important; }

/* ── 7. Buttons ─────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .btn.primary,
body[data-theme="ivory_executive"] .btn-primary,
body[data-theme="ivory_executive"] .btn[class*="primary"] {
  background: #1e40af !important; border-color: #1e40af !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(30,64,175,.28) !important;
  border-radius: 8px !important; font-family: 'Manrope', sans-serif !important; font-weight: 700 !important;
}
body[data-theme="ivory_executive"] .btn.primary:hover,
body[data-theme="ivory_executive"] .btn-primary:hover {
  background: #1e3a8a !important; border-color: #1e3a8a !important;
  box-shadow: 0 4px 14px rgba(30,64,175,.36) !important;
}
body[data-theme="ivory_executive"] .btn.secondary,
body[data-theme="ivory_executive"] .btn-secondary {
  background: #f0efe9 !important; border: 1px solid #d4d4ce !important;
  color: #1a1a2e !important; border-radius: 8px !important; font-weight: 600 !important;
}
body[data-theme="ivory_executive"] .btn.secondary:hover { background: #e8e7e0 !important; }
body[data-theme="ivory_executive"] .btn.ghost,
body[data-theme="ivory_executive"] .btn-ghost {
  background: transparent !important; border: 1px solid #e4e4e0 !important;
  color: #8a8a9a !important; border-radius: 8px !important;
}
body[data-theme="ivory_executive"] .btn.ghost:hover { background: #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .btn.danger,
body[data-theme="ivory_executive"] .btn-danger {
  background: #dc2626 !important; border-color: #dc2626 !important; color: #fff !important;
}
body[data-theme="ivory_executive"] .btn.ok,
body[data-theme="ivory_executive"] .btn-ok,
body[data-theme="ivory_executive"] .btn.success {
  background: #16a34a !important; border-color: #16a34a !important; color: #fff !important;
}

/* ── 8. Inputs / Selects / Textareas ────────────────────────────────────────── */
body[data-theme="ivory_executive"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
body[data-theme="ivory_executive"] select,
body[data-theme="ivory_executive"] textarea,
body[data-theme="ivory_executive"] .input,
body[data-theme="ivory_executive"] .select,
body[data-theme="ivory_executive"] .textarea {
  background: #ffffff !important; border-color: #d4d4ce !important;
  color: #1a1a2e !important; border-radius: 8px !important;
  font-family: 'Manrope', sans-serif !important;
}
body[data-theme="ivory_executive"] input::placeholder,
body[data-theme="ivory_executive"] .input::placeholder,
body[data-theme="ivory_executive"] textarea::placeholder { color: #b0b0be !important; }
body[data-theme="ivory_executive"] input:focus,
body[data-theme="ivory_executive"] select:focus,
body[data-theme="ivory_executive"] textarea:focus,
body[data-theme="ivory_executive"] .input:focus,
body[data-theme="ivory_executive"] .select:focus {
  border-color: #1e40af !important; box-shadow: 0 0 0 3px rgba(30,64,175,.15) !important;
  outline: none !important;
}
body[data-theme="ivory_executive"] select option,
body[data-theme="ivory_executive"] .select option { background: #fff !important; color: #1a1a2e !important; }

/* ── 9. Tables ──────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .table,
body[data-theme="ivory_executive"] table { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] th,
body[data-theme="ivory_executive"] .table th {
  background: #f5f5f2 !important; color: #8a8a9a !important;
  font-size: 11px !important; font-weight: 700 !important;
  letter-spacing: .05em !important; text-transform: uppercase !important;
  border-bottom: 2px solid #e4e4e0 !important;
  font-family: 'Manrope', sans-serif !important;
}
body[data-theme="ivory_executive"] td,
body[data-theme="ivory_executive"] .table td {
  border-bottom: 1px solid #f0efe9 !important; color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] tr:hover td,
body[data-theme="ivory_executive"] .table tr:hover td { background: #fafaf7 !important; }
body[data-theme="ivory_executive"] table tr:nth-child(even) td { background: rgba(26,26,46,.012) !important; }

/* Hard-coded dark table headers override (JS-rendered inline darks) */
body[data-theme="ivory_executive"] thead tr,
body[data-theme="ivory_executive"] thead,
body[data-theme="ivory_executive"] .table thead tr {
  background: #f5f5f2 !important; color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] thead th { background: #f5f5f2 !important; }

/* ── 10. Badges / Pills / Tags ──────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .badge { background: rgba(26,26,46,.05) !important; border-color: #e4e4e0 !important; color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .badge.ok     { background: rgba(22,163,74,.10) !important;  border-color: rgba(22,163,74,.28) !important;  color: #15803d !important; }
body[data-theme="ivory_executive"] .badge.danger { background: rgba(220,38,38,.10) !important;  border-color: rgba(220,38,38,.28) !important;  color: #b91c1c !important; }
body[data-theme="ivory_executive"] .badge.warn   { background: rgba(217,119,6,.12) !important;  border-color: rgba(217,119,6,.30) !important;  color: #92400e !important; }
body[data-theme="ivory_executive"] .badge.info   { background: rgba(30,64,175,.10) !important;  border-color: rgba(30,64,175,.28) !important;  color: #1e3a8a !important; }
body[data-theme="ivory_executive"] .pill { background: rgba(26,26,46,.05) !important; color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .tag  { background: #f0efe9 !important; border: 1px solid #e4e4e0 !important; color: #1a1a2e !important; }

/* ── 11. Modals ─────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .modal {
  background: rgba(26,26,46,.42) !important;
}
body[data-theme="ivory_executive"] .modal .panel,
body[data-theme="ivory_executive"] .modal-panel,
body[data-theme="ivory_executive"] .modal-box {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  border-radius: 14px !important; box-shadow: 0 20px 60px rgba(26,26,46,.18) !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .modal .head,
body[data-theme="ivory_executive"] .modal-head,
body[data-theme="ivory_executive"] .modal-header {
  background: #f5f5f2 !important; border-bottom: 1px solid #e4e4e0 !important;
  color: #1a1a2e !important; border-radius: 14px 14px 0 0 !important;
}
body[data-theme="ivory_executive"] .modal .head .title,
body[data-theme="ivory_executive"] .modal-title { color: #1a1a2e !important; font-family: 'Manrope', sans-serif !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .modal .body,
body[data-theme="ivory_executive"] .modal-body { color: #1a1a2e !important; background: #ffffff !important; }
body[data-theme="ivory_executive"] .modal .foot,
body[data-theme="ivory_executive"] .modal-footer {
  background: #f5f5f2 !important; border-top: 1px solid #e4e4e0 !important;
  border-radius: 0 0 14px 14px !important;
}
/* Modal close button */
body[data-theme="ivory_executive"] .modal .close,
body[data-theme="ivory_executive"] .modal-close {
  color: #8a8a9a !important; background: transparent !important;
}
body[data-theme="ivory_executive"] .modal .close:hover { color: #1a1a2e !important; background: #f0efe9 !important; }

/* ── 12. Settings Modal (special case — full coverage) ──────────────────────── */
body[data-theme="ivory_executive"] #settingsModal .panel {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] #settingsModal .head {
  background: #f5f5f2 !important; border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .settings-card {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  border-radius: 10px !important; box-shadow: 0 1px 6px rgba(26,26,46,.06) !important;
}
body[data-theme="ivory_executive"] .settings-card:hover {
  border-color: rgba(30,64,175,.25) !important; box-shadow: 0 4px 16px rgba(30,64,175,.10) !important;
}
body[data-theme="ivory_executive"] .settings-card-title,
body[data-theme="ivory_executive"] .settings-label { color: #1e40af !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .settings-card-desc,
body[data-theme="ivory_executive"] .settings-desc { color: #8a8a9a !important; }

/* ── 13. Notification Popout ────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .notification-popout {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  box-shadow: 0 16px 48px rgba(26,26,46,.16) !important; border-radius: 12px !important;
}
body[data-theme="ivory_executive"] .notification-popout .head {
  background: #f5f5f2 !important; border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .notification-popout .notif-item {
  border-bottom: 1px solid #f0efe9 !important; background: #ffffff !important;
}
body[data-theme="ivory_executive"] .notification-popout .notif-item:hover { background: #fafaf7 !important; }
body[data-theme="ivory_executive"] .notification-popout .notif-item.mailbox-assign {
  border-left: 3px solid #dc2626 !important; background: rgba(220,38,38,.03) !important;
}
body[data-theme="ivory_executive"] .notification-popout .notif-item-title { color: #1a1a2e !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .notification-popout .notif-item-body  { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .notification-popout .announce-title   { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .dashx-ack,
body[data-theme="ivory_executive"] .notif-ack-btn,
body[data-theme="ivory_executive"] .mbx-accept-btn {
  background: #1e40af !important; border-color: #1e40af !important;
  color: #fff !important; border-radius: 7px !important; font-weight: 700 !important;
  box-shadow: 0 3px 10px rgba(30,64,175,.30) !important;
}
body[data-theme="ivory_executive"] .dashx-ack:hover,
body[data-theme="ivory_executive"] .notif-ack-btn:hover,
body[data-theme="ivory_executive"] .mbx-accept-btn:hover:not(:disabled) {
  background: #1e3a8a !important; border-color: #1e3a8a !important;
}

/* ── 14. Announce bar ───────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .announce-bar {
  background: rgba(30,64,175,.04) !important; border: 1px solid rgba(30,64,175,.16) !important; color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .announce-bar:hover { background: rgba(30,64,175,.07) !important; border-color: rgba(30,64,175,.28) !important; }
body[data-theme="ivory_executive"] .announce-title { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .announce-msg   { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .announce-meta  { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .announce-who   { color: #1e40af !important; font-weight: 700 !important; }

/* ── 15. Bottom bars (shift tracker + world clocks + quicklinks) ─────────────── */
body[data-theme="ivory_executive"] .online-users-bar,
body[data-theme="ivory_executive"] .shift-tracker-bar {
  background: #ffffff !important; border-top: 1px solid #e4e4e0 !important;
  box-shadow: 0 -1px 6px rgba(26,26,46,.05) !important;
}
body[data-theme="ivory_executive"] .shift-tracker-bar .shift-col {
  background: transparent !important; border-right: 1px solid #e4e4e0 !important;
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .shift-tracker-bar .shift-label { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .shift-tracker-bar .shift-count { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .onlinebar-title,
body[data-theme="ivory_executive"] .onlinebar-count { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .onlinebar-sec { border-color: #e4e4e0 !important; }

/* World Clocks */
body[data-theme="ivory_executive"] .clocks-wrap,
body[data-theme="ivory_executive"] .clock-card {
  background: rgba(255,255,255,.9) !important; border: 1px solid #e4e4e0 !important;
  box-shadow: 0 1px 4px rgba(26,26,46,.06) !important;
}
body[data-theme="ivory_executive"] .clocks-preview { background: rgba(255,255,255,.82) !important; border-color: #e4e4e0 !important; }
body[data-theme="ivory_executive"] .clock-city { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .clock-time { color: #1a1a2e !important; font-weight: 800 !important; }

/* Quicklinks dock */
body[data-theme="ivory_executive"] .quicklinks-bar {
  background: #ffffff !important; border-top: 1px solid #e4e4e0 !important; box-shadow: none !important;
}
body[data-theme="ivory_executive"] .quicklink-btn {
  background: #f0efe9 !important; border: 1px solid #e4e4e0 !important; color: #8a8a9a !important;
  border-radius: 7px !important;
}
body[data-theme="ivory_executive"] .quicklink-btn:hover,
body[data-theme="ivory_executive"] .quicklink-btn.active {
  background: #1e40af !important; border-color: #1e40af !important; color: #fff !important;
  box-shadow: 0 2px 8px rgba(30,64,175,.28) !important;
}

/* ── 16. Dashboard Widgets ──────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .dash-stat-card,
body[data-theme="ivory_executive"] .stat-card,
body[data-theme="ivory_executive"] .kpi-card {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 10px rgba(26,26,46,.07) !important; border-radius: 10px !important;
}
body[data-theme="ivory_executive"] .dash-stat-card .big,
body[data-theme="ivory_executive"] .stat-num,
body[data-theme="ivory_executive"] .kpi-num { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .dash-stat-card .label,
body[data-theme="ivory_executive"] .stat-label,
body[data-theme="ivory_executive"] .kpi-label { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .stat-delta.up,
body[data-theme="ivory_executive"] .delta-up { color: #15803d !important; background: rgba(22,163,74,.10) !important; }
body[data-theme="ivory_executive"] .stat-delta.down,
body[data-theme="ivory_executive"] .delta-down { color: #b91c1c !important; background: rgba(220,38,38,.08) !important; }

/* Chart / activity areas */
body[data-theme="ivory_executive"] .chart-wrap,
body[data-theme="ivory_executive"] .activity-card {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .chart-title { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .chart-label { color: #8a8a9a !important; }

/* Team workload pulse */
body[data-theme="ivory_executive"] .workload-card { background: #ffffff !important; border: 1px solid #e4e4e0 !important; }
body[data-theme="ivory_executive"] .wl-name { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .wl-task { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .wl-bar { background: #f0efe9 !important; }
body[data-theme="ivory_executive"] .wl-fill { background: linear-gradient(90deg, #1e40af, #3b82f6) !important; }

/* Notification center items */
body[data-theme="ivory_executive"] .notif-center-item { border-bottom: 1px solid #f0efe9 !important; }
body[data-theme="ivory_executive"] .notif-center-item:hover { background: #fafaf7 !important; }

/* ── 17. Overall Stats page ──────────────────────────────────────────────────── */
/* Override the dark gray stat cards */
body[data-theme="ivory_executive"] .stats-summary-card,
body[data-theme="ivory_executive"] .os-stat-card,
body[data-theme="ivory_executive"] .stat-summary-wrap .card,
body[data-theme="ivory_executive"] [class*="stats-card"],
body[data-theme="ivory_executive"] [class*="stat-box"] {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  color: #1a1a2e !important; box-shadow: 0 2px 10px rgba(26,26,46,.07) !important;
}
body[data-theme="ivory_executive"] .os-big,
body[data-theme="ivory_executive"] .stats-big-num { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .os-label,
body[data-theme="ivory_executive"] .stats-label { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .os-delta,
body[data-theme="ivory_executive"] .stats-delta { color: #15803d !important; }

/* Roster analytics ledger (dark table) */
body[data-theme="ivory_executive"] .roster-analytics-wrap,
body[data-theme="ivory_executive"] .ledger-wrap {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  border-radius: 10px !important; overflow: hidden !important;
}
body[data-theme="ivory_executive"] .ledger-header,
body[data-theme="ivory_executive"] .roster-analytics-header {
  background: #f5f5f2 !important; border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .roster-analytics-wrap th,
body[data-theme="ivory_executive"] .ledger-wrap th {
  background: #f5f5f2 !important; color: #8a8a9a !important;
  border-bottom: 2px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .roster-analytics-wrap td,
body[data-theme="ivory_executive"] .ledger-wrap td { color: #1a1a2e !important; border-bottom: 1px solid #f0efe9 !important; }
body[data-theme="ivory_executive"] .rl-name { color: #1a1a2e !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .rl-shift { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .rl-workload { color: #1e40af !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .deep-dive-btn,
body[data-theme="ivory_executive"] [class*="deep-dive"] {
  background: #f0efe9 !important; border: 1px solid #d4d4ce !important;
  color: #1a1a2e !important; border-radius: 7px !important;
}
body[data-theme="ivory_executive"] .deep-dive-btn:hover { background: #1e40af !important; color: #fff !important; border-color: #1e40af !important; }

/* vs-prev deltas in ledger */
body[data-theme="ivory_executive"] .vs-prev-up,
body[data-theme="ivory_executive"] [class*="vs-prev"] {
  background: rgba(22,163,74,.10) !important; color: #15803d !important;
  border-radius: 4px !important; padding: 2px 6px !important;
}

/* ── 18. Mailbox Page ────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .mbx-header {
  background: #ffffff !important; border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-shift-title   { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .mbx-shift-subtitle { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .mbx-counter-wrap {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 8px rgba(26,26,46,.06) !important;
}
body[data-theme="ivory_executive"] .mbx-counter-table th {
  background: #f5f5f2 !important; color: #8a8a9a !important;
  border-bottom: 2px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-counter-table th.active-head-col {
  background: rgba(30,64,175,.06) !important; color: #1e3a8a !important; border-bottom-color: #1e40af !important;
}
body[data-theme="ivory_executive"] .mbx-counter-table td { color: #1a1a2e !important; border-bottom: 1px solid #f0efe9 !important; }
body[data-theme="ivory_executive"] .mbx-counter-table td.active-col { background: rgba(30,64,175,.04) !important; }
body[data-theme="ivory_executive"] .mbx-counter-table tr:hover { background: #fafaf7 !important; }

/* Duty pills */
body[data-theme="ivory_executive"] .duty-pill[data-tone="idle"]      { background: rgba(26,26,46,.07) !important; color: #8a8a9a !important; border: 1px solid #e4e4e0 !important; }
body[data-theme="ivory_executive"] .duty-pill[data-tone="active"]    { background: rgba(22,163,74,.12) !important; color: #15803d !important; border: 1px solid rgba(22,163,74,.3) !important; }
body[data-theme="ivory_executive"] .duty-pill[data-tone="manager"]   { background: rgba(30,64,175,.10) !important; color: #1e3a8a !important; border: 1px solid rgba(30,64,175,.28) !important; }
body[data-theme="ivory_executive"] .duty-pill[data-tone="call"]      { background: rgba(217,119,6,.14) !important; color: #92400e !important; border: 1px solid rgba(217,119,6,.3) !important; }
body[data-theme="ivory_executive"] .duty-pill[data-tone="break"]     { background: rgba(220,38,38,.10) !important; color: #b91c1c !important; border: 1px solid rgba(220,38,38,.24) !important; }
body[data-theme="ivory_executive"] .duty-pill[data-tone="backoffice"] { background: rgba(217,119,6,.10) !important; color: #92400e !important; border: 1px solid rgba(217,119,6,.25) !important; }
body[data-theme="ivory_executive"] .duty-pill[data-tone="training"]  { background: rgba(79,70,229,.10) !important; color: #3730a3 !important; border: 1px solid rgba(79,70,229,.24) !important; }

/* Liquid badge (mbx live status) */
body[data-theme="ivory_executive"] .mbx-liquid-badge {
  background: #f0efe9 !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-liq-label { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .mbx-liq-timer { color: #8a8a9a !important; }

/* Analytics panel */
body[data-theme="ivory_executive"] .mbx-analytics-panel {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important; border-radius: 12px !important;
}
body[data-theme="ivory_executive"] .mbx-panel-head { border-bottom-color: #e4e4e0 !important; }
body[data-theme="ivory_executive"] .mbx-panel-title { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .mbx-panel-desc  { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .mbx-ana-card {
  background: #f5f5f2 !important; border: 1px solid #e4e4e0 !important; border-radius: 8px !important;
}
body[data-theme="ivory_executive"] .mbx-ana-row { border-bottom-color: #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .mbx-ana-badge { background: rgba(30,64,175,.10) !important; color: #1e3a8a !important; }
body[data-theme="ivory_executive"] .mbx-ana-bar-wrap { background: #e4e4e0 !important; }
body[data-theme="ivory_executive"] .mbx-ana-bar-fill { background: linear-gradient(90deg, #1e40af, #3b82f6) !important; }

/* Monitor / Case Matrix */
body[data-theme="ivory_executive"] .mbx-monitor-panel {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-mon-table th {
  background: #f5f5f2 !important; color: #8a8a9a !important; border-bottom: 2px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-mon-table td { border-color: #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .mbx-mon-cell:hover {
  background: rgba(30,64,175,.06) !important;
  box-shadow: inset 0 0 0 1px rgba(30,64,175,.2) !important;
}
body[data-theme="ivory_executive"] .mbx-mon-cell.confirmed { background: rgba(22,163,74,.06) !important; }
body[data-theme="ivory_executive"] .mbx-case-badge {
  background: #f0efe9 !important; border: 1px solid #e4e4e0 !important; color: #1a1a2e !important;
}

/* Manager label */
body[data-theme="ivory_executive"] .mbx-mgr-label.active { color: #1e40af !important; }
body[data-theme="ivory_executive"] .mbx-mgr-label.assigned { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .mbx-mgr-label.syncing { color: rgba(217,119,6,.9) !important; }
body[data-theme="ivory_executive"] .mbx-mgr-label.empty   { color: #b0b0be !important; }

/* ── 19. Members / Master Schedule page ─────────────────────────────────────── */
body[data-theme="ivory_executive"] .ms-wrap,
body[data-theme="ivory_executive"] .members-wrap { background: transparent !important; }
body[data-theme="ivory_executive"] .ms-topbar,
body[data-theme="ivory_executive"] .members-topbar {
  background: #ffffff !important; border-bottom: 1px solid #e4e4e0 !important;
  border-radius: 10px 10px 0 0 !important;
}
body[data-theme="ivory_executive"] .ms-topbar .btn.primary,
body[data-theme="ivory_executive"] .ms-apply-btn {
  background: #1e40af !important; color: #fff !important; border-color: #1e40af !important;
}
body[data-theme="ivory_executive"] .ms-topbar .btn.danger { background: #dc2626 !important; color: #fff !important; }

/* Date navigation */
body[data-theme="ivory_executive"] .ms-date-nav { color: #1a1a2e !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .ms-date-nav button {
  background: #f0efe9 !important; border: 1px solid #d4d4ce !important; color: #1a1a2e !important;
  border-radius: 6px !important;
}

/* Day tabs */
body[data-theme="ivory_executive"] .ms-daytab,
body[data-theme="ivory_executive"] .day-tab {
  background: transparent !important; color: #8a8a9a !important; border-radius: 7px !important;
}
body[data-theme="ivory_executive"] .ms-daytab:hover,
body[data-theme="ivory_executive"] .day-tab:hover { background: #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .ms-daytab.active,
body[data-theme="ivory_executive"] .day-tab.active {
  background: #1e40af !important; color: #fff !important;
  box-shadow: 0 2px 8px rgba(30,64,175,.28) !important;
}
body[data-theme="ivory_executive"] .ms-daytab.is-today:not(.active) {
  background: rgba(30,64,175,.06) !important; color: #1e40af !important;
  border: 1px solid rgba(30,64,175,.2) !important;
}

/* Coverage meter */
body[data-theme="ivory_executive"] .coverage-meter,
body[data-theme="ivory_executive"] .cov-meter {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .cov-label { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .cov-value { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .cov-ok    { color: #15803d !important; }
body[data-theme="ivory_executive"] .cov-warn  { color: #92400e !important; }

/* Team roster panel */
body[data-theme="ivory_executive"] .team-roster-panel,
body[data-theme="ivory_executive"] .roster-panel {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .roster-panel .search-input { background: #f5f5f2 !important; border-color: #d4d4ce !important; color: #1a1a2e !important; }

/* Member rows */
body[data-theme="ivory_executive"] .member-row { border-color: #f0efe9 !important; background: #ffffff !important; }
body[data-theme="ivory_executive"] .member-row:hover,
body[data-theme="ivory_executive"] .member-row:focus { background: #fafaf7 !important; border-color: rgba(30,64,175,.14) !important; }
body[data-theme="ivory_executive"] .member-name { color: #1a1a2e !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .member-detail { color: #8a8a9a !important; }

/* Progress bars */
body[data-theme="ivory_executive"] .progress-track,
body[data-theme="ivory_executive"] .member-progress-track { border-color: rgba(26,26,46,.12) !important; background: rgba(26,26,46,.04) !important; }
body[data-theme="ivory_executive"] .progress-text,
body[data-theme="ivory_executive"] .member-progress-pct { color: rgba(26,26,46,.6) !important; }

/* ── 20. Schedule page ───────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .schx-kpi {
  background: #ffffff !important; border-color: #e4e4e0 !important; color: #1a1a2e !important;
  box-shadow: 0 2px 8px rgba(26,26,46,.06) !important;
}
body[data-theme="ivory_executive"] .schx-kpi .big { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .schx-kpi.countdown.ok    { background: rgba(22,163,74,.07) !important;  border-color: rgba(22,163,74,.25) !important; }
body[data-theme="ivory_executive"] .schx-kpi.countdown.ok .big { color: #15803d !important; }
body[data-theme="ivory_executive"] .schx-kpi.countdown.focus  { background: rgba(30,64,175,.06) !important;  border-color: rgba(30,64,175,.22) !important; }
body[data-theme="ivory_executive"] .schx-kpi.countdown.focus .big { color: #1e3a8a !important; }
body[data-theme="ivory_executive"] .schx-kpi.countdown.warn   { background: rgba(217,119,6,.08) !important;  border-color: rgba(217,119,6,.26) !important; }
body[data-theme="ivory_executive"] .schx-kpi.countdown.warn .big { color: #92400e !important; }

body[data-theme="ivory_executive"] .schx-daytab { color: #8a8a9a !important; background: transparent !important; border-radius: 7px !important; }
body[data-theme="ivory_executive"] .schx-daytab:hover { background: #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .schx-daytab.active { background: #1e40af !important; color: #fff !important; box-shadow: 0 2px 8px rgba(30,64,175,.28) !important; }
body[data-theme="ivory_executive"] .schx-daytab.is-today:not(.active) { background: rgba(30,64,175,.06) !important; color: #1e40af !important; border: 1px solid rgba(30,64,175,.2) !important; }
body[data-theme="ivory_executive"] .schx-daytab-date { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .schx-toggle .btn.active { background: rgba(30,64,175,.10) !important; border-color: rgba(30,64,175,.28) !important; color: #1e40af !important; }

body[data-theme="ivory_executive"] .schx-cal { background: #ffffff !important; border: 1px solid #e4e4e0 !important; border-radius: 12px !important; }
body[data-theme="ivory_executive"] .schx-grid { border: 1px solid #e4e4e0 !important; border-radius: 10px !important; overflow: hidden; }
body[data-theme="ivory_executive"] .schx-dayhead { background: #f5f5f2 !important; border-bottom: 2px solid #e4e4e0 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .schx-dayname { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .schx-daydate { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .schx-dayhead.is-today { background: linear-gradient(180deg, rgba(30,64,175,.10), rgba(30,64,175,.04)) !important; border-bottom-color: rgba(30,64,175,.5) !important; }
body[data-theme="ivory_executive"] .schx-dayhead.is-completed { background: #f0efe9 !important; border-bottom-color: #d4d4ce !important; }
body[data-theme="ivory_executive"] .schx-daybody {
  background: #ffffff !important;
  background-image: repeating-linear-gradient(to bottom, rgba(26,26,46,.07) 0px, rgba(26,26,46,.07) 1px, transparent 1px, transparent var(--schx-row-h)) !important;
  border-right: 1px solid #f0efe9 !important;
}
body[data-theme="ivory_executive"] .schx-tick,
body[data-theme="ivory_executive"] .schx-tick-label {
  color: #b0b0be !important; background: rgba(245,245,242,.9) !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .schx-nowline,
body[data-theme="ivory_executive"] .schx-now-line { background: #dc2626 !important; box-shadow: 0 0 6px rgba(220,38,38,.35) !important; }
body[data-theme="ivory_executive"] .schx-nowline-dot { background: #dc2626 !important; }
body[data-theme="ivory_executive"] .schedule-block { border-radius: 7px !important; box-shadow: 0 1px 4px rgba(26,26,46,.12) !important; }
body[data-theme="ivory_executive"] .schedule-block:hover { transform: translateY(-1px) !important; box-shadow: 0 3px 10px rgba(26,26,46,.15) !important; }
body[data-theme="ivory_executive"] .team-schedule-wrap { background: #ffffff !important; border: 1px solid #e4e4e0 !important; border-radius: 12px !important; }
body[data-theme="ivory_executive"] .team-schedule-header { background: #f5f5f2 !important; border-bottom: 2px solid #e4e4e0 !important; }
body[data-theme="ivory_executive"] .tsg-h { color: #8a8a9a !important; border-right-color: #e4e4e0 !important; }
body[data-theme="ivory_executive"] .tsg-h.ts-name { background: #f5f5f2 !important; }
body[data-theme="ivory_executive"] .tsg-name { background: #ffffff !important; color: #1a1a2e !important; border-right-color: #e4e4e0 !important; border-top-color: #f0efe9 !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .tsg-timeline { background: #ffffff !important; border-top-color: #f0efe9 !important; }
body[data-theme="ivory_executive"] .tsg-rest-day { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .tsg-on-leave  { color: rgba(217,119,6,.9) !important; }
body[data-theme="ivory_executive"] .team-schedule-row.tsg-coverage { background: #f5f5f2 !important; }

/* ── 21. My Attendance ───────────────────────────────────────────────────────── */
/* Override the hardcoded dark attendance table */
body[data-theme="ivory_executive"] .ux-card[style*="background: #121C2F"],
body[data-theme="ivory_executive"] .ux-card[style*="background:#121C2F"],
body[data-theme="ivory_executive"] [style*="background: #121C2F"],
body[data-theme="ivory_executive"] [style*="background:#121C2F"] {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 10px rgba(26,26,46,.07) !important;
}
body[data-theme="ivory_executive"] [style*="color:#A8B6D6"],
body[data-theme="ivory_executive"] [style*="color: #A8B6D6"] { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] [style*="border-bottom: 1px solid rgba(255,255,255,0.1)"],
body[data-theme="ivory_executive"] [style*="border-bottom:1px solid rgba(255,255,255,0.1)"] {
  border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] [style*="background: rgba(18,28,47,0.4)"],
body[data-theme="ivory_executive"] [style*="background:rgba(18,28,47,0.4)"] { background: #fafaf7 !important; }

body[data-theme="ivory_executive"] .att-log-row,
body[data-theme="ivory_executive"] .log-entry { border-bottom: 1px solid #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .att-log-type,
body[data-theme="ivory_executive"] .log-type { color: #1e40af !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .att-filter-btn,
body[data-theme="ivory_executive"] .log-filter-btn {
  background: #f5f5f2 !important; border: 1px solid #e4e4e0 !important; color: #8a8a9a !important;
  border-radius: 7px !important; font-weight: 600 !important;
}
body[data-theme="ivory_executive"] .att-filter-btn.active,
body[data-theme="ivory_executive"] .log-filter-btn.active { background: #1e40af !important; border-color: #1e40af !important; color: #fff !important; }

/* ── 22. My Reminders & Team Reminders ──────────────────────────────────────── */
/* Override black table header in reminders */
body[data-theme="ivory_executive"] .reminders-table th,
body[data-theme="ivory_executive"] [class*="reminder"] th {
  background: #f5f5f2 !important; color: #8a8a9a !important; border-bottom: 2px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .reminders-table td,
body[data-theme="ivory_executive"] [class*="reminder"] td { color: #1a1a2e !important; border-bottom: 1px solid #f0efe9 !important; }

body[data-theme="ivory_executive"] .reminders-stat-card,
body[data-theme="ivory_executive"] .stat-mini-card {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important; border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(26,26,46,.06) !important;
}
body[data-theme="ivory_executive"] .reminders-stat-card .stat-val { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .reminders-stat-card .stat-lbl { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .rem-row,
body[data-theme="ivory_executive"] .reminder-row { background: #ffffff !important; border-bottom: 1px solid #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .rem-row:hover,
body[data-theme="ivory_executive"] .reminder-row:hover { background: #fafaf7 !important; }
body[data-theme="ivory_executive"] .reminder-title { color: #1a1a2e !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .reminder-time  { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .reminder-badge-active  { background: rgba(30,64,175,.10) !important; color: #1e3a8a !important; }
body[data-theme="ivory_executive"] .reminder-badge-snoozed { background: rgba(217,119,6,.10) !important; color: #92400e !important; }
body[data-theme="ivory_executive"] .reminder-badge-done    { background: rgba(22,163,74,.10) !important; color: #15803d !important; }

/* ── 23. My Case ─────────────────────────────────────────────────────────────── */
/* The pitch-black thead in My Case page */
body[data-theme="ivory_executive"] .my-case-table th,
body[data-theme="ivory_executive"] .case-table th,
body[data-theme="ivory_executive"] [class*="case"] table th { background: #f5f5f2 !important; color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .my-case-table td,
body[data-theme="ivory_executive"] .case-table td,
body[data-theme="ivory_executive"] [class*="case"] table td { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .case-status-pill { border-radius: 5px !important; }

/* ── 24. My Tasks ────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .task-item,
body[data-theme="ivory_executive"] .task-row {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  border-radius: 8px !important;
}
body[data-theme="ivory_executive"] .task-item:hover,
body[data-theme="ivory_executive"] .task-row:hover { background: #fafaf7 !important; }
body[data-theme="ivory_executive"] .task-title { color: #1a1a2e !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .task-meta  { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .task-pri-normal { background: rgba(30,64,175,.08) !important; color: #1e3a8a !important; }
body[data-theme="ivory_executive"] .task-pri-high   { background: rgba(220,38,38,.08) !important; color: #b91c1c !important; }
body[data-theme="ivory_executive"] .task-pri-low    { background: rgba(22,163,74,.08) !important; color: #15803d !important; }

/* ── 25. My Quickbase ────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .qb-page-shell { background: #f5f5f2 !important; }
body[data-theme="ivory_executive"] .qb-header-bar {
  background: #ffffff !important; border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .qb-header-title { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .qb-header-sub   { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .qb-counter-widget {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  border-radius: 10px !important; box-shadow: 0 2px 8px rgba(26,26,46,.06) !important;
}
body[data-theme="ivory_executive"] .qb-counter-widget.is-active {
  border-color: rgba(30,64,175,.35) !important;
  box-shadow: 0 0 0 3px rgba(30,64,175,.12), 0 4px 16px rgba(26,26,46,.10) !important;
}
body[data-theme="ivory_executive"] .qb-embed-frame { border: 1px solid #e4e4e0 !important; border-radius: 10px !important; }

/* ── 26. User Management / Announcements / Privileges ──────────────────────── */
body[data-theme="ivory_executive"] .user-mgmt-wrap,
body[data-theme="ivory_executive"] .user-table-wrap {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important; border-radius: 10px !important;
}
body[data-theme="ivory_executive"] .user-table th { background: #f5f5f2 !important; color: #8a8a9a !important; border-bottom: 2px solid #e4e4e0 !important; }
body[data-theme="ivory_executive"] .user-table td { color: #1a1a2e !important; border-bottom: 1px solid #f0efe9 !important; }
body[data-theme="ivory_executive"] .user-table tr:hover td { background: #fafaf7 !important; }
body[data-theme="ivory_executive"] .role-badge { border-radius: 5px !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .ann-item { background: #ffffff !important; border: 1px solid #e4e4e0 !important; border-radius: 10px !important; }
body[data-theme="ivory_executive"] .ann-item:hover { background: #fafaf7 !important; }
body[data-theme="ivory_executive"] .ann-title   { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .ann-message { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .priv-row { background: #ffffff !important; border-bottom: 1px solid #f0efe9 !important; }
body[data-theme="ivory_executive"] .priv-row:hover { background: #fafaf7 !important; }

/* ── 27. Activity Log / Audit page ──────────────────────────────────────────── */
body[data-theme="ivory_executive"] .log-wrap,
body[data-theme="ivory_executive"] .activity-log-wrap {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important; border-radius: 10px !important;
}
body[data-theme="ivory_executive"] .log-row { background: #ffffff !important; border-bottom: 1px solid #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .log-row:hover { background: #fafaf7 !important; }
body[data-theme="ivory_executive"] .log-action { color: #1e40af !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .log-timestamp { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .log-user { color: #1a1a2e !important; font-weight: 600 !important; }

/* ── 28. Team Task Settings ──────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .team-config-wrap,
body[data-theme="ivory_executive"] .tts-wrap { background: transparent !important; }
body[data-theme="ivory_executive"] .tts-section { background: #ffffff !important; border: 1px solid #e4e4e0 !important; border-radius: 10px !important; margin-bottom: 14px; }
body[data-theme="ivory_executive"] .tts-section-head { background: #f5f5f2 !important; border-bottom: 1px solid #e4e4e0 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .tts-label { color: #1a1a2e !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .tts-sub   { color: #8a8a9a !important; }

/* ── 29. Command Center ──────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .cc-wrap { background: transparent !important; }
body[data-theme="ivory_executive"] .cc-header { background: #ffffff !important; border-bottom: 1px solid #e4e4e0 !important; }
body[data-theme="ivory_executive"] .cc-panel { background: #ffffff !important; border: 1px solid #e4e4e0 !important; border-radius: 10px !important; }
body[data-theme="ivory_executive"] .cc-metric-card { background: #f5f5f2 !important; border: 1px solid #e4e4e0 !important; border-radius: 8px !important; }
body[data-theme="ivory_executive"] .cc-metric-val { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .cc-metric-label { color: #8a8a9a !important; }

/* ── 30. Popover / Tooltip / Dropdown ───────────────────────────────────────── */
body[data-theme="ivory_executive"] .popover,
body[data-theme="ivory_executive"] .tooltip-box,
body[data-theme="ivory_executive"] .dropdown-menu,
body[data-theme="ivory_executive"] .context-menu {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  box-shadow: 0 8px 28px rgba(26,26,46,.14) !important; border-radius: 10px !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .dropdown-item,
body[data-theme="ivory_executive"] .context-item { color: #1a1a2e !important; border-radius: 6px !important; }
body[data-theme="ivory_executive"] .dropdown-item:hover,
body[data-theme="ivory_executive"] .context-item:hover { background: #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .dropdown-item.danger { color: #dc2626 !important; }
body[data-theme="ivory_executive"] .dropdown-item.danger:hover { background: rgba(220,38,38,.07) !important; }

/* Dropdown divider */
body[data-theme="ivory_executive"] .dropdown-divider { border-color: #e4e4e0 !important; }

/* ── 31. Theme Picker cards in Settings ─────────────────────────────────────── */
body[data-theme="ivory_executive"] .th-card {
  background: #ffffff !important; border: 2px solid #e4e4e0 !important; border-radius: 12px !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .th-card:hover { border-color: rgba(30,64,175,.3) !important; box-shadow: 0 4px 16px rgba(30,64,175,.10) !important; }
body[data-theme="ivory_executive"] .th-card.is-active { border-color: #1e40af !important; box-shadow: 0 0 0 3px rgba(30,64,175,.18), 0 4px 16px rgba(30,64,175,.12) !important; }
body[data-theme="ivory_executive"] .th-name { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .th-desc { color: #8a8a9a !important; }

/* ── 32. Global muted / text helper overrides ───────────────────────────────── */
body[data-theme="ivory_executive"] .muted,
body[data-theme="ivory_executive"] .text-muted,
body[data-theme="ivory_executive"] .sub,
body[data-theme="ivory_executive"] small { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .accent,
body[data-theme="ivory_executive"] .text-accent { color: #1e40af !important; }
body[data-theme="ivory_executive"] .text-ok,
body[data-theme="ivory_executive"] .text-success { color: #15803d !important; }
body[data-theme="ivory_executive"] .text-danger,
body[data-theme="ivory_executive"] .text-error  { color: #b91c1c !important; }
body[data-theme="ivory_executive"] .text-warn    { color: #92400e !important; }
body[data-theme="ivory_executive"] h1, body[data-theme="ivory_executive"] h2,
body[data-theme="ivory_executive"] h3, body[data-theme="ivory_executive"] h4 {
  color: #1a1a2e !important;
  font-family: 'Manrope', sans-serif !important;
  font-weight: 800 !important;
}
body[data-theme="ivory_executive"] p,
body[data-theme="ivory_executive"] span,
body[data-theme="ivory_executive"] li { color: inherit; }
body[data-theme="ivory_executive"] a { color: #1e40af !important; }
body[data-theme="ivory_executive"] a:hover { color: #1e3a8a !important; }
body[data-theme="ivory_executive"] hr,
body[data-theme="ivory_executive"] .divider { border-color: #e4e4e0 !important; }

/* ── 33. Scrollbars ─────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] ::-webkit-scrollbar { width: 5px; height: 5px; }
body[data-theme="ivory_executive"] ::-webkit-scrollbar-track { background: #f0efe9; }
body[data-theme="ivory_executive"] ::-webkit-scrollbar-thumb { background: #d4d4ce; border-radius: 10px; }
body[data-theme="ivory_executive"] ::-webkit-scrollbar-thumb:hover { background: #b0b0be; }

/* ── 34. Support Studio button ──────────────────────────────────────────────── */
body[data-theme="ivory_executive"] #btn-support-studio {
  background: rgba(30,64,175,.07) !important; border: 1px solid rgba(30,64,175,.22) !important;
  color: #1e40af !important; border-radius: 9px !important;
}
body[data-theme="ivory_executive"] #btn-support-studio:hover {
  background: rgba(30,64,175,.13) !important; border-color: rgba(30,64,175,.4) !important;
  color: #1e3a8a !important;
}

/* ── 35. Auth / Login page ──────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .auth-wrap {
  background: linear-gradient(135deg, #f0efe9 0%, #eaeae6 100%) !important;
}
body[data-theme="ivory_executive"] .auth-card .card {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  box-shadow: 0 8px 32px rgba(26,26,46,.10) !important; border-radius: 14px !important;
}
body[data-theme="ivory_executive"] .auth-card .h1 { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .auth-card .h2 { color: #8a8a9a !important; }

/* ── 36. Sprint: generic dark-bg override (JS inline style escapes) ─────────── */
/* Override common dark background inline styles injected by JS pages */
body[data-theme="ivory_executive"] [style*="background: #0a1520"],
body[data-theme="ivory_executive"] [style*="background:#0a1520"],
body[data-theme="ivory_executive"] [style*="background: #0f1f30"],
body[data-theme="ivory_executive"] [style*="background:#0f1f30"],
body[data-theme="ivory_executive"] [style*="background: #060f1c"],
body[data-theme="ivory_executive"] [style*="background:#060f1c"],
body[data-theme="ivory_executive"] [style*="background: #07091a"],
body[data-theme="ivory_executive"] [style*="background:#07091a"],
body[data-theme="ivory_executive"] [style*="background: #0d1228"],
body[data-theme="ivory_executive"] [style*="background:#0d1228"],
body[data-theme="ivory_executive"] [style*="background: #111730"],
body[data-theme="ivory_executive"] [style*="background:#111730"],
body[data-theme="ivory_executive"] [style*="background: #080a0d"],
body[data-theme="ivory_executive"] [style*="background:#080a0d"],
body[data-theme="ivory_executive"] [style*="background: #0b0c10"],
body[data-theme="ivory_executive"] [style*="background:#0b0c10"],
body[data-theme="ivory_executive"] [style*="background: #060e18"],
body[data-theme="ivory_executive"] [style*="background:#060e18"],
body[data-theme="ivory_executive"] [style*="background: #0b1825"],
body[data-theme="ivory_executive"] [style*="background:#0b1825"] {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  color: #1a1a2e !important;
}

/* Override common dark text inline styles */
body[data-theme="ivory_executive"] [style*="color: #e8eeff"],
body[data-theme="ivory_executive"] [style*="color:#e8eeff"],
body[data-theme="ivory_executive"] [style*="color: #d8eaf8"],
body[data-theme="ivory_executive"] [style*="color:#d8eaf8"],
body[data-theme="ivory_executive"] [style*="color: rgba(255,255,255"],
body[data-theme="ivory_executive"] [style*="color:rgba(255,255,255"] { color: #1a1a2e !important; }

/* Override white-on-dark rgba border rules */
body[data-theme="ivory_executive"] [style*="border-color: rgba(255,255,255,.1)"],
body[data-theme="ivory_executive"] [style*="border:1px solid rgba(255,255,255,.08)"],
body[data-theme="ivory_executive"] [style*="border: 1px solid rgba(255,255,255,.08)"] {
  border-color: #e4e4e0 !important;
}

/* ── 37. Inline-style dark gradient overrides (linear-gradient dark bg) ─────── */
body[data-theme="ivory_executive"] [style*="background: linear-gradient(180deg, #0f1f30"],
body[data-theme="ivory_executive"] [style*="background:linear-gradient(180deg, #0f1f30"],
body[data-theme="ivory_executive"] [style*="background: linear-gradient(140deg,rgba(15,23,42"],
body[data-theme="ivory_executive"] [style*="background:linear-gradient(140deg,rgba(15,23,42"] {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}

/* ── 38. Table header: hard catch-all for any dark inline thead ─────────────── */
/* Catch pure black and very dark table headers (My Case / My Reminders JS render) */
body[data-theme="ivory_executive"] tr[style*="background: #000"],
body[data-theme="ivory_executive"] tr[style*="background:#000"],
body[data-theme="ivory_executive"] tr[style*="background: rgb(0,0,0)"],
body[data-theme="ivory_executive"] thead[style*="background"],
body[data-theme="ivory_executive"] th[style*="background: #1a1a"],
body[data-theme="ivory_executive"] th[style*="background:#1a1a"] {
  background: #f5f5f2 !important; color: #8a8a9a !important;
}

/* ── 39. Avatar / initials ───────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .sp-photo { border: 1px solid rgba(30,64,175,.14) !important; background: rgba(255,255,255,.9) !important; }
body[data-theme="ivory_executive"] .sp-photo .initials { color: rgba(26,26,46,.9) !important; }
body[data-theme="ivory_executive"] .sp-photo-sm { background: rgba(26,26,46,.04) !important; }
body[data-theme="ivory_executive"] .sp-name  { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .sp-duty  { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .sp-duty .muted { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .sp-shift { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .sp-position {
  background: rgba(30,64,175,.10) !important; border-color: rgba(30,64,175,.22) !important;
  color: rgba(26,26,46,.86) !important;
}
body[data-theme="ivory_executive"] .up-sub { color: #8a8a9a !important; }

/* ── 40. Mobile responsive tweaks ───────────────────────────────────────────── */
@media (max-width: 900px) {
  body[data-theme="ivory_executive"] .app { padding-bottom: 140px !important; }
  body[data-theme="ivory_executive"] .topbar { padding: 0 12px !important; }
}



/* =============================================================================
   IVORY EXECUTIVE — Phase 1-635 PATCH
   Targeted fixes for JS-injected style classes across all problem pages.
   100% scoped. Zero bleed. Pure ivory only.
   ============================================================================= */

/* ─────────────────────────────────────────────────────────────────────────────
   FIX 1 · MAILBOX — Shift Aggregates footer row (dark gradient override)
   ───────────────────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .mbx-counter-table tfoot tr {
  background: #f5f5f2 !important;
  border-top: 2px solid rgba(30,64,175,.15) !important;
}
body[data-theme="ivory_executive"] .mbx-counter-table tfoot td { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .mbx-foot-label {
  color: rgba(26,26,46,.45) !important;
}
body[data-theme="ivory_executive"] .mbx-foot-label::before {
  background: linear-gradient(180deg, #1e40af, #3b82f6) !important;
}
/* Shift aggregate badge — readable on ivory bg */
body[data-theme="ivory_executive"] .mbx-agg-badge {
  color: rgba(26,26,46,.3) !important;
}
body[data-theme="ivory_executive"] .mbx-agg-badge.has-total {
  background: rgba(30,64,175,.10) !important;
  color: #1e40af !important;
  border: 1px solid rgba(30,64,175,.22) !important;
}
body[data-theme="ivory_executive"] .mbx-agg-badge.grand-total {
  background: rgba(30,64,175,.14) !important;
  color: #1e3a8a !important;
  border: 1px solid rgba(30,64,175,.28) !important;
}

/* Mailbox counter table thead (dark blue col override) */
body[data-theme="ivory_executive"] .mbx-counter-table thead tr {
  background: #f5f5f2 !important;
}
body[data-theme="ivory_executive"] .mbx-counter-table thead th {
  background: #f5f5f2 !important;
  color: #8a8a9a !important;
  border-bottom: 2px solid #e4e4e0 !important;
}
/* Active column header in mailbox */
body[data-theme="ivory_executive"] .mbx-th-time { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .mbx-th-time.is-active { color: #1e40af !important; }

/* Monitor panel */
body[data-theme="ivory_executive"] .mbx-monitor-panel {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-mon-table th {
  background: #f5f5f2 !important; color: #8a8a9a !important;
  border-bottom: 2px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-mon-table td {
  border-color: #f0efe9 !important; color: #1a1a2e !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   FIX 2 · OVERALL STATS — JS-injected ovr-* classes (id=enterprise-ovr-styles)
   ───────────────────────────────────────────────────────────────────────────── */

/* KPI cards — dark gradient → white */
body[data-theme="ivory_executive"] .ovr-kpi-card {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 12px rgba(26,26,46,.07) !important;
  border-radius: 12px !important;
}
body[data-theme="ivory_executive"] .ovr-kpi-card:hover {
  border-color: rgba(30,64,175,.28) !important;
  box-shadow: 0 6px 20px rgba(30,64,175,.10) !important;
  transform: translateY(-2px) !important;
}
body[data-theme="ivory_executive"] .ovr-kpi-label {
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .ovr-kpi-val {
  color: #1a1a2e !important;
  text-shadow: none !important;
}
/* Delta chips */
body[data-theme="ivory_executive"] .delta-pos { background: rgba(22,163,74,.10) !important; color: #15803d !important; border-color: rgba(22,163,74,.22) !important; }
body[data-theme="ivory_executive"] .delta-neg { background: rgba(220,38,38,.10) !important; color: #b91c1c !important; border-color: rgba(220,38,38,.22) !important; }
body[data-theme="ivory_executive"] .delta-neu { background: rgba(26,26,46,.06) !important; color: #8a8a9a !important; }

/* Glass panel (roster ledger wrapper) */
body[data-theme="ivory_executive"] .ovr-glass-panel {
  background: #ffffff !important;
  backdrop-filter: none !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: 0 4px 20px rgba(26,26,46,.08) !important;
  border-radius: 14px !important;
}
/* Ledger header row (dark navy inline bg) */
body[data-theme="ivory_executive"] .ovr-glass-panel > div[style*="background:rgba(15,23,42"],
body[data-theme="ivory_executive"] .ovr-glass-panel > div[style*="background: rgba(15,23,42"] {
  background: #f5f5f2 !important;
  border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .ovr-glass-panel h3[style*="color:#f8fafc"],
body[data-theme="ivory_executive"] .ovr-glass-panel h3[style*="color: #f8fafc"] {
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .ovr-subtitle { color: #8a8a9a !important; }

/* Filter / date inputs */
body[data-theme="ivory_executive"] .ovr-input {
  background: #ffffff !important;
  border: 1px solid #d4d4ce !important;
  color: #1a1a2e !important;
  border-radius: 8px !important;
}
body[data-theme="ivory_executive"] .ovr-input:focus {
  border-color: #1e40af !important;
  box-shadow: 0 0 0 3px rgba(30,64,175,.15) !important;
}

/* Glass buttons */
body[data-theme="ivory_executive"] .btn-glass-ghost {
  background: #f5f5f2 !important;
  color: #8a8a9a !important;
  border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .btn-glass-ghost:hover {
  background: #f0efe9 !important; color: #1a1a2e !important;
  border-color: #d4d4ce !important;
}
body[data-theme="ivory_executive"] .btn-glass-primary {
  background: #1e40af !important;
  color: #fff !important;
  border-color: rgba(30,64,175,.5) !important;
  box-shadow: 0 3px 10px rgba(30,64,175,.25) !important;
}
body[data-theme="ivory_executive"] .btn-glass-primary:hover:not(:disabled) {
  background: #1e3a8a !important;
}
body[data-theme="ivory_executive"] .btn-glass-active {
  background: rgba(30,64,175,.12) !important;
  color: #1e40af !important;
  border: 1px solid rgba(30,64,175,.3) !important;
  box-shadow: none !important;
}

/* Roster table wrap */
body[data-theme="ivory_executive"] .ovr-table-wrap {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: none !important;
  border-radius: 0 0 12px 12px !important;
}
body[data-theme="ivory_executive"] .ovr-table th {
  background: #f5f5f2 !important;
  color: #8a8a9a !important;
  border-bottom: 2px solid #e4e4e0 !important;
  backdrop-filter: none !important;
}
body[data-theme="ivory_executive"] .ovr-table td {
  border-bottom: 1px solid #f0efe9 !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .ovr-table tbody tr:hover {
  background: #fafaf7 !important;
}
body[data-theme="ivory_executive"] .ovr-table-num { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .ovr-table-num.cyan { color: #1e40af !important; }

/* Detail expand row */
body[data-theme="ivory_executive"] .ovr-detail-row { background: #f5f5f2 !important; }
body[data-theme="ivory_executive"] .ovr-detail-panel {
  border-left: 3px solid #1e40af !important;
  box-shadow: none !important;
}

/* Skeleton loaders */
body[data-theme="ivory_executive"] .sk-card {
  background: #f5f5f2 !important;
  border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .sk-bar {
  background: linear-gradient(90deg, rgba(26,26,46,.04) 25%, rgba(26,26,46,.08) 50%, rgba(26,26,46,.04) 75%) !important;
}

/* Preset buttons */
body[data-theme="ivory_executive"] .ovr-preset-btn {
  background: #f5f5f2 !important; border: 1px solid #e4e4e0 !important;
  color: #8a8a9a !important; border-radius: 7px !important;
}
body[data-theme="ivory_executive"] .ovr-preset-btn.active,
body[data-theme="ivory_executive"] .ovr-preset-btn:hover {
  background: #1e40af !important; color: #fff !important; border-color: #1e40af !important;
}

/* Trend sparkline — make visible on white */
body[data-theme="ivory_executive"] .sparkline-glow {
  filter: drop-shadow(0 0 4px rgba(30,64,175,.4)) !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   FIX 3 · MEMBERS — Dark toolbar, day tabs, coverage meter, roster panel
   ───────────────────────────────────────────────────────────────────────────── */

/* Day tabs bar (solid black row) */
body[data-theme="ivory_executive"] .daytabs {
  background: transparent !important;
  padding: 6px 0 !important;
}
body[data-theme="ivory_executive"] .daytab,
body[data-theme="ivory_executive"] .day-tab {
  background: #f5f5f2 !important;
  border: 1px solid #e4e4e0 !important;
  color: #8a8a9a !important;
  border-radius: 7px !important;
  font-weight: 600 !important;
}
body[data-theme="ivory_executive"] .daytab:hover,
body[data-theme="ivory_executive"] .day-tab:hover {
  background: #f0efe9 !important; color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .daytab.active,
body[data-theme="ivory_executive"] .daytab.is-active,
body[data-theme="ivory_executive"] .day-tab.active {
  background: #1e40af !important; color: #ffffff !important;
  border-color: #1e40af !important; font-weight: 700 !important;
}
body[data-theme="ivory_executive"] .daytab.is-today:not(.active) {
  background: rgba(30,64,175,.06) !important; color: #1e40af !important;
  border-color: rgba(30,64,175,.22) !important;
}

/* Paint / action toolbar */
body[data-theme="ivory_executive"] .members-timeline-toolbar {
  background: #ffffff !important;
  border-bottom: 1px solid #e4e4e0 !important;
  backdrop-filter: none !important;
}
/* mtb buttons */
body[data-theme="ivory_executive"] .members-timeline-toolbar .btn.ghost {
  background: #f5f5f2 !important; border: 1px solid #e4e4e0 !important;
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .members-timeline-toolbar .btn.ghost:hover {
  background: #f0efe9 !important; color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .members-timeline-toolbar .btn.ghost[aria-pressed="true"] {
  background: rgba(30,64,175,.10) !important; color: #1e40af !important;
  border-color: rgba(30,64,175,.28) !important;
}
body[data-theme="ivory_executive"] .members-timeline-toolbar .btn.primary {
  background: #1e40af !important; color: #fff !important; border-color: #1e40af !important;
}
body[data-theme="ivory_executive"] .members-timeline-toolbar .btn.danger {
  background: #dc2626 !important; color: #fff !important;
}
body[data-theme="ivory_executive"] .members-timeline-toolbar .input,
body[data-theme="ivory_executive"] .members-timeline-toolbar select {
  background: #ffffff !important; border: 1px solid #d4d4ce !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .members-timeline-toolbar .badge {
  background: rgba(30,64,175,.10) !important; color: #1e40af !important;
}
body[data-theme="ivory_executive"] .members-timeline-toolbar .hint {
  color: #b0b0be !important;
}

/* Coverage meter panel */
body[data-theme="ivory_executive"] .coverage-panel {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  color: #1a1a2e !important;
  backdrop-filter: none !important;
}
body[data-theme="ivory_executive"] .coverage-title { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .coverage-sub   { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .cov-health     { color: #15803d !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .cov-ok-hours   { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .cov-date-label { color: #1e40af !important; font-weight: 700 !important; }

/* Coverage meter cells */
body[data-theme="ivory_executive"] .coverage-meter .cell,
body[data-theme="ivory_executive"] .coverage-panel .cell {
  background: rgba(30,64,175,.06) !important;
  border: 1px solid rgba(30,64,175,.14) !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .coverage-panel .bar {
  background: rgba(30,64,175,.08) !important;
  border: 1px solid rgba(30,64,175,.16) !important;
}
body[data-theme="ivory_executive"] .coverage-panel .bar:hover,
body[data-theme="ivory_executive"] .coverage-panel .cell:hover {
  background: rgba(30,64,175,.14) !important;
  border-color: rgba(30,64,175,.3) !important;
}

/* Team roster panel */
body[data-theme="ivory_executive"] .members-roster {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .members-roster-header {
  background: #f5f5f2 !important;
  border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .roster-searchbar {
  background: #f5f5f2 !important;
  border: 1px solid #d4d4ce !important;
  border-radius: 9px !important;
}
body[data-theme="ivory_executive"] .roster-search {
  color: #1a1a2e !important; background: transparent !important;
}
body[data-theme="ivory_executive"] .roster-filter {
  background: transparent !important; color: #1a1a2e !important; border: none !important;
}
body[data-theme="ivory_executive"] .roster-item {
  background: transparent !important;
  border-bottom: 1px solid #f0efe9 !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .roster-item:hover {
  background: #fafaf7 !important;
}
body[data-theme="ivory_executive"] .roster-item.selected {
  background: rgba(30,64,175,.07) !important;
}
body[data-theme="ivory_executive"] .roster-name { color: #1a1a2e !important; }

/* Timeline */
body[data-theme="ivory_executive"] .members-timeline {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .members-row {
  border: 1px solid #e4e4e0 !important;
  background: #ffffff !important;
  border-radius: 10px !important;
}
body[data-theme="ivory_executive"] .members-row:nth-child(even) { background: rgba(26,26,46,.012) !important; }

/* Member name/text on rows */
body[data-theme="ivory_executive"] .members-page .members-row .member-name,
body[data-theme="ivory_executive"] .members-page .mem-name { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .members-page .mem-hours { color: #8a8a9a !important; }

/* Override protocol-level forced dark selects/inputs for members page in ivory */
body[data-theme="ivory_executive"] .members-page select,
body[data-theme="ivory_executive"] .members-page .input,
body[data-theme="ivory_executive"] .members-page option {
  color: #1a1a2e !important;
  background-color: #ffffff !important;
}
body[data-theme="ivory_executive"] .members-page .member-actions select {
  color: #1a1a2e !important;
  background-color: #f5f5f2 !important;
}

/* ms-toolbar (the header bar in members with nav + shift selector) */
body[data-theme="ivory_executive"] .ms-toolbar {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  border-radius: 12px !important;
}

/* Lock badge */
body[data-theme="ivory_executive"] .lock-badge { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .lock-ic { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .global-lock .btn.primary {
  background: #1e40af !important; color: #fff !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   FIX 4 · COMMAND CENTER — JS-injected cc-enterprise-styles
   ───────────────────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .enterprise-dist-card {
  background: #ffffff !important;
  backdrop-filter: none !important;
  border: 1px solid #e4e4e0 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(26,26,46,.07) !important;
}
body[data-theme="ivory_executive"] .enterprise-dist-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(30,64,175,.28) !important;
  box-shadow: 0 8px 24px rgba(30,64,175,.10) !important;
}
/* Batch badge */
body[data-theme="ivory_executive"] .dist-badge {
  background: rgba(30,64,175,.08) !important;
  color: #1e40af !important;
  border: 1px solid rgba(30,64,175,.18) !important;
}
/* Distribution title & meta */
body[data-theme="ivory_executive"] .dist-title {
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .dist-meta { color: #8a8a9a !important; }
/* CSV Export button */
body[data-theme="ivory_executive"] [data-export],
body[data-theme="ivory_executive"] button[style*="background:rgba(56,189,248"] {
  background: rgba(30,64,175,.08) !important;
  border: 1px solid rgba(30,64,175,.28) !important;
  color: #1e40af !important;
  box-shadow: none !important;
}

/* Summary pills strip */
body[data-theme="ivory_executive"] .dist-summary-pills {
  background: #f5f5f2 !important;
  border: 1px solid #e4e4e0 !important;
  border-radius: 8px !important;
}
/* Individual pills */
body[data-theme="ivory_executive"] .s-pill { border-color: #e4e4e0 !important; }
body[data-theme="ivory_executive"] .s-pill.blue {
  background: rgba(30,64,175,.08) !important; color: #1e40af !important;
  border-color: rgba(30,64,175,.2) !important;
}
body[data-theme="ivory_executive"] .s-pill.red.pulse {
  background: rgba(220,38,38,.10) !important; color: #b91c1c !important;
  border-color: rgba(220,38,38,.28) !important; box-shadow: none !important;
}
body[data-theme="ivory_executive"] .s-pill.gray {
  background: rgba(26,26,46,.05) !important; color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .s-pill.gold {
  background: rgba(217,119,6,.10) !important; color: #92400e !important;
  border-color: rgba(217,119,6,.24) !important;
}

/* Member mini cards (dark navy) */
body[data-theme="ivory_executive"] .member-mini-card {
  background: #f5f5f2 !important;
  border: 1px solid #e4e4e0 !important;
  border-radius: 8px !important;
}
body[data-theme="ivory_executive"] .member-mini-card:hover {
  background: #f0efe9 !important;
}
body[data-theme="ivory_executive"] .m-name { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .m-stat { color: #8a8a9a !important; }

/* Progress wrap */
body[data-theme="ivory_executive"] .m-progress-wrap {
  background: #e4e4e0 !important;
  border: 1px solid #d4d4ce !important;
}

/* Transfer button */
body[data-theme="ivory_executive"] .m-manage-btn {
  background: transparent !important;
  border: 1px solid rgba(30,64,175,.4) !important;
  color: #1e40af !important;
  border-radius: 6px !important;
}
body[data-theme="ivory_executive"] .m-manage-btn:hover {
  background: #1e40af !important; color: #fff !important;
  border-color: #1e40af !important;
  box-shadow: 0 3px 8px rgba(30,64,175,.28) !important;
}

/* Error dot */
body[data-theme="ivory_executive"] .err-dot {
  background: #dc2626 !important; box-shadow: 0 0 6px rgba(220,38,38,.5) !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   FIX 5 · USER MANAGEMENT — Action buttons (Profile, Edit) visibility
   ───────────────────────────────────────────────────────────────────────────── */
body[data-theme="ivory_executive"] .btn:not(.primary):not(.danger):not(.ghost):not(.ok),
body[data-theme="ivory_executive"] td .btn {
  background: #f0efe9 !important;
  border: 1px solid #d4d4ce !important;
  color: #1a1a2e !important;
  border-radius: 7px !important;
  font-weight: 600 !important;
}
body[data-theme="ivory_executive"] td .btn:hover:not(:disabled) {
  background: #1e40af !important; color: #fff !important; border-color: #1e40af !important;
}
body[data-theme="ivory_executive"] td .btn:disabled {
  opacity: .42 !important; cursor: not-allowed !important;
}
/* Ensure danger delete btn keeps its red */
body[data-theme="ivory_executive"] td .btn.danger {
  background: #dc2626 !important; color: #fff !important; border-color: #dc2626 !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   FIX 6 · TOPBAR icon area — brand mark + right-side icon buttons
   ───────────────────────────────────────────────────────────────────────────── */
/* Ensure topbar icon buttons (notification bell, settings, etc.) are visible */
body[data-theme="ivory_executive"] .topbar .btn,
body[data-theme="ivory_executive"] .topbar button {
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .topbar .btn:hover,
body[data-theme="ivory_executive"] .topbar button:hover {
  color: #1a1a2e !important; background: #f0efe9 !important;
  border-color: #d4d4ce !important;
}
/* Brand mark icon M */
body[data-theme="ivory_executive"] .brand-mark {
  background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%) !important;
  box-shadow: 0 2px 10px rgba(30,64,175,.30) !important;
  border-radius: 9px !important;
}
/* Topbar search icon */
body[data-theme="ivory_executive"] .top-global-search .search-icon,
body[data-theme="ivory_executive"] .top-global-search svg { color: #b0b0be !important; }

/* Right panel tab buttons (CASES / REMINDERS / DEADLINES) */
body[data-theme="ivory_executive"] .dashx-tab,
body[data-theme="ivory_executive"] .right .tab-btn,
body[data-theme="ivory_executive"] .dash-tab {
  background: #f5f5f2 !important;
  border: 1px solid #e4e4e0 !important;
  color: #8a8a9a !important;
  border-radius: 7px !important;
  font-weight: 700 !important;
  font-size: 10px !important;
  letter-spacing: .06em !important;
}
body[data-theme="ivory_executive"] .dashx-tab.active,
body[data-theme="ivory_executive"] .right .tab-btn.active,
body[data-theme="ivory_executive"] .dash-tab.active {
  background: #1e40af !important; color: #fff !important;
  border-color: #1e40af !important;
  box-shadow: 0 2px 8px rgba(30,64,175,.28) !important;
}

/* Announcements page table header (white bg inherited - but ensure it) */
body[data-theme="ivory_executive"] .ann-table th,
body[data-theme="ivory_executive"] [class*="announce"] table th {
  background: #f5f5f2 !important; color: #8a8a9a !important;
  border-bottom: 2px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] [class*="announce"] table td {
  color: #1a1a2e !important; border-bottom: 1px solid #f0efe9 !important;
}



/* =============================================================================
   IVORY EXECUTIVE — Phase 1-636 DEEP PATCH
   Fixes JS-injected classes for: Mailbox, My Quickbase, My Schedule
   100% scoped — body[data-theme="ivory_executive"] only.
   ============================================================================= */

/* ═══════════════════════════════════════════════════════════════════════════════
   BLOCK A · MAILBOX — All injected dark classes (enterprise-mailbox-styles)
   ═══════════════════════════════════════════════════════════════════════════════ */

/* A1 · Page shell dark gradient */
body[data-theme="ivory_executive"] .main.card.pad.page-mailbox,
body[data-theme="ivory_executive"] [class*="page-mailbox"] {
  background: #f5f5f2 !important;
}

/* A2 · Mailbox Control Center header */
body[data-theme="ivory_executive"] .mbx-header-bar {
  border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-main-title {
  color: #1a1a2e !important;
  text-shadow: none !important;
}

/* A3 · Glass header buttons */
body[data-theme="ivory_executive"] .btn-glass-ghost {
  background: #f0efe9 !important;
  color: #8a8a9a !important;
  border: 1px solid #d4d4ce !important;
  box-shadow: none !important;
}
body[data-theme="ivory_executive"] .btn-glass-ghost:hover {
  background: #e8e7e0 !important;
  color: #1a1a2e !important;
  border-color: #c8c8c0 !important;
}

/* A4 · Stat boxes (Active Duty / Timer / Assignments) */
body[data-theme="ivory_executive"] .mbx-stat-box {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 10px rgba(26,26,46,.07) !important;
}
body[data-theme="ivory_executive"] .mbx-stat-box:hover {
  border-color: rgba(30,64,175,.28) !important;
  box-shadow: 0 4px 16px rgba(30,64,175,.10) !important;
}
body[data-theme="ivory_executive"] .mbx-stat-lbl {
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .mbx-stat-val {
  color: #1a1a2e !important;
  text-shadow: none !important;
}
body[data-theme="ivory_executive"] .mbx-stat-sub {
  color: #b0b0be !important;
}
body[data-theme="ivory_executive"] .timer-display {
  color: #1e40af !important;
  text-shadow: none !important;
  font-weight: 900 !important;
}

/* A5 · Counter table: tbody rows */
body[data-theme="ivory_executive"] .mbx-counter-table tbody tr {
  border-bottom: 1px solid #f0efe9 !important;
}
body[data-theme="ivory_executive"] .mbx-counter-table tbody tr:nth-child(even) {
  background: rgba(26,26,46,.012) !important;
}
body[data-theme="ivory_executive"] .mbx-counter-table tbody tr:hover {
  background: #fafaf7 !important;
}

/* A6 · Counter table: active column tint */
body[data-theme="ivory_executive"] .mbx-counter-table td.active-col {
  background: rgba(30,64,175,.04) !important;
  border-left: 1px solid rgba(30,64,175,.12) !important;
  border-right: 1px solid rgba(30,64,175,.12) !important;
}
body[data-theme="ivory_executive"] .mbx-counter-table th.active-head-col {
  background: rgba(30,64,175,.07) !important;
  color: #1e40af !important;
  border-bottom: 2px solid #1e40af !important;
}

/* A7 · Time label in active header */
body[data-theme="ivory_executive"] .mbx-th-time {
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .mbx-th-time.is-active {
  color: #1e40af !important;
}

/* A8 · Agent cell */
body[data-theme="ivory_executive"] .mbx-agent-name {
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .mbx-agent-role.is-lead {
  color: rgba(30,64,175,.65) !important;
}
body[data-theme="ivory_executive"] .mbx-agent-role.is-member {
  color: #b0b0be !important;
}
body[data-theme="ivory_executive"] .mbx-agent-avatar {
  background: linear-gradient(135deg, rgba(30,64,175,.14), rgba(30,64,175,.08)) !important;
  border: 1px solid rgba(30,64,175,.24) !important;
  color: #1e40af !important;
}
body[data-theme="ivory_executive"] .mbx-agent-avatar.is-lead {
  background: linear-gradient(135deg, rgba(109,40,217,.12), rgba(109,40,217,.06)) !important;
  border-color: rgba(109,40,217,.22) !important;
  color: #7c3aed !important;
}

/* A9 · Count badges in counter table */
body[data-theme="ivory_executive"] .mbx-count-badge.is-zero {
  color: rgba(26,26,46,.28) !important;
  background: transparent !important;
}
body[data-theme="ivory_executive"] .mbx-count-badge.has-val {
  background: rgba(30,64,175,.10) !important;
  color: #1e40af !important;
  border: 1px solid rgba(30,64,175,.20) !important;
}
body[data-theme="ivory_executive"] .mbx-count-badge.is-active-col {
  background: rgba(30,64,175,.16) !important;
  color: #1e3a8a !important;
  border: 1px solid rgba(30,64,175,.28) !important;
}
body[data-theme="ivory_executive"] .mbx-count-badge.is-overall {
  background: rgba(30,64,175,.10) !important;
  color: #1e40af !important;
  border: 1px solid rgba(30,64,175,.20) !important;
}
body[data-theme="ivory_executive"] .mbx-count-badge.is-overall.is-zero {
  background: transparent !important;
  border: none !important;
  color: rgba(26,26,46,.25) !important;
}

/* A10 · Liquid badge — override dark base tank */
body[data-theme="ivory_executive"] .mbx-liquid-badge {
  background: #f0efe9 !important;
  border: 1px solid #d4d4ce !important;
  box-shadow: 0 1px 4px rgba(26,26,46,.08) !important;
}
body[data-theme="ivory_executive"] .mbx-liq-label {
  color: #1a1a2e !important;
  mix-blend-mode: normal !important;
}
body[data-theme="ivory_executive"] .mbx-liq-timer {
  color: #8a8a9a !important;
  background: rgba(26,26,46,.07) !important;
  border: 1px solid rgba(26,26,46,.10) !important;
}
body[data-theme="ivory_executive"] .mbx-liq-dot {
  box-shadow: 0 0 0 3px rgba(26,26,46,.08) !important;
}
/* NO ACTIVE DUTY state — make it readable on ivory */
body[data-theme="ivory_executive"] .mbx-liquid-badge[data-status="idle"] .mbx-liq-label,
body[data-theme="ivory_executive"] .mbx-liq-label[style*="color"] {
  color: #8a8a9a !important;
}

/* A11 · Analytics panel */
body[data-theme="ivory_executive"] .mbx-analytics-panel {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 10px rgba(26,26,46,.07) !important;
}
body[data-theme="ivory_executive"] .mbx-panel-head {
  border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-panel-title {
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .mbx-panel-desc {
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .mbx-ana-card {
  background: #f5f5f2 !important;
  border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-ana-row {
  border-bottom: 1px solid #f0efe9 !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .mbx-ana-badge {
  background: rgba(30,64,175,.08) !important;
  color: #1e40af !important;
}
body[data-theme="ivory_executive"] .mbx-ana-bar-wrap {
  background: #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-ana-bar-fill {
  background: linear-gradient(90deg, #1e40af, #3b82f6) !important;
}

/* A12 · Monitor/case matrix panel */
body[data-theme="ivory_executive"] .mbx-monitor-panel {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-mon-table th {
  background: #f5f5f2 !important;
  color: #8a8a9a !important;
  border-bottom: 2px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .mbx-mon-table td {
  border-color: #f0efe9 !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .mbx-case-badge {
  background: #f0efe9 !important;
  border: 1px solid #e4e4e0 !important;
  color: #1a1a2e !important;
}

/* A13 · Counter wrap top accent bar */
body[data-theme="ivory_executive"] .mbx-counter-wrap {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 12px rgba(26,26,46,.07) !important;
}
body[data-theme="ivory_executive"] .mbx-counter-wrap::before {
  background: linear-gradient(90deg, #1e40af 0%, #3b82f6 50%, #7c3aed 100%) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   BLOCK B · MY QUICKBASE — All dark classes (enterprise_ux.css + injected)
   ═══════════════════════════════════════════════════════════════════════════════ */

/* B1 · Page shell dark gradient */
body[data-theme="ivory_executive"] .qb-page-shell {
  background: #f5f5f2 !important;
  backdrop-filter: none !important;
}
body[data-theme="ivory_executive"] .qb-page-shell.qb-is-fullscreen {
  background: #f5f5f2 !important;
}

/* B2 · Tab bar */
body[data-theme="ivory_executive"] .qb-tabbar-wrap {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  backdrop-filter: none !important;
  box-shadow: 0 1px 4px rgba(26,26,46,.06) !important;
}
body[data-theme="ivory_executive"] .qb-tab-btn {
  color: #8a8a9a !important;
  background: transparent !important;
  border: 1px solid transparent !important;
}
body[data-theme="ivory_executive"] .qb-tab-btn:hover {
  background: #f0efe9 !important;
  color: #1a1a2e !important;
  border-color: #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .qb-tab-btn-active,
body[data-theme="ivory_executive"] .qb-tab-btn.qb-tab-btn-active {
  background: rgba(30,64,175,.10) !important;
  color: #1e40af !important;
  border-color: rgba(30,64,175,.28) !important;
  font-weight: 700 !important;
}
body[data-theme="ivory_executive"] .qb-tab-badge-live   { color: #15803d !important; }
body[data-theme="ivory_executive"] .qb-tab-badge-cached { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .qb-tab-add-btn {
  background: #f0efe9 !important;
  border: 1px solid #d4d4ce !important;
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .qb-tab-add-btn:hover {
  background: rgba(30,64,175,.08) !important;
  color: #1e40af !important;
  border-color: rgba(30,64,175,.3) !important;
}
body[data-theme="ivory_executive"] .qb-fullscreen-btn {
  background: #f0efe9 !important;
  border: 1px solid #d4d4ce !important;
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .qb-fullscreen-btn:hover {
  background: rgba(30,64,175,.08) !important;
  color: #1e40af !important;
  border-color: rgba(30,64,175,.3) !important;
}

/* B3 · Counter widgets — fix invisible text on light bg */
body[data-theme="ivory_executive"] .qb-counter-widget {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 10px rgba(26,26,46,.07) !important;
  backdrop-filter: none !important;
}
body[data-theme="ivory_executive"] .qb-counter-widget:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(26,26,46,.10) !important;
  border-color: rgba(30,64,175,.24) !important;
}
body[data-theme="ivory_executive"] .qb-counter-widget.is-active {
  border-color: rgba(30,64,175,.5) !important;
  box-shadow: 0 0 0 3px rgba(30,64,175,.14), 0 6px 20px rgba(26,26,46,.10) !important;
  background: rgba(30,64,175,.05) !important;
}
body[data-theme="ivory_executive"] .qb-counter-label {
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .qb-counter-value {
  color: #1a1a2e !important;
}

/* B4 · Table card */
body[data-theme="ivory_executive"] .qb-table-card {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: 0 2px 12px rgba(26,26,46,.07) !important;
}
body[data-theme="ivory_executive"] .qb-table-head {
  background: #f5f5f2 !important;
  border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .qb-table-title {
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .qb-meta-text {
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .qb-fresh-badge {
  color: #15803d !important;
  background: rgba(22,163,74,.10) !important;
  border-color: rgba(22,163,74,.24) !important;
}
body[data-theme="ivory_executive"] .qb-cache-badge {
  color: #8a8a9a !important;
  background: rgba(26,26,46,.05) !important;
  border-color: rgba(26,26,46,.10) !important;
}

/* B5 · Table header: override the dark #1a2540 navy */
body[data-theme="ivory_executive"] .qb-data-table thead th {
  background: #f5f5f2 !important;
  background-image: none !important;
  border-bottom: 2px solid #e4e4e0 !important;
  box-shadow: none !important;
  color: #8a8a9a !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
}
body[data-theme="ivory_executive"] .qb-data-table thead th:hover {
  background: #eeeee9 !important;
  color: #1a1a2e !important;
}

/* B6 · Table rows and cells */
body[data-theme="ivory_executive"] .qb-data-table tbody tr {
  border-bottom: 1px solid #f0efe9 !important;
}
body[data-theme="ivory_executive"] .qb-data-table tbody tr:nth-child(even) {
  background: rgba(26,26,46,.012) !important;
}
body[data-theme="ivory_executive"] .qb-data-table tbody tr:hover {
  background: #fafaf7 !important;
}
body[data-theme="ivory_executive"] .qb-data-table td {
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .qb-case-id {
  color: #1a1a2e !important;
  font-weight: 800 !important;
}

/* B7 · Row number: override dark #1a2540 sticky bg */
body[data-theme="ivory_executive"] .qb-row-num-th {
  background: #f5f5f2 !important;
  background-image: none !important;
  color: #b0b0be !important;
  border-right: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .qb-row-num-cell {
  background: rgba(245,245,242,.95) !important;
  border-right: 1px solid #f0efe9 !important;
}
body[data-theme="ivory_executive"] .qb-row-num-pill {
  background: rgba(26,26,46,.04) !important;
  border: 1px solid rgba(26,26,46,.10) !important;
  color: rgba(26,26,46,.42) !important;
}
body[data-theme="ivory_executive"] .qb-data-table tbody tr:hover .qb-row-num-pill {
  background: rgba(30,64,175,.10) !important;
  border-color: rgba(30,64,175,.22) !important;
  color: #1e40af !important;
}

/* B8 · Search input */
body[data-theme="ivory_executive"] .qb-search-input {
  background: #ffffff !important;
  border: 1px solid #d4d4ce !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .qb-search-input:focus {
  border-color: #1e40af !important;
  box-shadow: 0 0 0 3px rgba(30,64,175,.15) !important;
}
body[data-theme="ivory_executive"] .qb-search-input::placeholder {
  color: #b0b0be !important;
}
body[data-theme="ivory_executive"] .qb-search-input.qb-search-scoped {
  border-color: rgba(30,64,175,.4) !important;
  background: rgba(30,64,175,.03) !important;
}
body[data-theme="ivory_executive"] .qb-search-ico {
  color: #b0b0be !important;
}
body[data-theme="ivory_executive"] .qb-scope-ico { color: #1e40af !important; }
body[data-theme="ivory_executive"] .qb-scope-lbl { color: #1e40af !important; }
body[data-theme="ivory_executive"] .qb-search-scope-tag {
  background: rgba(30,64,175,.06) !important;
  border: 1px solid rgba(30,64,175,.18) !important;
  color: #8a8a9a !important;
}

/* B9 · QB buttons */
body[data-theme="ivory_executive"] .qb-btn-ghost {
  background: #f5f5f2 !important;
  color: #8a8a9a !important;
  border: 1px solid #d4d4ce !important;
}
body[data-theme="ivory_executive"] .qb-btn-ghost:hover {
  background: #f0efe9 !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .qb-btn-primary {
  background: #1e40af !important;
  color: #fff !important;
  border: 1px solid rgba(30,64,175,.4) !important;
  box-shadow: 0 3px 10px rgba(30,64,175,.25) !important;
}
body[data-theme="ivory_executive"] .qb-btn-primary:hover {
  filter: none !important;
  background: #1e3a8a !important;
}

/* B10 · Status badges */
body[data-theme="ivory_executive"] .qb-status-badge {
  background: rgba(26,26,46,.05) !important;
  border: 1px solid rgba(26,26,46,.10) !important;
  color: #8a8a9a !important;
  border-radius: 5px !important;
  padding: 2px 7px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
}
body[data-theme="ivory_executive"] .qb-status-dot {
  width: 6px !important; height: 6px !important;
  border-radius: 999px !important; flex-shrink: 0 !important;
}
body[data-theme="ivory_executive"] .qb-status-investigating {
  background: rgba(217,119,6,.08) !important;
  border-color: rgba(217,119,6,.24) !important;
  color: #92400e !important;
}
body[data-theme="ivory_executive"] .qb-status-investigating .qb-status-dot {
  background: #d97706 !important;
}
body[data-theme="ivory_executive"] .qb-status-waiting {
  background: rgba(30,64,175,.08) !important;
  border-color: rgba(30,64,175,.22) !important;
  color: #1e3a8a !important;
}
body[data-theme="ivory_executive"] .qb-status-waiting .qb-status-dot {
  background: #1e40af !important;
}
body[data-theme="ivory_executive"] .qb-status-soft-close {
  background: rgba(22,163,74,.08) !important;
  border-color: rgba(22,163,74,.22) !important;
  color: #15803d !important;
}
body[data-theme="ivory_executive"] .qb-status-soft-close .qb-status-dot {
  background: #16a34a !important;
}
body[data-theme="ivory_executive"] .qb-status-initial {
  background: rgba(99,102,241,.08) !important;
  border-color: rgba(99,102,241,.22) !important;
  color: #4338ca !important;
}
body[data-theme="ivory_executive"] .qb-status-initial .qb-status-dot {
  background: #6366f1 !important;
}
body[data-theme="ivory_executive"] .qb-status-response {
  background: rgba(14,165,233,.08) !important;
  border-color: rgba(14,165,233,.22) !important;
  color: #0369a1 !important;
}
body[data-theme="ivory_executive"] .qb-status-response .qb-status-dot {
  background: #0ea5e9 !important;
}
body[data-theme="ivory_executive"] .qb-status-closed {
  background: rgba(26,26,46,.05) !important;
  border-color: rgba(26,26,46,.12) !important;
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .qb-status-closed .qb-status-dot {
  background: #b0b0be !important;
}
body[data-theme="ivory_executive"] .qb-status-default {
  background: rgba(26,26,46,.04) !important;
  border-color: #e4e4e0 !important;
  color: #8a8a9a !important;
}

/* B11 · QB section labels */
body[data-theme="ivory_executive"] .qb-section-title {
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .qb-section-num {
  background: rgba(30,64,175,.10) !important;
  border-color: rgba(30,64,175,.24) !important;
  color: #1e40af !important;
}

/* B12 · QB settings / field inputs */
body[data-theme="ivory_executive"] .qb-field-label {
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .qb-field-input {
  background: #ffffff !important;
  border: 1px solid #d4d4ce !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .qb-field-input:focus {
  border-color: #1e40af !important;
}
body[data-theme="ivory_executive"] .qb-field-readonly {
  background: #f5f5f2 !important;
  color: #b0b0be !important;
}
body[data-theme="ivory_executive"] .qb-field-hint {
  color: #b0b0be !important;
}
body[data-theme="ivory_executive"] .qb-columns-scroll {
  background: #f5f5f2 !important;
  border: 1px solid #e4e4e0 !important;
}

/* B13 · QB floating selected columns panel (inline style override) */
body[data-theme="ivory_executive"] #qbSelectedFloatingPanel {
  background: #ffffff !important;
  border: 1px solid #e4e4e0 !important;
  box-shadow: 0 8px 28px rgba(26,26,46,.14) !important;
}
body[data-theme="ivory_executive"] #qbSelectedFloatingHandle {
  border-bottom: 1px solid #e4e4e0 !important;
  color: #8a8a9a !important;
}

/* B14 · Scrollbars in QB data area */
body[data-theme="ivory_executive"] .qb-data-body .qb-table-inner::-webkit-scrollbar-track {
  background: #f0efe9 !important;
}
body[data-theme="ivory_executive"] .qb-data-body .qb-table-inner::-webkit-scrollbar-thumb {
  background: #d4d4ce !important;
}
body[data-theme="ivory_executive"] .qb-data-body .qb-table-inner::-webkit-scrollbar-thumb:hover {
  background: #b0b0be !important;
}

/* B15 · Settings modal dark elements */
body[data-theme="ivory_executive"] #qbSettingsModal {
  background: rgba(26,26,46,.42) !important;
  backdrop-filter: blur(6px) !important;
}
body[data-theme="ivory_executive"] #qbSettingsSavingLock {
  background: rgba(245,245,242,.85) !important;
  backdrop-filter: blur(4px) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   BLOCK C · MY SCHEDULE — Polish remaining dark elements
   ═══════════════════════════════════════════════════════════════════════════════ */

/* C1 · Schedule header actions */
body[data-theme="ivory_executive"] .schx-header {
  background: transparent !important;
  border-bottom: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .ux-h1 {
  color: #1a1a2e !important;
  font-family: 'Manrope', sans-serif !important;
}

/* C2 · Role chip */
body[data-theme="ivory_executive"] .ux-chip {
  background: rgba(30,64,175,.08) !important;
  border-color: rgba(30,64,175,.22) !important;
  color: #1e3a8a !important;
  font-weight: 700 !important;
}
body[data-theme="ivory_executive"] .ux-chip .dot {
  background: #1e40af !important;
}

/* C3 · View toggle (Weekly/Daily/Team) */
body[data-theme="ivory_executive"] .schx-toggle .btn.ghost {
  color: #8a8a9a !important;
  background: #f5f5f2 !important;
  border: 1px solid #e4e4e0 !important;
}
body[data-theme="ivory_executive"] .schx-toggle .btn.ghost:hover {
  background: #f0efe9 !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .schx-toggle .btn.ghost.active,
body[data-theme="ivory_executive"] .schx-toggle .btn.ghost.active:hover {
  background: #1e40af !important;
  color: #ffffff !important;
  border-color: #1e40af !important;
  box-shadow: 0 2px 8px rgba(30,64,175,.28) !important;
}

/* C4 · Attendance / Mailbox link buttons */
body[data-theme="ivory_executive"] .schx-header .btn:not(.schx-header-cta):not(.active) {
  background: #f5f5f2 !important;
  border: 1px solid #d4d4ce !important;
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .schx-header .btn:not(.schx-header-cta):hover {
  background: #f0efe9 !important;
  color: #1a1a2e !important;
}

/* C5 · New Action Item button */
body[data-theme="ivory_executive"] .schx-header-cta {
  background: #1e40af !important;
  color: #fff !important;
  border-color: #1e40af !important;
  box-shadow: 0 2px 8px rgba(30,64,175,.28) !important;
}
body[data-theme="ivory_executive"] .schx-header-cta:hover {
  background: #1e3a8a !important;
  box-shadow: 0 4px 14px rgba(30,64,175,.36) !important;
}

/* C6 · Schedule legend dots */
body[data-theme="ivory_executive"] .legend-item {
  background: rgba(26,26,46,.03) !important;
  border: 1px solid #e4e4e0 !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .legend-dot {
  box-shadow: 0 0 0 3px rgba(26,26,46,.06) !important;
}

/* C7 · KPI cards sub-text */
body[data-theme="ivory_executive"] .schx-kpi .small.muted {
  color: #8a8a9a !important;
}
body[data-theme="ivory_executive"] .schx-kpi .big {
  color: #1a1a2e !important;
  font-weight: 800 !important;
  font-family: 'Manrope', sans-serif !important;
}


/* ═══════════════════════════════════════════════════════════════════════════════
   APEX THEME — Bloomberg Terminal / Ultra-Premium Enterprise
   Theme ID : apex  |  mode : dark
   ─────────────────────────────────────────────────────────────────────────────
   Palette Strategy:
     PRIMARY BG:   Deep navy #060d1e  — visible navy, NOT pitch-black
     PANELS:       #0a1628 / #0e1f3a  — rich layered depth
     ACCENT:       #C9A84C Gold       — Bloomberg gold, glows on dark navy
     TEXT:         #F0F4FF / #8AAAC8  — high-contrast crisp white
     BORDERS:      Gold-tinted glass  — rgba(201,168,76,.16)
     MONO:         IBM Plex Mono numbers — financial terminal feel
   RULES: Aesthetic overrides ONLY. Never touch structural layout.
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ── 0. Root token overrides ─────────────────────────────────────────────── */
body[data-theme="apex"] {
  --bg:            #060d1e;
  --bg2:           #080f22;
  --panel:         #0a1628;
  --panel2:        #0e1f3a;
  --border:        rgba(201,168,76,.16);
  --border2:       rgba(201,168,76,.28);
  --text:          #F0F4FF;
  --muted:         #8AAAC8;
  --muted2:        #5A7898;
  --primary:       #C9A84C;
  --primary2:      #E8C46A;
  --danger:        #FF3B4E;
  --warn:          #F59E0B;
  --ok:            #10B981;
  --accent:        #C9A84C;
  --accent-rgb:    201,168,76;
  --shadow:        0 8px 32px rgba(0,0,0,.58);
  --shadow2:       0 2px 12px rgba(0,0,0,.44);
  --focus:         0 0 0 3px rgba(201,168,76,.22);
  --radius:        10px;
  --radius2:       8px;
  --font:          'DM Sans', ui-sans-serif, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  --surface-0:     #060d1e;
  --surface-1:     #0a1628;
  --surface-2:     #0e1f3a;
  --text-0:        #F0F4FF;
  --text-muted:    #8AAAC8;
  --border-0:      rgba(201,168,76,.16);
  color-scheme: dark;
  color: #F0F4FF;
}

/* ── 1. Body / background ────────────────────────────────────────────────── */
body[data-theme="apex"] {
  background:
    radial-gradient(ellipse 68% 44% at 15% -4%,  rgba(201,168,76,.08) 0%, transparent 55%),
    radial-gradient(ellipse 52% 32% at 88% 96%,  rgba(201,168,76,.06) 0%, transparent 50%),
    radial-gradient(ellipse 38% 28% at 72% 18%,  rgba(100,140,220,.05) 0%, transparent 44%),
    linear-gradient(165deg, #060d1e 0%, #07101f 55%, #050c19 100%);
}

/* ── 2. App grid ─────────────────────────────────────────────────────────── */
body[data-theme="apex"] .app {
  gap: 12px;
  padding-top: 12px;
  padding-left: 12px;
  padding-right: 12px;
}

/* ── 3. Cards ────────────────────────────────────────────────────────────── */
body[data-theme="apex"] .card {
  background: linear-gradient(155deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,.018) 100%) !important;
  border: 1px solid rgba(201,168,76,.14) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,.45), inset 0 1px 0 rgba(201,168,76,.07) !important;
}

/* ── 4. Topbar ───────────────────────────────────────────────────────────── */
body[data-theme="apex"] .topbar {
  background: linear-gradient(90deg, #08111f 0%, #0a1830 50%, #08111f 100%) !important;
  border: 1px solid rgba(201,168,76,.18) !important;
  position: relative;
}
body[data-theme="apex"] .topbar::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(201,168,76,.55) 18%,
    rgba(232,196,106,.85) 42%,
    rgba(201,168,76,.70) 68%,
    rgba(201,168,76,.40) 85%,
    transparent 100%);
  pointer-events: none;
}

/* ── 5. Brand ────────────────────────────────────────────────────────────── */
body[data-theme="apex"] .topbrand {
  background: rgba(201,168,76,.06) !important;
  border-color: rgba(201,168,76,.18) !important;
}
body[data-theme="apex"] .brand-name {
  color: #F0F4FF;
  font-weight: 900;
  letter-spacing: .06em;
  text-shadow: 0 0 20px rgba(201,168,76,.4), 0 0 42px rgba(201,168,76,.15);
}
body[data-theme="apex"] .brand-sub { color: #8AAAC8; letter-spacing: .08em; text-transform: uppercase; font-size: 10px; font-weight: 700; }
body[data-theme="apex"] .brand-mark {
  background: linear-gradient(135deg, #9a7230, #C9A84C) !important;
  box-shadow: 0 0 18px rgba(201,168,76,.55), 0 4px 14px rgba(0,0,0,.4) !important;
  border-radius: 10px !important;
}
body[data-theme="apex"] .brand-mark::after { color: #fff !important; font-weight: 900; }

/* ── 6. Global Search ────────────────────────────────────────────────────── */
body[data-theme="apex"] .top-global-search {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(201,168,76,.18) !important;
  border-radius: 8px !important;
}
body[data-theme="apex"] .top-global-search:focus-within {
  border-color: rgba(201,168,76,.52) !important;
  box-shadow: 0 0 0 3px rgba(201,168,76,.12) !important;
}
body[data-theme="apex"] #globalSearchInput { color: #F0F4FF !important; background: transparent !important; }
body[data-theme="apex"] #globalSearchInput::placeholder { color: #5A7898 !important; }

/* ── 7. Topbar icon buttons ──────────────────────────────────────────────── */
body[data-theme="apex"] .btn.ghost.iconbtn {
  background: rgba(201,168,76,.07) !important;
  border-color: rgba(201,168,76,.18) !important;
  color: #C9A84C !important;
}
body[data-theme="apex"] .btn.ghost.iconbtn:hover {
  background: rgba(201,168,76,.16) !important;
  border-color: rgba(232,196,106,.40) !important;
  color: #E8C46A !important;
  box-shadow: 0 0 14px rgba(201,168,76,.22) !important;
}

/* ── 8. Logout ───────────────────────────────────────────────────────────── */
body[data-theme="apex"] #logoutBtn {
  background: rgba(255,59,78,.1) !important;
  border-color: rgba(255,59,78,.28) !important;
  color: #ffb3b8 !important;
  font-weight: 700 !important;
}
body[data-theme="apex"] #logoutBtn:hover {
  background: rgba(255,59,78,.2) !important;
  border-color: rgba(255,59,78,.45) !important;
  box-shadow: 0 4px 16px rgba(255,59,78,.25) !important;
}

/* ── 9. Sync status ──────────────────────────────────────────────────────── */
body[data-theme="apex"] .sync-status {
  background: rgba(16,185,129,.1) !important;
  border: 1px solid rgba(16,185,129,.28) !important;
  color: #10B981 !important;
}
body[data-theme="apex"] .sync-status .dot {
  background: #10B981 !important;
  box-shadow: 0 0 8px rgba(16,185,129,.75) !important;
}
body[data-theme="apex"] .sync-status.poll .dot { background: #F59E0B !important; box-shadow: 0 0 8px rgba(245,158,11,.7) !important; }
body[data-theme="apex"] .sync-status.off  .dot { background: #FF3B4E !important; box-shadow: 0 0 8px rgba(255,59,78,.7) !important; }

/* ── 10. Left Sidebar ────────────────────────────────────────────────────── */
body[data-theme="apex"] aside.side {
  background: linear-gradient(180deg, #08111f 0%, #060e1c 60%, #050c18 100%) !important;
  border-color: rgba(201,168,76,.18) !important;
  box-shadow: 2px 0 20px rgba(0,0,0,.4) !important;
}
body[data-theme="apex"] .nav-section-label,
body[data-theme="apex"] .nav-label {
  color: #6a8aaa !important;
  font-size: 9.5px !important;
  font-weight: 900 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
}
body[data-theme="apex"] .nav a,
body[data-theme="apex"] .nav .nav-item,
body[data-theme="apex"] .nav .nav-group-head {
  color: #C8D8F0 !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border: 1px solid transparent !important;
  letter-spacing: .01em !important;
}
body[data-theme="apex"] .nav a:hover,
body[data-theme="apex"] .nav .nav-item:hover,
body[data-theme="apex"] .nav .nav-group-head:hover {
  background: rgba(201,168,76,.10) !important;
  color: #F0F4FF !important;
  border-color: rgba(201,168,76,.22) !important;
}
body[data-theme="apex"] .nav a.active,
body[data-theme="apex"] .nav .nav-item.active {
  background: linear-gradient(90deg, rgba(201,168,76,.22) 0%, rgba(201,168,76,.07) 100%) !important;
  border-color: rgba(201,168,76,.38) !important;
  color: #E8C46A !important;
  font-weight: 700 !important;
  box-shadow: inset 0 0 0 1px rgba(201,168,76,.10) !important;
}
body[data-theme="apex"] .nav a.active::before,
body[data-theme="apex"] .nav .nav-item.active::before {
  content: '';
  position: absolute;
  left: 0; top: 20%; bottom: 20%;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, #E8C46A, #C9A84C);
  box-shadow: 0 0 10px rgba(201,168,76,.8), 0 0 22px rgba(201,168,76,.25);
}
body[data-theme="apex"] .nav-item.nav-subitem { color: #8AAAC8 !important; font-size: 12.5px !important; font-weight: 500 !important; }
body[data-theme="apex"] .nav-item.nav-subitem:hover { color: #F0F4FF !important; background: rgba(201,168,76,.08) !important; }
body[data-theme="apex"] .nav-item.nav-subitem.active { color: #E8C46A !important; background: rgba(201,168,76,.14) !important; }
body[data-theme="apex"] .nav-group.is-record-group .nav-group-kids::before { background: rgba(201,168,76,.25) !important; }

/* ── 11. Sidebar profile ─────────────────────────────────────────────────── */
body[data-theme="apex"] .usercard { background: transparent !important; }
body[data-theme="apex"] .sp-name-strong,
body[data-theme="apex"] .uc-name { color: #F0F4FF !important; font-weight: 800 !important; }
body[data-theme="apex"] .sp-meta-subtitle,
body[data-theme="apex"] .sp-shift, body[data-theme="apex"] .sp-team,
body[data-theme="apex"] .uc-meta { color: #8AAAC8 !important; }
body[data-theme="apex"] .sp-photo, body[data-theme="apex"] .sp-photo-sm {
  border-color: rgba(201,168,76,.38) !important;
  background: rgba(201,168,76,.12) !important;
}
body[data-theme="apex"] .sp-photo .initials,
body[data-theme="apex"] .sp-photo-sm .initials { color: #E8C46A !important; }
body[data-theme="apex"] .sp-presence-dot.is-active { background: #10B981 !important; box-shadow: 0 0 8px rgba(16,185,129,.7) !important; }
body[data-theme="apex"] .sp-position { background: rgba(201,168,76,.12) !important; border-color: rgba(201,168,76,.30) !important; color: #E8C46A !important; }

/* ── 12. Sidebar activity log ────────────────────────────────────────────── */
body[data-theme="apex"] .logline { color: #8AAAC8 !important; }
body[data-theme="apex"] .logline .m { color: #B4CCE8 !important; }
body[data-theme="apex"] .logline .tl-dot { background: rgba(201,168,76,.70) !important; box-shadow: 0 0 6px rgba(201,168,76,.45) !important; }
body[data-theme="apex"] .logline .tl-dot::after { background: rgba(201,168,76,.18) !important; }

/* ── 13. Right sidebar ───────────────────────────────────────────────────── */
body[data-theme="apex"] aside.right {
  background: linear-gradient(180deg, #08111f 0%, #060e1a 100%) !important;
  border-color: rgba(201,168,76,.16) !important;
}

/* ── 14. Main content ────────────────────────────────────────────────────── */
body[data-theme="apex"] .main.card,
body[data-theme="apex"] main.main {
  background: linear-gradient(160deg, #07101e 0%, #060d18 100%) !important;
  border-color: rgba(201,168,76,.12) !important;
}

/* ── 15. Announcement bar ────────────────────────────────────────────────── */
body[data-theme="apex"] .announce-bar {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(201,168,76,.14) !important;
  border-radius: 10px !important;
  border-left: 2px solid #C9A84C !important;
}
body[data-theme="apex"] .announce-bar:hover { background: rgba(201,168,76,.06) !important; border-left-color: #E8C46A !important; }
body[data-theme="apex"] .announce-bar::before { display: none !important; }
body[data-theme="apex"] .announce-who { color: #C9A84C !important; font-weight: 700 !important; font-size: 10px !important; letter-spacing: .06em !important; text-transform: uppercase !important; }
body[data-theme="apex"] .announce-title { color: #F0F4FF !important; font-weight: 800 !important; }
body[data-theme="apex"] .announce-msg { color: #8AAAC8 !important; }
body[data-theme="apex"] .announce-avatar { background: linear-gradient(135deg, #9a7230, #C9A84C) !important; }

/* ── 16. Reminder cards ──────────────────────────────────────────────────── */
body[data-theme="apex"] .reminder-card {
  background: rgba(8,17,31,.94) !important;
  border: 1px solid rgba(201,168,76,.20) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.45) !important;
  backdrop-filter: blur(16px) !important;
}
body[data-theme="apex"] .reminder-card.my { border-color: rgba(16,185,129,.35) !important; background: linear-gradient(135deg, rgba(16,185,129,.07), rgba(16,185,129,.03)) !important; }
body[data-theme="apex"] .reminder-card.team { border-color: rgba(255,59,78,.32) !important; background: linear-gradient(135deg, rgba(255,59,78,.07), rgba(245,158,11,.03)) !important; }
body[data-theme="apex"] .reminder-card .rc-title { color: #F0F4FF !important; font-weight: 700 !important; }
body[data-theme="apex"] .reminder-card .rc-meta { color: #8AAAC8 !important; }

/* ── 17. Buttons ─────────────────────────────────────────────────────────── */
body[data-theme="apex"] .btn {
  background: linear-gradient(155deg, rgba(255,255,255,.07), rgba(255,255,255,.02)) !important;
  border-color: rgba(201,168,76,.20) !important;
  color: #F0F4FF !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.28) !important;
  font-weight: 600 !important;
}
body[data-theme="apex"] .btn:hover { background: rgba(201,168,76,.10) !important; border-color: rgba(232,196,106,.35) !important; }
body[data-theme="apex"] .btn.primary {
  background: linear-gradient(135deg, #9a7230, #C9A84C) !important;
  border-color: rgba(232,196,106,.55) !important;
  color: #fff !important;
  box-shadow: 0 4px 18px rgba(201,168,76,.32) !important;
}
body[data-theme="apex"] .btn.primary:hover { box-shadow: 0 6px 24px rgba(201,168,76,.48) !important; transform: translateY(-1px); }
body[data-theme="apex"] .btn.danger {
  background: linear-gradient(135deg, rgba(200,35,55,.7), rgba(170,25,40,.6)) !important;
  border-color: rgba(255,59,78,.42) !important;
  color: #ffcece !important;
  box-shadow: 0 4px 14px rgba(200,35,55,.22) !important;
}
body[data-theme="apex"] .btn.ghost { background: transparent !important; box-shadow: none !important; }
body[data-theme="apex"] .btn.tiny { box-shadow: none !important; }

/* ── 18. Inputs ──────────────────────────────────────────────────────────── */
body[data-theme="apex"] input,
body[data-theme="apex"] select,
body[data-theme="apex"] textarea,
body[data-theme="apex"] .input {
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(201,168,76,.18) !important;
  color: #F0F4FF !important;
  border-radius: 8px !important;
}
body[data-theme="apex"] input:focus,
body[data-theme="apex"] select:focus,
body[data-theme="apex"] textarea:focus,
body[data-theme="apex"] .input:focus {
  border-color: rgba(201,168,76,.58) !important;
  box-shadow: 0 0 0 3px rgba(201,168,76,.12) !important;
  background: rgba(255,255,255,.07) !important;
}
body[data-theme="apex"] input::placeholder,
body[data-theme="apex"] textarea::placeholder { color: #4a6888 !important; }
body[data-theme="apex"] select option { background: #0a1628; color: #F0F4FF; }

/* ── 19. Tables ──────────────────────────────────────────────────────────── */
body[data-theme="apex"] th {
  background: linear-gradient(180deg, #0e1e38 0%, #0b1830 100%) !important;
  color: #C9A84C !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  border-bottom: 1px solid rgba(201,168,76,.22) !important;
}
body[data-theme="apex"] td { border-bottom: 1px solid rgba(201,168,76,.07) !important; color: #C8D8F0 !important; }
body[data-theme="apex"] tr:hover td { background: rgba(201,168,76,.04) !important; }

/* ── 20. Modals ──────────────────────────────────────────────────────────── */
body[data-theme="apex"] .modal { background: rgba(0,0,0,.78) !important; backdrop-filter: blur(14px) !important; }
body[data-theme="apex"] .modal .panel {
  background: linear-gradient(145deg, #0a1525, #0d1e38) !important;
  border: 1px solid rgba(201,168,76,.22) !important;
  box-shadow: 0 32px 80px rgba(0,0,0,.72), 0 0 0 1px rgba(255,255,255,.04) !important;
  border-radius: 14px !important;
  color: #F0F4FF !important;
}
body[data-theme="apex"] .modal .head { border-bottom: 1px solid rgba(201,168,76,.14) !important; }
body[data-theme="apex"] .popover, body[data-theme="apex"] .role-picker {
  background: #0a1628 !important;
  border: 1px solid rgba(201,168,76,.22) !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.68) !important;
  color: #F0F4FF !important;
}

/* ── 21. Notification popout ─────────────────────────────────────────────── */
body[data-theme="apex"] .notification-popout {
  background: linear-gradient(145deg, #0a1525, #0d1e38) !important;
  border: 1px solid rgba(201,168,76,.20) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.65), 0 0 30px rgba(201,168,76,.07) !important;
  backdrop-filter: blur(20px) !important;
}
body[data-theme="apex"] .notification-popout .notif-item { border-radius: 8px !important; border: 1px solid rgba(201,168,76,.08) !important; }
body[data-theme="apex"] .notification-popout .notif-item:hover { background: rgba(201,168,76,.07) !important; border-color: rgba(201,168,76,.22) !important; }
body[data-theme="apex"] .notification-popout .notif-item.unread { border-left: 2px solid #C9A84C !important; background: rgba(201,168,76,.06) !important; }
body[data-theme="apex"] .notif-item-title { color: #F0F4FF !important; font-weight: 700 !important; }
body[data-theme="apex"] .notif-item-body { color: #8AAAC8 !important; }

/* ── 22. Dashx notifs ────────────────────────────────────────────────────── */
body[data-theme="apex"] .dashx-notif { background: rgba(8,17,31,.92) !important; border: 1px solid rgba(201,168,76,.14) !important; }
body[data-theme="apex"] .dashx-notif.unread { border-color: rgba(201,168,76,.46) !important; background: rgba(201,168,76,.06) !important; }

/* ── 23. Badges / pills ──────────────────────────────────────────────────── */
body[data-theme="apex"] .badge { background: rgba(255,255,255,.04) !important; border-color: rgba(201,168,76,.20) !important; color: #C8D8F0 !important; }
body[data-theme="apex"] .badge.ok { background: rgba(16,185,129,.12) !important; border-color: rgba(16,185,129,.30) !important; color: #6EF0B8 !important; }
body[data-theme="apex"] .badge.danger { background: rgba(255,59,78,.12) !important; border-color: rgba(255,59,78,.28) !important; color: #FFB0BA !important; }
body[data-theme="apex"] .badge.warn { background: rgba(245,158,11,.12) !important; border-color: rgba(245,158,11,.28) !important; color: #FDDFA0 !important; }
body[data-theme="apex"] .badge.info { background: rgba(201,168,76,.12) !important; border-color: rgba(201,168,76,.28) !important; color: #E8C46A !important; }
body[data-theme="apex"] .pill { background: rgba(201,168,76,.12) !important; border: 1px solid rgba(201,168,76,.28) !important; color: #E8C46A !important; border-radius: 6px !important; font-weight: 700 !important; }

/* ── 24. Online users bar ────────────────────────────────────────────────── */
body[data-theme="apex"] .online-users-bar {
  background: linear-gradient(180deg, rgba(6,13,30,0) 0%, rgba(6,13,30,.88) 50%, rgba(6,13,30,.97) 100%) !important;
  border-top: 1px solid rgba(201,168,76,.12) !important;
  backdrop-filter: blur(14px) !important;
}
body[data-theme="apex"] .onlinebar-sec { background: rgba(255,255,255,.03) !important; border: 1px solid rgba(201,168,76,.10) !important; border-radius: 8px !important; }
body[data-theme="apex"] .onlinebar-title { color: #5A7898 !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: .1em !important; text-transform: uppercase !important; }
body[data-theme="apex"] .onlinebar-count { color: #8AAAC8 !important; }
body[data-theme="apex"] .online-pill { border: 1.5px solid rgba(16,185,129,.65) !important; background: rgba(255,255,255,.04) !important; }
body[data-theme="apex"] .online-pill.is-red { border-color: rgba(255,59,78,.75) !important; }
body[data-theme="apex"] .online-pill .ini { color: #F0F4FF !important; }

/* ── 25. Quicklinks dock ─────────────────────────────────────────────────── */
body[data-theme="apex"] .quicklinks-bar {
  background: linear-gradient(180deg, rgba(6,13,30,.55) 0%, rgba(4,10,21,.97) 100%) !important;
  border-top: 1px solid rgba(201,168,76,.12) !important;
  backdrop-filter: blur(20px) !important;
}
body[data-theme="apex"] .qcircle { background: rgba(201,168,76,.08) !important; border: 1px solid rgba(201,168,76,.22) !important; box-shadow: 0 0 12px rgba(201,168,76,.08) !important; }
body[data-theme="apex"] .qcircle:hover { background: rgba(201,168,76,.20) !important; border-color: rgba(232,196,106,.45) !important; box-shadow: 0 0 20px rgba(201,168,76,.30) !important; transform: translateY(-2px); }
body[data-theme="apex"] .qcircle .qtxt { color: #F0F4FF !important; }
body[data-theme="apex"] .qlabel { color: #8AAAC8 !important; font-size: 9.5px !important; }

/* ── 26. World clocks ────────────────────────────────────────────────────── */
body[data-theme="apex"] .wclock { background: rgba(201,168,76,.07) !important; border: 1px solid rgba(201,168,76,.18) !important; border-radius: 8px !important; }
body[data-theme="apex"] .wclock .wc-label { color: #8AAAC8 !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: .08em !important; text-transform: uppercase !important; }
body[data-theme="apex"] .wclock .wc-h,
body[data-theme="apex"] .wclock .wc-m { color: #E8C46A !important; font-weight: 700 !important; font-family: 'IBM Plex Mono', 'JetBrains Mono', monospace !important; }
body[data-theme="apex"] .wclock .wc-sec { color: #8AAAC8 !important; font-family: 'IBM Plex Mono', 'JetBrains Mono', monospace !important; }

/* ── 27. General text, links, scrollbar ──────────────────────────────────── */
body[data-theme="apex"] .small, body[data-theme="apex"] .muted { color: #8AAAC8 !important; }
body[data-theme="apex"] .section-title { color: #F0F4FF !important; }
body[data-theme="apex"] a { color: #E8C46A; }
body[data-theme="apex"] a:hover { color: #F5D888; }
body[data-theme="apex"] ::selection { background: rgba(201,168,76,.30); }
body[data-theme="apex"] hr { border-color: rgba(201,168,76,.12) !important; }
body[data-theme="apex"] ::-webkit-scrollbar { width: 5px; height: 5px; }
body[data-theme="apex"] ::-webkit-scrollbar-track { background: rgba(255,255,255,.02); }
body[data-theme="apex"] ::-webkit-scrollbar-thumb { background: rgba(201,168,76,.22); border-radius: 999px; }
body[data-theme="apex"] ::-webkit-scrollbar-thumb:hover { background: rgba(201,168,76,.42); }

/* ── 28. Tabs / chips ────────────────────────────────────────────────────── */
body[data-theme="apex"] .tab { background: rgba(255,255,255,.03) !important; border-color: rgba(201,168,76,.14) !important; color: #8AAAC8 !important; border-radius: 8px !important; }
body[data-theme="apex"] .tab.active { color: #E8C46A !important; border-color: rgba(201,168,76,.42) !important; background: rgba(201,168,76,.12) !important; }
body[data-theme="apex"] .chip { background: rgba(255,255,255,.03) !important; border-color: rgba(201,168,76,.14) !important; color: #8AAAC8 !important; }
body[data-theme="apex"] .chipbtn { border-color: rgba(201,168,76,.14) !important; color: #8AAAC8 !important; }
body[data-theme="apex"] .chipbtn.on { color: #E8C46A !important; border-color: rgba(201,168,76,.45) !important; background: rgba(201,168,76,.12) !important; }

/* ── 29. Schedule / shift ────────────────────────────────────────────────── */
body[data-theme="apex"] .schx-kpi { background: rgba(255,255,255,.04) !important; border-color: rgba(201,168,76,.16) !important; color: #F0F4FF !important; }
body[data-theme="apex"] .schx-kpi.countdown.ok { border-color: rgba(16,185,129,.40) !important; background: rgba(16,185,129,.08) !important; }
body[data-theme="apex"] .schx-kpi.countdown.focus { border-color: rgba(201,168,76,.40) !important; background: rgba(201,168,76,.08) !important; }
body[data-theme="apex"] .schx-kpi.countdown.warn { border-color: rgba(245,158,11,.45) !important; background: rgba(245,158,11,.08) !important; }

/* ── 30. Dashboard ───────────────────────────────────────────────────────── */
body[data-theme="apex"] .dashx-card { background: rgba(10,22,40,.9) !important; border: 1px solid rgba(201,168,76,.14) !important; border-radius: 10px !important; }
body[data-theme="apex"] .dashx-card .k { color: #8AAAC8 !important; font-size: 11px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .06em !important; }
body[data-theme="apex"] .dashx-card .v { color: #F0F4FF !important; font-weight: 800 !important; }
body[data-theme="apex"] .dashx-card .s { color: #8AAAC8 !important; }
body[data-theme="apex"] .dashx-panel { background: rgba(10,22,40,.9) !important; border: 1px solid rgba(201,168,76,.14) !important; border-radius: 10px !important; }
body[data-theme="apex"] .dashx-title { color: #F0F4FF !important; font-weight: 800 !important; }
body[data-theme="apex"] .dashx-filter { background: rgba(255,255,255,.04) !important; border: 1px solid rgba(201,168,76,.14) !important; color: #8AAAC8 !important; border-radius: 999px !important; font-weight: 600 !important; }
body[data-theme="apex"] .dashx-filter:hover { background: rgba(201,168,76,.08) !important; color: #E8C46A !important; }
body[data-theme="apex"] .dashx-filter.active,
body[data-theme="apex"] .dashx-filter[data-active="1"] { background: rgba(201,168,76,.12) !important; border-color: rgba(201,168,76,.34) !important; color: #E8C46A !important; }
body[data-theme="apex"] .dashx-bar { background: rgba(201,168,76,.15) !important; border-radius: 999px !important; height: 5px !important; }
body[data-theme="apex"] .dashx-bar .fill { background: linear-gradient(90deg, #9a7230, #C9A84C) !important; }

/* ── 31. High-alert ──────────────────────────────────────────────────────── */
body[data-theme="apex"] .high-alert-box { background: rgba(200,30,60,.9) !important; border-color: rgba(255,255,255,.2) !important; }

/* ── 32. Mailbox / KPI bars ──────────────────────────────────────────────── */
body[data-theme="apex"] .mbx-stat-box { background: rgba(10,22,40,.9) !important; border: 1px solid rgba(201,168,76,.16) !important; border-radius: 10px !important; color: #F0F4FF !important; }
body[data-theme="apex"] .mbx-stat-box:hover { border-color: rgba(201,168,76,.38) !important; box-shadow: 0 4px 18px rgba(201,168,76,.12) !important; }
body[data-theme="apex"] .mbx-stat-lbl { color: #8AAAC8 !important; }
body[data-theme="apex"] .mbx-stat-val { color: #E8C46A !important; }
body[data-theme="apex"] .timer-display { color: #E8C46A !important; text-shadow: 0 0 18px rgba(201,168,76,.45) !important; font-family: 'IBM Plex Mono', 'JetBrains Mono', monospace !important; }
body[data-theme="apex"] .mbx-header-bar { border-bottom-color: rgba(201,168,76,.14) !important; }

/* ── 33. Theme picker ────────────────────────────────────────────────────── */
body[data-theme="apex"] .th-card { background: rgba(10,22,40,.8) !important; border: 2px solid rgba(201,168,76,.14) !important; border-radius: 10px !important; }
body[data-theme="apex"] .th-card:hover { border-color: rgba(201,168,76,.45) !important; box-shadow: 0 4px 16px rgba(201,168,76,.15) !important; }
body[data-theme="apex"] .th-card.is-active { border-color: #C9A84C !important; box-shadow: 0 0 0 3px rgba(201,168,76,.18), 0 4px 16px rgba(201,168,76,.15) !important; }
body[data-theme="apex"] .theme-lab-grid { background: rgba(10,22,40,.5) !important; border-color: rgba(201,168,76,.12) !important; }

/* ── 34. QB Page — full override ─────────────────────────────────────────── */
body[data-theme="apex"] .qb-page-shell {
  background: linear-gradient(180deg, #07101e 0%, #060d18 100%) !important;
}
body[data-theme="apex"] .qb-page-shell.qb-is-fullscreen {
  background: #060d1e !important;
}
body[data-theme="apex"] .qb-tabbar-wrap {
  background: rgba(8,17,32,.96) !important;
  border: 1px solid rgba(201,168,76,.16) !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 2px 14px rgba(0,0,0,.35) !important;
}
body[data-theme="apex"] .qb-tab-btn {
  color: #7A9AB8 !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  font-weight: 600 !important;
}
body[data-theme="apex"] .qb-tab-btn:hover {
  background: rgba(201,168,76,.09) !important;
  color: #E8C46A !important;
  border-color: rgba(201,168,76,.22) !important;
}
body[data-theme="apex"] .qb-tab-btn-active,
body[data-theme="apex"] .qb-tab-btn.qb-tab-btn-active {
  background: rgba(201,168,76,.14) !important;
  color: #E8C46A !important;
  border-color: rgba(201,168,76,.36) !important;
  font-weight: 700 !important;
  box-shadow: 0 0 0 1px rgba(201,168,76,.12) !important;
}
body[data-theme="apex"] .qb-tab-badge-live { color: #10B981 !important; font-family: 'IBM Plex Mono', monospace !important; font-weight: 700 !important; }
body[data-theme="apex"] .qb-tab-badge-cached { color: #5A7898 !important; }
body[data-theme="apex"] .qb-tab-add-btn {
  background: rgba(201,168,76,.07) !important;
  border: 1px solid rgba(201,168,76,.18) !important;
  color: #C9A84C !important;
}
body[data-theme="apex"] .qb-tab-add-btn:hover { background: rgba(201,168,76,.15) !important; color: #E8C46A !important; }
body[data-theme="apex"] .qb-fullscreen-btn { background: rgba(201,168,76,.07) !important; border: 1px solid rgba(201,168,76,.18) !important; color: #C9A84C !important; }
body[data-theme="apex"] .qb-fullscreen-btn:hover { background: rgba(201,168,76,.15) !important; color: #E8C46A !important; }

/* QB counter widgets */
body[data-theme="apex"] .qb-counter-widget {
  background: rgba(10,22,40,.9) !important;
  border: 1px solid rgba(201,168,76,.16) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.35) !important;
  backdrop-filter: blur(10px) !important;
}
body[data-theme="apex"] .qb-counter-widget:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 20px rgba(201,168,76,.14) !important; border-color: rgba(201,168,76,.32) !important; }
body[data-theme="apex"] .qb-counter-widget.is-active { border-color: rgba(201,168,76,.55) !important; box-shadow: 0 0 0 3px rgba(201,168,76,.14), 0 6px 20px rgba(201,168,76,.12) !important; }
body[data-theme="apex"] .qb-counter-label { color: #8AAAC8 !important; font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .08em !important; }
body[data-theme="apex"] .qb-counter-value { color: #E8C46A !important; font-family: 'IBM Plex Mono', 'JetBrains Mono', monospace !important; font-weight: 700 !important; }
body[data-theme="apex"] .qb-counter-rows { color: #5A7898 !important; }

/* QB table card */
body[data-theme="apex"] .qb-table-card {
  background: rgba(10,22,40,.9) !important;
  border: 1px solid rgba(201,168,76,.14) !important;
  box-shadow: 0 2px 14px rgba(0,0,0,.4) !important;
}
body[data-theme="apex"] .qb-table-head {
  background: linear-gradient(180deg, rgba(14,31,58,.98), rgba(10,24,44,.98)) !important;
  border-bottom: 1px solid rgba(201,168,76,.18) !important;
}
body[data-theme="apex"] .qb-table-title { color: #F0F4FF !important; font-weight: 800 !important; letter-spacing: .02em !important; }
body[data-theme="apex"] .qb-instance-title { color: #F0F4FF !important; font-weight: 800 !important; }
body[data-theme="apex"] .qb-instance-sub { color: #8AAAC8 !important; }
body[data-theme="apex"] .qb-meta-text { color: #8AAAC8 !important; }
body[data-theme="apex"] .qb-fresh-badge { color: #10B981 !important; background: rgba(16,185,129,.10) !important; border-color: rgba(16,185,129,.24) !important; }
body[data-theme="apex"] .qb-cache-badge { color: #5A7898 !important; background: rgba(90,120,152,.07) !important; border-color: rgba(90,120,152,.14) !important; }
body[data-theme="apex"] .qb-scope-count { color: #C9A84C !important; font-weight: 700 !important; }

/* QB data table */
body[data-theme="apex"] .qb-data-table thead th {
  background: linear-gradient(180deg, #0e1e38, #0b1830) !important;
  background-image: none !important;
  border-bottom: 2px solid rgba(201,168,76,.22) !important;
  box-shadow: none !important;
  color: #C9A84C !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
body[data-theme="apex"] .qb-data-table thead th:hover { background: rgba(201,168,76,.08) !important; color: #E8C46A !important; }
body[data-theme="apex"] .qb-data-table tbody tr { border-bottom: 1px solid rgba(201,168,76,.07) !important; }
body[data-theme="apex"] .qb-data-table tbody tr:nth-child(even) { background: rgba(255,255,255,.018) !important; }
body[data-theme="apex"] .qb-data-table tbody tr:hover { background: rgba(201,168,76,.05) !important; }
body[data-theme="apex"] .qb-data-table td { color: #C8D8F0 !important; }

/* QB case ID — IBM Plex Mono gold */
body[data-theme="apex"] .qb-case-id {
  color: #E8C46A !important;
  font-family: 'IBM Plex Mono', 'JetBrains Mono', monospace !important;
  font-weight: 700 !important;
  letter-spacing: .03em !important;
}

/* QB row number */
body[data-theme="apex"] .qb-row-num-th { background: linear-gradient(180deg, #0e1e38, #0b1830) !important; background-image: none !important; color: rgba(201,168,76,.45) !important; border-right: 1px solid rgba(201,168,76,.12) !important; }
body[data-theme="apex"] .qb-row-num-cell { background: rgba(6,13,30,.95) !important; border-right: 1px solid rgba(201,168,76,.07) !important; }
body[data-theme="apex"] .qb-row-num-pill { background: rgba(201,168,76,.05) !important; border: 1px solid rgba(201,168,76,.12) !important; color: rgba(201,168,76,.45) !important; }
body[data-theme="apex"] .qb-data-table tbody tr:hover .qb-row-num-pill { background: rgba(201,168,76,.14) !important; border-color: rgba(201,168,76,.32) !important; color: #E8C46A !important; }

/* QB search */
body[data-theme="apex"] .qb-search-input { background: rgba(255,255,255,.05) !important; border: 1px solid rgba(201,168,76,.18) !important; color: #F0F4FF !important; border-radius: 8px !important; }
body[data-theme="apex"] .qb-search-input:focus { border-color: rgba(201,168,76,.55) !important; box-shadow: 0 0 0 3px rgba(201,168,76,.12) !important; }
body[data-theme="apex"] .qb-search-input::placeholder { color: #4a6888 !important; }
body[data-theme="apex"] .qb-search-input.qb-search-scoped { border-color: rgba(201,168,76,.45) !important; background: rgba(201,168,76,.05) !important; }
body[data-theme="apex"] .qb-search-ico { color: #5A7898 !important; }
body[data-theme="apex"] .qb-scope-ico { color: #C9A84C !important; }
body[data-theme="apex"] .qb-scope-lbl { color: #C9A84C !important; }
body[data-theme="apex"] .qb-search-scope-tag { background: rgba(201,168,76,.07) !important; border: 1px solid rgba(201,168,76,.18) !important; color: #8AAAC8 !important; }

/* QB header card */
body[data-theme="apex"] .qb-header-card {
  background: rgba(10,22,40,.9) !important;
  border: 1px solid rgba(201,168,76,.14) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.35) !important;
}
body[data-theme="apex"] .qb-header-actions .qb-btn {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(201,168,76,.18) !important;
  color: #C8D8F0 !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
}
body[data-theme="apex"] .qb-header-actions .qb-btn:hover { background: rgba(201,168,76,.12) !important; color: #E8C46A !important; border-color: rgba(201,168,76,.34) !important; }
body[data-theme="apex"] .qb-btn-primary { background: linear-gradient(135deg, #9a7230, #C9A84C) !important; border-color: rgba(232,196,106,.5) !important; color: #fff !important; box-shadow: 0 3px 14px rgba(201,168,76,.28) !important; }

/* QB status chips */
body[data-theme="apex"] .qb-status-badge {
  font-family: 'IBM Plex Mono', 'JetBrains Mono', monospace !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: .04em !important;
  border-radius: 6px !important;
  padding: 3px 8px !important;
}
/* QB col card (card view) */
body[data-theme="apex"] .qb-col-card {
  background: rgba(10,22,40,.92) !important;
  border: 1px solid rgba(201,168,76,.14) !important;
  border-radius: 10px !important;
  box-shadow: 0 3px 16px rgba(0,0,0,.42) !important;
  transition: border-color .15s, box-shadow .15s !important;
}
body[data-theme="apex"] .qb-col-card:hover { border-color: rgba(201,168,76,.34) !important; box-shadow: 0 6px 24px rgba(201,168,76,.10) !important; }

/* QB modal */
body[data-theme="apex"] .qb-modal-panel {
  background: linear-gradient(145deg, #0a1525, #0d1e38) !important;
  border: 1px solid rgba(201,168,76,.22) !important;
  box-shadow: 0 32px 80px rgba(0,0,0,.72) !important;
  border-radius: 14px !important;
}
body[data-theme="apex"] .qb-modal-header { border-bottom: 1px solid rgba(201,168,76,.14) !important; }
body[data-theme="apex"] .qb-modal-title { color: #F0F4FF !important; font-weight: 800 !important; }
body[data-theme="apex"] .qb-modal-sub { color: #8AAAC8 !important; }
body[data-theme="apex"] .qb-modal-footer { border-top: 1px solid rgba(201,168,76,.12) !important; }
body[data-theme="apex"] .qb-modal-tab { color: #8AAAC8 !important; border: 1px solid transparent !important; }
body[data-theme="apex"] .qb-modal-tab.active { color: #E8C46A !important; border-color: rgba(201,168,76,.30) !important; background: rgba(201,168,76,.10) !important; }
body[data-theme="apex"] .qb-section-title { color: #F0F4FF !important; font-weight: 700 !important; }
body[data-theme="apex"] .qb-section-num { color: #C9A84C !important; font-family: 'IBM Plex Mono', monospace !important; font-weight: 700 !important; }
body[data-theme="apex"] .qb-field-label { color: #8AAAC8 !important; font-weight: 600 !important; }
body[data-theme="apex"] .qb-field-input { background: rgba(255,255,255,.05) !important; border-color: rgba(201,168,76,.18) !important; color: #F0F4FF !important; }
body[data-theme="apex"] .qb-field-input:focus { border-color: rgba(201,168,76,.55) !important; box-shadow: 0 0 0 3px rgba(201,168,76,.12) !important; }
body[data-theme="apex"] .qb-field-readonly { background: rgba(255,255,255,.03) !important; color: #8AAAC8 !important; border-color: rgba(201,168,76,.10) !important; }
body[data-theme="apex"] .qb-field-hint { color: #5A7898 !important; }

/* QB settings modal */
body[data-theme="apex"] #qbSettingsModal { background: rgba(6,13,30,.8) !important; backdrop-filter: blur(14px) !important; }

/* QB columns scroll */
body[data-theme="apex"] .qb-columns-scroll::-webkit-scrollbar-thumb { background: rgba(201,168,76,.25) !important; }
body[data-theme="apex"] .qb-data-body .qb-table-inner::-webkit-scrollbar-track { background: rgba(255,255,255,.02) !important; }
body[data-theme="apex"] .qb-data-body .qb-table-inner::-webkit-scrollbar-thumb { background: rgba(201,168,76,.22) !important; }
body[data-theme="apex"] .qb-data-body .qb-table-inner::-webkit-scrollbar-thumb:hover { background: rgba(201,168,76,.42) !important; }

/* ── 35. Status widgets (distribution page) ──────────────────────────────── */
body[data-theme="apex"] .status-widget-tile { background: rgba(10,22,40,.9) !important; border: 1px solid rgba(201,168,76,.14) !important; }
body[data-theme="apex"] .status-widget-tile:hover { border-color: rgba(201,168,76,.30) !important; }
body[data-theme="apex"] .status-widget-tile.is-active { border-color: rgba(201,168,76,.52) !important; background: rgba(201,168,76,.08) !important; }
body[data-theme="apex"] .status-widget-title { color: #F0F4FF !important; }
body[data-theme="apex"] .status-widget-sub { color: #8AAAC8 !important; }

/* ── 36. Reminders page ──────────────────────────────────────────────────── */
body[data-theme="apex"] .reminders-stat-card,
body[data-theme="apex"] .stat-mini-card { background: rgba(10,22,40,.9) !important; border: 1px solid rgba(201,168,76,.14) !important; border-radius: 10px !important; }
body[data-theme="apex"] .reminders-stat-card .stat-val { color: #E8C46A !important; font-weight: 800 !important; }
body[data-theme="apex"] .reminders-stat-card .stat-lbl { color: #8AAAC8 !important; }
body[data-theme="apex"] .rem-row, body[data-theme="apex"] .reminder-row { background: rgba(10,22,40,.8) !important; border-bottom: 1px solid rgba(201,168,76,.07) !important; color: #C8D8F0 !important; }
body[data-theme="apex"] .rem-row:hover, body[data-theme="apex"] .reminder-row:hover { background: rgba(201,168,76,.05) !important; }

/* ── 37. Right panel tabs ────────────────────────────────────────────────── */
body[data-theme="apex"] .rtabs { background: rgba(255,255,255,.04) !important; border: 1px solid rgba(201,168,76,.14) !important; border-radius: 8px !important; }
body[data-theme="apex"] .rtab { color: #8AAAC8 !important; font-weight: 700 !important; border-radius: 6px !important; }
body[data-theme="apex"] .rtab:hover { background: rgba(201,168,76,.08) !important; color: #E8C46A !important; }
body[data-theme="apex"] .rtab.active { background: rgba(201,168,76,.14) !important; color: #E8C46A !important; border: 1px solid rgba(201,168,76,.28) !important; }

/* ── 38. Btn-glass variants ──────────────────────────────────────────────── */
body[data-theme="apex"] .btn-glass-primary { background: linear-gradient(145deg, #9a7230, #C9A84C) !important; color: #fff !important; border: 1px solid rgba(201,168,76,.45) !important; box-shadow: 0 4px 14px rgba(201,168,76,.28) !important; }
body[data-theme="apex"] .btn-glass-ghost { background: rgba(201,168,76,.06) !important; color: #E8C46A !important; border: 1px solid rgba(201,168,76,.20) !important; }
body[data-theme="apex"] .btn-glass-ghost:hover { background: rgba(201,168,76,.12) !important; border-color: rgba(201,168,76,.35) !important; }

/* ── 39. Controller lab / support btns ───────────────────────────────────── */
body[data-theme="apex"] #btn-controller-lab { background: rgba(201,168,76,.06) !important; border: 1px solid rgba(201,168,76,.20) !important; color: #E8C46A !important; border-radius: 8px !important; }
body[data-theme="apex"] #btn-controller-lab:hover { background: rgba(201,168,76,.12) !important; border-color: rgba(201,168,76,.38) !important; }

/* ── 40. Duty pills ──────────────────────────────────────────────────────── */
body[data-theme="apex"] .duty-pill[data-tone="idle"]    { background: rgba(90,120,152,.10) !important; color: #8AAAC8 !important; border: 1px solid rgba(90,120,152,.22) !important; }
body[data-theme="apex"] .duty-pill[data-tone="active"]  { background: rgba(16,185,129,.12) !important; color: #6EF0B8 !important; border: 1px solid rgba(16,185,129,.28) !important; }
body[data-theme="apex"] .duty-pill[data-tone="manager"] { background: rgba(201,168,76,.12) !important; color: #E8C46A !important; border: 1px solid rgba(201,168,76,.28) !important; }
body[data-theme="apex"] .duty-pill[data-tone="call"]    { background: rgba(245,158,11,.12) !important; color: #FDDFA0 !important; border: 1px solid rgba(245,158,11,.28) !important; }
body[data-theme="apex"] .duty-pill[data-tone="break"]   { background: rgba(255,59,78,.10) !important; color: #FFB0BA !important; border: 1px solid rgba(255,59,78,.24) !important; }


/* ═══════════════════════════════════════════════════════════════════════════════
   NEXUS THEME — Tactical Dark Glass / High-Contrast Command Platform
   Theme ID : nexus  |  mode : dark
   ─────────────────────────────────────────────────────────────────────────────
   Palette Strategy:
     PRIMARY BG:   Tactical slate #0b1220 — dark slate, distinct from pure navy
     PANELS:       #101a2c / #152338  — layered glass surfaces
     ACCENT:       #00D4FF Cyan       — electric command signal
     TEXT:         #E2EAF8 / #6B8EAE — readable, military-grade contrast
     BORDERS:      Cyan-glass tint    — rgba(0,212,255,.12)
     FONT:         Syne (display) + Outfit (body) — geometric tactical
   RULES: Aesthetic overrides ONLY. Never touch structural layout.
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ── 0. Root token overrides ─────────────────────────────────────────────── */
body[data-theme="nexus"] {
  --bg:            #0b1220;
  --bg2:           #0d1525;
  --panel:         #101a2c;
  --panel2:        #152338;
  --border:        rgba(0,212,255,.12);
  --border2:       rgba(0,212,255,.22);
  --text:          #E2EAF8;
  --muted:         #6B8EAE;
  --muted2:        #4A6888;
  --primary:       #00D4FF;
  --primary2:      #00B8E6;
  --danger:        #FF4560;
  --warn:          #FFAA00;
  --ok:            #00E5A0;
  --accent:        #00D4FF;
  --accent-rgb:    0,212,255;
  --shadow:        0 8px 32px rgba(0,0,0,.58);
  --shadow2:       0 2px 12px rgba(0,0,0,.44);
  --focus:         0 0 0 3px rgba(0,212,255,.20);
  --radius:        8px;
  --radius2:       6px;
  --font:          'Syne', 'Outfit', ui-sans-serif, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  --surface-0:     #0b1220;
  --surface-1:     #101a2c;
  --surface-2:     #152338;
  --text-0:        #E2EAF8;
  --text-muted:    #6B8EAE;
  --border-0:      rgba(0,212,255,.12);
  color-scheme: dark;
  color: #E2EAF8;
}

/* ── 1. Body / background ────────────────────────────────────────────────── */
body[data-theme="nexus"] {
  background:
    radial-gradient(ellipse 60% 38% at 10% 5%,  rgba(0,212,255,.07) 0%, transparent 52%),
    radial-gradient(ellipse 50% 30% at 90% 92%,  rgba(0,180,220,.06) 0%, transparent 48%),
    radial-gradient(ellipse 35% 25% at 68% 15%,  rgba(80,140,255,.05) 0%, transparent 42%),
    linear-gradient(170deg, #0b1220 0%, #0c1422 55%, #09101e 100%);
}

/* ── 2. App grid ─────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .app {
  gap: 10px;
  padding-top: 10px;
  padding-left: 10px;
  padding-right: 10px;
}

/* ── 3. Cards ────────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .card {
  background: linear-gradient(155deg, rgba(255,255,255,.045) 0%, rgba(255,255,255,.015) 100%) !important;
  border: 1px solid rgba(0,212,255,.10) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,.48), inset 0 1px 0 rgba(0,212,255,.06) !important;
  backdrop-filter: blur(8px) !important;
}

/* ── 4. Topbar ───────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .topbar {
  background: rgba(11,18,34,.96) !important;
  border: 1px solid rgba(0,212,255,.12) !important;
  backdrop-filter: blur(14px) !important;
  position: relative;
}
body[data-theme="nexus"] .topbar::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(0,212,255,.45) 20%,
    rgba(0,230,255,.75) 48%,
    rgba(0,212,255,.50) 72%,
    transparent 100%);
  pointer-events: none;
}

/* ── 5. Brand ────────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .topbrand { background: rgba(0,212,255,.06) !important; border-color: rgba(0,212,255,.16) !important; }
body[data-theme="nexus"] .brand-name {
  color: #E2EAF8;
  font-weight: 900;
  font-family: 'Syne', ui-sans-serif !important;
  letter-spacing: .08em;
  text-shadow: 0 0 18px rgba(0,212,255,.35), 0 0 38px rgba(0,212,255,.12);
}
body[data-theme="nexus"] .brand-sub { color: #6B8EAE; letter-spacing: .1em; text-transform: uppercase; font-size: 9.5px; font-weight: 700; }
body[data-theme="nexus"] .brand-mark {
  background: linear-gradient(135deg, #00a0cc, #00D4FF) !important;
  box-shadow: 0 0 20px rgba(0,212,255,.52), 0 4px 14px rgba(0,0,0,.4) !important;
  border-radius: 8px !important;
}
body[data-theme="nexus"] .brand-mark::after { color: #fff !important; font-weight: 900; }

/* ── 6. Global Search ────────────────────────────────────────────────────── */
body[data-theme="nexus"] .top-global-search { background: rgba(255,255,255,.045) !important; border: 1px solid rgba(0,212,255,.14) !important; border-radius: 6px !important; backdrop-filter: blur(8px) !important; }
body[data-theme="nexus"] .top-global-search:focus-within { border-color: rgba(0,212,255,.50) !important; box-shadow: 0 0 0 3px rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] #globalSearchInput { color: #E2EAF8 !important; background: transparent !important; font-family: 'Outfit', ui-sans-serif !important; }
body[data-theme="nexus"] #globalSearchInput::placeholder { color: #4A6888 !important; }

/* ── 7. Topbar icon buttons ──────────────────────────────────────────────── */
body[data-theme="nexus"] .btn.ghost.iconbtn { background: rgba(0,212,255,.07) !important; border-color: rgba(0,212,255,.16) !important; color: #00D4FF !important; }
body[data-theme="nexus"] .btn.ghost.iconbtn:hover { background: rgba(0,212,255,.15) !important; border-color: rgba(0,230,255,.38) !important; color: #60E8FF !important; box-shadow: 0 0 14px rgba(0,212,255,.20) !important; }

/* ── 8. Logout ───────────────────────────────────────────────────────────── */
body[data-theme="nexus"] #logoutBtn { background: rgba(255,69,96,.10) !important; border-color: rgba(255,69,96,.28) !important; color: #ffb3be !important; font-weight: 700 !important; }
body[data-theme="nexus"] #logoutBtn:hover { background: rgba(255,69,96,.20) !important; border-color: rgba(255,69,96,.45) !important; box-shadow: 0 4px 16px rgba(255,69,96,.24) !important; }

/* ── 9. Sync status ──────────────────────────────────────────────────────── */
body[data-theme="nexus"] .sync-status { background: rgba(0,229,160,.10) !important; border: 1px solid rgba(0,229,160,.26) !important; color: #00E5A0 !important; }
body[data-theme="nexus"] .sync-status .dot { background: #00E5A0 !important; box-shadow: 0 0 8px rgba(0,229,160,.75) !important; }
body[data-theme="nexus"] .sync-status.poll .dot { background: #FFAA00 !important; box-shadow: 0 0 8px rgba(255,170,0,.7) !important; }
body[data-theme="nexus"] .sync-status.off  .dot { background: #FF4560 !important; box-shadow: 0 0 8px rgba(255,69,96,.7) !important; }

/* ── 10. Left Sidebar ────────────────────────────────────────────────────── */
body[data-theme="nexus"] aside.side {
  background: rgba(11,18,32,.97) !important;
  border-color: rgba(0,212,255,.12) !important;
  box-shadow: 2px 0 20px rgba(0,0,0,.45) !important;
  backdrop-filter: blur(10px) !important;
}
body[data-theme="nexus"] .nav-section-label,
body[data-theme="nexus"] .nav-label {
  color: #4A7090 !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
  font-family: 'Syne', ui-sans-serif !important;
}
body[data-theme="nexus"] .nav a,
body[data-theme="nexus"] .nav .nav-item,
body[data-theme="nexus"] .nav .nav-group-head {
  color: #A8C8E0 !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border: 1px solid transparent !important;
  letter-spacing: .02em !important;
  font-family: 'Outfit', ui-sans-serif !important;
}
body[data-theme="nexus"] .nav a:hover,
body[data-theme="nexus"] .nav .nav-item:hover,
body[data-theme="nexus"] .nav .nav-group-head:hover {
  background: rgba(0,212,255,.09) !important;
  color: #E2EAF8 !important;
  border-color: rgba(0,212,255,.20) !important;
}
body[data-theme="nexus"] .nav a.active,
body[data-theme="nexus"] .nav .nav-item.active {
  background: linear-gradient(90deg, rgba(0,212,255,.18) 0%, rgba(0,212,255,.06) 100%) !important;
  border-color: rgba(0,212,255,.35) !important;
  color: #60E8FF !important;
  font-weight: 700 !important;
}
body[data-theme="nexus"] .nav a.active::before,
body[data-theme="nexus"] .nav .nav-item.active::before {
  content: '';
  position: absolute;
  left: 0; top: 20%; bottom: 20%;
  width: 2px;
  border-radius: 0 2px 2px 0;
  background: #00D4FF;
  box-shadow: 0 0 10px rgba(0,212,255,.85), 0 0 22px rgba(0,212,255,.30);
}
body[data-theme="nexus"] .nav-item.nav-subitem { color: #6B8EAE !important; font-size: 12.5px !important; }
body[data-theme="nexus"] .nav-item.nav-subitem:hover { color: #E2EAF8 !important; background: rgba(0,212,255,.07) !important; }
body[data-theme="nexus"] .nav-item.nav-subitem.active { color: #60E8FF !important; background: rgba(0,212,255,.12) !important; }
body[data-theme="nexus"] .nav-group.is-record-group .nav-group-kids::before { background: rgba(0,212,255,.22) !important; }

/* ── 11. Sidebar profile ─────────────────────────────────────────────────── */
body[data-theme="nexus"] .usercard { background: transparent !important; }
body[data-theme="nexus"] .sp-name-strong, body[data-theme="nexus"] .uc-name { color: #E2EAF8 !important; font-weight: 800 !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .sp-meta-subtitle, body[data-theme="nexus"] .sp-shift, body[data-theme="nexus"] .sp-team, body[data-theme="nexus"] .uc-meta { color: #6B8EAE !important; }
body[data-theme="nexus"] .sp-photo, body[data-theme="nexus"] .sp-photo-sm { border-color: rgba(0,212,255,.35) !important; background: rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] .sp-photo .initials, body[data-theme="nexus"] .sp-photo-sm .initials { color: #00D4FF !important; }
body[data-theme="nexus"] .sp-presence-dot.is-active { background: #00E5A0 !important; box-shadow: 0 0 8px rgba(0,229,160,.7) !important; }
body[data-theme="nexus"] .sp-position { background: rgba(0,212,255,.10) !important; border-color: rgba(0,212,255,.28) !important; color: #60E8FF !important; }

/* ── 12. Activity log ────────────────────────────────────────────────────── */
body[data-theme="nexus"] .logline { color: #6B8EAE !important; }
body[data-theme="nexus"] .logline .m { color: #A8C8E0 !important; }
body[data-theme="nexus"] .logline .tl-dot { background: rgba(0,212,255,.65) !important; box-shadow: 0 0 6px rgba(0,212,255,.42) !important; }
body[data-theme="nexus"] .logline .tl-dot::after { background: rgba(0,212,255,.14) !important; }

/* ── 13. Right sidebar ───────────────────────────────────────────────────── */
body[data-theme="nexus"] aside.right { background: rgba(11,18,32,.97) !important; border-color: rgba(0,212,255,.10) !important; backdrop-filter: blur(10px) !important; }

/* ── 14. Main content ────────────────────────────────────────────────────── */
body[data-theme="nexus"] .main.card, body[data-theme="nexus"] main.main {
  background: rgba(11,18,32,.95) !important;
  border-color: rgba(0,212,255,.08) !important;
}

/* ── 15. Announce bar ────────────────────────────────────────────────────── */
body[data-theme="nexus"] .announce-bar { background: rgba(255,255,255,.025) !important; border: 1px solid rgba(0,212,255,.12) !important; border-radius: 8px !important; border-left: 2px solid #00D4FF !important; }
body[data-theme="nexus"] .announce-bar:hover { background: rgba(0,212,255,.05) !important; border-left-color: #60E8FF !important; }
body[data-theme="nexus"] .announce-bar::before { display: none !important; }
body[data-theme="nexus"] .announce-who { color: #00D4FF !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .06em !important; font-size: 10px !important; }
body[data-theme="nexus"] .announce-title { color: #E2EAF8 !important; font-weight: 800 !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .announce-msg { color: #6B8EAE !important; }

/* ── 16. Reminder cards ──────────────────────────────────────────────────── */
body[data-theme="nexus"] .reminder-card { background: rgba(11,18,32,.95) !important; border: 1px solid rgba(0,212,255,.16) !important; box-shadow: 0 8px 28px rgba(0,0,0,.45) !important; backdrop-filter: blur(16px) !important; }
body[data-theme="nexus"] .reminder-card.my { border-color: rgba(0,229,160,.32) !important; background: linear-gradient(135deg, rgba(0,229,160,.06), rgba(0,212,255,.03)) !important; }
body[data-theme="nexus"] .reminder-card.team { border-color: rgba(255,69,96,.30) !important; background: linear-gradient(135deg, rgba(255,69,96,.06), rgba(255,170,0,.03)) !important; }
body[data-theme="nexus"] .reminder-card .rc-title { color: #E2EAF8 !important; font-weight: 700 !important; }
body[data-theme="nexus"] .reminder-card .rc-meta { color: #6B8EAE !important; }

/* ── 17. Buttons ─────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .btn { background: linear-gradient(155deg, rgba(255,255,255,.06), rgba(255,255,255,.018)) !important; border-color: rgba(0,212,255,.16) !important; color: #E2EAF8 !important; border-radius: 6px !important; box-shadow: 0 2px 8px rgba(0,0,0,.28) !important; font-weight: 600 !important; font-family: 'Outfit', ui-sans-serif !important; }
body[data-theme="nexus"] .btn:hover { background: rgba(0,212,255,.09) !important; border-color: rgba(0,212,255,.30) !important; }
body[data-theme="nexus"] .btn.primary { background: linear-gradient(135deg, #0090bb, #00D4FF) !important; border-color: rgba(0,230,255,.52) !important; color: #fff !important; box-shadow: 0 4px 18px rgba(0,212,255,.28) !important; }
body[data-theme="nexus"] .btn.primary:hover { box-shadow: 0 6px 24px rgba(0,212,255,.42) !important; transform: translateY(-1px); }
body[data-theme="nexus"] .btn.danger { background: linear-gradient(135deg, rgba(200,30,55,.7), rgba(170,20,40,.6)) !important; border-color: rgba(255,69,96,.42) !important; color: #ffcece !important; }
body[data-theme="nexus"] .btn.ghost { background: transparent !important; box-shadow: none !important; }
body[data-theme="nexus"] .btn.tiny { box-shadow: none !important; }

/* ── 18. Inputs ──────────────────────────────────────────────────────────── */
body[data-theme="nexus"] input,
body[data-theme="nexus"] select,
body[data-theme="nexus"] textarea,
body[data-theme="nexus"] .input { background: rgba(255,255,255,.048) !important; border: 1px solid rgba(0,212,255,.14) !important; color: #E2EAF8 !important; border-radius: 6px !important; }
body[data-theme="nexus"] input:focus,
body[data-theme="nexus"] select:focus,
body[data-theme="nexus"] textarea:focus,
body[data-theme="nexus"] .input:focus { border-color: rgba(0,212,255,.52) !important; box-shadow: 0 0 0 3px rgba(0,212,255,.10) !important; background: rgba(255,255,255,.06) !important; }
body[data-theme="nexus"] input::placeholder, body[data-theme="nexus"] textarea::placeholder { color: #3A5878 !important; }
body[data-theme="nexus"] select option { background: #101a2c; color: #E2EAF8; }

/* ── 19. Tables ──────────────────────────────────────────────────────────── */
body[data-theme="nexus"] th { background: rgba(0,212,255,.06) !important; color: #00D4FF !important; font-size: 10px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: .10em !important; border-bottom: 1px solid rgba(0,212,255,.18) !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] td { border-bottom: 1px solid rgba(0,212,255,.06) !important; color: #A8C8E0 !important; }
body[data-theme="nexus"] tr:hover td { background: rgba(0,212,255,.04) !important; }

/* ── 20. Modals ──────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .modal { background: rgba(0,0,0,.80) !important; backdrop-filter: blur(16px) !important; }
body[data-theme="nexus"] .modal .panel { background: linear-gradient(145deg, rgba(16,26,44,.98), rgba(21,35,56,.98)) !important; border: 1px solid rgba(0,212,255,.20) !important; box-shadow: 0 32px 80px rgba(0,0,0,.72), 0 0 0 1px rgba(0,212,255,.05) !important; border-radius: 12px !important; }
body[data-theme="nexus"] .modal .head { border-bottom: 1px solid rgba(0,212,255,.12) !important; }
body[data-theme="nexus"] .popover, body[data-theme="nexus"] .role-picker { background: rgba(16,26,44,.98) !important; border: 1px solid rgba(0,212,255,.20) !important; box-shadow: 0 20px 50px rgba(0,0,0,.68) !important; color: #E2EAF8 !important; }

/* ── 21. Notification popout ─────────────────────────────────────────────── */
body[data-theme="nexus"] .notification-popout { background: linear-gradient(145deg, rgba(16,26,44,.98), rgba(21,35,56,.98)) !important; border: 1px solid rgba(0,212,255,.18) !important; border-radius: 12px !important; box-shadow: 0 24px 60px rgba(0,0,0,.65), 0 0 30px rgba(0,212,255,.06) !important; backdrop-filter: blur(20px) !important; }
body[data-theme="nexus"] .notification-popout .notif-item { border-radius: 6px !important; border: 1px solid rgba(0,212,255,.07) !important; }
body[data-theme="nexus"] .notification-popout .notif-item:hover { background: rgba(0,212,255,.06) !important; border-color: rgba(0,212,255,.18) !important; }
body[data-theme="nexus"] .notification-popout .notif-item.unread { border-left: 2px solid #00D4FF !important; background: rgba(0,212,255,.05) !important; }
body[data-theme="nexus"] .notif-item-title { color: #E2EAF8 !important; font-weight: 700 !important; }
body[data-theme="nexus"] .notif-item-body { color: #6B8EAE !important; }
body[data-theme="nexus"] .dashx-notif { background: rgba(11,18,32,.92) !important; border: 1px solid rgba(0,212,255,.12) !important; }
body[data-theme="nexus"] .dashx-notif.unread { border-color: rgba(0,212,255,.44) !important; background: rgba(0,212,255,.05) !important; }

/* ── 22. Badges ──────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .badge { background: rgba(255,255,255,.04) !important; border-color: rgba(0,212,255,.16) !important; color: #A8C8E0 !important; }
body[data-theme="nexus"] .badge.ok { background: rgba(0,229,160,.11) !important; border-color: rgba(0,229,160,.28) !important; color: #60F0C0 !important; }
body[data-theme="nexus"] .badge.danger { background: rgba(255,69,96,.11) !important; border-color: rgba(255,69,96,.26) !important; color: #FFB0BA !important; }
body[data-theme="nexus"] .badge.warn { background: rgba(255,170,0,.11) !important; border-color: rgba(255,170,0,.26) !important; color: #FFDA80 !important; }
body[data-theme="nexus"] .badge.info { background: rgba(0,212,255,.11) !important; border-color: rgba(0,212,255,.26) !important; color: #60E8FF !important; }
body[data-theme="nexus"] .pill { background: rgba(0,212,255,.10) !important; border: 1px solid rgba(0,212,255,.24) !important; color: #60E8FF !important; border-radius: 4px !important; font-weight: 700 !important; }

/* ── 23. Online bar ──────────────────────────────────────────────────────── */
body[data-theme="nexus"] .online-users-bar { background: linear-gradient(180deg, rgba(11,18,32,0) 0%, rgba(11,18,32,.90) 50%, rgba(9,14,25,.97) 100%) !important; border-top: 1px solid rgba(0,212,255,.10) !important; backdrop-filter: blur(14px) !important; }
body[data-theme="nexus"] .onlinebar-sec { background: rgba(255,255,255,.025) !important; border: 1px solid rgba(0,212,255,.10) !important; border-radius: 6px !important; }
body[data-theme="nexus"] .onlinebar-title { color: #3A5878 !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: .12em !important; text-transform: uppercase !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .onlinebar-count { color: #6B8EAE !important; }
body[data-theme="nexus"] .online-pill { border: 1.5px solid rgba(0,229,160,.60) !important; background: rgba(255,255,255,.04) !important; }
body[data-theme="nexus"] .online-pill.is-red { border-color: rgba(255,69,96,.75) !important; }
body[data-theme="nexus"] .online-pill .ini { color: #E2EAF8 !important; }

/* ── 24. Quicklinks dock ─────────────────────────────────────────────────── */
body[data-theme="nexus"] .quicklinks-bar { background: linear-gradient(180deg, rgba(11,18,32,.55) 0%, rgba(8,12,22,.97) 100%) !important; border-top: 1px solid rgba(0,212,255,.10) !important; backdrop-filter: blur(20px) !important; }
body[data-theme="nexus"] .qcircle { background: rgba(0,212,255,.07) !important; border: 1px solid rgba(0,212,255,.18) !important; }
body[data-theme="nexus"] .qcircle:hover { background: rgba(0,212,255,.18) !important; border-color: rgba(0,212,255,.40) !important; box-shadow: 0 0 18px rgba(0,212,255,.28) !important; transform: translateY(-2px); }
body[data-theme="nexus"] .qcircle .qtxt { color: #E2EAF8 !important; }
body[data-theme="nexus"] .qlabel { color: #6B8EAE !important; font-size: 9px !important; }

/* ── 25. World clocks ────────────────────────────────────────────────────── */
body[data-theme="nexus"] .wclock { background: rgba(0,212,255,.06) !important; border: 1px solid rgba(0,212,255,.14) !important; border-radius: 6px !important; }
body[data-theme="nexus"] .wclock .wc-label { color: #6B8EAE !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: .10em !important; text-transform: uppercase !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .wclock .wc-h,
body[data-theme="nexus"] .wclock .wc-m { color: #60E8FF !important; font-weight: 700 !important; font-family: 'JetBrains Mono', monospace !important; }
body[data-theme="nexus"] .wclock .wc-sec { color: #4A6888 !important; font-family: 'JetBrains Mono', monospace !important; }

/* ── 26. General ──────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .small, body[data-theme="nexus"] .muted { color: #6B8EAE !important; }
body[data-theme="nexus"] .section-title { color: #E2EAF8 !important; }
body[data-theme="nexus"] a { color: #60E8FF; }
body[data-theme="nexus"] a:hover { color: #A0F0FF; }
body[data-theme="nexus"] ::selection { background: rgba(0,212,255,.28); }
body[data-theme="nexus"] hr { border-color: rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] ::-webkit-scrollbar { width: 5px; height: 5px; }
body[data-theme="nexus"] ::-webkit-scrollbar-track { background: rgba(255,255,255,.02); }
body[data-theme="nexus"] ::-webkit-scrollbar-thumb { background: rgba(0,212,255,.18); border-radius: 999px; }
body[data-theme="nexus"] ::-webkit-scrollbar-thumb:hover { background: rgba(0,212,255,.38); }

/* ── 27. Tabs / chips ────────────────────────────────────────────────────── */
body[data-theme="nexus"] .tab { background: rgba(255,255,255,.025) !important; border-color: rgba(0,212,255,.12) !important; color: #6B8EAE !important; border-radius: 6px !important; }
body[data-theme="nexus"] .tab.active { color: #60E8FF !important; border-color: rgba(0,212,255,.40) !important; background: rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] .chip { background: rgba(255,255,255,.025) !important; border-color: rgba(0,212,255,.12) !important; color: #6B8EAE !important; }
body[data-theme="nexus"] .chipbtn { border-color: rgba(0,212,255,.12) !important; color: #6B8EAE !important; }
body[data-theme="nexus"] .chipbtn.on { color: #60E8FF !important; border-color: rgba(0,212,255,.42) !important; background: rgba(0,212,255,.10) !important; }

/* ── 28. Schedule ────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .schx-kpi { background: rgba(255,255,255,.035) !important; border-color: rgba(0,212,255,.14) !important; color: #E2EAF8 !important; }
body[data-theme="nexus"] .schx-kpi.countdown.ok { border-color: rgba(0,229,160,.38) !important; background: rgba(0,229,160,.07) !important; }
body[data-theme="nexus"] .schx-kpi.countdown.focus { border-color: rgba(0,212,255,.38) !important; background: rgba(0,212,255,.07) !important; }
body[data-theme="nexus"] .schx-kpi.countdown.warn { border-color: rgba(255,170,0,.42) !important; background: rgba(255,170,0,.07) !important; }

/* ── 29. Dashboard ───────────────────────────────────────────────────────── */
body[data-theme="nexus"] .dashx-card { background: rgba(16,26,44,.92) !important; border: 1px solid rgba(0,212,255,.12) !important; border-radius: 8px !important; }
body[data-theme="nexus"] .dashx-card .k { color: #6B8EAE !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .06em !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .dashx-card .v { color: #E2EAF8 !important; font-weight: 800 !important; }
body[data-theme="nexus"] .dashx-card .s { color: #6B8EAE !important; }
body[data-theme="nexus"] .dashx-panel { background: rgba(16,26,44,.92) !important; border: 1px solid rgba(0,212,255,.12) !important; border-radius: 8px !important; }
body[data-theme="nexus"] .dashx-title { color: #E2EAF8 !important; font-weight: 800 !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .dashx-filter { background: rgba(255,255,255,.035) !important; border: 1px solid rgba(0,212,255,.12) !important; color: #6B8EAE !important; border-radius: 999px !important; }
body[data-theme="nexus"] .dashx-filter:hover { background: rgba(0,212,255,.07) !important; color: #60E8FF !important; }
body[data-theme="nexus"] .dashx-filter.active,
body[data-theme="nexus"] .dashx-filter[data-active="1"] { background: rgba(0,212,255,.10) !important; border-color: rgba(0,212,255,.30) !important; color: #60E8FF !important; }
body[data-theme="nexus"] .dashx-bar { background: rgba(0,212,255,.12) !important; border-radius: 999px !important; height: 4px !important; }
body[data-theme="nexus"] .dashx-bar .fill { background: linear-gradient(90deg, #0090bb, #00D4FF) !important; }

/* ── 30. Mailbox / KPIs ──────────────────────────────────────────────────── */
body[data-theme="nexus"] .mbx-stat-box { background: rgba(16,26,44,.9) !important; border: 1px solid rgba(0,212,255,.14) !important; border-radius: 8px !important; color: #E2EAF8 !important; }
body[data-theme="nexus"] .mbx-stat-box:hover { border-color: rgba(0,212,255,.35) !important; box-shadow: 0 4px 18px rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] .mbx-stat-lbl { color: #6B8EAE !important; }
body[data-theme="nexus"] .mbx-stat-val { color: #60E8FF !important; }
body[data-theme="nexus"] .timer-display { color: #60E8FF !important; text-shadow: 0 0 16px rgba(0,212,255,.40) !important; font-family: 'JetBrains Mono', monospace !important; }
body[data-theme="nexus"] .mbx-header-bar { border-bottom-color: rgba(0,212,255,.12) !important; }

/* ── 31. Theme picker ────────────────────────────────────────────────────── */
body[data-theme="nexus"] .th-card { background: rgba(16,26,44,.8) !important; border: 2px solid rgba(0,212,255,.12) !important; border-radius: 8px !important; }
body[data-theme="nexus"] .th-card:hover { border-color: rgba(0,212,255,.42) !important; box-shadow: 0 4px 16px rgba(0,212,255,.12) !important; }
body[data-theme="nexus"] .th-card.is-active { border-color: #00D4FF !important; box-shadow: 0 0 0 3px rgba(0,212,255,.15), 0 4px 16px rgba(0,212,255,.14) !important; }

/* ── 32. QB Page ─────────────────────────────────────────────────────────── */
body[data-theme="nexus"] .qb-page-shell { background: rgba(11,18,32,.98) !important; }
body[data-theme="nexus"] .qb-page-shell.qb-is-fullscreen { background: #0b1220 !important; }
body[data-theme="nexus"] .qb-tabbar-wrap { background: rgba(11,18,32,.97) !important; border: 1px solid rgba(0,212,255,.13) !important; backdrop-filter: blur(12px) !important; box-shadow: 0 2px 14px rgba(0,0,0,.35) !important; }
body[data-theme="nexus"] .qb-tab-btn { color: #5A7898 !important; background: transparent !important; border: 1px solid transparent !important; font-weight: 600 !important; font-family: 'Outfit', ui-sans-serif !important; }
body[data-theme="nexus"] .qb-tab-btn:hover { background: rgba(0,212,255,.08) !important; color: #60E8FF !important; border-color: rgba(0,212,255,.20) !important; }
body[data-theme="nexus"] .qb-tab-btn-active,
body[data-theme="nexus"] .qb-tab-btn.qb-tab-btn-active { background: rgba(0,212,255,.12) !important; color: #60E8FF !important; border-color: rgba(0,212,255,.32) !important; font-weight: 700 !important; }
body[data-theme="nexus"] .qb-tab-badge-live { color: #00E5A0 !important; font-family: 'JetBrains Mono', monospace !important; font-weight: 700 !important; }
body[data-theme="nexus"] .qb-tab-badge-cached { color: #3A5878 !important; }
body[data-theme="nexus"] .qb-tab-add-btn { background: rgba(0,212,255,.06) !important; border: 1px solid rgba(0,212,255,.16) !important; color: #00D4FF !important; }
body[data-theme="nexus"] .qb-tab-add-btn:hover { background: rgba(0,212,255,.14) !important; color: #60E8FF !important; }
body[data-theme="nexus"] .qb-fullscreen-btn { background: rgba(0,212,255,.06) !important; border: 1px solid rgba(0,212,255,.16) !important; color: #00D4FF !important; }
body[data-theme="nexus"] .qb-fullscreen-btn:hover { background: rgba(0,212,255,.14) !important; color: #60E8FF !important; }

/* QB counter widgets */
body[data-theme="nexus"] .qb-counter-widget { background: rgba(16,26,44,.92) !important; border: 1px solid rgba(0,212,255,.13) !important; box-shadow: 0 2px 12px rgba(0,0,0,.35) !important; backdrop-filter: blur(10px) !important; }
body[data-theme="nexus"] .qb-counter-widget:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 20px rgba(0,212,255,.12) !important; border-color: rgba(0,212,255,.28) !important; }
body[data-theme="nexus"] .qb-counter-widget.is-active { border-color: rgba(0,212,255,.52) !important; box-shadow: 0 0 0 3px rgba(0,212,255,.12), 0 6px 20px rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] .qb-counter-label { color: #6B8EAE !important; font-size: 10px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .08em !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .qb-counter-value { color: #60E8FF !important; font-family: 'JetBrains Mono', monospace !important; font-weight: 700 !important; }
body[data-theme="nexus"] .qb-counter-rows { color: #3A5878 !important; }

/* QB table */
body[data-theme="nexus"] .qb-table-card { background: rgba(16,26,44,.92) !important; border: 1px solid rgba(0,212,255,.11) !important; box-shadow: 0 2px 14px rgba(0,0,0,.4) !important; }
body[data-theme="nexus"] .qb-table-head { background: rgba(0,212,255,.06) !important; border-bottom: 1px solid rgba(0,212,255,.16) !important; }
body[data-theme="nexus"] .qb-table-title { color: #E2EAF8 !important; font-weight: 800 !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .qb-instance-title { color: #E2EAF8 !important; font-weight: 800 !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .qb-instance-sub { color: #6B8EAE !important; }
body[data-theme="nexus"] .qb-meta-text { color: #6B8EAE !important; }
body[data-theme="nexus"] .qb-fresh-badge { color: #00E5A0 !important; background: rgba(0,229,160,.09) !important; border-color: rgba(0,229,160,.22) !important; }
body[data-theme="nexus"] .qb-cache-badge { color: #3A5878 !important; background: rgba(0,212,255,.04) !important; border-color: rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] .qb-scope-count { color: #00D4FF !important; font-weight: 700 !important; }

/* QB data table */
body[data-theme="nexus"] .qb-data-table thead th { background: rgba(0,212,255,.07) !important; background-image: none !important; border-bottom: 2px solid rgba(0,212,255,.18) !important; box-shadow: none !important; color: #00D4FF !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: .10em !important; text-transform: uppercase !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .qb-data-table thead th:hover { background: rgba(0,212,255,.12) !important; color: #60E8FF !important; }
body[data-theme="nexus"] .qb-data-table tbody tr { border-bottom: 1px solid rgba(0,212,255,.05) !important; }
body[data-theme="nexus"] .qb-data-table tbody tr:nth-child(even) { background: rgba(255,255,255,.015) !important; }
body[data-theme="nexus"] .qb-data-table tbody tr:hover { background: rgba(0,212,255,.04) !important; }
body[data-theme="nexus"] .qb-data-table td { color: #A8C8E0 !important; }

/* QB case ID — JetBrains Mono cyan */
body[data-theme="nexus"] .qb-case-id { color: #60E8FF !important; font-family: 'JetBrains Mono', monospace !important; font-weight: 700 !important; letter-spacing: .04em !important; text-shadow: 0 0 10px rgba(0,212,255,.30) !important; }

/* QB row number */
body[data-theme="nexus"] .qb-row-num-th { background: rgba(0,212,255,.07) !important; background-image: none !important; color: rgba(0,212,255,.40) !important; border-right: 1px solid rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] .qb-row-num-cell { background: rgba(11,18,32,.95) !important; border-right: 1px solid rgba(0,212,255,.05) !important; }
body[data-theme="nexus"] .qb-row-num-pill { background: rgba(0,212,255,.04) !important; border: 1px solid rgba(0,212,255,.10) !important; color: rgba(0,212,255,.40) !important; }
body[data-theme="nexus"] .qb-data-table tbody tr:hover .qb-row-num-pill { background: rgba(0,212,255,.12) !important; border-color: rgba(0,212,255,.28) !important; color: #60E8FF !important; }

/* QB search */
body[data-theme="nexus"] .qb-search-input { background: rgba(255,255,255,.045) !important; border: 1px solid rgba(0,212,255,.14) !important; color: #E2EAF8 !important; border-radius: 6px !important; }
body[data-theme="nexus"] .qb-search-input:focus { border-color: rgba(0,212,255,.50) !important; box-shadow: 0 0 0 3px rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] .qb-search-input::placeholder { color: #3A5878 !important; }
body[data-theme="nexus"] .qb-search-input.qb-search-scoped { border-color: rgba(0,212,255,.42) !important; background: rgba(0,212,255,.04) !important; }
body[data-theme="nexus"] .qb-search-ico { color: #3A5878 !important; }
body[data-theme="nexus"] .qb-scope-ico { color: #00D4FF !important; }
body[data-theme="nexus"] .qb-scope-lbl { color: #00D4FF !important; }
body[data-theme="nexus"] .qb-search-scope-tag { background: rgba(0,212,255,.06) !important; border: 1px solid rgba(0,212,255,.16) !important; color: #6B8EAE !important; }

/* QB header card */
body[data-theme="nexus"] .qb-header-card { background: rgba(16,26,44,.9) !important; border: 1px solid rgba(0,212,255,.12) !important; box-shadow: 0 2px 12px rgba(0,0,0,.35) !important; }
body[data-theme="nexus"] .qb-header-actions .qb-btn { background: rgba(255,255,255,.045) !important; border: 1px solid rgba(0,212,255,.15) !important; color: #A8C8E0 !important; border-radius: 6px !important; font-weight: 600 !important; font-family: 'Outfit', ui-sans-serif !important; }
body[data-theme="nexus"] .qb-header-actions .qb-btn:hover { background: rgba(0,212,255,.10) !important; color: #60E8FF !important; border-color: rgba(0,212,255,.30) !important; }
body[data-theme="nexus"] .qb-btn-primary { background: linear-gradient(135deg, #0090bb, #00D4FF) !important; border-color: rgba(0,230,255,.48) !important; color: #fff !important; box-shadow: 0 3px 14px rgba(0,212,255,.24) !important; }

/* QB status chips */
body[data-theme="nexus"] .qb-status-badge { font-family: 'JetBrains Mono', monospace !important; font-weight: 700 !important; font-size: 11px !important; border-radius: 4px !important; padding: 3px 8px !important; }

/* QB col card */
body[data-theme="nexus"] .qb-col-card { background: rgba(16,26,44,.92) !important; border: 1px solid rgba(0,212,255,.11) !important; border-radius: 8px !important; box-shadow: 0 3px 16px rgba(0,0,0,.42) !important; }
body[data-theme="nexus"] .qb-col-card:hover { border-color: rgba(0,212,255,.30) !important; box-shadow: 0 6px 24px rgba(0,212,255,.08) !important; }

/* QB modal */
body[data-theme="nexus"] .qb-modal-panel { background: linear-gradient(145deg, rgba(16,26,44,.98), rgba(21,35,56,.98)) !important; border: 1px solid rgba(0,212,255,.18) !important; box-shadow: 0 32px 80px rgba(0,0,0,.72) !important; border-radius: 12px !important; }
body[data-theme="nexus"] .qb-modal-header { border-bottom: 1px solid rgba(0,212,255,.12) !important; }
body[data-theme="nexus"] .qb-modal-title { color: #E2EAF8 !important; font-weight: 800 !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .qb-modal-sub { color: #6B8EAE !important; }
body[data-theme="nexus"] .qb-modal-footer { border-top: 1px solid rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] .qb-modal-tab { color: #6B8EAE !important; border: 1px solid transparent !important; }
body[data-theme="nexus"] .qb-modal-tab.active { color: #60E8FF !important; border-color: rgba(0,212,255,.28) !important; background: rgba(0,212,255,.08) !important; }
body[data-theme="nexus"] .qb-section-title { color: #E2EAF8 !important; font-weight: 700 !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .qb-section-num { color: #00D4FF !important; font-family: 'JetBrains Mono', monospace !important; font-weight: 700 !important; }
body[data-theme="nexus"] .qb-field-label { color: #6B8EAE !important; font-weight: 600 !important; }
body[data-theme="nexus"] .qb-field-input { background: rgba(255,255,255,.045) !important; border-color: rgba(0,212,255,.15) !important; color: #E2EAF8 !important; }
body[data-theme="nexus"] .qb-field-input:focus { border-color: rgba(0,212,255,.50) !important; box-shadow: 0 0 0 3px rgba(0,212,255,.10) !important; }
body[data-theme="nexus"] .qb-field-readonly { background: rgba(255,255,255,.025) !important; color: #6B8EAE !important; border-color: rgba(0,212,255,.08) !important; }
body[data-theme="nexus"] .qb-field-hint { color: #3A5878 !important; }
body[data-theme="nexus"] #qbSettingsModal { background: rgba(11,18,32,.82) !important; backdrop-filter: blur(14px) !important; }
body[data-theme="nexus"] .qb-data-body .qb-table-inner::-webkit-scrollbar-thumb { background: rgba(0,212,255,.18) !important; }
body[data-theme="nexus"] .qb-data-body .qb-table-inner::-webkit-scrollbar-thumb:hover { background: rgba(0,212,255,.38) !important; }

/* ── 33. Status widgets ──────────────────────────────────────────────────── */
body[data-theme="nexus"] .status-widget-tile { background: rgba(16,26,44,.9) !important; border: 1px solid rgba(0,212,255,.12) !important; }
body[data-theme="nexus"] .status-widget-tile:hover { border-color: rgba(0,212,255,.26) !important; }
body[data-theme="nexus"] .status-widget-tile.is-active { border-color: rgba(0,212,255,.50) !important; background: rgba(0,212,255,.07) !important; }
body[data-theme="nexus"] .status-widget-title { color: #E2EAF8 !important; }
body[data-theme="nexus"] .status-widget-sub { color: #6B8EAE !important; }

/* ── 34. Reminders page ──────────────────────────────────────────────────── */
body[data-theme="nexus"] .reminders-stat-card, body[data-theme="nexus"] .stat-mini-card { background: rgba(16,26,44,.9) !important; border: 1px solid rgba(0,212,255,.12) !important; border-radius: 8px !important; }
body[data-theme="nexus"] .reminders-stat-card .stat-val { color: #60E8FF !important; font-weight: 800 !important; }
body[data-theme="nexus"] .reminders-stat-card .stat-lbl { color: #6B8EAE !important; }
body[data-theme="nexus"] .rem-row, body[data-theme="nexus"] .reminder-row { background: rgba(16,26,44,.8) !important; border-bottom: 1px solid rgba(0,212,255,.05) !important; color: #A8C8E0 !important; }
body[data-theme="nexus"] .rem-row:hover, body[data-theme="nexus"] .reminder-row:hover { background: rgba(0,212,255,.04) !important; }

/* ── 35. Right panel tabs ────────────────────────────────────────────────── */
body[data-theme="nexus"] .rtabs { background: rgba(255,255,255,.03) !important; border: 1px solid rgba(0,212,255,.12) !important; border-radius: 6px !important; }
body[data-theme="nexus"] .rtab { color: #6B8EAE !important; font-weight: 700 !important; border-radius: 4px !important; font-family: 'Syne', ui-sans-serif !important; }
body[data-theme="nexus"] .rtab:hover { background: rgba(0,212,255,.07) !important; color: #60E8FF !important; }
body[data-theme="nexus"] .rtab.active { background: rgba(0,212,255,.12) !important; color: #60E8FF !important; border: 1px solid rgba(0,212,255,.25) !important; }

/* ── 36. Btn-glass ───────────────────────────────────────────────────────── */
body[data-theme="nexus"] .btn-glass-primary { background: linear-gradient(145deg, #0090bb, #00D4FF) !important; color: #fff !important; border: 1px solid rgba(0,212,255,.42) !important; box-shadow: 0 4px 14px rgba(0,212,255,.24) !important; }
body[data-theme="nexus"] .btn-glass-ghost { background: rgba(0,212,255,.05) !important; color: #60E8FF !important; border: 1px solid rgba(0,212,255,.18) !important; }
body[data-theme="nexus"] .btn-glass-ghost:hover { background: rgba(0,212,255,.10) !important; border-color: rgba(0,212,255,.32) !important; }

/* ── 37. Controller lab ──────────────────────────────────────────────────── */
body[data-theme="nexus"] #btn-controller-lab { background: rgba(0,212,255,.05) !important; border: 1px solid rgba(0,212,255,.18) !important; color: #60E8FF !important; border-radius: 6px !important; }
body[data-theme="nexus"] #btn-controller-lab:hover { background: rgba(0,212,255,.10) !important; border-color: rgba(0,212,255,.35) !important; }

/* ── 38. Duty pills ──────────────────────────────────────────────────────── */
body[data-theme="nexus"] .duty-pill[data-tone="idle"]    { background: rgba(74,104,136,.10) !important; color: #6B8EAE !important; border: 1px solid rgba(74,104,136,.22) !important; }
body[data-theme="nexus"] .duty-pill[data-tone="active"]  { background: rgba(0,229,160,.10) !important; color: #60F0C0 !important; border: 1px solid rgba(0,229,160,.26) !important; }
body[data-theme="nexus"] .duty-pill[data-tone="manager"] { background: rgba(0,212,255,.10) !important; color: #60E8FF !important; border: 1px solid rgba(0,212,255,.26) !important; }
body[data-theme="nexus"] .duty-pill[data-tone="call"]    { background: rgba(255,170,0,.10) !important; color: #FFDA80 !important; border: 1px solid rgba(255,170,0,.26) !important; }
body[data-theme="nexus"] .duty-pill[data-tone="break"]   { background: rgba(255,69,96,.09) !important; color: #FFB0BA !important; border: 1px solid rgba(255,69,96,.22) !important; }

