/* SportsLive PHP - Custom Styles */

/* Scrollbar hide */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Glass card */
.glass-card {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Dark mode active league button glass effect */
.dark .league-btn.active .league-active-bg-dark { display: block; }
.dark .league-btn.active .league-active-bg      { display: none; }
.league-btn.active .league-active-bg             { display: block; }
.league-btn.active .league-active-bg-dark        { display: none; }
.league-btn.active {
  border-color: rgba(255,255,255,0.4) !important;
  color: #111 !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}
.dark .league-btn.active {
  border-color: rgba(255,255,255,0.2) !important;
  color: #fff !important;
}

/* Timeline event icons */
.event-icon { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; font-size: 14px; }
.event-goal { background: #dcfce7; color: #16a34a; }
.event-yellow { background: #fef9c3; color: #ca8a04; }
.event-red { background: #fee2e2; color: #dc2626; }
.event-sub { background: #f0fdf4; color: #15803d; }
.event-var { background: #eff6ff; color: #2563eb; }
.dark .event-goal  { background: rgba(22,163,74,0.15); }
.dark .event-yellow { background: rgba(202,138,4,0.15); }
.dark .event-red    { background: rgba(220,38,38,0.15); }
.dark .event-sub    { background: rgba(21,128,61,0.15); }
.dark .event-var    { background: rgba(37,99,235,0.15); }

/* Match card hover */
.match-card { cursor: pointer; transition: transform 0.3s, box-shadow 0.3s; }
.match-card:hover { transform: translateY(-4px); }

/* Calendar day */
.cal-day { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; cursor: pointer; transition: background 0.15s; }
.cal-day:hover { background: rgba(0,0,0,0.08); }
.dark .cal-day:hover { background: rgba(255,255,255,0.08); }
.cal-day.today { font-weight: 700; border: 2px solid #111; }
.dark .cal-day.today { border-color: #fff; }
.cal-day.selected { background: #111; color: #fff; font-weight: 700; }
.dark .cal-day.selected { background: #fff; color: #111; }
.cal-day.has-matches::after { content: ''; display: block; width: 4px; height: 4px; border-radius: 50%; background: #3b82f6; margin: -3px auto 0; }

/* FDR colors */
.fdr-1 { background: #2dc653; color: #fff; }
.fdr-2 { background: #5cb85c; color: #fff; }
.fdr-3 { background: #e5e7eb; color: #374151; }
.fdr-4 { background: #f97316; color: #fff; }
.fdr-5 { background: #ef4444; color: #fff; }

/* Animate spin (for loading) */
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Shimmer skeleton */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.skeleton {
  background: linear-gradient(90deg, rgba(0,0,0,0.04) 25%, rgba(0,0,0,0.08) 50%, rgba(0,0,0,0.04) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}
.dark .skeleton {
  background: linear-gradient(90deg, rgba(255,255,255,0.04) 25%, rgba(255,255,255,0.08) 50%, rgba(255,255,255,0.04) 75%);
  background-size: 200% 100%;
}

/* FPL DR colors */
.fdr-cell { border-radius: 6px; padding: 4px 8px; font-size: 11px; font-weight: 700; text-align: center; }

/* Standings note pip */
.standing-note { width: 4px; height: 40px; border-radius: 2px; }