/* FUTURISTIC PURPLE THEME */
html.futuristic-purple-dark {
    /* BASE COLORS */
    --color-bg: #000;
    --color-bg-soft: rgba(0, 0, 0, 0.8);
    --color-text: #ffffff;
    --color-text-dark: #000000;

    /* PRIMARY ACCENT */
    --color-accent: rgb(150, 100, 255);
    --color-accent-soft: rgba(150, 100, 255, 0.3);
    --color-accent-glow: rgba(150, 100, 255, 0.6);

    /* GLASS / UI */
    --color-glass: rgba(255, 255, 255, 0.015);
    --color-glass-strong: rgba(255, 255, 255, 0.15);
    --color-border: rgba(255, 255, 255, 0.2);
    --color-border-soft: rgba(255, 255, 255, 0.1);

    /* SHADOWS */
    --shadow-dark: rgba(0, 0, 0, 0.4);
    --shadow-soft: rgba(0, 0, 0, 0.2);

    /* STATUS COLORS */
    --status-completed: rgba(150, 150, 150, 0.2);
    --status-ongoing: rgba(150, 100, 255, 0.4);
    --status-onhold: rgba(255, 150, 100, 0.2);

    /* FLOW */
    --flow-color: hsla(259, 100%, 70%, 0.8);
    --flow-hue-shift: 0;   
    --flow-lightness: 70%;    
}
html.futuristic-purple-light {
    /* BASE COLORS */
    --color-bg: #f5f5ff;
    --color-bg-soft: rgba(245, 245, 255, 0.85);
    --color-text: #1a1a1a; /* dark text */
    --color-text-dark: #000000;

    /* PRIMARY ACCENT */
    --color-accent: rgb(150, 100, 255);
    --color-accent-soft: rgba(150, 100, 255, 0.3);
    --color-accent-glow: rgba(150, 100, 255, 0.6);

    /* GLASS / UI */
    --color-glass: rgba(0, 0, 0, 0.02);
    --color-glass-strong: rgba(0, 0, 0, 0.08);
    --color-border: rgba(0, 0, 0, 0.2);
    --color-border-soft: rgba(0, 0, 0, 0.1);

    /* SHADOWS */
    --shadow-dark: rgba(0, 0, 0, 0.25);
    --shadow-soft: rgba(0, 0, 0, 0.1);

    /* STATUS COLORS */
    --status-completed: rgba(150, 150, 150, 0.15);
    --status-ongoing: rgba(150, 100, 255, 0.3);
    --status-onhold: rgba(255, 150, 100, 0.15);

    /* FLOW */
    --flow-color: hsla(259, 100%, 70%, 0.6);
    --flow-hue-shift: 0;
    --flow-lightness: 80%;
}

/* CYBERPUNK THEME */
html.cyberpunk-dark {
    /* BASE COLORS */
    --color-bg: #0a0a0f;
    --color-bg-soft: rgba(10, 10, 15, 0.85);
    --color-text: #e0f0ff;
    --color-text-dark: #101020;

    /* PRIMARY ACCENT */
    --color-accent: rgb(0, 255, 200);
    --color-accent-soft: rgba(0, 255, 200, 0.3);
    --color-accent-glow: rgba(0, 255, 200, 0.6);

    /* GLASS / UI */
    --color-glass: rgba(255, 255, 255, 0.02);
    --color-glass-strong: rgba(255, 255, 255, 0.18);
    --color-border: rgba(0, 255, 200, 0.4);
    --color-border-soft: rgba(0, 255, 200, 0.15);

    /* SHADOWS */
    --shadow-dark: rgba(0, 0, 0, 0.6);
    --shadow-soft: rgba(0, 0, 0, 0.25);

    /* STATUS COLORS */
    --status-completed: rgba(100, 100, 100, 0.2);
    --status-ongoing: rgba(0, 255, 200, 0.5);
    --status-onhold: rgba(255, 0, 150, 0.3);

    /* FLOW */
    --flow-color: hsla(180, 100%, 70%, 0.8);
    --flow-hue-shift: 200;
    --flow-lightness: 65%;
}
html.cyberpunk-light {
    /* BASE COLORS */
    --color-bg: #e0f0ff;
    --color-bg-soft: rgba(224, 240, 255, 0.85);
    --color-text: #101020;
    --color-text-dark: #000000;

    /* PRIMARY ACCENT */
    --color-accent: rgb(0, 255, 200);
    --color-accent-soft: rgba(0, 255, 200, 0.3);
    --color-accent-glow: rgba(0, 255, 200, 0.6);

    /* GLASS / UI */
    --color-glass: rgba(0, 0, 0, 0.02);
    --color-glass-strong: rgba(0, 0, 0, 0.1);
    --color-border: rgba(0, 255, 200, 0.3);
    --color-border-soft: rgba(0, 255, 200, 0.1);

    /* SHADOWS */
    --shadow-dark: rgba(0, 0, 0, 0.25);
    --shadow-soft: rgba(0, 0, 0, 0.1);

    /* STATUS COLORS */
    --status-completed: rgba(100, 100, 100, 0.15);
    --status-ongoing: rgba(0, 255, 200, 0.3);
    --status-onhold: rgba(255, 0, 150, 0.15);

    /* FLOW */
    --flow-color: hsla(180, 100%, 70%, 0.6);
    --flow-hue-shift: 200;
    --flow-lightness: 75%;
}

/* BLUE LAGOON THEME */
html.blue-lagoon-dark {
    --color-bg: #0d1f2d;
    --color-bg-soft: rgba(13, 31, 45, 0.85);
    --color-text: #cce6ff;
    --color-text-dark: #0a1a2a;

    --color-accent: rgb(0, 120, 255);
    --color-accent-soft: rgba(0, 120, 255, 0.3);
    --color-accent-glow: rgba(0, 120, 255, 0.6);

    --color-glass: rgba(200, 230, 255, 0.02);
    --color-glass-strong: rgba(200, 230, 255, 0.15);
    --color-border: rgba(0, 120, 255, 0.25);
    --color-border-soft: rgba(0, 120, 255, 0.1);

    --shadow-dark: rgba(0,0,0,0.5);
    --shadow-soft: rgba(0,0,0,0.2);

    --status-completed: rgba(100, 150, 200, 0.2);
    --status-ongoing: rgba(0, 120, 255, 0.4);
    --status-onhold: rgba(50, 70, 120, 0.3);

    --flow-color: hsla(210, 100%, 70%, 0.8);
    --flow-hue-shift: 0;
    --flow-lightness: 65%;
}

/* SUNSET THEME */
html.sunset-dark {
    --color-bg: #1b2a30; 
    --color-bg-soft: rgba(27, 42, 48, 0.85);
    --color-text: #ffe0b0; 
    --color-text-dark: #1a1610;

    --color-accent: rgb(255, 130, 50);
    --color-accent-soft: rgba(255, 130, 50, 0.3);
    --color-accent-glow: rgba(255, 130, 50, 0.6);

    --color-glass: rgba(255, 200, 150, 0.02);
    --color-glass-strong: rgba(255, 200, 150, 0.15);
    --color-border: rgba(255, 130, 50, 0.25);
    --color-border-soft: rgba(255, 130, 50, 0.1);

    --shadow-dark: rgba(0,0,0,0.5);
    --shadow-soft: rgba(0,0,0,0.2);

    --status-completed: rgba(180, 160, 120, 0.2);
    --status-ongoing: rgba(255, 130, 50, 0.4);
    --status-onhold: rgba(255, 200, 50, 0.3);

    --flow-color: hsla(30, 100%, 65%, 0.8);
    --flow-hue-shift: 180;
    --flow-lightness: 60%;
}