/* ═══════════════════════════════════════════════════════════════════════
   1xBettors — "Floodlight" theme
   A complete reskin layered over main_style.css (no markup changes needed).
   Remove the <link> that loads this file to return to the previous look.

   Identity
     Floodlight navy  #0F1B2D   frame: header, slip, stages
     Pitch green      #0A9A4F   action, selection, wins
     Trophy gold      #FFC72C   money moments: deposit, balance, promos
     Signal red       #E53935   live
   Type
     Barlow Condensed — scores, odds, headings (sport broadcast numerals)
     Barlow           — everything else
   ═══════════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700;800&family=Barlow+Condensed:ital,wght@0,600;0,700;0,800;1,700;1,800&display=swap');

:root,[data-theme="light"]{
  color-scheme:light;
  --fl-navy:#0F1B2D; --fl-navy-2:#16263D; --fl-navy-3:#1F3350;
  --fl-green:#0A9A4F; --fl-green-2:#0BB55F; --fl-green-ink:#04381D;
  --fl-gold:#FFC72C;  --fl-gold-2:#FFD65C; --fl-gold-ink:#2B1F00;
  --fl-red:#E53935;

  --canvas:#EDF0F4;  --paper:#FFFFFF;  --paper-2:#F7F9FB;
  --sunken:#F1F4F7;  --sunken-2:#E6EBF0;
  --line:#E1E6EC;    --line-2:#CFD6DF; --line-3:#B7C1CD;
  --ink:#0F172A;     --ink-2:#253247;  --ink-3:#4B5A70;  --ink-4:#7B8798; --ink-5:#A9B2BF;

  --volt:#0A9A4F;    --volt-600:#088744; --volt-700:#06703A;
  --volt-soft:#E3F6EC; --volt-border:rgba(10,154,79,.32); --volt-tint:rgba(10,154,79,.08);
  --volt-grad:linear-gradient(180deg,#0BB55F 0%,#0A9A4F 100%);
  --sh-volt:0 8px 20px -10px rgba(10,154,79,.65);
  --brass:#9A6B00; --brass-strong:#7A5400; --brass-soft:#FFF5D6; --amber:#FFC72C;
  --win:#0A9A4F; --win-soft:#E3F6EC;
  --live:#E53935; --live-soft:#FDECEC; --live-border:rgba(229,57,53,.26);
  --brand:#0A9A4F; --brand-500:#0A9A4F; --brand-600:#088744; --brand-700:#06703A;

  --f-display:'Barlow Condensed','Barlow',system-ui,sans-serif;
  --f-body:'Barlow',system-ui,-apple-system,sans-serif;
  --f-mono:'Barlow Condensed','Barlow',system-ui,sans-serif;

  --r-md:8px; --r-lg:10px; --r-xl:12px; --r-2xl:14px;
  --sh-1:0 1px 0 rgba(15,23,42,.05);
  --sh-2:0 6px 20px -12px rgba(15,23,42,.35);
}
[data-theme="dark"]{
  color-scheme:dark;
  --canvas:#0A111D; --paper:#111B2B; --paper-2:#152236; --sunken:#17253A; --sunken-2:#1E2F48;
  --line:#1E2C42; --line-2:#28395442; --line-3:#33476A;
  --ink:#EEF2F7; --ink-2:#CBD4E1; --ink-3:#9AA7BA; --ink-4:#6F7E95; --ink-5:#4B5970;
  --volt:#12B862; --volt-600:#0FA457; --volt-700:#0A8A49; --volt-soft:#0E2A1E;
  --volt-border:rgba(18,184,98,.36); --volt-tint:rgba(18,184,98,.10);
  --volt-grad:linear-gradient(180deg,#14C76B 0%,#0FA457 100%);
  --brass:#FFC72C; --brass-strong:#FFD65C; --brass-soft:#2A230C;
  --win:#2BD07D; --win-soft:#0E2A1E; --live:#FF5A55; --live-soft:#2C1517;
  --brand:#12B862;
}

html,body{font-family:var(--f-body)}
body{letter-spacing:.005em}
.scroll{overscroll-behavior-y:contain}

/* ───────── LOGO (replaces the old mark without touching the template) ───────── */
.brand-mark{display:none!important}
.brand::before,.auth-brand::before{
  content:"";flex:0 0 auto;width:36px;height:36px;border-radius:10px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%2314C76B'/%3E%3Cstop offset='1' stop-color='%23077A3D'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='40' height='40' rx='10' fill='url(%23g)'/%3E%3Cpath d='M7 30V12h16v18' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linejoin='round'/%3E%3Cpath d='M7 12l4-4h16l-4 4M27 8v18l-4 4' fill='none' stroke='%23fff' stroke-opacity='.55' stroke-width='2' stroke-linejoin='round'/%3E%3Ccircle cx='29.5' cy='29' r='5.6' fill='%23FFC72C'/%3E%3Cpath d='M29.5 25.4l2.2 1.6-.8 2.6h-2.8l-.8-2.6z' fill='%232B1F00'/%3E%3C/svg%3E") center/contain no-repeat;
  box-shadow:0 4px 12px -4px rgba(0,0,0,.45);
}
.auth-brand::before{width:46px;height:46px;border-radius:12px}
.brand-word,.brand-word.dark{
  font-family:'Barlow Condensed',sans-serif;font-style:italic;font-weight:800;
  text-transform:uppercase;letter-spacing:.01em;font-size:23px;
}
.brand-word b,.brand-word.dark b{color:var(--fl-gold)}
.auth-brand .brand-word.dark{color:var(--ink)}

/* ───────── HEADER ───────── */
.topbar{
  background:var(--fl-navy);box-shadow:none;
  padding:calc(env(safe-area-inset-top) + 8px) var(--gutter) 10px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.topbar::after{display:none}
.tb-icon{width:36px;height:36px;border-radius:8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.tb-icon:hover{background:rgba(255,255,255,.12)}
.balance-pill{
  background:var(--fl-navy-2);border:1px solid rgba(255,255,255,.08);border-radius:10px;
  padding:7px 7px 7px 12px;margin-top:10px;backdrop-filter:none;
}
.bal-label{font-size:11px;letter-spacing:.02em;text-transform:none;color:rgba(255,255,255,.6);font-weight:600}
.bal-amount{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:22px;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.bal-cur{font-size:12px}
.bal-deposit,.btn-light{
  background:var(--fl-gold);color:var(--fl-gold-ink);border-radius:8px;font-weight:800;
  text-transform:uppercase;letter-spacing:.03em;font-size:13px;box-shadow:none;
}
.bal-deposit svg{stroke:var(--fl-gold-ink)}
.bal-deposit:hover,.btn-light:hover{background:var(--fl-gold-2)}
.btn-ghost-light{border-radius:8px;background:transparent;border:1px solid rgba(255,255,255,.28);
  text-transform:uppercase;letter-spacing:.03em;font-size:13px}
.guest-row{margin-top:10px}

@media(min-width:900px){
  .topbar{padding:0 var(--gutter)}
  .tb-inner,.tb-row{height:58px}
  .tb-nav{gap:2px;align-self:stretch}
  .tb-nav-item{
    height:58px;border-radius:0;padding:0 14px;position:relative;
    font-family:'Barlow Condensed',sans-serif;font-size:16px;font-weight:700;letter-spacing:.02em;
    text-transform:uppercase;color:rgba(255,255,255,.66);background:none!important;
  }
  .tb-nav-item:hover{color:#fff}
  .tb-nav-item.active{color:#fff;box-shadow:none}
  .tb-nav-item.active::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:3px;
    border-radius:3px 3px 0 0;background:var(--fl-green-2)}
  .tb-nav-cnt{background:var(--fl-red);color:#fff;font-family:'Barlow',sans-serif}
  .balance-pill{margin-top:0}
}

/* ───────── SPORT TABS (were pills) ───────── */
.chips:not(.inline){
  background:var(--fl-navy-2);border-bottom:0;padding:0 var(--gutter);gap:0;
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
.chips:not(.inline) .chip{
  height:44px;border-radius:0;background:none;border:0;padding:0 14px;color:rgba(255,255,255,.66);
  font-family:'Barlow Condensed',sans-serif;font-size:15px;font-weight:700;letter-spacing:.02em;
  text-transform:uppercase;position:relative;
}
.chips:not(.inline) .chip.active{color:#fff;background:none}
.chips:not(.inline) .chip.active::after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:3px;
  background:var(--fl-green-2);border-radius:3px 3px 0 0}
.chips:not(.inline) .chip.live-chip{color:#FF8A86}
.chips:not(.inline) .chip.live-chip.active::after{background:var(--fl-red)}
[data-theme="dark"] .chip.active{background:none}
.chips.inline .chip{border-radius:6px;height:32px;font-size:13px}
.chips.inline .chip.active{background:var(--fl-navy);color:#fff}

/* ───────── SECTION HEADS ───────── */
.sec-head{padding:16px var(--gutter) 8px}
.sec-title{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:20px;letter-spacing:.01em;text-transform:uppercase}
.sec-more{color:var(--volt);text-transform:uppercase;font-size:12px;letter-spacing:.04em}

/* ───────── PROMO BANNERS (hero) ───────── */
.hero{padding:12px var(--gutter) 2px}
.hero-card{border-radius:12px;min-height:132px;padding:16px 18px;box-shadow:none}
.hero-card::after{display:none}
.hero-card.h1{background:radial-gradient(120% 140% at 100% 0%,#1F3350 0%,#0F1B2D 60%)}
.hero-card.h2{background:radial-gradient(120% 140% at 100% 0%,#0BB55F 0%,#06703A 70%)}
.hero-card.h3{background:radial-gradient(120% 140% at 100% 0%,#FFD65C 0%,#E0A100 70%);color:var(--fl-gold-ink)}
.hero-tag{letter-spacing:.06em;font-weight:700}
.hero-title{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:22px;letter-spacing:.005em;line-height:1.08;text-transform:uppercase}

/* ───────── MATCH LIST — compact sportsbook rows ───────── */
.match-card{
  border-radius:0;margin:0 0 1px;border:0;border-bottom:1px solid var(--line);box-shadow:none;
  background:var(--paper);
}
.match-card:active{transform:none}
.match-card + .match-card{margin-top:0}
.mc-top{padding:9px 14px 0;gap:6px}
.mc-league-name{font-size:11px;letter-spacing:.02em;color:var(--ink-4);text-transform:none;font-weight:600}
.mc-time{font-family:var(--f-body);font-weight:700;font-size:12px;color:var(--ink-3)}
.mc-body{padding:6px 14px 11px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center}
.mc-teams{margin:0;gap:5px}
.mc-team{gap:8px}
.mc-crest{width:18px;height:18px;border-radius:5px;font-size:9px}
.mc-team-name{font-size:14px;font-weight:600;letter-spacing:0}
.mc-score{font-family:'Barlow Condensed',sans-serif;font-size:18px}
.mc-body .inplay-strip{grid-column:1/-1;margin:2px 0 0;order:3}
.mc-body .odds-row{grid-template-columns:repeat(3,58px);gap:5px}
.mc-body .more-mkts,.mc-body .lock-note{grid-column:1/-1}
.more-mkts{justify-self:start;font-size:12px;font-weight:700;color:var(--volt);padding:2px 0 0}
@media(min-width:600px){.mc-body .odds-row{grid-template-columns:repeat(3,74px)}}

.odds-btn{
  height:46px;border-radius:6px;background:var(--sunken);border:1px solid var(--line);gap:0;
}
.odds-btn .o-label{font-size:10px;letter-spacing:.02em;font-weight:700;color:var(--ink-4);text-transform:none}
.odds-btn .o-val{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:17px;color:var(--ink);letter-spacing:.01em}
.odds-btn.on{background:var(--volt);border-color:var(--volt-700);box-shadow:none}
.odds-btn.on::after{display:none}
@media(hover:hover){.odds-btn:not(.on):not(.locked):hover{background:var(--volt-soft);border-color:var(--volt-border)}}
.mkt-group .odds-row{grid-template-columns:repeat(auto-fit,minmax(90px,1fr))}

@media(min-width:900px){
  #center-feed .match-card{margin:0;border-left:1px solid var(--line);border-right:1px solid var(--line)}
  #center-feed .sec-head + div > .match-card:first-child,
  #center-feed .sec-head + .match-card{border-top:1px solid var(--line);border-radius:10px 10px 0 0}
  .match-card:hover{transform:none;box-shadow:none;background:var(--paper-2)}
}

/* ───────── MATCH DETAIL ───────── */
.detail-hero{border-radius:12px;background:var(--fl-navy);color:#fff;border:0}
.detail-hero .detail-tname,.detail-hero .detail-score{color:#fff}
.detail-league{color:rgba(255,255,255,.62)}
.detail-score{font-family:'Barlow Condensed',sans-serif}
.mkt-group{border-radius:10px}
.mkt-name{font-family:'Barlow Condensed',sans-serif;font-size:16px;text-transform:uppercase;letter-spacing:.02em}

/* ───────── SIDEBAR / SLIP ───────── */
@media(min-width:900px){
  .side{border-radius:12px;padding:4px;box-shadow:none}
  .side-label{letter-spacing:.06em;font-weight:800;color:var(--ink-4)}
  .side-item{border-radius:8px;font-weight:600}
  .side-item.active{background:var(--volt-soft);color:var(--volt-700)}
  [data-theme="dark"] .side-item.active{color:var(--volt)}
}
@media(min-width:1200px){
  .dock-inner{border-radius:12px;box-shadow:none}
  .dock-head{background:var(--fl-navy)}
  .dock-head::after{display:none}
}
.slip-stub{background:var(--fl-navy);border-radius:12px}
.stub-cta{background:var(--fl-gold);color:var(--fl-gold-ink)}
.btn-primary{background:var(--volt-grad);border-radius:8px;text-transform:uppercase;letter-spacing:.03em;
  font-family:'Barlow Condensed',sans-serif;font-size:17px;font-weight:800}

/* ───────── BOTTOM NAV ───────── */
.bottomnav{
  background:var(--paper);border-top:1px solid var(--line);
  backdrop-filter:none;-webkit-backdrop-filter:none;padding-top:4px;
}
.nav-item span{font-size:10.5px;font-weight:700}
.nav-item.active::before{top:-4px;width:28px;height:3px;background:var(--volt)}
.nav-item.active svg{stroke:var(--volt)}
.nav-item.active span{color:var(--volt)}
.nav-item.cz-nav{position:relative}
.nav-item.cz-nav svg{stroke:var(--fl-gold-ink);background:var(--fl-gold);border-radius:10px;padding:3px;
  width:30px;height:30px;margin-top:-3px}
.nav-item.cz-nav.active svg{background:var(--fl-gold);stroke:var(--fl-gold-ink)}

/* ───────── WALLET / ACCOUNT ───────── */
.wallet-card{border-radius:14px;background:radial-gradient(120% 150% at 100% 0%,#1F3350 0%,#0F1B2D 65%)}
.wc-amount{font-family:'Barlow Condensed',sans-serif;font-weight:800}
.acct-hero{background:radial-gradient(120% 150% at 100% 0%,#1F3350 0%,#0F1B2D 65%)}
.acct-item{border-radius:10px}

/* ───────── AUTH ───────── */
.auth-card{border-radius:16px}
.auth-title{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;font-size:30px;letter-spacing:.01em}
.field-input{border-radius:8px}
.btn-primary.lg{height:52px}

/* ───────── TOAST ───────── */
.toast{border-radius:10px;font-weight:600}

/* ───────── accessibility & motion ───────── */
:where(button,a,[role="button"],input,select,textarea):focus-visible{outline:3px solid var(--fl-gold);outline-offset:2px}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}