:root {
    --color-tertiary: 76 93 128;
    --color-secondary: 71 85 105;
    --color-surface-variant: 226 232 240;
    --color-on-primary-fixed: 0 33 20;
    --color-inverse-surface: 15 23 42;
    --color-primary-fixed: 70 255 184;
    --color-secondary-fixed: 214 228 249;
    --color-on-secondary-fixed-variant: 58 72 89;
    --color-outline-variant: 203 213 225;
    --color-on-primary-fixed-variant: 0 82 54;
    --color-surface-container: 226 232 240;
    --color-on-secondary-fixed: 15 28 44;
    --color-primary-container: 0 226 158;
    --color-tertiary-fixed-dim: 187 198 226;
    --color-surface-container-highest: 148 163 184;
    --color-outline: 100 116 139;
    --color-secondary-container: 203 213 225;
    --color-inverse-on-surface: 248 250 252;
    --color-on-tertiary-fixed: 16 27 48;
    --color-surface-container-lowest: 255 255 255;
    --color-on-background: 15 23 42;
    --color-background: 248 250 252;
    --color-on-tertiary-fixed-variant: 60 71 93;
    --color-tertiary-fixed: 215 226 255;
    --color-surface: 255 255 255;
    --color-primary: 0 199 139;
    --color-on-surface: 15 23 42;
    --color-on-surface-variant: 51 65 85;
    --color-secondary-fixed-dim: 186 200 220;
    --color-on-primary: 255 255 255;
    --color-on-primary-container: 0 74 50;
    --color-surface-dim: 203 213 225;
    --color-tertiary-container: 208 219 247;
    --color-inverse-primary: 16 249 175;
    --color-error: 186 26 26;
    --color-on-error: 255 255 255;
    --color-on-secondary-container: 30 41 59;
    --color-on-secondary: 255 255 255;
    --color-surface-container-low: 241 245 249;
    --color-surface-bright: 248 250 252;
    --color-on-tertiary-container: 16 27 48;
    --color-error-container: 255 218 214;
    --color-surface-container-high: 203 213 225;
    --color-on-tertiary: 255 255 255;
    --color-primary-fixed-dim: 0 226 158;
    --color-surface-tint: 0 199 139;
    --color-on-error-container: 65 0 2;
    --gradient-cyan: linear-gradient(to right, #00c78b, #00e29e);
}

.dark {
    --color-tertiary: 247 247 255;
    --color-secondary: 186 200 220;
    --color-surface-variant: 47 53 64;
    --color-on-primary-fixed: 0 33 20;
    --color-inverse-surface: 221 226 241;
    --color-primary-fixed: 70 255 184;
    --color-secondary-fixed: 214 228 249;
    --color-on-secondary-fixed-variant: 58 72 89;
    --color-outline-variant: 59 74 65;
    --color-on-primary-fixed-variant: 0 82 54;
    --color-surface-container: 26 32 42;
    --color-on-secondary-fixed: 15 28 44;
    --color-primary-container: 16 249 175;
    --color-tertiary-fixed-dim: 187 198 226;
    --color-surface-container-highest: 47 53 64;
    --color-outline: 132 149 138;
    --color-secondary-container: 58 72 89;
    --color-inverse-on-surface: 43 49 60;
    --color-on-tertiary-fixed: 16 27 48;
    --color-surface-container-lowest: 8 14 24;
    --color-on-background: 221 226 241;
    --color-background: 14 20 30;
    --color-on-tertiary-fixed-variant: 60 71 93;
    --color-tertiary-fixed: 215 226 255;
    --color-surface: 14 20 30;
    --color-primary: 225 255 236;
    --color-on-surface: 221 226 241;
    --color-on-surface-variant: 185 203 191;
    --color-secondary-fixed-dim: 186 200 220;
    --color-on-primary: 0 56 36;
    --color-on-primary-container: 0 110 75;
    --color-surface-dim: 14 20 30;
    --color-tertiary-container: 208 219 247;
    --color-inverse-primary: 0 108 74;
    --color-error: 255 180 171;
    --color-on-error: 105 0 5;
    --color-on-secondary-container: 168 182 202;
    --color-on-secondary: 36 49 65;
    --color-surface-container-low: 22 28 38;
    --color-surface-bright: 51 57 69;
    --color-on-tertiary-container: 85 96 120;
    --color-error-container: 147 0 10;
    --color-surface-container-high: 36 42 53;
    --color-on-tertiary: 38 48 70;
    --color-primary-fixed-dim: 0 226 158;
    --color-surface-tint: 0 226 158;
    --color-on-error-container: 255 218 214;
    --gradient-cyan: linear-gradient(to right, #10f9af, #46ffb8);
}

html:not(.dark) .light-glow {
    border-color: rgba(0, 226, 158, 0.3) !important;
    box-shadow: 0 8px 30px rgba(0, 226, 158, 0.15);
}
html:not(.dark) .light-glow:hover {
    border-color: rgba(0, 226, 158, 0.6) !important;
    box-shadow: 0 8px 30px rgba(0, 226, 158, 0.3);
}
