:root {
    /* Notifications */
    --accent-1: 255, 182, 30;
    --accent-2: 237, 63, 156;
}

:root[data-theme="WHITE"] {
    --body-bg: linear-gradient(180deg, #F2F5FA 0%, #E9EEF6 100%);
    --navbar-bg: #FFFFFF;
    --navbar-bg-box: #FFFFFF;
    --text-color: #0E1320;
    --text-secondaire: #3F4A5A;
    --text-muted: #78839B;
    --primary-color: #0E1320;
    --secondary-color: #2A3450;
    --box-color: #FFFFFF;
    --box-color-double: #F7F9FC;
    --border-color: #D6DBEA;
    --border-color-reverse: #000000;
    --box-shadow: rgba(15, 23, 42, 0.08) 0px 4px 12px;

    --dropdown-bg: #FFFFFF;
    --dropdown-hover: #F1F4FA;

    --button-secondary: #FFCB65;
    --button-secondary-hover: #caa762;
    --button-green: #1ce589;
    --button-green-hover: #19db82;
    --bow-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    --profil-banner-hover: rgba(211, 212, 220, 0.7);

    --color-red: #FF5942;
    --color-green: #00D264;
    --color-orange: #FFA334;
    --color-blue: #6D95F3;
    --hover-staff: #1F2333;
    --border-dot: #202836;
    --staff-overlay: linear-gradient(rgb(98 98 106 / 74%), rgb(44 44 46 / 75%));

    --modal-overlay: rgba(10, 10, 10, .86);
    --modal-background-1: #fafafa;
    --modal-background-2: #f6f6f6;

    --city-background: url(/assets/img/background/city_background_white.png);
    --separator-bulle: url(/assets/img/background/separator-bulle-light.png);

    /* CENTER */
    --chest-overlay-bg: rgba(255, 255, 255, 0.92);
    --reward-modal-bg: var(--box-color, #ffffff);
    --reward-modal-border: var(--border-color, #e0e0e0);
}

:root[data-theme="DARK"] {
    --body-bg: linear-gradient(180deg, #1e2430 0%, #212737 100%);
    --navbar-bg: #151A23;
    --navbar-bg-box: #151A23;
    --text-color: #FFFFFF;
    --text-secondaire: #B0B5C3;
    --text-muted: #6A6F87;
    --primary-color: #ffffff;
    --secondary-color: #2a3244;
    --box-color: #1b202c;
    --box-color-double: #202635;
    --border-color: #2E334D;
    --border-color-reverse: #ffffff;
    --box-shadow: rgba(0, 0, 0, 0.3) 0px 4px 12px;

    --dropdown-bg: #1b202c;
    --dropdown-hover: #2a3244;

    --button-secondary: #F5C25C;
    --button-secondary-hover: #caa762;
    --button-green: #00D38B;
    --button-green-hover: #00d38b;

    --color-red: #FF5942;
    --color-green: #00D264;
    --color-orange: #FFA334;
    --color-blue: #6D95F3;
    --hover-staff: #1F2333;
    --border-dot: #ffffff;
    --staff-overlay: linear-gradient(rgb(0 0 0 / 84%), rgb(30 32 36 / 83%));

    --modal-overlay: rgba(10, 10, 10, .86);
    --modal-background-1: #1e2430;
    --modal-background-2: #202836;

    --city-background: url(/assets/img/background/city_background_black.png);
    --separator-bulle: url(/assets/img/background/separator-bulle-dark.png);

    --warning: #F5C25C;

    /* CENTER */
    --chest-overlay-bg: rgba(0, 0, 0, 0.92);
    --reward-modal-bg: var(--box-color, #1b202c);
    --reward-modal-border: var(--border-color, #2E334D);
}