/* CPSL 2025 custom styles */
:root {
  --cpsl-accent: #0d6efd; /* Bootstrap primary blue */
}

.hero-banner {
  background: linear-gradient(135deg, rgba(13,110,253,.18), rgba(13,202,240,.12));
}

.card-stat {
  transition: transform .1s ease-in-out, box-shadow .1s ease-in-out;
}
.card-stat:hover {
  transform: translateY(-2px);
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.075);
}

.top-4 {
 
  outline-offset: -2px;
  border-radius: .25rem;
}

.table thead th.sortable { cursor: default; }
.table thead th.sortable:after { content: none; }

/* Dark mode tweaks are mostly handled by Bootstrap's data-bs-theme */

/* Utility for placeholder logos */
.logo-ph {
  width: 52px; height: 52px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(13,110,253,.08); color: rgba(13,110,253,.85);
  font-weight: 700;
}
[data-bs-theme="dark"] .team-logo { filter: none; }

/* Team logo image for fixtures/cards */
.team-logo {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  display: inline-block;
  border: 1px solid rgba(0,0,0,.1);
}
[data-bs-theme="dark"] .logo-ph {
  background: rgba(13,110,253,.2); color: #e7f1ff;
}

/* Mobile spacing improvements */
.navbar .navbar-brand { letter-spacing: .2px; }
.card .badge { font-weight: 600; }
.table { font-size: .95rem; }

/* Primary navbar styling */
.navbar.bg-body { background-color: var(--cpsl-accent) !important; }
.navbar.bg-body .navbar-brand,
.navbar.bg-body .nav-link,
.navbar.bg-body .navbar-toggler { color: #fff !important; }
.navbar.bg-body .nav-link { opacity: .85; }
.navbar.bg-body .nav-link:hover, .navbar.bg-body .nav-link.active { opacity: 1; text-decoration: underline; text-underline-offset: 4px; }
.navbar .navbar-toggler-icon { filter: invert(1); }

/* Last 5 form dots */
.form-dot { display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:6px; }
.form-win { background-color: #198754; }
.form-draw { background-color: #6c757d; }
.form-loss { background-color: #dc3545; }

/* Panel header (e.g., Top Scorers) */
.panel-header {
  background: var(--cpsl-accent);
  color: #fff;
  padding: .5rem .75rem;
  border-radius: .5rem;
  font-weight: 600;
}

/* Players table: equal column widths and centered content */
#playersTable {
  width: 100%;
  table-layout: fixed; /* make columns equal with explicit widths */
}

#playersTable th,
#playersTable td {
  text-align: center;
  vertical-align: middle;
}

/* Align Player left and Goals right */
#playersTable th:nth-child(1),
#playersTable td:nth-child(1) { text-align: left; }

#playersTable th:nth-child(3),
#playersTable td:nth-child(3) { text-align: right; }

#playersTable th:nth-child(1),
#playersTable td:nth-child(1),
#playersTable th:nth-child(2),
#playersTable td:nth-child(2),
#playersTable th:nth-child(3),
#playersTable td:nth-child(3) {
  width: 33.33%;
}

/* Standings table mobile auto-fit without hiding columns */
@media (max-width: 575.98px) {
  #standingsTable {
    width: 100%;
    table-layout: fixed; /* stabilize widths and allow Team to take remaining space */
  }

  #standingsTable th,
  #standingsTable td {
    padding: .3rem;
    font-size: .78rem;
    vertical-align: middle;
  }

  /* Pos column narrow and centered */
  #standingsTable th:nth-child(1),
  #standingsTable td:nth-child(1) {
    width: 28px;
    text-align: center;
    white-space: nowrap;
  }

  /* Team column: allow wrapping, no truncation */
  #standingsTable th:nth-child(2),
  #standingsTable td:nth-child(2) {
    white-space: normal; /* allow line wrap */
    word-break: break-word;
  }

  /* Compact numeric columns (P, W, D, L, GF, GA, GD, PTS) with fixed narrow widths */
  #standingsTable th:nth-child(3), #standingsTable td:nth-child(3),
  #standingsTable th:nth-child(4), #standingsTable td:nth-child(4),
  #standingsTable th:nth-child(5), #standingsTable td:nth-child(5),
  #standingsTable th:nth-child(6), #standingsTable td:nth-child(6),
  #standingsTable th:nth-child(7), #standingsTable td:nth-child(7),
  #standingsTable th:nth-child(8), #standingsTable td:nth-child(8),
  #standingsTable th:nth-child(9), #standingsTable td:nth-child(9),
  #standingsTable th:nth-child(10), #standingsTable td:nth-child(10) {
    width: 28px;
    text-align: center;
    white-space: nowrap;
  }

  /* Last 5 keep tight spacing but allow on one line */
  #standingsTable th:nth-child(11),
  #standingsTable td:nth-child(11) {
    white-space: nowrap;
  }
}