/*
  theme-espresso-dark.css — the literal reference-image pairing:
  espresso-brown background with cream text, flipped from the native
  cream-bg/espresso-ink arrangement. Caramel accent brightened for
  contrast against the dark brown.

  Scoped under `body[data-theme="espresso"].theme-dark` (compound
  selector, beats theme-espresso.css's single-attribute rules on
  specificity). Toggled at runtime by js/color_scheme.js. Radius/font
  stay the same as the native file.
*/

body[data-theme="espresso"].theme-dark {
  --accent:      #d89355;
  --accent-dark: #8a582f;
  --accent-soft: #efc79c;
  --success:     #4ade80;
  --danger:      #f4415f;
  --warning:     #fbbf24;

  --gradient-brand: linear-gradient(135deg, #8a582f 0%, #d89355 100%);

  --bg:        #382a21;
  --bg-alt:    #2f231b;
  --bg-card:   #43332a;
  --bg-card2:  #4d3b30;
  --surface:   rgba(240,229,211,.05);
  --surface-hover: rgba(240,229,211,.08);
  --border:    rgba(240,229,211,.1);
  --border-strong: rgba(240,229,211,.2);

  --text:      #f0e5d3;
  --text-muted: rgba(240,229,211,.62);
  --text-dim:  rgba(240,229,211,.42);

  --shadow: 0 10px 30px rgba(0,0,0,.4), 0 0 20px rgba(216,147,85,.14);
}

/* ---- Header / hero-stats glass — dark, not light ---- */
body[data-theme="espresso"].theme-dark header {
  background: rgba(56,42,33,.82);
}
body[data-theme="espresso"].theme-dark .hero-stats-panel {
  background: rgba(56,42,33,.55);
}

/* ---- Primary button — dark ink text on the bright caramel bg ---- */
body[data-theme="espresso"].theme-dark .btn-primary {
  color: #2a1d14;
  box-shadow: 0 0 18px rgba(216,147,85,.4);
}
body[data-theme="espresso"].theme-dark .btn-primary:hover {
  color: #2a1d14;
  box-shadow: 0 0 26px rgba(216,147,85,.55);
}

/* ---- Hero: brighter glow wash, light-tinted grain ---- */
body[data-theme="espresso"].theme-dark .hero-canvas-wrap {
  background:
    radial-gradient(900px 500px at 78% 20%, rgba(216,147,85,.18), transparent 60%),
    radial-gradient(700px 420px at 10% 100%, rgba(216,147,85,.09), transparent 55%),
    var(--bg);
}
body[data-theme="espresso"].theme-dark .hero-grain {
  background-image:
    linear-gradient(rgba(240,229,211,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(240,229,211,.045) 1px, transparent 1px);
}

/* ---- Level-tab indicator — glow, not a flat shadow ---- */
body[data-theme="espresso"].theme-dark .level-tab-indicator {
  box-shadow: 0 0 16px rgba(216,147,85,.4);
}

/* ---- Badges/chips/progress bars/toast — light-tinted, not ink-tinted ---- */
body[data-theme="espresso"].theme-dark .topic-progress-bar,
body[data-theme="espresso"].theme-dark .quiz-progress-bar,
body[data-theme="espresso"].theme-dark .mini-bar-track {
  background: rgba(240,229,211,.09);
}
body[data-theme="espresso"].theme-dark .score-circle-bg {
  stroke: rgba(240,229,211,.09);
}
body[data-theme="espresso"].theme-dark .topic-progress-table th {
  background: rgba(240,229,211,.035);
}
body[data-theme="espresso"].theme-dark .topic-progress-table tr:hover td {
  background: rgba(240,229,211,.04);
}
body[data-theme="espresso"].theme-dark .answer-chip {
  background: rgba(240,229,211,.07);
}
body[data-theme="espresso"].theme-dark .answer-chip-remove {
  background: rgba(240,229,211,.12);
}
body[data-theme="espresso"].theme-dark .format-help-panel code {
  background: rgba(240,229,211,.08);
}
body[data-theme="espresso"].theme-dark .topic-chip {
  background: rgba(240,229,211,.07);
}
body[data-theme="espresso"].theme-dark .ai-points {
  border-top-color: rgba(240,229,211,.12);
}
body[data-theme="espresso"].theme-dark .toast {
  background: rgba(56,42,33,.92);
  color: var(--text);
  border-color: var(--border-strong);
}

/* ---- Accent-tinted glows/focus-rings ---- */
body[data-theme="espresso"].theme-dark .marks-badge,
body[data-theme="espresso"].theme-dark .option-btn:hover:not(:disabled),
body[data-theme="espresso"].theme-dark .setup-option:hover,
body[data-theme="espresso"].theme-dark .setup-option.selected,
body[data-theme="espresso"].theme-dark .symbol-btn:hover,
body[data-theme="espresso"].theme-dark .explanation-box.feedback-reveal {
  background: rgba(216,147,85,.14);
}
body[data-theme="espresso"].theme-dark .quiz-timer {
  border-color: rgba(216,147,85,.35);
}
body[data-theme="espresso"].theme-dark .explanation-box {
  background: rgba(216,147,85,.08);
  border-color: rgba(216,147,85,.32);
}
body[data-theme="espresso"].theme-dark .explanation-box.feedback-reveal {
  border-color: rgba(216,147,85,.42);
}
body[data-theme="espresso"].theme-dark .answer-input:focus {
  box-shadow: 0 0 0 3px rgba(216,147,85,.2);
}
body[data-theme="espresso"].theme-dark .quiz-progress-fill {
  box-shadow: 0 4px 16px rgba(216,147,85,.4);
}

/* ---- Difficulty badges — generic dark-tuned triple, reused verbatim ---- */
body[data-theme="espresso"].theme-dark .diff-easy   { background: rgba(34,197,94,.18);  color: #4ade80; }
body[data-theme="espresso"].theme-dark .diff-medium { background: rgba(242,194,24,.18); color: #fadb5f; }
body[data-theme="espresso"].theme-dark .diff-hard   { background: rgba(244,65,95,.18);  color: #fb7185; }