:root {
    --ff-primary: -apple-system, BlinkMacSystemFont, sans-serif;
    --theme-primary: #1f4d3e;
    --theme-secondary: #14805e;
    --theme-tertiary: #0b3d2e;
    --theme-accent: #47ca9f;
    --theme-accent-2: #ffdf1b;

    --theme-body: #eee;
    --theme-background: #282828;
    --theme-bg-faded: rgba(40,40,40,0.2);
    --theme-surface: #1f1f1f;
    --theme-surface-2: #333333;
    --theme-surface-contrast: #dcdcdc;
    --theme-border: rgba(255, 255, 255, 0.12);
    --theme-border-weak: rgba(255, 255, 255, 0.08);

    --theme-gradient-1: linear-gradient(180deg, #1f4d3e 0%, #282828 60px);
    --theme-gradient-2: linear-gradient(160deg, #364D3C 0%, #383838 400px);
    --theme-gradient-3: linear-gradient(126deg, #404a47, #444);
    --theme-gradient-4: linear-gradient(rgba(12, 22, 20, 0.1), transparent 20px),
                        radial-gradient(122% 370px at center -220px, rgb(0, 153, 105) 0px, transparent 100%),
                        linear-gradient(to right bottom, rgb(12, 22, 20), rgb(8, 68, 54));

    --theme-success: #00881b;
    --theme-error: #a10606;
    --theme-info: #1361d5;
    --theme-alert: #df9e3c;

    /* =========================
       Button intents (for easier branding manipulation)
       ========================= */
    --btn-primary-bg: #14805e;
    --btn-primary-text: white;
    --btn-primary-bg-hover: #3ecc9f;
    --btn-primary-text-hover: black;

    --btn-secondary-bg: #b1b1b1;
    --btn-secondary-text: black;
    --btn-secondary-bg-hover: #bdbdbd;
    --btn-secondary-text-hover: black;

    --btn-tertiary-bg: linear-gradient(0deg, #009869 0%, #00BF84 100%);
    --btn-tertiary-text: white;
    --btn-tertiary-bg-hover: linear-gradient(0deg, #00A873 0%, rgb(0, 255, 174) 100%);
    --btn-tertiary-text-hover: white;

    /* =========================
       Coupon theming
       ========================= */
    --coupon-bg: #005440;    /* Coupon main background */
    --coupon-text: white; /* Coupon text color */
    --coupon-accent: #00A873;    /* Coupon accent */

    /* =========================
       Decorative vars
       ========================= */
    --theme-deco-1: linear-gradient(0deg, #00A873 0%, #005440 50%, #00BF84 100%);

    /* =========================
       Event Tables Schema
       ========================= */
    --theme-market-btn-bg: transparent;
    --theme-market-btn-body: var(--theme-accent-2);
    --theme-market-btn-bg-hover: rgba(255, 255, 255, 0.26);
    --theme-market-btn-body-hover: var(--theme-accent);
    --theme-market-btn-bg-active: #fff;
    --theme-market-btn-body-active: var(--theme-accent);
    --theme-market-btn-border-color: transparent;

    --theme-score-bg: rgba(255, 255, 255, 0.2);
    --theme-score-body: white;

    /* ===========================
       Event-specific tokens
       =========================== */
    --event-text-xs: 9px;
    --event-text-normal: 400;
    --event-text-bold: 700;
    --event-leading: 1.5;

    /* =========================
       Header Palette Schema
       ========================= */
    --header-bg: linear-gradient(180deg, #1F4A3C 7.5%, #223D35 92.5%);
    --header-body: var(--theme-body);
    --header-accent: var(--theme-accent);

    /* =========================
       Search Palette Schema
       ========================= */
    --search-bg: #191919;
    --search-body: var(--color-body);
    --search-placeholder: var(--color-body);

    /* =========================
       Skeleton Schema
       ========================= */
    --theme-skeleton-bg: rgba(255, 255, 255, 0.08);
    --theme-skeleton-shimmer: rgba(255, 255, 255, 0.12);

    /* =========================
       Swiper Styles Schema
       ========================= */
    --theme-swiper-bullet: rgba(255, 255, 255, 0.5);
    --theme-swiper-bullet-active: var(--theme-accent);
}

/* Match Bet */
match-bet .bet-button .label {
    color: white;
}

match-bet .bet-button.selected .label {
    color: black;
}

/* =========================
   Section Title
   ========================= */
.section-title {
    padding: .5rem;
}

/* =========================
   Sports-specific gradients
   ========================= */
[data-sport-bg="football"] {
    --sport-gradient: linear-gradient(160deg, #364d3c 0%, #383838 400px);
}

[data-sport-bg="basketball"] {
    --sport-gradient: linear-gradient(160deg, #4d4432 0%, #383838 400px);
}

[data-sport-bg="tennis"] {
    --sport-gradient: linear-gradient(160deg, #3f4d32 0%, #383838 400px);
}

[data-sport-bg="volleyball"],
[data-sport-bg="beach_volleyball"],
[data-sport-bg="beach-volleyball"] {
    --sport-gradient: linear-gradient(160deg, #4d4032 0%, #383838 400px);
}

[data-sport-bg="table_tennis"],
[data-sport-bg="table-tennis"] {
    --sport-gradient: linear-gradient(160deg, #36414d 0%, #383838 400px);
}

[data-sport-bg="ice_hockey"],
[data-sport-bg="ice-hockey"] {
    --sport-gradient: linear-gradient(160deg, #36444d 0%, #383838 400px);
}

[data-sport-bg="darts"] {
    --sport-gradient: linear-gradient(160deg, #4d2725 0%, #383838 400px);
}

[data-sport-bg="futsal"] {
    --sport-gradient: linear-gradient(160deg, #36434d 0%, #383838 400px);
}

[data-sport-bg="handball"] {
    --sport-gradient: linear-gradient(160deg, #24566f 0%, #383838 400px);
}

[data-sport-bg="badminton"] {
    --sport-gradient: linear-gradient(160deg, #36484D 0%, #383838 400px);
}

/* =========================
   Sports-specific accent colors
   ========================= */
[data-sport-accent="favourites"] {
    --sport-accent: 2px solid #b6b6b6;
}

[data-sport-accent="football"] {
    --sport-accent: 2px solid #80ffb0;
}

[data-sport-accent="basketball"] {
    --sport-accent: 2px solid #ffb000;
}

[data-sport-accent="tennis"] {
    --sport-accent: 2px solid #b8ff6e;
}

[data-sport-accent="volleyball"],
[data-sport-accent="beach_volleyball"],
[data-sport-accent="beach-volleyball"] {
    --sport-accent: 2px solid #ffd682;
}

[data-sport-accent="table-tennis"],
[data-sport-accent="table_tennis"] {
    --sport-accent: 2px solid #72c2ff;
}

[data-sport-accent="ice-hockey"],
[data-sport-accent="ice_hockey"] {
    --sport-accent: 2px solid #4dbdf5;
}

[data-sport-accent="darts"] {
    --sport-accent: 2px solid #6bbbf5;
}

[data-sport-accent="futsal"] {
    --sport-accent: 2px solid #acdcf8;
}

[data-sport-accent="handball"] {
    --sport-accent: 2px solid #ec7971;
}

[data-sport-accent="badminton"] {
    --sport-accent: 2px solid #7bd8f3;
}

[data-sport-accent="baseball"] {
    --sport-accent: 2px solid #f89057
}

[data-sport-accent="snooker"] {
    --sport-accent: 2px solid #7ef6a3
}

[data-sport-accent="cricket"] {
    --sport-accent: 2px solid #d0ec77
}

[data-sport-accent="counter-strike-go"],
[data-sport-accent="counter_strike_go"] {
    --sport-accent: 2px solid #4064f5
}

[data-sport-accent="dota-2"] {
    --sport-accent: 2px solid #fa3e3e
}

/* =====================
   Sticky observer
   ===================== */
.is-sticky {
    background-color: #3c3c3c;
}