@mixin applyOverrides {
    @mixin applyFontSet;
}

:root {
    /* Colors */
    --color-primary: #F7181C;
    --color-primary-selected: #F7181C66;
    --color-primary: #F7181C;
    --color-primary-hover: linear-gradient(152.19deg, #F7181C 17.27%, #940002 82.73%);
    --color-secondary: #FDB21C;
    --color-danger: #F54E51;
    --color-complete: #19CA8F;
    --color-disable: #F7181C80;
    --color-inprogress: #FDB21C;
    --color-red: #cf5855;
    --color-purple: #8559ef;

    --color-background: #000000;
    --color-background-secondary: #230505;
    --color-background-transparent: #FF86861C;
    --color-background-deep: #AB8F8F;
    --color-background-notification: #000000;

    --color-divider: #442429;

    --button-submit-background: #F7181C;
    --button-primary-background:  linear-gradient(180deg, #F7181C 0%, #940002 100%);
    --button-primary-background-active: linear-gradient(180deg, #940002 0%, #F7181C 100%);
    --button-primary-text: #FFFFFF;
    --button-secondary-background: linear-gradient(180deg, #E4E4E4 0%, #353535 100%);
    --button-secondary-background-active: linear-gradient(180deg, #353535 0%, #E4E4E4 100%);
    --button-secondary-text: #FFFFFF;

    --vipcard-background : linear-gradient(240.9deg, #FFD9BC -17.47%, #FA8755 55.33%);

    --color-text: #FFFFFF;
    --color-text-transparent: #FFFFFF80;
    --color-text-secondary: #E2E1E2;
    --color-text-muted: #AB8F8F;
    --color-text-deep: #AB8F8F;
    --color-text-amount: #0B3188;
    --color-text-gradient: linear-gradient(180deg, #FFFFFF, #FFFFFF80);

    --color-svg-primary: #AB8F8F;

    --svg-color-start: #AB8F8F;
    --svg-color-end: #AB8F8F;

    --color-svg-primary-1: #AB8F8F;
    --color-svg-primary-2: #AB8F8F;
    --color-svg-primary-main: var(--color-primary);
    --color-svg-secondary-1: #AB8F8F;
    --color-svg-secondary-2: #AB8F8F;
    /* --color-svg-secondary-main: #000000; */
    --color-svg-third-1: #FFFFFF;
    --color-svg-third-2: #FFFFFF;
    /* --color-svg-third-main: #000000; */
    --color-svg-fouth-1: #AB8F8F;
    --color-svg-fouth-2: #AB8F8F;

    --color-svg-primary-active: #FFFFFF;
    --color-svg-primary-active-1: #FFFFFF;
    --color-svg-primary-active-2: #FFFFFF;
    --color-svg-primary-active-main: #FFFFFF;

    --color-line: #AB8F8F;

    /* 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;

    /* Home Floating Icon Start */
    /* --hfi-bg: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);
    --hfi-close-button-bg: #FFFFFF;
    --hfi-close-button-color: #000000; */
    /* MiniGame */
    /* --hfi-minigame-top: 0px;
    --hfi-minigame-left: 0px;
    --hfi-minigame-bottom: 0px;
    --hfi-minigame-right: 0px;
    --hfi-minigame-width: 110px;
    --hfi-minigame-height: 110px; */
    /* Home Floating Icon End */

    /* Header start */
    /* --header-mobile-bg: #171D31; */
    /* Header end */

    /* tab start */
    --tab-container-bg: linear-gradient(180deg, #F7181C 0%, #940002 100%);
    --tab-container-border: #AB8F8F;
    --tab-button-bg: #F7181C;
    --tab-button-color: #FFFFFF;
    --tab-button-disabled-bg: #940002;
    --tab-button-disabled-color: #FFFFFF;
    --tab-item-bg: transparent;
    --tab-item-color: #FFFFFF;
    --tab-item-active-bg: #FF3B3B;
    --tab-item-active-color: #FFFFFF;
    --tab-item-active-color2: #FFFFFF;
    /* --tab-item-bg-m: linear-gradient(180deg, #FFCE00 0%, #FFA200 100%); */
    /* tab end */

    /* game provider item transparent bg start */
    /* --game-item-hover-bg: rgba(0, 0, 0, 0.3); */
    /* game provider item transparent bg end */

    /* footer start */
    /* --footer-bg-m: linear-gradient(180deg, #C5ECEE 0%, #5DBDB8 100%);
    --footer-item-color-m: #FFFFFF;
    --footer-item-active-color-m: #FFFFFF; */
    /* --footer-border-color: #02b182; */
    /* footer end */

    /* Overwrite */
    /* --skeleton-dark-bg: linear-gradient(
        to right,
        rgb(235, 235, 235) 0%,
        rgb(220, 220, 220) 50%,
        rgb(235, 235, 235) 100%
    ) 0 0 / 200% 100% rgb(220, 220, 220); */

    /* Refferal */
    /* 
    --referral-banner-bg: 
    */

    /* promotion image size start */
    /* --aspect-ratio: 2000/500;
    --promotion-image-desktop-width: 300px;
    --promotion-image-desktop-maxWidth: 300px;
    --promotion-image-mobile-width: 280px;
    --promotion-image-mobile-maxWidth: 280px;
    --promotion-image-radius: var(--radius-xs); */
    /* promotion image size end */

    /* Withdraw Button Start */
    /* --withdraw-add-buton-color: var(--color-primary); */
    /* Withdraw Button End */

    /* Table */
    
    /* --table-bg:
    --table-header-bg:
    --table-header-color:
    --table-row-bg:
    --table-row-main-color:
    --table-row-color:
    --table-even-row-bg:
    --table-even-row-color: */
    /* --table-header-text: #FFFFFF; */
    /* --table-border: 1px solid red */
   
    /* Running text */
    /* --running-text-bg: #712A86;
    --running-text-content: #FFFFFF; */

    /* Member Top Result */
    --member-topresult-bg: linear-gradient(180deg, #F7181C 0%, #940002 100%);
    /* --member-topresult-text: #FFFFFF; */

    /* Menu */
    /* --menu-bg-hover: linear-gradient(180deg, #612473 0%, #9B3EB6 50%, #612473 100%);
    --menu-text: #FFFFFF; */
    /* --menu-text-link: #FFFFFF; */

    /* Segmented Control */
    /* --segmented-button-bg-active: linear-gradient(180deg, #612473 0%, #9B3EB6 50%, #612473 100%);
    --segmented-button-color-acitve: #FFFFFF; */

    /* Latest promotion vertical */
    /* --latest-promotion-vertical-bg: linear-gradient(180deg, #612473 0%, #9B3EB6 50%, #612473 100%);
    --latest-promotion-vertical-title: #FFFFFF; */

    /* History */
    /* --color-option-text: #712A8666; */

    /* Provider game */
    /* --provider-button-bg: #BCDD37; */
}