/* ═══════════════════════════════════════════════════════
   TutorDA — Warm Educational Theme
   Palette: warm parchment + deep ink + royal teal
   ═══════════════════════════════════════════════════════ */

:root {
  --dark: #f4f0e8 !important;
  --card: #fffdf7 !important;
  --card2: #f9f5ed !important;
  --border: #d5cebe !important;
  --text: #1a1a2e !important;
  --muted: #52526e !important;

  --orange: #c96e14 !important;
  --orange2: #b05c08 !important;
  --gold: #b08620 !important;
  --cyan: #167080 !important;
  --purple: #5a38b0 !important;
  --pink: #b03068 !important;
  --green: #14785e !important;
  --red: #b83030 !important;
  --blue: #3050b0 !important;
  --mono: 'JetBrains Mono', monospace !important;

  --h-dark: #1a1a2e !important;
  --h-text: #f0eee6 !important;
  --h-muted: #b0aec0 !important;
  --h-orange: #e8922e !important;
  --h-orange2: #d07a18 !important;
  --h-gold: #daa830 !important;
  --h-border: rgba(200,150,60,.2) !important;
  --card-bg: #fffdf7 !important;
  --glow: 0 2px 12px rgba(26,26,46,.06) !important;
  --radius: 14px !important;
  --r: 14px !important;
}

/* ── Body ── */
body {
  background: #f4f0e8 !important;
  color: #1a1a2e !important;
}

/* ── Remove starfield ── */
.stars, .stars::before { display: none !important; }

/* ════════════════════════════════════════════
   GLOBAL TEXT COLOR OVERRIDES
   Make ALL text darker and more readable
   ════════════════════════════════════════════ */

/* Force dark text everywhere */
p, span, div, li, td, th, label, small, strong, em, b, i,
dt, dd, figcaption, blockquote, cite, address {
  color: inherit;
}

h1, h2, h3, h4, h5, h6, .section-title {
  color: #1a1a2e !important;
}

/* Muted text — darker than before */
.muted, [style*="color:var(--muted)"],
[style*="color:#94a3b8"], [style*="color:#7878a0"],
[style*="color:#7777aa"], [style*="color:#8888aa"],
[style*="color: #94a3b8"], [style*="color: #7878a0"] {
  color: #52526e !important;
}

/* Light text that becomes invisible */
[style*="color:#e8e8ff"], [style*="color: #e8e8ff"] {
  color: #1a1a2e !important;
}

/* ── Hero ── */
.hero h1, .page-hero h1 {
  background: linear-gradient(135deg, #1a1a2e 0%, #167080 50%, #5a38b0 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.hero p, .page-hero p { color: #52526e !important; }
.hero .eyebrow { color: #167080 !important; }

/* ════════════════════════════════════════════
   BACKGROUNDS — Override all dark surfaces
   ════════════════════════════════════════════ */

/* Cards, panels, toolbars */
.card, .panel, .tool-card, .game-card,
.wb-toolbar, .math-palette, .shortcuts-bar {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  box-shadow: 0 1px 4px rgba(26,26,46,.04) !important;
}
.card:hover, .panel:hover, .tool-card:hover, .game-card:hover {
  box-shadow: 0 3px 14px rgba(26,26,46,.07) !important;
  border-color: #c4baaa !important;
}

/* ── Tabs ── */
.nav-tab, .tab {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #52526e !important;
}
.nav-tab:hover, .tab:hover {
  border-color: #167080 !important;
  color: #1a1a2e !important;
  background: #eaf6f4 !important;
}
.nav-tab.active, .tab.active {
  border-color: #167080 !important;
  color: #167080 !important;
  background: #eaf6f4 !important;
  box-shadow: 0 0 0 1px rgba(22,112,128,.1) !important;
}

/* ── Buttons ── */
.btn-primary {
  background: linear-gradient(135deg, #167080, #5a38b0) !important;
  color: #fff !important;
  box-shadow: 0 2px 10px rgba(22,112,128,.2) !important;
}
.btn-primary:hover { box-shadow: 0 4px 18px rgba(22,112,128,.3) !important; }
.btn-secondary {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.btn-secondary:hover {
  border-color: #167080 !important;
  color: #167080 !important;
  background: #eaf6f4 !important;
}

/* ── Stat boxes ── */
.stat-box .val, .stat-number { color: #167080 !important; }
.stat-box .lbl { color: #52526e !important; }
.stat-box, .stat-card {
  background: #f9f5ed !important;
  border: 1px solid #d5cebe !important;
}

/* ── Info / feature cards ── */
.info-strip, .features-grid-item, .adv-card, .value-card,
.audience-card, .step-card, .process-step, .topics-grid .topic-card,
.dmu-card, .module-card, .sem-card, .features-grid .feature-card {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.topic-card:hover, .feature-card:hover {
  border-color: #167080 !important;
  box-shadow: 0 3px 12px rgba(22,112,128,.07) !important;
}

/* ── Pills ── */
.hero-pills .pill, .cta-pill {
  background: rgba(22,112,128,.06) !important;
  border-color: rgba(22,112,128,.16) !important;
  color: #167080 !important;
}

/* ── Links ── */
a { color: #167080; }
a:hover { color: #0e5460; }

/* ── Back nav ── */
.back-nav a {
  background: rgba(255,253,247,.92) !important;
  border-color: #d5cebe !important;
  color: #167080 !important;
  backdrop-filter: blur(6px) !important;
}
.back-nav a:hover {
  border-color: #167080 !important;
  background: #eaf6f4 !important;
}

/* ── Wrapper / sections ── */
.wrapper { background: transparent !important; }
.page-main, .page-section, section, .overview, .approach, .topics {
  background: transparent !important;
}

/* ════════════════════════════════════════════
   FORM CONTROLS — All inputs, selects, textareas
   ════════════════════════════════════════════ */

input[type=text], input[type=number], input[type=email],
input[type=tel], input[type=search], input[type=url],
input[type=password], textarea, select,
.form-input, .input-field, .function-input,
.textarea-input, .input-area,
.player-name-section input,
.form-group input, .form-group textarea, .form-group select {
  background: #fffdf7 !important;
  border: 1px solid #c4baaa !important;
  color: #1a1a2e !important;
}
input:focus, textarea:focus, select:focus {
  border-color: #167080 !important;
  box-shadow: 0 0 0 3px rgba(22,112,128,.08) !important;
}

/* Select dropdowns */
select option,
.settings-select option,
.field-group select option {
  background: #fffdf7 !important;
  color: #1a1a2e !important;
}

/* Range sliders */
input[type=range] { background: #c4baaa !important; }
input[type=range]::-webkit-slider-thumb { background: #167080 !important; }
input[type=range]::-moz-range-thumb { background: #167080 !important; }

/* ════════════════════════════════════════════
   GAMES PAGE — Complete overrides
   ════════════════════════════════════════════ */

.player-bar {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.stat-chip {
  background: #f4f0e8 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.stat-chip .label { color: #52526e !important; }
.stat-chip .value { color: #c96e14 !important; }

#xp-bar-wrap, .progress-track, .pct-bar-wrap { background: #d5cebe !important; }

.games-grid .game-card {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
}

.guess-hint-card, .hint-display-card, .guess-hint {
  background: #f9f5ed !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.current-question {
  background: #f4f0e8 !important;
  color: #1a1a2e !important;
}
.quiz-section {
  background: #f9f5ed !important;
  border: 2px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.fact-card {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.number-grid .cell, .memory-grid .cell, .grid-cell, .game-cell {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}

/* Leaderboard */
.leaderboard-section {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
}
.leaderboard-section th {
  background: #f4f0e8 !important;
  color: #1a1a2e !important;
}
.leaderboard-section td {
  color: #1a1a2e !important;
  border-color: #d5cebe !important;
}

/* ════════════════════════════════════════════
   TIMES TABLE PAGE
   ════════════════════════════════════════════ */

.tt-cell { color: #1a1a2e !important; }
.tt-cell.header {
  background: linear-gradient(135deg, #167080, #5a38b0) !important;
  color: #fff !important;
}
.tt-cell.unattempted {
  background: rgba(82,82,110,.06) !important;
  border-color: #d5cebe !important;
  color: #52526e !important;
}
.tt-cell.mastered {
  background: rgba(20,120,94,.12) !important;
  border-color: rgba(20,120,94,.22) !important;
  color: #14785e !important;
}
.tt-cell.learning {
  background: rgba(176,134,32,.12) !important;
  border-color: rgba(176,134,32,.22) !important;
  color: #8a6a10 !important;
}
.tt-cell.struggling {
  background: rgba(184,48,48,.1) !important;
  border-color: rgba(184,48,48,.18) !important;
  color: #b83030 !important;
}

.numpad-btn {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.numpad-btn:hover {
  border-color: #167080 !important;
  background: #eaf6f4 !important;
}
.numpad-btn.enter {
  background: linear-gradient(135deg, #167080, #5a38b0) !important;
  color: #fff !important;
  border: none !important;
}

.answer-display {
  background: #f4f0e8 !important;
  border: 1px solid #d5cebe !important;
  color: #167080 !important;
}
.game-question { color: #1a1a2e !important; }
.feedback.correct { color: #14785e !important; }
.feedback.wrong { color: #b83030 !important; }

.diff-btn {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #52526e !important;
}
.diff-btn:hover { border-color: #5a38b0 !important; }
.diff-btn.active {
  border-color: #167080 !important;
  color: #167080 !important;
  background: #eaf6f4 !important;
}

.boss-level-btn {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.boss-level-btn .lvl { color: #52526e !important; }
.boss-level-btn.unlocked { border-color: #167080 !important; }
.boss-level-btn.unlocked:hover { background: #eaf6f4 !important; }
.boss-level-btn.beaten { border-color: #14785e !important; background: rgba(20,120,94,.06) !important; }

.boss-name { color: #b03068 !important; }
.hp-bar { background: #d5cebe !important; }
.timer-bar { background: #d5cebe !important; }
.timer-fill { background: linear-gradient(90deg, #167080, #5a38b0) !important; }

.pair-card-front { background: linear-gradient(135deg, #5a38b0, #b03068) !important; }
.pair-card-back {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.pair-card.matched .pair-card-back {
  border-color: #14785e !important;
  background: rgba(20,120,94,.05) !important;
  color: #14785e !important;
}

.acc-bar .bar { background: #ece8de !important; }
.acc-bar .fill { background: linear-gradient(0deg, #167080, #5a38b0) !important; }
.acc-bar .lbl { color: #52526e !important; }
.acc-bar .pct { color: #1a1a2e !important; }

.weak-fact {
  background: rgba(184,48,48,.06) !important;
  border-color: rgba(184,48,48,.16) !important;
  color: #b83030 !important;
}

.chart-box {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
}

.badge-card {
  background: #f4f0e8 !important;
  border: 1px solid #d5cebe !important;
}
.badge-card.unlocked {
  border-color: #b08620 !important;
  background: rgba(176,134,32,.05) !important;
}
.badge-card .badge-name { color: #52526e !important; }
.badge-card.unlocked .badge-name { color: #8a6a10 !important; }

/* Settings */
.setting-row { border-color: #d5cebe !important; color: #1a1a2e !important; }
.setting-label { color: #1a1a2e !important; }
.setting-label small { color: #52526e !important; }
.toggle { background: #c4baaa !important; }
.toggle.on { background: #167080 !important; }
.toggle::after { background: #fff !important; }
select.setting-select {
  background: #fffdf7 !important;
  border: 1px solid #c4baaa !important;
  color: #1a1a2e !important;
}

/* Toast */
.toast { background: #fffdf7 !important; border: 1px solid #d5cebe !important; box-shadow: 0 4px 18px rgba(26,26,46,.08) !important; }
.toast .toast-text { color: #8a6a10 !important; }
.toast { border-color: #b08620 !important; }

/* ════════════════════════════════════════════
   TOOL PAGES — Specific overrides
   ════════════════════════════════════════════ */

/* Graph/calculator tool specific inputs */
.input-section, .param-slider, .compare-option {
  background: #f4f0e8 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}

/* Hint generator */
.hint-output, .formula-box, .hint-box {
  background: #f9f5ed !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}

/* Crossword black cells */
.cw-cell.black { background: #1a1a2e !important; }

/* Timeline dot */
.tl-dot { background: #167080 !important; }

/* Worksheet options */
.ws-option {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}

/* ════════════════════════════════════════════
   WHITEBOARD — Tool buttons & palette
   ════════════════════════════════════════════ */

.wb-btn {
  background: #f4f0e8 !important;
  border-color: #d5cebe !important;
  color: #1a1a2e !important;
}
.wb-btn:hover {
  border-color: #167080 !important;
  background: #eaf6f4 !important;
  color: #1a1a2e !important;
}
.wb-btn.active {
  border-color: #167080 !important;
  color: #167080 !important;
  background: #eaf6f4 !important;
}
.wb-btn svg { fill: currentColor !important; }

.math-sym {
  background: #f4f0e8 !important;
  border-color: #d5cebe !important;
  color: #1a1a2e !important;
}
.math-sym:hover {
  border-color: #5a38b0 !important;
  color: #5a38b0 !important;
  background: #f0ebfa !important;
}

.color-swatch { border-color: #c4baaa !important; }
.color-swatch.active { border-color: #167080 !important; }
.board-color-btn { border-color: #c4baaa !important; }
.board-color-btn.active { border-color: #167080 !important; }

.wb-status { color: #52526e !important; }
.wb-toggle .tog { background: #c4baaa !important; }
.wb-toggle .tog::after { background: #8a8478 !important; }
.wb-toggle input:checked + .tog { background: rgba(22,112,128,.3) !important; }
.wb-toggle input:checked + .tog::after { background: #167080 !important; }

.shortcuts-bar { color: #52526e !important; }
.shortcuts-bar kbd {
  background: #f4f0e8 !important;
  border-color: #d5cebe !important;
  color: #167080 !important;
}

.canvas-wrap { border: 1px solid #d5cebe !important; }

/* Fullscreen */
.wrapper.fs-mode .wb-toolbar,
.wrapper.fs-mode .math-palette {
  background: rgba(255,253,247,.95) !important;
}
.wrapper.fs-mode .wb-status {
  background: rgba(255,253,247,.92) !important;
  color: #52526e !important;
}

/* ════════════════════════════════════════════
   MODALS & OVERLAYS
   ════════════════════════════════════════════ */

.modal-overlay, .results-overlay { background: rgba(26,26,46,.65) !important; }
.modal-box, .results-card {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.results-card h2 { color: #167080 !important; }
.results-card .stat-box .val { color: #167080 !important; }
.results-card .stat-box .lbl { color: #52526e !important; }

/* ════════════════════════════════════════════
   FAQ PAGE
   ════════════════════════════════════════════ */

.faq-q {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.faq-a {
  background: #f9f5ed !important;
  border-left: 3px solid #167080 !important;
  color: #1a1a2e !important;
}

/* ════════════════════════════════════════════
   RGBA DARK BACKGROUNDS — catch inline styles
   ════════════════════════════════════════════ */

[style*="rgba(13,13,26"],
[style*="rgba(17,17,37"],
[style*="rgba(20,20,40"],
[style*="rgba(26,26,74"] {
  background: rgba(244,240,232,.92) !important;
}

/* Hardcoded hex dark backgrounds */
[style*="background:#0d0d1a"],
[style*="background: #0d0d1a"],
[style*="background-color:#0d0d1a"],
[style*="background:#141428"],
[style*="background: #141428"],
[style*="background:#1a1a35"],
[style*="background: #1a1a35"],
[style*="background:#0a0a18"],
[style*="background: #0a0a18"] {
  background: #f4f0e8 !important;
}

/* Hardcoded light text that's now invisible */
[style*="color:#e8e8ff"],
[style*="color: #e8e8ff"] {
  color: #1a1a2e !important;
}

/* Hardcoded dark borders */
[style*="border-color:#2a2a4a"],
[style*="border-color:#1e1e3a"],
[style*="border-color:#3a3a5a"] {
  border-color: #d5cebe !important;
}

/* ════════════════════════════════════════════
   BACK TO TOP
   ════════════════════════════════════════════ */

#backToTop {
  background: #fffdf7 !important;
  color: #167080 !important;
  border: 1px solid #d5cebe !important;
  box-shadow: 0 2px 8px rgba(26,26,46,.06) !important;
}
#backToTop:hover {
  background: #eaf6f4 !important;
  border-color: #167080 !important;
}

/* ════════════════════════════════════════════
   SCROLLBAR
   ════════════════════════════════════════════ */

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #ece8de; }
::-webkit-scrollbar-thumb { background: #c4baaa; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #a09484; }

/* ════════════════════════════════════════════
   CHATBOT WIDGET
   ════════════════════════════════════════════ */

#tda-chat-panel {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  box-shadow: 0 12px 40px rgba(26,26,46,.15), 0 0 0 1px rgba(200,150,60,.08) !important;
}

.tda-chat-header {
  background: linear-gradient(135deg, rgba(201,110,20,.1), rgba(176,134,32,.06)) !important;
  border-bottom: 1px solid #d5cebe !important;
}
.tda-chat-header-name { color: #c96e14 !important; }
.tda-chat-header-status { color: #14785e !important; }
.tda-chat-close {
  background: rgba(26,26,46,.04) !important;
  border: 1px solid #d5cebe !important;
  color: #52526e !important;
}
.tda-chat-close:hover { border-color: #c96e14 !important; color: #c96e14 !important; }

.tda-msg.bot .tda-msg-bubble {
  background: #f4f0e8 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
.tda-msg.user .tda-msg-bubble {
  background: linear-gradient(135deg, rgba(201,110,20,.15), rgba(176,134,32,.1)) !important;
  border: 1px solid rgba(201,110,20,.25) !important;
  color: #1a1a2e !important;
}
.tda-msg-bubble strong { color: #c96e14 !important; }

.tda-qr-btn {
  background: rgba(201,110,20,.06) !important;
  border: 1px solid rgba(201,110,20,.18) !important;
  color: #c96e14 !important;
}
.tda-qr-btn:hover { background: #c96e14 !important; color: #fff !important; }

.tda-chat-input-row {
  border-top: 1px solid #d5cebe !important;
  background: rgba(244,240,232,.5) !important;
}
#tda-chat-input {
  background: #fffdf7 !important;
  border: 1px solid #d5cebe !important;
  color: #1a1a2e !important;
}
#tda-chat-input:focus { border-color: #c96e14 !important; }
#tda-chat-input::placeholder { color: #8a8a9e !important; }

#tda-chat-dot { border-color: #f4f0e8 !important; }

.tda-chat-messages::-webkit-scrollbar-thumb { background: rgba(201,110,20,.2) !important; }

/* ════════════════════════════════════════════
   PRINT
   ════════════════════════════════════════════ */

@media print {
  body { background: #fff !important; }
  .stars, #header-container, #footer-container, #backToTop, .back-nav { display: none !important; }
}