/* =========================================================
   SHOOLIFYAI — Dark Mode
   Properly designed dark theme (not a simple inversion)
   Activated via [data-theme="dark"] on <html>
   ========================================================= */

html[data-theme="dark"] {
  --bg: #0b1220;
  --bg-soft: #121b2e;
  --bg-elevated: #16213a;
  --text-primary: #eef1fb;
  --text-secondary: #a9b3cc;
  --text-muted: #74809e;
  --border-color: #253150;
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.35);
  --shadow-md: 0 10px 28px rgba(0,0,0,0.4);
  --shadow-lg: 0 22px 50px rgba(0,0,0,0.5);
  --gradient-soft: linear-gradient(135deg, rgba(79,107,255,.16) 0%, rgba(139,92,246,.16) 100%);
  --gradient-hero: radial-gradient(circle at 15% 20%, rgba(79,107,255,.22), transparent 45%),
                    radial-gradient(circle at 85% 10%, rgba(139,92,246,.2), transparent 45%),
                    radial-gradient(circle at 50% 100%, rgba(34,197,94,.14), transparent 45%);
  --color-navy: #060a14;
}

html[data-theme="dark"] body { background: var(--bg); color: var(--text-primary); }

html[data-theme="dark"] .site-header {
  background: rgba(11, 18, 32, 0.82);
  border-bottom-color: var(--border-color);
}

html[data-theme="dark"] .btn-secondary { background: var(--bg-elevated); border-color: var(--border-color); color: var(--text-primary); }
html[data-theme="dark"] .icon-btn, html[data-theme="dark"] .hamburger { background: var(--bg-soft); border-color: var(--border-color); color: var(--text-secondary); }
html[data-theme="dark"] .lang-select { background: var(--bg-soft); border-color: var(--border-color); color: var(--text-primary); }

html[data-theme="dark"] .hero-badge,
html[data-theme="dark"] .float-card,
html[data-theme="dark"] .subject-badge { background: var(--bg-elevated); border-color: var(--border-color); }

html[data-theme="dark"] .assistant-panel { background: var(--bg-elevated); }
html[data-theme="dark"] .chat-input-bar textarea,
html[data-theme="dark"] .chat-mic-btn,
html[data-theme="dark"] .msg-ai .msg-bubble,
html[data-theme="dark"] .typing-dots,
html[data-theme="dark"] .voice-transcript,
html[data-theme="dark"] .starter-chip { background: var(--bg-soft); border-color: var(--border-color); color: var(--text-primary); }

html[data-theme="dark"] .subject-card,
html[data-theme="dark"] .feature-card,
html[data-theme="dark"] .dash-card,
html[data-theme="dark"] .dash-panel,
html[data-theme="dark"] .dash-sidebar,
html[data-theme="dark"] .preview-card,
html[data-theme="dark"] .about-card,
html[data-theme="dark"] .form-card,
html[data-theme="dark"] .tool-card,
html[data-theme="dark"] .plan-day-card,
html[data-theme="dark"] .quiz-option,
html[data-theme="dark"] .review-item,
html[data-theme="dark"] .modal-box,
html[data-theme="dark"] .dropdown-panel,
html[data-theme="dark"] .toast { background: var(--bg-elevated); border-color: var(--border-color); }

html[data-theme="dark"] .schools-section { background: var(--bg-soft); }

html[data-theme="dark"] .quiz-option.correct { background: rgba(34,197,94,.14); border-color: var(--color-green); }
html[data-theme="dark"] .quiz-option.incorrect { background: rgba(220,38,38,.14); border-color: #ef4444; }
html[data-theme="dark"] .review-item.wrong { background: rgba(220,38,38,.1); border-color: #7c3030; }
html[data-theme="dark"] .review-item.right { background: rgba(34,197,94,.1); border-color: #2f6b46; }

html[data-theme="dark"] .form-group input,
html[data-theme="dark"] .form-group select,
html[data-theme="dark"] .form-group textarea,
html[data-theme="dark"] .search-panel input { background: var(--bg-soft); border-color: var(--border-color); color: var(--text-primary); }

html[data-theme="dark"] .voice-unsupported { background: rgba(220,38,38,.12); border-color: #7c3030; color: #ff9b91; }

html[data-theme="dark"] .site-footer { background: #05070d; }

html[data-theme="dark"] .theme-icon-sun { display: inline-flex; }
html[data-theme="dark"] .theme-icon-moon { display: none; }
html:not([data-theme="dark"]) .theme-icon-sun { display: none; }
html:not([data-theme="dark"]) .theme-icon-moon { display: inline-flex; }

/* Smooth theme transition for key surfaces */
body, .site-header, .btn, .subject-card, .feature-card, .dash-card, .dash-panel,
.form-card, .assistant-panel, .msg-bubble, .toast, .modal-box {
  transition: background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition);
}