/*
 * Palette for this game. Everything visual that differs between crash clients lives here;
 * the shared src/ (gg-crash-base) reads these properties and nothing else.
 *
 * The canvas cannot read CSS, so game/theme.ts resolves the properties marked "Canvas"
 * through getComputedStyle. A property listing several #rrggbb values becomes a gradient
 * there; a single one stays flat.
 *
 * Linked from index.html, not imported from JS, so it can be swapped in a deployed build.
 */

/* Fonts. These URLs resolve against the served root, which is what public/ is. */
@font-face {
  font-family: 'Geologica Mono';
  src: url(font/Geologica/GeologicaRoman-Black-mono.ttf);
}

@font-face {
  font-family: 'Noto Color Emoji';
  src: url(font/NotoColorEmoji-Regular.ttf);
}

@font-face {
  font-family: 'Sportingbet';
  src: url(font/Sportingbet.ttf);
}

@font-face {
  font-family: 'RussoOne';
  src: url(font/RussoOne-Regular.woff);
}

@font-face {
  font-family: 'Exo-BlackItalic';
  src: url(font/Exo-BlackItalic.woff);
}

:root {

    /* Loading */
    --loading-bg: #1B1C1D;
    --progressbar-bg: #0C0C0C;
    --progressbar-border: none;
    --progressbar-border-radius: 999px;
    --progress-bg: linear-gradient(90deg, #FF8BFB 0%, #F4F18E 50%, #94D9C6 100%);


    /* Generic */

    --bg: #0E0E0E;
    --base-bg: #0E0E0E;
    --menu-bg: #1B1C1D;
    --menu-border: none;
    --menu-item-bg-color: #101112;
    --menu-item-hover-bg-color: #30353B;
    --menu-item-active-bg-color: #000000;
    --menu-item-border-bottom: none;
    --menu-container-item-bg-color: #ca0080;
    --menu-container-item-bg-hover-color: #15272A;
    --menu-container-item-bg-active-color: #15272A;
    --menu-container-item-border-bottom: 1px solid #1B1C1D;
    --menu-container-item-home-link-bg: #1B1C1D;
    --menu-container-item-home-link-border-radius: 0 0 10px 10px;
    --menu-container-profile-bg: #1B1C1D;
    --menu-container-profile-border-radius: 10px 10px 0 0;
    --surface-bg: #1B1C1D;
    --surface-border: none;
    --surface-border-radius: 10px;
    --divider-bg: #ffffff;
    --divider-border: 1px solid #FFF;
    --default-text: white;
    --variant-text: #2C0C00;
    --accent-text: #ffffff;
    --success-bg: #00D8C8;
    --success-color: #0F0400;

    --loader-bg: #007E74;

    --scrollbar-bg: #7e7e7e;
    --scrollbar-track-bg: #293036;

    --round-info-bg: #3B6DB0;
    --round-info-border: none;
    --round-info-header-bg: #1B1C1D;
    --round-info-label-text: #fff;
    --header-bg: #161718;
    --headerBar-border-bottom: none;

    --history-pill-bg: #141516;
    --history-pill-active-bg: #FFFFFF;
    --history-pill-active-color: #000E3E;
    --history-pill-active-border: none;
    --history-pill-border: none;
    --history-pill-border-radius: 99px;
    --history-open-btn-border-radius: 99px;
    --history-open-btn-bg: none;
    --history-open-btn-border: none;
    --history-open-btn-hover-bg: none;
    --history-open-btn-hover-border: 1px solid #ffffff;
    --history-open-btn-active-bg: none;
    --history-open-btn-active-border: none;
    --history-open-btn-active-text: #FFFFFF;
    --history-open-btn-text: #ffffff;
    --history-open-btn-active-border: none;

    --bet-info-multiplier-pill-bg: transparent;

    --history-item-active-bg: #101112;
    --history-item-active-text: #292163;
    --history-item-active-border: none;

    --history-item-bg: transparent;
    --history-item-text: #ffffff;
    --history-item-border: none;


    --history-open-bg: #1B1C1D;
    --history-header-open-bg: #2C2D30;
    --history-header-open-border-bottom: none;
    --header-howtoplay-bg: #1B1C1D;
    --header-howtoplay-border: 1px solid transparent;
    --header-howtoplay-text: #fff;
    --header-howtoplay-hover-text: #00B8AA;
    --header-howtoplay-active-text: #007E74;
    --header-howtoplay-border-radius: 999px;
    --header-howtoplay-hover-bg: #1B1C1D;
    --header-howtoplay-active-bg: #1B1C1D;
    --HowToPlay-Detailed-Rules-Bttn-bg: #2C2D30;

    /* Menu */
    --change-avatar-btn-border-radius: 999px;
    --change-avatar-btn-bg: #141516;
    --change-avatar-btn-hover-bg: #30353B;
    --change-avatar-btn-active-bg: #000000;
    --change-avatar-btn-border: none;

    --toggle-active-bg: #007E74;
    --toggle-active-border: solid 1.5px #fff;
    --toggle-active-slider: #fff;

    /* Tabs */
    --tab-bg: #161718;
    --sub-tab-bg: #161718;
    --tab-selected-bg: #2C2D30;
    --tab-border: 1px solid transparent;
    --tab-border-radius: 40px;
    --tab-text: #ffffff;
    --tab-selected-border: none;
    --tab-selected-border-radius: 40px;
    --tab-selected-text: #ffffff;
    --tab-active-bg: rgba(32, 30, 35);
    --tab-active-border: none;
    --tab-active-text: #ffffff80;
    --tab-hover-bg: #FFD649;
    --tab-hover-border: 1px solid rgba(210, 252, 255, 0.55);
    --tab-hover-text: #FFFFFF80;
    --tab-border-radius: 999px;

    --sub-tab-selected-text: #FFFFFF;
    --sub-tab-selected-bg: #2C2D30;
    --sub-tab-selected-border: none;
    --sub-tab-border-radius: 999px;

    --top-bets-big-win-item-header-bg: #101112;
    --top-bets-big-win-item-header-border: none;
    --top-bets-big-win-item-footer-bg: #161718;
    --top-bets-big-win-item-footer-border: none;
    --top-bets-big-win-item-multiplier-pill-bg: #141516;

    --top-bets-multipliers-bg: #101112;
    --top-bets-multipliers-border: none;
    --top-bets-multipliers-highlighted-bg: #005D56;
    --top-bets-multipliers-highlighted-border: none;

    --top-bets-multipliers-pill-border-radius: 99px;
    --top-bets-multipliers-pill-bg: #252525;
    /* Bet Form */
    --bet-form-border: none;
    --bet-form-bg: #1B1C1D;
    --auto-section-border: 1px solid #2C2D30;
    --auto-main-section-bg: #3B6DB0;
    --auto-section-bg: #3B6DB0;

    --bet-stake-input-btn-bg: #2C2D30;
    --bet-stake-input-btn-border-radius: 99px;
    --bet-stake-input-btn-border: none;
    --bet-stake-input-border-radius: 99px;
    --counter-button-icon-color: #FFFFFF;
    --counter-button-icon-active-color: #FFFFFF;
    --counter-button-bg: #161718;
    --counter-button-hover-bg: #00D8C8;
    --counter-button-active-bg: #00B8AA;


    --bet-preset-bg: #141516FB;
    --bet-preset-hover-bg: #00D8C8;
    --bet-preset-active-bg: #00B8AA;
    --bet-preset-radius: 999px;
    --bet-preset-border: 1px solid none;

    /* Add Slot Button */
    --bet-form-add-slot-button-bg: linear-gradient(#849582 0%, #31565E 30%, #202024 81%, #31565E 100%);
    --bet-form-add-slot-button-border: 1px solid #6CF6FF;
    --bet-form-add-slot-button-text: #FFF;
    --bet-form-add-slot-button-hover-bg: #fff;
    --bet-form-add-slot-button-hover-border: 2px solid #6CF6FF;
    --bet-form-add-slot-button-hover-text: #FFF;
    --bet-form-add-slot-button-border-radius: 6px;

    --bet-form-add-form-button-bg: #2C2D30;
    --bet-form-add-form-button-border-radius: 50%;
    --bet-form-add-form-button-color: #Ffffff;
    --bet-form-add-form-button-hover-bg: #00D8C8;
    --bet-form-add-form-button-hover-color: #fff;
    --bet-form-add-form-button-active-bg: #00B8AA;
    --bet-form-add-form-button-active-color: #fff;


    --bet-form-remove-button-bg: #2C2D30;
    --bet-form-remove-button-color: #fff;
    --bet-form-remove-button-border: ;
    --bet-form-remove-button-hover-bg: #00D8C8;
    --bet-form-remove-button-hover-border: ;
    --bet-form-remove-button-hover-color: #fff;
    --bet-form-remove-button-active-bg: #00B8AA;
    --bet-form-remove-button-active-color: #fff;


    --bet-form-remove-button-border-radius: 50%;


    /* Scoreboard */
    --scoreboard-header-text: #FFF;
    --scoreboard-row-text: #FFFFFFB2;
    --scoreboard-row-active-bg: rgba(99, 30, 99, 1);
    --scoreboard-row-active-text: #292163;

    --scoreboard-bets-bg: #3B6DB0;
    --scoreboard-bets-border: 1px solid #fff;

    --all-bets-item-bg: #101112;
    --all-bets-item-border: none;
    --all-bets-item-win-bg: #007E74;
    --all-bets-item-win-border: none;



    --bet-history-item-bg-color: #1B1C1D;
    --bet-history-item-border-color: none;
    --scoreboard-row-active-border: none;
    --bet-history-item-text: #FFFFFFCC;
    --myBets-win-bg: #1B1C1D;
    --myBets-multiplier-pill-bg: #252525;
    --myBets-multiplier-pill-color: #293036;
    --myBets-row-bg: #003A35;
    --myBets-row-border: none;
    --myBets-row-bottom-bg: #101112;
    --myBets-row-bottom-border: none;
    --myBets-row-win-bg: #003A35;
    --myBets-initial-balance-color: #00E2D1;
    --myBets-balance-header-color: #FFFFFF;
    --scoreboard-row-active-text: #FFFFFFB2;

    --bet-history-item-active-bg: #00D8C8;
    --bet-history-item-active-text: #292163;
    --bet-history-item-active-border: none;

    --bet-history-load-more-button-bg: #005D56;
    --bet-history-load-more-button-border: 0;
    --bet-history-load-more-button-text-color: #fff;
    --bet-history-load-more-button-hover-bg: #007E74;
    --bet-history-load-more-button-active-bg: #003A35;


    /* Header */
    --header-balance-text: #00B8AA;
    --header-currency-symbol-text: #fff;



    /* Miscellaneous */
    --disabled-opacity: 0.5;

    /* Bet Button */
    --bet-form-bet-button-label-font-family: Inter;
    --bet-form-bet-button-value-font-family: Inter;
    --bet-form-bet-button-border-radius: 16px;

    --bet-form-bet-button-variant-bet-bg: #00B8AA;
    --bet-form-bet-button-variant-bet-border: 2px solid #43FFAA;
    --bet-form-bet-button-variant-bet-text: #ffffff;
    --bet-form-bet-button-variant-bet-hover-bg: #00D8C8;
    --bet-form-bet-button-variant-bet-active-bg: #007E74;
    --bet-form-bet-button-variant-bet-hover-border: 2px solid #43FFAA;
    --bet-form-bet-button-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    --bet-form-bet-button-variant-font-family: verdana;
    --bet-form-bet-button-variant-label-font-family: verdana;

    --bet-form-bet-button-variant-cancel-bg: #372360;
    --bet-form-bet-button-variant-cancel-border: 2px solid #6226E3;
    --bet-form-bet-button-variant-cancel-text: #FFF;
    --bet-form-bet-button-variant-cancel-hover-bg: #523A85;
    --bet-form-bet-button-variant-cancel-active-bg: #190C35;
    --bet-form-bet-button-variant-cancel-hover-border: 2px solid #6226E3;


    --bet-form-bet-button-variant-cashout-border: 2px solid #FFFDC3;
    --bet-form-bet-button-variant-cashout-bg: linear-gradient(180deg, #FF84F7 0%,#53FFCB 100%);
    --bet-form-bet-button-variant-cashout-text: #010B1A;
    --bet-form-bet-button-variant-cashout-hover-bg: linear-gradient(180deg, #FFD5FC 0%,#A3FFE3 100%);
    --bet-form-bet-button-variant-cashout-active-bg: linear-gradient(180deg, #FF34F1 0%,#00FFB2 100%);

    /* --bet-form-bet-button-variant-cashedout-bg: MAGENTA;
    --bet-form-bet-button-variant-cashedout-border: 2px solid rgba(210, 252, 255, 0.55);
    --bet-form-bet-button-variant-cashedout-text: #FFF;
    --bet-form-bet-button-variant-cashedout-hover-bg: rgba(32, 30, 35, 0.90);
    --bet-form-bet-button-variant-cashedout-hover-border: 2px solid rgba(210, 252, 255, 0.55);
    --bet-form-bet-button-variant-cashedout-hover-text: #FFF; */

    /* Autoplay */
    --autoplay-header-bg: #1B1C1D;
    --autoplay-section-item-bg: #1B1C1D;

    --autoplay-selection-button-bg: #2C2D30;
    --autoplay-selection-button-border: none;
    --autoplay-selection-button-color: #fff;
    --autoplay-selection-button-hover-bg: #616265;
    --autoplay-selection-button-hover-border: none;
    --autoplay-selection-button-hover-color: #fff;
    --autoplay-selection-button-active-bg: #000000;
    --autoplay-selection-button-active-border: none;
    --autoplay-selection-button-active-color: #fff;

    --autoplay-alert-bg: #2C2D30;
    --autoplay-alert-color: #fff;



    --autoCashout-value-container-bg: #0F0400;

    --bet-form-autoplay-bg: #005D56;
    --bet-form-autoplay-hover-bg: #02A094;
    --bet-form-autoplay-disabled-bg: #005D56;
    --bet-form-autoplay-border: none;
    --bet-form-autoplay-border-radius: 999px;
    --bet-form-autoplay-text: #fff;
    --bet-form-autoplay-active-bg: #372360;
    --bet-form-autoplay-active-border: none;

    --bet-form-autoplay-modal-counter-option-bg: #3B6DB0;
    --bet-form-autoplay-modal-counter-option-border: 1px solid #fff;
    --bet-form-autoplay-modal-counter-option-color: #fff;
    --bet-form-autoplay-modal-counter-option-hover-bg: #00D8C8;
    --bet-form-autoplay-modal-counter-option-active-bg: #00B8AA;
    --bet-form-autoplay-modal-counter-option-selected-bg: #00B8AA;

    --bet-form-autoplay-modal-error-container-bg: #2C2D30;
    --bet-form-autoplay-modal-error-container-text-color: #fff;

    --autoplay-reset-bttn-bg: #D07206;
    --autoplay-reset-bttn-bg-hover: #EF8811;
    --autoplay-reset-bttn-bg-active: #BA6400;
    --autoplay-reset-bttn-text-color: #ffffff;

    --autoplay-submit-bttn-bg: #005D56;
    --autoplay-submit-bttn-bg-hover: #02A094;
    --autoplay-submit-bttn-bg-active: #005D56;
    --autoplay-submit-bttn-text-color: #ffffff;

    --autoplay-modal-item-border: ;
    --autoplay-modal-header-border: ;

    /* Modal */
    --generic-modal-bg: #161718;
    --generic-modal-header-bg: #2C2D30;
    --generic-modal-footer-bg: none;
    --generic-modal-header-text: #fff;
    --round-info-container-bg: #101112;
    --generic-modal-border: none;
    --generic-modal-close-button-bg: #2C2D30;
    --generic-modal-close-button-border: none;
    --generic-modal-close-button-hover-bg: #494A4D;
    --generic-modal-close-button-active-bg: #151516;
    --generic-modal-close-button-color: #fff;

    --bet-history-modal-bg: #1B1C1D;
    --bet-history-modal-border: none;
    --bet-history-modal-header-bg: #2C2D30;

    /* Game Limits Modal */
    --limits-modal-bg: #161718;
    --limits-modal-border: none;
    --limits-modal-color: #161718;
    --limits-modal-value-pill-bg: #005D56;
    --limits-modal-value-pill-color: #FFFFFF;
    --game-limits-item-bg: #101112;
    --game-limits-item-border: none;


    /*Chat*/

    --chat-container-border: none;
    --chat-header-bg: #1B1C1D;
    --chat-message-container-border-bottom: none;
    --chat-gif-picker-container-bg: #292163;
    --chat-emoji-picker-container-bg: #1B1C1D;
    --chat-input-bg: #fff;
    --chat-input-text: #999;
    --chat-picker-border: none;
    --chat-nickname-color: #fff;
    --chat-time-stamp-color: #Fff;
    --chat-container-bg: #1B1C1D;

    /* For Variant 2 with emoji and taunts */
    --chat-accordion-header-bg: #161718;
    --chat-accordion-header-border: none;
    --chat-accordion-header-text: #fff;
    --chat-accordion-border-radius: 5px;

    --chat-accordion-item-bg: #3B6DB0;
    --chat-accordion-item-text: #FFF;
    --chat-accordion-item-border: none;

    --chat-accordion-item-hover-bg: #00D8C8;
    --chat-accordion-item-hover-text: #fff;
    --chat-accordion-item-active-bg: #00B8AA;
    --chat-accordion-item-active-text: #FFF;

    /*Error dialog*/

    --error-dialog-bg: #0E0E0E;
    --error-dialog-border: none;
    --error-dialog-button-bg: #2C2D30;
    --error-dialog-active-button-bg: #2C2D30;
    --error-dialog-button-text-color: #fff;
    --error-dialog-button-active-text-color: #fff;


    /*Cashout Announcer*/
    --cashout-announcer-bg: #101112;
    --cashout-announcer-border: 1px solid #00FFD1;
    --cashout-announcer-wonbox-bg: linear-gradient(180deg, #FF84F7 0%, #53FFCB 100%);
    --cashout-announcer-label-text-color: #010B1A;
    --cashout-announce-outter-box-label-text-color: #00FFB2;
    --cashout-announce-outter-box-value-text-color: #FFFFFF;
    --cashout-announcer-label-icon-color: #FFFFFF;
    --cashout-announcer-close-btn-bg: #2C2D30;

    /* Top Bets */

    /* Multiplier Item */
    --multiplier-item-bg: #101112;
    --multiplier-item-border: none;
    --multiplier-item-text: #FFFFFF;
    --multiplier-item-text-bold: ;
    --multiplier-item-badge-bg: #101112;
    --multiplier-item-highlight-bg: #005D56;
    --multiplier-item-highlight-text: #fff;

    /* Huge Win Item */
    --huge-item-header-bg: #2C2D30;
    --huge-item-header-border: none;
    --huge-item-header-text: #FFFFFF;
    --huge-item-header-text-bold: #fff;
    --huge-item-footer-bg: #1B1C1D;
    --huge-item-footer-border: none;

    /* Big Win Item */
    --big-item-header-bg: #2C2D30;
    --big-item-header-border: none;
    --big-item-header-text: #FFFFFF;
    --big-item-header-text-bold: #fff;
    --big-item-footer-bg: #2C2D30;
    --big-item-footer-border: none;
    --big-item-win-higlighted-bg: #1B1C1D;
    --big-item-win-higlighted-border: none;
    --big-item-win-higlighted-text: #1B1C1D;


    /* Extra Info Strip */
    --extra-info-strip-bg: #181922;


    /* ---- Canvas (read by game/theme.ts, not by the DOM) ---- */
    --canvas-bg: #101010;
    --canvas-bg-alpha: 0;
    --graph-line: linear-gradient(#FF8BFB, #F4F18E, #94D9C6);
    --graph-bg: linear-gradient(#D221C6, #F4F18E, #00FFEE);
    --graph-bg-alpha: 0.3;
    --dots-y: #FF84F7;
    --dots-x: #53FFCB;
    --dots-line: #222;
    --multiplier-crash-fill: linear-gradient(#D221C6, #F4F18E, #00FFEE);
    --multiplier-crashed-label-color: #D221C6;
    --multiplier-wait-color: #02BA80;

    /* ---- Demo background ---- */
    --demo-container-bg: #000000;
    --demo-blend-mode: normal;
    --demo-bg: #000000;
    --demo-stripe-a: #141414;
    --demo-stripe-b: #111111;
    --demo-stripe-from: -5deg;
    --demo-stripe-width: 1.6deg;

    /* Blend modes for the autoplay buttons; the colours themselves are declared
       with the rest of the autoplay palette above. */
    --autoplay-submit-bttn-blend: normal;
    --autoplay-submit-bttn-blend-hover: normal;

    /* ---- Assorted one-offs that used to be hardcoded ---- */
    --chat-header-border: 1px solid #ffffff;
    --chat-online-indicator-bg: #00B8AA;
    --betbutton-cashout-border: #FFFDC3;
    --betbutton-cancel-border: #6226E3;
    --debug-toggle-bg: #007E74;
    --history-open-btn-active-color: #00B8AA;
    --round-details-value-bg: #1B1C1D;
    --avatar-selected-border-color: #00B8AA;
    --roundinfo-dot-bg: #101112;

    /* ---- Header logo ---- */
    --header-logo-width: 142px;
    --header-logo-width-mobile: 138px;
    --header-logo-height: auto;
    --header-logo-margin: 12px;
    --header-logo-margin-mobile: 6px;

    /* ---- Cashout toast geometry ---- */
    --cashout-announcer-width: 320px;
    --cashout-announcer-min-width: 0;
    --cashout-announcer-max-width: calc(100vw - 16px);
    --cashout-announcer-min-height: 58px;
    --cashout-announcer-radius: 999px;
    --cashout-announcer-padding: 7px 10px 7px 22px;
    --cashout-announcer-gap: 10px;
    --cashout-announcer-wonbox-width: 142px;
    --cashout-announcer-wonbox-min-height: 44px;
    --cashout-announcer-wonbox-padding: 6px 12px;
    --cashout-announcer-wonbox-gap: 1px;
    --cashout-announcer-wonbox-radius: 999px;
    --cashout-announcer-label-weight: 500;
    --cashout-announcer-value-size: 22px;
    --cashout-announcer-value-weight: 700;
    --cashout-announcer-close-size: 28px;
    --cashout-announcer-close-icon-size: 14px;

    .modal-variant1 {
        --generic-modal-bg: #1B1C1D;
        --generic-modal-header-bg: #2C2D30;
        --generic-modal-footer-bg: #2C2D30;
    }

    .modal-variant2 {
        --generic-modal-bg: #1B1C1D;
        --generic-modal-header-bg: #2C2D30;
        --generic-modal-footer-bg: #2C2D30;
    }
}