:root {
    --color-blue: #6B77FA;
    --color-greyblue: #A7ABBE;
    --color-mono-black: #FAFAFA;
    --color-purple: #9580FF;
    --color-mono-white: #262626;

    --color-blue-20: #CED2FD;
    --color-blue-30: #9DA4FB;
    --color-blue-40: #6B77FA;
    --color-blue-45: #3A4AF8;
    --color-blue-50: #2233F7;
    --color-blue-55: #091DF6;
    --color-blue-60: #081ADD;
    --color-blue-70: #0717C5;
    --color-blue-80: #051194;
    --color-blue-90: #040B62;
    --color-blue-95: #040B62;
    --color-blue-97: #040B62;

    --color-greyblue-30: #F6F7F8;
    --color-greyblue-40: #F0F1F4;
    --color-greyblue-50: #E2E3E9;
    --color-greyblue-60: #D3D5DE;
    --color-greyblue-70: #C4C7D4;
    --color-greyblue-80: #A7ABBE;
    --color-greyblue-85: #8A8FA8;
    --color-greyblue-90: #6C7393;
    --color-greyblue-95: #414558;
    --color-greyblue-97: #2C2F3A;

    --color-mono-0:  #FFFFFF;
    --color-mono-15: #FAFAFA;
    --color-mono-50: #CCCCCC;
    --color-mono-60: #B2B2B2;
    --color-mono-70: #999999;
    --color-mono-80: #808080;
    --color-mono-85: #6A6A6A;
    --color-mono-90: #545454;
    --color-mono-95: #3E3E3E;
    --color-mono-97: #2E2E2E;

    --color-purple-20: #F6F5FF;
    --color-purple-30: #F2F0FF;
    --color-purple-40: #EAE5FF;
    --color-purple-50: #D4CCFF;
    --color-purple-60: #BFB2FF;
    --color-purple-65: #9580FF;
    --color-purple-75: #6A4DFF;
    --color-purple-85: #5533FF;
    --color-purple-90: #2B00FF;
    --color-purple-95: #2200CC;
    --color-purple-97: #1A0099;
    --color-purple-98: #110066;

    --color-dark-green: #46931F; /* Dark Green 35 */
    --color-green: #75BF40;      /* Green 50 */
    --color-yellow: #ECB613;     /* Yellow 50 */
    --color-red: #CC3333;        /* Red 50 */

    --color-dark-green-30: #3C7E1B;
    --color-dark-green-35: #46931F;
    --color-dark-green-40: #50A824;
    --color-dark-green-45: #5ABD28;
    --color-dark-green-55: #73D742;
    --color-dark-green-60: #83DB57;
    --color-dark-green-70: #A2E481;
    --color-dark-green-80: #C1EDAB;
    --color-dark-green-85: #D0F2C0;
    --color-dark-green-90: #E0F6D5;

    --color-green-45: #69AC39;
    --color-green-50: #75BF40;
    --color-green-55: #83C653;
    --color-green-60: #91CC66;
    --color-green-70: #ACD98C;
    --color-green-80: #C8E5B3;
    --color-green-90: #E3F2D9;
    --color-green-95: #F1F9EC;
    --color-green-97: #F7FBF4;

    --color-yellow-45: #D4A411;
    --color-yellow-50: #ECB613;
    --color-yellow-55: #EEBD2B;
    --color-yellow-60: #F0C442;
    --color-yellow-70: #F4D371;
    --color-yellow-80: #F7E2A1;
    --color-yellow-90: #FBF0D0;
    --color-yellow-95: #FDF8E7;
    --color-yellow-97: #FEFBF1;

    --color-red-45: #B82E2E;
    --color-red-50: #CC3333;
    --color-red-55: #D14747;
    --color-red-60: #D65C5C;
    --color-red-70: #E08585;
    --color-red-80: #EBADAD;
    --color-red-90: #F5D6D6;
    --color-red-95: #FAEBEB;
    --color-red-97: #FDF7F7;

    /*
    --color-dark-green-30: #E0F6D5;
    --color-dark-green-35: #D0F2C0;
    --color-dark-green-40: #C1EDAB;
    --color-dark-green-45: #A2E481;
    --color-dark-green-55: #83DB57;
    --color-dark-green-60: #73D742;
    --color-dark-green-70: #5ABD28;
    --color-dark-green-80: #50A824;
    --color-dark-green-85: #46931F;
    --color-dark-green-90: #3C7E1B;

    --color-green-45: #F4FAEE;
    --color-green-50: #F1F7E8;
    --color-green-55: #E3F2D9;
    --color-green-60: #C8E5B3;
    --color-green-70: #ACD98C;
    --color-green-80: #91CC66;
    --color-green-90: #83C653;
    --color-green-95: #75BF40;
    --color-green-97: #69AC39;

    --color-green-45: #ECF7E9;
    --color-green-50: #C8E5B3;
    --color-green-55: #B6DE9E;
    --color-green-60: #A3D689;
    --color-green-70: #8FCF6A;
    --color-green-80: #78C64A;
    --color-green-90: #6FBF3A;
    --color-green-95: #69AC39;
    --color-green-97: #568E31;

    --color-yellow-45: #FBF0D0;
    --color-yellow-50: #FDF8E7;
    --color-yellow-55: #FEFBF1;
    --color-yellow-60: #F7E2A1;
    --color-yellow-70: #F4D371;
    --color-yellow-80: #F0C442;
    --color-yellow-90: #EEBD2B;
    --color-yellow-95: #ECB613;
    --color-yellow-97: #D4A411;

    --color-red-45: #F5D6D6;
    --color-red-50: #FAEBEB;
    --color-red-55: #FDF7F7;
    --color-red-60: #EBADAD;
    --color-red-70: #E08585;
    --color-red-80: #D65C5C;
    --color-red-90: #D14747;
    --color-red-95: #CC3333;
    --color-red-97: #B82E2E;
    */

    --fg-placeholder: var(--color-mono-70);
    --fg-text: var(--color-mono-15);
    --fg-text-action: var(--color-purple-65);
    --fg-text-action-hover: var(--color-purple-75); 
    --fg-text-secondary: var(--color-mono-60); 
    --fg-text-tertiary: var(--color-mono-70); 
    --fg-text-disabled: var(--color-mono-80); 
    --fg-text-on-action: var(--color-mono-black); 
    --fg-text-on-action-secondary: var(--color-greyblue-80); 
    --fg-error: var(--color-red-60); 
    --fg-success: var(--color-dark-green-45); 
    --fg-warning: var(--color-yellow-60); 

    --bg-page: var(--color-mono-white);
    --bg-primary: var(--color-mono-white);
    --bg-subtle: var(--color-mono-95);
    --bg-action: var(--color-purple-60);
    --bg-action-hover: var(--color-purple-55);
    --bg-action-secondary: var(--color-greyblue-95);
    --bg-action-secondary-hover: var(--color-purple-97);
    --bg-action-subtle: var(--color-mono-white);
    --bg-action-subtle-hover: var(--color-greyblue-97);
    --bg-disabled: var(--color-mono-95);
    --bg-success: var(--color-dark-green-90);
    --bg-error: var(--color-red-95);
    --bg-warning: var(--color-yellow-90);

    --color-branding-loud: #9580FF; 
    --color-branding-dark: var(--color-mono-60);
    --color-branding-mid: var(--color-mono-95);
    --color-branding-light: var(--color-mono-97);
    --color-branding-links: var(--color-purple-65);

    --color-logomark: var(--color-purple-85);

    /* Some particular elements are different in light and dark modes */
    /* Active Secondary Buttons */
    --secondary-active-background: var(--color-mono-97); 
    --secondary-active-bordercolor: var(--color-mono-90);
    --secondary-active-color: var(--color-purple); 

    /* Filmlist Filter */
    --filmlist-filter-background: var(--color-mono-white);
    --filmlist-filter-accent: var(--color-mono-95);

    /* Admin Functions */
    --adminbox-background: #6B5200;
    --adminbox-border: #8A6B00;
    --adminbox-color: #FFFFFF;
    --adminbox-link: #FFE199;

}