/* app/assets/stylesheets/application.css */

/* Premier League brand colours */
:root {
  --pl-purple: #38003c;
  --pl-green:  #00ff85;
  --pl-pink:   #ff2882;
}

/* Smooth tap feedback on mobile */
.btn, .list-group-item-action, .card {
  -webkit-tap-highlight-color: transparent;
}

/* Team crest images */
.team-crest {
  object-fit: contain;
  border-radius: 4px;
}

/* Leaderboard rank numbers */
.rank-medal {
  font-size: 1.3rem;
  min-width: 2rem;
  text-align: center;
}

/* Status badges */
.badge.status-active   { background-color: #00875a; }
.badge.status-pending  { background-color: #6c757d; }
.badge.status-drafting { background-color: #ffc107; color: #212529; }
.badge.status-finished { background-color: #212529; }

/* Bottom nav active state */
.bottom-nav-active {
  color: var(--pl-purple) !important;
  font-weight: 600;
}

/* Pill nav for draft room */
.nav-pills .nav-link {
  font-size: 0.85rem;
  padding: 0.4rem 0.75rem;
}

.nav-pills .nav-link.active {
  background-color: var(--pl-purple);
}

/* Prevent double-tap zoom on buttons (iOS) */
button, a {
  touch-action: manipulation;
}

/* Tighter card body on mobile */
@media (max-width: 576px) {
  .card-body {
    padding: 0.75rem;
  }
}

/* Draft room — pulsing banner when timer is almost up */
@keyframes draft-pulse {
  0%   { opacity: 1;    transform: scale(1); }
  50%  { opacity: 0.75; transform: scale(1.02); }
  100% { opacity: 1;    transform: scale(1); }
}

.draft-urgent {
  animation: draft-pulse 0.8s ease-in-out infinite;
  background-color: #dc3545 !important;
  color: #fff !important;
}

/* Monospace countdown digits don't shift layout as numbers change */
.font-monospace {
  font-variant-numeric: tabular-nums;
}

/* ── Match row grid ────────────────────────────────────────────────────────────
   Used in Recent Results and Upcoming Fixtures lists on the group page,
   and in the roster match breakdown under each team.

   Four fixed columns:
     home team name  |  score/vs  |  away team name  |  date/time
   The centre two columns are pinned widths so the score and date always
   land at the same x-position regardless of team name length.
   home and away columns share the remaining space equally.
────────────────────────────────────────────────────────────────────────────── */
.match-row {
  display: grid;
  grid-template-columns: 1fr 3.4rem 1fr 5.2rem;
  gap: 0 0.4rem;
  align-items: center;
}

.match-home  { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.match-away  { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.match-score { text-align: center; white-space: nowrap; }
.match-meta  { text-align: right;  font-size: 0.72rem; white-space: nowrap; }