/* ============================================================
   THEME TOKENS
   Components (portal.css) read ONLY these variables.
   New theme = new block below + entry in src/config/themes.ts.
============================================================ */

:root[data-theme="dark"] {
    --ground:      #0A0B0E;   /* page background */
    --band:        #101217;   /* secondary band (ranking strip) */
    --panel:       #14171D;   /* cards, boxes */
    --ink:         #ECEEF2;   /* primary text */
    --ink2:        #A3AAB5;   /* secondary text */
    --ink3:        #878D98;   /* meta / captions (≥4.5:1 on ground) */
    --line:        #20242C;   /* hairlines */
    --link:        #ECEEF2;
    --link-soft:   #1C2027;   /* selected chip / tab fill */
    --accent:      #C2410C;   /* brand orange: buttons, rank badges (white text ≥4.5:1) */
    --accent-ink:  #FFFFFF;   /* text on accent */
    --accent-text: #FF8A55;   /* orange used as text on the page ground */
    --accent-soft: #2E1A10;
    --thumb:       #1A1D23;   /* image placeholder */
    --field:       #16191F;
    --field-line:  #2A2F38;
    --hover-line:  #3A3F49;
    --stripe-1:    #14171D;
    --stripe-2:    #191C23;
    --code-bg:     #101217;
    --shadow:      0 10px 24px -12px rgba(0, 0, 0, .6);
    --chart-bar:   #6B4A3A;   /* ranked bars (single hue, magnitude) */
    --chart-bar-top: #FF7A3D;
    --seg-track:   #1A1D23;   /* segmented control */
    --seg-pill:    #2E333C;
    --ok:          #4ADE80;   /* semantic status colors (not accent) */
    --info:        #38BDF8;
    --warn:        #FBBF24;
    --violet:      #A78BFA;
    --danger:      #F87171;
    color-scheme: dark;
}

:root,
:root[data-theme="light"] {
    --ground:      #FFFFFF;
    --band:        #F6F5F3;
    --panel:       #FFFFFF;
    --ink:         #16171A;
    --ink2:        #5B616B;
    --ink3:        #6B7079;
    --line:        #E7E4E0;
    --link:        #16171A;
    --link-soft:   #ECEAE6;
    --accent:      #C2410C;
    --accent-text: #C2410C;
    --accent-ink:  #FFFFFF;
    --accent-soft: #FFF0E7;
    --thumb:       #ECEAE7;
    --field:       #F6F5F3;
    --field-line:  #E0DDD8;
    --hover-line:  #CFCAC3;
    --stripe-1:    #F6F5F3;
    --stripe-2:    #EFEDE9;
    --code-bg:     #F6F5F3;
    --shadow:      0 10px 24px -14px rgba(20, 20, 20, .25);
    --chart-bar:   #F2B08F;
    --chart-bar-top: #C2410C;
    --seg-track:   #ECEAE6;
    --seg-pill:    #FFFFFF;
    --ok:          #15803D;
    --info:        #0369A1;
    --warn:        #B45309;
    --violet:      #6D28D9;
    --danger:      #B91C1C;
    color-scheme: light;
}

/* Site bar (header + footer) is black in every theme */
.sb,
.sf {
    --bar:        #000000;
    --bar-sub:    #8C929C;
    --ink:        #ECEEF2;
    --ink3:       #8C929C;
    --link:       #FFFFFF;
    --line:       #20242C;
    --field:      #16191F;
    --field-line: #2A2F38;
    color-scheme: dark;
}