/* ==========================================================================
   TechBiz Security — Theme tokens (dual theme via CSS custom properties)
   themes.css is loaded first so :root vars are available to every stylesheet.
   ========================================================================== */

:root,
:root[data-theme="dark"] {
    /* Backgrounds */
    --bg:            #0a0a0f;
    --bg-secondary:  #0d1117;
    --surface:       rgba(255, 255, 255, 0.04);
    --surface-solid: #11151c;

    /* Accents */
    --accent:        #00ff88;
    --accent-2:      #00c8ff;
    --danger:        #ff3e3e;

    /* Text */
    --text:          #e8e8e8;
    --text-secondary:#8892a4;
    --text-on-accent:#04130c;

    /* Lines & effects */
    --border:        rgba(0, 255, 136, 0.15);
    --border-strong: rgba(0, 255, 136, 0.35);
    --shadow:        rgba(0, 0, 0, 0.45);
    --glow:          rgba(0, 255, 136, 0.35);
    --glow-2:        rgba(0, 200, 255, 0.30);

    --hero-gradient: radial-gradient(circle at 20% 20%, rgba(0,255,136,0.10), transparent 45%),
                     radial-gradient(circle at 80% 30%, rgba(0,200,255,0.10), transparent 45%),
                     linear-gradient(160deg, #0a0a0f, #0d1117);
}

:root[data-theme="light"] {
    /* Light Professional Mode */
    --bg:            #f4f7fb;
    --bg-secondary:  #ffffff;
    --surface:       #ffffff;
    --surface-solid: #ffffff;

    --accent:        #0066cc;
    --accent-2:      #00a0d6;
    --danger:        #d12f2f;

    --text:          #1a1a2e;
    --text-secondary:#5a6478;
    --text-on-accent:#ffffff;

    --border:        #e0e7ef;
    --border-strong: #c3d2e3;
    --shadow:        rgba(20, 35, 60, 0.10);
    --glow:          rgba(0, 102, 204, 0.22);
    --glow-2:        rgba(0, 160, 214, 0.20);

    --hero-gradient: radial-gradient(circle at 15% 20%, rgba(0,102,204,0.10), transparent 45%),
                     radial-gradient(circle at 85% 25%, rgba(0,160,214,0.10), transparent 45%),
                     linear-gradient(160deg, #eef3fa, #ffffff);
}

/* Shared design tokens (theme-independent) */
:root {
    --font-head: 'Orbitron', system-ui, sans-serif;
    --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

    --container:    1200px;
    --radius:       14px;
    --radius-sm:    8px;
    --radius-lg:    24px;

    --space-1: .5rem;
    --space-2: 1rem;
    --space-3: 1.5rem;
    --space-4: 2rem;
    --space-5: 3rem;
    --space-6: 5rem;

    --transition: 0.3s ease;

    --header-h: 72px;
}

/* Smooth transition between themes */
html,
body,
.site-header,
.card,
.btn,
.site-footer,
input,
textarea,
select {
    transition: background-color var(--transition),
                color var(--transition),
                border-color var(--transition),
                box-shadow var(--transition);
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}
