/* ============================================================
   Dark Theme — "Cup X Light" (v3)
   Matches the reference screenshot exactly:
   - Full-page white/light-grey base
   - Clean white header, no gradient
   - "بازی‌های مهم" button: tricolor border, white fill
   - Vibrant match card: deep navy/WC colours
   - Match list: white card, light group pill
   - Bottom nav: white pill, navy active circle
   ============================================================ */

/* ── Token overrides ── */
[data-theme="dark"] {
  --lb-bg:       #EEF0F6;
  --lb-surface:  #FFFFFF;
  --lb-surface2: #F0F3FA;
  --lb-border:   #DDE2EF;
  --lb-muted:    #6B7693;
  --lb-text:     #111827;
  --wc-blue:     #1B3A8C;
  --wc-red:      #D42B2B;
  --wc-green:    #167A33;
  --wc-gold:     #F5C84B;
  --wc-cyan:     #4A7BFF;
}

/* ── Page / root background ── */
[data-theme="dark"] body,
[data-theme="dark"] #root,
[data-theme="dark"] #root > div {
  background-color: #EEEFF3 !important;
  background-image: url('/bg-pattern.png') !important;
  background-size: cover !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
  background-attachment: local !important;
}

/* Token-based bg helpers */
[data-theme="dark"] .bg-lb-bg       { background-color: transparent !important; }
[data-theme="dark"] .bg-lb-surface  { background-color: #FFFFFF !important; }
[data-theme="dark"] .bg-lb-surface2 { background-color: #F0F3FA !important; }
[data-theme="dark"] .border-lb-border { border-color: #DDE2EF !important; }

/* Page-level overrides */
[data-theme="dark"] .bg-\[\#11041d\],
[data-theme="dark"] .bg-\[#11041d\],
[data-theme="dark"] .leaderboard-page {
  background-color: #EEF0F6 !important;
}

/* ── Text ── */
[data-theme="dark"] .text-lb-text   { color: #111827 !important; }
[data-theme="dark"] .text-lb-muted  { color: #6B7693 !important; }
[data-theme="dark"] .text-white     { color: #111827 !important; }

/* ── Header band — white, clean ── */
[data-theme="dark"] .bg-gradient-to-b.from-wc-accent,
[data-theme="dark"] .bg-gradient-to-b.from-wc-accent.via-wc-primary {
  background-image: none !important;
  background-color: rgba(255,255,255,0.75) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  box-shadow: 0 1px 0 rgba(221,226,239,0.5) !important;
}
[data-theme="dark"] .from-wc-accent,
[data-theme="dark"] .via-wc-primary,
[data-theme="dark"] .from-wc-primary {
  background-image: none !important;
  background-color: #FFFFFF !important;
}

/* Header text back to dark */
[data-theme="dark"] .bg-gradient-to-b.from-wc-accent .text-white,
[data-theme="dark"] .bg-gradient-to-b.from-wc-accent .text-white\/75,
[data-theme="dark"] .bg-gradient-to-b.from-wc-accent p {
  color: #111827 !important;
}

/* ── "بازی‌های مهم" button — tricolor border ── */
[data-theme="dark"] .important-title {
  background: linear-gradient(#FFFFFF, #FFFFFF) padding-box,
              linear-gradient(to right, #1B3A8C, #D42B2B, #167A33) border-box !important;
  border: 2px solid transparent !important;
  border-radius: 9999px !important;
  box-shadow: none !important;
}
[data-theme="dark"] .important-title > span {
  background: transparent !important;
  color: #111827 !important;
}

/* ── Vibrant match cards (top carousel) — deep WC navy/red/green ── */
[data-theme="dark"] .from-\[\#FF9DD6\]\/90 { --tw-gradient-from: #0D2060 !important; }
[data-theme="dark"] .from-\[\#5BC8FF\]\/90 { --tw-gradient-from: #0D2060 !important; }
[data-theme="dark"] .from-\[\#6FE0D0\]\/90 { --tw-gradient-from: #0D2060 !important; }
[data-theme="dark"] .from-\[\#7B8CFF\]\/90 { --tw-gradient-from: #0D2060 !important; }

[data-theme="dark"] .via-\[\#FF6FB0\]\/85 { --tw-gradient-via: #8C1C1C !important; }
[data-theme="dark"] .via-\[\#8C9BFF\]\/85 { --tw-gradient-via: #8C1C1C !important; }
[data-theme="dark"] .via-\[\#5B9CFF\]\/85 { --tw-gradient-via: #8C1C1C !important; }
[data-theme="dark"] .via-\[\#B07CFF\]\/85 { --tw-gradient-via: #8C1C1C !important; }

[data-theme="dark"] .to-\[\#9D6BFF\]\/90 { --tw-gradient-to: #0A2010 !important; }
[data-theme="dark"] .to-\[\#D17BFF\]\/90 { --tw-gradient-to: #0A2010 !important; }
[data-theme="dark"] .to-\[\#8B7CFF\]\/90 { --tw-gradient-to: #0A2010 !important; }
[data-theme="dark"] .to-\[\#FF7DC9\]\/90 { --tw-gradient-to: #0A2010 !important; }

[data-theme="dark"] .ring-white\/20      { --tw-ring-color: rgba(255,255,255,0.18) !important; }
[data-theme="dark"] .from-white\/35      { --tw-gradient-from: rgba(255,255,255,0.06) !important; }

/* Vibrant card text stays white */
[data-theme="dark"] .from-\[\#FF9DD6\]\/90 ~ * .text-white,
[data-theme="dark"] .from-\[\#5BC8FF\]\/90 ~ * .text-white { color: #FFFFFF !important; }

/* ── Match list container (lb-rank-pill) — white card ── */
[data-theme="dark"] .lb-rank-pill {
  background: rgba(255,255,255,0.82) !important;
  border: 1px solid #DDE2EF !important;
  box-shadow: 0 4px 24px rgba(17,24,39,0.08), 0 1px 3px rgba(17,24,39,0.05) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Group label inside match list — light grey pill */
[data-theme=dark] .lb-rank-pill span.rounded-full {
  background-color: #F0F3FA !important;
  color: #6B7693 !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}

/* Match row text: dark on white */
[data-theme="dark"] .lb-rank-pill button span.text-white,
[data-theme="dark"] .lb-rank-pill button .text-white {
  color: #111827 !important;
}
[data-theme="dark"] .lb-rank-pill > p.text-white,
[data-theme="dark"] .lb-rank-pill > .text-white:not(button *) {
  color: #ffffff !important;
}
[data-theme="dark"] .lb-rank-pill button:not([disabled]):hover {
  background-color: rgba(27,58,140,0.05) !important;
}
[data-theme="dark"] .lb-rank-pill button {
  border-radius: 14px !important;
}

/* Score: green like reference */
[data-theme="dark"] .lb-rank-pill .text-\[\#11041d\] {
  color: #167A33 !important;
  font-weight: 900 !important;
}

/* Live badge inside white card */
[data-theme="dark"] .lb-rank-pill .bg-\[\#11041d\]\/85 {
  background-color: rgba(22,122,51,0.10) !important;
  color: #167A33 !important;
}
[data-theme="dark"] .lb-rank-pill .bg-\[\#11041d\]\/40 {
  background-color: rgba(17,24,39,0.08) !important;
  color: #111827 !important;
}
[data-theme="dark"] .lb-rank-pill .live-dot {
  background-color: #167A33 !important;
}

/* Team flag ring inside white card — blue */
[data-theme=dark] .lb-rank-pill .match-flag-squircle {
  box-shadow:
    0 0 0 1.5px rgba(27,58,140,0.45),
    0 2px 6px rgba(0,0,0,0.12) !important;
}



/* ── Date tabs ── */
[data-theme="dark"] .bg-lb-purple.rounded-full {
  background-color: #1B3A8C !important;
}

/* ── Primary accent = navy ── */
[data-theme="dark"] .bg-lb-purple      { background-color: #1B3A8C !important; }
[data-theme="dark"] .text-lb-purple    { color: #2D5BE3 !important; }
[data-theme="dark"] .border-lb-purple  { border-color: #1B3A8C !important; }
[data-theme="dark"] .bg-lb-purpleDeep  { background-color: #E8EDF8 !important; }
[data-theme="dark"] .bg-lb-purple\/15 { background-color: rgba(27,58,140,0.10) !important; }
[data-theme="dark"] .bg-lb-purple\/20 { background-color: rgba(27,58,140,0.12) !important; }

[data-theme="dark"] .bg-lb-cyan        { background-color: #4A7BFF !important; }
[data-theme="dark"] .text-lb-cyan      { color: #2D5BE3 !important; }
[data-theme="dark"] .bg-lb-cyan\/15   { background-color: rgba(74,123,255,0.10) !important; }
[data-theme="dark"] .bg-lb-cyan\/10   { background-color: rgba(74,123,255,0.08) !important; }
[data-theme="dark"] .border-lb-cyan    { border-color: #4A7BFF !important; }
[data-theme="dark"] .ring-lb-cyan      { --tw-ring-color: #4A7BFF !important; }
[data-theme="dark"] .ring-lb-purple    { --tw-ring-color: #09732d !important; }

/* Pink slot → green */
[data-theme="dark"] .bg-lb-pink        { background-color: #167A33 !important; }
[data-theme="dark"] .text-lb-pink      { color: #167A33 !important; }
[data-theme="dark"] .ring-lb-pink      { --tw-ring-color: #167A33 !important; }

/* WIN = GREEN */
[data-theme="dark"] .bg-wc-live        { background-color: #167A33 !important; }
[data-theme="dark"] .text-wc-live      { color: #167A33 !important; }

/* LIVE/DANGER = RED */
[data-theme="dark"] .bg-wc-primary     { background-color: #D42B2B !important; }
[data-theme="dark"] .text-wc-primary   { color: #D42B2B !important; }

/* ── Bottom nav — white floating pill ── */
[data-theme="dark"] .dock-nav {
  background: #B62326 !important;
  border-color: #B62326 !important;
  box-shadow:
    0 -4px 24px rgba(17,24,39,0.10),
    0 -1px 0 rgba(17,24,39,0.06) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}
[data-theme="dark"] .dock-item-active {
  background: #1B3A8C !important;
  box-shadow: 0 4px 16px rgba(27,58,140,0.40) !important;
}
[data-theme="dark"] .dock-item-active::after {
  background: #1B3A8C !important;
}
/* Active icon colour = white */
[data-theme="dark"] .dock-item-active .text-wc-bg,
[data-theme="dark"] .dock-item-active svg { color: #FFFFFF !important; stroke: #FFFFFF !important; }

/* Inactive icons = dark */
[data-theme="dark"] .bg-\[\#1E1E1E\] {
  background-color: transparent !important;
}
[data-theme="dark"] .dock-nav .text-white { color: #ffffff !important; }

/* ── Podium (leaderboard) ── */
[data-theme="dark"] .podium-burst {
  background: repeating-conic-gradient(
    from 0deg,
    rgba(245,200,75,0.22) 0deg 4deg,
    transparent 4deg 18deg
  ) !important;
}
[data-theme="dark"] .podium-glow {
  background: radial-gradient(circle, rgba(245,200,75,0.30) 0%, transparent 70%) !important;
}

/* ── Leaderboard surface ── */
[data-theme="dark"] .bg-\[\#1c1c1e\] {
  background-color: #FFFFFF !important;
  border-color: #DDE2EF !important;
}

/* ── Profile / settings ── */
[data-theme="dark"] .bg-\[\#2c2c2e\],
[data-theme="dark"] .bg-\[\#3a3a3c\] {
  background-color: #F0F3FA !important;
}
[data-theme="dark"] .border-\[\#3a3a3c\] { border-color: #DDE2EF !important; }
[data-theme="dark"] .bg-\[\#3a3a3c\].text-white { color: #111827 !important; }

/* ── Splash / loaders ── */
[data-theme="dark"] .splash-dot.bg-wc-gold { background-color: #1B3A8C !important; }

/* ── Vibrant card dark fallback → WC navy blue→red ── */
[data-theme="dark"] .from-\[\#2c2c2e\] { --tw-gradient-from: #1B3A8C !important; }
[data-theme="dark"] .to-\[\#242426\]   { --tw-gradient-to:   #8C1C1C !important; }

/* Force background-image directly for specificity */
[data-theme="dark"] .bg-gradient-to-br.from-\[\#2c2c2e\] {
  background-image: linear-gradient(to bottom right, #1B3A8C, #8C1C1C) !important;
}

/* Avatar ring: WC tricolor */
[data-theme="dark"] .from-\[\#7c5cfc\] { --tw-gradient-from: #1B3A8C !important; }
[data-theme="dark"] .to-\[\#5ee6e0\]   { --tw-gradient-to:   #167A33 !important; }
[data-theme="dark"] .bg-gradient-to-br.from-\[\#7c5cfc\] {
  background-image: linear-gradient(to bottom right, #1B3A8C, #167A33) !important;
}

/* ── Profile verified badge: green ── */

/* ── Profile: badge + avatar ring + edit button → green ── */
[data-theme="dark"] svg.lucide-badge-check,
[data-theme="dark"] svg.shrink-0.text-lb-purple {
  color: #09732d !important;
}
[data-theme="dark"] img.ring-lb-purple,
[data-theme="dark"] .ring-\[3px\].ring-lb-purple {
  --tw-ring-color: #09732d !important;
  box-shadow: 0 0 0 3px #09732d !important;
}
[data-theme="dark"] .bg-lb-purple.text-white.rounded-full {
  background-color: #09732d !important;
}

/* ── Leaderboard: sun burst → green, rank pill → WC blue ── */
[data-theme="dark"] .podium-burst {
  background-image: repeating-conic-gradient(
    rgba(182, 35, 38, 0.30) 0deg, rgba(182, 35, 38, 0.30) 4deg,
    rgba(0, 0, 0, 0) 4deg, rgba(0, 0, 0, 0) 10deg
  ) !important;
}
[data-theme="dark"] .podium-glow {
  background: radial-gradient(circle, rgba(182, 35, 38, 0.28) 0%, rgba(0,0,0,0) 70%) !important;
}
[data-theme="dark"] .lb-rank-pill {
  background: linear-gradient(135deg, #1B3A8C 0%, #0d2a6e 100%) !important;
  border: none !important;
  color: #ffffff !important;
}
[data-theme="dark"] .lb-rank-pill,
[data-theme="dark"] .lb-rank-pill *,
[data-theme="dark"] .lb-rank-pill span,
[data-theme="dark"] .lb-rank-pill p,
[data-theme="dark"] .lb-rank-pill div {
  color: #ffffff !important;
}

/* ── Match rows in dark theme: white text + white flag ring ── */
/* Team names */
[data-theme="dark"] .lb-rank-pill button .text-white,
[data-theme="dark"] .lb-rank-pill button span.text-white {
  color: #ffffff !important;
}
/* Score text */
[data-theme="dark"] .lb-rank-pill button .text-\[\#11041d\] {
  color: #ffffff !important;
  font-weight: 900 !important;
}

/* ── Flag ring in dark theme: white outline ── */
[data-theme="dark"] .match-flag-squircle,
[data-theme="dark"] .lb-rank-pill .match-flag-squircle {
  box-shadow:
    0 0 0 1.5px #ffffff,
    0 2px 6px rgba(0, 0, 0, 0.35) !important;
  outline: 1.5px solid #ffffff !important;
  outline-offset: 0px !important;
}

/* ── Lock icon: remove dark bg circle in dark theme ── */
[data-theme="dark"] .lb-rank-pill button span.rounded-full:has(svg.lucide-lock) {
  background-color: transparent !important;
}

/* ── Leaderboard rows + Profile menu: bold white cards ── */
[data-theme="dark"] .border-lb-border.bg-lb-surface,
[data-theme="dark"] .border-lb-border.bg-lb-surface.rounded-2xl {
  background-color: #ffffff !important;
  border-color: #DDE2EF !important;
  box-shadow: 0 2px 12px rgba(17, 24, 39, 0.10), 0 1px 3px rgba(17, 24, 39, 0.06) !important;
}
[data-theme="dark"] .border-lb-border.bg-lb-surface .text-lb-text {
  color: #111827 !important;
}
[data-theme="dark"] .border-lb-border.bg-lb-surface .text-lb-muted {
  color: #6B7693 !important;
}
[data-theme="dark"] .border-lb-border.bg-lb-surface .bg-lb-surface2 {
  background-color: #F0F3FA !important;
}
[data-theme="dark"] .border-lb-border.bg-lb-surface .text-lb-text.bg-lb-surface2,
[data-theme="dark"] .border-lb-border.bg-lb-surface span.bg-lb-surface2 {
  background-color: #F0F3FA !important;
  color: #111827 !important;
}

/* ── Profile menu icons: blue bg + white icon ── */
[data-theme="dark"] .bg-lb-surface2.text-lb-text.rounded-full {
  background-color: #1B3A8C !important;
  color: #ffffff !important;
}
[data-theme="dark"] .bg-lb-surface2.text-lb-text.rounded-full svg {
  color: #ffffff !important;
}

/* ── Profile menu icons: blue bg + white icon (override #3a3a3c rule) ── */
[data-theme="dark"] .h-9.w-9.rounded-full.bg-\[\#3a3a3c\] {
  background-color: #1B3A8C !important;
  color: #ffffff !important;
}
[data-theme="dark"] .h-9.w-9.rounded-full.bg-\[\#3a3a3c\] svg {
  color: #ffffff !important;
}

/* ── OtherBets selection chips: white on navy (bg-lb-purple/15 text-lb-purple) ── */
[data-theme="dark"] span.bg-lb-purple\/15.text-lb-purple {
  background-color: #1B3A8C !important;
  color: #ffffff !important;
}

/* ── SettingsListItem icon: navy bg + white icon ── */
[data-theme="dark"] .h-9.w-9.rounded-full.bg-lb-surface2.text-lb-text,
[data-theme="dark"] .h-9.w-9.rounded-full.bg-\[\#3a3a3c\].text-white {
  background-color: #1B3A8C !important;
  color: #ffffff !important;
}
[data-theme="dark"] .h-9.w-9.rounded-full.bg-lb-surface2.text-lb-text svg,
[data-theme="dark"] .h-9.w-9.rounded-full.bg-\[\#3a3a3c\].text-white svg {
  color: #ffffff !important;
}
/* ── important-title chip: red fill, no border, no spin ── */
[data-theme="dark"] .important-title {
  background: #B62326 !important;
  animation: none !important;
  padding: 0 !important;
}
[data-theme="dark"] .important-title > span {
  background: #B62326 !important;
  animation: none !important;
}
[data-theme="dark"] .important-title > span .text-white {
  color: #ffffff !important;
}



/* ── Home header notification icon: green icon, keep white bg ── */
[data-theme="dark"] a[href="/profile/notifications"] svg,
[data-theme="dark"] a[aria-label="اعلان‌ها"] svg {
  color: #09732d !important;
  stroke: #09732d !important;
}

/* ── Notification unread dot: yellow → red in dark theme ── */
[data-theme="dark"] .bg-wc-yellow.rounded-full {
  background-color: #B62326 !important;
}

/* ── MyPredictions page dark theme fixes ── */

/* 1. Active tab: purple → navy */
[data-theme="dark"] .bg-lb-purple.text-white.shadow {
  background-color: #1B3A8C !important;
  color: #ffffff !important;
}

/* ── SubPageHeader: purple bg → navy in dark theme ── */
[data-theme="dark"] header.sticky.bg-lb-bg\/90 {
  background-color: #1B3A8C !important;
}

/* ── SubPageHeader title: force white text on navy bg ── */
[data-theme="dark"] header.sticky h1 {
  color: #ffffff !important;
}

/* ── Invite page: gift icon bg → match card background ── */
[data-theme="dark"] .invite-gift-bg {
  background: linear-gradient(135deg, rgba(27,58,140,0.5), rgba(13,42,110,0.5)) !important;
}
/* Share button icon: white ── */
[data-theme="dark"] .lb-rank-pill.mt-3 svg,
[data-theme="dark"] button.lb-rank-pill svg {
  color: #ffffff !important;
  stroke: #ffffff !important;
}
/* Share button text: white */
[data-theme="dark"] button.lb-rank-pill {
  color: #ffffff !important;
}

/* ── Home avatar: remove gradient ring ── */
[data-theme="dark"] .from-\[\#7c5cfc\].to-\[\#5ee6e0\].rounded-full {
  background: transparent !important;
  padding: 0 !important;
}
[data-theme="dark"] .from-\[\#7c5cfc\].to-\[\#5ee6e0\].rounded-full .bg-lb-bg {
  background: transparent !important;
  padding: 0 !important;
}

/* ── Leaderboard: gold points → red (only in rank pill list) ── */
[data-theme="dark"] .lb-rank-pill .text-wc-gold,
[data-theme="dark"] span.font-extrabold.text-wc-gold {
  color: #B62326 !important;
}

/* ── Leaderboard podium: crown + badge + ring stay gold ── */
[data-theme="dark"] .text-wc-gold.drop-shadow-\[0_2px_6px_rgba\(0\,0\,0\,0\.35\)\] {
  color: #F5C84B !important;
}
[data-theme="dark"] .bg-wc-gold {
  background-color: #F5C84B !important;
}
[data-theme="dark"] .ring-wc-gold {
  --tw-ring-color: #F5C84B !important;
}

/* ── Podium top3: points text black, sun color = gold ── */
[data-theme="dark"] .podium-burst {
  background-image: repeating-conic-gradient(
    rgba(245, 200, 75, 0.30) 0deg, rgba(245, 200, 75, 0.30) 4deg,
    rgba(0, 0, 0, 0) 4deg, rgba(0, 0, 0, 0) 10deg
  ) !important;
}
[data-theme="dark"] .podium-glow {
  background: radial-gradient(circle, rgba(245, 200, 75, 0.28) 0%, rgba(0,0,0,0) 70%) !important;
}
[data-theme="dark"] .rounded-full.bg-white\/10.text-wc-gold {
  color: #111827 !important;
}

/* VIP price banner text stays white in light theme */
[data-theme="dark"] .bg-gradient-to-br.from-\[\#1B3A8C\] .text-white,
[data-theme="dark"] .bg-gradient-to-br.from-\[\#1B3A8C\] .text-white\/90,
[data-theme="dark"] .bg-gradient-to-br.from-\[\#1B3A8C\] .text-white\/80 { color: #ffffff !important; }

/* VIP payment method active tab stays white */
[data-theme="dark"] .bg-\[\#1B3A8C\].text-white { color: #ffffff !important; }

/* Match card vibrant team names stay white */
[data-theme="dark"] .from-\[\#FF9DD6\]\/90 span,
[data-theme="dark"] .from-\[\#5BC8FF\]\/90 span,
[data-theme="dark"] .from-\[\#6FE0D0\]\/90 span,
[data-theme="dark"] .from-\[\#7B8CFF\]\/90 span { color: #ffffff !important; }

/* VIP submit button text stays white */
[data-theme="dark"] .from-\[\#1B3A8C\].to-\[\#0d2a6e\].text-white { color: #ffffff !important; }
[data-theme="dark"] .from-\[\#1B3A8C\].to-\[\#0d2a6e\].text-white * { color: #ffffff !important; }