/* @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. */
/* MUMS Enterprise UX Kit (Dashboard + My Schedule)
   - CSS Grid + Flex hybrid
   - Responsive + accessibility-focused
   - Additive/rollback-safe: does not remove existing styles
*/

:root{
  --ux-radius: 18px;
  --ux-radius-sm: 12px;
  --ux-shadow: 0 14px 40px rgba(0,0,0,.20);
  --ux-shadow-soft: 0 10px 26px rgba(0,0,0,.14);

  /* Shift colors (use as borders/accents; backgrounds use low opacity) */
  --shift-morning: #e0f7fa; /* teal */
  --shift-mid: #fff3e0; /* blue */
  --shift-night: #ede7f6; /* violet */

  --ux-focus: 0 0 0 3px rgba(99,102,241,.45);
}

/* Base helpers */
.ux-h1{ font-size: 24px; font-weight: 950; letter-spacing:.2px; margin:0; }
.ux-sub{ margin-top:6px; }
.ux-row{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.ux-row.between{ justify-content:space-between; }
.ux-muted{ opacity:.82; }
.ux-chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.04);
  font-weight: 800;
}
.ux-chip .dot{ width:8px; height:8px; border-radius:999px; background: var(--accent); }

.ux-card{
  border: 1px solid var(--border);
  border-radius: var(--ux-radius);
  background: var(--panel);
  box-shadow: var(--ux-shadow-soft);
}
.ux-card.pad{ padding: 14px; }

.ux-grid{
  display:grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 12px;
}

.ux-col-12{ grid-column: span 12; }
.ux-col-8{ grid-column: span 8; }
.ux-col-6{ grid-column: span 6; }
.ux-col-4{ grid-column: span 4; }
.ux-col-3{ grid-column: span 3; }

@media (max-width: 1100px){
  .ux-col-8{ grid-column: span 12; }
  .ux-col-6{ grid-column: span 12; }
  .ux-col-4{ grid-column: span 6; }
  .ux-col-3{ grid-column: span 6; }
}
@media (max-width: 720px){
  .ux-grid{ gap: 10px; }
  .ux-col-4{ grid-column: span 12; }
  .ux-col-3{ grid-column: span 12; }
}

/* Accessible focus rings */
.ux-focusable:focus{ outline: none; box-shadow: var(--ux-focus); }
button:focus, a:focus, input:focus, select:focus, textarea:focus{ outline:none; box-shadow: var(--ux-focus); }

/* MY SCHEDULE (enterprise layout) */
.mysx{
  display:flex; flex-direction:column; gap:12px;
}
.mysx-header{
  display:flex; justify-content:space-between; align-items:flex-end; gap:12px; flex-wrap:wrap;
}
.mysx-title{
  display:flex; flex-direction:column; gap:6px;
}
.mysx-kpis{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.mysx-kpi{
  border-radius: var(--ux-radius);
  border: 1px solid var(--border);
  background: var(--panel);
  box-shadow: var(--ux-shadow-soft);
  padding: 14px;
}
.mysx-kpi .big{ font-size: 18px; font-weight: 950; letter-spacing:.2px; margin-top:6px; }

.mysx-sections{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 12px;
}
@media (max-width: 1100px){
  .mysx-sections{ grid-template-columns: 1fr; }
}

.mysx-section-title{ font-weight: 950; letter-spacing:.2px; }

/* Calendar */
.mysx-cal{
  border-radius: var(--ux-radius);
  border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(0,0,0,.03));
  overflow:hidden;
}
.mysx-cal-head{
  display:flex; justify-content:space-between; align-items:center;
  padding: 12px 12px;
  border-bottom: 1px solid var(--border);
  gap: 10px; flex-wrap:wrap;
}
.mysx-cal-tabs{ display:flex; gap:8px; flex-wrap:wrap; }
.mysx-daytab{
  border: 1px solid var(--border);
  background: transparent;
  border-radius: 999px;
  padding: 6px 10px;
  font-weight: 900;
  cursor:pointer;
}
.mysx-daytab.active{ background: rgba(99,102,241,.32); border-color: rgba(99,102,241,.80); border-width: 1.5px; font-weight: 700; box-shadow: 0 0 0 2px rgba(99,102,241,.18); }
.mysx-cal-body{ display:grid; grid-template-columns: 60px 1fr; }
.mysx-ruler{ border-right: 1px solid var(--border); padding:10px 6px; }
.mysx-ruler .tick{ height: 42px; display:flex; align-items:flex-start; justify-content:flex-end; padding-right:6px; font-size:11px; opacity:.75; }

.mysx-cal-grid{
  position:relative;
  padding:10px 12px;
  min-height: 24*42px; /* fallback, overridden by JS inline style */
}
.mysx-cal-grid::before{
  content:'';
  position:absolute; inset:10px 12px;
  background-image: linear-gradient(to bottom, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 100% 42px;
  pointer-events:none;
}

.mysx-block{
  position:absolute;
  left: 12px; right: 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  box-shadow: 0 10px 18px rgba(0,0,0,.18);
  padding: 10px;
  cursor: default;
}
.mysx-block.draggable{ cursor: grab; }
.mysx-block.draggable:active{ cursor: grabbing; }
.mysx-block .top{ display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.mysx-block .name{ font-weight: 950; letter-spacing:.2px; }
.mysx-block .meta{ font-size:12px; opacity:.78; margin-top:4px; }

.mysx-badges{ display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.mysx-badge{
  border:1px solid var(--border);
  border-radius:999px;
  padding:4px 8px;
  font-size:12px;
  font-weight:950;
  background: rgba(255,255,255,.04);
}
.mysx-badge.morning{ border-color: rgba(20,184,166,.45); background: rgba(20,184,166,.10); }
.mysx-badge.mid{ border-color: rgba(59,130,246,.45); background: rgba(59,130,246,.10); }
.mysx-badge.night{ border-color: rgba(167,139,250,.45); background: rgba(167,139,250,.10); }

/* Tooltip */
.mysx-tip{
  position:fixed;
  z-index: 9999;
  max-width: 360px;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: var(--panel);
  box-shadow: var(--ux-shadow);
  padding: 12px;
  display:none;
}
.mysx-tip .t{ font-weight:950; }
.mysx-tip .s{ opacity:.8; margin-top:6px; font-size:12px; }

/* Collapsible sections (mobile-first) */
.mysx-collapser{
  display:none;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 8px 10px;
  background: rgba(255,255,255,.04);
  font-weight: 900;
}
@media (max-width: 720px){
  .mysx-collapser{ display:inline-flex; }
  .mysx-collapsible{ display:none; }
  .mysx-collapsible.open{ display:block; }
}

/* DASHBOARD (enterprise) */
.dashx{ display:flex; flex-direction:column; gap:12px; }
.dashx-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:12px; flex-wrap:wrap; }

.dashx-cards{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
.dashx-card{ padding:14px; }
.dashx-card .k{ font-size:12px; opacity:.78; }
.dashx-card .v{ font-size:22px; font-weight:950; letter-spacing:.2px; margin-top:6px; }
.dashx-card .s{ font-size:12px; opacity:.78; margin-top:6px; }

.dashx-layout{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 12px;
}
@media (max-width: 1100px){
  .dashx-layout{ grid-template-columns: 1fr; }
}

.dashx-panel{ padding:14px; }
.dashx-title{ font-weight:950; letter-spacing:.2px; }

/* Team Workload Pulse enterprise treatment */
.twp-shell{
  margin-top:12px;
  border:1px solid rgba(56,189,248,.28);
  box-shadow:0 10px 35px rgba(2,6,23,.38);
  padding:16px;
}
.twp-header{
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  flex-wrap:wrap;
}
.twp-title-wrap{ min-width:220px; }
.twp-toolbar{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
}
.twp-select{
  min-width:180px;
  border-radius:10px;
  border:1px solid rgba(148,163,184,.35);
  background:rgba(15,23,42,.85);
}
.twp-list{ margin-top:14px; display:flex; flex-direction:column; gap:10px; }
.twp-dist-card{
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg,rgba(30,41,59,.42),rgba(15,23,42,.28));
}
.twp-dist-head{
  margin-bottom:8px;
  display:flex;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
}
.twp-table-wrap{ overflow:auto; }
.twp-table{ min-width:760px; }
.twp-table thead th{ white-space:nowrap; }
.twp-table tbody td{ vertical-align:middle; }
.twp-progress-track{
  height:10px;
  background:rgba(255,255,255,.08);
  border-radius:999px;
  overflow:hidden;
  min-width:160px;
}
@media (max-width: 860px){
  .twp-shell{ padding:12px; }
  .twp-toolbar{ justify-content:flex-start; }
  .twp-select{ min-width:150px; }
}

/* Heatmap */
.dashx-heatmap{
  display:grid;
  grid-template-columns: 48px repeat(7, 1fr);
  gap: 6px;
  margin-top: 10px;
}
.dashx-heatmap .hday{ font-size:11px; opacity:.75; text-align:center; }
.dashx-heatmap .hhr{ font-size:11px; opacity:.65; text-align:right; padding-right:6px; }
.dashx-heatmap .cell{
  height: 10px;
  border-radius: 4px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.04);
}

/* Notification center */
.dashx-notif-tools{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.dashx-filter{
  border:1px solid var(--border);
  background: transparent;
  border-radius: 999px;
  padding: 6px 10px;
  font-weight: 900;
  cursor:pointer;
}
.dashx-filter.active{ background: rgba(99,102,241,.18); border-color: rgba(99,102,241,.45); }

.dashx-notifs{ margin-top:10px; display:flex; flex-direction:column; gap:10px; }
.dashx-notif{
  border:1px solid var(--border);
  border-radius: 16px;
  padding: 12px;
  background: rgba(255,255,255,.03);
}
.dashx-notif.unread{ border-color: rgba(99,102,241,.55); background: rgba(99,102,241,.10); }
.dashx-notif .top{ display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.dashx-notif .t{ font-weight:950; }
.dashx-notif .m{ font-size:12px; opacity:.78; margin-top:6px; white-space:pre-wrap; }

/* Quick actions strip */
.dashx-actions{ display:flex; gap:8px; flex-wrap:wrap; }



/* Schedule calendar: selector alignment with my_schedule.js */
.mysx-cal-grid{
  display:grid;
  grid-template-columns: 64px 1fr;
  gap:10px;
  margin-top:12px;
  align-items:stretch;
}
.mysx-ruler{
  position:relative;
  min-height: 560px;
}
.mysx-tick{
  position:absolute;
  left:0;
  right:0;
  transform: translateY(-50%);
  font-size:11px;
  color: rgba(255,255,255,0.65);
}
.mysx-days{
  display:grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap:8px;
}
.mysx-day{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.mysx-day-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  padding:6px 8px;
  border:1px solid var(--border);
  border-radius:12px;
  background: rgba(255,255,255,0.04);
  font-size:12px;
}
.mysx-day-body{
  position:relative;
  flex:1;
  min-height: 560px;
  margin-top:8px;
  border:1px solid var(--border);
  border-radius:14px;
  background: rgba(0,0,0,0.18);
  overflow:hidden;
}
.mysx-empty{
  position:absolute;
  top:10px;
  left:10px;
  right:10px;
  font-size:12px;
  color: rgba(255,255,255,0.60);
}

.mysx-tab{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  height:28px;
  padding:0 10px;
  border-radius:10px;
  border:1px solid var(--border);
  background: rgba(255,255,255,0.02);
  color: rgba(255,255,255,0.85);
  cursor:pointer;
}
.mysx-tab.active{
  background: rgba(80,160,255,0.28);
  border-color: rgba(80,160,255,0.70);
  border-width: 1.5px;
  color: #fff;
  font-weight: 700;
  box-shadow: 0 0 0 2px rgba(80,160,255,0.18), 0 2px 8px rgba(80,160,255,0.18);
}
.mysx-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--border);
  background: rgba(255,255,255,0.03);
  font-size:11px;
  color: rgba(255,255,255,0.90);
}
.mysx-block{
  overflow:hidden;
}
.mysx-block-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.mysx-block-name{
  font-weight:700;
  font-size:12px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mysx-block-time{
  font-size:11px;
  color: rgba(255,255,255,0.70);
  white-space:nowrap;
}
.mysx-block-sub{
  margin-top:6px;
  font-size:11px;
  color: rgba(255,255,255,0.75);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.mysx-block.tiny .mysx-block-sub{
  display:none;
}
.mysx-block.tiny .mysx-block-time{
  display:none;
}
.mysx-cal-foot{
  margin-top:10px;
  display:flex;
  justify-content:space-between;
  gap:10px;
}
.mysx-tooltip{
  position:fixed;
  z-index: 9999;
  max-width: 320px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.10);
  background: rgba(10,16,26,0.95);
  color:#fff;
  font-size:12px;
  line-height:1.25;
  pointer-events:none;
  opacity:0;
  transition: opacity .12s ease;
}

@media (max-width: 920px){
  .mysx-cal-grid{ grid-template-columns: 1fr; }
  .mysx-ruler{ display:none; }
  .mysx-days{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mysx-day-body{ min-height: 480px; }
}
@media (max-width: 560px){
  .mysx-days{ grid-template-columns: 1fr; }
  .mysx-day-body{ min-height: 440px; }
}


/* Dashboard: distribution bars + safe acknowledge */
.dashx-bar{
  height:8px;
  border-radius:999px;
  background: rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.10);
  overflow:hidden;
}
.dashx-bar .fill{
  height:100%;
  background: rgba(80,160,255,0.55);
  width:0%;
}
.dashx-dist-row{
  display:grid;
  grid-template-columns: 110px 1fr 92px;
  gap:10px;
  align-items:center;
  margin-top:8px;
}
.dashx-top-row{
  display:grid;
  grid-template-columns: 1fr auto;
  gap:10px;
  align-items:center;
  padding:8px 0;
  border-bottom: 1px dashed rgba(255,255,255,0.10);
}
.dashx-top-row .dashx-bar{
  grid-column: 1 / span 2;
  margin-top:6px;
}
.dashx-spin{
  display:inline-block;
  width:14px;
  height:14px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,0.25);
  border-top-color: rgba(255,255,255,0.75);
  margin-right:8px;
  vertical-align:-3px;
  opacity:0;
}
.dashx-spin.on{
  opacity:1;
  animation: dashxspin .8s linear infinite;
}
@keyframes dashxspin{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}


/* ------------------------------------------------------------------
   Required Enterprise Classes (13126-07)
   ------------------------------------------------------------------ */

/* Task chips (used in My Schedule + Members tooling)
   Use inline CSS variables for exact palette matching:
   style="--task-color:#4aa3ff; --task-bg:rgba(74,163,255,.14)" */
.task-label{
  --task-color: rgba(255,255,255,.85);
  --task-bg: rgba(255,255,255,.06);
  --task-border: rgba(255,255,255,.14);
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  letter-spacing:.01em;
  border:1px solid var(--task-border);
  background:var(--task-bg);
  color:var(--task-text, var(--text));
  line-height:1;
  white-space:nowrap;
}
.task-label:focus,
.task-label:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(56,189,248,.25);
}

/* Small color swatch for tasks */
.task-color{
  width:12px;
  height:12px;
  border-radius:4px;
  background:var(--task-color);
  box-shadow:0 0 0 1px rgba(0,0,0,.25) inset, 0 0 0 1px rgba(255,255,255,.10);
  flex:0 0 auto;
}

/* Schedule blocks (generic class used across schedule UIs) */
.schedule-block{
  position:relative;
  border:1px solid var(--task-border, rgba(255,255,255,.12));
  background:var(--task-bg, rgba(255,255,255,.04));
  border-radius:14px;
  padding:10px 12px;
  overflow:hidden;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.schedule-block:focus,
.schedule-block:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(56,189,248,.22), 0 14px 28px rgba(0,0,0,.25);
  border-color:rgba(56,189,248,.35);
}
.schedule-block:hover{
  transform:translateY(-1px);
  border-color:rgba(56,189,248,.35);
  box-shadow:0 14px 28px rgba(0,0,0,.25);
}
.schedule-block .sb-title{
  font-weight:900;
  font-size:13px;
  letter-spacing:.01em;
}
.schedule-block .sb-meta{
  margin-top:4px;
  font-size:12px;
  color:rgba(255,255,255,.72);
}

/* Members list rows (aliases: .members-row in legacy code) */
.member-row,
.members-row{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  border-radius:16px;
  transition:border-color .12s ease, background .12s ease;
}
.member-row:hover,
.members-row:hover{
  border-color:rgba(255,255,255,.18);
  background:rgba(255,255,255,.04);
}
.members-row.m-selected{
  border-color:rgba(56,189,248,.35);
  box-shadow:0 0 0 3px rgba(56,189,248,.12);
}

/* Notification popout styling (schedule updates, mailbox assigns) */
.notification-popout{
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border-radius:20px;
  box-shadow:0 22px 60px rgba(0,0,0,.50);
}
#schedNotifModal .panel.notification-popout{
  width:min(440px, calc(100vw - 24px));
  max-height:min(86vh, 780px);
}
#schedNotifModal .panel.notification-popout.mailbox-table-mode{
  width:min(1180px, calc(100vw - 24px));
  max-height:min(86vh, 780px);
}
.notification-popout.mailbox-table-mode .body{
  padding:10px 12px 12px;
}
#schedNotifModal .panel.notification-popout.mailbox-compact-mode{
  width:min(360px, calc(100vw - 24px));
  max-height:none;
  height:auto;
  overflow:visible;
  border-radius:16px;
}
.notification-popout.mailbox-compact-mode{
  width:min(360px, calc(100vw - 24px));
  max-height:none;
  overflow:visible;
  border-radius:16px;
}
.notification-popout.mailbox-compact-mode .head{
  display:none;
}
#schedNotifModal .panel.notification-popout.mailbox-compact-mode,
#schedNotifModal .panel.notification-popout.mailbox-compact-mode .body{
  max-height:none !important;
  overflow:visible !important;
}
.notification-popout.mailbox-compact-mode .body{
  padding:8px;
  max-height:none;
  overflow:visible;
}
.notification-popout.mailbox-compact-mode .notif-item.mailbox-assign{
  margin:0;
  width:100%;
  max-width:100%;
  padding:8px;
}
.notification-popout.mailbox-compact-mode .notif-item.mailbox-assign .notif-item-head{
  margin-bottom:6px;
}
.notification-popout.mailbox-compact-mode .notif-item.mailbox-assign .dashx-ack{
  padding:5px 8px;
  min-height:0;
  font-size:10px;
}
.notification-popout.mailbox-compact-mode .notif-item.mailbox-assign .notif-item-body{
  margin-top:6px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-grid{
  gap:6px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-top,
.notification-popout.mailbox-compact-mode .mbx-assign-card{
  padding:8px;
  border-radius:9px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-title,
.notification-popout.mailbox-compact-mode .mbx-assign-from{
  font-size:12px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-row{
  gap:8px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-timer{
  min-width:104px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-timer-label,
.notification-popout.mailbox-compact-mode .mbx-assign-label{
  font-size:9px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-timer-value{
  margin-top:3px;
  font-size:23px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-desc{
  margin-top:4px;
  font-size:15px;
  line-height:1.2;
}
.notification-popout.mailbox-compact-mode .mbx-assign-case{
  margin-top:6px;
  gap:8px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-case-no{
  font-size:48px;
}
.notification-popout.mailbox-compact-mode .mbx-assign-copy{
  padding:6px 9px;
  font-size:10px;
}
#schedNotifModal{
  z-index:14050;
}
.notification-popout .notif-member{
  font-weight:900;
  font-size:14px;
  color:rgba(244,244,245,1);
  margin-bottom:4px;
}
.notification-popout .announce-title{
  font-weight:950;
  letter-spacing:.01em;
}
.notification-popout .body{
  color:rgba(255,255,255,.92);
  font-size:13px;
  line-height:1.35;
}
.notification-popout .notif-intro{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:8px;
}
.notification-popout .notif-summary{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.10);
}
.notification-popout .notif-date{
  font-size:12px;
  font-weight:800;
  color:rgba(226,232,240,.95);
}
.notification-popout .notif-task-row{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12.5px;
}
.notification-popout .notif-task-bullet{
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--task-color, rgba(255,255,255,.6));
  box-shadow:0 0 0 3px rgba(255,255,255,.06);
  flex:0 0 auto;
}
.notification-popout .notif-task-time{
  font-weight:700;
  color:rgba(226,232,240,.92);
}
.notification-popout .notif-task-eq{
  opacity:.6;
}
.notification-popout .notif-task-label{
  font-weight:700;
  color:rgba(244,244,245,.95);
}
.notification-popout .foot .btn{
  min-width:140px;
  font-weight:900;
}
.notification-popout .notif-count{
  min-width:28px;
  height:28px;
  border-radius:999px;
  background:rgba(56,189,248,.18);
  color:rgba(226,232,240,.95);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:950;
  padding:0 8px;
}
.notification-popout .notif-item{
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(10,16,26,.45);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
}
.notification-popout .notif-item + .notif-item{
  margin-top:10px;
}
.notification-popout .notif-item-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.notification-popout .notif-item-title{
  font-weight:800;
  color:rgba(248,250,252,.95);
}
.notification-popout .notif-item-body{
  margin-top:8px;
  white-space:pre-wrap;
}
.notification-popout .mbx-assign-table-wrap{
  border:1px solid rgba(51,65,85,.92);
  border-radius:14px;
  overflow:auto;
  background:rgba(15,23,42,.96);
  box-shadow:0 16px 32px rgba(2,8,23,.45);
}
.notification-popout .mbx-assign-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:980px;
  font-family:'Inter','Roboto','Segoe UI',sans-serif;
}
.notification-popout .mbx-assign-table thead th{
  position:sticky;
  top:0;
  z-index:2;
  background:#1e293b;
  color:#9ca3af;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:11px;
  font-weight:800;
  padding:11px 12px;
  border-bottom:1px solid rgba(51,65,85,.96);
  white-space:nowrap;
}
.notification-popout .mbx-assign-table tbody td{
  background:#0f172a;
  color:#f8fafc;
  padding:12px;
  border-bottom:1px solid rgba(51,65,85,.86);
  vertical-align:middle;
}
.notification-popout .mbx-assign-table tbody tr{
  transition:background .18s ease, opacity .22s ease, transform .22s ease;
}
.notification-popout .mbx-assign-table tbody tr:hover td{
  background:rgba(30,41,59,.5);
}
.notification-popout .mbx-assign-row-item.is-removing{
  opacity:0;
  transform:translateY(-3px);
}
.notification-popout .mbx-assign-ts{ white-space:nowrap; }
.notification-popout .mbx-assign-case-cell{
  color:#60a5fa;
  letter-spacing:.01em;
}
.notification-popout .mbx-assign-live{
  white-space:nowrap;
  text-align:center;
  color:#4ade80;
  font-weight:800;
  font-family:'JetBrains Mono','Roboto Mono',monospace;
  font-variant-numeric:tabular-nums;
}
.notification-popout .mbx-assign-by-wrap{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.notification-popout .mbx-assign-by-name{
  color:#e2e8f0;
  font-weight:600;
}
.notification-popout .mbx-accept-btn{
  min-width:96px;
  justify-content:center;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  border-color:rgba(37,99,235,.7);
  background:linear-gradient(180deg, #2563eb 0%, #1d4ed8 100%);
  color:#fff;
}
.notification-popout .mbx-accept-btn:hover:not([disabled]){
  background:linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
}
.notification-popout .mbx-assign-table tbody td:last-child,
.notification-popout .mbx-assign-table thead th:last-child,
.notification-popout .mbx-assign-table tbody td:nth-last-child(2),
.notification-popout .mbx-assign-table thead th:nth-last-child(2){
  text-align:center;
}
.notification-popout .mailbox-assign{
  width:min(100%, 400px);
  max-width:400px;
  margin:0 auto;
  position:relative;
  overflow:hidden;
  padding:10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(15,23,42,.95);
  box-shadow:0 14px 32px rgba(2,8,23,.42);
  backdrop-filter:blur(8px);
}
.notification-popout .mailbox-assign::before{
  content:none;
}
.notification-popout .mailbox-assign .notif-item-head{
  align-items:center;
  margin-top:0;
  margin-bottom:6px;
}
.notification-popout .mailbox-assign .notif-item-title{
  font-size:13px;
  font-weight:700;
  color:rgba(248,250,252,.95);
}
.notification-popout .mbx-assign-grid{
  display:grid;
  gap:8px;
  margin-top:0;
}
.notification-popout .mbx-assign-top,
.notification-popout .mbx-assign-card{
  position:relative;
  overflow:hidden;
  padding:10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(30,41,59,.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.notification-popout .mbx-assign-top{
  display:block;
}
.notification-popout .mbx-assign-title{
  font-size:14px;
  font-weight:700;
  line-height:1.25;
  letter-spacing:.01em;
  color:#f8fafc;
}
.notification-popout .mbx-assign-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.notification-popout .mbx-assign-from{
  font-size:14px;
  font-weight:700;
  line-height:1.25;
  color:#f1f5f9;
}
.notification-popout .mbx-assign-meta{
  display:none;
}
.notification-popout .mbx-assign-timer{
  text-align:right;
  min-width:132px;
}
.notification-popout .mbx-assign-timer-label{
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  color:#4ade80;
  text-transform:uppercase;
}
.notification-popout .mbx-assign-timer-value{
  margin-top:4px;
  font-family:'JetBrains Mono','Roboto Mono',monospace;
  font-size:30px;
  font-weight:800;
  line-height:1;
  letter-spacing:.02em;
  color:#fff;
  font-variant-numeric:tabular-nums;
}
.notification-popout .mbx-assign-label{
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(226,232,240,.82);
}
.notification-popout .mbx-assign-desc{
  margin-top:6px;
  font-size:24px;
  font-weight:700;
  line-height:1.2;
  color:rgba(241,245,249,.95);
}
.notification-popout .mbx-assign-card.case-zone{
  border-color:rgba(45,212,191,.36);
  background:linear-gradient(135deg, rgba(19,78,74,.92), rgba(15,23,42,.94));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}
.notification-popout .mbx-assign-case{
  margin-top:8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.notification-popout .mbx-assign-case-no{
  font-size:40px;
  font-weight:900;
  line-height:1;
  letter-spacing:.03em;
  color:#fff;
}
.notification-popout .mbx-assign-copy{
  min-width:auto;
  padding:7px 10px;
  border-radius:8px;
  border:1px solid rgba(226,232,240,.8);
  background:#fff;
  color:#020617;
  font-size:11px;
  font-weight:800;
  line-height:1;
  box-shadow:0 6px 16px rgba(2,8,23,.26);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.notification-popout .mbx-assign-copy:hover:not([disabled]){
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(226,232,240,.24);
  background:#f8fafc;
}
.notification-popout .mbx-assign-copy[disabled]{
  opacity:.58;
  cursor:not-allowed;
}
@media (max-width: 960px){
  #schedNotifModal .panel.notification-popout.mailbox-table-mode{
    width:min(100vw - 16px, 920px);
  }
  .notification-popout.mailbox-table-mode .head{
    padding-bottom:10px;
  }
  .notification-popout .mbx-assign-table thead th,
  .notification-popout .mbx-assign-table tbody td{
    padding:9px 8px;
    font-size:11px;
  }
  .notification-popout .mailbox-assign{
    width:min(100%, 360px);
  }
  .notification-popout .mbx-assign-row,
  .notification-popout .mbx-assign-case{
    flex-direction:column;
    align-items:flex-start;
  }
  .notification-popout .mbx-assign-timer{
    min-width:0;
    text-align:left;
    width:100%;
  }
  .notification-popout .mbx-assign-timer-value{
    font-size:26px;
  }
  .notification-popout .mbx-assign-desc{
    font-size:20px;
  }
  .notification-popout .mbx-assign-case-no{
    font-size:34px;
  }
}

/* ------------------------------------------------------------------
   My Schedule — Enterprise Weekly/Daily/Team Calendar (13126-09)
   ------------------------------------------------------------------ */

.schx{
  display:flex;
  flex-direction:column;
  gap:14px;
  /* shared grid sizing for pixel-perfect ruler alignment */
  --schx-row-h: 56px;
  --schx-hours: 9;
  /* fixed header sizing so the time ruler can align to the grid area */
  --schx-head-h: 46px;
  --schx-head-gap: 8px;
}
.schx-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
.schx-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
.schx-toggle{
  display:inline-flex;
  gap:6px;
  padding:4px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.15);
}
.schx-toggle .btn{ border-radius:999px; }
.schx-toggle .btn.active{
  background: rgba(80,160,255,0.30) !important;
  border-color: rgba(80,160,255,0.75) !important;
  border-width: 1.5px !important;
  color: #fff !important;
  font-weight: 700 !important;
  box-shadow: 0 0 0 2px rgba(80,160,255,0.20), 0 2px 8px rgba(80,160,255,0.20) !important;
}

.schx-kpis{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:8px;
}
.schx-kpi{
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px 12px;
  background: rgba(255,255,255,.03);
  min-width:0;
}
.schx-kpi .big{ font-size:16px; font-weight:950; letter-spacing:.2px; margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.schx-kpi.countdown.ok{ border-color: rgba(52,211,153,.45); background: rgba(52,211,153,.12); }
.schx-kpi.countdown.focus{ border-color: rgba(56,189,248,.45); background: rgba(56,189,248,.12); }
.schx-kpi.countdown.warn{ border-color: rgba(245,158,11,.55); background: rgba(245,158,11,.14); }
.schx-kpi.countdown.warn .big{ color:#ffd38a; }

.schx-daytabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.schx-daytab{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  height:34px;
  padding:0 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.02);
  color: rgba(255,255,255,.88);
  cursor:pointer;
  font-weight:900;
  font-size:12px;
}
.schx-daytab .dot{ margin-left:8px; width:7px; height:7px; border-radius:999px; background: rgba(255,255,255,.55); }
.schx-daytab-date{ opacity:.9; font-variant-numeric:tabular-nums; }
.schx-daytab.active{
  background: #ffffff;
  border-color: #ffffff;
  color:#0b1424;
}
.schx-daytab.active .dot{ background: rgba(11,20,36,.58); }
.schx-daytab.is-today:not(.active){
  border-color: rgba(80,160,255,.72);
  box-shadow: inset 0 0 0 1px rgba(80,160,255,.26);
  background: rgba(80,160,255,.14);
}


.schx-cal{
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding:12px;
  background: linear-gradient(180deg, rgba(16,25,43,.92), rgba(12,20,34,.9));
  max-height: calc(100vh - 250px);
  overflow:auto;
}

.schx-day-layout{
  display:grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 30%);
  gap:12px;
}

.schx-grid{
  display:grid;
  grid-template-columns: 76px 1fr;
  gap:0;
  align-items:start;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  overflow:hidden;
}
.schedule-ruler,
.schx-ruler{
  position:relative;
  display:flex;
  flex-direction:column;
}

.schx-ruler-spacer{
  height: calc(var(--schx-head-h) + var(--schx-head-gap));
}

.schx-ruler-body{
  position:relative;
  height: calc(var(--schx-hours) * var(--schx-row-h));
  min-height: calc(var(--schx-hours) * var(--schx-row-h));
  overflow: visible;
}

/* ------------------------------------------------------------------
   My Schedule — shared unit ruler grid (13126-11)
   Ensures tick labels align pixel-perfect with schedule grid lines.
   ------------------------------------------------------------------ */

.schx-ruler-grid{
  display:grid;
  grid-auto-rows: var(--schx-row-h);
  gap: 0;
}

.schx-ruler-row{
  position:relative;
  height: var(--schx-row-h);
}

.schx-ruler-end{
  position:absolute;
  left:0;
  right:0;
  top:100%;
  transform: translateY(-50%);
}

.schx-tick-label{
  position:absolute;
  right:8px;
  top:0;
  transform: translateY(-50%);
  display:inline-block;
  padding:2px 6px;
  border-radius:8px;
  background: rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.08);
  font-size:11px;
  color: rgba(255,255,255,0.65);
  line-height: 1;
  white-space: nowrap;
}

.schx-tick{
  position:absolute;
  left:0;
  right:0;
  transform: translateY(-50%);
  font-size:11px;
  color: rgba(255,255,255,0.65);
  text-align:right;
  padding-right:8px;
}
.schx-tick span{ display:inline-block; padding:2px 6px; border-radius:8px; background: rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.08); }

.schx-cols{
  display:grid;
  gap:0;
  min-width:0;
  position:relative;
}
.schx-cols.week{
  grid-template-columns: repeat(7, minmax(180px, 1fr));
  overflow-x:auto;
}
.schx-cols.day{
  grid-template-columns: 1fr;
}

.schx-day{
  display:flex;
  flex-direction:column;
  min-width:180px;
  border-left:1px solid rgba(120,140,170,.34);
}
.schx-day.is-completed{
  background: rgba(120,130,150,.06);
}
.schx-day:first-child{ border-left:none; }
.schx-dayhead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  border-bottom:1px solid rgba(130,150,185,.34);
  background: rgba(12,20,34,.96);
  height: var(--schx-head-h);
  min-height: var(--schx-head-h);
  overflow:hidden;
  position:sticky;
  top:0;
  z-index:3;
}
.schx-dayname{ font-weight:950; letter-spacing:.2px; }
.schx-dayhead.is-today{
  background: linear-gradient(180deg, rgba(29,78,216,.28), rgba(12,20,34,.96));
  border-bottom-color: rgba(96,165,250,.62);
}
.schx-dayhead.is-completed{
  background: rgba(58,67,82,.70);
  border-bottom-color: rgba(148,163,184,.35);
}

.schx-daydate{
  font-size:11px;
  opacity:.76;
  line-height:1.2;
  text-align:right;
  max-width: 70%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.schx-daybody{
  position:relative;
  margin-top:0;
  height: calc(var(--schx-hours) * var(--schx-row-h));
  min-height: calc(var(--schx-hours) * var(--schx-row-h));
  border-right:1px solid rgba(120,140,170,.34);
  background: rgba(12,20,34,.54);
  overflow:hidden;
  /* subtle grid backing (lines also rendered as elements for crispness) */
  background-image: repeating-linear-gradient(
    to bottom,
    rgba(128,146,175,.30) 0px,
    rgba(128,146,175,.30) 1px,
    rgba(0,0,0,0) 1px,
    rgba(0,0,0,0) var(--schx-row-h)
  );
}
.schx-day.is-completed .schx-daybody{
  background: rgba(44,52,66,.42);
}
.schx-lines{ position:absolute; inset:0; pointer-events:none; }
.schx-vline{ position:absolute; top:0; bottom:0; width:1px; right:0; background: rgba(128,146,175,.34); pointer-events:none; }
.schx-line{ position:absolute; left:0; right:0; height:1px; background: rgba(128,146,175,.34); }
.schx-nowline{
  position:absolute;
  left:0;
  right:0;
  height:2px;
  background:#ff4d4f;
  z-index:8;
  pointer-events:none;
  box-shadow:0 0 10px rgba(255,77,79,.45);
}
.schx-nowline-dot{
  position:absolute;
  left:0;
  top:50%;
  transform:translate(-50%,-50%);
  width:8px;
  height:8px;
  border-radius:999px;
  background:#ff4d4f;
}
.schx-nowline-badge{
  position:absolute;
  left:-2px;
  top:50%;
  transform: translate(-100%,-50%);
  padding:2px 8px;
  border-radius:999px;
  border:1px solid rgba(255,77,79,.65);
  background: rgba(255,77,79,.16);
  color:#ffd6d6;
  font-size:11px;
  font-weight:900;
  letter-spacing:.2px;
  white-space:nowrap;
}
.schx-empty{ position:absolute; top:10px; left:10px; right:10px; }

.schx-block{
  position:absolute;
  left:6px;
  right:6px;
  padding:8px 10px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.20);
  border-radius:10px;
  border:2px solid var(--task-color, rgba(255,255,255,.24));
  background: color-mix(in srgb, var(--task-color, #93c5fd) 20%, transparent);
  color: #FFFFFF;
  overflow:hidden;
}

.schx-block[data-task-type]{
  border-color: var(--theme-call_available, var(--task-color, #93c5fd));
  background: color-mix(in srgb, var(--theme-call_available, var(--task-color, #93c5fd)) 20%, transparent);
}
.schx-block[data-task-type="mailbox_manager"]{
  border-color: var(--theme-mailbox_manager, var(--task-color, #93c5fd));
  background: color-mix(in srgb, var(--theme-mailbox_manager, var(--task-color, #93c5fd)) 20%, transparent);
}
.schx-block[data-task-type="back_office"]{
  border-color: var(--theme-back_office, var(--task-color, #93c5fd));
  background: color-mix(in srgb, var(--theme-back_office, var(--task-color, #93c5fd)) 20%, transparent);
}
.schx-block[data-task-type="call_available"],
.schx-block[data-task-type="call_onqueue"]{
  border-color: var(--theme-call_available, var(--theme-call_onqueue, var(--task-color, #93c5fd)));
  background: color-mix(in srgb, var(--theme-call_available, var(--theme-call_onqueue, var(--task-color, #93c5fd))) 20%, transparent);
}
.schx-block[data-task-type="lunch"]{
  border-color: var(--theme-lunch, var(--task-color, #93c5fd));
  background: color-mix(in srgb, var(--theme-lunch, var(--task-color, #93c5fd)) 20%, transparent);
}

.schx-bmeta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:4px;
}
.schx-time-range{
  font-size:11px;
  font-weight:800;
  opacity:.92;
}
.schx-status-tag{
  font-size:10px;
  font-weight:900;
  padding:2px 6px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.3);
  background: rgba(0,0,0,.2);
}
.schx-btop.minimal{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.schx-status-icon{ font-size:12px; line-height:1; }
.schx-block-title{
  font-size:14px;
  font-weight:950;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color: #FFFFFF;
  text-shadow: 0 1px 0 rgba(0,0,0,.3);
}
.schx-subtasks{
  margin:8px 0 0;
  padding:0 0 0 18px;
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:12px;
  line-height:1.25;
}
.schx-subtasks li{ opacity:.95; }
.schx-bfoot{
  margin-top:8px;
  font-size:11px;
  font-weight:800;
  opacity:.9;
}
.schx-block.compact .schx-subtasks,
.schx-block.compact .schx-bfoot{ display:none; }
.schx-block.compact .schx-block-title{ font-size:13px; }
.schx-block.is-selected{
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.32), 0 0 0 1px rgba(255,255,255,.18), 0 12px 20px rgba(0,0,0,.25);
}
.schx-block.is-completed{
  border-color: rgba(148,163,184,.55) !important;
  background: rgba(71,85,105,.36) !important;
  color: rgba(226,232,240,.9);
  box-shadow: inset 0 0 0 1px rgba(226,232,240,.15);
}
.schx-block.is-completed .schx-block-title,
.schx-block.is-completed .schx-time-range,
.schx-block.is-completed .schx-bfoot,
.schx-block.is-completed .schx-status-icon{
  color: rgba(226,232,240,.9);
  text-shadow: none;
}
.schx-block.is-completed .schx-status-tag{
  border-color: rgba(203,213,225,.35);
  background: rgba(30,41,59,.45);
  color: rgba(226,232,240,.92);
}

@keyframes schxLivePulse {
  0%, 100% {
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.36),
      0 0 0 1px color-mix(in srgb, var(--task-color, #60a5fa) 52%, rgba(255,255,255,.38)),
      0 0 14px color-mix(in srgb, var(--task-color, #60a5fa) 40%, transparent),
      0 0 26px color-mix(in srgb, var(--task-color, #60a5fa) 24%, transparent);
    filter: brightness(1);
  }
  50% {
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.5),
      0 0 0 1px color-mix(in srgb, var(--task-color, #60a5fa) 80%, rgba(255,255,255,.56)),
      0 0 22px color-mix(in srgb, var(--task-color, #60a5fa) 62%, transparent),
      0 0 40px color-mix(in srgb, var(--task-color, #60a5fa) 46%, transparent);
    filter: brightness(1.08);
  }
}

@keyframes schxLiveStatusBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: .68; }
}

.schx-block.is-live-current{
  border-color: color-mix(in srgb, var(--task-color, #60a5fa) 84%, #dbeafe) !important;
  background:
    linear-gradient(125deg,
      color-mix(in srgb, var(--task-color, #60a5fa) 30%, rgba(8,14,26,.88)),
      color-mix(in srgb, var(--task-color, #60a5fa) 18%, rgba(8,14,26,.78)));
  animation: schxLivePulse 1.7s ease-in-out infinite;
  z-index: 6;
}

.schx-block.is-live-current .schx-status-tag,
.schx-block.is-live-current .schx-bfoot{
  border-color: color-mix(in srgb, var(--task-color, #60a5fa) 88%, rgba(255,255,255,.8));
  background: color-mix(in srgb, var(--task-color, #60a5fa) 28%, rgba(10,15,29,.72));
  color: #f8fbff;
  animation: schxLiveStatusBlink 1.1s steps(2, end) infinite;
}

@media (prefers-reduced-motion: reduce){
  .schx-block.is-live-current,
  .schx-block.is-live-current .schx-status-tag,
  .schx-block.is-live-current .schx-bfoot{
    animation: none !important;
  }
}

.schx-legend{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
}
.schx-legend-items{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}
.schx-header-cta{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-left:0;
  border:1px solid rgba(59,130,246,.95);
  background:linear-gradient(180deg, #3b82f6, #2563eb);
  color:#ffffff;
  font-weight:900;
  box-shadow:0 8px 20px rgba(37,99,235,.35);
}
.schx-header-cta:hover{
  border-color:rgba(96,165,250,.98);
  background:linear-gradient(180deg, #4f8bff, #2f6fff);
  color:#ffffff;
}
.schx-header-cta:focus-visible{
  outline:2px solid rgba(147,197,253,.92);
  outline-offset:2px;
}
.schx-action-cta-icon{
  font-size:15px;
  line-height:1;
  font-weight:900;
}
.schx-modal-panel{
  width:min(560px,100%);
}
.schx-action-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.schx-action-form select,
.schx-action-form textarea{
  width:100%;
}
.schx-checkline{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:rgba(255,255,255,.9);
}
.schx-legend .legend-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color: rgba(255,255,255,.82);
}
.schx-legend .legend-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
}
.schx-legend .legend-dot.mailbox{ background:#4aa3ff; }
.schx-legend .legend-dot.call{ background:#2ecc71; }
.schx-legend .legend-dot.admin{ background:#ffa21a; }
.schx-legend .legend-dot.break{ background:#22d3ee; }


.schx-context{
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background: rgba(10,18,32,.8);
  padding:12px;
  min-height: 220px;
}
.schx-context-head{ display:flex; justify-content:space-between; gap:8px; align-items:flex-start; }
.schx-context-date{ font-size:11px; opacity:.8; text-align:right; }
.schx-context-card{ margin-top:10px; border:1px solid rgba(255,255,255,.1); border-radius:12px; padding:12px; background: rgba(255,255,255,.03); }
.schx-context-title{ font-size:15px; font-weight:950; margin-bottom:4px; }
.schx-context-list{ margin:10px 0 0; padding-left:18px; display:flex; flex-direction:column; gap:6px; font-size:12px; }

.schx-foot{
  margin-top:12px;
  display:flex;
  justify-content:space-between;
  gap:10px;
}

/* ------------------------------------------------------------------
   Team tabular view (13126-09)
   ------------------------------------------------------------------ */

.team-schedule-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

.team-schedule-wrap{
  --tsg-name-w: 240px;
  --tsg-row-h: 52px;
  border:1px solid var(--border);
  border-radius:16px;
  background: rgba(0,0,0,.22);
  overflow:auto;
  max-height: 62vh;
}

.team-schedule-grid{
  min-width: calc(var(--tsg-name-w) + var(--tsg-timeline-w, 920px));
  position:relative;
}

.team-schedule-row{
  display:flex;
  align-items:stretch;
}

.team-schedule-header{
  position:sticky;
  top:0;
  z-index:12;
  background: rgba(8,14,24,.96);
  border-bottom:1px solid rgba(255,255,255,.10);
}

.tsg-h{
  width: var(--tsg-name-w);
  min-width: var(--tsg-name-w);
  padding:12px 12px;
  font-size:12px;
  font-weight:950;
  letter-spacing:.2px;
  color: rgba(255,255,255,.82);
  border-right:1px solid rgba(120,140,170,.34);
  white-space:nowrap;
}
.tsg-h.ts-name{
  position:sticky;
  left:0;
  z-index:14;
  background: rgba(8,14,24,.98);
}

.tsg-timeline-head,
.tsg-timeline{
  width: var(--tsg-timeline-w, 920px);
  min-width: var(--tsg-timeline-w, 920px);
  overflow:hidden;
  position:relative;
}

.tsg-hour-grid{
  width: var(--tsg-timeline-w, 920px);
  min-width: var(--tsg-timeline-w, 920px);
  display:grid;
  grid-template-columns: repeat(var(--tsg-hours, 9), minmax(72px, var(--tsg-hour-px, 120px)));
  position:relative;
}

.tsg-hour-cell,
.tsg-coverage-cell{
  min-height: 44px;
  padding:10px 8px;
  font-size:12px;
  font-weight:900;
  text-align:center;
  border-left:1px solid rgba(120,140,170,.28);
  color: rgba(255,255,255,.88);
}

.tsg-hour-cell:first-child,
.tsg-coverage-cell:first-child{ border-left:none; }

.tsg-name{
  width: var(--tsg-name-w);
  min-width: var(--tsg-name-w);
  padding:14px 10px;
  font-weight:950;
  color: rgba(255,255,255,.92);
  border-right:1px solid rgba(120,140,170,.34);
  border-top:1px solid rgba(120,140,170,.24);
  position:sticky;
  left:0;
  z-index:8;
  background: rgba(9,16,28,.96);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.team-schedule-row.member-row:hover .tsg-name{
  background: rgba(80,160,255,0.10);
}


.tsg-name{
  display:flex;
  align-items:center;
  gap:10px;
}

.tsg-avatar{
  width:28px;
  height:28px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.45);
  background: rgba(148,163,184,.18);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  flex:0 0 auto;
}

.tsg-avatar-img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.tsg-avatar-fallback{
  font-size:11px;
  font-weight:900;
  letter-spacing:.2px;
  color: rgba(255,255,255,.9);
}

.tsg-member-name{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.tsg-rest-day{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:800;
  color: rgba(203,213,225,.7);
  pointer-events:none;
}

/* Leave day label — distinct amber tint vs rest-day grey */
.tsg-on-leave{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:800;
  color: rgba(251,191,36,.8);
  pointer-events:none;
}

/* Dim the entire row for rest/leave so it visually recedes */
.team-schedule-row.member-row.is-inactive .tsg-name{
  opacity:0.5;
}
.team-schedule-row.member-row.is-inactive .tsg-timeline{
  background: rgba(4,10,20,.70);
}

.tsg-timeline{
  border-top:1px solid rgba(120,140,170,.24);
  background: rgba(4,10,20,.94);
}

.tsg-timeline .tsg-hour-grid{
  min-height: var(--tsg-row-h);
  background-image: repeating-linear-gradient(
    to right,
    rgba(120,140,170,.28) 0,
    rgba(120,140,170,.28) 1px,
    transparent 1px,
    transparent var(--tsg-hour-px, 120px)
  );
}

.tsg-block{
  position:absolute;
  top:5px;
  bottom:5px;
  padding:0 10px;
  border-radius:4px;
  border:2px solid var(--task-color, #93c5fd);
  background: color-mix(in srgb, var(--task-color, #93c5fd) 32%, rgba(255,255,255,.08));
  color: var(--task-text, #fff);
  display:flex;
  align-items:center;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.12);
}

.tsg-block-label{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:14px;
  font-weight:900;
}

.tsg-block[data-task-type="mailbox_manager"]{ border-color: var(--theme-mailbox_manager, var(--task-color, #c4b5fd)); background: color-mix(in srgb, var(--theme-mailbox_manager, var(--task-color, #c4b5fd)) 40%, rgba(255,255,255,.12)); }
.tsg-block[data-task-type="back_office"]{ border-color: var(--theme-back_office, var(--task-color, #fdba74)); background: color-mix(in srgb, var(--theme-back_office, var(--task-color, #fdba74)) 40%, rgba(255,255,255,.12)); }
.tsg-block[data-task-type="call_available"],
.tsg-block[data-task-type="call_onqueue"]{ border-color: var(--theme-call_available, var(--theme-call_onqueue, var(--task-color, #86efac))); background: color-mix(in srgb, var(--theme-call_available, var(--theme-call_onqueue, var(--task-color, #86efac))) 40%, rgba(255,255,255,.12)); }
.tsg-block[data-task-type="lunch"]{ border-color: var(--theme-lunch, var(--task-color, #94a3b8)); background: color-mix(in srgb, var(--theme-lunch, var(--task-color, #94a3b8)) 40%, rgba(255,255,255,.12)); }

.tsg-coverage .tsg-name,
.tsg-coverage .tsg-timeline{ background: rgba(8,14,24,.98); }

.tsg-coverage-grid .tsg-coverage-cell{
  min-height:48px;
  padding:12px 8px;
  border-top:1px solid rgba(255,255,255,.16);
}

.team-schedule-body{ position:relative; }

.tsg-nowline{
  position:absolute;
  top:0;
  bottom:0;
  width:2px;
  background:#ef4444;
  box-shadow: 0 0 0 1px rgba(239,68,68,.34), 0 0 12px rgba(239,68,68,.5);
  z-index:11;
  pointer-events:none;
}

.tsg-nowline span{
  position:sticky;
  top:56px;
  margin-left:6px;
  display:inline-block;
  font-size:11px;
  font-weight:900;
  border-radius:999px;
  padding:3px 7px;
  color:#fff;
  background: rgba(239,68,68,.95);
}

/* ------------------------------------------------------------------
   Responsive / density tweaks
   ------------------------------------------------------------------ */

@media (max-width: 1100px){
  .schx-kpis{ grid-template-columns: repeat(4, minmax(0,1fr)); }
}
@media (max-width: 720px){
  .schx-day-layout{ grid-template-columns: 1fr; }
  .schx-grid{ grid-template-columns: 1fr; }
  .schx-ruler, .schedule-ruler{ display:none; }
  .schx-day{ min-width:0; }
  .schx-kpis{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .schx-header-cta{ margin-left:0; }
  /* reduce hour height on mobile to avoid excessive scrolling */
  .schx{ --schx-row-h: 48px; }
}

@media (max-width: 900px){
  .schedule-block{ padding:10px; border-radius:16px; }
  .task-label{ font-size:11px; padding:6px 9px; }
}


/* ------------------------------------------------------------------
   Members — Floating Graphical Task Status Panel (13126-11)
   ------------------------------------------------------------------ */

.graph-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:12px;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}
.graph-toggle input{
  width:16px;
  height:16px;
  accent-color: var(--accent, #4f8bff);
}

.graph-status-panel{
  position:fixed;
  right: 18px;
  bottom: 18px;
  width: 520px;
  height: 360px;
  min-width: 320px;
  min-height: 240px;
  max-width: calc(100vw - 24px);
  max-height: calc(100vh - 24px);
  z-index: 120;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(15,27,46,.98), rgba(12,22,40,.98));
  box-shadow: 0 18px 48px rgba(0,0,0,.45);
  overflow: hidden;
  resize: both;
}

/* Phase 1-505: floating panel must always be on top */
.graph-status-panel.gsp-floating{
  position: fixed;
  z-index: 9999;
}

/* Phase 1-505: default anchor to avoid bottom bars */
.graph-status-panel.gsp-float-anchor{
  right: 18px;
  bottom: 64px;
}

/* Phase 1-505: resize handles (edges + corners) */
.graph-status-panel.gsp-resizable{
  /* keep base resize handle as fallback, but handles enable edge resizing */
}
.gsp-resize-handle{
  position:absolute;
  z-index: 3;
  background: transparent;
  touch-action: none;
}
.gsp-rh-n, .gsp-rh-s{ left: 10px; right: 10px; height: 10px; }
.gsp-rh-n{ top: 0; cursor: ns-resize; }
.gsp-rh-s{ bottom: 0; cursor: ns-resize; }
.gsp-rh-e, .gsp-rh-w{ top: 10px; bottom: 10px; width: 10px; }
.gsp-rh-e{ right: 0; cursor: ew-resize; }
.gsp-rh-w{ left: 0; cursor: ew-resize; }
.gsp-rh-ne, .gsp-rh-nw, .gsp-rh-se, .gsp-rh-sw{ width: 14px; height: 14px; }
.gsp-rh-ne{ top: 0; right: 0; cursor: nesw-resize; }
.gsp-rh-nw{ top: 0; left: 0; cursor: nwse-resize; }
.gsp-rh-se{ bottom: 0; right: 0; cursor: nwse-resize; }
.gsp-rh-sw{ bottom: 0; left: 0; cursor: nesw-resize; }
.graph-status-panel.gsp-resizing{
  outline: 2px solid rgba(79,139,255,.25);
  outline-offset: -2px;
}

.graph-status-panel .gsp-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  user-select:none;
  cursor: move;
}
.graph-status-panel .gsp-head.dragging{
  background: rgba(255,255,255,.03);
}

.graph-status-panel .gsp-title{
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .2px;
}
.graph-status-panel .gsp-sub{
  font-size: 12px;
  color: rgba(255,255,255,.65);
  margin-top: 2px;
}

.graph-status-panel .gsp-body{
  padding: 12px 14px;
  overflow:auto;
  height: calc(100% - 96px);
}

.graph-status-panel .gsp-foot{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding: 10px 14px;
  border-top: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.10);
  font-size: 12px;
}

.gsp-row{
  display:grid;
  grid-template-columns: 180px 1fr;
  gap: 12px;
  align-items:center;
  padding: 10px 10px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.03);
  margin-bottom: 10px;
}

.gsp-row.member-highlight{
  border-color: rgba(79,139,255,.55);
  box-shadow: 0 0 0 3px rgba(79,139,255,.12);
}

.gsp-name{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.gsp-name .name{
  font-weight: 700;
  font-size: 13px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.gsp-name .meta{
  font-size: 12px;
  color: rgba(255,255,255,.65);
  margin-top: 2px;
}

.gsp-bar{
  position:relative;
  height: 16px;
  border-radius: 999px;
  overflow:hidden;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  display:flex;
}

.task-bar{
  height: 100%;
  min-width: 3px;
  background: var(--c, #4f8bff);
  transition: width .18s ease, opacity .18s ease;
}
.task-bar:hover{
  opacity: .92;
}

/* Graph panel controls + governance notices (Phase 1-500) */
.gsp-controls{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  padding:8px 10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.14);
  margin-bottom: 12px;
}
.gsp-controls label{
  font-size:11px;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;
  color: rgba(255,255,255,.70);
}
.gsp-controls .input{
  padding:6px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);
}
.gsp-controls .input:focus{
  outline: none;
  box-shadow: 0 0 0 3px rgba(79,139,255,.20);
  border-color: rgba(79,139,255,.45);
}
.gsp-controls-hint{
  margin-left:auto;
}

.gsp-note{
  margin-top:6px;
  padding:6px 8px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.78);
  font-size:12px;
  line-height:1.35;
}
.gsp-note.low{
  border-color: rgba(34,211,238,.35);
  background: rgba(34,211,238,.10);
  color: rgba(224,252,255,.92);
}
.gsp-note.high{
  border-color: rgba(255,162,26,.40);
  background: rgba(255,162,26,.12);
  color: rgba(255,245,232,.92);
}

/* Governance tooltip (enterprise-grade) */
.gsp-gov{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:6px;
}
.gsp-govbadge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  color: rgba(255,255,255,.88);
  cursor:help;
}
.gsp-govbadge:focus{
  outline:none;
  box-shadow:0 0 0 3px rgba(79,139,255,.22);
}
.gsp-govtip{
  display:none;
  position:absolute;
  left:0;
  top: calc(100% + 8px);
  width:min(520px, calc(100vw - 64px));
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(8,12,22,.95);
  backdrop-filter: blur(8px);
  color: rgba(255,255,255,.92);
  font-size:12px;
  line-height:1.4;
  box-shadow: 0 14px 32px rgba(0,0,0,.35);
  z-index: 20;
}
.gsp-gov:hover .gsp-govtip,
.gsp-gov:focus-within .gsp-govtip{
  display:block;
}
.gsp-govtip.low{
  border-color: rgba(34,211,238,.35);
}
.gsp-govtip.high{
  border-color: rgba(255,162,26,.40);
}
.gsp-govbadge.low{
  border-color: rgba(34,211,238,.35);
  background: rgba(34,211,238,.10);
  color: rgba(224,252,255,.95);
}
.gsp-govbadge.high{
  border-color: rgba(255,162,26,.40);
  background: rgba(255,162,26,.12);
  color: rgba(255,245,232,.95);
}

@media (max-width: 900px){
  .graph-status-panel{ width: calc(100vw - 24px); height: 320px; right: 12px; bottom: 12px; }
  .gsp-row{ grid-template-columns: 140px 1fr; }
  .gsp-controls-hint{ flex-basis:100%; margin-left:0; }
}

/* ------------------------------------------------------------------
   Graph Panel: Priority Badges + Analytics Views (Phase 1-503)
   ------------------------------------------------------------------ */

.gsp-pri{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:6px;
}

.gsp-badge{
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  color: rgba(255,255,255,.90);
  cursor:help;
  user-select:none;
}
.gsp-badge:focus{
  outline:none;
  box-shadow:0 0 0 3px rgba(79,139,255,.22);
}

.gsp-badge.pri-high{
  border-color: rgba(255,82,82,.38);
  background: rgba(255,82,82,.12);
  color: rgba(255,235,235,.98);
}
.gsp-badge.pri-balanced{
  border-color: rgba(34,197,94,.35);
  background: rgba(34,197,94,.12);
  color: rgba(230,255,241,.95);
}
.gsp-badge.pri-over{
  border-color: rgba(255,162,26,.40);
  background: rgba(255,162,26,.12);
  color: rgba(255,245,232,.95);
}

.gsp-tip{
  display:none;
  position:absolute;
  left:0;
  top: calc(100% + 8px);
  width:min(520px, calc(100vw - 64px));
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(8,12,22,.95);
  backdrop-filter: blur(8px);
  color: rgba(255,255,255,.92);
  font-size:12px;
  line-height:1.4;
  box-shadow: 0 14px 32px rgba(0,0,0,.35);
  z-index: 25;
}
.gsp-pri:hover .gsp-tip,
.gsp-pri:focus-within .gsp-tip{
  display:block;
}
.gsp-tip.pri-high{ border-color: rgba(255,82,82,.40); }
.gsp-tip.pri-over{ border-color: rgba(255,162,26,.45); }

/* Controls layout (task + analytics view) */
.gsp-controls .gsp-field{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

/* Visualization containers */
.gsp-viz{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  min-height: 16px;
}

.gsp-pie{
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.10);
  background: conic-gradient(var(--c, #4f8bff) calc(var(--p, 0)*1%), rgba(255,255,255,.08) 0);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.20);
}
.gsp-donut{
  position:relative;
}
.gsp-donut::after{
  content:'';
  position:absolute;
  inset: 10px;
  border-radius:999px;
  background: rgba(8,12,22,.92);
  border:1px solid rgba(255,255,255,.08);
}

.gsp-stackcol{
  position:relative;
  width: 22px;
  height: 46px;
  border-radius: 10px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  overflow:hidden;
}
.gsp-stackcol .fill{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height: calc(var(--p, 0) * 1%);
  background: var(--c, #4f8bff);
  opacity: .95;
}

.gsp-heat{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  width: 100%;
}
.gsp-heat .cell{
  position:relative;
  height: 14px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.05);
  overflow:hidden;
}
.gsp-heat .cell::after{
  content:'';
  position:absolute;
  inset:0;
  background: var(--c, #4f8bff);
  opacity: var(--a, 0);
}

.gsp-radar{
  width: 76px;
  height: 60px;
}
.gsp-radar svg{
  width: 100%;
  height: 100%;
}
.gsp-radar .grid{
  fill:none;
  stroke: rgba(255,255,255,.10);
  stroke-width: 1;
}
.gsp-radar .poly{
  fill: color-mix(in srgb, var(--c, #4f8bff) 26%, transparent);
  stroke: var(--c, #4f8bff);
  stroke-width: 2;
}

.gsp-vizwrap{ width:100%; justify-content:flex-end; }
.gsp-vizwrap.gsp-heat{ justify-content:flex-start; }



/* === Graph Panel Landscape Rebuild (Phase 1-504) === */
.graph-status-panel.gsp-landscape{
  width: 820px;
  height: 440px;
  max-width: calc(100vw - 24px);
  max-height: calc(100vh - 24px);
}

/* Landscape table layout (matches sample) */
.gsp-landscape-table{
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.12);
  overflow:hidden;
  margin-top: 10px;
}

.gsp-thead{
  display:grid;
  grid-template-columns: 240px 1fr;
  gap: 0;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}

.gsp-th{
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.70);
}

.gsp-tbody{
  display:block;
}

.gsp-tr{
  display:grid;
  grid-template-columns: 240px 1fr;
  align-items:center;
  gap: 0;
  padding: 9px 12px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.gsp-tr:last-child{
  border-bottom:none;
}

/* Phase 1-505: highlight selected member in Graph Panel */
.gsp-tr.gsp-highlighted{
  background: rgba(79,139,255,.10);
}

.gsp-td-name{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  font-weight: 800;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 12px;
  border-right: 1px solid rgba(255,255,255,.06);
}
.gsp-td-name .gsp-member{
  overflow:hidden;
  text-overflow: ellipsis;
}
.gsp-td-name .gsp-hours{
  flex: 0 0 auto;
  font-weight: 900;
  font-size: 12px;
  color: rgba(255,255,255,.78);
}

.gsp-td-bar{
  padding-left: 12px;
}

/* Percent-based progress bar cell */
.gsp-progress{
  width: 100%;
}
.gsp-progress-track{
  position: relative;
  height: 22px;
  border-radius: 999px;
  overflow:hidden;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  --p: 0;
  --c: var(--gsp-bar, #4f8bff);
}
.gsp-progress-fill{
  height: 100%;
  width: calc(var(--p, 0) * 1%);
  background: var(--c);
  border-radius: 999px;
  transition: width .18s ease, opacity .18s ease;
  min-width: 3px;
}
.gsp-progress-label{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  left: max(10px, calc(var(--p, 0) * 1% - 34px));
  font-weight: 900;
  font-size: 12px;
  color: rgba(255,255,255,.95);
  text-shadow: 0 1px 2px rgba(0,0,0,.45);
  pointer-events:none;
}

/* Per-task styling hooks */
.gsp-task-mailbox{ --gsp-bar: #f59e0b; }
.gsp-task-call{ --gsp-bar: #16a34a; }
.gsp-task-backoffice{ --gsp-bar: #f59e0b; }
.gsp-task-generic{ --gsp-bar: #4f8bff; }

/* Max-hours settings grid */
.gsp-settings{
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.12);
}
.gsp-settings-title{
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
}
.gsp-max-grid{
  margin-top: 10px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 820px){
  .gsp-thead, .gsp-tr{ grid-template-columns: 180px 1fr; }
  .gsp-max-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px){
  .graph-status-panel.gsp-landscape{ width: calc(100vw - 24px); height: 70vh; }
  .gsp-thead, .gsp-tr{ grid-template-columns: 150px 1fr; }
  .gsp-max-grid{ grid-template-columns: 1fr; }
}
.gsp-max-item{
  padding: 8px 10px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}
.gsp-max-item .lbl{
  font-size: 12px;
  font-weight: 800;
  color: rgba(255,255,255,.88);
  margin-bottom: 6px;
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
}
.gsp-max-item .input{
  width: 100%;
}

/* ------------------------------------------------------------------
   Phase 1-506: Members page compression + REPORTS dropdown
   ------------------------------------------------------------------ */

/* Compressed member row: reduce vertical space so more users fit onscreen */
.members-row{
  padding: 6px 10px !important;
  gap: 10px !important;
}
.members-row .members-meta{
  gap: 2px !important;
}
.members-row .m-name{
  gap: 8px !important;
}
.members-row .m-name-text{
  line-height: 1.1;
}
.members-row .status-pill{
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 999px;
  margin-left: 6px;
}
.members-row .timeline-wrap{
  gap: 4px !important;
}

/* Compact workload line (replaces pill badges) */
.member-task-stats{
  font-size: 10px;
  line-height: 1.15;
  color: rgba(255,255,255,.62);
  margin: 0 0 4px 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* REPORTS dropdown (hover-open + polished menu) */
.reports-dropdown{
  position: relative;
  display: inline-flex;
  align-items: center;
  z-index: 9000;
}
.reports-toggle{
  border-radius: 12px;
}
.reports-menu{
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 240px;
  padding: 8px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(15,27,46,.98), rgba(12,22,40,.98));
  box-shadow: 0 18px 48px rgba(0,0,0,.45);
  backdrop-filter: blur(8px);
  display: none;
  z-index: 10001;
}
.reports-dropdown.open .reports-menu,
.reports-dropdown:hover .reports-menu,
.reports-dropdown:focus-within .reports-menu{
  display: block;
}
.reports-item{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: transparent;
  color: rgba(255,255,255,.92);
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}
.reports-item:hover,
.reports-item:focus{
  background: rgba(79,139,255,.10);
  border-color: rgba(79,139,255,.22);
  outline: none;
}
.reports-item:active{
  transform: translateY(1px);
}

/* ------------------------------------------------------------------
   Phase 1-508: Members UX anchors + progress bars + grid compression
   ------------------------------------------------------------------ */

/* Member progress bar under name (0–60 green, 61–85 orange, 86–100 red)
   Phase 1-510: Tooltip label centered below the progress bar in the member name section.
*/
.member-progress{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  margin-top:2px;
  min-width:0;
  max-width:100%;
  width:100%;
  overflow:hidden;
  line-height:1;
}

/* Track + bar (new markup) */
.progress-track{
  width:100%;
  max-width:100%;
  height:6px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  overflow:hidden;
  box-sizing:border-box;
}
.progress-bar{
  height:100%;
  border-radius:999px;
  transition:width .18s ease;
  max-width:100%;
}
.progress-text{
  display:inline-flex;
  width:auto;
  font-size:inherit;
  color:rgba(255,255,255,.70);
  text-align:right;
}
.progress-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  gap:8px;
  font-size:10px;
  line-height:1.1;
}
.progress-tooltip{
  display:inline-flex;
  width:auto;
  text-align:left;
  font-size:inherit; /* same as .progress-text */
  color:rgba(255,255,255,.65);
  margin-top:0;
  opacity:.9;
  transform:none;
  transition:opacity .16s ease;
  pointer-events:none;
}

.member-progress:hover .progress-tooltip,
.member-progress:focus-within .progress-tooltip{
  opacity:1;
}
@media (prefers-reduced-motion: reduce){
  .progress-tooltip{transition:none;transform:none;}
}

/* Threshold colors (requested enterprise hex values) */
.progress-green{background-color:#4CAF50;}
.progress-orange{background-color:#FF9800;}
.progress-red{background-color:#F44336;}

/* Back-compat selectors (older markup) */
.member-progress-track{flex:1;height:6px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);overflow:hidden}
.member-progress-fill{height:100%;border-radius:999px;transition:width .18s ease;max-width:100%}
.member-progress-pct{font-size:inherit;line-height:1;color:rgba(255,255,255,.70);text-align:right}
.member-progress-fill.pct-green{background-color:#4CAF50;}
.member-progress-fill.pct-orange{background-color:#FF9800;}
.member-progress-fill.pct-red{background-color:#F44336;}

body[data-mode="light"] .progress-track,
body[data-mode="light"] .member-progress-track{border-color:rgba(15,23,42,.14);background:rgba(15,23,42,.04)}
body[data-mode="light"] .progress-text,
body[data-mode="light"] .member-progress-pct{color:rgba(15,23,42,.66)}
body[data-mode="light"] .progress-tooltip{color:#555;}

/* Fixed anchors: Team dropdown + Week selector + Lock bar */
.members-topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.members-topbar-left{min-width:0}
.members-topbar-right{display:flex;align-items:flex-start;justify-content:flex-end;gap:14px;flex-wrap:nowrap;position:sticky;top:10px;z-index:3500}
.members-teamctl{min-width:210px}
.weekctl{min-width:520px}
.weekctl-row{display:flex;gap:10px;align-items:center;justify-content:flex-end;flex-wrap:nowrap}
.week-warn{max-width:520px}
@media (max-width: 980px){
  .members-topbar-right{transform:scale(.92);transform-origin:top right}
}
@media (max-width: 820px){
  .weekctl{min-width:460px}
  .members-teamctl{min-width:190px}
}
@media (max-width: 720px){
  .members-topbar{flex-direction:column;align-items:stretch}
  .members-topbar-right{justify-content:flex-start;transform:none}
  .weekctl{min-width:0;width:100%}
  .members-teamctl{min-width:0;width:100%}
  .weekctl-row{justify-content:flex-start;flex-wrap:wrap}
  .week-warn{max-width:100%;text-align:left}
}

/* Block grid compression (~20%): row spacing, columns, timeline + ruler alignment */
.members-page #schedulePane{padding:10px !important}
.members-page .members-wrap{gap:10px !important}
.members-page .members-table{display:flex;flex-direction:column;gap:8px}
.members-page .members-row{display:grid !important;padding:8px 15px !important;gap:12px !important;grid-template-columns:240px 1fr 220px !important;grid-template-areas:"meta timeline actions" !important;align-items:center !important;border-radius:14px;position:relative;overflow:visible !important;min-height:50px !important}
.members-page .timeline-ruler{grid-template-columns:240px 1fr 220px !important;gap:10px !important;height:18px !important;margin-bottom:6px !important}
.members-page .timeline-ruler .ruler-track{height:18px !important}
.members-page .timeline-ruler .mark{font-size:10px !important}
.members-page .timeline{grid-area:timeline !important;position:relative;overflow:hidden;border-radius:8px !important;height:32px !important;z-index:1 !important;background:rgba(255,255,255,0.02) !important}
.members-page .timeline .seg{top:3px !important;bottom:3px !important;font-size:10px !important;padding:0 5px !important}

/* Leave dropdown */
.members-page .member-actions{grid-area:actions !important;display:flex !important;flex-direction:row !important;align-items:center !important;justify-content:flex-end !important;gap:10px !important;padding-left:10px;border-left:1px solid rgba(255,255,255,0.08)}
.members-page .leave-actions{grid-area:leave !important;display:flex !important;align-items:center !important;gap:6px;flex-wrap:nowrap;justify-content:flex-end !important;visibility:visible !important;z-index:10 !important}
.members-page .leave-field{grid-area:leave !important;display:flex !important;align-items:center !important;gap:6px;font-size:12px;color:#e2e8f0;justify-content:flex-end !important;visibility:visible !important;z-index:10 !important}
.members-page .leave-label{font-weight:600;letter-spacing:.01em;display:inline-flex;visibility:visible;opacity:1;color:#e2e8f0}
.members-page .leave-select{display:inline-flex !important;align-items:center !important;justify-content:flex-start !important;width:140px !important;height:32px !important;line-height:1 !important;padding:0 32px 0 10px !important;border-radius:8px !important;font-size:11px !important;font-weight:800 !important;min-width:130px !important;max-width:140px !important;color:#fff !important;background-color:#111827 !important;border:1px solid rgba(255,255,255,0.1) !important;appearance:none !important;cursor:pointer;transition:all 0.2s ease;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e") !important;background-position:right 8px center !important;background-repeat:no-repeat !important;background-size:16px !important}
.members-page .iconbtn{flex-shrink:0 !important;width:32px !important;height:32px !important;display:flex !important;align-items:center !important;justify-content:center !important;background:rgba(255,255,255,0.05) !important;border:1px solid rgba(255,255,255,0.1) !important;border-radius:6px !important;transition:all 0.2s ease}
.members-page .iconbtn:not([data-act="edit"]):hover{background:rgba(6,182,212,0.15) !important;border-color:#06b6d4 !important;color:#06b6d4 !important}
.members-page .iconbtn[data-act="edit"],
.members-page button[title="Edit schedule"]{grid-area:pencil !important;background:transparent !important;border:none !important;color:#06b6d4 !important;width:32px !important;height:32px !important;cursor:pointer;transition:all 0.2s ease;display:flex !important;align-items:center !important;justify-content:center !important;visibility:visible !important;z-index:10 !important}
.members-page .iconbtn[data-act="edit"]:hover{color:#06b6d4 !important;transform:scale(1.15)}
.members-page .leave-select option{background-color:#111827 !important;color:#fff !important;padding:10px !important}
.members-page .leave-select:focus,
.members-page .leave-select:active{outline:none !important;border-color:#06b6d4 !important;box-shadow:0 0 0 3px rgba(6,182,212,0.25) !important}
.members-page .leave-select:hover{border-color:rgba(6,182,212,0.5) !important}

/* Members overlay background compression (~20%): reduce vertical density in key controls */
.members-page .timeline-legend{margin-bottom:8px}
.members-page .sched-toolbar{gap:10px}
.members-page .sched-toolbar .left{gap:8px}
.members-page .coverage-panel{margin-top:8px !important}

/* =====================================================================
   MEMBERS — ENTERPRISE FULLSCREEN OVERLAY (Option A + Dark Glass Mode)
   ===================================================================== */

body.members-fullscreen-active {
  overflow: hidden; /* lock page scroll (panels retain their own scrolling) */
}

.members-fullscreen-overlay {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 0;
  background: linear-gradient(180deg, rgba(5, 8, 14, 0.96) 0%, rgba(6, 10, 18, 0.92) 45%, rgba(5, 8, 14, 0.96) 100%);
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
}

.members-fullscreen-overlay .members-topbar,
.members-fullscreen-overlay .daytabs {
  flex: 0 0 auto;
}
.members-fullscreen-overlay .members-topbar{
  padding:10px 12px;
  gap:12px;
}
.members-fullscreen-overlay .members-topbar-zone-right{
  gap:10px;
}

.members-fullscreen-overlay .members-enterprise-grid {
  --members-gap: 12px;
  --members-left: 280px;
  --members-right: 320px;

  flex: 1 1 auto;
  min-height: 0;

  display: grid;
  grid-template-columns: var(--members-left) 10px 1fr 10px var(--members-right);
  grid-template-rows: 1fr;
  gap: 0;

  height: 100%;
  padding: var(--members-gap);
  box-sizing: border-box;
}

/* Panels */
.members-fullscreen-overlay .card {
  border: 1px solid rgba(255,255,255,0.07);
  background: rgba(10, 16, 26, 0.60);
  box-shadow: 0 18px 40px rgba(0,0,0,0.35);
  backdrop-filter: blur(14px) saturate(135%);
  -webkit-backdrop-filter: blur(14px) saturate(135%);
}

.members-fullscreen-overlay .members-roster,
.members-fullscreen-overlay .members-timeline,
.members-fullscreen-overlay .members-analytics-rail {
  display: flex;
  flex-direction: column;
  min-height: 0; /* enables internal scrolling */
  overflow: hidden; /* scrolling happens on child containers */
}

/* Sticky headers / toolbars */
.members-fullscreen-overlay .members-roster-header {
  position: sticky;
  top: 0;
  z-index: 15;
  background: rgba(10, 16, 26, 0.70);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  backdrop-filter: blur(10px) saturate(130%);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
}

.members-fullscreen-overlay .members-timeline-toolbar {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(10, 16, 26, 0.68);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  margin: 10px 10px 0 10px;
  backdrop-filter: blur(12px) saturate(135%);
  -webkit-backdrop-filter: blur(12px) saturate(135%);
}

.members-fullscreen-overlay .members-analytics-header {
  position: sticky;
  top: 0;
  z-index: 15;
  background: rgba(10, 16, 26, 0.70);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  backdrop-filter: blur(10px) saturate(130%);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
}

/* Panel scrolling */
.members-fullscreen-overlay .members-roster-list {
  overflow-y: auto;
  min-height: 0;
  padding-bottom: 8px;
}

.members-fullscreen-overlay .members-timeline-scroll {
  overflow-y: auto;
  min-height: 0;
  padding: 10px;
}

.members-fullscreen-overlay .members-analytics-body {
  overflow-y: auto;
  min-height: 0;
  padding: 0 14px 14px;
}

/* Splitters */
.members-fullscreen-overlay .members-splitter {
  border-radius: 999px;
  background: rgba(255,255,255,0.06);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.30);
  cursor: col-resize;
}

.members-fullscreen-overlay .members-splitter:hover {
  background: rgba(255,255,255,0.10);
}

.members-fullscreen-overlay .members-splitter:focus {
  outline: 2px solid rgba(120, 190, 255, 0.55);
  outline-offset: 2px;
}

/* Timeline legend chips (Option B) */
.members-fullscreen-overlay .timeline-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.members-fullscreen-overlay .legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.07);
}

.members-fullscreen-overlay .legend-item:hover {
  background: rgba(255,255,255,0.09);
}

/* Z-index policy (local to overlay) */
.members-fullscreen-overlay .members-row,
.members-fullscreen-overlay .timeline {
  position: relative;
  z-index: 10;
}

.members-fullscreen-overlay .seg {
  position: absolute;
  z-index: 10;
}

.members-fullscreen-overlay .timeline-heatmap,
.members-fullscreen-overlay .timeline-overlay,
.members-fullscreen-overlay .heatmap-overlay,
.members-fullscreen-overlay .coverage-panel .heatmap-overlay,
.members-fullscreen-overlay .coverage-panel .timeline-heatmap {
  z-index: 20;
  pointer-events: none;
}

.members-fullscreen-overlay .tooltip,
.members-fullscreen-overlay .dropdown-menu,
.members-fullscreen-overlay .reports-menu {
  z-index: 40;
}

/* Coverage meter + heatmap ready */
.members-fullscreen-overlay .coverage-panel {
  border-radius: 14px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06);
}

.members-fullscreen-overlay .coverage-panel .bar,
.members-fullscreen-overlay .coverage-panel .cell {
  transition: transform 120ms ease, filter 120ms ease;
}

.members-fullscreen-overlay .coverage-panel .bar:hover,
.members-fullscreen-overlay .coverage-panel .cell:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
}

/* Focus / accessibility */
.members-fullscreen-overlay :focus-visible {
  outline: 2px solid rgba(120, 190, 255, 0.55);
  outline-offset: 2px;
}


/* ===== Members (Option A Utility Subset) ===== */

.hidden{ display:none !important; }
.font-sans{ font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji"; }
.tracking-tight{ letter-spacing:-0.015em; }
.transition{ transition: all 150ms ease; }
.mt-3{ margin-top:0.75rem; }
.mt-1{ margin-top:0.25rem; }
.mt-2{ margin-top:0.5rem; }
.mb-2{ margin-bottom:0.5rem; }
.mb-3{ margin-bottom:0.75rem; }

.flex{ display:flex; }
.flex-wrap{ flex-wrap:wrap; }
.items-center{ align-items:center; }
.justify-end{ justify-content:flex-end; }
.justify-between{ justify-content:space-between; }
.gap-2{ gap:0.5rem; }
.gap-3{ gap:0.75rem; }
.self-end{ align-self:flex-end; }
.text-right{ text-align:right; }

.leading-snug{ line-height:1.375; }
.whitespace-pre-wrap{ white-space: pre-wrap; }

.font-extrabold{ font-weight:800; }
.font-black{ font-weight:900; }

.max-w-5xl{ max-width:64rem; }
.badge-ok{ color: var(--text); }

.bg-zinc-950{ background-color:#09090b; }
.bg-zinc-900\/50{ background-color: rgba(24,24,27,0.5); }
.bg-zinc-800\/50{ background-color: rgba(39,39,42,0.5); }
.bg-white\/5{ background-color: rgba(255,255,255,0.05); }
.border-zinc-800{ border-color:#27272a; }
.text-zinc-100{ color:#f4f4f5; }
.text-zinc-400{ color:#a1a1aa; }

.members-page{
  min-height:100vh;
  background:#09090b;
  color:#f4f4f5;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial;
}

.members-topbar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:14px 16px;
  border:1px solid #27272a;
  border-radius:12px;
  background: rgba(24,24,27,0.35);
  backdrop-filter: blur(10px);
}

.members-topbar-left{ min-width:260px; }
.members-h1{ font-size:18px; font-weight:650; }
.members-sub{ font-size:12.5px; line-height:1.35; margin-top:4px; max-width:64ch; }
.members-topbar-right{ display:flex; align-items:flex-start; gap:12px; flex-wrap:wrap; justify-content:flex-end; }

.members-field{ display:flex; flex-direction:column; gap:6px; }
.label{ font-size:12px; }

.members-weekctl{ display:flex; flex-direction:column; gap:6px; }
.members-weekctl-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }

.members-enterprise-grid{
  display:grid;
  grid-template-columns: minmax(240px,18%) 10px minmax(640px,62%) 10px minmax(280px,20%);
  gap:0;
  padding:14px 0 0;
  align-items:stretch;
  height: calc(100vh - 92px);
}

body:not(.members-fullscreen-active) .members-enterprise-grid{
  grid-template-columns: minmax(240px,18%) 10px minmax(640px,82%);
}
body:not(.members-fullscreen-active) #membersSplitRight,
body:not(.members-fullscreen-active) #membersAnalyticsRail{
  display:none;
}
body:not(.members-fullscreen-active) .members-topbar{
  padding:10px 12px;
  gap:12px;
}
body:not(.members-fullscreen-active) .members-topbar-zone-right{
  gap:10px;
}
body:not(.members-fullscreen-active) .members-timeline-toolbar .hint,
body:not(.members-fullscreen-active) .members-tip{
  display:none;
}
body:not(.members-fullscreen-active) .members-sub{
  display:none;
}
body:not(.members-fullscreen-active) .members-enterprise-grid{
  padding-top: 8px;
}
.members-page .week-warn{ margin-top:6px; }
.members-fullscreen-overlay #membersAnalyticsRail{
  display:flex;
}

@media (max-width: 1100px){
  .members-enterprise-grid{ grid-template-columns: 1fr; height:auto; }
  .members-splitter{ display:none; }
}

.members-splitter{
  background: transparent;
  cursor: col-resize;
  position:relative;
}
.members-splitter::after{
  content:'';
  position:absolute;
  top:10px;
  bottom:10px;
  left:50%;
  width:2px;
  transform: translateX(-50%);
  border-radius:999px;
  background: rgba(255,255,255,0.06);
}
.members-splitter:focus::after{ background: rgba(59,130,246,0.6); }

.members-page .card{
  background: rgba(24,24,27,0.5);
  border:1px solid #27272a;
  border-radius:12px;
  box-shadow: 0 14px 40px rgba(0,0,0,0.35);
}

.members-page .input{
  background: rgba(39,39,42,0.55);
  border:1px solid rgba(255,255,255,0.09);
  color:#f4f4f5;
  border-radius:10px;
  padding:8px 10px;
  font-size:14px;
  outline:none;
}
.members-page .input:focus{
  border-color: rgba(59,130,246,0.6);
  box-shadow: 0 0 0 4px rgba(59,130,246,0.15);
}
.members-page #paintRole{
  --paint-dot-color: transparent;
  padding-left: 26px;
  background-image: radial-gradient(circle at 8px center, var(--paint-dot-color, transparent) 0 5px, transparent 6px);
  background-repeat: no-repeat;
  background-position: 6px center;
  background-size: 18px 100%;
}
.members-page #paintRole option{
  padding-left: 26px;
  background-repeat: no-repeat;
  background-position: 6px center;
  background-size: 18px 100%;
}

.btn{
  border:1px solid rgba(255,255,255,0.10);
  background: rgba(39,39,42,0.35);
  color:#f4f4f5;
  padding:8px 10px;
  border-radius:10px;
  font-size:13px;
  line-height:1;
  cursor:pointer;
  transition: all 150ms ease;
}
.btn:hover{ background: rgba(39,39,42,0.55); }
.btn:active{ transform: translateY(1px); }
.btn.primary{ background: rgba(59,130,246,0.75); border-color: rgba(59,130,246,0.55); }
.btn.primary:hover{ background: rgba(59,130,246,0.9); }
.btn.danger{ background: rgba(239,68,68,0.25); border-color: rgba(239,68,68,0.35); }
.btn.danger:hover{ background: rgba(239,68,68,0.32); }
.btn.ghost{ background: transparent; border-color: rgba(255,255,255,0.10); }
.btn.ghost:hover{ background: rgba(255,255,255,0.04); }
.schx-toggle .btn.ghost.active,.schx-toggle .btn.ghost.active:hover{
  background: rgba(80,160,255,0.30) !important;
  border-color: rgba(80,160,255,0.75) !important;
  border-width: 1.5px !important;
  color: #fff !important;
  font-weight: 700 !important;
  box-shadow: 0 0 0 2px rgba(80,160,255,0.20), 0 2px 8px rgba(80,160,255,0.20) !important;
}

.iconbtn{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.10);
  background: rgba(39,39,42,0.25);
  color:#f4f4f5;
  cursor:pointer;
  transition: all 150ms ease;
}
.iconbtn:hover{ background: rgba(39,39,42,0.45); }

.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:3px 8px;
  border-radius:999px;
  font-size:12px;
  border:1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);
  color:#a1a1aa;
}

.week-warn{
  border:1px solid rgba(255,255,255,0.10);
  border-radius:10px;
  padding:8px 10px;
  background: rgba(39,39,42,0.35);
  font-size:12.5px;
}

.members-roster, .members-timeline, .members-inspector{
  min-height:0;
  display:flex;
  flex-direction:column;
}
.members-roster-header{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:12px 12px 10px;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.members-roster-title{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
.h2{ font-size:14px; font-weight:650; }
.small{ font-size:12px; }
.members-roster-tools{ display:flex; gap:10px; }

.roster-searchbar{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  background: rgba(39,39,42,0.35);
  border:1px solid rgba(255,255,255,0.10);
  border-radius:12px;
  padding:8px 10px;
}
.search-ic{ width:16px; height:16px; color:#a1a1aa; }
.search-ic::before{ content:'🔎'; font-size:14px; line-height:1; opacity:0.9; }
.roster-search{ flex:1; border:0; background:transparent; padding:0; }
.roster-search:focus{ box-shadow:none; }
.roster-filter{ width:110px; }

.members-roster-list{
  overflow:auto;
  flex:1;
  min-height:0;
}
.roster-item{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  background: transparent;
  border:0;
  border-bottom:1px solid rgba(255,255,255,0.06);
  color:#f4f4f5;
  cursor:pointer;
  text-align:left;
  transition: all 150ms ease;
}
.roster-item:hover{ background: rgba(255,255,255,0.04); }
.roster-item.selected{ background: rgba(59,130,246,0.12); }
.roster-left{ display:flex; align-items:center; gap:10px; min-width:0; }
.roster-name{ font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.status-dot{
  width:10px; height:10px; border-radius:999px;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.6) inset;
}
.status-active{
  background: #10b981;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.6) inset, 0 0 0 5px rgba(16,185,129,0.14), 0 8px 20px rgba(16,185,129,0.18);
}
.status-inactive{ background: #71717a; box-shadow: 0 0 0 1px rgba(0,0,0,0.6) inset; }

.empty-state{
  padding:16px 12px;
  color:#a1a1aa;
  font-size:13px;
}

.members-timeline-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border-bottom:1px solid rgba(255,255,255,0.06);
  position: sticky;
  top:0;
  z-index:30;
  overflow: visible;
  background: rgba(24,24,27,0.5);
  backdrop-filter: blur(10px);
}
.mtb-left{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.mtb-mid{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:center; }
.mtb-right{ display:flex; align-items:center; gap:8px; }

/* Responsive toolbar polish (Enterprise): keep Settings + Auto Assign aligned on smaller screens */
@media (max-width: 980px){
  .members-timeline-toolbar{
    flex-wrap:wrap;
    align-items:flex-start;
  }
  .members-timeline-toolbar .mtb-left{
    flex: 1 1 auto;
    min-width: 260px;
  }
  .members-timeline-toolbar .mtb-mid{
    order: 3;
    width: 100%;
    justify-content: flex-start;
  }
  .members-timeline-toolbar .mtb-right{
    margin-left:auto;
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .members-timeline-toolbar .mtb-right .btn{
    white-space:nowrap;
  }
  /* Make the settings icon button visually consistent */
  .members-timeline-toolbar #taskSettingsBtn{
    padding:8px 10px !important;
    min-width:40px;
  }
}
@media (max-width: 640px){
  .members-timeline-toolbar #paintModeHint{
    display:none;
  }
  .members-timeline-toolbar .mtb-left{
    min-width: 0;
  }
  .members-timeline-toolbar .mtb-right{
    width:100%;
    order: 4;
  }
}

.hint{ font-size:12px; }

.timeline-legend{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  padding:6px 10px;
  background: rgba(0,0,0,0.18);
}
.timeline-legend.collapsed{ display:none; }

.legend-item{ display:inline-flex; align-items:center; gap:6px; font-size:12px; color:#a1a1aa; }
.legend-dot{ width:10px; height:10px; border-radius:999px; display:inline-block; box-shadow: 0 0 0 1px rgba(0,0,0,0.5) inset; }

.members-timeline-scroll{
  overflow:auto;
  min-height:0;
  flex:1;
  padding:12px;
}

.coverage-panel{
  border:1px solid rgba(255,255,255,0.10);
  border-radius:12px;
  padding:10px 12px;
  background: rgba(24,24,27,0.35);
  color:#f4f4f5;
}
.coverage-sticky{
  position: sticky;
  top: 0;
  z-index: 25;
  backdrop-filter: blur(12px);
}

.timeline-ruler{ margin-top:12px; }

.members-table{ margin-top:10px; }

.members-row{
  border:1px solid rgba(255,255,255,0.06);
  border-radius:12px;
  background: rgba(255,255,255,0.02);
  overflow:hidden;
}
.members-row + .members-row{ margin-top:10px; }
.members-row:nth-child(even){ background: rgba(255,255,255,0.05); }

.seg{
  position:absolute;
  top:6px;
  bottom:6px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.10);
  background: color-mix(in srgb, var(--seg-raw, #52525b) 55%, #09090b);
  color: var(--seg-fg, #f4f4f5);
  overflow:hidden;
  user-select:none;
}
.seg.is-selected{
  outline: 2px solid rgba(59,130,246,0.65);
  box-shadow: 0 0 0 4px rgba(59,130,246,0.14);
}
.seg .handle{ position:absolute; inset:0; }
.seg-lock{
  position:absolute;
  top:6px;
  right:6px;
  color: rgba(244,244,245,0.85);
  opacity:0.9;
}
.lock-ic{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:14px;
  height:14px;
  color: rgba(244,244,245,0.85);
}
.lock-ic::before{ content:'🔒'; font-size:12px; line-height:1; }

.seg.role-mailbox_manager{ --seg-raw:#2563eb; }
.seg.role-call_onqueue{ --seg-raw:#7c3aed; }
.seg.role-back_office{ --seg-raw:#0ea5e9; }
.seg.role-mailbox_call{ --seg-raw:#22c55e; }
.seg.role-lunch{ --seg-raw:#f59e0b; --seg-fg:#0b0f14; }
.seg.role-block{ --seg-raw:#64748b; }

.legend-dot.role-mailbox_manager{ background:#2563eb; }
.legend-dot.role-call_onqueue{ background:#7c3aed; }
.legend-dot.role-back_office{ background:#0ea5e9; }
.legend-dot.role-mailbox_call{ background:#22c55e; }
.legend-dot.role-lunch{ background:#f59e0b; }
.legend-dot.role-block{ background:#64748b; }

.locked-below{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:12px;
  color:#f4f4f5;
  background: rgba(24,24,27,0.65);
  backdrop-filter: blur(8px);
  z-index: 2;
  pointer-events: none;
}

.members-inspector{ padding:12px; }
.inspector-tabs{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:6px;
  padding:6px;
  border:1px solid rgba(255,255,255,0.10);
  border-radius:12px;
  background: rgba(0,0,0,0.18);
}
.tab{
  border:0;
  border-radius:10px;
  padding:10px 8px;
  background: transparent;
  color:#a1a1aa;
  font-size:13px;
  cursor:pointer;
  transition: all 150ms ease;
}
.tab:hover{ background: rgba(255,255,255,0.04); color:#f4f4f5; }
.tab.is-on{
  background: rgba(255,255,255,0.06);
  color:#f4f4f5;
  border:1px solid rgba(255,255,255,0.10);
}
.inspector-panels{ padding-top:10px; overflow:auto; min-height:0; flex:1; }
.inspector-panel{ padding:4px 2px; }

.legend-vert{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:6px 2px;
}
.legend-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 10px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:12px;
  background: rgba(255,255,255,0.03);
}
.legend-row .l-left{ display:flex; align-items:center; gap:10px; }
.legend-row .l-name{ font-size:13px; }
.legend-row .l-sub{ font-size:12px; color:#a1a1aa; }

.members-fullscreen-active{ overflow:hidden; }
.timeline-heatmap, .heatmap-overlay{ pointer-events:none !important; }


.switch{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 8px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.18);
  cursor:pointer;
  user-select:none;
}
.switch input{ display:none; }
.switch-ui{
  width:34px;
  height:20px;
  border-radius:999px;
  background: rgba(255,255,255,0.12);
  position:relative;
  transition: all 150ms ease;
}
.switch-ui::after{
  content:'';
  position:absolute;
  top:2px;
  left:2px;
  width:16px;
  height:16px;
  border-radius:999px;
  background: rgba(244,244,245,0.9);
  transition: all 150ms ease;
}
.switch input:checked + .switch-ui{ background: rgba(59,130,246,0.55); }
.switch input:checked + .switch-ui::after{ transform: translateX(14px); background: rgba(244,244,245,1); }
.switch-tx{ font-size:12.5px; color:#a1a1aa; }

.lock-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.10);
  background: rgba(39,39,42,0.25);
  color:#a1a1aa;
}
.lock-badge .lock-ic{ color:#a1a1aa; }


/* -------------------------------------------------------------------------
   Minimal utility additions for Members Graph Summary
   (Needed by renderGraphPanel -> #member-graph-container)
--------------------------------------------------------------------------- */
.p-4{ padding: 1rem; }
.border-b{ border-bottom-width: 1px; border-bottom-style: solid; }
.border-zinc-800\/50{ border-color: rgba(39,39,42,0.5); }

.text-xs{ font-size: 0.75rem; line-height: 1rem; }
.text-zinc-500{ color: #71717a; }
.text-emerald-400{ color: #34d399; }

.font-medium{ font-weight: 500; }
.font-mono{ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }

.w-full{ width: 100%; }
.h-full{ height: 100%; }
.h-1\.5{ height: 0.375rem; }

.rounded-full{ border-radius: 9999px; }
.overflow-hidden{ overflow: hidden; }

.bg-zinc-800{ background-color: #27272a; }
.bg-emerald-500{ background-color: #10b981; }

.transition-all{ transition-property: all; transition-timing-function: cubic-bezier(0.4,0,0.2,1); }
.duration-500{ transition-duration: 500ms; }


/* ------------------------------------------------------------------
   Members UI Polish (Enterprise / Linear-style)
   ------------------------------------------------------------------ */

/* Grid lines: subtle Zinc-800, strict 1-hour tick markers */
.members-page .tick{
  border-left:1px solid rgba(39,39,42,.95) !important;
}
.members-page .timeline{
  border:1px solid rgba(39,39,42,.95) !important;
  background:rgba(24,24,27,.35) !important;
}
.members-page .timeline-ruler .ruler-tick{
  border-left:1px solid rgba(39,39,42,.75) !important;
}
.members-page .members-row{
  border:1px solid rgba(39,39,42,.75) !important;
}

/* Button system: matte, minimalist, consistent */
.members-page .btn,
.members-page .iconbtn,
.members-page .inspector-tabs .tab,
.members-page .reports-item{
  appearance:none !important;
  -webkit-appearance:none !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:8px !important; /* ~rounded-md */
  padding:8px 10px !important;
  background:rgba(255,255,255,.03) !important;
  box-shadow:none !important;
  line-height:1.1 !important;
}
.members-page .btn.ghost,
.members-page .iconbtn{
  background:transparent !important;
}
.members-page .btn.secondary{
  background:rgba(39,39,42,.85) !important; /* zinc-800 */
}
.members-page .btn.primary{
  background:rgba(5,150,105,.95) !important; /* emerald-600 */
  border-color:rgba(5,150,105,.95) !important;
  color:rgba(236,253,245,1) !important;
}
.members-page .btn.primary:hover{ filter:brightness(1.06); }
.members-page .btn.danger{
  background:rgba(220,38,38,.85) !important;
  border-color:rgba(220,38,38,.85) !important;
  color:rgba(254,242,242,1) !important;
}

/* Modal backdrop blur (Task Settings) */
.modal.modal-blur{
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.modal .foot{
  border-top:1px solid rgba(39,39,42,.75);
  padding:12px 16px;
  display:flex;
  justify-content:flex-end;
  gap:10px;
}

/* Task Settings modal layout */
.task-settings-grid{display:flex;flex-direction:column;gap:10px}
.ts-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid rgba(39,39,42,.75);
  border-radius:12px;
  background:rgba(24,24,27,.35);
}
.ts-left{display:flex;align-items:center;gap:10px;min-width:0}
.ts-dot{width:10px;height:10px;border-radius:999px;box-shadow:0 0 0 3px rgba(255,255,255,.04)}
.ts-name{font-size:13px;color:rgba(244,244,245,1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ts-input{width:110px;text-align:right}

/* Paint role select: keep compact */
.members-page #paintRole{min-width:220px}

/* -------------------------------------------------------------------------- */
/* Protocol v3 UI/UX Fixes: Fullscreen Clickability + Topbar Layout Polish     */
/* -------------------------------------------------------------------------- */

/* Ensure Members topbar sits above fullscreen content/overlays */
.members-fullscreen-overlay .members-topbar,
body.members-fullscreen-active .members-topbar,
.members-page .members-topbar{
  position: sticky;
  top: 0;
  z-index: 10060; /* above fullscreen overlay body layers */
  pointer-events: auto;
}

/* Ensure the right-side action cluster stays clickable and well-aligned */
.members-page .members-topbar-right{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem; /* 12px */
  flex-wrap: wrap;
  pointer-events: auto;
  z-index: 10061;
}

/* Prevent invisible/utility overlays from covering header controls */
.members-page .week-warn{
  pointer-events: none;
}

.members-page .modal-backdrop{
  /* Backdrops should not block header controls unless a modal is intentionally open.
     The modal container itself still blocks interaction beneath it when visible. */
  pointer-events: none;
}

/* If a modal is open, the modal content should still be interactive */
.members-page .modal,
.members-page .modal *{
  pointer-events: auto;
}

/* Small-screen polish: allow toolbar clusters to wrap without overlap */
@media (max-width: 900px){
  .members-page .members-topbar{
    gap: 0.75rem;
  }
  .members-page .members-topbar-right{
    gap: 0.5rem;
  }
}

/* Very small screens: keep buttons reachable; reduce hint/secondary text crowding */
@media (max-width: 640px){
  .members-page .members-topbar-right{
    width: 100%;
    justify-content: flex-start;
  }
}

/* -------------------------------------------------------------------------- */
/* Protocol v3 Final: Header 3-Zone Layout + Settings Menu + Modal Fixes       */
/* -------------------------------------------------------------------------- */

.members-page .members-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  width:100%;
}

.members-page .members-topbar-zone{
  display:flex;
  align-items:center;
  gap:0.75rem; /* 12px */
  min-width:0;
}

.members-page .members-topbar-zone-left{
  flex: 1 1 320px;
  justify-content:flex-start;
}

.members-page .members-topbar-zone-center{
  flex: 0 1 560px;
  justify-content:center;
}

.members-page .members-topbar-zone-right{
  flex: 1 1 320px;
  justify-content:flex-end;
  gap:0.75rem; /* 12px */
  flex-wrap:wrap;
  pointer-events:auto;
  z-index:10061;
}

.members-page .members-title-stack{min-width:0}
.members-page .members-teamfield{min-width:220px}
.members-page .members-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0.75rem;
  flex-wrap:wrap;
}
.members-page #weekSelect{min-width:170px}
.members-page #weekPrev,
.members-page #weekNext,
.members-page #jumpToday{
  white-space:nowrap;
}

/* Settings dropdown: keep menu above header and aligned to the button */
.members-page .members-settings-dropdown{
  position:relative;
}
.members-page .members-settings-dropdown .reports-menu{
  right:0;
  left:auto;
  z-index:11020;
}

/* Modal must be above sticky header */
.members-page .modal{
  z-index:17000;
}
.members-page .modal .panel{
  max-height: 82vh;
  overflow:hidden;
}
.members-page .modal .body{
  max-height: 60vh;
  overflow:auto;
}

/* Task Settings modal: robust alignment */
.members-page .task-settings-grid{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.members-page .ts-row{
  display:grid;
  grid-template-columns: minmax(0, 1fr) 120px;
  align-items:center;
  gap:12px;
}
.members-page .ts-left{min-width:0}
.members-page .ts-input{
  width:120px;
  text-align:right;
}

/* Small screens: stack center nav and keep actions reachable */
@media (max-width: 900px){
  .members-page .members-topbar-zone-center{
    flex: 1 1 100%;
    justify-content:flex-start;
  }
}


/* =======================================================================
   MUMS Enterprise UX Kit (Protocol v3 - Command Center Polish v2.1)
   (Appended overrides to preserve existing Enterprise UX rules)
   ======================================================================= */

:root{
  --ux-radius: 18px;
  --ux-radius-sm: 12px;
  --ux-shadow: 0 14px 40px rgba(0,0,0,.20);
  --ux-shadow-soft: 0 10px 26px rgba(0,0,0,.14);
  --shift-morning: #e0f7fa;
  --shift-mid: #fff3e0;
  --shift-night: #ede7f6;
  --ux-focus: 0 0 0 3px rgba(99,102,241,.45);
}

/* --- 1. CRITICAL LAYOUT FIX: Settings Menu --- */
.members-page .members-settings-dropdown{
  position: relative;
  z-index: 11020;
}

/* The Menu itself: Absolute positioning to FLOAT above content */
.members-page .members-settings-menu{
  display: none; /* HIDE BY DEFAULT - Fixes "Sabog" issue */
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 6px;
  flex-direction: column;
  gap: 4px;
  padding: 6px;
  min-width: 240px;
  background: rgba(24,24,27,0.95); /* High opacity background */
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 14px;
  box-shadow: 0 18px 48px rgba(0,0,0,.55);
  z-index: 12050 !important; /* Extremely high z-index */
}

/* Show menu on HOVER or when class OPEN is added */
.members-page .members-settings-dropdown:hover .members-settings-menu,
.members-page .members-settings-dropdown.open .members-settings-menu{
  display: flex;
}

.reports-item{
  width: 100%;
  text-align: left;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: auto;
  line-height: 1.4;
  white-space: normal;
  border-radius: 6px;
  color: rgba(255,255,255,.92);
  background: transparent;
  border: 1px solid transparent;
  cursor: pointer;
}
.reports-item:hover{
  background: rgba(79,139,255,.10);
  border-color: rgba(79,139,255,.22);
}
.reports-sep{
  height: 1px;
  background: rgba(255,255,255,0.1);
  margin: 4px 0;
}

/* --- 2. HEADER: 3-Zone Command Center --- */
.members-page .members-topbar{
  display: flex;
  align-items: center;
  justify-content: space-between; /* Spaced out zones */
  gap: 16px;
  flex-wrap: nowrap; /* Prevent wrapping on decent screens */
  width: 100%;
  position: sticky;
  top: 0;
  z-index: 10060;
  background: rgba(24,24,27,0.85);
  backdrop-filter: blur(12px);
  padding: 10px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

/* Zones */
.members-page .members-topbar-zone{
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.members-page .members-topbar-zone-left{
  flex: 0 1 300px;
  justify-content: flex-start;
}
.members-page .members-topbar-zone-center{
  flex: 1 1 auto;
  justify-content: center; /* Center the Nav Bar */
}
.members-page .members-topbar-zone-right{
  flex: 0 1 auto; /* Allow growth if needed, but keep compact */
  justify-content: flex-end;
}

/* Unified Navigation Bar (Segmented Control Style) */
.members-page .members-navtool{
  display: flex;
  align-items: stretch;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.4);
  border-radius: 8px;
  overflow: hidden;
}
.members-page .members-navtool .navbtn{
  appearance: none;
  border: 0;
  background: transparent;
  color: #e4e4e7;
  padding: 8px 12px;
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  border-right: 1px solid rgba(255,255,255,0.08);
  white-space: nowrap;
}
.members-page .members-navtool .navbtn:last-child{
  border-right: none;
}
.members-page .members-navtool .navbtn:hover{
  background: rgba(255,255,255,0.08);
}
.members-page .members-navtool .navinput{
  appearance: none;
  border: 0;
  background: transparent;
  color: #fff;
  padding: 8px 12px;
  font-size: 13px;
  width: 140px;
  text-align: center;
  border-right: 1px solid rgba(255,255,255,0.08);
  outline: none;
}
/* Cyan Accent for 'Current Week' */
.navbtn-accent{
  color: #67e8f9 !important; /* Cyan-300 */
}

/* --- 3. DAY TABS (Cyan Active State) --- */
.daytabs{
  display: flex;
  gap: 6px;
  padding: 8px 12px;
  overflow-x: auto;
}
.daytab{
  appearance: none;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 6px;
  padding: 6px 12px;
  color: #a1a1aa;
  font-family: monospace;
  font-weight: 700;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.daytab:hover{
  background: rgba(255,255,255,0.08);
}
.daytab.is-on{
  background: #06b6d4; /* Cyan-500 */
  color: #000; /* Black text for contrast */
  border-color: #06b6d4;
  box-shadow: 0 0 15px rgba(6,182,212,0.4);
}

/* --- 4. SCHEDULE BLOCKS (Centered Time & Rounded) --- */
.members-page .seg{
  display: flex;           /* Flexbox for centering */
  align-items: center;     /* Vertical Center */
  justify-content: center; /* Horizontal Center */
  font-weight: 800;
  border-radius: 6px;      /* Rounded Corners */
  box-shadow: 0 1px 3px rgba(0,0,0,0.3);
  z-index: 10;
  overflow: hidden;
}
.members-page .seg .seg-time{
  position: relative;
  z-index: 1;
  font-size: 11px;
  letter-spacing: 0.02em;
  color: var(--seg-fg, rgba(255,255,255,0.95));
  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
  pointer-events: none;
}
.members-page .seg .seg-time-stack{
  position:absolute;
  inset:0;
  display:flex;
  align-items:stretch;
  justify-content:center;
  z-index:1;
  pointer-events:none;
}
.members-page .seg .seg-time-stack .seg-time{
  flex:1 1 0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-left:1px solid rgba(255,255,255,0.18);
  padding:0 4px;
}
.members-page .seg .seg-time-stack .seg-time:first-child{
  border-left:0;
}
.members-page .seg .handle{
  z-index: 0;
}

/* --- 6. CLEANUP --- */
/* Hide coverage meter edit pencil */
#coverageMeter .cov-edit,
#coverageMeter button[aria-label="Edit"]{
  display: none !important;
}
/* Ensure Modals are above everything */
.members-page .modal{
  z-index: 13000 !important;
}
.members-page .modal-backdrop{
  z-index: 12900 !important;
}

/* Base styles for utility classes used in HTML */
.btn{ cursor: pointer; }
.hidden{ display: none !important; }

/* --- Responsiveness guardrails for 3-zone header --- */
@media (max-width: 900px){
  .members-page .members-topbar{ flex-wrap: wrap; }
  .members-page .members-topbar-zone-left,
  .members-page .members-topbar-zone-center,
  .members-page .members-topbar-zone-right{
    flex: 1 1 100%;
    justify-content: flex-start;
  }
  .members-page .members-topbar-zone{ flex-wrap: wrap; }
  .members-page .members-navtool{ width: 100%; }
}
@media (max-width: 520px){
  .members-page .members-navtool{ overflow-x: auto; }
}



/* ───────────────────────────────────────────────────────────
   MUMS Members — Protocol v4 (Enterprise Overhaul) Overrides
   ─────────────────────────────────────────────────────────── */

/* Header: 3-zone layout (Title | Week Nav | Team + Actions) */
.members-page .members-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:nowrap;
  width:100%;
  position:sticky;
  top:0;
  z-index:10060;
  background:rgba(24,24,27,0.85);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,0.08);
  overflow:visible; /* allow dropdowns */
}
.members-page .members-topbar-zone{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  overflow:visible;
}
.members-page .members-topbar-zone-left{ flex:0 0 auto; }
.members-page .members-topbar-zone-center{ flex:1 1 auto; justify-content:center; }
.members-page .members-topbar-zone-right{
  flex:0 0 auto;
  justify-content:flex-end;
  flex-wrap:nowrap;
}

/* Reduce left title footprint so right controls don't get pushed off (>=1280px laptops) */
.members-page .members-title-stack{ min-width:0; max-width:320px; }
@media (max-width: 1400px){
  .members-page .members-title-stack .members-sub{ display:none; }
}

/* Team dropdown sizing inside right zone */
.members-page .members-teamfield{ min-width:180px; }
.members-page .members-teamfield select{
  max-width:220px;
  min-width:180px;
}

/* Center: unified nav */
.members-page .members-navtool{
  display:flex;
  align-items:stretch;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.40);
  border-radius:10px;
  overflow:hidden;
}
.members-page .members-navtool .navbtn,
.members-page .members-navtool .navinput{
  border:0;
  background:transparent;
  color:#e4e4e7;
  padding:8px 12px;
  font-weight:700;
  font-size:13px;
  white-space:nowrap;
}
.members-page .members-navtool .navinput{
  color:#fff;
  width:140px;
  text-align:center;
  border-left:1px solid rgba(255,255,255,0.08);
  border-right:1px solid rgba(255,255,255,0.08);
}
.members-page .members-navtool .navbtn:hover{ background:rgba(255,255,255,0.08); }
.members-page .members-navtool .navbtn-accent{ color:#67e8f9 !important; }

/* Responsive: allow wrap under 1280px */
@media (max-width: 1279px){
  .members-page .members-topbar{ flex-wrap:wrap; }
  .members-page .members-topbar-zone-center{ order:3; width:100%; }
  .members-page .members-topbar-zone-right{ order:2; width:100%; justify-content:flex-end; flex-wrap:wrap; }
}

/* Paint Toolbar: command strip at top of schedule card */
.members-page .members-timeline-toolbar{
  position:sticky;
  top:58px; /* sits under the sticky topbar */
  z-index:10120;
  overflow: visible;
  margin:0;
  border-radius:16px 16px 0 0;
  background:rgba(20,20,23,0.95);
  border:1px solid rgba(255,255,255,0.10);
  border-bottom:1px solid rgba(255,255,255,0.08);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.members-page .members-timeline-toolbar .mtb-left{ gap:10px; }
.members-page .members-timeline-toolbar select.input{ min-width:220px; }

/* Coverage meter: sticky directly below paint bar */
.members-page #coverageMeter.coverage-sticky{
  position:sticky;
  top:0;
  z-index:10110;
  background:rgba(10,16,26,0.88);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,0.08);
}

/* Day tabs: [DD] Day */
.members-page .daytabs{
  display:flex;
  gap:6px;
  padding:8px 12px;
  overflow-x:auto;
}
.members-page .daytab{
  appearance:none;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.10);
  border-radius:8px;
  padding:6px 12px;
  color:#a1a1aa;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-weight:800;
  font-size:12px;
  cursor:pointer;
  transition:all .18s ease;
}
.members-page .daytab:hover{ background:rgba(255,255,255,0.08); }
.members-page .daytab.is-on{
  background:#06b6d4;
  color:#000;
  border-color:#06b6d4;
  box-shadow:0 0 15px rgba(6,182,212,0.35);
}

/* Blocks: centered time label + slightly transparent to show grid lines */
.members-page .seg{
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0.9;
}
.members-page .seg .seg-time{
  font-size:11px;
  letter-spacing:0.02em;
  text-align:center;
  white-space:nowrap;
}

/* Compact rows: remove extra stats line + merge hours & percent in one line */
.members-page .member-task-stats{ display:none !important; }

/* ===== Overall Stats ===== */
.overall-stats-page{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.overall-stats-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.overall-stats-controls{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.overall-stats-team{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.overall-stat-card{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-height:110px;
}
.overall-stat-label{
  font-size:12px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.8px;
  font-weight:800;
}
.overall-stat-value{
  font-size:26px;
  font-weight:900;
  letter-spacing:.3px;
}
.overall-stat-sub{
  font-size:12px;
  color:var(--muted);
}
.overall-stats-table-card{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.overall-stats-table-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.overall-stats-controls{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.overall-filter-card{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.overall-filter-presets{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.overall-filter-row{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
}
.overall-filter-custom{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:flex-end;
}
.overall-filter-shortcuts{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.overall-filter-search,
.overall-filter-sort,
.overall-filter-pagination{
  display:flex;
  gap:8px;
  align-items:flex-end;
}
.overall-filter-search{
  min-width:220px;
  flex:1;
}
.overall-filter-sort{
  min-width:240px;
}
.overall-table-wrap{
  width:100%;
  overflow:auto;
}
.overall-name{
  font-weight:800;
}
.overall-delta{
  display:inline-block;
  margin-left:6px;
  font-size:11px;
  color:var(--muted);
}
.overall-pagination{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
}
.overall-loading,
.overall-error{
  padding:10px 0;
  font-size:13px;
  color:var(--muted);
}
.overall-error{ color: var(--danger); }
.overall-stat-card.overall-trend-card{
  min-height:140px;
}
.overall-trend-wrap{
  margin-top:8px;
  color:var(--accent);
}
.overall-trend-chart{
  width:100%;
  height:80px;
}
.overall-trend-empty{
  font-size:12px;
  color:var(--muted);
}
.sparkline{
  width:100px;
  height:28px;
  color:var(--accent);
}
.sparkline-empty{
  font-size:12px;
  color:var(--muted);
}
.overall-detail-row{
  background:rgba(255,255,255,.02);
}
.overall-detail-panel{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:12px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(255,255,255,.02);
}
.overall-detail-header{
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.overall-detail-title{
  font-weight:800;
  font-size:14px;
}
.overall-detail-kpis{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  font-size:12px;
  color:var(--muted);
}
.overall-detail-chart{
  width:120px;
}
.overall-pilot-card{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.overall-pilot-toggle{
  display:flex;
  align-items:center;
  gap:10px;
}
.overall-pilot-inline{
  display:flex;
  align-items:center;
  gap:8px;
}
.members-page .members-row{
  padding:4px 8px;
}
.members-page .members-row .members-meta{
  gap:3px;
}
.members-page .members-row .member-name{
  font-size:13px;
  line-height:1.15;
}
.members-page .members-row .member-progress{
  margin-top:2px;
}
.members-page .members-row .progress-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.members-page .members-row .progress-text{
  font-size:10px;
  line-height:1.1;
  color:rgba(229,231,235,0.88);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/* Cleanup: hide coverage edit pencil if present */
#coverageMeter .cov-edit,
#coverageMeter button[aria-label="Edit"]{ display:none !important; }

/* Modals above everything */
.members-page .modal{ z-index:13000 !important; }
.members-page .modal-backdrop{ z-index:12900 !important; }
.members-page .confirm-modal{ z-index:14050 !important; }

/* === Protocol v7: Fix Fullscreen Navigation & Grid Visibility === */

/* 1) Fullscreen header must remain visible for date navigation & Exit button */
body.members-fullscreen-active .members-topbar{
  display:flex !important;
}

/* 2) Paint toolbar must sit UNDER the sticky header in fullscreen */
body.members-fullscreen-active .members-timeline-toolbar{
  top:58px !important;
}
.members-fullscreen-overlay .members-timeline-toolbar{
  top:58px !important;
}

/* 3) Ghost time labels (behind schedule blocks, visible in empty grid) */
.members-page .grid-ghost-label{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  font-size:10px;
  font-weight:900;
  color:rgba(255,255,255,0.06);
  pointer-events:none;
  z-index:0;
  width:40px;
  text-align:center;
  user-select:none;
}

/* 4) Z-index harmonization (ordering, not absolute values) */
.members-page .members-settings-dropdown{ z-index:12000 !important; }
.members-page .members-settings-menu{ z-index:12050 !important; }
.members-page .members-topbar{ z-index:11000 !important; }
.members-page .members-timeline-toolbar{ z-index:10900 !important; }
.members-page #coverageMeter{ z-index:10800 !important; }
.members-page .modal{ z-index:99999 !important; }
.members-page .modal-backdrop{ z-index:99998 !important; }
.members-page .confirm-modal{ z-index:100050 !important; }


/* =======================================================================
   Protocol v8: UI Refinement & Logic Hardening
   - Move padding from schedule card to scroll container so toolbar is flush
   - Constrain dropdown widths so paint select doesn’t stretch full row
   ======================================================================= */

/* 1) Padding migration: make toolbar flush to card edges */
.members-page #schedulePane{
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}
.members-page .members-timeline-scroll{
  padding: 12px !important;
}
.members-page #schedulePane .members-timeline-toolbar{
  margin: 0 !important;
  border-top-left-radius: var(--ux-radius, 18px);
  border-top-right-radius: var(--ux-radius, 18px);
}

/* 2) Dropdown sizing: prevent paint dropdown from expanding too wide */
.members-page .members-timeline-toolbar select.input{
  width: auto !important;
  min-width: 140px;
  max-width: 400px;
  flex: 0 0 auto;
}

/* 3) Ensure select controls don’t collapse too small elsewhere */
.members-page .members-topbar select.input{
  min-width: 160px;
}
.members-page .members-roster select.input{
  min-width: 90px;
}

/* 4) Fullscreen scroll padding: keep comfortable spacing under sticky bars */
.members-fullscreen-overlay .members-timeline-scroll{
  padding-top: 12px !important;
}


/* ========================================================================== */
/* Protocol v11: Fullscreen Flush Alignment & Interaction Fix                  */
/* ========================================================================== */

/* 1) Header must stay visible + clickable in fullscreen */
body.members-fullscreen-active .members-topbar{
  display: flex !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 11000 !important; /* above fullscreen overlay content */
  pointer-events: auto !important;
  width: 100% !important;
  border-radius: 0 !important;
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

/* 2) Paint Bar: remove inset margin + force flush width in fullscreen */
.members-fullscreen-overlay .members-timeline-toolbar,
body.members-fullscreen-active .members-timeline-toolbar{
  top: 58px !important;           /* align directly under header */
  margin: 0 !important;           /* removes the fullscreen gap */
  width: 100% !important;
  border-radius: 0 !important;    /* strict rectangular corners */
  border-left: 0 !important;
  border-right: 0 !important;
  z-index: 10900 !important;
  pointer-events: auto !important;
}

/* 3) Defensive: ensure the fullscreen overlay wrapper never blocks clicks */
.members-fullscreen-overlay{
  pointer-events: none !important;
}
.members-fullscreen-overlay > *{
  pointer-events: auto !important;
}

/* ========================================================================== */
/* Protocol v11: Fullscreen Flush Alignment & Interaction Fix                  */
/* ========================================================================== */

/* 1) Header must stay visible + clickable in fullscreen */
body.members-fullscreen-active .members-topbar{
  display: flex !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 11000 !important;
  pointer-events: auto !important;
  width: 100% !important;
  border-radius: 0 !important;
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

/* 2) Paint bar must be flush + clickable in fullscreen */
.members-fullscreen-overlay .members-timeline-toolbar,
body.members-fullscreen-active .members-timeline-toolbar{
  top: 58px !important;
  margin: 0 !important;
  width: 100% !important;
  border-radius: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  z-index: 10900 !important;
  pointer-events: auto !important;
}

/* 3) Prevent transparent fullscreen overlay container from blocking clicks */
.members-fullscreen-overlay{
  pointer-events: none !important;
}
.members-fullscreen-overlay > *{
  pointer-events: auto !important;
}

/* ========================================================================== */
/* Protocol v11: Fullscreen Flush Alignment & Interaction Fix                  */
/* ========================================================================== */

/* 1) Header must stay visible + clickable in fullscreen */
body.members-fullscreen-active .members-topbar{
  display: flex !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 11000 !important;
  pointer-events: auto !important;
  width: 100% !important;
  border-radius: 0 !important;
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

/* 2) Toolbar must be flush + clickable in fullscreen */
.members-fullscreen-overlay .members-timeline-toolbar,
body.members-fullscreen-active .members-timeline-toolbar{
  top: 0 !important;        /* flush to the card edge */
  margin: 0 !important;     /* removes fullscreen gap */
  width: 100% !important;
  border-radius: 0 !important; /* square corners */
  border-left: 0 !important;
  border-right: 0 !important;
  z-index: 10900 !important;
  pointer-events: auto !important;
}

/* 3) Ensure overlay container never blocks clicks */
.members-fullscreen-overlay{
  pointer-events: auto !important;
}

/* 3b) Keep fullscreen toolbar and header controls clickable */
body.members-fullscreen-active .members-topbar,
body.members-fullscreen-active .members-topbar *,
body.members-fullscreen-active .members-timeline-toolbar,
body.members-fullscreen-active .members-timeline-toolbar *,
body.members-fullscreen-active .members-analytics-rail,
body.members-fullscreen-active .members-analytics-rail *{
  pointer-events: auto !important;
}

/* 4) Remove fullscreen-only padding that pushes the paint bar down */
.members-fullscreen-overlay .members-enterprise-grid{
  padding-top: 0 !important;
}
.members-fullscreen-overlay #schedulePane{
  padding: 0 !important;
}

/* ========================================================================== */
/* Protocol v12: Members Overlay Cleanup + Button Visibility                  */
/* ========================================================================== */
.members-fullscreen-overlay{
  pointer-events: auto !important;
}
.members-fullscreen-overlay .members-topbar,
.members-fullscreen-overlay .members-topbar *{
  pointer-events: auto !important;
}
.members-fullscreen-overlay .members-timeline-toolbar,
.members-fullscreen-overlay .members-timeline-toolbar *{
  pointer-events: auto !important;
}
.members-fullscreen-overlay .members-topbar{
  z-index: 12000 !important;
}
.members-fullscreen-overlay .members-timeline-toolbar{
  z-index: 11900 !important;
}
.members-fullscreen-overlay .card{
  background: rgba(10, 16, 26, 0.72);
  box-shadow: 0 12px 28px rgba(0,0,0,0.3);
}

/* ========================================================================== */
/* Protocol v13: Members Overlay Stack + Compact Layout                        */
/* ========================================================================== */
.members-page .modal,
.members-page .confirm-modal{
  z-index: 14000 !important;
}
.members-page .modal-backdrop{
  z-index: 13900 !important;
}
.members-page .members-settings-menu,
.members-page .reports-menu,
.members-page .dropdown-menu{
  z-index: 13500 !important;
}
.members-fullscreen-overlay{
  z-index: 12000 !important;
}
.members-fullscreen-overlay .members-topbar{
  z-index: 12500 !important;
}
.members-fullscreen-overlay .members-timeline-toolbar{
  z-index: 12400 !important;
}

/* Fullscreen safety: ensure global overlays/modals render above fullscreen shell */
body.members-fullscreen-active .modal,
body.members-fullscreen-active .confirm-modal,
body.members-fullscreen-active .attendance-modal,
body.members-fullscreen-active #autoPreviewModal,
body.members-fullscreen-active .graph-status-panel.gsp-floating{
  z-index: 16000 !important;
}
body.members-fullscreen-active .dropdown-menu,
body.members-fullscreen-active .reports-menu,
body.members-fullscreen-active .tooltip{
  z-index: 15500 !important;
}

.members-page .members-topbar{
  padding: 10px 12px;
}
.members-roster-header{
  gap: 8px;
  padding: 10px 12px 8px;
}
.roster-searchbar{
  padding: 6px 8px;
}
.roster-item{
  padding: 8px 10px;
}
.members-timeline-toolbar{
  padding: 8px 10px;
}
.members-timeline-scroll{
  padding: 8px 10px;
}
.coverage-panel{
  padding: 8px 10px;
}
.timeline-ruler{
  margin-top: 8px;
}
.members-row + .members-row{
  margin-top: 8px;
}


.members-page .confirm-modal,
.members-page #autoPreviewModal,
.members-page #autoSettingsModal,
.members-page #taskSettingsModal,
.members-page #auditModal,
.members-page #ackModal,
.members-page #memberSchedModal,
.members-page #trendModal{
  z-index: 18000 !important;
}
.members-page .confirm-modal .panel,
.members-page #autoPreviewModal .panel,
.members-page #autoSettingsModal .panel,
.members-page #taskSettingsModal .panel,
.members-page #auditModal .panel,
.members-page #ackModal .panel,
.members-page #memberSchedModal .panel,
.members-page #trendModal .panel{
  position: relative;
  z-index: 18001 !important;
}

/* Protocol v13: Visibility & Contrast Enforcement */
.members-page select,
.members-page .input,
.members-page option {
  color: #f4f4f5 !important;
  background-color: #18181b !important;
}

/* Fix specific unreadable 'Leave' dropdown selection */
.members-page .member-actions select {
  color: #f4f4f5 !important;
  background-color: rgba(255,255,255,0.05) !important;
}

/* My Quickbase premium compact layout — base stub (v2 block below overrides) */
.qb-page-shell{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  gap:10px;
}
.qb-static-zone{ flex-shrink:0; display:flex; flex-direction:column; gap:10px; }
.qb-header-card{ padding:10px 14px; }
.qb-title{ font-size:20px; line-height:1.1; }
.qb-subtitle{ margin-top:2px; font-size:11px; }
.qb-dashboard-counters{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap:10px;
  flex-shrink:0;
}
.qb-counter-widget{
  backdrop-filter: blur(12px);
  border-radius: 12px;
  padding: 14px;
  min-height: 132px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
}
.qb-counter-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:rgba(203,213,225,.86);
  margin-bottom:8px;
}
.qb-counter-value{ font-size:56px; font-weight:900; line-height:1; }
.qb-table-card{ flex-grow:1; min-height:0; display:flex; flex-direction:column; }
.qb-data-body{ flex-grow:1; min-height:0; overflow:hidden; position:relative; }
.qb-data-table{ width:100%; min-width:760px; border-collapse:collapse; }
.qb-data-table th,
.qb-data-table td{ text-align:left; padding:8px; }
.qb-data-table thead th{
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: var(--surface-color, #1e1e1e);
  backdrop-filter: blur(10px);
  box-shadow: 0 1px 0 rgba(148,163,184,.25);
}
.qb-case-id{ font-weight:700; }

.qb-header-row{ width:100%; }
.qb-header-search-wrap{ max-width:560px; margin:0 auto; }
.qb-header-search{ width:min(420px, 100%); height:36px; }
.qb-counter-widget{ cursor:pointer; transition:transform .2s ease, opacity .2s ease, box-shadow .2s ease, border-color .2s ease; }
.qb-counter-widget:hover{ transform:translateY(-1px); opacity:.96; }
.qb-counter-widget.is-active{ border-color:rgba(148,163,184,.75) !important; box-shadow:0 0 0 1px rgba(255,255,255,.22), 0 12px 28px rgba(15,23,42,.42) !important; }

/* FIX[Bug4]: Responsive layout - full visibility on all devices */
@media (max-width: 1024px) {
  .qb-page-shell { overflow: hidden; }
}
@media (max-width: 768px) {
  .qb-page-shell { height: auto; overflow: visible; }
  .qb-data-body { min-height: 220px; }
  .qb-table-card { min-height: 220px; }
  .qb-dashboard-counters { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .qb-counter-widget { min-height: 100px; padding: 10px; }
  .qb-counter-value { font-size: 40px; }
  .qb-counter-label { font-size: 10px; }
  .qb-header-search-wrap { max-width: 100%; flex-direction: column; }
}
@media (max-width: 480px) {
  .qb-dashboard-counters { grid-template-columns: repeat(2, 1fr); }
  .qb-counter-value { font-size: 32px; }
  .qb-counter-widget { min-height: 84px; }
  .qb-page-shell { height: auto; }
}
@media (max-width: 980px){
  .qb-header-row{ flex-wrap:wrap; }
  .qb-header-search-wrap{ order:3; width:100%; max-width:none; }
  .qb-header-search{ width:100%; }
}

/* ═══════════════════════════════════════════════════════════════
   MY QUICKBASE — ENTERPRISE UI REDESIGN v2
   ═══════════════════════════════════════════════════════════════ */

/* ── PAGE SHELL ── */
/* ── PAGE SHELL ── */
/* Height is controlled by JS ResizeObserver — see my_quickbase.js _fitQbShellHeight */
.qb-page-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  overflow: hidden;
  padding: 16px 18px;
  box-sizing: border-box;
  width: 100%;
  background: linear-gradient(160deg, rgba(8,14,30,0.6) 0%, rgba(6,10,22,0.4) 100%);
}

/* QB Page active — padding stripped so qb-page-shell fills the grid cell.
   overflow is controlled exclusively via root.style.overflow in my_quickbase.js */
.main.card.pad.page-qb {
  padding: 0 !important;
}
@supports not (overflow: clip) {
  .main.card.pad.page-qb {
    overflow: visible !important;
  }
}

/* ── FULLSCREEN MODE ── */
.qb-page-shell.qb-is-fullscreen {
  position: fixed !important;
  inset: 0 !important;
  z-index: 100000 !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 16px !important;
  background: #070c1a !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  animation: qbFsExpand 0.18s ease-out both;
}
@keyframes qbFsExpand {
  from { opacity: 0; transform: scale(0.98); }
  to   { opacity: 1; transform: scale(1); }
}

/* ── TAB BAR WRAP ── */
.qb-tabbar-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,0.055);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 12px;
  padding: 5px 8px;
  flex-shrink: 0;
  backdrop-filter: blur(8px);
}
.qb-tabs-inner {
  display: flex;
  gap: 4px;
  flex: 1;
  overflow-x: auto;
  scrollbar-width: none;
}
.qb-tabs-inner::-webkit-scrollbar { display: none; }

/* ── TAB BUTTONS ── */
.qb-tab-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 8px;
  border: 1px solid transparent;
  background: transparent;
  color: rgba(148,163,184,0.8);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s ease;
  font-family: inherit;
}
.qb-tab-btn:hover {
  background: rgba(255,255,255,0.06);
  color: #e2e8f0;
  border-color: rgba(255,255,255,0.1);
}
.qb-tab-btn-active {
  background: linear-gradient(135deg, rgba(59,130,246,0.2), rgba(6,182,212,0.1));
  color: #f0f4ff;
  border-color: rgba(59,130,246,0.5);
  font-weight: 700;
}
.qb-tab-label { pointer-events: none; }

/* Tab cache/live badges */
.qb-tab-cache-badge {
  font-size: 9px;
  font-weight: 700;
  pointer-events: none;
  flex-shrink: 0;
}
.qb-tab-badge-live  { color: #22c55e; }
.qb-tab-badge-cached { color: rgba(148,163,184,0.5); }

/* ── ADD TAB + FULLSCREEN BUTTONS ── */
.qb-tab-add-btn {
  flex-shrink: 0;
  width: 30px; height: 30px;
  border-radius: 8px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  color: rgba(148,163,184,0.7);
  font-size: 18px; line-height: 1;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
  font-family: inherit;
}
.qb-tab-add-btn:hover {
  background: rgba(59,130,246,0.12);
  color: #3b82f6;
  border-color: rgba(59,130,246,0.4);
}
.qb-fullscreen-btn {
  flex-shrink: 0;
  width: 30px; height: 30px;
  border-radius: 8px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  color: rgba(148,163,184,0.7);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
}
.qb-fullscreen-btn:hover {
  background: rgba(59,130,246,0.12);
  color: #3b82f6;
  border-color: rgba(59,130,246,0.4);
}

/* ── HEADER CARD ── */
.qb-header-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 18px;
  background: linear-gradient(135deg, rgba(255,255,255,0.065) 0%, rgba(255,255,255,0.03) 100%);
  border: 1px solid rgba(255,255,255,0.13);
  border-radius: 12px;
  flex-shrink: 0;
  flex-wrap: wrap;
  backdrop-filter: blur(12px);
  box-shadow: 0 2px 12px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.07);
}
.qb-header-left { min-width: 0; flex-shrink: 0; }
.qb-instance-title {
  font-size: 16px;
  font-weight: 800;
  color: #eef2ff;
  letter-spacing: -0.02em;
  line-height: 1.2;
}
.qb-instance-sub {
  font-size: 11px;
  color: rgba(180,195,220,0.7);
  margin-top: 2px;
  font-weight: 500;
}

/* ── SEARCH ── */
.qb-search-wrap {
  flex: 1;
  min-width: 180px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.qb-search-row {
  position: relative;
  display: flex;
  align-items: center;
}
.qb-search-ico {
  position: absolute;
  left: 10px; top: 50%;
  transform: translateY(-50%);
  color: rgba(148,163,184,0.5);
  display: flex; align-items: center;
  pointer-events: none;
}
.qb-search-input {
  width: 100%;
  padding: 8px 12px 8px 32px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  color: #e2e8f0;
  font-size: 12.5px;
  font-family: inherit;
  outline: none;
  transition: border-color 0.15s;
  box-sizing: border-box;
}
.qb-search-input:focus { border-color: rgba(59,130,246,0.6); }
.qb-search-input::placeholder { color: rgba(148,163,184,0.4); }
/* When counter scope is active, tint the border to indicate filtered mode */
.qb-search-input.qb-search-scoped {
  border-color: rgba(59,130,246,0.4) !important;
  background: rgba(59,130,246,0.04) !important;
}

/* ── SEARCH SCOPE TAG ──
   Appears below the search input when a dashboard counter filter is active.
   Informs the user that search is scoped to the filtered subset only. */
.qb-search-scope-tag {
  display: none;
  align-items: center;
  gap: 6px;
  padding: 4px 8px 4px 8px;
  background: rgba(59,130,246,0.08);
  border: 1px solid rgba(59,130,246,0.22);
  border-radius: 6px;
  font-size: 11px;
  color: rgba(148,163,184,0.75);
  line-height: 1.3;
  animation: qbScopeIn 0.15s ease-out both;
}
.qb-search-scope-tag.is-visible { display: flex; }
@keyframes qbScopeIn {
  from { opacity: 0; transform: translateY(-3px); }
  to   { opacity: 1; transform: translateY(0); }
}
.qb-scope-ico { color: #60a5fa; flex-shrink: 0; }
.qb-scope-lbl { color: #60a5fa; font-weight: 700; white-space: nowrap; max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
.qb-scope-count { color: rgba(148,163,184,0.5); font-variant-numeric: tabular-nums; }
.qb-scope-dismiss {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  padding: 1px 4px;
  border-radius: 4px;
  cursor: pointer;
  background: none;
  border: none;
  color: rgba(148,163,184,0.45);
  font-size: 14px;
  line-height: 1;
  transition: color 0.12s, background 0.12s;
}
.qb-scope-dismiss:hover { color: #f87171; background: rgba(248,113,113,0.12); }

/* ── HEADER ACTIONS ── */
.qb-header-actions {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  flex-shrink: 0;
}

/* ── SHARED BUTTONS ── */
.qb-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  border-radius: 8px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: all 0.15s;
  white-space: nowrap;
  line-height: 1;
}
.qb-btn-ghost {
  background: rgba(255,255,255,0.05);
  color: rgba(148,163,184,0.9);
  border: 1px solid rgba(255,255,255,0.1);
}
.qb-btn-ghost:hover {
  background: rgba(255,255,255,0.09);
  color: #e2e8f0;
}
.qb-btn-primary {
  background: linear-gradient(135deg,#2563eb,#0891b2);
  color: #fff;
  border: 1px solid rgba(59,130,246,0.35);
}
.qb-btn-primary:hover { filter: brightness(1.1); }
.qb-btn-sm { padding: 5px 10px; font-size: 11px; }

/* ── DASHBOARD COUNTERS ── */
.qb-dashboard-counters {
  display: grid;
  gap: 10px;
  flex-shrink: 0;
  grid-template-columns: repeat(auto-fill, minmax(150px, 220px));
}
.qb-dashboard-counters.qb-counters-many {
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
}
.qb-counter-widget {
  backdrop-filter: blur(14px);
  border-radius: 14px;
  padding: 14px 16px;
  min-height: 96px;
  max-height: 136px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  cursor: pointer;
  transition: transform .18s ease, opacity .18s ease, box-shadow .18s ease, border-color .18s ease;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 4px 16px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.08);
}
.qb-counter-widget:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.08); }
.qb-counter-widget.is-active {
  border-color: rgba(79,172,249,0.6) !important;
  box-shadow: 0 0 0 1px rgba(45,134,232,0.25), 0 10px 28px rgba(0,0,0,0.4) !important;
  background: rgba(45,134,232,0.1) !important;
}
.qb-counter-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .13em;
  color: rgba(210,220,240,0.75);
  margin-bottom: 6px;
  font-weight: 800;
}
.qb-counter-value {
  font-size: 44px;
  font-weight: 900;
  line-height: 1;
  color: #eef2ff;
}

/* ── TABLE CARD ── */
.qb-table-card {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: rgba(255,255,255,0.045);
  border: 1px solid rgba(255,255,255,0.13);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.06);
}
.qb-table-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 18px;
  background: rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.10);
  flex-shrink: 0;
  gap: 10px;
  flex-wrap: wrap;
}
.qb-table-title {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  font-weight: 800;
  color: rgba(200,215,240,0.9);
  letter-spacing: .06em;
  text-transform: uppercase;
}
.qb-table-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.qb-meta-text {
  font-size: 11px;
  color: rgba(170,188,220,0.75);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
.qb-fresh-badge {
  font-size: 10px;
  font-weight: 700;
  color: #4ade80;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(74,222,128,0.1);
  border: 1px solid rgba(74,222,128,0.28);
  letter-spacing: .02em;
}
.qb-cache-badge {
  font-size: 10px;
  font-weight: 700;
  color: rgba(170,188,220,0.7);
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(170,188,220,0.07);
  border: 1px solid rgba(170,188,220,0.18);
  transition: color .15s, background .15s, border-color .15s;
}
.qb-cache-badge[style*="cursor:pointer"]:hover,
.qb-cache-badge[style*="cursor: pointer"]:hover {
  color: #4ade80;
  background: rgba(74,222,128,0.10);
  border-color: rgba(74,222,128,0.28);
}
.qb-data-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  position: relative;
}

/* ── TABLE INNER: single scroll container ── */
.qb-table-inner {
  width: 100%;
  height: 100%;
  overflow-x: auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.qb-data-body .qb-table-inner::-webkit-scrollbar { width: 6px; height: 6px; }
.qb-data-body .qb-table-inner::-webkit-scrollbar-track { background: rgba(255,255,255,0.02); }
.qb-data-body .qb-table-inner::-webkit-scrollbar-thumb { background: rgba(160,180,220,0.2); border-radius: 999px; }
.qb-data-body .qb-table-inner::-webkit-scrollbar-thumb:hover { background: rgba(160,180,220,0.36); }

/* ── DATA TABLE ── */
.qb-data-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
}
.qb-data-table th,
.qb-data-table td {
  text-align: left;
  padding: 9px 11px;
}
/* TABLE HEADER — HIGH VISIBILITY ENTERPRISE STYLE */
.qb-data-table thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  /* Rich deep-blue-slate background — clearly visible, clearly a header */
  background: linear-gradient(180deg, #1a2540 0%, #16203a 100%);
  border-bottom: 2px solid rgba(100,130,200,0.35);
  box-shadow: 0 2px 8px rgba(0,0,0,0.35);
  /* Bright, readable header text */
  color: #c5d4f0;
  font-size: 10.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  white-space: nowrap;
  padding: 10px 11px;
}
/* Hover accent on header cells */
.qb-data-table thead th:hover {
  background: linear-gradient(180deg, #1e2d50 0%, #1a2744 100%);
  color: #dde8ff;
}
/* Data rows */
.qb-data-table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,0.055);
  transition: background 0.12s ease;
}
.qb-data-table tbody tr:nth-child(even) {
  background: rgba(255,255,255,0.018);
}
.qb-data-table tbody tr:hover {
  background: rgba(100,130,220,0.07);
}
.qb-data-table td {
  font-size: 12.5px;
  color: #c8d8f0;
  vertical-align: middle;
}
.qb-case-id {
  font-weight: 800;
  color: #eef3ff;
  letter-spacing: -0.01em;
}

/* ── ENTERPRISE ROW NUMBERING ── */
.qb-row-num-th {
  width: 40px;
  min-width: 40px;
  text-align: center;
  padding: 10px 6px !important;
  font-size: 10px !important;
  font-weight: 800;
  color: rgba(150,175,220,0.5) !important;
  letter-spacing: .04em;
  position: sticky;
  left: 0;
  z-index: 11;
  border-right: 1px solid rgba(100,130,200,0.2);
  /* Match the header background exactly */
  background: linear-gradient(180deg, #1a2540 0%, #16203a 100%) !important;
}
.qb-row-num-cell {
  width: 40px;
  min-width: 40px;
  text-align: center;
  vertical-align: middle;
  padding: 8px 4px !important;
  border-right: 1px solid rgba(255,255,255,0.05);
  background: rgba(14,20,38,0.35);
  position: sticky;
  left: 0;
  z-index: 1;
}
.qb-row-num-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(140,165,220,0.15);
  font-size: 11px;
  font-weight: 600;
  color: rgba(150,175,220,0.45);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
  pointer-events: none;
  user-select: none;
}
.qb-data-table tbody tr:hover .qb-row-num-pill {
  background: rgba(80,110,220,0.15);
  border-color: rgba(100,140,255,0.35);
  color: rgba(180,200,255,0.85);
}
/* Rows beyond 99: shrink font to fit */
@media (min-width: 0px) {
  .qb-row-num-pill[data-n="3digit"] {
    font-size: 9px;
    letter-spacing: -.02em;
  }
}

/* ── SETTINGS MODAL ── */
.qb-modal-panel {
  position: relative;
  width: min(96vw, 880px);
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  background: linear-gradient(145deg, #0c1524, #111827);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 18px;
  box-shadow: 0 24px 80px rgba(0,0,0,0.7);
  overflow: hidden;
}
.qb-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 28px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  flex-shrink: 0;
  gap: 12px;
}
.qb-modal-title {
  font-size: 17px;
  font-weight: 800;
  color: #f0f4ff;
  letter-spacing: -0.01em;
}
.qb-modal-sub {
  font-size: 11px;
  color: rgba(148,163,184,0.6);
  margin-top: 3px;
}
.qb-modal-close {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  color: rgba(148,163,184,0.7);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
  flex-shrink: 0;
}
.qb-modal-close:hover {
  background: rgba(239,68,68,0.12);
  color: #f87171;
  border-color: rgba(239,68,68,0.3);
}
.qb-modal-tabs {
  display: flex;
  gap: 2px;
  padding: 0 28px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  overflow-x: auto;
  scrollbar-width: none;
  flex-shrink: 0;
}
.qb-modal-tabs::-webkit-scrollbar { display: none; }
.qb-modal-tab {
  padding: 10px 14px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: rgba(148,163,184,0.7);
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s;
}
.qb-modal-tab:hover { color: #e2e8f0; }
.qb-modal-tab.active {
  color: #3b82f6;
  border-bottom-color: #3b82f6;
}
.qb-modal-body {
  flex: 1;
  overflow-y: auto;
  padding: 20px 28px;
  display: grid;
  gap: 12px;
}
.qb-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 28px;
  border-top: 1px solid rgba(255,255,255,0.08);
  background: rgba(8,14,26,0.5);
  flex-shrink: 0;
  flex-wrap: wrap;
}

/* ── MODAL SECTIONS ── */
.qb-modal-section {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 12px;
  padding: 16px 18px;
}
.qb-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  color: #e2e8f0;
  margin-bottom: 14px;
  letter-spacing: 0.02em;
}
.qb-section-num {
  width: 20px; height: 20px;
  border-radius: 6px;
  background: rgba(59,130,246,0.2);
  border: 1px solid rgba(59,130,246,0.35);
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 800;
  color: #3b82f6;
  flex-shrink: 0;
}
.qb-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

/* ── FORM FIELDS ── */
.qb-field-stack { display: grid; gap: 10px; }
.qb-field-row   { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.qb-field       { display: flex; flex-direction: column; gap: 5px; }
.qb-field-label {
  font-size: 10.5px;
  font-weight: 700;
  color: rgba(148,163,184,0.8);
  text-transform: uppercase;
  letter-spacing: 0.07em;
}
.qb-field-input {
  padding: 9px 12px;
  border-radius: 8px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  color: #e2e8f0;
  font-family: inherit;
  font-size: 12.5px;
  outline: none;
  transition: border-color 0.15s;
  box-sizing: border-box;
  width: 100%;
}
.qb-field-input:focus { border-color: rgba(59,130,246,0.6); }
.qb-field-readonly {
  background: rgba(255,255,255,0.02) !important;
  color: rgba(148,163,184,0.65) !important;
  cursor: not-allowed;
}
.qb-field-hint {
  font-size: 10px;
  color: rgba(148,163,184,0.5);
  line-height: 1.4;
}
.qb-select-sm { max-width: 200px; }

/* ── FILTER ROWS ── */
.qb-filter-match-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.qb-filter-rows { display: grid; gap: 8px; }
.qb-counter-rows { display: grid; gap: 10px; margin-top: 4px; }

/* ── COLUMNS SCROLL ── */
.qb-columns-scroll {
  max-height: 340px;
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(2,6,23,0.3);
}
.qb-col-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  padding: 8px;
}

/* ── SPIN ANIMATION ── */
@keyframes qb-spin { to { transform: rotate(360deg); } }
.qb-spin { animation: qb-spin 0.8s linear infinite; }

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .qb-page-shell { height: 100%; overflow: hidden; }
  .qb-data-body  { min-height: 240px; }
  .qb-table-card { min-height: 240px; flex-shrink: 0; }
  .qb-col-grid   { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 768px) {
  .qb-page-shell { height: auto; overflow: visible; padding: 10px; gap: 8px; }
  .qb-header-card { gap: 8px; padding: 10px 12px; }
  .qb-instance-title { font-size: 14px; }
  .qb-dashboard-counters { grid-template-columns: repeat(2,1fr); gap: 8px; }
  .qb-counter-widget { min-height: 90px; padding: 10px 12px; }
  .qb-counter-value  { font-size: 36px; }
  .qb-field-row      { grid-template-columns: 1fr; }
  .qb-modal-header   { padding: 16px 18px 12px; }
  .qb-modal-body     { padding: 14px 16px; }
  .qb-modal-footer   { padding: 12px 16px; }
  .qb-modal-tabs     { padding: 0 16px; }
  .qb-col-grid       { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 480px) {
  .qb-dashboard-counters { grid-template-columns: repeat(2,1fr); }
  .qb-counter-value      { font-size: 30px; }
  .qb-counter-widget     { min-height: 80px; }
  .qb-btn span           { display: none; }
}


#qbSettingsSavingLock {
  border-radius: 16px !important;
}

/* ════════════════════════════════════════════════════════════════════════
   AURORA MIDNIGHT v3 — enterprise_ux.css scoped overrides
   Palette: Azure-Cyan primary (#2d86e8), Teal secondary (#06d6b0)
   -70% purple · +brightness · +contrast · vivid enterprise
   ════════════════════════════════════════════════════════════════════════ */

/* ── QB PAGE SHELL ── */
body[data-theme="aurora_midnight"] .qb-page-shell {
  gap: 12px;
  background: transparent;
}

/* ── QB TABBAR ── */
body[data-theme="aurora_midnight"] .qb-tabbar-wrap {
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(60,140,255,.16) !important;
  border-radius: 12px;
}
body[data-theme="aurora_midnight"] .qb-tab-btn {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: #94b8d8 !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  transition: all .13s !important;
}
body[data-theme="aurora_midnight"] .qb-tab-btn:hover {
  background: rgba(45,134,232,.1) !important;
  color: #c8e4ff !important;
  border-color: rgba(79,172,249,.2) !important;
}
body[data-theme="aurora_midnight"] .qb-tab-btn-active {
  background: rgba(45,134,232,.18) !important;
  border-color: rgba(79,172,249,.36) !important;
  color: #90caff !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 12px rgba(45,134,232,.2) !important;
}
body[data-theme="aurora_midnight"] .qb-tab-badge-live  { color: #3fd67a !important; }
body[data-theme="aurora_midnight"] .qb-tab-badge-cached { color: rgba(148,184,216,.75) !important; }
body[data-theme="aurora_midnight"] .qb-tab-add-btn {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(60,140,255,.16) !important;
  color: #7aa8cc !important;
  border-radius: 8px !important;
}
body[data-theme="aurora_midnight"] .qb-tab-add-btn:hover {
  background: rgba(45,134,232,.12) !important;
  color: #90caff !important;
}

/* ── QB HEADER CARD ── */
body[data-theme="aurora_midnight"] .qb-header-card {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(60,140,255,.16) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
body[data-theme="aurora_midnight"] .qb-instance-title {
  background: linear-gradient(90deg, #ddeeff, #5ab8f8, #06d6b0);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 900 !important;
}
body[data-theme="aurora_midnight"] .qb-instance-sub { color: #7aa8cc !important; }
body[data-theme="aurora_midnight"] .qb-search-input {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(60,140,255,.16) !important;
  color: #ddeeff !important;
  border-radius: 9px !important;
}
body[data-theme="aurora_midnight"] .qb-search-input:focus {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(45,134,232,.5) !important;
  box-shadow: 0 0 0 3px rgba(45,134,232,.12) !important;
}
body[data-theme="aurora_midnight"] .qb-search-input::placeholder { color: #5a8aaa !important; }
body[data-theme="aurora_midnight"] .qb-search-ico { color: #7aa8cc !important; }

/* ── QB ACTION BUTTONS ── */
body[data-theme="aurora_midnight"] .qb-btn {
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(60,140,255,.18) !important;
  color: #c4daf0 !important;
  border-radius: 9px !important;
  font-weight: 600 !important;
  transition: all .13s !important;
}
body[data-theme="aurora_midnight"] .qb-btn:hover {
  background: rgba(45,134,232,.12) !important;
  border-color: rgba(79,172,249,.32) !important;
  color: #ddeeff !important;
}
body[data-theme="aurora_midnight"] .qb-btn-ghost {
  background: transparent !important;
  border-color: transparent !important;
  color: #7aa8cc !important;
}
body[data-theme="aurora_midnight"] .qb-btn-ghost:hover {
  background: rgba(255,255,255,.055) !important;
  color: #90caff !important;
}
body[data-theme="aurora_midnight"] .qb-btn-primary {
  background: linear-gradient(135deg, #1a6fcf, #2d86e8) !important;
  border-color: rgba(79,172,249,.5) !important;
  color: #fff !important;
  box-shadow: 0 3px 14px rgba(45,134,232,.28) !important;
}
body[data-theme="aurora_midnight"] .qb-btn-primary:hover {
  box-shadow: 0 5px 20px rgba(45,134,232,.42) !important;
}

/* ── QB FULLSCREEN BUTTON ── */
body[data-theme="aurora_midnight"] .qb-fullscreen-btn {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(60,140,255,.16) !important;
  color: #7aa8cc !important;
}
body[data-theme="aurora_midnight"] .qb-fullscreen-btn:hover {
  background: rgba(45,134,232,.12) !important;
  color: #90caff !important;
}

/* ── QB COUNTER WIDGETS ── */
body[data-theme="aurora_midnight"] .qb-dashboard-counters { gap: 10px; }
body[data-theme="aurora_midnight"] .qb-counter-widget {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(60,140,255,.16) !important;
  border-radius: 14px !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .15s !important;
  position: relative;
  overflow: hidden;
}
body[data-theme="aurora_midnight"] .qb-counter-widget::before {
  content: '';
  position: absolute;
  top: -25px; right: -25px;
  width: 90px; height: 90px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(45,134,232,.1) 0%, transparent 65%);
  pointer-events: none;
}
body[data-theme="aurora_midnight"] .qb-counter-widget:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.38) !important;
  border-color: rgba(79,172,249,.30) !important;
}
body[data-theme="aurora_midnight"] .qb-counter-widget.is-active {
  border-color: rgba(79,172,249,.55) !important;
  box-shadow: 0 0 0 1px rgba(45,134,232,.25), 0 10px 28px rgba(0,0,0,.35) !important;
  background: rgba(45,134,232,.1) !important;
}
body[data-theme="aurora_midnight"] .qb-counter-label {
  font-size: 9.5px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  color: #6a9abf !important;
}
body[data-theme="aurora_midnight"] .qb-counter-value {
  font-size: 48px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  background: linear-gradient(135deg, #ddeeff, #5ab8f8);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── QB TABLE CARD ── */
body[data-theme="aurora_midnight"] .qb-table-card {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(60,140,255,.16) !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 24px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
body[data-theme="aurora_midnight"] .qb-table-head {
  background: rgba(255,255,255,.025) !important;
  border-bottom: 1px solid rgba(60,140,255,.12) !important;
}
body[data-theme="aurora_midnight"] .qb-table-title {
  font-size: 10px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .09em !important;
  color: rgba(148,184,216,.88) !important;
}

/* ── QB DATA TABLE — HIGH VISIBILITY HEADER ── */
body[data-theme="aurora_midnight"] .qb-data-table thead th {
  background: linear-gradient(180deg, #0f1e38 0%, #0c1a30 100%) !important;
  border-bottom: 2px solid rgba(45,134,232,.40) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.40) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .09em !important;
  color: #7aacce !important;
  padding: 10px 11px !important;
  position: sticky;
  top: 0;
  z-index: 2;
}
body[data-theme="aurora_midnight"] .qb-data-table thead th:hover {
  background: linear-gradient(180deg, #152742 0%, #112035 100%) !important;
  color: #a8cce8 !important;
}
body[data-theme="aurora_midnight"] .qb-data-table tbody tr {
  border-bottom: 1px solid rgba(60,140,255,.07) !important;
  transition: background .12s !important;
}
body[data-theme="aurora_midnight"] .qb-data-table tbody tr:nth-child(even) {
  background: rgba(255,255,255,.016) !important;
}
body[data-theme="aurora_midnight"] .qb-data-table tbody tr:hover {
  background: rgba(45,134,232,.06) !important;
}
body[data-theme="aurora_midnight"] .qb-data-table td {
  font-size: 12.5px !important;
  color: #b4cce8 !important;
  padding: 9px 11px !important;
  vertical-align: middle !important;
}
body[data-theme="aurora_midnight"] .qb-case-id {
  font-weight: 800 !important;
  color: #eef5ff !important;
  letter-spacing: -.01em !important;
}

/* ── QB ROW NUMBER PILLS ── */
body[data-theme="aurora_midnight"] .qb-row-num-th {
  background: linear-gradient(180deg, #0f1e38 0%, #0c1a30 100%) !important;
  color: rgba(90,120,170,.5) !important;
  border-right: 1px solid rgba(45,134,232,.15) !important;
  width: 36px !important;
}
body[data-theme="aurora_midnight"] .qb-row-num-cell {
  text-align: center !important;
  width: 36px !important;
  background: rgba(8,14,28,.3) !important;
  border-right: 1px solid rgba(45,134,232,.07) !important;
}
body[data-theme="aurora_midnight"] .qb-row-num-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important; height: 22px !important;
  border-radius: 6px !important;
  font-size: 10px !important; font-weight: 700 !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(60,140,255,.12) !important;
  color: rgba(90,140,190,.45) !important;
  font-variant-numeric: tabular-nums !important;
  transition: all .12s !important;
}
body[data-theme="aurora_midnight"] tr:hover .qb-row-num-pill {
  background: rgba(45,134,232,.14) !important;
  border-color: rgba(79,172,249,.34) !important;
  color: #90caff !important;
}

/* ── QB STATUS BADGES ── */
body[data-theme="aurora_midnight"] .qb-status-badge {
  display: inline-flex !important; align-items: center !important; gap: 5px !important;
  padding: 3px 9px !important; border-radius: 7px !important;
  font-size: 10.5px !important; font-weight: 700 !important;
  letter-spacing: .01em !important; white-space: nowrap !important;
  line-height: 1 !important; border: 1px solid transparent !important;
}
body[data-theme="aurora_midnight"] .qb-status-dot {
  width: 5px !important; height: 5px !important;
  border-radius: 50% !important; flex-shrink: 0 !important;
}
body[data-theme="aurora_midnight"] .qb-status-investigating {
  background: rgba(79,172,249,.12) !important; border-color: rgba(79,172,249,.28) !important; color: #90d0ff !important;
}
body[data-theme="aurora_midnight"] .qb-status-investigating .qb-status-dot {
  background: #4facf9 !important; box-shadow: 0 0 5px rgba(79,172,249,.75) !important;
}
body[data-theme="aurora_midnight"] .qb-status-waiting {
  background: rgba(248,193,68,.1) !important; border-color: rgba(248,193,68,.28) !important; color: #ffe090 !important;
}
body[data-theme="aurora_midnight"] .qb-status-waiting .qb-status-dot {
  background: #f8c144 !important; box-shadow: 0 0 5px rgba(248,193,68,.65) !important;
}
body[data-theme="aurora_midnight"] .qb-status-soft-close {
  background: rgba(63,214,122,.1) !important; border-color: rgba(63,214,122,.26) !important; color: #80f0a8 !important;
}
body[data-theme="aurora_midnight"] .qb-status-soft-close .qb-status-dot {
  background: #3fd67a !important; box-shadow: 0 0 5px rgba(63,214,122,.65) !important;
}
body[data-theme="aurora_midnight"] .qb-status-initial {
  background: rgba(45,134,232,.1) !important; border-color: rgba(79,172,249,.28) !important; color: #90caff !important;
}
body[data-theme="aurora_midnight"] .qb-status-initial .qb-status-dot {
  background: #4facf9 !important; box-shadow: 0 0 5px rgba(79,172,249,.65) !important;
}
body[data-theme="aurora_midnight"] .qb-status-response {
  background: rgba(6,214,176,.1) !important; border-color: rgba(6,214,176,.26) !important; color: #5eead4 !important;
}
body[data-theme="aurora_midnight"] .qb-status-response .qb-status-dot {
  background: #06d6b0 !important; box-shadow: 0 0 5px rgba(6,214,176,.65) !important;
}
body[data-theme="aurora_midnight"] .qb-status-closed {
  background: rgba(90,130,170,.09) !important; border-color: rgba(90,130,170,.22) !important; color: #6a92b2 !important;
}
body[data-theme="aurora_midnight"] .qb-status-closed .qb-status-dot { background: #5a82aa !important; }
body[data-theme="aurora_midnight"] .qb-status-default {
  background: rgba(255,255,255,.03) !important; border-color: rgba(60,140,255,.12) !important; color: rgba(90,130,170,.75) !important;
}
body[data-theme="aurora_midnight"] .qb-status-default .qb-status-dot { background: rgba(90,130,170,.4) !important; }

/* ── QB MODAL ── */
body[data-theme="aurora_midnight"] .qb-modal-panel {
  background: linear-gradient(145deg, #0a1525, #0c1a2e) !important;
  border: 1px solid rgba(60,140,255,.2) !important;
  border-radius: 18px !important;
  box-shadow: 0 32px 80px rgba(0,0,0,.72), 0 0 0 1px rgba(255,255,255,.04) !important;
}
body[data-theme="aurora_midnight"] .qb-modal-header {
  border-bottom: 1px solid rgba(60,140,255,.12) !important;
  background: rgba(255,255,255,.025) !important;
}
body[data-theme="aurora_midnight"] .qb-modal-title { color: #eef5ff !important; font-weight: 800 !important; }
body[data-theme="aurora_midnight"] .qb-modal-footer {
  border-top: 1px solid rgba(60,140,255,.12) !important;
  background: rgba(255,255,255,.015) !important;
}
body[data-theme="aurora_midnight"] .qb-modal-tabs {
  border-bottom: 1px solid rgba(60,140,255,.12) !important;
}
body[data-theme="aurora_midnight"] .qb-modal-tab {
  color: #5a8aaa !important; font-weight: 600 !important; transition: all .13s !important;
}
body[data-theme="aurora_midnight"] .qb-modal-tab:hover { color: #90caff !important; }
body[data-theme="aurora_midnight"] .qb-modal-tab.active {
  color: #5ab8f8 !important;
  border-bottom: 2px solid #2d86e8 !important;
  font-weight: 700 !important;
}
body[data-theme="aurora_midnight"] .qb-field-label {
  font-size: 10.5px !important; font-weight: 700 !important;
  text-transform: uppercase !important; letter-spacing: .07em !important;
  color: #4a7898 !important;
}
body[data-theme="aurora_midnight"] .qb-field-input,
body[data-theme="aurora_midnight"] .qb-select {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(60,140,255,.18) !important;
  color: #ddeeff !important; border-radius: 9px !important;
}
body[data-theme="aurora_midnight"] .qb-field-input:focus,
body[data-theme="aurora_midnight"] .qb-select:focus {
  border-color: rgba(45,134,232,.55) !important;
  box-shadow: 0 0 0 3px rgba(45,134,232,.12) !important;
}

/* ── QB COLUMN / FILTER GRID ── */
body[data-theme="aurora_midnight"] .qb-col-grid label,
body[data-theme="aurora_midnight"] .qb-filter-item {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(60,140,255,.14) !important;
  border-radius: 8px !important;
  color: #7aa8cc !important;
  transition: all .13s !important;
}
body[data-theme="aurora_midnight"] .qb-col-grid label:hover,
body[data-theme="aurora_midnight"] .qb-filter-item:hover {
  background: rgba(45,134,232,.08) !important;
  border-color: rgba(79,172,249,.28) !important;
  color: #90caff !important;
}

/* ── QB SETTINGS SAVING LOCK ── */
body[data-theme="aurora_midnight"] #qbSettingsSavingLock {
  background: rgba(8,18,38,.93) !important;
  border: 1px solid rgba(60,140,255,.22) !important;
  backdrop-filter: blur(20px) !important;
  border-radius: 14px !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.6) !important;
}

/* ── DASHX / DISTRIBUTION MONITORING ── */
body[data-theme="aurora_midnight"] .dashx-card {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(60,140,255,.14) !important;
  border-radius: 12px !important;
}
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;
}

/* ── MISC SUPPLEMENTARY OVERRIDES ── */
/* Sidebar additional text */
body[data-theme="aurora_midnight"] .qb-tab-btn { color: #94b8d8 !important; }
body[data-theme="aurora_midnight"] .qb-tab-btn:hover { color: #c8e4ff !important; }
body[data-theme="aurora_midnight"] .qb-search-ico { color: #7aa8cc !important; }
body[data-theme="aurora_midnight"] .qb-search-input::placeholder { color: #4a6e8a !important; }

/* Online bar additional */
body[data-theme="aurora_midnight"] .onlinebar-count { color: #7aa8cc !important; }

/* World clock secondary */
body[data-theme="aurora_midnight"] .wclock .wc-label { color: #7aa8cc !important; }
body[data-theme="aurora_midnight"] .wclock .wc-sec { color: #7aa8cc !important; }
body[data-theme="aurora_midnight"] .qlabel { color: #7aa8cc !important; }

/* Announce bar secondary */
body[data-theme="aurora_midnight"] .announce-who { color: #7aa8cc !important; }
body[data-theme="aurora_midnight"] .announce-msg { color: #b4cce8 !important; }

/* Reminder meta */
body[data-theme="aurora_midnight"] .reminder-card .rc-meta { color: #7aa8cc !important; }

/* Topbar supplemental */
body[data-theme="aurora_midnight"] .brand-sub { color: #7aa8cc !important; }
body[data-theme="aurora_midnight"] #globalSearchInput::placeholder { color: #4a6e8a !important; }


/* =============================================================================
   IVORY EXECUTIVE — enterprise_ux.css isolation block
   Scoped 100% to body[data-theme="ivory_executive"]
   ============================================================================= */

/* UX page shell */
body[data-theme="ivory_executive"] .ux-page-header {
  background: #ffffff !important; border-bottom: 1px solid #e4e4e0 !important;
  box-shadow: 0 1px 4px rgba(26,26,46,.05) !important;
}
body[data-theme="ivory_executive"] .ux-page-title { color: #1a1a2e !important; font-family: 'Manrope', sans-serif !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .ux-page-sub   { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .ux-section-label { color: #b0b0be !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: .14em !important; text-transform: uppercase !important; }

/* UX cards */
body[data-theme="ivory_executive"] .ux-card {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  border-radius: 10px !important; box-shadow: 0 2px 10px rgba(26,26,46,.07) !important;
}
body[data-theme="ivory_executive"] .ux-card .ux-card-head {
  background: #f5f5f2 !important; border-bottom: 1px solid #e4e4e0 !important;
  border-radius: 10px 10px 0 0 !important;
}
body[data-theme="ivory_executive"] .ux-card .ux-card-title { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .ux-card .ux-card-sub   { color: #8a8a9a !important; }
body[data-theme="ivory_executive"] .ux-card .ux-card-body  { color: #1a1a2e !important; }

/* UX table */
body[data-theme="ivory_executive"] .ux-table th {
  background: #f5f5f2 !important; color: #8a8a9a !important;
  border-bottom: 2px solid #e4e4e0 !important; font-family: 'Manrope', sans-serif !important;
  font-size: 11px !important; font-weight: 700 !important; letter-spacing: .05em !important;
}
body[data-theme="ivory_executive"] .ux-table td { color: #1a1a2e !important; border-bottom: 1px solid #f0efe9 !important; }
body[data-theme="ivory_executive"] .ux-table tr:hover td { background: #fafaf7 !important; }

/* UX inputs */
body[data-theme="ivory_executive"] .ux-input,
body[data-theme="ivory_executive"] .ux-select,
body[data-theme="ivory_executive"] .ux-textarea {
  background: #ffffff !important; border: 1px solid #d4d4ce !important;
  color: #1a1a2e !important; border-radius: 8px !important;
  font-family: 'Manrope', sans-serif !important;
}
body[data-theme="ivory_executive"] .ux-input:focus,
body[data-theme="ivory_executive"] .ux-select:focus,
body[data-theme="ivory_executive"] .ux-textarea:focus {
  border-color: #1e40af !important; box-shadow: 0 0 0 3px rgba(30,64,175,.15) !important;
}
body[data-theme="ivory_executive"] .ux-input::placeholder { color: #b0b0be !important; }

/* UX buttons */
body[data-theme="ivory_executive"] .ux-btn-primary {
  background: #1e40af !important; border-color: #1e40af !important;
  color: #fff !important; border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(30,64,175,.28) !important; font-weight: 700 !important;
}
body[data-theme="ivory_executive"] .ux-btn-primary:hover {
  background: #1e3a8a !important; border-color: #1e3a8a !important;
}
body[data-theme="ivory_executive"] .ux-btn-secondary {
  background: #f0efe9 !important; border: 1px solid #d4d4ce !important;
  color: #1a1a2e !important; border-radius: 8px !important;
}
body[data-theme="ivory_executive"] .ux-btn-ghost {
  background: transparent !important; border: 1px solid #e4e4e0 !important;
  color: #8a8a9a !important; border-radius: 8px !important;
}
body[data-theme="ivory_executive"] .ux-btn-ghost:hover { background: #f0efe9 !important; color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .ux-btn-danger {
  background: #dc2626 !important; border-color: #dc2626 !important; color: #fff !important;
}

/* Tabs */
body[data-theme="ivory_executive"] .ux-tabs { border-bottom: 2px solid #e4e4e0 !important; }
body[data-theme="ivory_executive"] .ux-tab {
  color: #8a8a9a !important; background: transparent !important;
  border-bottom: 2px solid transparent !important; margin-bottom: -2px !important;
  font-weight: 600 !important;
}
body[data-theme="ivory_executive"] .ux-tab:hover { color: #1a1a2e !important; }
body[data-theme="ivory_executive"] .ux-tab.active {
  color: #1e40af !important; border-bottom-color: #1e40af !important; font-weight: 800 !important;
}

/* Toasts / Alerts */
body[data-theme="ivory_executive"] .toast,
body[data-theme="ivory_executive"] .alert,
body[data-theme="ivory_executive"] .banner {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  box-shadow: 0 6px 20px rgba(26,26,46,.12) !important; border-radius: 10px !important;
  color: #1a1a2e !important;
}
body[data-theme="ivory_executive"] .toast.ok,
body[data-theme="ivory_executive"] .alert.ok,
body[data-theme="ivory_executive"] .alert.success {
  background: rgba(22,163,74,.06) !important; border-color: rgba(22,163,74,.28) !important;
  color: #15803d !important;
}
body[data-theme="ivory_executive"] .toast.danger,
body[data-theme="ivory_executive"] .alert.danger,
body[data-theme="ivory_executive"] .alert.error {
  background: rgba(220,38,38,.06) !important; border-color: rgba(220,38,38,.28) !important;
  color: #b91c1c !important;
}
body[data-theme="ivory_executive"] .toast.warn,
body[data-theme="ivory_executive"] .alert.warn,
body[data-theme="ivory_executive"] .alert.warning {
  background: rgba(217,119,6,.07) !important; border-color: rgba(217,119,6,.28) !important;
  color: #92400e !important;
}
body[data-theme="ivory_executive"] .toast.info,
body[data-theme="ivory_executive"] .alert.info {
  background: rgba(30,64,175,.07) !important; border-color: rgba(30,64,175,.28) !important;
  color: #1e3a8a !important;
}
body[data-theme="ivory_executive"] .toast-title { color: inherit !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .toast-body  { color: inherit !important; opacity: .85; }

/* Error states */
body[data-theme="ivory_executive"] .err {
  background: rgba(220,38,38,.07) !important; border: 1px solid rgba(220,38,38,.28) !important;
  color: #b91c1c !important; border-radius: 8px !important;
}

/* Announce / notification toasts (bottom popup) */
body[data-theme="ivory_executive"] .notif-toast {
  background: #ffffff !important; border: 1px solid #e4e4e0 !important;
  box-shadow: 0 8px 28px rgba(26,26,46,.14) !important; border-radius: 12px !important;
}
body[data-theme="ivory_executive"] .notif-toast .title { color: #1a1a2e !important; font-weight: 800 !important; }
body[data-theme="ivory_executive"] .notif-toast .body  { color: #8a8a9a !important; }

/* Overlay scrim */
body[data-theme="ivory_executive"] .scrim,
body[data-theme="ivory_executive"] .overlay-scrim { background: rgba(26,26,46,.42) !important; }

/* Empty states */
body[data-theme="ivory_executive"] .empty-state,
body[data-theme="ivory_executive"] .empty { color: #b0b0be !important; }
body[data-theme="ivory_executive"] .empty-icon { opacity: .35 !important; }
body[data-theme="ivory_executive"] .empty-title { color: #8a8a9a !important; font-weight: 700 !important; }
body[data-theme="ivory_executive"] .empty-sub   { color: #b0b0be !important; }

/* Code blocks */
body[data-theme="ivory_executive"] .rn-code,
body[data-theme="ivory_executive"] code {
  background: #f0efe9 !important; border: 1px solid #e4e4e0 !important;
  color: #1e40af !important; border-radius: 5px !important;
}
body[data-theme="ivory_executive"] .rn-pre,
body[data-theme="ivory_executive"] pre {
  background: #f5f5f2 !important; border: 1px solid #e4e4e0 !important;
  color: #1a1a2e !important; border-radius: 8px !important;
}

/* Toggle / Switch */
body[data-theme="ivory_executive"] .toggle-track { background: #e4e4e0 !important; }
body[data-theme="ivory_executive"] .toggle-track.on { background: #1e40af !important; }
body[data-theme="ivory_executive"] .toggle-thumb { background: #fff !important; box-shadow: 0 1px 4px rgba(26,26,46,.18) !important; }

/* Checkbox / Radio */
body[data-theme="ivory_executive"] input[type="checkbox"]:checked,
body[data-theme="ivory_executive"] input[type="radio"]:checked { accent-color: #1e40af; }

/* Progress / Loading */
body[data-theme="ivory_executive"] .progress-bar { background: #f0efe9 !important; }
body[data-theme="ivory_executive"] .progress-fill { background: linear-gradient(90deg, #1e40af, #3b82f6) !important; }
body[data-theme="ivory_executive"] .spinner { border-color: rgba(30,64,175,.2) !important; border-top-color: #1e40af !important; }

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

/* Locked / disabled UI overlays */
body[data-theme="ivory_executive"] .locked-below { color: rgba(26,26,46,.6) !important; }
body[data-theme="ivory_executive"] .locked-overlay { background: rgba(245,245,242,.8) !important; border: 1px dashed #d4d4ce !important; color: #8a8a9a !important; border-radius: 8px !important; }