/* Dark theme — overrides LS tokens with a dark Legalsense palette.
   Coral remains the attention accent; periwinkle stays for selection;
   navy ink inverts to a near-black canvas with elevated navy surfaces. */

[data-theme="dark"] {
  /* Canvas + surfaces */
  --ls-canvas:        #0E1119;
  --ls-canvas-warm:   #131725;
  --ls-surface:       #1A1F2E;
  --ls-surface-hover: #232838;

  /* Lines / borders */
  --ls-line-100:      #232838;
  --ls-line-200:      #2C3245;
  --border:           #2C3245;
  --border-strong:    #3D4565;

  /* Navy palette — keep as accent ink, but lighten so it reads on dark */
  --ls-navy-900:      #B6C2E0;        /* hover/press now lifts toward periwinkle light */
  --ls-navy-700:      #8E9FCF;        /* primary brand ink → now periwinkle 400 */
  --ls-navy-600:      #5B6BAA;
  --ls-navy-500:      #3D4AA0;

  /* Periwinkle palette — used for chips, hover backgrounds, info */
  --ls-peri-100:      rgba(142,159,207,0.12);
  --ls-peri-200:      rgba(142,159,207,0.20);
  --ls-peri-300:      rgba(142,159,207,0.35);

  /* Ink → light text */
  --ls-ink-900:       #ECEEF5;
  --ls-ink-700:       #C0C5D4;
  --ls-ink-500:       #8A91A8;
  --ls-ink-400:       #6B7186;

  /* Semantic refresh */
  --fg-1: var(--ls-ink-900);
  --fg-2: var(--ls-ink-700);
  --fg-3: var(--ls-ink-500);
  --fg-4: var(--ls-ink-400);
  --fg-brand: var(--ls-navy-700);
  --fg-link: var(--ls-navy-700);
  --fg-link-hover: var(--ls-coral-500);

  --bg-page: var(--ls-canvas);
  --bg-surface: var(--ls-surface);
  --bg-surface-hover: var(--ls-surface-hover);

  /* Status colors — slightly desaturated for dark bg */
  --ls-success-bg:  rgba(46,125,91,0.18);
  --ls-warning-bg:  rgba(178,122,0,0.18);
  --ls-danger-bg:   rgba(199,66,59,0.18);

  /* Shadows — softer / blacker on dark */
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.30);
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.40);
  --shadow-md: 0 8px 24px rgba(0,0,0,0.50);
  --shadow-lg: 0 16px 48px rgba(0,0,0,0.60);

  /* Bridge aliases */
  --text:        var(--ls-ink-900);
  --text-light:  var(--ls-ink-500);
}

[data-theme="dark"] body {
  background: var(--ls-canvas);
  color: var(--ls-ink-900);
}

/* Topbar stays white-ish? No — full dark. */
[data-theme="dark"] .sticky-top {
  background: var(--ls-surface);
  border-bottom-color: var(--ls-line-200);
  box-shadow: 0 1px 0 rgba(0,0,0,0.4);
}

[data-theme="dark"] .firm-badge {
  background: var(--ls-peri-100);
  color: var(--ls-navy-700);
  border: none;
}

/* Inputs / selects — sit on darker than surface */
[data-theme="dark"] .picker-search input,
[data-theme="dark"] .picker-matters select,
[data-theme="dark"] .query-bar textarea,
[data-theme="dark"] .followup textarea {
  background: var(--ls-canvas);
  border-color: var(--ls-line-200);
  color: var(--ls-ink-900);
}

[data-theme="dark"] .picker-results {
  background: var(--ls-surface);
  border-color: var(--ls-line-200);
}
[data-theme="dark"] .picker-result { color: var(--ls-ink-900); }
[data-theme="dark"] .picker-result:hover,
[data-theme="dark"] .picker-result.highlighted { background: var(--ls-surface-hover); }

[data-theme="dark"] .picker-chip {
  background: var(--ls-peri-300);
  color: var(--ls-ink-900);
}
[data-theme="dark"] .picker-chip-x { color: var(--ls-ink-900); }

[data-theme="dark"] .preset-btn {
  background: var(--ls-canvas);
  border-color: var(--ls-line-200);
  color: var(--ls-ink-700);
}
[data-theme="dark"] .preset-btn:hover {
  background: var(--ls-surface-hover);
  color: var(--ls-ink-900);
  border-color: var(--ls-peri-300);
}
[data-theme="dark"] .preset-btn.active {
  background: var(--ls-navy-700);
  color: var(--ls-canvas);
  border-color: var(--ls-navy-700);
}

[data-theme="dark"] .query-bar { background: var(--ls-surface); }

/* Model toggle */
[data-theme="dark"] .model-toggle { background: var(--ls-canvas); }
[data-theme="dark"] .model-btn { color: var(--ls-ink-500); }
[data-theme="dark"] .model-btn:hover { color: var(--ls-ink-900); }
[data-theme="dark"] .model-btn.active {
  background: var(--ls-surface-hover);
  color: var(--ls-navy-700);
}

/* Buttons — primary uses periwinkle (the dark-mode "navy") */
[data-theme="dark"] .btn-primary {
  background: var(--ls-navy-700);
  color: var(--ls-canvas);
  border-color: var(--ls-navy-700);
}
[data-theme="dark"] .btn-primary:hover {
  background: var(--ls-navy-900);
  border-color: var(--ls-navy-900);
  color: var(--ls-canvas);
}
[data-theme="dark"] .btn-secondary {
  background: transparent;
  color: var(--ls-navy-700);
  border: 1.5px solid var(--ls-navy-700);
}
[data-theme="dark"] .btn-secondary:hover {
  background: var(--ls-navy-700);
  color: var(--ls-canvas);
}

[data-theme="dark"] button#clear {
  background: var(--ls-danger-bg);
  color: #F4A09B;
  border: 1px solid transparent;
}
[data-theme="dark"] button#clear:hover {
  background: var(--ls-danger);
  color: white;
}

[data-theme="dark"] .status { color: var(--ls-coral-500); }
[data-theme="dark"] .progress-bar { background: var(--ls-peri-100); }
[data-theme="dark"] .progress-fill { background: var(--ls-coral-500); }

/* Conversation */
[data-theme="dark"] .conv-q {
  background: var(--ls-peri-100);
  border-left-color: var(--ls-navy-700);
  color: var(--ls-ink-700);
}
[data-theme="dark"] .conv-a {
  background: var(--ls-surface);
  border-color: var(--ls-line-200);
  color: var(--ls-ink-700);
  box-shadow: var(--shadow-xs);
}
[data-theme="dark"] .conv-a strong { color: var(--ls-ink-900); }

/* Exec summary */
[data-theme="dark"] .exec-summary {
  background: rgba(242,108,80,0.06);
  border-left-color: var(--ls-coral-500);
}
[data-theme="dark"] .exec-summary-title {
  color: var(--ls-coral-500);
  border-bottom-color: rgba(242,108,80,0.25);
}
[data-theme="dark"] .exec-summary strong { color: var(--ls-coral-400); }

/* Headings */
[data-theme="dark"] .section-heading {
  color: var(--ls-ink-900);
  border-bottom-color: var(--ls-line-200);
}
[data-theme="dark"] .subsection-heading { color: var(--ls-ink-900); }

/* Tables */
[data-theme="dark"] .data-table th {
  background: var(--ls-canvas);
  color: var(--ls-ink-500);
  border-bottom-color: var(--ls-line-200);
}
[data-theme="dark"] .data-table td {
  color: var(--ls-ink-700);
  border-bottom-color: var(--ls-line-200);
}
[data-theme="dark"] .data-table tr:hover td { background: var(--ls-surface-hover); }

/* Mermaid */
[data-theme="dark"] .mermaid-container {
  background: var(--ls-canvas);
  border-color: var(--ls-line-200);
}

/* Followup */
[data-theme="dark"] .followup button {
  background: var(--ls-navy-700);
  color: var(--ls-canvas);
  border-color: var(--ls-navy-700);
}
[data-theme="dark"] .followup button:hover { background: var(--ls-navy-900); border-color: var(--ls-navy-900); }

/* Modal */
[data-theme="dark"] .modal-overlay { background: rgba(0,0,0,0.65); }
[data-theme="dark"] .modal { background: var(--ls-surface); }
[data-theme="dark"] .modal-header { border-bottom-color: var(--ls-line-200); }
[data-theme="dark"] .modal-header h3 { color: var(--ls-navy-700); }
[data-theme="dark"] .modal-footer { border-top-color: var(--ls-line-200); }
[data-theme="dark"] .modal-pro::before { color: #4FAE7E; }
[data-theme="dark"] .modal-con::before { color: #D5A040; }

/* Theme toggle (sliding switch) — dark mode state */
[data-theme="dark"] .theme-toggle-track {
  background: var(--ls-canvas);
  border-color: var(--ls-line-200);
}
[data-theme="dark"] .theme-toggle-sun  {
  opacity: 1;
  color: var(--ls-coral-400);
  filter: drop-shadow(0 0 2px rgba(245,142,120,0.5));
}
[data-theme="dark"] .theme-toggle-moon { opacity: 1; color: var(--ls-ink-900); }
[data-theme="dark"] .theme-toggle-thumb {
  transform: translateX(20px);
  background: var(--ls-navy-700);
  box-shadow: 0 1px 3px rgba(0,0,0,0.5), 0 1px 1px rgba(0,0,0,0.3);
}
[data-theme="dark"] .theme-toggle:hover .theme-toggle-track {
  border-color: var(--border-strong);
}