:root {
    /*global font*/
    --c-font: 'IBM Plex Sans';
    --c-font:'Pangram Sans';
    --c-font-condensed:'Pangram Sans Condensed';
    /*  */
    /*Logo - l*/
    --c-logo-size: 145px;
    --c-logo-size-mobile: 110px;
    /*  */

    /* Sizes - s */
    --s-x8: calc(var(--s-x) / 8);
    --s-x4: calc(var(--s-x) / 4);
    --s-x2: calc(var(--s-x) / 2);
    --s-x: 8px;
    --s-2x: calc(var(--s-x) * 2);
    --s-3x: calc(var(--s-x) * 3);
    --s-4x: calc(var(--s-x) * 4);
    --s-5x: calc(var(--s-x) * 5);
    --s-6x: calc(var(--s-x) * 6);
    --s-7x: calc(var(--s-x) * 7);
    --s-8x: calc(var(--s-x) * 8);
    --s-10x: calc(var(--s-x) * 10);
    --c-header-top: var(--s-8x);
    --c-header-bottom: var(--s-5x);
    --c-header-mobile: var(--s-7x);
    --c-bottom-navbar: var(--s-8x);
    --s-col: 180px;
    --s-col-gap: var(--s-x);
    --s-col-pad: var(--s-x);
    
    /* Button Height */
    --s-button-h-xs: var(--s-43x);
    --s-button-h-s: var(--s-4x);
    --s-button-h: var(--s-5x);
    --s-button-h-l: var(--s-6x);
    --s-button-h-xl: var(--s-7x);
    --s-ddl-button-h: var(--s-5x);
    --s-ddl-button-w: 120px;
    --s-ddl-item-h:var(--s-5x);
    --s-input-h-l: var(--s-5x);
    --s-betslip-input-w: 100px;
    /*  */
    /*Sidebars */
    --c-l-sidebar-min: 240px;
    --c-l-sidebar-max: 240px;
    --c-l-sidebar-live-min: 280px;
    --c-l-sidebar-live-max: 280px;
    --c-l-collapsed-sidebar-min: 58px;
    --c-l-collapsed-sidebar-max: 60px;
    --c-r-sidebar-min: 360px;
    --c-r-sidebar-max: 360px;
    --c-r-collapsed-sidebar-min: 40px;
    --c-r-collapsed-sidebar-max: 40px;
    --c-l-u-collapsed-sidebar-min: 50px;
    --c-l-u-collapsed-sidebar-max: 50px;
    --c-r-expand-sidebar-max: 550px;
    --c-r-expand-sidebar-min: 550px;
    /*  */
    /*  Icons  */
    --c-icon-width: 24px;
    --icon-font: normal normal normal 24px/24px BIF;
    
    /*  */
    /*  Colours  */
    --c-f: rgba(255, 255, 255, 0.8);
    --c-f-e: rgba(255, 255, 255, 1);
    --c-f-s: rgba(255, 255, 255, 0.5);
    --c-f-d: rgba(255, 255, 255, 0.3);
    --c-f-x: rgba(255, 255, 255, 0.1);
    --c-f-b: rgba(255, 255, 255, 0.02);
    --c-o4: rgba(255,255,255,0.9);
    --c-background: #232426;
    /*  */
    /*  Colour Overlays  */
    --c-o: rgba(255, 255, 255, 0.06);
    --c-o1: rgba(255, 255, 255, 0.12);
    --c-o2: rgba(255, 255, 255, 0.20);
    --c-o3: rgba(255, 255, 255, 0.30);
    --c-oi: rgba(0, 0, 0, 0.06);
    --c-o1i: rgba(0, 0, 0, 0.12);
    --c-o2i: rgba(0, 0, 0, 0.20);
    --c-o3i: rgba(0, 0, 0, 0.30);
    /*  */
    /*  Colour Solid  */
    --c-s-white: rgba(255, 255, 255, 0.8);
    --c-s-white-e: rgb(255, 255, 255);
    --c-s-white-s: rgba(255, 255, 255, 0.5);
    --c-s-black: rgba(0, 0, 0, 0.8);
    --c-s-black-e: rgba(0, 0, 0);
    --c-s-black-s: rgba(0, 0, 0, 0.5);
    /*  */
    /*  BORDER = b  */
    --b: solid 1px var( --c-tint);
    --b-i: solid 1px var( --c-shade);
    /*  */
    /*  BORDER RADIUS = r */
    --r: 10px;
    --r-x2: calc(var( --r) * 2);
    --r-x3: calc(var( --r) * 3);
    --r-d2: calc(var( --r) / 2);
    --r-t: var( --r) var(--r) 0 0;
    --r-b: 0 0 var( --r) var(--r);
    --r-r: 0 var( --r) var(--r) 0;
    --r-l: var( --r) 0 0 var(--r);
    --r-t-x2: var( --r-x2) var(--r-x2) 0 0;
    --r-b-x2: 0 0 var( --r-x2) var(--r-x2);
    --r-r-x2: 0 var( --r-x2) var(--r-x2) 0;
    --r-l-x2: var( --r-x2) 0 0 var(--r-x2);
    --r-t-x3: var( --r-x3) var(--r-x3) 0 0;
    --r-b-x3: 0 0 var( --r-x3) var(--r-x3);
    --r-r-x3: 0 var( --r-x3) var(--r-x3) 0;
    --r-l-x3: var( --r-x3) 0 0 var(--r-x3);
    /*  */
    /*   BOX SHADOW = x   */
    --x-surface: inset 0 16px 16px -12px #ffffff1f, inset 0 1.75px 0 #ffffff0f, 0 0 2px 1px #0000001f;
    --x-surface-ns: inset 0 16px 16px -12px #ffffff1f, inset 0 1.75px 0 #ffffff0f;
    --x-surface-b: inset 0 2px 2px #ffffff0a, 0 0 1px 1px #0000001f;
    --x-surface-c: inset 0 2px 0 #ffffff17, 0 0 1px 1px #0000001f;
    --x-surface-d: inset 0 1px 0 #ffffff17, 0 0 1px 1px #0000001f;
    --x-surface-i: 0 1.75px 0 #ffffff0f, inset 0 0 1.25px 1.25px #0000001f;
    --x-d-b: 0 1px 0 rgb(255 255 255 / 0.04),inset 0 -1px 0 rgb(0 0 0 / 0.16);
    --x-d-b2: inset 0 -1px 0 rgb(255 255 255 / 0.08);
    --x-d-b3: inset 0 -1px 0 rgb(0 0 0 / 0.16);
    --x-d-t: inset 0 1px 0 rgb(255 255 255 / 0.04), 0 -1px 0 rgb(0 0 0 / 0.16);
    --x-d-t1: inset 0 1px 0 rgb(255 255 255 / 0.08), 0 -1px 0 rgb(0 0 0 / 0.32);
    --x-d-t2: inset 0 1px 0 rgb(255 255 255 / 0.08);
    --x-d-t3: inset 0 1px 0 rgb(0 0 0 / 0.08);
    --x-s: inset 0 1px 0px rgb(255 255 255 / 2%), 0 6px 6px -4px rgb(0 0 0 / 0.2);
    --x-s-light: inset 0 1px 0px rgb(255 255 255 / 2%), 0 1px 1px 0px rgb(0 0 0 / 0.07);
    --x-b: 0px -6px 6px -4px rgb(255 255 255 / 16%), 0px 2px 6px 2px rgb(0 0 0 / 10%);
    --x-outline: inset 0 0 0 1px rgb(255 255 255 / 5%), 0 0 0 1px rgb(0 0 0 / 10%);
    --x-button-m-n: 0px 2px 6px 2px rgb(0 0 0 / 10%), inset 0 1px 1px 0 rgb(255 255 255 / 50%);
    --x-button-m-h: 0 2px 6px 2x var( --o-green-a), inset 0 1px 1px 0 rgb(255 255 255 / 50%);
    --x-button-m2-n: 0px 2px 6px 2px rgb(0 0 0 / 10%), inset 0 1px 1px 0 rgb(255 255 255 / 30%);
    --x-button-m2-h: 0 2px 6px 2x var( --o-primary-c), inset 0 1px 1px 0 rgb(255 255 255 / 30%);
    /*  */
    /*   GRADIENTS   */
    --g-4: linear-gradient(-15deg,rgba(0, 0, 0, 0.5) 00%,rgba(0, 0, 0, 0)80%);
    --g-3: linear-gradient(180deg, rgba(0, 0, 0, 0.50) 1000%, rgba(0, 0, 0, 0) 0%);
    --g-2i: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.15) 80%);
    --g-2: linear-gradient(0deg, rgba(0, 0, 0, 0.33) 0%, rgba(0, 0, 0, 0) 67.67%);
    --g-1: linear-gradient(180deg, rgba(0, 0, 0, 0.08) 1000%, rgba(0, 0, 0, 0) 0%);
    --g-1i: linear-gradient(0deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 67.67%);
    --g-0: linear-gradient(180deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 67.67%);
    --g-shine: radial-gradient( rgba(255, 255, 255, 0.5) 0%,rgba(255, 255, 255, 0.15) 49%,rgba(255, 255, 255, 0.0) 50%,rgba(255, 255, 255, 0.15) 100%);
    --g-shine-b: radial-gradient( rgba(255, 255, 255, 0.25) 0%,rgba(255, 255, 255, 0.08) 49%,rgba(255, 255, 255, 0.0) 50%,rgba(255, 255, 255, 0.08) 100%);
    --g-shine-c: linear-gradient( rgba(255, 255, 255, 0.25) 0%,rgba(255, 255, 255, 0.08) 49%,rgba(255, 255, 255, 0.0) 51%,rgba(255, 255, 255, 0.08) 100%);
    --o-primary-button-default-background: linear-gradient( 136.64deg, rgba(255, 255, 255, 0.12) 12.24%, rgba(0, 0, 0, 0.12) 85.88% );
    --o-primary-button-pressed-background: linear-gradient( 136.64deg, rgba(255, 255, 255, 0) 12.24%, rgba(255, 255, 255, 0.3) 85.88% );
    --o-large-default-primary-button-style: 0px 0px 0px 1px rgba(0, 0, 0, 0.25), -2px -2px 10px rgba(255, 255, 255, 0.2), 3px 3px 10px 2px rgba(0, 0, 0, 0.2), inset 2px 2px 0.5px rgba(255, 255, 255, 0.3), inset -2px -2px 0.2px rgba(0, 0, 0, 0.25);
    --o-small-default-primary-button-style: 0px 0px 0px 1px rgba(0, 0, 0, 0.25), -2px -2px 10px rgba(255, 255, 255, 0.2), 3px 3px 10px 2px rgba(0, 0, 0, 0.2), inset 2px 2px 2px rgba(255, 255, 255, 0.3), inset -2px -2px 2px rgba(0, 0, 0, 0.25);
    --o-large-pressed-primary-button-style: 0px 0px 0px 1px rgba(0, 0, 0, 0.25), -2px -2px 10px rgba(255, 255, 255, 0.2), 3px 3px 10px 2px rgba(0, 0, 0, 0.2), inset 1px 1px 2px 1px rgba(0, 0, 0, 0.4), inset 0px 0px 20px 10px rgba(255, 255, 255, 0.25);
    --o-small-pressed-primary-button-style: 0px 0px 0px 1px rgba(0, 0, 0, 0.25), -2px -2px 10px rgba(255, 255, 255, 0.2), 3px 3px 10px 2px rgba(0, 0, 0, 0.2), inset 1px 1px 2px 1px rgba(0, 0, 0, 0.4), inset 0px 0px 20px 10px rgba(255, 255, 255, 0.25);
    --o-large-disabled-primary-button-background: linear-gradient( 136.64deg, rgba(0, 0, 0, 0) 12.24%, rgba(150, 138, 138, 0.14) 85.88% ), var( --o-grey-1);
    --o-large-disabled-primary-button-style: 0px 0px 0px 1px rgba(0, 0, 0, 0.25), -2px -2px 10px rgba(255, 255, 255, 0.2), 3px 3px 10px 2px rgba(0, 0, 0, 0.2);
    --o-secondary-button-default-background: radial-gradient( 109.55% 137.67% at 16.67% -23.17%, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100% );
    --o-secondary-button-default-style: -2px -2px 10px rgba(255, 255, 255, 0.2), 3px 3px 10px 2px rgba(0, 0, 0, 0.2), inset 2px 2px 0.5px rgba(255, 255, 255, 0.1), inset -2px -2px 0.5px rgba(0, 0, 0, 0.1);
    --o-secondary-button-pressed-background: radial-gradient(109.55% 137.67% at 16.67% -23.17%, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
    --o-secondary-button-pressed-style: 0px 0px 0px 1px rgba(0, 0, 0, 0.35), -2px -2px 10px rgba(255, 255, 255, 0.2), 3px 3px 10px 2px rgba(0, 0, 0, 0.2), inset 1px 1px 2px rgba(0, 0, 0, 0.15), inset 2px 2px 6px 5px rgba(0, 0, 0, 0.1), inset 2px 2px 0px rgba(20, 20, 20, 0.1), inset -2px -2px 0px rgba(0, 0, 0, 0.05);
    --o-secondary-button-disabled-background: linear-gradient(136.64deg, rgba(0, 0, 0, 0.1) 12.24%, rgba(255, 255, 255, 0.1) 85.88%);
    --o-secondary-button-disabled-style: 0px 0px 0px 1px rgba(0, 0, 0, 0.25), -2px -2px 10px rgba(255, 255, 255, 0.2), 3px 3px 10px 2px rgba(0, 0, 0, 0.2);
    --o-style-surface: linear-gradient(161.82deg, rgba(255, 255, 255, 0.08) 3.77%, rgba(255, 255, 255, 0) 89.07%);
    --g-headers: linear-gradient(90deg, rgba(255, 255, 255, 0%) 0%, rgba(0, 0, 0, 0%) 50%, rgba(0, 0, 0, 20%) 100%);
    /*  */
    /*  Customer Colours */
    --o-primary: #2c2f32;
    --o-primary-a: #31373a;
    --o-primary-b: #3b4044;
    --o-primary-c: #4c5257;
    --o-primary-d: #5a6268;
    /*  Scrollbar    */
    --sb-thumb-color: var( --c-o1);
    --sb-thumb-transition: height ease-in 50ms,width ease-out 50ms;
    --scrollbar-size: 5px;
    --scrollbar-border-radius: 7px;
    --scrollbar-padding: 4px;
    --sb-width: 4px;
    /*  */
    /*  ThV - lets try and elliminate most primary colors and leave 3 behind. I mostly use primary and primary-c  */
    --o-blue-a: #00A3E0;
    --o-blue-b: #0077c8;
    --o-blue-c: #004b87;
    --o-blue-d: #002142;
    --o-green-a: #84BD00;
    --o-green-b: #4C8C2B;
    --o-green-c: #046A38;
    --o-red-a: #DC4405;
    --o-red-b: #CB333B;
    --o-yellow: #ffc800;
    --o-orange: #ea7137;
    --a-teal-dark: #1d4757;
    --a-teal-dark-hover: #285769;
    /*Featured Colors*/
    --f-promotions: #fcce3f;
    --f-promotions-2: #fcce3f;
    --f-betbuilder: #0077c8;
    --f-outrights: #f78030;
    --f-livestream: #4C8C2B;
    --f-favorites: var(--o-yellow);
    --f-popular: #0060cd;
    --f-suggested: #ddb400;
    /*  */
    /* SemiTransparent Sports Header Background Colors     */
    --hc-blue-a: rgb(51 86 102);
    --hc-blue-b: rgb(50 76 97);
    --hc-blue-c: rgb(49 66 81);
    --hc-green-a: rgb(75 91 61);
    --hc-green-b: rgb(64 81 63);
    --hc-green-c: rgb(44 67 61);
    --hc-red-a: rgb(96 65 59);
    --hc-red-b: rgb(92 61 66);
    --hc-yellow: rgb(104 90 63);
    --hc-orange: rgb(111 81 67);
    /*Dropdown Solid Colors*/
    --o-dark: 0,0,0;
    --o-light: 255,255,255;
    --o-dark-shadow: 0 0 0;
    --o-light-shadow: 255 255 255;
    /*  */
    /* Allwyn Tokens */
    --aw-teal-dark: #1d4757;
    --aw-teal-dark-hover: #1d4757;
    --aw-cyan-grey: #c3cfd1;
    --aw-turquoise: hsl(172.94deg 76.33% 51.96%);
    --aw-turquoise-dark: #16a695;
    --aw-turquoise-hover: hsl(172.94deg 76.33% 70%);
    --aw-turquoise-disabled: hsl(172.94deg 76.33% 46%);
    --aw-green: #16a695;
    --aw-text-dark: rgba(0, 0, 0, 0.8);
    --aw-text-dark-e: rgba(0, 0, 0, 1);
    --aw-text-dark-s: rgba(0, 0, 0, 0.5);
    --aw-text-dark-d: rgba(0, 0, 0, 0.3);
    --aw-text-light: rgba(255, 255, 255, 0.8);
    --aw-text-light-e: rgba(255, 255, 255, 1);
    --aw-text-light-s: rgba(255, 255, 255, 0.5);
    --aw-text-light-d: rgba(255, 255, 255, 0.3);
    --aw-background: var(--c-background);
    --aw-primary: var(--aw-teal-dark);
    --aw-primary-hover: var(--aw-teal-dark-hover);
    --aw-emphasis: var(--aw-turquoise);
    --aw-emphasis-hover: var(--aw-turquoise-hover);
    --aw-filter-border-selected: 1px solid var(--aw-turquoise);
    --aw-filter-background-selected: var(--aw-coupon-live);
    --aw-button-primary: var(--aw-turquoise);
    --aw-button-primary-hover: var(--aw-turquoise-hover);
    --aw-button-primary-disabled: var(--aw-turquoise-disabled);
    --aw-label-button-primary: var(--aw-text-dark);
    --aw-label-button-primary-hover: var(--aw-text-dark-e);
    --aw-label-button-primary-disabled: var(--aw-text-dark-d);
    --aw-font-button-primary: normal 700 14px / 40px var(--c-font);
    --aw-button-secondary: transparent;
    --aw-button-secondary-hover: transparent;
    --aw-button-secondary-border: 1px solid var(--aw-emphasis);
    --aw-label-button-secondary: var(--aw-text-light);
    --aw-label-button-secondary-hover: var(--aw-text-light-e);
    --aw-font-weight-button-secondary: normal 700 14px / 40px var(--c-font);
    --aw-live: var(--aw-turquoise);
    --aw-coupon-selection: var(--aw-turquoise);
    --aw-coupon-selection-hover: var(--aw-turquoise-hover);
    --aw-text-coupon-selection: var(--aw-primary);
    --aw-coupon-pregame: var(--o-primary);
    --aw-coupon-sportheader-pregame: var(--o-primary);
    --aw-coupon-subheader-pregame: var();
    --aw-coupon-subheader-pregame: var(--o-primary-a);
    --aw-coupon-live: var(--o-primary-a);
    --aw-coupon-sportheader-live: var(--o-primary-a);
    --aw-coupon-subheader-live: var(--o-primary-b);
    --aw-coupon-events-live: var(--o-primary);
    --aw-betslip-selection: var(--o-primary-b);
    --aw-betslip-tab-selected: var(--o-primary-a);
    --aw-betslip-acca: var(--o-primary-c);
    --aw-text: var(--aw-text-light);
    --aw-text-e: var(--aw-text-light-e);
    --aw-text-s: var(--aw-text-light-s);
    --aw-text-d: var(--aw-text-light-d);

    /* Font Styles */
    --aw-font-weight-button-primary: 600;
    --aw-font-weight-button-secondary: 500;
    --aw-font-coupon-header: 700 1.2em/48px var(--c-font);
    --aw-font-coupon-sportheader: 600 18px/24px var(--c-font);
    --aw-font-coupon-subheader: 500 14px/18px var(--c-font);
    --aw-font-coupon-market-subheader: 500 14px/18px var(--c-font);
    --aw-font-coupon-subheader-mobile: 500 12px/14px var(--c-font);
    --aw-text-betslip-event: 500 1rem / 15px var(--c-font);
    --aw-text-betslip-selection: 500 12px / 15px var(--c-font);
    --aw-text-betslip-odds: 600 14px / 20px var(--c-font);
    --aw-chip-background-selected: var(--o-primary-a);
    --aw-chip-border-selected: 2px solid var(--o-primary-a);
    --aw-chip-background: transparent;
    --aw-chip-border: 2px solid var(--o-primary-a);
    --aw-carousel-selected: var(--aw-coupon-selection);
    --aw-text-carousel-selected: var(--aw-text-dark);

    /* Input Boxes */
    --aw-input-font: 600 16px/18px var(--c-font);
    --aw-input-border: 1px solid var(--c-o1i);
    --aw-input-border-value: 1px solid var(--c-o1);
    --aw-input-border-hover: 1px solid var(--c-o2);
    --aw-input-border-focus: 1px solid var(--c-o3);
    --aw-input-background: var(--c-o2i);
    --aw-input-background-value: var(--c-o2i);
    --aw-input-background-hover: var(--c-o2i);
    --aw-input-background-focus: var(--c-o3i);
    --aw-betbuilder: var(--aw-button-primary);
    --aw-action: #53a336;

    /* Separators */
    --aw-separator-s: 1px solid var(--c-o1i);
    --aw-separator-m: 1px solid var(--c-o2i);
    --aw-separator-l: 2px solid var(--c-o3i);
}

.theme-light {
    --c-background: hsl(220 9% 76%);
    --o-primary: hsl(220 6% 86% / 1);
    --o-primary-a: hsl(220deg 3% 92%);
    --o-primary-b: hsl(220deg 0% 96%);
    --o-primary-c: hsl(0deg 0% 100%);
    --c-f: rgb(0 0 0 / 75%);
    --c-f-e: #000000;
    --c-f-d: rgb(0 0 0 / .33);
    --c-f-s: rgb(0 0 0 / .61);
    --c-f-x: rgb(0 0 0 / .1);
    --c-f-b: rgb(0 0 0 / .2);
    --o-yellow: #ffc800;
    /*      */
    --f-promotions-2: #c19804;
    --c-o: hsl(220deg 20% 86% / 10%);
    --c-o1: hsl(220deg 20% 86% / 20%);
    --c-o2: hsl(220deg 20% 100% / 28%);
    --c-o3: hsl(220deg 20% 100% / 36%);
    --c-oi: hsl(220deg 90% 15% / 4%);
    --c-o1i: hsl(220deg 90% 15% / 8%);
    --c-o2i: hsl(220deg 90% 15% / 12%);
    --c-o3i: hsl(220deg 90% 15% / 16%);
    /*     */
    --o-green-a: #5d8c3b;
    --o-green-b: #598738;
    --o-green-c: #046A38;
    --o-blue-a: #008fd6;
    --o-blue-b: #006bb3;
    --o-blue-c: #004b87;
    /*     */
    --hc-blue-a: hsl(200deg 100% 90%);
    --hc-blue-b: hsl(200deg 100% 82%);
    --hc-blue-c: hsl(200deg 100% 74%);
    --hc-green-a: hsl(106deg 60% 88%);
    --hc-green-b: hsl(112deg 60% 82%);
    --hc-green-c: hsl(120deg 60% 74%);
    --hc-red-a: hsl(8deg 100% 92%);
    --hc-red-b: hsl(350deg 100% 87%);
    --hc-yellow: hsl(45deg 100% 81%);
    --hc-orange: hsl(36deg 100% 80%);
    /*     */
    --x-surface: inset 0 16px 16px -12px rgb(255 255 255 / 12%), inset 0 1.75px 0 rgb(255 255 255 / 6%), 0 0 2px 1px rgb(0 0 0 / 8%);
    --x-surface-ns: inset 0 16px 16px -12px rgb(255 255 255 / 12%), inset 0 1.75px 0 rgb(255 255 255 / 6%);
    --x-surface-b: inset 0 2px 0 rgb(255 255 255 / 6%), 0 0 1px 1px rgb(0 0 0 / 8%);
    --x-surface-c: inset 0 2px 0 rgb(255 255 255 / 18%), 0 0 1px 1px rgb(0 0 0 / 8%);
    --x-surface-c-i: inset 0 2px 0 rgb(255 255 255 / 0%),inset 0 0 1px 1px rgb(0 0 0 / 16%);
    --x-d-t: 0 -1px 0 rgb(0 0 0 / 14%),inset 0 1px 0 rgb(255 255 255 / 30%);
    --g-3: linear-gradient(180deg, rgba(0, 0, 0, 0.20) 1000%, rgba(0, 0, 0, 0) 0%);
    --g-2: linear-gradient(0deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 67.67%);
    --g-2i: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.15) 80%);
    --g-1: linear-gradient(180deg, rgba(0, 0, 0, 0.03) 1000%, rgba(0, 0, 0, 0) 0%);
    --g-1i: linear-gradient(0deg, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0) 67.67%);
    --g-0: linear-gradient(180deg, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0) 67.67%);
    --g-headers: linear-gradient(90deg, rgb(255 255 255 / 40%) 0%, rgb(255 255 255 / 20%) 50%, rgba(255, 255, 255, 0%) 100%);
    /* Allwyn Tokens - Light Theme */
    --aw-teal-dark: hsl(196.55deg 50% 22.75%);
    --aw-teal-dark-hover: hsl(196.55deg 50% 26%);
    --aw-teal-dark-disabled: hsl(196.55deg 50% 36%);
    --aw-cyan-grey: #c3cfd1;
    --aw-turquoise: hsl(172.94deg 76.33% 51.96%);
    --aw-turquoise-dark: #19bda9;
    --aw-turquoise-hover: hsl(172.94deg 76.33% 70%);
    --aw-turquoise-disabled: hsl(172.94deg 76.33% 46%);
    --aw-background: var(--aw-cyan-grey);
    --aw-primary: var(--aw-teal-dark);
    --aw-primary-hover: var(--aw-teal-dark-hover);
    --aw-primary-disabled: var(--aw-teal-dark-disabled);
    --aw-emphasis: var(--aw-primary);
    --aw-emphasis-hover: var(--aw-primary-hover);
    --aw-button-primary: var(--aw-primary);
    --aw-button-primary-hover: var(--aw-primary-hover);
    --aw-button-primary-disabled: var(--aw-primary-disabled);
    --aw-label-button-primary: var(--aw-text-light);
    --aw-label-button-primary-hover: var(--aw-text-light-e);
    --aw-label-button-primary-disabled: var(--aw-text-light-d);
    --aw-button-secondary: transparent;
    --aw-button-secondary-hover: transparent;
    --aw-button-secondary-border: 1px solid var(--aw-emphasis);
    --aw-label-button-secondary: var(--aw-text-dark);
    --aw-label-button-secondary-hover: var(--aw-text-dark-e);
    --aw-label-button-secondary-disabled: var(--aw-text-dark-d);
    --aw-live: var(--aw-teal-dark);
    --aw-coupon-selection: var(--aw-primary);
    --aw-coupon-selection-hover: var(--aw-primary-hover);
    --aw-text-coupon-selection: var(--aw-label-button-primary);
    --aw-coupon-pregame: var(--o-primary-a);
    --aw-coupon-sportheader-pregame: var(--o-primary-a);
    --aw-coupon-subheader-pregame: var(--o-primary-a);
    --aw-coupon-events-pregame: var(--o-primary-b);
    --aw-coupon-live: var(--o-primary-b);
    --aw-coupon-sportheader-live: var(--o-primary-b);
    --aw-coupon-subheader-live: var(--o-primary-c);
    --aw-coupon-events-live: var(--o-primary-c);
    --aw-text: var(--aw-text-dark);
    --aw-text-e: var(--aw-text-dark-e);
    --aw-text-s: var(--aw-text-dark-s);
    --aw-text-d: var(--aw-text-dark-d);
    --aw-carousel-selected: var(--o-primary-c);
    --aw-text-carousel-selected: var(--aw-text-dark);
}

.theme-light .sports-coupon {
    --o-green-b: #62b300;
    --o-green-a: #4C8C2B;
    --o-green-c: #046A38;
}

@media (prefers-color-scheme: light) {
    .theme-auto {
        --c-background: hsl(220 9% 76%);
        --o-primary: hsl(220deg 6% 84%);
        --o-primary-a: hsl(220deg 3% 92%);
        --o-primary-b: hsl(220deg 0% 96%);
        --o-primary-c: hsl(0deg 0% 100%);
        --c-f: rgb(0 0 0 / 75%);
        --c-f-e: #000000;
        --c-f-d: rgb(0 0 0 / .33);
        --c-f-s: rgb(0 0 0 / .61);
        --c-f-x: rgb(0 0 0 / .1);
        --o-yellow: #ffb500;
        /*      */
        --c-o: hsl(220deg 20% 86% / 10%);
        --c-o1: hsl(220deg 20% 86% / 20%);
        --c-o2: hsl(220deg 20% 100% / 28%);
        --c-o3: hsl(220deg 20% 100% / 36%);
        --c-oi: hsl(220deg 90% 15% / 4%);
        --c-o1i: hsl(220deg 90% 15% / 8%);
        --c-o2i: hsl(220deg 90% 15% / 12%);
        --c-o3i: hsl(220deg 90% 15% / 16%);
        /*     */
        --o-green-a: #62b300;
        --o-green-b: #4C8C2B;
        --o-green-c: #046A38;
        --o-blue-a: #008fd6;
        --o-blue-b: #006bb3;
        --o-blue-c: #004b87;
        /*     */
        --hc-blue-a: hsl(200deg 100% 90%);
        --hc-blue-b: hsl(200deg 100% 82%);
        --hc-blue-c: hsl(200deg 100% 74%);
        --hc-green-a: hsl(106deg 60% 88%);
        --hc-green-b: hsl(112deg 60% 82%);
        --hc-green-c: hsl(120deg 60% 74%);
        --hc-red-a: hsl(8deg 100% 92%);
        --hc-red-b: hsl(350deg 100% 87%);
        --hc-yellow: hsl(45deg 100% 81%);
        --hc-orange: hsl(36deg 100% 80%);
        /*     */
        --x-surface: inset 0 16px 16px -12px rgb(255 255 255 / 12%), inset 0 1.75px 0 rgb(255 255 255 / 6%), 0 0 2px 1px rgb(0 0 0 / 8%);
        --x-surface-ns: inset 0 16px 16px -12px rgb(255 255 255 / 12%), inset 0 1.75px 0 rgb(255 255 255 / 6%);
        --x-surface-b: inset 0 2px 0 rgb(255 255 255 / 6%), 0 0 1px 1px rgb(0 0 0 / 8%);
        --x-surface-c: inset 0 2px 0 rgb(255 255 255 / 18%), 0 0 1px 1px rgb(0 0 0 / 8%);
        --x-surface-c-i: inset 0 2px 0 rgb(255 255 255 / 0%),inset 0 0 1px 1px rgb(0 0 0 / 16%);
        --x-d-t: 0 -1px 0 rgb(0 0 0 / 14%),inset 0 1px 0 rgb(255 255 255 / 30%);
        --g-3: linear-gradient(180deg, rgba(0, 0, 0, 0.20) 1000%, rgba(0, 0, 0, 0) 0%);
        --g-2: linear-gradient(0deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 67.67%);
        --g-2i: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.15) 80%);
        --g-1: linear-gradient(180deg, rgba(0, 0, 0, 0.03) 1000%, rgba(0, 0, 0, 0) 0%);
        --g-1i: linear-gradient(0deg, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0) 67.67%);
        --g-0: linear-gradient(180deg, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0) 67.67%);
        --g-headers: linear-gradient(90deg, rgb(255 255 255 / 40%) 0%, rgb(255 255 255 / 20%) 50%, rgba(255, 255, 255, 0%) 100%);
    }

    .theme-auto .sports-coupon {
        --o-green-b: #62b300;
        --o-green-a: #4C8C2B;
        --o-green-c: #046A38;
    }
}
