/**
 * Dark Mode — Indoor use (night shifts)
 * Softer than high-contrast mode, easier on the eyes
 */

:root {
    --bg-body: #1a1a2e;
    --bg-card: #16213e;
    --text-primary: #e0e0e0;
    --text-secondary: #b0b0b0;
    --text-muted: #cbd5e1;
    --border: #333;
}

body { background: #1a1a2e !important; color: #e0e0e0 !important; }

.card { background: #16213e !important; border-color: #1a1a2e !important; color: #e0e0e0 !important; }
.card-header { background: #0f3460 !important; border-color: #1a1a2e !important; color: #e0e0e0 !important; }

.yard-nav { background: #0f3460 !important; }

.form-control, .form-select {
    background: #16213e !important; color: #e0e0e0 !important;
    border-color: #333 !important;
}
.form-control:focus, .form-select:focus {
    border-color: #FFD100 !important;
    box-shadow: 0 0 0 0.2rem rgba(255,209,0,0.15) !important;
}
.form-label { color: #b0b0b0 !important; }

.action-card {
    background: #16213e !important;
    color: #e0e0e0 !important;
    border: 1px solid #2a3f6f !important;
}
.action-card:hover { border-color: #FFD100 !important; background: #1a2d50 !important; }

.table-yard td { color: #e0e0e0 !important; background: transparent !important; border-color: #333 !important; }
.table-yard th { background: #0f3460 !important; }

.dropdown-menu { background: #16213e !important; border-color: #333 !important; }
.dropdown-item { color: #e0e0e0 !important; }
.dropdown-item:hover { background: #0f3460 !important; }

.btn-outline-primary { color: #82b1ff !important; border-color: #82b1ff !important; }
.btn-outline-secondary { color: #999 !important; border-color: #555 !important; }

a { color: #82b1ff; }
.text-muted { color: #cbd5e1 !important; }
.text-secondary { color: #cbd5e1 !important; }

/* Form placeholder visibility */
.form-control::placeholder, .form-select::placeholder, input::placeholder, textarea::placeholder {
    color: #8b95a3 !important;
    opacity: 1 !important;
}

/* Focus ring — brighter gold for dark backgrounds */
.form-control:focus, .form-select:focus, .btn:focus, a:focus, button:focus, [tabindex]:focus {
    outline-color: #FFD100 !important;
}
*:focus-visible {
    outline: 3px solid #FFD100 !important;
    outline-offset: 2px !important;
}

.yard-breadcrumb { background: #16213e !important; border-color: #333 !important; }
.breadcrumb-item.active { color: #e0e0e0 !important; }

/* Toggle buttons */
.toggle-btn { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }
.carrier-chip { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }
.inspection-item { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }

.list-group-item { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }

.offcanvas { background: #0f3460 !important; color: #e0e0e0 !important; }

.alert { color: #e0e0e0 !important; }

.empty-state { color: #888 !important; }

/* Door/spot tiles */
.door-tile.door-available { background: #1a3a2a !important; }
.door-tile.door-occupied { background: #3a2a1a !important; }
.spot-cell.spot-empty { background: #1a3a2a !important; }
.spot-cell.spot-occupied { background: #cc7000 !important; }

/* ── Bootstrap overrides ── */
.bg-white { background: #16213e !important; }
.text-dark { color: #e0e0e0 !important; }
.bg-light, .table-light { background: #16213e !important; color: #e0e0e0 !important; }
.table-secondary { background: #0f3460 !important; color: #e0e0e0 !important; }
.table-warning { background: #3d2d00 !important; color: #ffc107 !important; }
.table-danger { background: #3d0d0d !important; color: #ff6b6b !important; }
/* Status color utilities — muted variants so they read on dark cards */
.bg-danger  { background: #b84848 !important; color: #fff !important; }
.bg-warning { background: #c69020 !important; color: #0a1e3d !important; }
.bg-success { background: #2fa855 !important; color: #fff !important; }
.bg-info    { background: #3b89c2 !important; color: #fff !important; }
.bg-secondary { background: #475569 !important; color: #e0e0e0 !important; }
.border-danger  { border-color: #b84848 !important; }
.border-warning { border-color: #c69020 !important; }
.border-success { border-color: #2fa855 !important; }
.border-info    { border-color: #3b89c2 !important; }
.border         { border-color: #334155 !important; }
.table > :not(caption) > * > * { border-color: #333 !important; }
.table-hover > tbody > tr:hover > * { background: #1a2d50 !important; }
.table thead th { background: #0f3460 !important; color: #e0e0e0 !important; }

/* Modal */
.modal-content { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }
.modal-header { border-color: #333 !important; }
.modal-footer { border-color: #333 !important; }
.btn-close { filter: invert(1); }

/* Nav pills */
.nav-pills .nav-link { color: #b0b0b0 !important; }
.nav-pills .nav-link.active { background: #0f3460 !important; color: #FFD100 !important; }

/* Btn group toggle (supervisor/clerk dashboard) */
.btn-group .btn-outline-secondary { color: #999 !important; border-color: #555 !important; background: transparent !important; }
.btn-group .btn-outline-secondary:hover { background: #0f3460 !important; color: #e0e0e0 !important; }
.btn-group .btn-navy { background: #0f3460 !important; }

/* Pagination */
.page-link { background: #16213e !important; color: #82b1ff !important; border-color: #333 !important; }
.page-item.active .page-link { background: #0f3460 !important; color: #FFD100 !important; }

/* ── Yard Check — Spot Cards ── */
.sc-name { color: #82b1ff !important; }
.sc-trailer { color: #e0e0e0 !important; }
.sc-detail { color: #888 !important; }
.sc-btn { background: #16213e !important; border-color: #333 !important; }
.sc-btn.sc-confirm { color: #4ade80 !important; border-color: rgba(74,222,128,0.3) !important; }
.sc-btn.sc-empty { color: #f87171 !important; border-color: rgba(248,113,113,0.3) !important; }
.sc-btn.sc-edit { color: #a78bfa !important; border-color: rgba(167,139,250,0.3) !important; }
.sc-toggle { background: #16213e !important; border-color: #333 !important; color: #e0e0e0 !important; }
.sc-toggle.sel { background: #0f3460 !important; color: #FFD100 !important; border-color: #0f3460 !important; }
.sc-correct { border-color: #333 !important; }
.spot-card { color: #e0e0e0 !important; }
.spot-card.confirmed { background: linear-gradient(135deg, #052e16, #064e3b) !important; border-color: #16a34a !important; }
.spot-card.confirmed .sc-name { color: #4ade80 !important; }
.spot-card.discrepancy { background: linear-gradient(135deg, #422006, #713f12) !important; border-color: #d97706 !important; }
.spot-card.discrepancy .sc-name { color: #fbbf24 !important; }
.spot-card.empty-confirmed { background: linear-gradient(135deg, #1e293b, #334155) !important; border-color: #64748b !important; }

/* ── Yard Check — Completion Flow ── */
.cf-card { background: #16213e !important; border-color: #333 !important; color: #e0e0e0 !important; }
.cf-card.cf-confirmed { background: linear-gradient(135deg, #052e16, #064e3b) !important; border-color: #22c55e !important; }
.cf-card.cf-discrepancy { background: linear-gradient(135deg, #422006, #713f12) !important; border-color: #f59e0b !important; }
.cf-card.cf-empty { background: #1e293b !important; border-color: #475569 !important; }
.cf-spot { color: #82b1ff !important; }
.cf-carrier { color: #888 !important; }
.cf-zone { color: #888 !important; }
.cf-nav-btn { background: #16213e !important; border-color: #333 !important; color: #e0e0e0 !important; }
.cf-counter { color: #82b1ff !important; }

/* ── Yard Check — Zone header + topbar ── */
.zone-header { background: #16213e !important; border-color: #333 !important; color: #e0e0e0 !important; }
.yc-topbar { background: #1a1a2e !important; border-color: #333 !important; }
.yc-progress { background: #333 !important; }
.zone-tab { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }
.zone-tab.active { background: #0f3460 !important; color: #FFD100 !important; border-color: #0f3460 !important; }
.zone-tab.done { background: #064e3b !important; color: #4ade80 !important; border-color: #064e3b !important; }
.zone-tab.partial { background: #3d2d00 !important; color: #ffc107 !important; border-color: #3d2d00 !important; }
.bulk-bar { background: #1a1a2e !important; border-color: #333 !important; }

/* ── Yard Check Wizard (start screen) ── */
.check-card { background: #16213e !important; border-color: #333 !important; color: #e0e0e0 !important; }
.check-card:hover { border-color: #FFD100 !important; }
.check-card .check-sub, .check-card .check-last { color: #888 !important; }
.resume-banner { background: #3d2d00 !important; border-color: #ffc107 !important; color: #ffc107 !important; }
.sys-box.occupied { background: #1a2d50 !important; border-color: #3b82f6 !important; }
.sys-box.empty-sys { background: #0d3320 !important; border-color: #4ade80 !important; }
.sys-trailer { color: #82b1ff !important; }
.sys-empty-label { color: #4ade80 !important; }
.wiz-zone-chip.doors { background: #1a2d50 !important; color: #82b1ff !important; }
.wiz-zone-chip.yard { background: #0d3320 !important; color: #4ade80 !important; }
.wiz-zone-chip.overflow { background: #3d2600 !important; color: #ffb74d !important; }
.wiz-zone-chip.wall { background: #2a2a2a !important; color: #bbb !important; }
.wiz-zone-chip.fence { background: #3d1a2a !important; color: #f9a8d4 !important; }
.wiz-zone-chip.callejon { background: #2d1a50 !important; color: #c4b5fd !important; }
.opt-btn { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }
.opt-btn.active { background: #0f3460 !important; color: #fff !important; border-color: #82b1ff !important; }
.opt-btn.pct.active { background: #cc7000 !important; color: #000 !important; border-color: #cc7000 !important; }
.btn-correct { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }
.btn-correct:hover { border-color: #ffc107 !important; color: #ffc107 !important; background: #3d2d00 !important; }
.correct-panel { background: #3d2d00 !important; border-color: #ffc107 !important; color: #e0e0e0 !important; }
.nav-arrow { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }
.disc-warning { background: #3d2d00 !important; border-color: #ffc107 !important; }
.wiz-progress { background: #333 !important; }
.btn-confirm { box-shadow: 0 4px 14px rgba(34,197,94,0.3) !important; }

/* ── Trailer Story ── */
.story-header { background: linear-gradient(135deg, #0f3460, #16213e) !important; }
.tl-time { color: #888 !important; }
.tl-title { color: #e0e0e0 !important; }
.tl-detail { color: #999 !important; }
.timeline::before { background: linear-gradient(to bottom, #0f3460, #333) !important; }

/* ── Door Detail / Summary stats ── */
.summary-stat .label { color: #888 !important; }

/* ── Input group addons ── */
.input-group-text { background: #0f3460 !important; color: #e0e0e0 !important; border-color: #333 !important; }

/* ── Util-card badges (supervisor/clerk dashboards) ── */
.util-card .uc-badge { background: #1a2d50 !important; color: #cbd5e1 !important; }
.util-card { background: #16213e !important; border-color: #2a3f6f !important; color: #e0e0e0 !important; }
.util-card .uc-icon { filter: brightness(1.25); }
.hero-card { background: #16213e !important; color: #e0e0e0 !important; }
.hero-card.hc-assign.has-pending { background: linear-gradient(135deg, #3d2e0e, #4a3813) !important; }
.hero-card.hc-assign.has-long-wait { background: linear-gradient(135deg, #3d1515, #4a1a1a) !important; }
.stat-bar { background: #16213e !important; border-color: #2a3f6f !important; }

/* ── KPI Cards (detention, analytics, carrier-sla) ── */
.kpi { background: #16213e !important; border-color: #333 !important; }
.kpi .kpi-label { color: #888 !important; }
.kpi .kpi-sub { color: #666 !important; }

/* ── Perf table (detention, carrier-sla) ── */
.perf-table td { color: #e0e0e0 !important; border-color: #333 !important; }
.perf-table tr:hover { background: #1a2d50 !important; }
.perf-table th { background: #0f3460 !important; color: #e0e0e0 !important; }

/* ── Section titles (analytics, carrier-sla, detention) ── */
.sec-title { color: #82b1ff !important; border-color: #cc8400 !important; }

/* ── Filter pills (detention, analytics, carrier-sla) ── */
.bracket-pills { border-color: #333 !important; }
.bracket-pills button { background: #16213e !important; color: #e0e0e0 !important; }
.bracket-pills button.active { background: #0f3460 !important; color: #FFD100 !important; }
.bracket-pills button:hover:not(.active) { background: #1a2d50 !important; }
.range-pills { border-color: #333 !important; }
.range-pills a { background: #16213e !important; color: #e0e0e0 !important; }
.range-pills a.active { background: #0f3460 !important; color: #FFD100 !important; }
.range-pills a:hover:not(.active) { background: #1a2d50 !important; }

/* ── SLA bar ── */
.sla-bar { background: #333 !important; }

/* ── Heatmap ── */
.heatmap-cell .hm-hour { color: #888 !important; }

/* ── Dwell badge ── */
.dwell-badge { color: #fff !important; }

/* ── Skeleton loader ── */
.skeleton { background: linear-gradient(90deg, #1a2d50 0%, #16213e 50%, #1a2d50 100%) !important; }

/* ── Toggle hover ── */
.toggle-btn:hover { background: #0f3460 !important; border-color: #adb5bd !important; }

/* ── Option buttons ── */
.opt-btn.active { background: #FFD100 !important; color: #000 !important; }

/* ── Spot cards (yard-check) ── */
.spot-card.confirmed { background: linear-gradient(135deg, #052e16, #064e3b) !important; border-color: #16a34a !important; }
.spot-card.discrepancy { background: linear-gradient(135deg, #422006, #3d2d00) !important; border-color: #d97706 !important; }
.spot-card.empty-confirmed { background: linear-gradient(135deg, #1e293b, #334155) !important; border-color: #64748b !important; }

/* ── Yard check zone tabs ── */
.zone-tab { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }
.zone-tab.active { background: #0f3460 !important; color: #FFD100 !important; border-color: #0f3460 !important; }
.zone-tab.done { background: #064e3b !important; color: #4ade80 !important; border-color: #064e3b !important; }
.zone-tab.partial { background: #3d2d00 !important; color: #ffc107 !important; border-color: #3d2d00 !important; }

/* ── Yard check topbar ── */
.yc-topbar { background: #1a1a2e !important; border-color: #333 !important; }
.yc-progress { background: #333 !important; }
.zone-header { background: #16213e !important; border-color: #333 !important; color: #e0e0e0 !important; }

/* ── Operations page ── */
.ops-tabs { background: #1a1a2e !important; border-color: #333 !important; }
.assign-trailer-card { background: #3d2d00 !important; border-color: #ffc107 !important; color: #e0e0e0 !important; }
.pending-card { background: #16213e !important; border-color: #333 !important; color: #e0e0e0 !important; }
.pending-card.selected { background: #3d2d00 !important; border-color: #ffc107 !important; }
.zt-btn { background: #16213e !important; color: #e0e0e0 !important; border-color: #333 !important; }
.zt-btn.active { background: #0f3460 !important; color: #FFD100 !important; border-color: #0f3460 !important; }
.door-tile-v2 { background: #16213e !important; border-color: #333 !important; color: #e0e0e0 !important; }

/* ── Disc row (yard-check-summary) ── */
.disc-row { background: #3d2d00 !important; color: #ffc107 !important; }

/* ── Gauge ring (analytics) ── */
.gauge-ring::before { background: #16213e !important; }

/* ── Carrier bar (analytics) ── */
.carrier-name { color: #e0e0e0 !important; }
.carrier-track { background: #333 !important; }
.carrier-pct { color: #888 !important; }

/* ── Waterfall (analytics) ── */
.wf-label { color: #b0b0b0 !important; }
.wf-track { background: #333 !important; }

/* ── Filter bar (detention) ── */
.filter-bar .badge { background: #333 !important; color: #e0e0e0 !important; }

/* ── Refresh badge ── */
.refresh-badge { color: #666 !important; }

/* ── Text color fixes ── */
.text-secondary { color: #b0b0b0 !important; }

/* ── Clerk Operations (operations.php) — tiles + badges ── */
.ops-tab .tab-badge-green { background: #064e3b !important; color: #4ade80 !important; }
.ops-tab .tab-badge-amber { background: #3d2d00 !important; color: #fbbf24 !important; }
.ops-tab .tab-badge-red { background: #3d0d0d !important; color: #f87171 !important; }
.ops-badge-green { background: #064e3b !important; color: #4ade80 !important; }
.ops-badge-amber { background: #3d2d00 !important; color: #fbbf24 !important; }
.pending-strip-title { color: #fbbf24 !important; }
.pending-scroll::-webkit-scrollbar-thumb { background: #555 !important; }
.door-tile-v2.dt-avail { background: linear-gradient(135deg, #052e16, #064e3b) !important; border-color: #16a34a !important; color: #4ade80 !important; }
.door-tile-v2.dt-occ { background: linear-gradient(135deg, #3d2d00, #422006) !important; border-color: #d97706 !important; color: #fbbf24 !important; }
.door-tile-v2.dt-live { background: linear-gradient(135deg, #0c1e3f, #1a2d50) !important; border-color: #3b82f6 !important; color: #82b1ff !important; }
.spot-tile.empty { background: linear-gradient(135deg, #052e16, #064e3b) !important; border-color: #16a34a !important; color: #4ade80 !important; }
.spot-tile.occupied { background: linear-gradient(135deg, #3d2d00, #422006) !important; border-color: #d97706 !important; color: #fbbf24 !important; }
.spot-tile.occupied .st-name { color: #fbbf24 !important; }
.spot-tile.occupied .st-trailer { color: #e0e0e0 !important; }
.spot-tile.occupied .st-carrier { color: #b0b0b0 !important; }
.spot-tile.reserved { background: #1e293b !important; border-color: #475569 !important; color: #888 !important; }
.spot-tile.maintenance { background: #3d0d0d !important; border-color: #f87171 !important; color: #f87171 !important; }
.as-handle { background: #555 !important; }

/* ── Clerk Dashboard (dashboard.php) ── */
.hero-card.hc-assign.has-pending { background: linear-gradient(135deg, #3d2d00, #422006) !important; }
.hero-card.hc-dispatch .hc-icon { color: #82b1ff !important; }

/* ── Admin Overview (overview.php) — tiles ── */
.ov-tile.avail { background: linear-gradient(135deg, #052e16, #064e3b) !important; border-color: #16a34a !important; color: #4ade80 !important; }
.ov-tile.occ { background: linear-gradient(135deg, #3d2d00, #422006) !important; border-color: #d97706 !important; color: #fbbf24 !important; }
.ov-tile.live { background: linear-gradient(135deg, #0c1e3f, #1a2d50) !important; border-color: #3b82f6 !important; color: #82b1ff !important; }
.ov-spot.avail { background: #052e16 !important; border-color: #16a34a !important; color: #4ade80 !important; }
.ov-spot.occ { background: #3d2d00 !important; border-color: #d97706 !important; color: #fbbf24 !important; }

/* ── Analytics (analytics.php) — gauge + bars ── */
.gauge-ring::before { background: #16213e !important; }
.carrier-name { color: #e0e0e0 !important; }
.carrier-track { background: #333 !important; }
.carrier-pct { color: #888 !important; }
.wf-label { color: #b0b0b0 !important; }
.wf-track { background: #333 !important; }
.perf-rank { color: #e0e0e0 !important; }

/* ── TV displays (tv-live.php, tv-scoreboard.php) — always dark, skip overrides ── */

/* ── Security Kiosk (kiosk.php) — always dark theme, skip overrides ── */

/* ── Age indicator dots — ensure visibility on dark backgrounds ── */
.age-dot { border: 1px solid rgba(255,255,255,0.2); }

/* ── ETD countdown badges ── */
.dt-etd, .st-etd { border: 1px solid rgba(255,255,255,0.1); }

/* ── Yard spot reservation — purple theme on dark ── */
.spot-tile.reserved { background: #1e1245 !important; border-color: #7c3aed !important; }
.spot-tile.reserved .spot-label { color: #c4b5fd !important; }

/* ── Yard check comparison — change type colors on dark ── */
.compare-arrived { background: rgba(34,197,94,0.15) !important; }
.compare-departed { background: rgba(239,68,68,0.15) !important; }
.compare-moved { background: rgba(245,158,11,0.15) !important; }

/* ── Plant manager KPI cards ── */
.pm-kpi { background: var(--bg-card, #16213e) !important; border-color: #1a2040 !important; }
.pm-kpi .pm-label { color: #888 !important; }

/* ── Executive KPI cards ── */
.exec-kpi { background: var(--bg-card, #16213e) !important; border-color: #1a2040 !important; }

/* ── Bulk load toggles in yard check ── */
#bulkBar .sc-toggle { background: var(--bg-card, #16213e) !important; border-color: #333 !important; color: #ccc !important; }
#bulkBar .sc-toggle.sel { background: var(--navy, #0a1e3d) !important; color: #fff !important; }

/* ── Swipe hint text ── */
.swipe-hint { color: rgba(255,255,255,0.3) !important; }

/* ── Photo preview in yard check ── */
.photo-preview img { border: 1px solid #333; }
