/* Survivor Liga MX — tema oscuro fútbol mexicano */
:root {
  --mx-verde: #006847;
  --mx-rojo: #CE1126;
  --mx-oro: #FFB81C;
  --mx-bg: #0c1116;
  --mx-panel: #141c24;
  --mx-panel2: #1b2530;
  --mx-borde: #2a3a49;
  --mx-texto: #e8eef4;
}
html, body { background: var(--mx-bg); color: var(--mx-texto); font-family: 'Barlow', sans-serif; }
h1,h2,h3,h4,h5,.font-titulo { font-family: 'Oswald','Barlow Condensed',sans-serif; text-transform: uppercase; letter-spacing: .5px; }
.num { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; }

.navbar-mx {
  background: linear-gradient(90deg, #05261d 0%, var(--mx-verde) 45%, #7c0a18 100%);
  border-bottom: 3px solid var(--mx-oro);
}
.navbar-mx .navbar-brand { font-family: 'Oswald'; font-size: 1.25rem; color: #fff; }
.brand-txt b { color: var(--mx-oro); }
.navbar-mx .nav-link { color: #e8f5ef; font-family: 'Barlow Condensed'; font-size: 1.05rem; text-transform: uppercase; }
.navbar-mx .nav-link:hover { color: var(--mx-oro); }
.main-wrap { max-width: 1400px; }

.card, .modal-content { background: var(--mx-panel); border: 1px solid var(--mx-borde); }
.card-header { background: var(--mx-panel2); border-bottom: 1px solid var(--mx-borde); font-family: 'Oswald'; text-transform: uppercase; }
.table { --bs-table-bg: transparent; }

.vida-on { color: #ff4d5e; text-shadow: 0 0 6px rgba(255,77,94,.5); }
.vida-off { color: #4a5561; }

/* Tarjetas de estadística (dashboard) */
.stat-card { border-left: 4px solid var(--mx-oro); }
.stat-card .stat-num { font-family: 'Barlow Condensed'; font-size: 2.4rem; font-weight: 700; line-height: 1; }
.stat-card .stat-label { text-transform: uppercase; font-size: .8rem; opacity: .7; letter-spacing: 1px; }

/* Partido / tarjeta de pick */
.partido-card { background: var(--mx-panel); border: 1px solid var(--mx-borde); border-radius: 12px; overflow: hidden; }
.partido-head { background: var(--mx-panel2); font-family: 'Barlow Condensed'; font-size: .95rem; padding: .35rem .8rem; display: flex; justify-content: space-between; }
.equipo-btn {
  display: flex; flex-direction: column; align-items: center; gap: .35rem;
  width: 100%; padding: .8rem .4rem; background: transparent; border: 2px solid transparent;
  border-radius: 10px; color: var(--mx-texto); transition: all .15s; cursor: pointer;
}
.equipo-btn img { width: 56px; height: 56px; object-fit: contain; }
.equipo-btn .eq-nombre { font-family: 'Barlow Condensed'; font-weight: 600; font-size: 1.05rem; line-height: 1.1; text-align: center; }
.equipo-btn .eq-momio { font-size: .8rem; opacity: .75; }
.equipo-btn:hover:not(:disabled) { border-color: var(--eq-color, var(--mx-oro)); background: rgba(255,255,255,.04); }
.equipo-btn.seleccionado { border-color: var(--mx-oro); background: rgba(255,184,28,.12); box-shadow: 0 0 12px rgba(255,184,28,.25); }
.equipo-btn:disabled, .equipo-btn.usado { opacity: .35; cursor: not-allowed; filter: grayscale(.8); }
.eq-usado-tag { font-size: .7rem; color: #ff8a94; text-transform: uppercase; }
.vs-tag { font-family: 'Oswald'; opacity: .5; }
.momio-empate { font-size: .78rem; opacity: .6; }

/* Countdown */
.countdown { font-family: 'Barlow Condensed'; font-size: 1.6rem; font-weight: 700; letter-spacing: 1px; }
.countdown.urgente { color: #ff4d5e; animation: parpadeo 1s infinite; }
@keyframes parpadeo { 50% { opacity: .45; } }

/* Chuleta */
.chuleta-wrap { overflow-x: auto; }
.chuleta { border-collapse: collapse; white-space: nowrap; width: 100%; }
.chuleta th, .chuleta td { border: 1px solid var(--mx-borde); padding: .3rem .45rem; text-align: center; font-size: .85rem; }
.chuleta thead th { background: var(--mx-panel2); font-family: 'Barlow Condensed'; position: sticky; top: 0; }
.chuleta .col-fija { position: sticky; left: 0; background: var(--mx-panel2); z-index: 2; text-align: left; }
.celda-pick img { width: 22px; height: 22px; object-fit: contain; vertical-align: -4px; }
.celda-sobrevivio { background: rgba(25,135,84,.30); }
.celda-perdio    { background: rgba(220,53,69,.30); }
.celda-sinpick   { background: rgba(108,117,125,.25); color: #aab4bd; }
.celda-pendiente { background: rgba(13,110,253,.18); }
.fila-eliminado td { opacity: .45; }

/* Tablero */
.tablero-vivos { font-family: 'Barlow Condensed'; font-size: 2.6rem; font-weight: 700; color: var(--mx-oro); }

/* Bracket */
.bracket { display: flex; gap: 2rem; overflow-x: auto; padding: 1rem .25rem; }
.bracket-col { display: flex; flex-direction: column; justify-content: space-around; gap: 1rem; min-width: 230px; }
.bracket-titulo { text-align: center; font-family: 'Oswald'; color: var(--mx-oro); }
.serie { background: var(--mx-panel); border: 1px solid var(--mx-borde); border-left: 4px solid var(--mx-oro); border-radius: 8px; padding: .5rem .7rem; }
.serie .linea { display: flex; justify-content: space-between; gap: .6rem; padding: .15rem 0; }
.serie img { width: 20px; height: 20px; object-fit: contain; vertical-align: -4px; }
.serie .avanza { color: var(--mx-oro); font-weight: 700; }

/* Admin */
.admin-sidebar { min-height: calc(100vh - 70px); background: var(--mx-panel); border-right: 1px solid var(--mx-borde); }
.admin-sidebar .nav-link { color: var(--mx-texto); border-radius: 8px; font-family: 'Barlow Condensed'; font-size: 1.05rem; }
.admin-sidebar .nav-link.active, .admin-sidebar .nav-link:hover { background: var(--mx-panel2); color: var(--mx-oro); }
.admin-topbar { overflow-x: auto; white-space: nowrap; background: var(--mx-panel); border-bottom: 1px solid var(--mx-borde); }
.admin-topbar .nav-link { display: inline-block; color: var(--mx-texto); font-family: 'Barlow Condensed'; }
.admin-topbar .nav-link.active { color: var(--mx-oro); border-bottom: 2px solid var(--mx-oro); }

.barra-uso { background: var(--mx-panel2); border-radius: 6px; overflow: hidden; height: 22px; }
.barra-uso > div { background: linear-gradient(90deg, var(--mx-verde), var(--mx-oro)); height: 100%; }

.cron-ok { color: #3ddc84; } .cron-warn { color: #ffb020; } .cron-bad { color: #ff4d5e; }

.footer-mx { background: var(--mx-panel); border-top: 3px solid var(--mx-verde); color: #9fb0bd; }
.footer-mx a { color: var(--mx-oro); text-decoration: none; }

/* Login */
.auth-bg {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: radial-gradient(1200px 600px at 20% -10%, rgba(0,104,71,.35), transparent),
              radial-gradient(1000px 500px at 110% 110%, rgba(206,17,38,.28), transparent), var(--mx-bg);
}
.auth-card { width: 100%; max-width: 420px; }
.auth-logo { font-size: 3rem; }

/* Avatares (registro) */
.avatar-pick { display: flex; flex-wrap: wrap; gap: .4rem; }
.avatar-pick label { font-size: 1.5rem; padding: .3rem .5rem; border: 2px solid transparent; border-radius: 8px; cursor: pointer; }
.avatar-pick input { display: none; }
.avatar-pick input:checked + span { display: inline-block; border: 2px solid var(--mx-oro); border-radius: 8px; padding: .1rem .25rem; background: rgba(255,184,28,.15); }

@media (max-width: 576px) {
  .equipo-btn img { width: 44px; height: 44px; }
  .stat-card .stat-num { font-size: 1.9rem; }
}
@media print {
  body { background: #fff; color: #000; }
  .navbar-mx, .footer-mx, .no-print { display: none !important; }
}
