/* theme-dark.css */
/* Dark Mode baseline tokens - preserving exact existing dark aesthetics */
:root,
[data-theme="dark"],
html[data-theme="dark"],
:root[data-theme="dark"] {
    --bg-color: #0b0f19;
    --surface-color: #111827;
    --surface-card: rgba(17, 24, 39, 0.85);
    --surface-light: #1f2937;
    
    --text-primary: #f9fafb;
    --text-secondary: #9ca3af;
    --text-muted: #6b7280;
    
    --accent-color: #38bdf8;
    --accent-purple: #818cf8;
    --accent-emerald: #34d399;
    --accent-amber: #fbbf24;
    --accent-rose: #f43f5e;

    /* Semantic Tokens */
    --success-color: #34d399;
    --warning-color: #fbbf24;
    --danger-color: #f87171;
    --info-color: #38bdf8;
    
    --border-color: rgba(255, 255, 255, 0.1);
    --border-highlight: rgba(56, 189, 248, 0.3);
    --glow: 0 0 25px rgba(56, 189, 248, 0.25);

    /* Navbar Tokens */
    --header-bg: rgba(11, 15, 25, 0.95);
    --nav-btn-color: #cbd5e1;
    --nav-btn-hover: #38bdf8;
    --nav-btn-hover-bg: rgba(255, 255, 255, 0.05);
    --nav-active-color: #38bdf8;
    --nav-active-bg: rgba(56, 189, 248, 0.1);
    --nav-active-border: rgba(56, 189, 248, 0.25);
    --dropdown-bg: rgba(11, 15, 25, 0.98);
    --dropdown-border: rgba(255, 255, 255, 0.12);
    --dropdown-shadow: 0 20px 45px rgba(0, 0, 0, 0.65), 0 0 1px rgba(56, 189, 248, 0.25);
    --dropdown-title: #64748b;
    --dropdown-divider: rgba(255, 255, 255, 0.08);
    --dropdown-sublink-title: #f1f5f9;
    --dropdown-sublink-desc: #94a3b8;
    --dropdown-sublink-hover-bg: rgba(255, 255, 255, 0.05);
    --dropdown-sublink-active-bg: rgba(56, 189, 248, 0.08);
    --btn-ghost-bg: rgba(255, 255, 255, 0.05);

    /* Footer Tokens */
    --footer-bg: #070a12;
    --footer-border: rgba(255, 255, 255, 0.1);
    --footer-title: #f9fafb;
    --footer-text: #9ca3af;
    --footer-link: #9ca3af;
    --footer-link-hover: #38bdf8;
    --footer-bottom-border: rgba(255, 255, 255, 0.05);

    /* Form & Input Tokens */
    --input-bg: rgba(15, 23, 42, 0.8);
    --input-border: rgba(255, 255, 255, 0.15);
    --input-text: #f9fafb;
    --input-placeholder: #6b7280;
    --input-focus-border: #38bdf8;
    --input-focus-ring: rgba(56, 189, 248, 0.25);

    /* Hero & Banner Tokens */
    --hero-bg: linear-gradient(180deg, rgba(30, 41, 59, 0.6) 0%, rgba(11, 15, 25, 0.9) 100%);
    --hero-title: #ffffff;
    --hero-subtitle: #9ca3af;

    /* Page-level Alias Compatibility (prevents cascade breakage on pages with local names) */
    --bg: #0b0f19;
    --bg-body: #0a0c14;
    --card-bg: rgba(17, 24, 39, 0.85);
    --bg-card: #121624;
    --bg-card-alt: #181d30;
    --bg-input: #0e111d;
    --border: rgba(255, 255, 255, 0.08);
    --text-main: #f9fafb;
    --text-dim: #64748b;
    --primary: #38bdf8;
    --primary-hover: #0284c7;
    --accent: #818cf8;
    --success: #34d399;
    --warning: #fbbf24;
    --danger: #f87171;
}

.panel-card-highlight {
    border: 1px solid rgba(56, 189, 248, 0.4);
    background: linear-gradient(180deg, rgba(17, 24, 39, 0.95), rgba(15, 23, 42, 0.98));
    box-shadow: 0 4px 25px rgba(56, 189, 248, 0.12);
}
.code-preview-wrap {
    background: rgba(0, 0, 0, 0.45);
}