/* ═══════════════════════════════════════════════════════════════════════════
   BetPulse — KLASIK PRO theme override
   Lësho KETË file POSHTË style.css-së ekzistues:
     <link rel="stylesheet" href="/css/style.css?v=...">
     <link rel="stylesheet" href="/css/klasik-pro.css?v=1">

   Ky file mban të gjitha klasat ekzistuese — ndryshon vetëm pamjen.
   Pa ndryshime në HTML ose JS.
   ═══════════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Oswald:wght@500;600;700&display=swap');

/* ═══════════════════════════════════════════════════════════
   BOOST BANNER (i injektuar nga klasik-pro.js)
   ═══════════════════════════════════════════════════════════ */
.kp-boost-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 7px 16px;
  background: linear-gradient(90deg, #2a1a05 0%, #5a3a0a 50%, #2a1a05 100%);
  border-bottom: 1px solid #1b3a25;
  position: sticky;
  top: 50px;
  z-index: 499;
  overflow: hidden;
  font-family: 'Inter', system-ui, sans-serif;
}
.kp-boost-label {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  background: #ffd24a;
  color: #1a1000;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .6px;
  border-radius: 3px;
  text-transform: uppercase;
}
.kp-boost-track-wrap {
  flex: 1;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent 0, #000 60px, #000 calc(100% - 60px), transparent 100%);
}
.kp-boost-track {
  display: flex;
  gap: 32px;
  white-space: nowrap;
  animation: kp-marquee 60s linear infinite;
  font-size: 12.5px;
  color: #a4bca8;
}
@keyframes kp-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.kp-boost-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.kp-boost-teams {
  color: #eaf4ec;
  font-weight: 700;
}
.kp-boost-mkt { color: #a4bca8; }
.kp-boost-was {
  text-decoration: line-through;
  color: #6c8a72;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
.kp-boost-arrow { color: #6c8a72; }
.kp-boost-now {
  color: #ffd24a;
  font-family: 'Oswald', sans-serif;
  font-weight: 800;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}
.kp-boost-close {
  background: transparent;
  border: 1px solid rgba(255,255,255,.15);
  color: #a4bca8;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  font-size: 11px;
  cursor: pointer;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.kp-boost-close:hover { color: #fff; border-color: #fff; }

@media (max-width: 768px) {
  .kp-boost-banner {
    top: 0;
    position: relative;
    padding: 6px 12px;
    font-size: 11px;
  }
}

/* ═══════════════════════════════════════════════════════════
   PINNED BET (sidebar)
   ═══════════════════════════════════════════════════════════ */
.kp-pinned-bet {
  margin: 10px;
  padding: 10px 12px;
  background: rgba(255,210,74,.06);
  border: 1px solid #264c33;
  border-left: 3px solid #ffd24a;
  border-radius: 4px;
  font-family: 'Inter', system-ui, sans-serif;
}
.kp-pinned-hdr {
  font-size: 9.5px;
  font-weight: 800;
  color: #ffd24a;
  letter-spacing: .8px;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.kp-pinned-match {
  font-size: 11.5px;
  font-weight: 600;
  color: #eaf4ec;
  margin-bottom: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kp-pinned-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 10.5px;
  color: #a4bca8;
}
.kp-pinned-row a {
  color: #ffd24a;
  font-weight: 700;
  text-decoration: none;
}

/* ═══════════════════════════════════════════════════════════
   ODD FLASH animations
   ═══════════════════════════════════════════════════════════ */
@keyframes kp-flash-up-anim {
  0% { background: rgba(74,222,128,.4) !important; }
  100% { background: transparent !important; }
}
@keyframes kp-flash-down-anim {
  0% { background: rgba(255,92,92,.4) !important; }
  100% { background: transparent !important; }
}
.kp-flash-up { animation: kp-flash-up-anim 1s ease-out; }
.kp-flash-down { animation: kp-flash-down-anim 1s ease-out; }

.kp-kickoff-live {
  color: #ff5454 !important;
  font-weight: 800 !important;
}

/* ═══════════════════════════════════════════════════════════
   FORM BADGES (WWDWL)
   ═══════════════════════════════════════════════════════════ */
.kp-form {
  display: inline-flex;
  gap: 2px;
  margin-left: 6px;
  vertical-align: middle;
}
.kp-form > span {
  width: 13px; height: 13px;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: 'Inter', sans-serif;
  font-size: 8px; font-weight: 800;
  border-radius: 2px;
  color: #fff;
}
.kp-form-w { background: #2a8a3a; }
.kp-form-l { background: #c93333; }
.kp-form-d { background: #3a5430; color: #d4d4aa; }

/* ═══════════════════════════════════════════════════════════
   FEATURED HERO CARD
   ═══════════════════════════════════════════════════════════ */
.kp-featured-hero {
  margin: 14px;
  padding: 18px 20px;
  background: linear-gradient(135deg, #0e2a18 0%, #143626 50%, #0e2a18 100%);
  border: 1px solid #264c33;
  border-radius: 6px;
  position: relative;
  overflow: hidden;
  font-family: 'Inter', sans-serif;
}
.kp-featured-hero::after {
  content: '';
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: 240px;
  background: radial-gradient(circle at right, rgba(255,210,74,.16), transparent 70%);
  pointer-events: none;
}
.kp-hero-top {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 14px;
  position: relative; z-index: 1;
}
.kp-hero-badge {
  padding: 3px 9px;
  background: #ffd24a;
  color: #1a1000;
  font-size: 9.5px; font-weight: 900;
  letter-spacing: .6px;
  border-radius: 2px;
  text-transform: uppercase;
}
.kp-hero-league { color: #a4bca8; font-size: 11.5px; }
.kp-hero-countdown {
  margin-left: auto;
  color: #ffd24a;
  font-size: 11.5px; font-weight: 700;
  font-variant-numeric: tabular-nums;
  display: flex; align-items: center; gap: 5px;
}
.kp-hero-body {
  display: flex; align-items: center;
  gap: 24px; margin-bottom: 16px;
  position: relative; z-index: 1;
}
.kp-hero-team { flex: 1; }
.kp-hero-home { text-align: right; }
.kp-hero-name {
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 700;
  color: #eaf4ec;
  letter-spacing: .3px;
}
.kp-hero-meta {
  display: flex; align-items: center; gap: 6px;
  font-size: 10.5px; color: #6c8a72;
  margin-top: 6px;
  justify-content: inherit;
}
.kp-hero-home .kp-hero-meta { justify-content: flex-end; }
.kp-hero-pos { font-weight: 700; }
.kp-hero-vs {
  padding: 6px 14px;
  background: rgba(0,0,0,.3);
  border: 1px solid #264c33;
  font-family: 'Oswald', sans-serif;
  font-size: 13px; font-weight: 800;
  color: #a4bca8;
  letter-spacing: 1.5px;
  border-radius: 3px;
}
.kp-hero-odds {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  gap: 8px;
  position: relative; z-index: 1;
}
.kp-hero-odd, .kp-hero-mkts {
  background: rgba(0,0,0,.25);
  border: 1px solid #264c33;
  border-radius: 4px;
  padding: 12px 14px;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  color: #eaf4ec;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  position: relative;
  transition: all .15s;
}
.kp-hero-odd:hover { border-color: #ffd24a; background: rgba(255,210,74,.05); }
.kp-hero-odd-lbl { font-size: 10px; color: #6c8a72; font-weight: 700; }
.kp-hero-odd-val {
  font-family: 'Oswald', sans-serif;
  font-size: 20px; font-weight: 800;
  color: #ffd24a;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.kp-hero-odd-trend {
  position: absolute;
  top: 5px; right: 6px;
  font-size: 8.5px; font-weight: 700;
}
.kp-hero-odd-trend.up { color: #4ade80; }
.kp-hero-odd-trend.down { color: #ff5454; }
.kp-hero-mkts { padding: 12px 20px; }
.kp-hero-mkts-n {
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 800;
  color: #ffd24a;
}
.kp-hero-mkts-lbl {
  font-size: 9px;
  color: #6c8a72;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.kp-hero-popular {
  margin-top: 12px;
  display: flex; flex-wrap: wrap; gap: 6px;
  align-items: center;
  position: relative; z-index: 1;
}
.kp-hero-popular-lbl {
  font-size: 10px;
  color: #6c8a72;
  font-weight: 700;
  letter-spacing: .4px;
  text-transform: uppercase;
}
.kp-hero-pop {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 10px;
  background: rgba(0,0,0,.25);
  border: 1px solid #264c33;
  border-radius: 3px;
  font-size: 10.5px;
  color: #a4bca8;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
}
.kp-hero-pop b { color: #eaf4ec; font-weight: 700; }
.kp-hero-pop span {
  font-family: 'Oswald', sans-serif;
  color: #ffd24a;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  font-size: 11px;
}
.kp-hero-pop:hover { border-color: #ffd24a; }

/* ═══════════════════════════════════════════════════════════
   STAT STRIP në My Bets
   ═══════════════════════════════════════════════════════════ */
.kp-stat-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 16px;
}
.kp-stat-card {
  padding: 14px;
  background: #132f1d;
  border: 1px solid #264c33;
  border-radius: 4px;
  position: relative;
  overflow: hidden;
  font-family: 'Inter', sans-serif;
}
.kp-stat-lbl {
  font-size: 10.5px;
  color: #6c8a72;
  text-transform: uppercase;
  letter-spacing: .4px;
  font-weight: 700;
  margin-bottom: 8px;
}
.kp-stat-val {
  font-family: 'Oswald', sans-serif;
  font-size: 24px;
  font-weight: 700;
  color: #ffd24a;
  font-variant-numeric: tabular-nums;
}
.kp-stat-val.kp-green { color: #4ade80; }
.kp-spark {
  position: absolute;
  bottom: 10px; right: 12px;
  width: 80px; height: 24px;
  opacity: .8;
}

/* ═══════════════════════════════════════════════════════════
   PROFIT CHART
   ═══════════════════════════════════════════════════════════ */
.kp-profit-chart {
  padding: 16px;
  background: #132f1d;
  border: 1px solid #264c33;
  border-radius: 4px;
  margin-bottom: 20px;
  font-family: 'Inter', sans-serif;
}
.kp-chart-hdr {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.kp-chart-lbl {
  font-size: 10.5px;
  color: #6c8a72;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.kp-chart-val {
  font-family: 'Oswald', sans-serif;
  font-size: 26px;
  font-weight: 700;
  color: #4ade80;
  font-variant-numeric: tabular-nums;
}
.kp-chart-pct {
  font-size: 12px;
  margin-left: 10px;
  font-weight: 700;
}
.kp-chart-periods { display: flex; gap: 4px; }
.kp-chart-periods button {
  padding: 4px 10px;
  font-size: 10.5px;
  font-weight: 700;
  background: transparent;
  color: #a4bca8;
  border: 1px solid #264c33;
  border-radius: 3px;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
}
.kp-chart-periods button.on {
  background: #ffd24a;
  color: #0a1f0e;
  border-color: #ffd24a;
}
.kp-chart-svg {
  width: 100%;
  height: 100px;
  display: block;
}
.kp-chart-axis {
  display: flex;
  justify-content: space-between;
  margin-top: 4px;
  font-size: 9.5px;
  color: #6c8a72;
  font-weight: 600;
}

/* ═══════════════════════════════════════════════════════════
   EVENT TIMELINE në Live detail
   ═══════════════════════════════════════════════════════════ */
.kp-event-timeline {
  padding: 14px 18px;
  background: #0e2a18;
  border-bottom: 1px solid #264c33;
  font-family: 'Inter', sans-serif;
}
.kp-tl-hdr {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: #6c8a72;
  text-transform: uppercase;
  letter-spacing: .5px;
  font-weight: 700;
  margin-bottom: 6px;
}
.kp-tl-min { color: #ffd24a; }
.kp-tl-bar {
  position: relative;
  height: 36px;
  background: #081810;
  border: 1px solid #264c33;
  border-radius: 3px;
  margin-bottom: 4px;
}
.kp-tl-ht {
  position: absolute;
  top: 0; bottom: 0;
  width: 1px;
  background: rgba(108,138,114,.4);
}
.kp-tl-ht span {
  position: absolute;
  top: -14px;
  transform: translateX(-50%);
  font-size: 9px;
  color: #6c8a72;
}
.kp-tl-now {
  position: absolute;
  top: 0; bottom: 0;
  width: 2px;
  background: #ffd24a;
  box-shadow: 0 0 8px #ffd24a;
}
.kp-tl-event {
  position: absolute;
  transform: translateX(-50%);
}
.kp-tl-event > span {
  width: 14px; height: 14px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 8px;
}
.kp-tl-axis {
  display: flex;
  justify-content: space-between;
  font-size: 9px;
  color: #6c8a72;
  font-weight: 600;
}

/* ── Override palette: shtojmë verdhë + ngjyra më të kontrastuara ── */
:root {
  /* Theksi i ri: e verdhë Bet365 për kuotat */
  --kp-yellow:     #ffd24a;
  --kp-yellow-hi:  #ffe480;
  --kp-yellow-dim: #c79a1f;

  /* Ri-mapimi i ngjyrave të cilat përdoren më shpesh në UI */
  --gold:    var(--kp-yellow);
  --gold2:   var(--kp-yellow-hi);

  /* Background më të errët, më kontrastuese */
  --bg:      #0b1f12;
  --bg2:     #081810;
  --bg3:     #102a18;
  --card:    #132f1d;
  --sidebar: #0a1f0e;
  --border:  #1b3a25;
  --border2: #264c33;

  --text:    #eaf4ec;
  --text2:   #a4bca8;
  --text3:   #6c8a72;
}

/* ─── Tipografia: Inter për tekst, Oswald për numra/tituj ─── */
body { font-family: 'Inter', system-ui, sans-serif !important; }
.logo, .lo-logo-big, .lc-logo, .login-card h2 {
  font-family: 'Oswald', sans-serif !important;
}

/* ═══════════════════════════════════════════════════════════
   HEADER
   ═══════════════════════════════════════════════════════════ */
.hdr {
  height: 50px !important;
  background: var(--bg2) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.4) !important;
}
/* Mobile: respekto display:none te style.css; boost banner gjithashtu fshihet
   sepse pa header s'ka kuptim ta vendosim aty. */
@media (max-width: 768px) {
  .hdr { display: none !important; }
  .kp-boost-banner { display: none !important; }
  /* Mob-nav GJITHMONE sipër slip-it (slip ka z-index 900). */
  .mob-nav { z-index: 950 !important; }
  /* Slip-paneli s'duhet të mbulojë mob-nav-in: lëre vend 54px poshtë. */
  .slip-panel { bottom: calc(54px + env(safe-area-inset-bottom, 0px)) !important; }
  /* Slip-paneli FSHIHET kur kuponi është bosh (te slip-inner.slip-empty).
     :has() — Chrome 105+, FF 121+, Safari 15.4+.
     Përdoruesi duhet ta hapë vetëm pasi të selektojë kuotë. */
  .slip-panel:has(#slip-inner > .slip-empty:only-child),
  .slip-panel:has(.slip-empty) {
    transform: translateY(110%) !important;
    pointer-events: none !important;
  }
  /* Backdrop dhe fab gjithashtu — kur bosh, fab vetëm si trigger */
  #mob-backdrop:has(~ .slip-panel:has(.slip-empty)) { display: none !important; }
}
/* Tablet breakpoint (860px) — i njëjti fix po qe se style.css show-on mob-nav nga 860 */
@media (max-width: 860px) {
  .mob-nav { z-index: 950 !important; }
}
.logo {
  font-family: 'Oswald', sans-serif !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  color: var(--kp-yellow) !important;
}
.hnav {
  padding: 8px 14px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
  letter-spacing: .2px !important;
}
.hnav.on::after {
  background: var(--kp-yellow) !important;
  height: 2px !important;
}
.hnav:hover, .hnav.on { color: var(--text) !important; }

/* Auth balance pill — verdhë në vend të jeshile */
.auth-bal.on {
  color: var(--kp-yellow) !important;
  background: linear-gradient(180deg, rgba(255,210,74,.15), rgba(255,210,74,.05)) !important;
  border-color: rgba(255,210,74,.4) !important;
}
.auth-name {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid var(--border) !important;
}

/* Buttons */
.auth-btn:not(.auth-logout) {
  background: linear-gradient(180deg, #2a8a3a, #1a5e26) !important;
  font-weight: 700 !important;
  padding: 7px 16px !important;
  font-size: 12px !important;
  letter-spacing: .3px !important;
  border-radius: 4px !important;
  box-shadow: 0 2px 8px rgba(46,133,64,.3) !important;
}
.auth-btn:not(.auth-logout):hover {
  background: linear-gradient(180deg, #34a346, #21762f) !important;
}

/* ═══════════════════════════════════════════════════════════
   SIDEBAR (Sport list / countries)
   ═══════════════════════════════════════════════════════════ */
.sb-day {
  border-radius: 3px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .3px !important;
}
.sb-day.on {
  background: var(--kp-yellow) !important;
  color: #0a1f0e !important;
  border-color: var(--kp-yellow) !important;
}
.sb-sport.on {
  color: var(--kp-yellow) !important;
  border-left-color: var(--kp-yellow) !important;
  background: rgba(255,210,74,.06) !important;
}
.sb-sport-cnt {
  background: rgba(255,210,74,.15) !important;
  color: var(--kp-yellow) !important;
  font-size: 10px !important;
}
.sb-sport.disabled .sb-sport-cnt {
  background: var(--bg3) !important;
  color: var(--text3) !important;
}
.sb-featured-hdr {
  color: var(--kp-yellow) !important;
  letter-spacing: .8px !important;
  text-transform: uppercase !important;
  font-size: 10px !important;
}
.sb-c-name { font-size: 12px !important; }
.sb-c-fav.on { color: var(--kp-yellow) !important; }
.sb-lg.on { color: var(--kp-yellow) !important; }

/* ═══════════════════════════════════════════════════════════
   MATCH LIST (left rail në Live)
   ═══════════════════════════════════════════════════════════ */
.ml-title {
  font-family: 'Oswald', sans-serif !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: .5px !important;
}
.ml-cnt {
  background: #000000 !important;   /* User: badge sfond i zi */
  color: #ffffff !important;        /* User: shkrim i bardhe */
}
.ml-section {
  background: #3c1b0c !important;   /* User: shiriti i seksionit kafe */
  letter-spacing: .8px !important;
  font-size: 9.5px !important;
  border-top: 2px solid var(--border) !important;
}
.ml-section.live { color: #ffffff !important; border-top-color: var(--red) !important; }
.ml-section.fav  { color: var(--kp-yellow) !important; border-top-color: var(--kp-yellow) !important; }

.ml-league {
  background: #090604 !important;   /* User: emrat e ligave sfond i zi */
  color: #fffcfc !important;        /* User: shkrim i bardhe */
  font-weight: 700 !important;
  letter-spacing: .4px !important;
  text-transform: uppercase !important;
}
/* User: sfondi i listes #3c1b0c, emrat e ekipeve te bardhe */
.ml-row  { background: #3c1b0c !important; }
.ml-team { color: #fff !important; font-size: 12px !important; }   /* User: emrat e ekipeve pak me te medhenj (-1) */
/* User: headerat lart (titulli + tabet e ligave) po me #3c1b0c */
.match-list-hdr  { background: #3c1b0c !important; }
.match-list-tabs { background: #060505 !important; }
/* User: butonat e tabeve te ligave ne temen kafe; aktivi me theks te verdhe */
.ml-tab     { background: #3c1b0c !important; color: #fff !important; border: 1px solid rgba(255,255,255,.25) !important; }
.ml-tab:hover { color: #fff !important; border-color: var(--kp-yellow) !important; }
.ml-tab.on  { background: #3c1b0c !important; color: #fff !important; border-color: var(--kp-yellow) !important; }
/* User: kolona e koeficientave (1X2) me e gjere -> kutite me te gjera */
.ml-row, .ml-league { grid-template-columns: 32px 1fr 172px 18px 18px !important; }
.ml-row.on {
  background: rgba(255,210,74,.08) !important;
  border-left: 3px solid var(--kp-yellow) !important;
}

/* Inline odd buttons në match list — verdhë */
.ml-odd {
  background: #000 !important;            /* User: katroret 1X2 sfond te zi */
  border: 1px solid var(--border2) !important;
  border-radius: 3px !important;
  padding: 5px 4px !important;            /* User: ulur 1 numer (ishte 6px) */
  min-height: 34px !important;            /* User: ulur 1 numer (ishte 38px) */
}
.ml-odd:hover:not(:disabled) {
  background: rgba(255,210,74,.08) !important;
  border-color: var(--kp-yellow-dim) !important;
}
.ml-odd.sel {
  background: var(--kp-yellow) !important;
  border-color: var(--kp-yellow) !important;
  color: #0a1f0e !important;
}
.ml-odd-lbl { display: none !important; }   /* User: hiq 1/X/2 brenda kutise */
.ml-odd-dec {
  color: var(--kp-yellow) !important;
  font-weight: 800 !important;
  font-size: 13px !important;                /* User: ulur 1 numer (ishte 14px) */
}
.ml-odd.sel .ml-odd-dec { color: #0a1f0e !important; }

.ml-time { color: #ffffff !important; }   /* User: minuta live e bardhe */
.ml-ko { color: var(--text2) !important; }
.ml-ht {
  color: var(--kp-yellow) !important;
  background: rgba(255,210,74,.1) !important;
}
.ml-s.lead { color: var(--kp-yellow) !important; }
.ml-team.lead { color: #ffffff !important; }

/* ═══════════════════════════════════════════════════════════
   DETAIL PANEL (markets, kuotat)
   ═══════════════════════════════════════════════════════════ */
.detail-header {
  background: linear-gradient(180deg, #122e48 0%, #0a1f0e 100%) !important;
  border-bottom: 1px solid var(--border) !important;
}
.d-time {
  background: rgba(239,68,68,.15) !important;
  color: var(--red) !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
.d-time.ht {
  color: var(--kp-yellow) !important;
  background: rgba(255,210,74,.15) !important;
}
.detail-teams {
  font-family: 'Oswald', sans-serif !important;
  font-size: 17px !important;
  letter-spacing: .3px !important;
}
.d-score {
  font-family: 'Oswald', sans-serif !important;
  font-size: 22px !important;
  color: var(--kp-yellow) !important;
  background: rgba(255,210,74,.08) !important;
  border: 1px solid rgba(255,210,74,.3) !important;
  padding: 4px 14px !important;
  letter-spacing: 2px !important;
}

.d-card-title {
  color: var(--text) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .4px !important;
}

.d-odd {
  background: #3c1b0c !important;                 /* User: kutite ne #3c1b0c */
  border: 1px solid var(--border2) !important;
  border-radius: 3px !important;
}
.d-odd:hover:not(.susp) {
  background: rgba(255,210,74,.06) !important;
  border-color: var(--kp-yellow-dim) !important;
}
.d-odd .val {
  font-family: 'Oswald', sans-serif !important;
  color: var(--kp-yellow) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}
/* `data-sel` mban ETIKETEN e zgjedhjes ("1", "X", "2", "Over 2.5"...), jo
   gjendjen e zgjedhur. Rregulli `[data-sel="1"]` i bente te verdha TE GJITHA
   kutite "1" te 1X2, dhe meqe ngjyra e tekstit ndryshohet vetem per `.sel`,
   koeficienti dilte i verdhe mbi te verdhe — i padukshem. Mbetet vetem `.sel`. */
.d-odd.sel {
  background: var(--kp-yellow) !important;
  border-color: var(--kp-yellow) !important;
}
.d-odd.sel .val,
.d-odd.sel .lbl { color: #0a1f0e !important; }

/* Odds-btn (në sportsbook prematch) */
.odds-btn {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid var(--border2) !important;
  color: var(--kp-yellow) !important;
  font-family: 'Oswald', sans-serif !important;
  font-weight: 700 !important;
}
.odds-btn:hover {
  background: rgba(255,210,74,.08) !important;
  border-color: var(--kp-yellow-dim) !important;
  color: var(--kp-yellow) !important;
}
.odds-btn.sel {
  background: var(--kp-yellow) !important;
  color: #0a1f0e !important;
  border-color: var(--kp-yellow) !important;
}

/* Sportsbook prematch sb-match row */
.sb-match {
  background: var(--bg2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 4px !important;
}
.sb-match:hover { border-color: var(--kp-yellow-dim) !important; }
.sb-m-time {
  font-family: 'Oswald', sans-serif !important;
  color: var(--kp-yellow) !important;
  font-size: 12px !important;
}
.sb-odd { background: rgba(255,255,255,.04) !important; border: 1px solid var(--border2) !important; }
.sb-odd span {
  font-family: 'Oswald', sans-serif !important;
  color: var(--kp-yellow) !important;
  font-weight: 700 !important;
}
.sb-odd:hover {
  background: rgba(255,210,74,.08) !important;
  border-color: var(--kp-yellow-dim) !important;
}

/* Market badge */
.mktbadge {
  background: var(--card) !important;
  color: var(--text2) !important;
  border: 1px solid var(--border2) !important;
  font-weight: 700 !important;
}
.mktbadge:hover {
  background: var(--kp-yellow) !important;
  color: #0a1f0e !important;
  border-color: var(--kp-yellow) !important;
}

/* ═══════════════════════════════════════════════════════════
   BET SLIP
   ═══════════════════════════════════════════════════════════ */
.slip-panel { background: var(--bg2) !important; }
.slip-hdr {
  background: var(--bg2) !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: .5px !important;
}
.slip-cnt {
  background: var(--kp-yellow) !important;
  color: #0a1f0e !important;
  font-weight: 800 !important;
}
.slip-type-lbl.is-acca {
  background: var(--kp-yellow) !important;
  color: #0a1f0e !important;
  border-color: var(--kp-yellow) !important;
}
.stype.on {
  background: var(--kp-yellow) !important;
  color: #0a1f0e !important;
  border-color: var(--kp-yellow) !important;
}
.slip-sel {
  background: #3c1b0c !important;            /* User: karta e perzgjedhjes kafe */
  border: 1px solid #5a2c14 !important;
  border-radius: 3px !important;
}
.slip-pick { font-weight: 700 !important; }
.slip-odds {
  color: var(--kp-yellow) !important;
  font-family: 'Oswald', sans-serif !important;
  font-weight: 700 !important;
}
.slip-stake input {
  background: var(--bg) !important;
  border: 1px solid var(--border2) !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--kp-yellow) !important;
}
.slip-stake input:focus { border-color: var(--kp-yellow) !important; }
.slip-combo {
  background: rgba(255,210,74,.06) !important;
  border-left: 3px solid var(--kp-yellow) !important;
}
.slip-combo strong {
  color: var(--kp-yellow) !important;
  font-family: 'Oswald', sans-serif !important;
}
.slip-place {
  background: #3c1b0c !important;            /* User: butoni Vendos Bastin kafe */
  font-family: 'Oswald', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;
  border-radius: 4px !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.4) !important;
}
.slip-place:hover {
  background: #5a2c14 !important;
}

/* FAB */
.slip-fab {
  background: linear-gradient(180deg, #2a8a3a, #1a5e26) !important;
  font-family: 'Oswald', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: .5px !important;
  box-shadow: 0 4px 18px rgba(46,133,64,.5) !important;
}

/* ═══════════════════════════════════════════════════════════
   MY BETS — kartela + tabs më të bukura
   ═══════════════════════════════════════════════════════════ */
.mb-title {
  font-family: 'Oswald', sans-serif !important;
  font-size: 22px !important;
  letter-spacing: .5px !important;
  color: var(--text) !important;
}
.mb-tab {
  font-weight: 700 !important;
  letter-spacing: .3px !important;
  border-radius: 14px !important;
}
.mb-tab.on {
  background: var(--kp-yellow) !important;
  color: #0a1f0e !important;
  border-color: var(--kp-yellow) !important;
}
.mb-card {
  background: var(--card) !important;
  border: 1px solid var(--border) !important;
  border-radius: 4px !important;
  border-left: 3px solid var(--border2) !important;
}
.mb-card:hover {
  border-color: var(--border2) !important;
  border-left-color: var(--kp-yellow-dim) !important;
}
.mb-status.mb-open {
  background: rgba(255,210,74,.15) !important;
  color: var(--kp-yellow) !important;
}
.mb-status.mb-won {
  background: rgba(46,165,80,.15) !important;
  color: #4ade80 !important;
}
.mb-id { font-family: 'Oswald', sans-serif !important; font-size: 13px !important; letter-spacing: .5px !important; }
.mb-sel { background: rgba(255,255,255,.03) !important; border-radius: 0 3px 3px 0 !important; }
.mb-sel-name { font-weight: 700 !important; }
.mb-sel-odds {
  color: var(--kp-yellow) !important;
  font-family: 'Oswald', sans-serif !important;
  font-weight: 700 !important;
}
.mb-payout b {
  color: var(--kp-yellow) !important;
  font-family: 'Oswald', sans-serif !important;
}

/* Stat strip në krye të faqes My Bets (nëse JS-i gjeneron .mb-stats) */
.mb-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}
.mb-stat {
  padding: 14px 16px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 4px;
}
.mb-stat-lbl {
  font-size: 10px;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: .5px;
  font-weight: 700;
  margin-bottom: 8px;
}
.mb-stat-val {
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--kp-yellow);
  font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════════
   MATCH CENTER (statistikat, lineup, etj.)
   ═══════════════════════════════════════════════════════════ */
.mc-tab.on {
  color: var(--kp-yellow) !important;
  border-top-color: var(--kp-yellow) !important;
}
.mc-score-val {
  color: var(--kp-yellow) !important;
  font-family: 'Oswald', sans-serif !important;
}
.mc-stat-h { color: #4ade80 !important; }
.mc-stat-a { color: #ff7777 !important; }
.mc-bar-h { background: #4ade80 !important; }
.mc-bar-a { background: #ff7777 !important; }
.mc-poss-h {
  background: linear-gradient(90deg, #2a8a3a, #4ade80) !important;
}
.mc-poss-a { background: linear-gradient(90deg, #ff7777, #d04444) !important; }

/* H2H pills */
.mc-h2h-w { background: #2a8a3a !important; }
.mc-h2h-l { background: #d04444 !important; }
.mc-h2h-pill { font-family: 'Oswald', sans-serif !important; }

.mc-live-score {
  font-family: 'Oswald', sans-serif !important;
  color: var(--kp-yellow) !important;
  font-size: 26px !important;
  letter-spacing: 3px !important;
}

/* ═══════════════════════════════════════════════════════════
   MOBILE NAV + CHIPS
   ═══════════════════════════════════════════════════════════ */
.mob-nav { background: var(--bg2) !important; border-top: 1px solid var(--border) !important; }
.mob-nav-tab.on { color: var(--kp-yellow) !important; }
.mob-nav-tab.on::before { background: var(--kp-yellow) !important; }
.mnav-cnt {
  background: var(--kp-yellow) !important;
  color: #0a1f0e !important;
  font-weight: 800 !important;
}
.mob-sport-chip.on {
  background: rgba(255,210,74,.15) !important;
  color: var(--kp-yellow) !important;
  border-color: rgba(255,210,74,.5) !important;
}

/* ═══════════════════════════════════════════════════════════
   LOGIN OVERLAY — më premium
   ═══════════════════════════════════════════════════════════ */
.login-card {
  background: rgba(7, 21, 9, .78) !important;
  border: 1px solid rgba(255,210,74,.15) !important;
  box-shadow: 0 32px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(255,210,74,.04) !important;
}
.login-card h2 {
  font-family: 'Oswald', sans-serif !important;
  color: var(--text) !important;
}
.lc-logo {
  font-family: 'Oswald', sans-serif !important;
  color: var(--kp-yellow) !important;
}
.lf-wrap input:focus,
.lf input:focus {
  border-color: var(--kp-yellow) !important;
  box-shadow: 0 0 0 3px rgba(255,210,74,.15) !important;
}
.login-btn {
  background: linear-gradient(180deg, #2a8a3a, #1a5e26) !important;
  font-family: 'Oswald', sans-serif !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  box-shadow: 0 4px 20px rgba(46,133,64,.4) !important;
}
.login-btn:hover {
  background: linear-gradient(180deg, #34a346, #21762f) !important;
  box-shadow: 0 6px 24px rgba(46,133,64,.55) !important;
}
.lo-logo-big { color: var(--kp-yellow) !important; }

/* ═══════════════════════════════════════════════════════════
   TOAST
   ═══════════════════════════════════════════════════════════ */
.toast {
  background: var(--kp-yellow) !important;
  color: #0a1f0e !important;
  font-weight: 700 !important;
}
.toast.err { background: var(--red) !important; color: #fff !important; }

/* ═══════════════════════════════════════════════════════════
   FLASH animations — pak më të dukshme
   ═══════════════════════════════════════════════════════════ */
@keyframes fup {
  0%   { background: rgba(74,222,128,.35) !important; }
  100% { background: var(--card) !important; }
}
@keyframes fdn {
  0%   { background: rgba(255,92,92,.35) !important; }
  100% { background: var(--card) !important; }
}

/* ═══════════════════════════════════════════════════════════
   SCROLLBARS — më të hollë
   ═══════════════════════════════════════════════════════════ */
::-webkit-scrollbar { width: 5px !important; height: 5px !important; }
::-webkit-scrollbar-track { background: transparent !important; }
::-webkit-scrollbar-thumb {
  background: var(--border2) !important;
  border-radius: 3px !important;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--kp-yellow-dim) !important;
}

/* ═══════════════════════════════════════════════════════════
   DENSITY TWEAKS — pak më kompakte në desktop
   ═══════════════════════════════════════════════════════════ */
@media (min-width: 1024px) {
  .ml-row { padding: 5px 9px !important; }
  .ml-team { font-size: 12px !important; }
  .ml-s { font-size: 12px !important; font-family: 'Oswald', sans-serif !important; }
  .ml-time { font-size: 10px !important; font-family: 'Oswald', sans-serif !important; }
}

/* ═══════════════════════════════════════════════════════════
   PRINT — i fshehur (jo për bast slip-in etc)
   ═══════════════════════════════════════════════════════════ */
@media print {
  .slip-panel, .slip-fab, .mob-nav, .hdr { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════
   User: TEMA KAFE/ZI per faqen e account-it (Bastet e Mia + Financat)
   sfond #3c1b0c / #090604, tekst i bardhe + i verdhe, thekse te zinj
   ═══════════════════════════════════════════════════════════ */
/* My-bets wrap + titull */
.mb-wrap   { background: #3c1b0c !important; }
.mb-title  { color: #ffffff !important; }
.mb-back   { background: #090604 !important; color: #ffd24a !important; border: 1px solid #5a2c14 !important; }
/* Paneli financiar */
.mf-card   { background: #3c1b0c !important; border-color: #5a2c14 !important; }
.mf-hdr    { background: #090604 !important; }
.mf-title, .mf-title span { color: #ffffff !important; }
/* Bast / Casino sectabs */
.mf-sectabs { background: #090604 !important; }
.mf-sectab        { color: #ffffff !important; }
.mf-sectab-sub    { color: #d8b79c !important; }
.mf-sectab.on     { background: #3c1b0c !important; color: #ffd24a !important; }
.mf-sectab.on .mf-sectab-lbl { color: #ffd24a !important; }
/* Filter bar */
.mf-fbar   { background: #090604 !important; }
.mf-date, .mf-sel, .mf-q, .mf-ccy { background: #3c1b0c !important; color: #ffffff !important; border-color: #5a2c14 !important; }
.mf-q.on, .mf-ccy.on { background: #ffd24a !important; color: #0a0a0a !important; border-color: #ffd24a !important; }
.mf-ok     { background: #ffd24a !important; color: #0a0a0a !important; border-color: #ffd24a !important; }
/* Main area + aside (statuset majtas) */
.mf-main, #mf-body { background: #3c1b0c !important; }
.mf-aside  { background: #090604 !important; border-color: #5a2c14 !important; }
.mf-aside .mb-tab     { background: #3c1b0c !important; color: #ffffff !important; border-color: #5a2c14 !important; }
.mf-aside .mb-tab.on  { background: #ffd24a !important; color: #0a0a0a !important; border-color: #ffd24a !important; }
/* Stat cards */
.mf-stat        { background: #090604 !important; border-color: #5a2c14 !important; }
.mf-stat-lbl    { color: #d8b79c !important; }
.mf-stat-val    { color: #ffffff !important; }
/* My-bets cards */
.mb-tab        { background: #090604 !important; color: #ffffff !important; border-color: #5a2c14 !important; }
.mb-tab.on     { background: #ffd24a !important; color: #0a0a0a !important; border-color: #ffd24a !important; }
.mb-card       { background: #090604 !important; border-color: #5a2c14 !important; }
.mb-id, .mb-sel-name, .mb-money, .mb-money b { color: #ffffff !important; }
.mb-sel-odds, .mb-payout b { color: #ffd24a !important; }