/* Sistema visual común para todas las tablas, excepto la clasificación. */
.table-responsive:has(.table:not(.standings-table)) {
  overflow-x: auto;
  margin-bottom: 26px;
  background: #fff;
  border: 1px solid #dce7de;
  border-radius: 16px;
  box-shadow: 0 12px 35px rgba(7, 61, 23, 0.09);
}

body .table:not(.standings-table) {
  width: 100%;
  margin: 0 !important;
  color: #26322a;
  background: #fff;
  border: 0 !important;
  border-collapse: separate;
  border-spacing: 0;
}

body .table:not(.standings-table) thead th,
body .table:not(.standings-table) thead td {
  padding: 12px 11px !important;
  color: rgba(255, 255, 255, 0.94) !important;
  background: #073d17 !important;
  border: 0 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.12) !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.045em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

body .table:not(.standings-table) thead th:last-child { border-right: 0 !important; }

body .table:not(.standings-table) tbody td,
body .table:not(.standings-table) tbody th {
  padding: 11px 10px !important;
  color: #26322a !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid #e6ede8 !important;
  font-size: 0.88rem !important;
  vertical-align: middle !important;
}

body .table:not(.standings-table) tbody tr:nth-child(even) > td,
body .table:not(.standings-table) tbody tr:nth-child(even) > th {
  background: #f7faf7 !important;
}

body .table:not(.standings-table) tbody tr:hover > td,
body .table:not(.standings-table) tbody tr:hover > th {
  background: #edf6ef !important;
}

body .table:not(.standings-table) tbody tr:last-child > td,
body .table:not(.standings-table) tbody tr:last-child > th {
  border-bottom: 0 !important;
}

/* El Rol general conserva el significado visual de cada resultado. */
html body table.table.table-striped-custom tbody tr > td.td-ganado.td-ganado,
html body table.table.table-striped-custom tbody tr:hover > td.td-ganado.td-ganado {
  color: #176b32 !important;
  background: #dcf6e4 !important;
  box-shadow: inset 0 3px 0 #38a85a;
}

html body table.table.table-striped-custom tbody tr > td.td-empatado.td-empatado,
html body table.table.table-striped-custom tbody tr:hover > td.td-empatado.td-empatado {
  color: #795b08 !important;
  background: #fff2c7 !important;
  box-shadow: inset 0 3px 0 #e0ad22;
}

html body table.table.table-striped-custom tbody tr > td.td-perdido.td-perdido,
html body table.table.table-striped-custom tbody tr:hover > td.td-perdido.td-perdido {
  color: #9f2936 !important;
  background: #fde1e4 !important;
  box-shadow: inset 0 3px 0 #d94a5a;
}

html body table.table-striped-custom td.td-ganado .res,
html body table.table-striped-custom td.td-empatado .res,
html body table.table-striped-custom td.td-perdido .res {
  display: inline-block;
  margin-top: 5px;
  padding: 3px 8px;
  border-radius: 999px;
  color: inherit !important;
  background: rgba(255, 255, 255, .62);
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .035em;
}

/* Vista panorámica del Rol general. */
.rol-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 14px 0 12px;
}
.rol-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid #dfe8e1;
  border-radius: 999px;
  color: #526158;
  background: #fff;
  font-size: .68rem;
  font-weight: 750;
  text-transform: uppercase;
}
.rol-legend__dot { width: 8px; height: 8px; border-radius: 50%; }
.rol-legend__dot--win { background:#38a85a; }
.rol-legend__dot--draw { background:#e0ad22; }
.rol-legend__dot--loss { background:#d94a5a; }
.rol-legend__dot--pending { background:#a8b2ac; }

html body table.rol-general-table { border-spacing: 0 !important; }
html body table.rol-general-table thead th {
  height: 48px;
  background: linear-gradient(180deg, #075020, #053c17) !important;
  border-right: 1px solid rgba(255,255,255,.1) !important;
}
html body table.rol-general-table thead .sticky-col {
  left: 0;
  min-width: 140px;
  box-shadow: 7px 0 16px rgba(5,48,18,.13);
}
html body table.rol-general-table tbody tr > td {
  min-width: 140px;
  height: 158px;
  padding: 10px 9px !important;
  border-right: 1px solid #e6ece8 !important;
  border-bottom: 1px solid #e1e9e3 !important;
  text-align: center;
  transition: filter .18s, box-shadow .18s;
}
html body table.rol-general-table tbody tr:hover > td { filter: brightness(.985); }
html body table.rol-general-table tbody tr > td.rol-equipo-cell {
  position: sticky;
  left: 0;
  z-index: 6;
  min-width: 140px;
  color: #fff !important;
  background: linear-gradient(145deg, #187838, #2f9444) !important;
  box-shadow: 7px 0 16px rgba(5,48,18,.11);
}
html body table.table.rol-general-table tbody tr.even-row > td.rol-equipo-cell.rol-equipo-cell,
html body table.table.rol-general-table tbody tr.odd-row > td.rol-equipo-cell.rol-equipo-cell,
html body table.table.rol-general-table tbody tr:hover > td.rol-equipo-cell.rol-equipo-cell {
  color: #fff !important;
  background-color: #187838 !important;
  background-image: linear-gradient(145deg, #126b31, #319448) !important;
  filter: none;
}
.rol-equipo-logo {
  display: grid;
  width: 52px;
  height: 52px;
  margin: 0 auto 8px;
  place-items: center;
  border-radius: 15px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 6px 14px rgba(0,0,0,.13);
}
.rol-equipo-logo img { width: 38px; height: 38px; object-fit: contain; }
html body table.rol-general-table .rol-equipo-cell .team-name {
  color:#fff !important;
  font-size:.8rem;
  font-weight:850;
  letter-spacing:.025em;
  text-shadow:0 1px 2px rgba(0,0,0,.22);
}
html body table.rol-general-table .badge-j { padding:4px 7px; border-radius:8px; color:#667069; background:rgba(255,255,255,.72); font-size:.66rem; font-weight:850; }
html body table.rol-general-table td > img { width:26px; height:26px; margin:5px auto 2px; object-fit:contain; }
html body table.rol-general-table .vs { display:block; margin:0; color:#8a958e; font-size:.55rem; font-weight:800; text-transform:uppercase; }
html body table.rol-general-table .rol-rival { display:block; min-height:32px; margin-top:2px; color:inherit; font-size:.75rem; font-weight:800; line-height:1.15; }
html body table.rol-general-table .rol-marcador { display:block; margin-top:4px; color:#25322a; font-size:.95rem; font-weight:900; }
html body table.rol-general-table tbody tr > td.td-ganado.td-ganado { background:#effaf2 !important; box-shadow:inset 0 3px 0 #38a85a; }
html body table.rol-general-table tbody tr > td.td-empatado.td-empatado { background:#fff9e9 !important; box-shadow:inset 0 3px 0 #e0ad22; }
html body table.rol-general-table tbody tr > td.td-perdido.td-perdido { background:#fff1f3 !important; box-shadow:inset 0 3px 0 #d94a5a; }
html body table.rol-general-table tbody tr > td.td-pendiente { color:#707b74 !important; background:#f7f9f8 !important; box-shadow:inset 0 3px 0 #cbd3ce; }
html body table.rol-general-table td.td-ganado .res,
html body table.rol-general-table td.td-empatado .res,
html body table.rol-general-table td.td-perdido .res {
  margin-top:6px;
  padding:4px 9px;
  background:#fff;
  box-shadow:0 3px 8px rgba(22,54,32,.06);
}
@media (max-width: 700px) {
  .rol-legend { gap:5px; margin-top:10px; }
  .rol-legend span { padding:5px 7px; font-size:.58rem; }
  html body table.rol-general-table tbody tr > td { min-width:122px; height:148px; padding:8px 6px !important; }
  html body table.rol-general-table thead .sticky-col,
  html body table.rol-general-table tbody tr > td.rol-equipo-cell { min-width:110px; }
}

body .table:not(.standings-table) .team-logo,
body .table:not(.standings-table) .img-equipo {
  width: 42px !important;
  height: 42px !important;
  object-fit: contain;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
}

body .table:not(.standings-table) .img-jugador {
  width: 44px !important;
  height: 44px !important;
  object-fit: cover;
  border: 2px solid #e4ebe6 !important;
  border-radius: 50% !important;
}

body .table:not(.standings-table) .td-goles,
body .table:not(.standings-table) .goles-col {
  color: #073d17 !important;
  background: #eef6f0 !important;
  font-size: 1rem !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}

body .table:not(.standings-table) .btn,
body .table:not(.standings-table) button {
  border-radius: 999px !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}

body .table:not(.standings-table) .btn-info,
body .table:not(.standings-table) .btn-primary {
  color: #fff !important;
  background: #0b6b2a !important;
  border-color: #0b6b2a !important;
}

body .table:not(.standings-table) .badge { border-radius: 999px; }

/* El rol de jornada tenía colores antiguos con alta prioridad. */
html body #rol-content table.rol-table thead th,
html body #rol-content table.rol-table.premier thead th,
html body #rol-content table.rol-table.primera thead th {
  color: rgba(255, 255, 255, 0.94) !important;
  background: #073d17 !important;
  border: 0 !important;
}

html body #rol-content table.rol-table tbody tr > td,
html body #rol-content table.rol-table.premier tbody tr.even-row > td,
html body #rol-content table.rol-table.premier tbody tr.odd-row > td,
html body #rol-content table.rol-table.primera tbody tr.even-row > td,
html body #rol-content table.rol-table.primera tbody tr.odd-row > td {
  color: #26322a !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid #e6ede8 !important;
}

html body #rol-content table.rol-table tbody tr:nth-child(even) > td {
  background: #f7faf7 !important;
}

html body #rol-content table.rol-table tbody tr:hover > td {
  background: #edf6ef !important;
}

html body #rol-content table.rol-table td.goles-col {
  color: #073d17 !important;
  background: #eef6f0 !important;
  text-shadow: none !important;
}

/* El color de categoría queda como acento, no como bloque completo. */
body .table.premier:not(.standings-table),
body .table.premier-table:not(.standings-table) { border-top: 4px solid #c72f3d !important; }

body .table.primera:not(.standings-table),
body .table.primera-table:not(.standings-table) { border-top: 4px solid #1877c9 !important; }

@media (max-width: 700px) {
  body .table:not(.standings-table) thead th,
  body .table:not(.standings-table) thead td { padding: 10px 8px !important; font-size: 0.66rem !important; }
  body .table:not(.standings-table) tbody td,
  body .table:not(.standings-table) tbody th { padding: 9px 8px !important; font-size: 0.78rem !important; }
  body .table:not(.standings-table) .team-logo,
  body .table:not(.standings-table) .img-equipo { width: 34px !important; height: 34px !important; }
}