@mixin applyOverrides {
    @mixin applyFontSet;
}

:root {
    /* Colors */
    --color-primary: #FFB829;
    --color-primary-selected: #FFB82966;
    --color-primary-hover: linear-gradient(180deg, #FFBF00 0%, #FF9602 100%);
    --color-danger: #F54E51;
    --color-complete: #19CA8F;
    --color-disable: #FFB82980;
    --color-inprogress: #FDB21C;
    --color-red: #cf5855;
    --color-purple: #8559ef;

    --color-background: #1A1004;
    --color-background-secondary: #2D2001;
    --color-background-transparent: #FFFFFF0F;
    --color-background-deep: #C58545;
    --color-background-notification: #000000;

    --color-divider: #443B24;

    --button-submit-background: #FFB829;
    --button-primary-background:  linear-gradient(180deg, #FFBF00 0%, #FF9602 100%);
    --button-primary-background-active: linear-gradient(180deg, #FF9602 0%, #FFBF00 100%);
    --button-primary-text: #000000;
    --button-secondary-background: linear-gradient(180deg, #29FFF4 0%, #02C0FF 100%);
    --button-secondary-background-active: linear-gradient(180deg, #02C0FF 0%, #29FFF4 100%);
    --button-secondary-text: #000000;
    --button-disable-background: #4D4029;
    --button-disable-text: #9D8969;

    --vipcard-background : linear-gradient(240.9deg, #FFD9BC -17.47%, #FA8755 55.33%);

    --color-text: #FFFFFF;
    --color-text-secondary: #E2E1E2;
    --color-text-tertiary: #C58545;
    --color-text-transparent: #FFFFFF80;
    --color-text-muted: #C58545;
    --color-text-deep: #C58545;
    --color-text-amount: #0B3188;
    --color-text-gradient: linear-gradient(180deg, #FFFFFF, #FFFFFF80);

    --color-svg-primary: #C58545;

    --color-line: #443B24;

    /* SVG */
    --svg-size-xxs: 8px;
    --svg-size-xs: 12px;
    --svg-size-sm: 16px;
    --svg-size-md: 20px;
    --svg-size-lg: 24px;
    --svg-size-xl: 28px;
    --svg-size-xxl: 32px;
    --svg-size-xxxl: 36px;
    --svg-size-xxxxl: 40px;

    /* Spacing */
    --spacing-xss: 4px;
    --spacing-xs: 8px;
    --spacing-sm: 12px;
    --spacing-md: 16px;
    --spacing-lg: 20px;
    --spacing-xl: 24px;
    --spacing-xxl: 28px;
    --spacing-xxxl: 32px;

    /* Border Radius */
    --radius-xxs: 4px;
    --radius-xs: 8px;
    --radius-sm: 12px;
    --radius-md: 16px;
    --radius-lg: 20px;
    --radius-xl: 24px;

    /* Typography */

    /* Shadow */
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.1);
    --shadow-lg: 0 10px 15px rgba(0,0,0,0.15);
    
    --skeleton-dark-bg : linear-gradient( to right, rgb(68, 68, 68) 0%, rgb(52, 52, 52) 50%, rgb(68, 68, 68) 100%) 0 0 /  200% 100%   rgb(52, 52, 52);
    --skeleton-light-bg : linear-gradient( to right, rgb(143, 142, 141) 0%, rgb(237, 235, 233) 50%, rgb(143, 142, 141) 100%) 0 0 /  200% 100%   rgb(243, 242, 241);

    --modal-wrapper-dark-bg: var(--color-background);
    --modal-wrapper-light-bg: rgba(255, 255, 255, 0.85);

    --modal-header-dark-bg: var(--color-background-secondary);
    --modal-header-light-bg: #F3F2F1;

    --modal-body-dark-bg: var(--color-background);
    --modal-body-light-bg: #FFFFFF;

    --separator-color: none;
}