/* Theme switcher and dark-mode palette. Light mode remains the default. */
.theme-toggle { display: inline-flex; align-items: center; gap: .42rem; min-height: 40px; padding: .45rem .7rem; border: 1px solid var(--border); border-radius: 10px; color: var(--text-2); background: var(--bg-card); font-size: .8rem; font-weight: 600; transition: color var(--ease-fast), background var(--ease-fast), border-color var(--ease-fast); }
.theme-toggle:hover { color: var(--text-1); border-color: var(--border-hover); background: var(--bg-tertiary); }
.theme-toggle-icon { font-size: 1rem; line-height: 1; }

/* Give the flex row a real full-height parent so nav items sit in the middle. */
.nav > .container { height: 100%; }
.nav-inner { min-height: 100%; }


html[data-theme="dark"] { color-scheme: dark; --bg-primary: #0b1020; --bg-secondary: #121a2d; --bg-tertiary: #182238; --bg-card: #141e33; --bg-card-hover: #1b2943; --border: #283854; --border-hover: #425a80; --border-accent: #60a5fa; --purple: #818cf8; --purple-light: #a5b4fc; --purple-glow: rgba(129,140,248,.25); --cyan: #22d3ee; --cyan-light: #67e8f9; --gold: #fbbf24; --gold-light: #fcd34d; --text-1: #f1f5f9; --text-2: #b7c4d7; --text-3: #8090aa; --grad-brand: linear-gradient(135deg,#818cf8,#38bdf8); --grad-hero: linear-gradient(135deg,#172554 0%,#312e81 52%,#0f3b57 100%); --shadow-sm: 0 1px 3px rgba(0,0,0,.28); --shadow-md: 0 8px 24px rgba(0,0,0,.32); }
html[data-theme="dark"] body { background: var(--bg-primary); }
html[data-theme="dark"] .nav { background: rgba(11,16,32,.94); border-color: var(--border); box-shadow: 0 1px 3px rgba(0,0,0,.25); }
html[data-theme="dark"] .nav-links a { color: var(--text-2); }
html[data-theme="dark"] .nav-links a:hover, html[data-theme="dark"] .nav-links a.active { color: #93c5fd; }
html[data-theme="dark"] .nav-logo-icon, html[data-theme="dark"] .btn-primary, html[data-theme="dark"] .hero-search-btn { background: #4f46e5; }
html[data-theme="dark"] .btn-ghost { color: #a5b4fc; background: #1e293b; border-color: #334155; }
html[data-theme="dark"] .footer, html[data-theme="dark"] .section-alt, html[data-theme="dark"] .dir-body, html[data-theme="dark"] .detail-body { background: var(--bg-secondary); }
html[data-theme="dark"] .tool-card, html[data-theme="dark"] .cat-card, html[data-theme="dark"] .dir-controls, html[data-theme="dark"] .detail-hero, html[data-theme="dark"] .content-section, html[data-theme="dark"] .sidebar-box, html[data-theme="dark"] .detail-breadcrumb { background: var(--bg-card); border-color: var(--border); }
html[data-theme="dark"] .tool-card:hover, html[data-theme="dark"] .cat-card:hover { background: var(--bg-card-hover); border-color: var(--border-hover); }
html[data-theme="dark"] .tool-logo, html[data-theme="dark"] .detail-logo, html[data-theme="dark"] .tag-chip { background: #1e2d4a; color: #a5b4fc; }
html[data-theme="dark"] .search-input, html[data-theme="dark"] .chip, html[data-theme="dark"] .styled-select { background: var(--bg-card); border-color: var(--border); color: var(--text-1); box-shadow: none; }
html[data-theme="dark"] .chip:hover, html[data-theme="dark"] .chip.active { color: #c7d2fe; background: #222b51; border-color: #6366f1; }
html[data-theme="dark"] .pricing-box, html[data-theme="dark"] .ad-slot { background: var(--bg-tertiary); border-color: var(--border); }
html[data-theme="dark"] .card-category, html[data-theme="dark"] .section-link { color: #a5b4fc; }
html[data-theme="dark"] .badge-freemium, html[data-theme="dark"] .badge-verified { color: #c7d2fe; background: #222b51; }
html[data-theme="dark"] .cat-icon { background: #1e2d4a; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #3a4b69; }
@media (max-width: 640px) { .theme-toggle-text { display: none; } .theme-toggle { min-width: 40px; justify-content: center; padding: .45rem; } }