/* ============================================================
   AKMI Premium Design System — Global Overrides
   Applied across all template families for visual consistency.
   Brand: #E95420 orange, #0F172A dark, #EDEAE3 bone
   Typography: Inter (UI) + JetBrains Mono (data/mono)
   Shape language: Zero border-radius (military-grade precision)
   Accessibility: WCAG 2.1 AA compliant focus + contrast
   ============================================================ */

/* ---------- Accessibility: Color Contrast (WCAG 2.1 AA) ---------- */
/* #E95420 on white = 3.65:1 (fails AA for normal text)
   Use --akmi-orange-text (#C44418) for small text on white = 5.02:1 (passes AA)
   Keep #E95420 for backgrounds, large headings, and interactive accents */
:root {
  /* ── Brand colors ──────────────────────────────────── */
  --akmi-orange: #E95420;
  --akmi-orange-hover: #D44810;
  --akmi-orange-light: rgba(233, 84, 32, 0.1);
  --akmi-orange-text: #C44418;
  --akmi-dark: #0F172A;
  --akmi-dark-alt: #1E293B;
  --akmi-bone: #EDEAE3;

  /* ── Text colors ───────────────────────────────────── */
  --text-primary: #0F172A;
  --text-secondary: #334155;
  --text-tertiary: #64748B;
  --text-muted: #94A3B8;
  --text-inverse: #EDEAE3;

  /* ── Surface colors ────────────────────────────────── */
  --surface-primary: #FFFFFF;
  --surface-secondary: #F8FAFC;
  --surface-elevated: #FFFFFF;
  --surface-overlay: rgba(15, 23, 42, 0.5);

  /* ── Border colors ─────────────────────────────────── */
  --border-default: #E2E8F0;
  --border-subtle: #F1F5F9;
  --border-strong: #CBD5E1;

  /* ── Status colors ─────────────────────────────────── */
  --status-success: #22C55E;
  --status-warning: #F59E0B;
  --status-error: #EF4444;
  --status-info: #3B82F6;

  /* ── Mono font ─────────────────────────────────────── */
  --font-mono: 'JetBrains Mono', monospace;
  --font-ui: 'Inter', system-ui, sans-serif;

  /* ── Spacing scale ─────────────────────────────────── */
  --section-gap: 1.5rem;
  --card-padding: 1.25rem;

  /* ── Shadows ───────────────────────────────────────── */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -1px rgba(0, 0, 0, 0.04);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.03);

  /* ── New brand colors ────────────────────────────── */
  --akmi-blue: #3B82F6;
  --akmi-purple: #8B5CF6;
  --akmi-teal: #14B8A6;

  /* ── Typography weight scale ─────────────────────── */
  --font-weight-display: 800;
  --font-weight-h1: 700;
  --font-weight-h2: 600;
  --font-weight-h3: 600;
  --font-weight-body: 400;
  --font-weight-small: 500;
  --font-weight-micro: 500;

  /* ── Typography tracking scale ───────────────────── */
  --tracking-display: -0.04em;
  --tracking-h1: -0.03em;
  --tracking-h2: -0.02em;
  --tracking-body: -0.01em;
  --tracking-label: 0.12em;
  --tracking-micro: 0.08em;

  /* ── Motion timing ───────────────────────────────── */
  --duration-micro: 80ms;
  --duration-fast: 150ms;
  --duration-normal: 300ms;
  --duration-slow: 500ms;
  --duration-camera: 600ms;

  /* ── Motion easing ───────────────────────────────── */
  --ease-enter: cubic-bezier(0, 0, 0.2, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Dark mode overrides ─────────────────────────────── */
[data-theme="dark"] {
  --text-primary: #EDEAE3;
  --text-secondary: #CBD5E1;
  --text-tertiary: #94A3B8;
  --text-muted: #64748B;
  --text-inverse: #0F172A;

  --surface-primary: #0F172A;
  --surface-secondary: #1E293B;
  --surface-elevated: #1E293B;
  --surface-overlay: rgba(0, 0, 0, 0.6);

  --border-default: rgba(255, 255, 255, 0.08);
  --border-subtle: rgba(255, 255, 255, 0.04);
  --border-strong: rgba(255, 255, 255, 0.15);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);

  /* ── New brand colors (same in dark) ───────────── */
  --akmi-blue: #3B82F6;
  --akmi-purple: #8B5CF6;
  --akmi-teal: #14B8A6;
}

/* ---------- Shape: zero radius everywhere ---------- */
*,
*::before,
*::after {
  border-radius: 0 !important;
}

/* ---------- Font rendering ---------- */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

/* ---------- Focus states ---------- */
input:focus,
select:focus,
textarea:focus,
button:focus-visible {
  outline: none;
  border-color: #E95420 !important;
  box-shadow: 0 0 0 1px rgba(233, 84, 32, 0.3),
              inset 0 0 0 1px rgba(233, 84, 32, 0.1) !important;
}

/* ---------- Transition defaults ---------- */
a,
button,
input,
select,
textarea {
  transition-duration: 200ms;
  transition-timing-function: ease;
}

/* ---------- Selection color ---------- */
::selection {
  background: rgba(233, 84, 32, 0.2);
  color: inherit;
}

/* ---------- Scrollbar styling (webkit) ---------- */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.3);
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(148, 163, 184, 0.5);
}

/* ---------- JetBrains Mono for data ---------- */
.font-mono,
.mono,
[class*="font-mono"],
code,
kbd,
samp {
  font-family: 'JetBrains Mono', 'SF Mono', 'Cascadia Code', monospace;
}

/* ---------- Status colors (consistent) ---------- */
.text-success, .status-success { color: #22C55E; }
.text-warning, .status-warning { color: #EAB308; }
.text-danger, .status-danger   { color: #EF4444; }
.text-info, .status-info       { color: #3B82F6; }

.bg-success { background: rgba(34, 197, 94, 0.12); }
.bg-warning { background: rgba(234, 179, 8, 0.12); }
.bg-danger  { background: rgba(239, 68, 68, 0.12); }
.bg-info    { background: rgba(59, 130, 246, 0.12); }

/* ---------- Touch targets ---------- */
@media (pointer: coarse) {
  button,
  a,
  input[type="checkbox"],
  input[type="radio"],
  select {
    min-height: 44px;
    min-width: 44px;
  }
}

/* ---------- Typography fine-tuning ---------- */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ---------- Premium focus ring for interactive elements (WCAG 2.1 AA) ---------- */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #E95420;
  outline-offset: 2px;
}
/* Remove outline for mouse/touch users (not keyboard) */
:focus:not(:focus-visible) {
  outline: none;
}

/* ---------- Smooth loading transitions ---------- */
img {
  transition: opacity 0.3s ease;
}

/* ---------- Table styling (premium consistent) ---------- */
table {
  border-collapse: collapse;
  width: 100%;
}
th {
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* ============================================================
   DARK MODE — Comprehensive System
   Activated via data-theme="dark" on <html>
   Color palette: #0F172A primary bg, #1E293B secondary,
   #EDEAE3 primary text, #94A3B8 secondary text
   ============================================================ */

/* ---------- CSS Custom Properties (dark) ---------- */
[data-theme="dark"] {
  --bg-primary: #0F172A;
  --bg-secondary: #1E293B;
  --bg-card: #1E293B;
  --bg-elevated: #263048;
  --bg-input: #162036;
  --text-primary: #EDEAE3;
  --text-secondary: #94A3B8;
  --text-muted: #64748B;
  --text-heading: #F1F5F9;
  --border-color: #334155;
  --border-subtle: #1E293B;
  --hover-bg: rgba(255, 255, 255, 0.06);
  --active-bg: rgba(233, 84, 32, 0.15);
  --scrollbar-thumb: rgba(148, 163, 184, 0.2);
  --scrollbar-thumb-hover: rgba(148, 163, 184, 0.35);
  color-scheme: dark;

  /* ── New brand colors (same in dark) ───────────── */
  --akmi-blue: #3B82F6;
  --akmi-purple: #8B5CF6;
  --akmi-teal: #14B8A6;
}

/* ---------- Dark: scrollbar ---------- */
[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
}
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}

/* ---------- Dark: selection ---------- */
[data-theme="dark"] ::selection {
  background: rgba(233, 84, 32, 0.35);
  color: #EDEAE3;
}

/* ---------- Dark: focus states ---------- */
[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] button:focus-visible {
  box-shadow: 0 0 0 1px rgba(233, 84, 32, 0.4),
              inset 0 0 0 1px rgba(233, 84, 32, 0.15) !important;
}

/* ---------- Dark: status colors (adjusted for dark bg) ---------- */
[data-theme="dark"] .bg-success { background: rgba(34, 197, 94, 0.15); }
[data-theme="dark"] .bg-warning { background: rgba(234, 179, 8, 0.15); }
[data-theme="dark"] .bg-danger  { background: rgba(239, 68, 68, 0.15); }
[data-theme="dark"] .bg-info    { background: rgba(59, 130, 246, 0.15); }

/* ---------- Dark: headings ---------- */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6 {
  color: var(--text-heading);
}

/* ---------- Dark: links ---------- */
[data-theme="dark"] a:not([class*="bg-"]):not([class*="text-akmi"]):not(.sidebar-nav-item):not(.sidebar-sub-item):not(.cmd-item) {
  color: #93C5FD;
}
[data-theme="dark"] a:not([class*="bg-"]):not([class*="text-akmi"]):not(.sidebar-nav-item):not(.sidebar-sub-item):not(.cmd-item):hover {
  color: #BFDBFE;
}

/* ---------- Dark: Tailwind class overrides ---------- */
/* Backgrounds */
[data-theme="dark"] .bg-white { background: var(--bg-card) !important; }
[data-theme="dark"] .bg-gray-50,
[data-theme="dark"] .bg-gray-100,
[data-theme="dark"] .bg-neutral-50 { background: #162036 !important; }
[data-theme="dark"] .bg-neutral-100 { background: var(--bg-secondary) !important; }
[data-theme="dark"] .bg-neutral-200 { background: #334155 !important; }

/* Text */
[data-theme="dark"] .text-neutral-900,
[data-theme="dark"] .text-neutral-800,
[data-theme="dark"] .text-gray-900,
[data-theme="dark"] .text-gray-800 { color: var(--text-primary) !important; }
[data-theme="dark"] .text-neutral-700,
[data-theme="dark"] .text-neutral-600,
[data-theme="dark"] .text-gray-700,
[data-theme="dark"] .text-gray-600 { color: var(--text-secondary) !important; }
[data-theme="dark"] .text-neutral-500,
[data-theme="dark"] .text-gray-500 { color: var(--text-muted) !important; }
[data-theme="dark"] .text-neutral-400,
[data-theme="dark"] .text-gray-400 { color: #475569 !important; }
[data-theme="dark"] .text-black { color: var(--text-primary) !important; }

/* Borders */
[data-theme="dark"] .border-neutral-200,
[data-theme="dark"] .border-neutral-300,
[data-theme="dark"] .border-gray-200,
[data-theme="dark"] .border-gray-300 { border-color: var(--border-color) !important; }
[data-theme="dark"] .border-neutral-100,
[data-theme="dark"] .border-gray-100 { border-color: var(--border-subtle) !important; }

/* Divide */
[data-theme="dark"] .divide-neutral-200 > :not([hidden]) ~ :not([hidden]),
[data-theme="dark"] .divide-gray-200 > :not([hidden]) ~ :not([hidden]) { border-color: var(--border-color) !important; }

/* Hover backgrounds */
[data-theme="dark"] .hover\:bg-neutral-50:hover,
[data-theme="dark"] .hover\:bg-neutral-100:hover,
[data-theme="dark"] .hover\:bg-gray-50:hover,
[data-theme="dark"] .hover\:bg-gray-100:hover { background: var(--hover-bg) !important; }

/* Ring */
[data-theme="dark"] .ring-neutral-200,
[data-theme="dark"] .ring-gray-200 { --tw-ring-color: var(--border-color) !important; }

/* ---------- Dark: modals and overlays ---------- */
[data-theme="dark"] .modal-content,
[data-theme="dark"] [role="dialog"],
[data-theme="dark"] .dialog-panel {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary);
}

/* ---------- Dark: tooltips ---------- */
[data-theme="dark"] [role="tooltip"],
[data-theme="dark"] .tooltip {
  background: var(--bg-elevated) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

/* ---------- Dark: alerts and notices ---------- */
[data-theme="dark"] .alert,
[data-theme="dark"] .notice {
  background: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary);
}

/* ---------- Dark: empty state panels ---------- */
[data-theme="dark"] .empty-state {
  color: var(--text-muted);
}

/* ---------- Dark: progress bars ---------- */
[data-theme="dark"] .progress-track,
[data-theme="dark"] progress {
  background: var(--bg-elevated);
}

/* ---------- Dark: Chart.js override hint ---------- */
[data-theme="dark"] canvas {
  filter: none; /* do not invert charts — handle via Chart.js config */
}

/* ---------- Dark: meta-theme for mobile browser chrome ---------- */
@media (prefers-color-scheme: dark) {
  [data-theme="system"] {
    color-scheme: dark;
  }
}

/* ---------- Card depth system ---------- */
.card-shadow {
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
}
.card-shadow-md {
  box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.07), 0 2px 4px -2px rgba(15, 23, 42, 0.05);
}
.card-shadow-lg {
  box-shadow: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.04);
}
[data-theme="dark"] .card-shadow {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.15);
}
[data-theme="dark"] .card-shadow-md {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -2px rgba(0, 0, 0, 0.2);
}
[data-theme="dark"] .card-shadow-lg {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.35), 0 4px 6px -4px rgba(0, 0, 0, 0.2);
}

/* ---------- Numeric data: JetBrains Mono ---------- */
.num-tab,
[data-numeric],
.font-mono,
td.num,
.kpi-value,
.stat-value {
  font-family: 'JetBrains Mono', 'SF Mono', 'Cascadia Code', monospace;
  font-variant-numeric: tabular-nums;
}

/* ---------- Premium button polish ---------- */
.btn-premium {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 20px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  border: none;
  cursor: pointer;
  transition: transform 80ms ease, box-shadow 200ms ease, background 200ms ease;
  min-height: 44px;
}
.btn-premium:active { transform: scale(0.98); }
.btn-premium-orange {
  background: #E95420;
  color: white;
  box-shadow: 0 2px 8px rgba(233, 84, 32, 0.3);
}
.btn-premium-orange:hover {
  background: #D44A1A;
  box-shadow: 0 4px 12px rgba(233, 84, 32, 0.4);
}
.btn-premium-dark {
  background: #0F172A;
  color: white;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.2);
}
.btn-premium-dark:hover {
  background: #1E293B;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.25);
}
.btn-premium-ghost {
  background: transparent;
  color: #64748B;
  border: 1px solid #D1CEC7;
}
.btn-premium-ghost:hover {
  border-color: #E95420;
  color: #E95420;
  background: rgba(233, 84, 32, 0.04);
}
[data-theme="dark"] .btn-premium-ghost {
  border-color: #334155;
  color: #94A3B8;
}
[data-theme="dark"] .btn-premium-ghost:hover {
  border-color: #E95420;
  color: #E95420;
  background: rgba(233, 84, 32, 0.08);
}

/* ---------- Interactive orange accent ---------- */
.interactive-orange {
  transition: border-color 150ms ease, color 150ms ease;
}
.interactive-orange:hover {
  border-color: #E95420;
}
.interactive-orange:focus-within {
  border-color: #E95420;
  box-shadow: 0 0 0 1px rgba(233, 84, 32, 0.2);
}

/* ---------- Icon sizing baseline (16px) ---------- */
.icon-sm { width: 16px; height: 16px; flex-shrink: 0; }
.icon-md { width: 20px; height: 20px; flex-shrink: 0; }
.icon-lg { width: 24px; height: 24px; flex-shrink: 0; }

/* ---------- AKMI bone-tinted table rows ---------- */
[data-theme="dark"] .bg-\[\#EDEAE3\],
[data-theme="dark"] .bg-\[\#EDEAE3\]\/40,
[data-theme="dark"] .bg-\[\#EDEAE3\]\/50 {
  background: var(--bg-secondary) !important;
}
[data-theme="dark"] .bg-\[\#FAFAF8\] {
  background: #162036 !important;
}

/* ---------- Dark: slate text overrides ---------- */
[data-theme="dark"] .text-slate-900 { color: var(--text-primary) !important; }
[data-theme="dark"] .text-slate-800 { color: #E2E8F0 !important; }
[data-theme="dark"] .text-slate-700 { color: #CBD5E1 !important; }
[data-theme="dark"] .text-slate-600 { color: var(--text-secondary) !important; }
[data-theme="dark"] .text-slate-500 { color: var(--text-muted) !important; }

/* ---------- Dark: slate bg overrides ---------- */
[data-theme="dark"] .bg-slate-50 { background: var(--bg-secondary) !important; }
[data-theme="dark"] .bg-slate-100 { background: #162036 !important; }

/* ---------- Dark: slate border overrides ---------- */
[data-theme="dark"] .border-slate-200,
[data-theme="dark"] .border-slate-100 { border-color: var(--border-color) !important; }
[data-theme="dark"] .divide-slate-100 > :not([hidden]) ~ :not([hidden]) { border-color: var(--border-color) !important; }

/* ---------- Dark: bone border overrides ---------- */
[data-theme="dark"] .border-\[\#D1CEC7\] { border-color: var(--border-color) !important; }
[data-theme="dark"] .border-\[\#EDEAE3\] { border-color: var(--border-subtle) !important; }

/* ---------- Dark: hover overrides ---------- */
[data-theme="dark"] .hover\:bg-slate-50:hover { background: var(--hover-bg) !important; }
[data-theme="dark"] .hover\:bg-\[\#EDEAE3\]\/50:hover { background: var(--hover-bg) !important; }

/* ---------- Dark: coach form inputs ---------- */
[data-theme="dark"] .var-select,
[data-theme="dark"] input[class*="border-slate"],
[data-theme="dark"] select[class*="border-slate"],
[data-theme="dark"] textarea[class*="border-slate"],
[data-theme="dark"] input[class*="border-\[#D1CEC7\]"],
[data-theme="dark"] select[class*="border-\[#D1CEC7\]"] {
  background: var(--bg-input) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

/* ---------- Dark: orange bg buttons stay orange ---------- */
[data-theme="dark"] .bg-\[\#E95420\],
[data-theme="dark"] .bg-orange-600,
[data-theme="dark"] .btn-premium-orange {
  background: #E95420 !important;
  color: white !important;
}

/* ---------- Dark: dark bg elements stay dark ---------- */
[data-theme="dark"] .bg-\[\#0F172A\] {
  background: #0B1120 !important;
}

/* ---------- Dark: status badges keep contrast ---------- */
[data-theme="dark"] .bg-emerald-100 { background: rgba(16, 185, 129, 0.15) !important; }
[data-theme="dark"] .bg-amber-100 { background: rgba(245, 158, 11, 0.15) !important; }
[data-theme="dark"] .bg-blue-100 { background: rgba(59, 130, 246, 0.15) !important; }
[data-theme="dark"] .bg-rose-100 { background: rgba(244, 63, 94, 0.15) !important; }
[data-theme="dark"] .bg-sky-100 { background: rgba(56, 189, 248, 0.15) !important; }
[data-theme="dark"] .bg-orange-50\/50,
[data-theme="dark"] .bg-orange-50 { background: rgba(233, 84, 32, 0.08) !important; }

/* ---------- Dark: chart card backgrounds ---------- */
[data-theme="dark"] .chart-card { background: var(--bg-card) !important; border-color: var(--border-color) !important; }
[data-theme="dark"] .chart-card .cc-header { border-color: var(--border-color) !important; }
[data-theme="dark"] .chart-card .cc-title { color: var(--text-secondary) !important; }

/* ---------- Dark: kpi cards ---------- */
[data-theme="dark"] .kpi-card { background: var(--bg-card) !important; border-color: var(--border-color) !important; }
[data-theme="dark"] .kpi-label { color: var(--text-muted) !important; }
[data-theme="dark"] .kpi-sub { color: var(--text-muted) !important; }

/* ---------- Dark: asset map sections ---------- */
[data-theme="dark"] .am-section { background: var(--bg-card) !important; border-color: var(--border-color) !important; }
[data-theme="dark"] .am-section-header { background: var(--bg-secondary) !important; border-color: var(--border-color) !important; }
[data-theme="dark"] .am-section-title { color: var(--text-muted) !important; }
[data-theme="dark"] .am-label { color: var(--text-muted) !important; }
[data-theme="dark"] .am-value { color: var(--text-primary) !important; }
[data-theme="dark"] .am-empty { color: var(--text-muted) !important; }
[data-theme="dark"] .rom-row { border-color: var(--border-color) !important; }
[data-theme="dark"] .rom-label { color: var(--text-secondary) !important; }
[data-theme="dark"] .rom-bar-container { background: var(--bg-secondary) !important; }
[data-theme="dark"] .rom-bar-center { background: var(--border-color) !important; }
[data-theme="dark"] .kpi-bar { background: var(--bg-secondary) !important; }
[data-theme="dark"] .kpi-input { background: var(--bg-input) !important; border-color: var(--border-color) !important; color: var(--text-primary) !important; }

/* ---------- Dark: macrocycle planner ---------- */
[data-theme="dark"] .phase-bar { border-color: var(--border-color) !important; }
[data-theme="dark"] .week-cell { color: var(--text-secondary) !important; }
[data-theme="dark"] .week-detail { background: var(--bg-secondary) !important; border-color: var(--border-color) !important; }
[data-theme="dark"] .var-badge { background: var(--bg-secondary) !important; border-color: var(--border-color) !important; }
[data-theme="dark"] .macro-card { background: var(--bg-card) !important; border-color: var(--border-color) !important; }
[data-theme="dark"] .create-form .bg-white { background: var(--bg-card) !important; }

/* ---------- Dark: review page editable cells ---------- */
[data-theme="dark"] .editable-cell:hover { background: rgba(233, 84, 32, 0.1) !important; }
[data-theme="dark"] .editable-cell:focus { background: var(--bg-input) !important; }
[data-theme="dark"] .day-header { background: linear-gradient(90deg, #0B1120, #162036) !important; }

/* ---------- Dark: energy systems ---------- */
[data-theme="dark"] .bg-blue-50 { background: rgba(59, 130, 246, 0.1) !important; }
[data-theme="dark"] .bg-red-50 { background: rgba(239, 68, 68, 0.1) !important; }
[data-theme="dark"] .bg-emerald-50 { background: rgba(16, 185, 129, 0.1) !important; }

/* ---------- Dark: calendar heatmap ---------- */
[data-theme="dark"] .cal-cell.rest { background: var(--bg-secondary) !important; }
[data-theme="dark"] .cal-cell.rest .cal-day { color: var(--text-muted) !important; }

/* ============================================================
   SECTION HEADER: Mono Uppercase Orange
   Use on h2/h3 section dividers across assessment, gait, video
   ============================================================ */
.section-header-mono {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #E95420;
}
[data-theme="dark"] .section-header-mono {
  color: #F97316;
}

/* ============================================================
   FINDING CARDS: Severity color-coding
   red=critical, amber=moderate, green=normal
   ============================================================ */
.finding-card {
  border: 1px solid #D1CEC7;
  padding: 12px 16px;
  background: white;
  border-left-width: 3px;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}
.finding-card:hover {
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}
.finding-card--critical {
  border-left-color: #DC2626;
  background: #FEF2F2;
}
.finding-card--moderate {
  border-left-color: #D97706;
  background: #FFFBEB;
}
.finding-card--normal {
  border-left-color: #16A34A;
  background: #F0FDF4;
}
.finding-card--info {
  border-left-color: #2563EB;
  background: #EFF6FF;
}

[data-theme="dark"] .finding-card {
  background: var(--bg-card);
  border-color: var(--border-color);
}
[data-theme="dark"] .finding-card--critical {
  border-left-color: #EF4444;
  background: rgba(239, 68, 68, 0.08);
}
[data-theme="dark"] .finding-card--moderate {
  border-left-color: #F59E0B;
  background: rgba(245, 158, 11, 0.08);
}
[data-theme="dark"] .finding-card--normal {
  border-left-color: #22C55E;
  background: rgba(34, 197, 94, 0.08);
}
[data-theme="dark"] .finding-card--info {
  border-left-color: #3B82F6;
  background: rgba(59, 130, 246, 0.08);
}

/* Severity badge inline */
.severity-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 2px 8px;
  border: 1px solid;
}
.severity-badge--critical {
  color: #DC2626;
  border-color: #FECACA;
  background: #FEF2F2;
}
.severity-badge--critical::before {
  content: '';
  width: 6px;
  height: 6px;
  background: #DC2626;
  flex-shrink: 0;
}
.severity-badge--moderate {
  color: #D97706;
  border-color: #FED7AA;
  background: #FFFBEB;
}
.severity-badge--moderate::before {
  content: '';
  width: 6px;
  height: 6px;
  background: #D97706;
  flex-shrink: 0;
}
.severity-badge--normal {
  color: #16A34A;
  border-color: #BBF7D0;
  background: #F0FDF4;
}
.severity-badge--normal::before {
  content: '';
  width: 6px;
  height: 6px;
  background: #16A34A;
  flex-shrink: 0;
}

[data-theme="dark"] .severity-badge--critical {
  background: rgba(239, 68, 68, 0.12);
  border-color: rgba(239, 68, 68, 0.3);
}
[data-theme="dark"] .severity-badge--moderate {
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(245, 158, 11, 0.3);
}
[data-theme="dark"] .severity-badge--normal {
  background: rgba(34, 197, 94, 0.12);
  border-color: rgba(34, 197, 94, 0.3);
}

/* ============================================================
   PHOTO/VIDEO CONTAINERS: Clean borders, aspect ratio
   ============================================================ */
.media-container {
  position: relative;
  background: #000;
  border: 1px solid #334155;
  overflow: hidden;
}
.media-container img,
.media-container video {
  width: 100%;
  height: 100%;
  display: block;
}
.media-container--portrait {
  aspect-ratio: 3/4;
}
.media-container--landscape {
  aspect-ratio: 16/9;
}
.media-container--square {
  aspect-ratio: 1/1;
}
.media-container img {
  object-fit: cover;
}
.media-container video {
  object-fit: contain;
}

/* ============================================================
   STEP INDICATOR: Connected circles, active orange
   ============================================================ */
.step-indicator {
  display: flex;
  align-items: center;
  gap: 0;
  padding: 0;
  margin: 0;
  list-style: none;
}
.step-indicator__item {
  display: flex;
  align-items: center;
}
.step-indicator__circle {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  border: 2px solid #D1CEC7;
  background: white;
  color: #94A3B8;
  flex-shrink: 0;
  transition: all 200ms ease;
}
.step-indicator__line {
  width: 32px;
  height: 2px;
  background: #D1CEC7;
  flex-shrink: 0;
  transition: background 200ms ease;
}
.step-indicator__item--active .step-indicator__circle {
  border-color: #E95420;
  background: #E95420;
  color: white;
}
.step-indicator__item--active .step-indicator__line {
  background: #E95420;
}
.step-indicator__item--completed .step-indicator__circle {
  border-color: #16A34A;
  background: #16A34A;
  color: white;
}
.step-indicator__item--completed .step-indicator__line {
  background: #16A34A;
}
[data-theme="dark"] .step-indicator__circle {
  background: var(--bg-card);
  border-color: var(--border-color);
  color: var(--text-muted);
}
[data-theme="dark"] .step-indicator__line {
  background: var(--border-color);
}

/* ============================================================
   DATA VALUE: JetBrains Mono for measurements/angles/ROM
   ============================================================ */
.data-value {
  font-family: 'JetBrains Mono', monospace;
  font-variant-numeric: tabular-nums;
}

/* ---------- Print styles ---------- */
@media print {
  * { border-radius: 0 !important; }
  body { background: white; color: black; }
  /* Always print in light mode */
  [data-theme="dark"] body { background: white !important; color: black !important; }
}