/* ============================================================
   WilsonBet Gold Theme — purple bg + gold accents
   ============================================================ */

:root {
  --gold:        #c9a84c;
  --gold-light:  #f0d060;
  --gold-dark:   #8b6914;
  --gold-glow:   rgba(201, 168, 76, 0.45);
  --gold-grad:   linear-gradient(135deg, #8b6914 0%, #f0d060 50%, #8b6914 100%);
  --gold-shimmer:linear-gradient(90deg, #8b6914 0%, #f0d060 40%, #fffbe0 55%, #f0d060 70%, #8b6914 100%);
  --bg-deep:     #4b1c48;
  --bg-mid:      #3a1538;
  --bg-card:     #5c2258;
  --bg-card2:    #301030;
  --purple-glow: rgba(75, 28, 72, 0.6);
}

/* ── Base ── */
body {
  background: var(--bg-deep) !important;
  background-image: radial-gradient(ellipse at top, #6b2866 0%, #4b1c48 60%) !important;
}
body::before {
  background-image: radial-gradient(circle at center, #6b2866 0, transparent 66.66%) !important;
}

/* ── Header top bar ── */
.header-top {
  background: linear-gradient(to bottom, rgba(201,168,76,0.08), rgba(255,255,255,0.04)) !important;
  border-bottom: 1px solid rgba(201,168,76,0.3) !important;
  box-shadow: 0 2px 16px rgba(201,168,76,0.08);
}
.header-text,
.header-text a {
  color: rgba(255,255,255,0.85) !important;
}
.header-text a {
  color: var(--gold) !important;
  font-weight: 700;
}
.header-top svg {
  color: var(--gold) !important;
  opacity: 0.8;
}
.header-top svg:hover {
  color: var(--gold-light) !important;
  opacity: 1;
  filter: drop-shadow(0 0 6px var(--gold-glow));
}

/* ── Logo ── */
header .logo img {
  filter: drop-shadow(0 0 8px var(--gold-glow));
}

/* ── Nav menu icons — gold + glow ── */
header ul li a {
  color: rgba(201,168,76,0.5) !important;
  transition: color 200ms ease, text-shadow 200ms ease !important;
}
header ul li a.active,
header ul li a:hover,
header ul li.blink a {
  color: var(--gold) !important;
  text-shadow: 0 0 10px var(--gold-glow), 0 0 20px rgba(201,168,76,0.25);
}
header ul li a i {
  color: inherit;
  transition: color 200ms ease, filter 200ms ease;
}
header ul li a.active i,
header ul li a:hover i,
header ul li.blink a i {
  filter: drop-shadow(0 0 6px var(--gold-glow));
}

/* blink animation keeps gold */
@keyframes blinkmenu {
  0%,100% { transform: scale(1);   color: var(--gold); }
  50%      { transform: scale(1.4); color: var(--gold-light); filter: drop-shadow(0 0 8px var(--gold-glow)); }
}

/* ── guncel adres bar ── */
.guncel-adres {
  background: linear-gradient(135deg, rgba(201,168,76,0.12), rgba(201,168,76,0.04)) !important;
  border: 1px solid rgba(201,168,76,0.35) !important;
  box-shadow: 0 0 12px rgba(201,168,76,0.1), inset 0 0 20px rgba(201,168,76,0.03);
}

/* ── Channel slider arrows ── */
.channel-left svg,
.channel-right svg {
  color: var(--gold) !important;
  filter: drop-shadow(0 0 6px var(--gold-glow));
}
.channel-area svg .icon-aktif  { opacity: 1   !important; }
.channel-area svg .icon-pasif  { opacity: 0.4 !important; }

/* ── Single channel card ── */
.single-channel {
  background: linear-gradient(135deg, rgba(255,255,255,0.04), rgba(201,168,76,0.07)) !important;
  border: 1px solid rgba(201,168,76,0.25) !important;
  box-shadow: 0 0 10px rgba(201,168,76,0.08), inset 0 0 30px rgba(100,50,180,0.1);
  transition: border-color 200ms ease, box-shadow 200ms ease;
}
.single-channel:hover,
.single-channel.active {
  border-color: var(--gold) !important;
  box-shadow: 0 0 18px var(--gold-glow), 0 0 6px rgba(201,168,76,0.5), inset 0 0 30px rgba(201,168,76,0.07) !important;
}

/* ── Live list container ── */
.live-list {
  border: 1px solid rgba(201,168,76,0.4) !important;
  box-shadow: 0 0 20px rgba(201,168,76,0.12), inset 0 0 40px rgba(100,50,180,0.08);
  background: var(--bg-card) !important;
}

/* ── List head (tab headers) ── */
.list-head {
  background: linear-gradient(135deg, rgba(201,168,76,0.15), rgba(201,168,76,0.04)) !important;
  border-bottom: 1px solid rgba(201,168,76,0.3) !important;
  color: var(--gold) !important;
}
.list-head svg {
  color: var(--gold) !important;
  fill: var(--gold) !important;
  filter: drop-shadow(0 0 4px var(--gold-glow));
}
.list-head > div,
.list-head > span {
  color: var(--gold) !important;
}

/* live blink dot stays red */
.list-blink {
  background: #ff3333 !important;
  box-shadow: 0 0 6px rgba(255,50,50,0.6);
}

/* ── Tab buttons (Canlı / Programlı) ── */
[data-focustab] {
  color: rgba(201,168,76,0.4) !important;
}
[data-focustab]:hover {
  background: linear-gradient(to bottom, rgba(201,168,76,0.08), transparent) !important;
  color: var(--gold) !important;
}
[data-focustab].active {
  color: var(--gold) !important;
  border-bottom-color: var(--gold) !important;
  background: linear-gradient(to bottom, rgba(201,168,76,0.15), transparent) !important;
  text-shadow: 0 0 8px var(--gold-glow);
}

/* ── Sport icon tabs (left sidebar) ── */
.list-tabbed > div {
  color: rgba(201,168,76,0.3) !important;
  border-bottom: 1px solid rgba(201,168,76,0.1) !important;
}
.list-tabbed svg {
  fill: rgba(201,168,76,0.35) !important;
}
.list-tabbed > div.active {
  background: radial-gradient(circle at center, rgba(201,168,76,0.2), transparent) !important;
}
.list-tabbed > div.active svg {
  fill: var(--gold) !important;
  filter: drop-shadow(0 0 4px var(--gold-glow));
}
.list-tabbed {
  border-right: 1px solid rgba(201,168,76,0.2) !important;
}

/* ── Match search input ── */
.match-search {
  border-bottom: 1px solid rgba(201,168,76,0.25) !important;
}
.match-search input {
  background-color: rgba(100,50,180,0.1) !important;
  color: #fff !important;
}
.match-search input::placeholder {
  color: rgba(201,168,76,0.5) !important;
}

/* ── Single match row ── */
.single-match:nth-child(odd) {
  background: linear-gradient(135deg, rgba(201,168,76,0.04), rgba(100,50,180,0.08)) !important;
}
.single-match:hover,
.single-match.active {
  background: linear-gradient(135deg, var(--gold-dark), #c9a84c) !important;
  box-shadow: 0 0 14px var(--gold-glow);
}
.single-match:hover .event,
.single-match:hover .date,
.single-match:hover .teams,
.single-match.active .event,
.single-match.active .date,
.single-match.active .teams {
  color: #1a0a2e !important;
}
.single-match:hover svg,
.single-match.active svg {
  fill: #1a0a2e !important;
}
.single-match svg {
  fill: rgba(201,168,76,0.4) !important;
}
.match-detail .date {
  color: rgba(201,168,76,0.7) !important;
}
.match-detail .event {
  color: rgba(201,168,76,0.4) !important;
}
.match-detail .teams {
  color: rgba(255,255,255,0.9) !important;
}

/* ── Head grid (tab selector Live/Scheduled) ── */
.head-grid {
  background: radial-gradient(circle at center, rgba(201,168,76,0.12), transparent) !important;
}
.head-grid > div {
  border-bottom: 1px solid rgba(201,168,76,0.25) !important;
}
.head-grid > div:hover {
  background: rgba(201,168,76,0.08);
}
.vertical-line {
  background: linear-gradient(to bottom, transparent, var(--gold), transparent) !important;
}

/* ── Live results ticker ── */
.live-results {
  border: 1px solid rgba(201,168,76,0.3) !important;
  background: linear-gradient(135deg, rgba(201,168,76,0.06), rgba(100,50,180,0.15)) !important;
  box-shadow: 0 0 12px rgba(201,168,76,0.08);
}
.live-results .title {
  background: rgba(201,168,76,0.12) !important;
  color: var(--gold) !important;
  border-right: 1px solid rgba(201,168,76,0.3);
}

/* ── Live player wrapper ── */
.live-player {
  border-radius: 8px;
  box-shadow: 0 0 30px rgba(201,168,76,0.2), 0 0 60px rgba(100,50,180,0.2);
}
.plyr--video {
  border: 1px solid rgba(201,168,76,0.35) !important;
  box-shadow: 0 0 20px var(--gold-glow) !important;
}

/* ── Odds container ── */
.odds-container {
  border: 1px solid rgba(201,168,76,0.35) !important;
  background: var(--bg-card2) !important;
  box-shadow: 0 0 16px rgba(201,168,76,0.1);
}
.odds-container .list-head {
  border-bottom: 1px solid rgba(201,168,76,0.25) !important;
}
.single-bet > div:not(:first-child):hover {
  background: var(--gold) !important;
  color: #1a0a2e !important;
  border-color: var(--gold) !important;
}
.single-bet > div {
  border-color: rgba(201,168,76,0.2) !important;
}
.single-bet > div:first-child {
  background: rgba(201,168,76,0.1) !important;
}

/* ── News area ── */
.news-area .list-head {
  border: 1px solid rgba(201,168,76,0.3) !important;
  border-bottom: none !important;
}
.news-list {
  border: 1px solid rgba(201,168,76,0.25) !important;
}
.news-content {
  border: 1px solid rgba(201,168,76,0.25) !important;
}
.single-news:nth-child(odd) {
  background: linear-gradient(135deg, transparent, rgba(201,168,76,0.06)) !important;
}
.single-news:hover {
  background: linear-gradient(135deg, var(--gold-dark), var(--gold)) !important;
}
.single-news:hover .news-title,
.single-news:hover .news-date {
  color: #1a0a2e !important;
}

/* ── Footer links ── */
.footer-links a {
  border: 1px solid rgba(201,168,76,0.25) !important;
  color: rgba(201,168,76,0.8) !important;
  transition: border-color 200ms ease, box-shadow 200ms ease;
}
.footer-links a:hover {
  border-color: var(--gold) !important;
  box-shadow: 0 0 10px var(--gold-glow);
  color: var(--gold) !important;
}

/* ── list-count badge ── */
.list-count {
  background: linear-gradient(135deg, var(--gold-dark), var(--gold)) !important;
  color: #1a0a2e !important;
  animation: none !important;
}
[data-tabbed=next] .list-count {
  background: linear-gradient(135deg, #fff, #f0d060) !important;
  color: #1a0a2e !important;
}

/* ── Blog posts ── */
.single-blog::after {
  background: linear-gradient(to bottom, rgba(16,7,32,0.2), rgba(16,7,32,0.9)) !important;
}

/* ── Radar / stat widgets ── */
.radar-tabhead {
  border: 1px solid rgba(201,168,76,0.25) !important;
}
.radar-tabhead > div:hover,
.radar-tabhead > div.active {
  background: rgba(201,168,76,0.12) !important;
  color: var(--gold) !important;
}

/* ── Scrollbar gold tint ── */
*::-webkit-scrollbar-thumb {
  background: linear-gradient(to bottom, var(--gold), var(--gold-dark)) !important;
}
*::-webkit-scrollbar-track {
  background: rgba(201,168,76,0.06) !important;
}

/* ── Glide (channel carousel) dots ── */
.glide__bullet--active,
.glide__bullet:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
}
.glide__bullet {
  background: rgba(201,168,76,0.3) !important;
  border-color: rgba(201,168,76,0.3) !important;
}

/* ── Mobile bottom nav ── */
@media only screen and (max-width: 1024px) {
  .nav-tabs {
    background: linear-gradient(to top, #100720, #180b2e) !important;
    border-top: 1px solid rgba(201,168,76,0.35) !important;
    box-shadow: 0 -4px 20px rgba(201,168,76,0.1);
  }
  .nav-tabs > li > a {
    color: rgba(201,168,76,0.5) !important;
  }
  .nav-tabs > li.active > a,
  .nav-tabs > li > a:hover {
    color: var(--gold) !important;
  }
  .nav-tabs > li > a::after {
    background: var(--gold) !important;
  }
  header ul {
    background: transparent !important;
    padding: 0 !important;
  }
}

/* ── Subtle gold shimmer animation on borders ── */
@keyframes goldShimmer {
  0%   { box-shadow: 0 0 8px  rgba(201,168,76,0.3); }
  50%  { box-shadow: 0 0 20px rgba(201,168,76,0.6), 0 0 40px rgba(201,168,76,0.2); }
  100% { box-shadow: 0 0 8px  rgba(201,168,76,0.3); }
}
.live-list,
.plyr--video,
.live-player {
  animation: goldShimmer 3s ease-in-out infinite;
}

/* ── Mobile bg override ── */
@media only screen and (max-width: 1200px) {
  body {
    background-color: #4b1c48 !important;
    background: linear-gradient(135deg, #4b1c48, #3a1538) !important;
  }
}
