/* ── Dark theme overrides for the staff Control Tower pages ─────────────── */
/* Everything here is scoped under html[data-theme="dark"] so light mode (the
   default in style.css) is untouched unless the user has switched themes. */

html[data-theme="dark"]{
  --paper:#0a1420; --paper-2:#0f1c2c; --surface:rgba(20,32,48,.72);
  --ink:#eef2f7; --ink-2:#a9b8c9; --ink-3:#7c8ba0;
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.16);
}

html[data-theme="dark"] body{
  background:
    linear-gradient(180deg, rgba(6,12,20,.55), rgba(6,12,20,.82)),
    url('bg-dark.jpg') fixed center / cover no-repeat;
  background-color:#0a1420;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .greeting-widget,
html[data-theme="dark"] .stat,
html[data-theme="dark"] .gate-choice{
  background:var(--surface);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-color:var(--line);
  color:var(--ink);
}
html[data-theme="dark"] .gate-choice{color:var(--ink);}
html[data-theme="dark"] .gate-choice .hint{color:var(--ink-3);}
html[data-theme="dark"] .card-head{border-bottom-color:var(--line);}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea{background:rgba(255,255,255,.05); border-color:var(--line-2); color:var(--ink);}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{color:var(--ink-3);}
html[data-theme="dark"] .btn.ghost{background:rgba(255,255,255,.06); color:var(--ink); border-color:var(--line-2);}
html[data-theme="dark"] .btn.ghost:hover{background:rgba(255,255,255,.1);}
html[data-theme="dark"] .filters select,
html[data-theme="dark"] .filters input[type=search]{background:rgba(255,255,255,.05); border-color:var(--line-2); color:var(--ink);}
html[data-theme="dark"] .pill-filter{background:rgba(255,255,255,.05); border-color:var(--line-2); color:var(--ink-2);}
html[data-theme="dark"] .pill-filter.active{background:var(--ink); color:#0a1420;}

html[data-theme="dark"] table tr:hover td{background:rgba(255,255,255,.035);}
html[data-theme="dark"] th,
html[data-theme="dark"] td{border-bottom-color:var(--line);}

html[data-theme="dark"] .icon-chip.c-orange{background:rgba(233,98,12,.2); color:#ff9b57;}
html[data-theme="dark"] .icon-chip.c-blue{background:rgba(59,111,224,.2); color:#82a9ff;}
html[data-theme="dark"] .icon-chip.c-green{background:rgba(47,154,58,.2); color:#6fd57e;}
html[data-theme="dark"] .icon-chip.c-amber{background:rgba(217,154,11,.22); color:#ffcf5c;}
html[data-theme="dark"] .icon-chip.c-red{background:rgba(210,63,63,.22); color:#ff8686;}
html[data-theme="dark"] .icon-chip.c-purple{background:rgba(138,92,240,.22); color:#c3aaff;}

html[data-theme="dark"] .pill.pending{background:rgba(217,154,11,.2); color:#ffcf5c;}
html[data-theme="dark"] .pill.quoted{background:rgba(233,98,12,.2); color:#ff9b57;}
html[data-theme="dark"] .pill.accepted, html[data-theme="dark"] .pill.done{background:rgba(47,154,58,.2); color:#6fd57e;}
html[data-theme="dark"] .pill.rejected{background:rgba(210,63,63,.2); color:#ff8686;}
html[data-theme="dark"] .pill.dark{background:rgba(255,255,255,.09); color:var(--ink-2);}

html[data-theme="dark"] .modal-close{background:rgba(255,255,255,.09); color:var(--ink);}
html[data-theme="dark"] .section{border-top-color:var(--line);}
html[data-theme="dark"] .note-item{background:rgba(255,255,255,.045);}
html[data-theme="dark"] .doc-item{border-bottom-color:var(--line);}
html[data-theme="dark"] .back-link{color:var(--ink-2);}

/* Calendar grid */
html[data-theme="dark"] .cal-day{background:rgba(255,255,255,.03);}
html[data-theme="dark"] .cal-day:hover{background:rgba(255,255,255,.065);}
html[data-theme="dark"] .cal-day.other{background:rgba(255,255,255,.012); color:var(--ink-3);}
html[data-theme="dark"] .cal-day.selected{background:rgba(233,98,12,.16);}
html[data-theme="dark"] .cal-nav button{background:rgba(255,255,255,.06); border-color:var(--line-2); color:var(--ink);}
html[data-theme="dark"] .cal-dow{background:rgba(255,255,255,.04);}

/* Shipment stage panel on admin.html detail view */
html[data-theme="dark"] [style*="background:#eef2f8"]{background:rgba(255,255,255,.05) !important;}

/* .org-card/.side-foot .name intentionally reused var(--paper) as a light-on-dark
   text color in the light theme; --paper is now dark, so pin these explicitly. */
html[data-theme="dark"] .org-card .name, html[data-theme="dark"] .side-foot .name{color:#eef2f7;}
html[data-theme="dark"] .nav a:hover, html[data-theme="dark"] .side-foot a:hover{color:#eef2f7;}

/* Calendar: tasks-to-do widget */
html[data-theme="dark"] .task-due{background:rgba(255,255,255,.06);}
html[data-theme="dark"] .task-due.overdue{background:rgba(210,63,63,.22);color:#ff8686;}
html[data-theme="dark"] .task-del:hover{background:rgba(210,63,63,.22);color:#ff8686;}

/* Theme toggle button */
.theme-toggle{background:rgba(255,255,255,.06); border:1px solid var(--line-2); color:var(--ink); width:40px; height:40px; border-radius:var(--radius-sm); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; font-size:16px; flex-shrink:0;}
html:not([data-theme="dark"]) .theme-toggle{background:var(--surface); border-color:var(--line-2); color:var(--ink);}
