/* ==========================================================================
   Nexo · modo oscuro
   Se activa con [data-theme="oscuro"] en <html>. Redefine los tokens y cubre
   los fondos claros que están escritos a mano en styles.css y components.css.
   ========================================================================== */

[data-theme="oscuro"] {
  --bg: #15141f;
  --surface: #1e1c2b;
  --surface-soft: #242233;
  --surface-2: #282538;
  --ink: #eceaf5;
  --muted: #a19eb4;
  --line: #322f45;
  --purple: #8a76ec;
  --purple-dark: #a08ff2;
  --purple-soft: #2c2745;
  --mint: #6cc39d;
  --mint-soft: #1f3730;
  --peach: #eba875;
  --peach-soft: #3a2c22;
  --rose: #e08fa5;
  --sky: #74b0dc;
  --shadow: 0 14px 40px rgba(0, 0, 0, .38);
  --shadow-soft: 0 4px 18px rgba(0, 0, 0, .26);
  color-scheme: dark;
}

/* ------------------------------- Superficies ------------------------------- */
[data-theme="oscuro"] .icon-button,
[data-theme="oscuro"] .round-add,
[data-theme="oscuro"] .subject-list,
[data-theme="oscuro"] .subject-row,
[data-theme="oscuro"] .provider-badge,
[data-theme="oscuro"] .chat-panel,
[data-theme="oscuro"] .prompt-chips button,
[data-theme="oscuro"] .quiz-card,
[data-theme="oscuro"] .answer-option,
[data-theme="oscuro"] .search-box,
[data-theme="oscuro"] .filter-row button,
[data-theme="oscuro"] .library-card,
[data-theme="oscuro"] .period-select,
[data-theme="oscuro"] .progress-summary article,
[data-theme="oscuro"] .copy-button,
[data-theme="oscuro"] .goal-pill,
[data-theme="oscuro"] .logout-button,
[data-theme="oscuro"] .theme-toggle,
[data-theme="oscuro"] .level-badge,
[data-theme="oscuro"] .admin-tabs button,
[data-theme="oscuro"] .admin-search,
[data-theme="oscuro"] .table-wrap,
[data-theme="oscuro"] .mini-button,
[data-theme="oscuro"] .editor-card,
[data-theme="oscuro"] .question-prompt,
[data-theme="oscuro"] .option-input,
[data-theme="oscuro"] .question-extra input,
[data-theme="oscuro"] .question-extra select,
[data-theme="oscuro"] .message-action,
[data-theme="oscuro"] .composer-icon,
[data-theme="oscuro"] .auth-tabs button.active,
[data-theme="oscuro"] .exam-tabs button,
[data-theme="oscuro"] .judge-button,
[data-theme="oscuro"] .deck-card,
[data-theme="oscuro"] .note-card,
[data-theme="oscuro"] .exam-card,
[data-theme="oscuro"] .exam-report,
[data-theme="oscuro"] .exam-setup,
[data-theme="oscuro"] .review-card,
[data-theme="oscuro"] .exam-chip,
[data-theme="oscuro"] .modal-card {
  background: var(--surface);
  color: var(--ink);
}

/* ---------------------------- Superficies suaves ---------------------------- */
[data-theme="oscuro"] .sidebar,
[data-theme="oscuro"] .day,
[data-theme="oscuro"] .clear-chat,
[data-theme="oscuro"] .message-bubble,
[data-theme="oscuro"] .learning-path li > span,
[data-theme="oscuro"] .answer-option span,
[data-theme="oscuro"] .topic-selector button,
[data-theme="oscuro"] .achievement-list > div,
[data-theme="oscuro"] .settings-card input,
[data-theme="oscuro"] .settings-card select,
[data-theme="oscuro"] .auth-tabs,
[data-theme="oscuro"] .auth-form input,
[data-theme="oscuro"] .auth-form select,
[data-theme="oscuro"] .demo-block,
[data-theme="oscuro"] .chat-item,
[data-theme="oscuro"] .result-metrics > div,
[data-theme="oscuro"] .library-topics li,
[data-theme="oscuro"] .feed-item,
[data-theme="oscuro"] .question-row,
[data-theme="oscuro"] .editor-field input,
[data-theme="oscuro"] .editor-field select,
[data-theme="oscuro"] .editor-field textarea,
[data-theme="oscuro"] .chat-search,
[data-theme="oscuro"] .exam-history-item,
[data-theme="oscuro"] .exam-review-item {
  background: var(--surface-soft);
  color: var(--ink);
}

[data-theme="oscuro"] .nav-item:hover,
[data-theme="oscuro"] .subject-row:hover,
[data-theme="oscuro"] .answer-option:hover,
[data-theme="oscuro"] .admin-table tr:hover td,
[data-theme="oscuro"] .prompt-chips button:hover,
[data-theme="oscuro"] .message-action:hover,
[data-theme="oscuro"] .light-button:hover {
  background: var(--surface-2);
}

[data-theme="oscuro"] .nav-item.active,
[data-theme="oscuro"] .chat-item.active,
[data-theme="oscuro"] .topic-selector button.active,
[data-theme="oscuro"] .exam-chip.active,
[data-theme="oscuro"] .exam-dot.contestada,
[data-theme="oscuro"] .secondary-button {
  background: var(--purple-soft);
  color: var(--purple-dark);
}

/* Las pestañas y botones activos conservan el morado sólido de la marca. */
[data-theme="oscuro"] .exam-tabs button.active,
[data-theme="oscuro"] .admin-tabs button.active,
[data-theme="oscuro"] .filter-row button.active {
  background: var(--purple);
  border-color: var(--purple);
  color: #fff;
}

/* ------------------------------- Indicadores ------------------------------- */
[data-theme="oscuro"] .subject-progress > span,
[data-theme="oscuro"] .progress-track,
[data-theme="oscuro"] .skill-row > span,
[data-theme="oscuro"] .chart-bar.empty,
[data-theme="oscuro"] .chart-bar,
[data-theme="oscuro"] .box-bar {
  background: var(--surface-2);
}

[data-theme="oscuro"] .trend.positive { background: var(--mint-soft); color: #7fd1aa; }
[data-theme="oscuro"] .trend.neutral { background: var(--surface-2); color: var(--muted); }
[data-theme="oscuro"] .sky { background: #1e3040; color: var(--sky); }
[data-theme="oscuro"] .bar-chart { background: none; }
[data-theme="oscuro"] .composer-bottom,
[data-theme="oscuro"] .admin-table td { border-color: var(--line); }

/* --------------------------------- Estados --------------------------------- */
[data-theme="oscuro"] .answer-option.correct { background: #1c3229; border-color: #3f7a5f; }
[data-theme="oscuro"] .answer-option.incorrect { background: #3a2222; border-color: #8a4b48; }
[data-theme="oscuro"] .answer-feedback.correct { background: #1c3229; color: #8ed4b0; }
[data-theme="oscuro"] .answer-feedback.incorrect { background: #3a2222; color: #e5a09b; }
[data-theme="oscuro"] .hint-box,
[data-theme="oscuro"] .server-note,
[data-theme="oscuro"] .message-notice { background: #3a3020; border-color: #6a5836; color: #e0c68f; }
[data-theme="oscuro"] .auth-error { background: #3a2222; border-color: #7d4744; color: #eba8a3; }
[data-theme="oscuro"] .pill.danger { background: #3a2222; color: #e5a09b; }
[data-theme="oscuro"] .pill.ok { background: var(--mint-soft); color: #7fd1aa; }
[data-theme="oscuro"] .pill.warn { background: var(--peach-soft); color: #edb87f; }
[data-theme="oscuro"] .logout-button:hover,
[data-theme="oscuro"] .mini-button.danger:hover { background: #3a2222; border-color: #7d4744; color: #eba8a3; }
[data-theme="oscuro"] .composer-icon.grabando { background: #3a2222; border-color: #8a4b48; color: #eba8a3; }
[data-theme="oscuro"] .judge-button.acierto { background: var(--mint-soft); color: #8ed4b0; border-color: #3f7a5f; }
[data-theme="oscuro"] .judge-button.fallo { background: #3a2222; color: #e5a09b; border-color: #8a4b48; }

/* ------------------------------ Portadas y logros ------------------------------ */
[data-theme="oscuro"] .purple-visual { background: #2a2444; color: #a897f0; }
[data-theme="oscuro"] .green-visual { background: #1d332c; color: #79c9a5; }
[data-theme="oscuro"] .orange-visual { background: #382a20; color: #e2a978; }
[data-theme="oscuro"] .blue-visual { background: #1e2f3d; color: #79b2d8; }
[data-theme="oscuro"] .rose-visual { background: #37232c; color: #dd93a9; }
[data-theme="oscuro"] .cyan-visual { background: #1d3234; color: #6fb6bd; }
[data-theme="oscuro"] .subject-blue { background: #1e2f3d; color: #79b2d8; }
[data-theme="oscuro"] .subject-cyan { background: #1d3234; color: #6fb6bd; }
[data-theme="oscuro"] .subject-rose { background: #37232c; color: #dd93a9; }
[data-theme="oscuro"] .avatar { background: linear-gradient(145deg, #3a3157, #2a2440); color: #b9a9f5; }

/* ------------------------------- Acceso y fondos ------------------------------- */
[data-theme="oscuro"] body.auth-mode { background: linear-gradient(160deg, #1a1826 0%, #15141f 45%, #171a26 100%); }
[data-theme="oscuro"] .boot-screen { background: var(--bg); }
[data-theme="oscuro"] .modal-overlay { background: rgba(0, 0, 0, .6); }
[data-theme="oscuro"] .light-button { background: var(--surface); color: var(--purple-dark); }
[data-theme="oscuro"] .mentor-card .secondary-button { background: var(--surface); color: var(--purple-dark); }
[data-theme="oscuro"] .day.current { background: var(--surface); }

/* --------------------------------- Textos --------------------------------- */
/* Grises pensados para fondo blanco que sobre oscuro quedarían ilegibles. */
[data-theme="oscuro"] .card-answer,
[data-theme="oscuro"] .modal-body,
[data-theme="oscuro"] .note-body,
[data-theme="oscuro"] .admin-table td,
[data-theme="oscuro"] .deck-front,
[data-theme="oscuro"] .review-prompt { color: #cfccdd; }

[data-theme="oscuro"] .nav-item,
[data-theme="oscuro"] .exam-chip,
[data-theme="oscuro"] .prompt-chips button { color: #b3b0c4; }

[data-theme="oscuro"] .auth-form label,
[data-theme="oscuro"] .settings-card > label,
[data-theme="oscuro"] .editor-field,
[data-theme="oscuro"] .editor-check,
[data-theme="oscuro"] .question-extra label,
[data-theme="oscuro"] .exam-label { color: #a9a6bb; }

[data-theme="oscuro"] .tip-card p,
[data-theme="oscuro"] .skills-note { color: #b9b4d0; }
[data-theme="oscuro"] .tip-card strong { color: #d8d3ee; }
[data-theme="oscuro"] .tip-card { border-color: #3a3358; }
[data-theme="oscuro"] .progress-summary em { color: #6fbd97; }
[data-theme="oscuro"] .review-line.right,
[data-theme="oscuro"] .report-perfect { color: #7fd1aa; }
[data-theme="oscuro"] .review-line.wrong { color: #e5a09b; }
[data-theme="oscuro"] .result-badge.great { color: #7fd1aa; }
[data-theme="oscuro"] .box-pill.box-5 { color: #7fd1aa; }

[data-theme="oscuro"] .review-insight-card,
[data-theme="oscuro"] .deck-toolbar select,
[data-theme="oscuro"] .deck-search { background:var(--surface);color:var(--ink); }
[data-theme="oscuro"] .history-row,
[data-theme="oscuro"] .deck-answer { background:var(--surface-soft);color:var(--ink); }
[data-theme="oscuro"] .tag-list span { background:var(--surface-2);color:#bbb6cc; }
[data-theme="oscuro"] .state-pill.muted { background:var(--surface-2);color:#aaa5b8; }
[data-theme="oscuro"] .review-progress-bar { background:var(--surface-2); }
[data-theme="oscuro"] .judge-button.again { background:#3a2222;color:#e5a09b;border-color:#8a4b48; }
[data-theme="oscuro"] .judge-button.hard { background:#3b3020;color:#e0bd78;border-color:#7c6333; }
[data-theme="oscuro"] .judge-button.good { background:var(--mint-soft);color:#8ed4b0;border-color:#3f7a5f; }
[data-theme="oscuro"] .judge-button.easy { background:#203341;color:#86c1e5;border-color:#3c6d89; }

/* Los gráficos SVG heredan el color del texto salvo estas líneas de rejilla. */
[data-theme="oscuro"] .chart-ring circle:first-child { stroke: var(--surface-2); }
[data-theme="oscuro"] .chart-donut circle { stroke-opacity: .92; }
[data-theme="oscuro"] .chart-bars { border-color: var(--line); }

/* Interruptor de tema */
.sidebar-tools { display: grid; gap: 7px; }
.theme-toggle { display: flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px solid var(--line); background: white; color: var(--muted);
  border-radius: 10px; padding: 9px; font-size: 9px; font-weight: 700; }
.theme-toggle:hover { border-color: #cfc8f1; color: var(--purple); }
.theme-icon { font-size: 12px; }

[data-theme="oscuro"] .demo-tag.teacher { background:#1e2f3d;color:#8cc0e2; }
[data-theme="oscuro"] .demo-tag.guardian { background:#37232c;color:#e3a1b4; }
