/*
  theme-teal-light.css — pale mint-cream paper with deep teal ink,
  flipped from the dark native's teal-bg/hot-pink-accent arrangement.
  Pink deepened for contrast against the light paper.

  Scoped under `body[data-theme="teal"].theme-light` (compound
  selector, beats theme-teal.css's single-attribute rules on
  specificity). Toggled at runtime by js/color_scheme.js.
*/

body[data-theme="teal"].theme-light {
  --accent:      #c22876;
  --accent-dark: #9e1f60;
  --accent-soft: #ff8ac2;
  --success:     #15803d;
  --danger:      #b91c1c;
  --warning:     #92400e;

  --gradient-brand: linear-gradient(135deg, #c22876 0%, #9e1f60 100%);

  --bg:        #e7f5f2;
  --bg-alt:    #dceeea;
  --bg-card:   #f3faf8;
  --bg-card2:  #ebf6f3;
  --surface:   rgba(0,77,77,.045);
  --surface-hover: rgba(0,77,77,.08);
  --border:    rgba(0,77,77,.14);
  --border-strong: rgba(0,77,77,.28);

  --text:      #004d4d;
  --text-muted: rgba(0,77,77,.62);
  --text-dim:  rgba(0,77,77,.42);

  --shadow: 0 10px 30px rgba(0,77,77,.1), 0 2px 10px rgba(0,77,77,.05);
}

/* ---- Header / hero-stats glass — light, not dark ---- */
body[data-theme="teal"].theme-light header {
  background: rgba(231,245,242,.85);
}
body[data-theme="teal"].theme-light .hero-stats-panel {
  background: rgba(243,250,248,.7);
}

/* ---- Primary button ---- */
body[data-theme="teal"].theme-light .btn-primary {
  background: var(--accent);
  color: #fff;
  box-shadow: 0 4px 14px rgba(194,40,118,.32);
}
body[data-theme="teal"].theme-light .btn-primary:hover {
  background: var(--accent-dark);
  color: #fff;
  box-shadow: 0 6px 20px rgba(194,40,118,.42);
}
body[data-theme="teal"].theme-light .option-btn:hover:not(:disabled) .option-letter,
body[data-theme="teal"].theme-light .subtab.active,
body[data-theme="teal"].theme-light .level-tab.active {
  color: #fff;
}

/* ---- Hero: light wash, ink-tinted grain, no glow on the word ---- */
body[data-theme="teal"].theme-light .hero-canvas-wrap {
  background:
    radial-gradient(900px 500px at 78% 20%, rgba(194,40,118,.12), transparent 60%),
    radial-gradient(700px 420px at 10% 100%, rgba(194,40,118,.07), transparent 55%),
    var(--bg);
}
body[data-theme="teal"].theme-light .hero-grain {
  background-image:
    linear-gradient(rgba(0,77,77,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,77,77,.045) 1px, transparent 1px);
}
body[data-theme="teal"].theme-light .hero-heading em {
  text-shadow: none;
}

/* ---- Badges/chips/progress bars/toast — ink-tinted ---- */
body[data-theme="teal"].theme-light .topic-progress-bar,
body[data-theme="teal"].theme-light .quiz-progress-bar,
body[data-theme="teal"].theme-light .mini-bar-track {
  background: rgba(0,77,77,.09);
}
body[data-theme="teal"].theme-light .score-circle-bg {
  stroke: rgba(0,77,77,.1);
}
body[data-theme="teal"].theme-light .topic-progress-table th {
  background: rgba(0,77,77,.035);
}
body[data-theme="teal"].theme-light .topic-progress-table tr:hover td {
  background: rgba(0,77,77,.04);
}
body[data-theme="teal"].theme-light .answer-chip {
  background: rgba(0,77,77,.06);
}
body[data-theme="teal"].theme-light .answer-chip-remove {
  background: rgba(0,77,77,.12);
}
body[data-theme="teal"].theme-light .format-help-panel code {
  background: rgba(0,77,77,.08);
}
body[data-theme="teal"].theme-light .topic-chip {
  background: rgba(0,77,77,.07);
}
body[data-theme="teal"].theme-light .ai-points {
  border-top-color: rgba(0,77,77,.12);
}
body[data-theme="teal"].theme-light .toast {
  background: rgba(255,255,255,.95);
  color: var(--text);
  border-color: rgba(0,77,77,.12);
}

/* ---- Accent-tinted glows/focus-rings ---- */
body[data-theme="teal"].theme-light .marks-badge,
body[data-theme="teal"].theme-light .option-btn:hover:not(:disabled),
body[data-theme="teal"].theme-light .setup-option:hover,
body[data-theme="teal"].theme-light .setup-option.selected,
body[data-theme="teal"].theme-light .symbol-btn:hover,
body[data-theme="teal"].theme-light .explanation-box.feedback-reveal {
  background: rgba(194,40,118,.1);
}
body[data-theme="teal"].theme-light .quiz-timer {
  border-color: rgba(194,40,118,.28);
}
body[data-theme="teal"].theme-light .explanation-box {
  background: rgba(194,40,118,.06);
  border-color: rgba(194,40,118,.28);
}
body[data-theme="teal"].theme-light .explanation-box.feedback-reveal {
  border-color: rgba(194,40,118,.38);
}
body[data-theme="teal"].theme-light .answer-input:focus {
  box-shadow: 0 0 0 3px rgba(194,40,118,.16);
}
body[data-theme="teal"].theme-light .quiz-progress-fill {
  box-shadow: none;
}

/* ---- Difficulty badges — light-appropriate generic pair ---- */
body[data-theme="teal"].theme-light .diff-easy   { background: rgba(22,163,74,.12); color: #15803d; }
body[data-theme="teal"].theme-light .diff-medium { background: rgba(180,83,9,.14); color: #92400e; }
body[data-theme="teal"].theme-light .diff-hard   { background: rgba(220,38,38,.12); color: #b91c1c; }