/* 
   ==========================================================================
   SYSTEM CONFIGURATION (FULL PRODUCTION v28)
   Global variables for colors, fonts, and interaction physics.
   ==========================================================================
*/

:root {
    --font-main: 'Inter', system-ui, -apple-system, sans-serif;
    --font-mono: 'JetBrains Mono', monospace;
    
    --radius-card: 16px;
    --radius-btn: 8px;
    
    /* Animation Physics */
    --anim-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --anim-speed: 0.25s;      /* Standard UI response */
    --anim-slow: 0.45s;       /* Accordion expansion */
    --anim-dropdown: 0.07s;    /* Ultra fast dropdown */
    
    --accent-primary: #3b82f6; 
    --accent-hover: #2563eb;
    --accent-text: #ffffff;
    
    --z-header: 1000;
    --z-dropdown: 1100;
}

/* DARK THEME (The Void) */
:root, [data-theme="dark"] {
    color-scheme: dark;
    
    --bg-page: #000000;
    --bg-card: #121212;
    --bg-card-hover: #1a1a1a;
    
    --bg-header-scroll: rgba(0, 0, 0, 0.8); 
    
    /* Hero Visuals */
    --hero-gradient: radial-gradient(circle at 50% -20%, rgba(59, 130, 246, 0.3), transparent 70%);
    --grid-color: rgba(255, 255, 255, 0.05);
    
    --border-color: transparent;   
    --divider-color: #2a2a2a;
    
    --text-main: #ffffff;
    --text-muted: #9ca3af;
    
    --code-bg: #080808;
    
    --control-bg-hover: rgba(255, 255, 255, 0.1);
    --details-hover-bg: rgba(255, 255, 255, 0.05);
    
    --dropdown-bg: #121212;
    --dropdown-border: #2a2a2a;
    
    --shadow-color: rgba(0, 0, 0, 0.5);

    /* BANNER OVERLAY */
    --banner-overlay-start: rgba(0,0,0,0); 
    --banner-overlay-mid: rgba(0,0,0,0.6);
    --banner-overlay-end: #000000;
    
    --banner-text: #ffffff;
    --banner-text-shadow: 0 2px 10px rgba(0,0,0,0.8);
    
    --banner-btn-bg: #ffffff;
    --banner-btn-text: #000000;
    --banner-btn-hover: #f0f0f0;

    /* BADGE LOGIC */
    --badge-bg-l: 15%;
    --badge-text-l: 85%;
}

/* LIGHT THEME (La2Tools Look) */
[data-theme="light"] {
    color-scheme: light;
    
    --bg-page: #f0f2f5;
    --bg-card: #ffffff;
    --bg-card-hover: #ffffff;
    
    --bg-header-scroll: rgba(255, 255, 255, 0.95);
    
    /* Blue Spotlight & Grid */
    --hero-gradient: radial-gradient(circle at 50% -20%, rgba(59, 156, 246, 0.5), transparent 60%);
    --grid-color: rgba(255, 255, 255, 0.5);
    
    --border-color: transparent;
    --divider-color: #ebeef4;
    
    --text-main: #09090b;
    --text-muted: #52525b;
    
    --code-bg: #e9f4ff;
    
    --control-bg-hover: rgba(0, 0, 0, 0.05);
    --details-hover-bg: rgba(0, 0, 0, 0.03);
    
    --dropdown-bg: #ffffff;
    --dropdown-border: #e5e7eb;
    
    --shadow-color: rgba(74, 81, 155, 0); 

    /* BANNER OVERLAY */
    --banner-overlay-start: rgba(255,255,255,0);
    --banner-overlay-mid: rgba(255,255,255,0.7);
    --banner-overlay-end: #ffffff;
    
    --banner-text: #000000;
    --banner-text-shadow: none;
    
    --banner-btn-bg: #000000; 
    --banner-btn-text: #ffffff;
    --banner-btn-hover: #333333;

    /* BADGE LOGIC */
    --badge-bg-l: 92%;
    --badge-text-l: 25%;
}