/* ===========================================================
   ICYLAB OS
   Theme System v1.0
=========================================================== */

/* =========================
   DEFAULT (Dark)
========================= */

:root,
html[data-theme="dark"] {

    color-scheme: dark;

    /* Background */

    --surface-0: #090909;
    --surface-1: #111111;
    --surface-2: #171717;
    --surface-3: #1F1F1F;
    --surface-4: #292929;

    /* Text */

    --text-primary: #F5F5F5;
    --text-secondary: #B4B4B4;
    --text-muted: #8A8A8A;
    --text-disabled: #5E5E5E;
    --text-inverse: #090909;

    /* Borders */

    --border-subtle: #202020;
    --border-default: #303030;
    --border-strong: #474747;

    /* Brand */

    --color-primary: #00FF30;
    --color-primary-hover: #2EFF58;
    --color-primary-soft: rgba(0,255,48,.12);

    /* States */

    --color-success: #00FF30;
    --color-warning: #F4B400;
    --color-error: #FF4D4F;
    --color-info: #3B82F6;
    --color-experimental: #8B5CF6;

    /* Shadows */

    --shadow-sm: 0 2px 6px rgba(0,0,0,.18);
    --shadow-md: 0 8px 24px rgba(0,0,0,.28);
    --shadow-lg: 0 24px 64px rgba(0,0,0,.42);

    /* Logo */

    --logo-filter: brightness(0) invert(1);

}

/* =========================
   LIGHT
========================= */

html[data-theme="light"] {

    color-scheme: light;

    /* Background */

    --surface-0: #F2F3F5;
    --surface-1: #FFFFFF;
    --surface-2: #F7F7F8;
    --surface-3: #ECEDEF;
    --surface-4: #DFE2E6;

    /* Text */

    --text-primary: #191919;
    --text-secondary: #555555;
    --text-muted: #7D7D7D;
    --text-disabled: #A3A3A3;
    --text-inverse: #FFFFFF;

    /* Borders */

    --border-subtle: #ECECEC;
    --border-default: #D9D9D9;
    --border-strong: #BFBFBF;

    /* Brand */

    --color-primary: #00C52B;
    --color-primary-hover: #00A625;
    --color-primary-soft: rgba(0,197,43,.10);

    /* States */

    --color-success: #00C52B;
    --color-warning: #D98B00;
    --color-error: #D93030;
    --color-info: #2563EB;
    --color-experimental: #7C3AED;

    /* Shadows */

    --shadow-sm: 0 2px 8px rgba(0,0,0,.03);
    --shadow-md: 0 8px 28px rgba(0,0,0,.06);
    --shadow-lg: 0 20px 60px rgba(0,0,0,.10);

    /* Logo */

    --logo-filter: brightness(0);

}