/* ============================================================
   WIDGET DETALLE DE PARTIDO — Rediseño 2026
   REENLAZADO POR PREFIJO DE CLASE (inmune al hash CSS-modules).

   REGLA CLAVE PARA EVITAR EL BUG DE "CAJAS DENTRO DE CAJAS":
   - El CONTENEDOR raíz se ancla a section[class*="_detallepartido_"]
     para NO matchear a sus hijos (que también contienen ese texto).
   - Cada ELEMENTO interno se selecciona con su fragmento __completo
     (p.ej. [class*="_detallepartido__hero_"]), que es único por elemento.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --eu-brand: #00639b;
  --eu-brand-2: #0877b4;
  --eu-brand-dark: #082f4b;
  --eu-ink: #152238;
  --eu-muted: #70839b;
  --eu-muted-2: #91a3b7;
  --eu-line: #e1eaf3;
  --eu-line-soft: #f0f4f8;
  --eu-surface: #ffffff;
  --eu-surface-soft: #f7fafc;
  --eu-success: #11865d;
  --eu-danger: #c94242;
  --eu-grad: linear-gradient(135deg, #0877b4 0%, #00639b 100%);
  --eu-grad-diag: linear-gradient(145deg, #082f4b 0%, #00639b 52%, #1485bf 100%);
  --eu-shadow: 0 18px 38px rgba(15, 35, 55, .11), 0 4px 12px rgba(15, 35, 55, .07);
  --eu-shadow-md: 0 10px 24px rgba(15, 35, 55, .08);
  --eu-shadow-sm: 0 4px 12px rgba(15, 35, 55, .05);

  --dp-font: 'Work Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --dp-text: #152238;
  --dp-text-soft: #70839b;
  --dp-text-faint: #91a3b7;
  --dp-accent: #00639b;
  --dp-border: #e1eaf3;
  --dp-border-strong: #dbe5ef;
  --dp-radius-xl: 20px;
  --dp-radius-lg: 16px;
  --dp-radius-md: 14px;
  --dp-radius-pill: 999px;
  --dp-gap: 14px;
  --dp-title-size: clamp(1.02rem, .96rem + .28vw, 1.3rem);
  --dp-score-size: clamp(2rem, 1.55rem + 1.25vw, 3rem);

  --pi-text: #152238;
  --pi-text-soft: #70839b;
  --pi-accent-home: #00639b;
  --pi-accent-away: #c94242;
  --pi-border: #e1eaf3;
  --pi-surface-strong: #fff;
  --pi-shadow-md: 0 10px 24px rgba(15, 35, 55, .08);
  --pi-shadow-sm: 0 4px 12px rgba(15, 35, 55, .05);
  --pi-radius-lg: 16px;
  --pi-radius-pill: 999px;
  --pi-score-size: clamp(2rem, 1.35rem + 1.8vw, 3.3rem);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  background: linear-gradient(180deg, #f7fafc 0%, #edf3f8 100%);
  color: var(--eu-ink);
  font-family: 'Work Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  margin: 0;
  min-height: 100vh;
  padding: 16px;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* ============================================================
   1. CONTENEDOR RAÍZ — anclado a <section> para NO tocar hijos
   ============================================================ */
section[class*="_detallepartido_"] {
  background: linear-gradient(180deg, #ffffff 0%, #f7fafc 100%);
  border: 1px solid rgba(0, 99, 155, .12);
  border-radius: var(--dp-radius-xl);
  box-shadow: var(--eu-shadow);
  container-type: inline-size;
  display: grid;
  font-family: var(--dp-font);
  gap: 16px;
  margin: 0 auto;
  max-width: 100%;
  overflow: hidden;
  padding: var(--dp-pad);
  position: relative;
  width: 100%;
}
section[class*="_detallepartido_"]::before {
  background:
    radial-gradient(circle at 8% 10%, rgba(0, 99, 155, .12), #0000 34%),
    radial-gradient(circle at 92% 0, rgba(201, 66, 66, .08), #0000 28%);
  content: "";
  height: 140px;
  inset: 0 0 auto;
  pointer-events: none;
  position: absolute;
}
section[class*="_detallepartido_"] > * { position: relative; z-index: 1; }

/* ============================================================
   2. HERO
   ============================================================ */
[class*="_detallepartido__hero_"] {
  background: var(--eu-grad-diag);
  border: 1px solid rgba(0, 99, 155, .25);
  border-radius: var(--dp-radius-lg);
  box-shadow: 0 10px 24px rgba(0, 99, 155, .22);
  color: #fff;
  display: grid;
  gap: 12px;
  overflow: hidden;
  padding: 18px 16px;
  position: relative;
}
[class*="_detallepartido__hero_"]::before {
  border-radius: inherit;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}
[class*="_detallepartido__hero_"]:has([class*="_detallepartido__live_"]) { padding-top: 40px; }

[class*="_detallepartido__scoreboard_"] {
  align-items: center;
  display: grid;
  gap: clamp(10px, 2vw, 22px);
  grid-template-columns: 1fr auto 1fr;
}
[class*="_detallepartido__team_"] {
  align-items: center;
  display: flex;
  gap: 10px;
  min-width: 0;
}
[class*="_detallepartido__team--home_"] { justify-content: flex-start; }
[class*="_detallepartido__team--away_"] { justify-content: flex-end; }
[class*="_detallepartido__teambox_"] {
  display: grid;
  gap: 2px;
  min-width: 0;
}
[class*="_detallepartido__team--away_"] [class*="_detallepartido__teambox_"] { text-align: right; }

[class*="_detallepartido__hero_"] [class*="_detallepartido__teambox_"] > span:first-child { color: #fff; font-weight: 800; }
[class*="_detallepartido__hero_"] [class*="_detallepartido__teambox_"] > span { color: #fff; }
[class*="_detallepartido__hero_"] [class*="_detallepartido__team_"] span { color: #fff; }
[class*="_detallepartido__hero_"] [class*="_detallepartido__formation_"] { color: rgba(255, 255, 255, .72); }
[class*="_detallepartido__hero_"] [class*="_detallepartido__score_"] { color: #fff; }
[class*="_detallepartido__hero_"] [class*="_detallepartido__center_"] span { color: #fff; }

[class*="_detallepartido__abbr_"] {
  color: rgba(255, 255, 255, .92);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}
[class*="_detallepartido__formation_"] {
  color: rgba(255, 255, 255, .7);
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}
[class*="_detallepartido__crest_"] {
  background: rgba(255, 255, 255, .12);
  border: 3px solid rgba(255, 255, 255, .9);
  border-radius: 50%;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .35), 0 8px 18px rgba(0, 0, 0, .22);
  color: #fff;
  display: grid;
  flex: 0 0 clamp(40px, 3.5vw, 56px);
  font-size: clamp(13px, 1vw, 18px);
  font-weight: 800;
  height: clamp(40px, 3.5vw, 56px);
  overflow: hidden;
  place-items: center;
  width: clamp(40px, 3.5vw, 56px);
}
[class*="_detallepartido__crest_"] img { height: 100%; object-fit: cover; width: 100%; }
[class*="_detallepartido__center_"] { display: grid; gap: 6px; place-items: center; }
[class*="_detallepartido__result_"] {
  align-items: center;
  display: inline-flex;
  gap: clamp(10px, 1.4vw, 18px);
  justify-content: center;
  white-space: nowrap;
}
[class*="_detallepartido__score_"] {
  color: #fff;
  font-size: var(--dp-score-size);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1;
  text-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}
[class*="_detallepartido__status_"] {
  align-items: center;
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: var(--dp-radius-pill);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  color: #fff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  justify-content: center;
  letter-spacing: .5px;
  min-height: 32px;
  min-width: 32px;
  padding: 0 10px;
  text-transform: uppercase;
}
[class*="_detallepartido__caret_"] {
  border-bottom: 5px solid #0000;
  border-left: 6px solid rgba(255, 255, 255, .85);
  border-top: 5px solid #0000;
  height: 0;
  opacity: .9;
  width: 0;
}
[class*="_detallepartido__caret--left_"] {
  border-left: none;
  border-right: 6px solid rgba(255, 255, 255, .85);
}
[class*="_detallepartido__goals_"] {
  align-items: stretch;
  border-top: 1px solid rgba(255, 255, 255, .22);
  display: grid;
  gap: 14px;
  grid-template-columns: 1fr 1px 1fr;
  padding-top: 12px;
}
[class*="_detallepartido__divider_"] {
  align-self: stretch;
  background: rgba(255, 255, 255, .25);
  width: 1px;
}
[class*="_detallepartido__goallist_"] {
  align-content: start;
  display: grid;
  gap: 4px;
}
[class*="_detallepartido__goallist--away_"] { text-align: right; }
[class*="_detallepartido__goal_"] {
  color: rgba(255, 255, 255, .9);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
}

/* Badge EN VIVO */
[class*="_detallepartido__live_"] {
  align-items: center;
  background: var(--eu-danger);
  border-radius: 999px;
  box-shadow: 0 4px 10px rgba(201, 66, 66, .35);
  color: #fff;
  display: inline-flex;
  font-size: 10px;
  font-weight: 900;
  gap: 6px;
  letter-spacing: .04em;
  padding: 4px 9px;
  position: absolute;
  right: 12px;
  text-transform: uppercase;
  top: 12px;
  z-index: 3;
}
[class*="_detallepartido__live_"] > span {
  animation: 1.2s infinite dp-pulse;
  background: #fff;
  border-radius: 50%;
  height: 8px;
  width: 8px;
}
[class*="_detallepartido__live_"] strong { color: #fff; font-weight: 900; }

@keyframes dp-pulse { 0% { opacity: 1; } 50% { opacity: .35; } to { opacity: 1; } }

/* ============================================================
   3. TABS
   ============================================================ */
[class*="_detallepartido__tabs_"] {
  align-items: stretch;
  background: #eef3f8;
  border: 1px solid var(--eu-line);
  border-radius: var(--dp-radius-pill);
  box-shadow: inset 0 1px 2px rgba(15, 35, 55, .05);
  display: flex;
  flex-wrap: nowrap;
  gap: 3px;
  overflow: hidden;
  padding: 3px;
  width: 100%;
}
[class*="_detallepartido__tabs_"]::-webkit-scrollbar { display: none; }
[class*="_detallepartido__tabs_"] > button {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: var(--dp-radius-pill);
  color: var(--eu-muted);
  cursor: pointer;
  flex: 1 1 0;
  font-family: var(--dp-font);
  font-size: clamp(9.5px, 2.7vw, 12px);
  font-weight: 800;
  letter-spacing: -.2px;
  line-height: 1.1;
  margin: 0;
  min-width: 0;
  padding: 8px 4px;
  text-align: center;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease;
  white-space: nowrap;
}
[class*="_detallepartido__tabs_"] > button:hover { color: var(--eu-brand); }
[class*="_detallepartido__tabs_"] > button[class*="_is-active_"],
[class*="_detallepartido__tabs_"] > button[aria-selected="true"],
[class*="_detallepartido__tabs_"] > button.active {
  background: var(--eu-grad);
  box-shadow: 0 4px 10px rgba(0, 99, 155, .25);
  color: #fff;
}

/* ============================================================
   4. PANELES / COMMENTARY / TIMELINE
   ============================================================ */
[class*="_detallepartido__panel_"],
[class*="_detallepartido__commentary_"],
[class*="_partidoinfo__lineups_"] {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid var(--dp-border);
  border-radius: var(--dp-radius-lg);
  box-shadow: var(--eu-shadow-sm);
  display: grid;
  gap: 14px;
  padding: 16px;
}
[class*="_detallepartido__formation_container_"] {
  background: linear-gradient(90deg, rgba(255, 255, 255, .12) 1px, #0000 1px), #198754;
  border-radius: var(--dp-radius-md);
  box-shadow: var(--eu-shadow-md);
  overflow: hidden;
  padding: 10px 10px 16px;
}
[class*="_detallepartido__sectiontitle_"] {
  color: var(--eu-ink);
  font-family: var(--dp-font);
  font-size: var(--dp-title-size);
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1.15;
  margin: 0;
}
[class*="_detallepartido__timelinehead_"] {
  align-items: center;
  border-bottom: 1px dashed var(--dp-border);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding-bottom: 12px;
}
[class*="_detallepartido__teamlabel_"] {
  align-items: center;
  color: var(--dp-text-soft);
  display: inline-flex;
  font-size: 14px;
  font-weight: 800;
  gap: 8px;
}
[class*="_detallepartido__teamlabel--away_"] { justify-content: flex-end; margin-left: auto; }
[class*="_detallepartido__mini-crest_"] {
  border: 2px solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 4px 10px rgba(15, 35, 55, .12);
  color: #fff;
  display: grid;
  flex: 0 0 22px;
  font-size: 10px;
  font-weight: 800;
  height: 22px;
  object-fit: cover;
  overflow: hidden;
  place-items: center;
  width: 22px;
}
[class*="_detallepartido__swap_"] {
  align-items: center;
  color: var(--dp-accent);
  display: inline-flex;
  font-size: 15px;
  font-weight: 800;
  gap: 6px;
  white-space: nowrap;
}
[class*="_detallepartido__track_"] {
  background: #eef3f8;
  border-radius: var(--dp-radius-pill);
  height: 12px;
  overflow: hidden;
  position: relative;
  width: 100%;
}
[class*="_detallepartido__trackfill_"] { background: var(--eu-grad); inset: 0; position: absolute; }
[class*="_detallepartido__minute_"] {
  align-items: center;
  background: #fff;
  border: 1px solid var(--eu-line);
  border-radius: var(--dp-radius-pill);
  box-shadow: var(--eu-shadow-sm);
  color: var(--eu-brand);
  display: inline-flex;
  font-size: 10px;
  font-weight: 800;
  height: 18px;
  justify-content: center;
  min-width: 26px;
  padding: 0 6px;
  white-space: nowrap;
}
[class*="_detallepartido__rows_"] {
  border-top: 1px dashed var(--dp-border);
  display: grid;
  gap: 0;
}
[class*="_detallepartido__row_"] {
  align-items: start;
  border-bottom: 1px dashed rgba(15, 35, 55, .10);
  display: grid;
  gap: 12px;
  grid-template-columns: 74px 1fr;
  padding: 12px 0;
}
[class*="_detallepartido__time_"] {
  color: var(--dp-accent);
  font-size: 14px;
  font-weight: 800;
  text-align: left;
  white-space: nowrap;
}
[class*="_detallepartido__text_"] {
  color: var(--dp-text-soft);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.45;
}
[class*="_detallepartido__eventinfo_"] strong { color: var(--eu-ink); font-weight: 800; }
[class*="_detallepartido__eventinfo_"] span { color: var(--eu-muted); font-weight: 600; }
[class*="_detallepartido__eventinfo_"] small { color: var(--eu-muted-2); font-weight: 600; }
[class*="_detallepartido__eventcrest_"] {
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(15, 35, 55, .14);
  height: 32px;
  object-fit: cover;
  width: 32px;
}

/* ============================================================
   5. BOTÓN "Ver más / Ver menos" — <button> hijo directo
   ============================================================ */
section[class*="_detallepartido_"] > button {
  -webkit-appearance: none;
  appearance: none;
  background: linear-gradient(180deg, #ffffff 0%, #f4f8fc 100%);
  border: 1px solid var(--eu-line);
  border-radius: var(--dp-radius-pill);
  box-shadow: var(--eu-shadow-sm);
  color: var(--eu-brand);
  cursor: pointer;
  display: block;
  font-family: var(--dp-font);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .3px;
  margin: 0;
  padding: 11px 18px;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease, transform .12s ease;
  width: 100%;
}
section[class*="_detallepartido_"] > button:hover {
  background: #ffffff;
  border-color: rgba(0, 99, 155, .34);
  box-shadow: 0 0 0 3px rgba(0, 99, 155, .10);
}
section[class*="_detallepartido_"] > button:active { transform: translateY(1px); }

/* ============================================================
   6. CANCHA / ALINEACIONES
   ============================================================ */
[class*="_detallepartido__pitch_"] {
  aspect-ratio: 62 / 108;
  border: 2px solid #fff;
  border-radius: var(--dp-radius-md);
  margin: 0 auto;
  max-width: 460px;
  position: relative;
  width: 100%;
}
[class*="_detallepartido__formation_container_"] [class*="_detallepartido__pitch_"] {
  aspect-ratio: 58 / 132;
  max-width: 430px;
}
[class*="_detallepartido__circle_"] {
  border: 2px solid rgba(255, 255, 255, .5);
  border-radius: 50%;
  height: 80px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
}
[class*="_detallepartido__half_"] {
  border-top: 2px solid rgba(255, 255, 255, .5);
  left: 0;
  position: absolute;
  right: 0;
  top: 50%;
}
[class*="_detallepartido__pitchplayer_"] {
  align-items: center;
  color: #fff;
  display: flex;
  flex-direction: column;
  font-size: 8.5px;
  gap: 3px;
  position: absolute;
  transform: translate(-50%, -50%);
}
[class*="_detallepartido__pitchplayer_"] > span {
  font-weight: 700;
  line-height: 1.05;
  max-width: 62px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .85);
  white-space: nowrap;
}
[class*="_detallepartido__playerdot_"] {
  background: #fff;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
  height: 34px;
  position: relative;
  width: 34px;
}
[class*="_detallepartido__playerdot_"] img {
  border-radius: 50%;
  height: 100%;
  object-fit: cover;
  width: 100%;
}
[class*="_detallepartido__playerdot_"] span {
  align-items: center;
  background: var(--eu-grad);
  border: 1.5px solid #fff;
  border-radius: 50%;
  bottom: -5px;
  color: #fff;
  display: flex;
  font-size: 9px;
  font-weight: 900;
  height: 17px;
  justify-content: center;
  position: absolute;
  right: -5px;
  width: 17px;
  z-index: 2;
}
[class*="_detallepartido__pitch_"] > [style*="top: 0%"],
[class*="_detallepartido__pitch_"] > [style*="top:0%"] { top: 5% !important; }
[class*="_detallepartido__pitch_"] > [style*="top: 100%"],
[class*="_detallepartido__pitch_"] > [style*="top:100%"] { top: 95% !important; }

/* ============================================================
   7. BLOQUE _partidoinfo_ (estadísticas)
   Contenedor anclado a su fragmento base SIN __ para no tocar hijos.
   Truco: [class*="_partidoinfo_"]:not([class*="__"]) = solo el wrapper.
   ============================================================ */
[class*="_partidoinfo_"]:not([class*="_partidoinfo__"]) {
  background: linear-gradient(180deg, #ffffff 0%, #f7fafc 100%);
  border: 1px solid rgba(0, 99, 155, .12);
  border-radius: var(--dp-radius-lg);
  box-shadow: var(--pi-shadow-md);
  container-type: inline-size;
  display: grid;
  gap: 14px;
  margin: 0 auto;
  max-width: 100%;
  overflow: visible;
  padding: 18px;
  position: relative;
  width: 100%;
}
[class*="_partidoinfo__scoreboard_"] {
  align-items: center;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid var(--pi-border);
  border-radius: var(--pi-radius-lg);
  box-shadow: var(--pi-shadow-md);
  display: grid;
  gap: 14px;
  grid-template-columns: 1fr auto 1fr;
}
[class*="_partidoinfo__teamslot_"] { align-items: center; display: flex; min-width: 0; }
[class*="_partidoinfo__teamslot--home_"] { justify-content: flex-start; }
[class*="_partidoinfo__teamslot--away_"] { justify-content: flex-end; }
[class*="_partidoinfo__crest_"] {
  border: 3px solid #ffffff;
  border-radius: 50%;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .35), 0 8px 18px rgba(15, 35, 55, .16);
  color: #fff;
  display: grid;
  flex: 0 0 clamp(40px, 3.3vw, 52px);
  font-size: clamp(13px, 1vw, 17px);
  font-weight: 800;
  height: clamp(40px, 3.3vw, 52px);
  overflow: hidden;
  place-items: center;
  width: clamp(40px, 3.3vw, 52px);
}
[class*="_partidoinfo__mini-crest_"] {
  border: 2px solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 4px 10px rgba(15, 35, 55, .12);
  color: #fff;
  display: grid;
  flex: 0 0 28px;
  font-size: 11px;
  font-weight: 800;
  height: 28px;
  overflow: hidden;
  place-items: center;
  width: 28px;
}
[class*="_partidoinfo__center_"] { display: grid; min-width: 0; place-items: center; }
[class*="_partidoinfo__result_"] {
  align-items: center;
  display: inline-flex;
  gap: clamp(10px, 1.2vw, 18px);
  justify-content: center;
  white-space: nowrap;
}
[class*="_partidoinfo__score_"] {
  color: var(--pi-text);
  font-size: var(--pi-score-size);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1;
}
[class*="_partidoinfo__status_"] {
  align-items: center;
  background: var(--eu-grad);
  border: 1px solid rgba(0, 99, 155, .25);
  border-radius: var(--pi-radius-pill);
  box-shadow: 0 4px 10px rgba(0, 99, 155, .25);
  color: #fff;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  justify-content: center;
  letter-spacing: .5px;
  min-height: 34px;
  min-width: 34px;
  padding: 0 10px;
  text-transform: uppercase;
}
[class*="_partidoinfo__panel_"] {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid var(--pi-border);
  border-radius: var(--pi-radius-lg);
  box-shadow: var(--pi-shadow-md);
  display: grid;
  gap: 14px;
  padding: 16px;
}
[class*="_partidoinfo__sectiontitle_"] {
  color: var(--pi-text);
  font-size: clamp(1.1rem, 1rem + .4vw, 1.4rem);
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1.15;
  margin: 0;
}
[class*="_partidoinfo__subtitle_"] {
  color: var(--pi-text-soft);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;
}
[class*="_partidoinfo__teamshead_"] {
  align-items: center;
  border-bottom: 1px dashed var(--pi-border);
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr 1fr;
  max-width: 100%;
  padding-bottom: 12px;
}
[class*="_partidoinfo__teamslothead_"] {
  align-items: center;
  color: var(--pi-text-soft);
  display: inline-flex;
  font-size: 15px;
  font-weight: 800;
  gap: 10px;
  min-width: 0;
  overflow: hidden;
}
[class*="_partidoinfo__teamslothead--away_"] { justify-content: flex-end; }

/* Anillo de posesión */
[class*="_partidoinfo__possession_"] {
  display: grid;
  gap: 10px;
  justify-items: center;
  padding: 8px 0 2px;
}
[class*="_partidoinfo__ringrow_"] {
  align-items: center;
  display: grid;
  gap: 6px;
  grid-template-columns: 1fr;
  justify-items: center;
  max-width: 100%;
  width: 100%;
}
[class*="_partidoinfo__ringwrap_"] {
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  position: relative;
  width: clamp(120px, 46vw, 190px);
}


[class*="_detallepartido_nextfixtureblock_"]{
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 16px;
  background: var(--eu-grad-diag) !important;
  border: 1px solid rgba(0, 99, 155, .25) !important;
  box-shadow: 0 10px 24px rgba(0, 99, 155, .22) !important;
  color: #fff !important;
  font-weight: 700;

}
[class*="_partidoinfo__ring_"] {
  background: conic-gradient(from 180deg, var(--pi-accent-home, #00639b) 0 var(--partidoinfo-pos1, 60.9%), #fff var(--partidoinfo-pos1, 60.9%) var(--partidoinfo-pos2, 62.3%), var(--pi-accent-away, #c94242) var(--partidoinfo-pos2, 62.3%) 100%);
  border-radius: 50%;
  box-shadow: var(--pi-shadow-sm);
  height: 100%;
  position: relative;
  width: 100%;
}
[class*="_partidoinfo__ring_"]::after {
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(15, 35, 55, .05);
  content: "";
  inset: 16%;
  position: absolute;
}
[class*="_partidoinfo__ringcenter_"] {
  display: grid;
  inset: 0;
  place-items: center;
  pointer-events: none;
  position: absolute;
}
[class*="_partidoinfo__ringteams_"] {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1px 1fr;
  width: 64%;
  z-index: 1;
}
[class*="_partidoinfo__divider_"] {
  background: rgba(15, 35, 55, .18);
  height: 36px;
  justify-self: center;
  width: 1px;
}
[class*="_partidoinfo__ringteam_"] { align-items: center; display: inline-flex; justify-content: center; }
[class*="_partidoinfo__percent_"] {
  color: var(--pi-text);
  font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem);
  font-weight: 800;
  line-height: 1;
  min-width: 0;
  text-align: center;
  white-space: nowrap;
}

/* Estadísticas con barras */
[class*="_partidoinfo__stats_"] {
  display: grid;
  gap: 2px;
  justify-items: center;
  margin: 0 auto;
  max-width: 100%;
  padding-top: 6px;
  width: 100%;
}
[class*="_partidoinfo__stat_"] {
  align-items: center;
  border-top: 1px dashed rgba(15, 35, 55, .10);
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(34px, auto) 1fr minmax(34px, auto);
  margin: 0;
  max-width: 100%;
  padding: 12px 0;
  width: 100%;
}
[class*="_partidoinfo__stat_"]:first-child { border-top: 0; }
[class*="_partidoinfo__value_"] {
  color: var(--pi-text);
  font-size: clamp(1.15rem, 1rem + .6vw, 1.6rem);
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  line-height: 1;
  text-align: center;
}
[class*="_partidoinfo__label_"] {
  color: var(--eu-muted);
  font-size: clamp(13px, 12px + .3vw, 15px);
  font-weight: 700;
  letter-spacing: .3px;
  text-align: center;
  white-space: normal;
}
[class*="_partidoinfo__bartrack_"] {
  background: #eef3f8;
  border-radius: var(--pi-radius-pill);
  height: 10px;
  overflow: hidden;
  position: relative;
}
[class*="_partidoinfo__barfill_"] {
  background: var(--eu-grad);
  border-radius: inherit;
  box-shadow: inset 0 1px rgba(255, 255, 255, .22);
  inset: 0 auto 0 0;
  position: absolute;
  width: var(--bar, 50%);
}

/* Formaciones (toggle) */
[class*="_partidoinfo__formations_"] {
  align-items: center;
  background: #eef3f8;
  border: 1px solid var(--pi-border);
  border-radius: var(--pi-radius-pill);
  box-shadow: var(--pi-shadow-sm);
  display: inline-flex;
  gap: 0;
  justify-content: center;
  margin: 0 auto;
  overflow: hidden;
  width: min(100%, 520px);
}
[class*="_partidoinfo__formation_"] {
  align-items: center;
  background: 0 0;
  color: var(--pi-text-soft);
  display: inline-flex;
  flex: 50%;
  font-size: clamp(1rem, .92rem + .22vw, 1.25rem);
  font-weight: 800;
  gap: 10px;
  justify-content: center;
  line-height: 1;
  min-width: 0;
  padding: 12px 16px;
  text-align: center;
  transition: background .18s ease, color .18s ease;
}
[class*="_partidoinfo__formation_"][class*="_is-active_"] {
  background: var(--pi-surface-strong);
  box-shadow: var(--pi-shadow-sm);
  color: var(--pi-accent-home);
}

/* ============================================================
   8. ARREGLO DOBLE CAJA: panel que envuelve stats/cancha
   ============================================================ */
[class*="_detallepartido__panel_"]:has([class*="_partidoinfo_"]),
[class*="_detallepartido__panel_"]:has([class*="_detallepartido__formation_container_"]),
[class*="_detallepartido__panel_"]:has([class*="_detallepartido__pitch_"]) {
  background: transparent;
  border: 0;
  box-shadow: none;
  overflow: visible;
  padding: 0;
}
[class*="_detallepartido__panel_"] [class*="_partidoinfo_"]:not([class*="_partidoinfo__"]) {
  margin: 0;
  max-width: 100%;
  width: 100%;
}
@supports not (selector(:has(*))) {
  [class*="_detallepartido__panel_"] { padding: 8px; }
  [class*="_detallepartido__panel_"] [class*="_partidoinfo_"]:not([class*="_partidoinfo__"]) { padding: 12px; }
}

@container (width >= 360px) {
  [class*="_partidoinfo__ringrow_"] {
    gap: clamp(6px, 2vw, 16px);
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }
  [class*="_partidoinfo__ringwrap_"] { order: 0; }
}

/* ============================================================
   9. HERO EN VIVO — forzar fondo azul y texto blanco
   ============================================================ */
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] {
  background: var(--eu-grad-diag) !important;
  border: 1px solid rgba(0, 99, 155, .25) !important;
  box-shadow: 0 10px 24px rgba(0, 99, 155, .22) !important;
  color: #fff !important;
}
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] [class*="_detallepartido__score_"],
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] [class*="_detallepartido__team_"] span,
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] [class*="_detallepartido__teambox_"] span,
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] [class*="_detallepartido__center_"] span {
  color: #fff !important;
}
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] [class*="_detallepartido__formation_"] {
  color: rgba(255, 255, 255, .72) !important;
}
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] [class*="_detallepartido__status_"] {
  background: rgba(255, 255, 255, .18) !important;
  border: 1px solid rgba(255, 255, 255, .4) !important;
  color: #fff !important;
}
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] [class*="_detallepartido__live_"] {
  background: var(--eu-danger) !important;
  box-shadow: 0 4px 12px rgba(201, 66, 66, .45) !important;
  color: #fff !important;
  left: auto !important;
  right: 12px !important;
  top: 12px !important;
  transform: none !important;
}
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] [class*="_detallepartido__live_"] strong,
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"] [class*="_detallepartido__live_"] > span {
  color: #fff !important;
}
section[class*="_detallepartido_"] [class*="_detallepartido__hero_"]:has([class*="_detallepartido__live_"]) {
  padding-top: 42px !important;
}

/* ============================================================
   10. RESPONSIVE
   ============================================================ */
@container (width <= 860px) {
  section[class*="_detallepartido_"] { --dp-pad: 14px; --dp-gap: 12px; }
  [class*="_detallepartido__hero_"],
  [class*="_detallepartido__panel_"],
  [class*="_detallepartido__commentary_"] { padding: 14px; }
  [class*="_detallepartido__goal_"],
  [class*="_detallepartido__text_"] { font-size: 14px; }
}
@container (width <= 760px) {
  section[class*="_detallepartido_"] { --dp-pad: 12px; --dp-gap: 10px; }
  [class*="_detallepartido__scoreboard_"] {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: center;
    padding-bottom: 4px;
    text-align: center;
  }
  [class*="_detallepartido__crest_"] { border-width: 2px; flex-basis: 34px; font-size: 12px; height: 34px; width: 34px; }
  [class*="_detallepartido__score_"] { font-size: 1.9rem; }
  [class*="_detallepartido__status_"] { font-size: 11px; min-height: 28px; min-width: 28px; padding: 0 8px; }
  [class*="_detallepartido__abbr_"],
  [class*="_detallepartido__formation_"] { font-size: 12px; }
  [class*="_detallepartido__goals_"] { gap: 10px; grid-template-columns: 1fr; }
  [class*="_detallepartido__divider_"] { display: none; }
  [class*="_detallepartido__goallist_"],
  [class*="_detallepartido__goallist--away_"] { text-align: center; }
  [class*="_detallepartido__row_"] { gap: 10px; grid-template-columns: 64px 1fr; }
  [class*="_detallepartido__text_"] { font-size: 14px; }
}
@container (width <= 480px) {
  [class*="_detallepartido__hero_"],
  [class*="_detallepartido__panel_"],
  [class*="_detallepartido__commentary_"] { padding: 12px; }
  [class*="_detallepartido__scoreboard_"] { grid-template-columns: auto 1fr auto; }
  [class*="_detallepartido__result_"] { gap: 8px; }
  [class*="_detallepartido__score_"] { font-size: 1.8rem; }
  [class*="_detallepartido__caret_"] { border-bottom-width: 4px; border-left-width: 5px; border-top-width: 4px; }
  [class*="_detallepartido__goal_"] { font-size: 13px; }
  [class*="_detallepartido__minute_"] { font-size: 9px; min-width: 24px; }
  [class*="_detallepartido__row_"] { grid-template-columns: 58px 1fr; }
  [class*="_detallepartido__time_"],
  [class*="_detallepartido__text_"] { font-size: 13px; }
  [class*="_detallepartido__pitch_"] { aspect-ratio: 58 / 110; }
  [class*="_detallepartido__playerdot_"] { height: 30px; width: 30px; }
  [class*="_detallepartido__playerdot_"] span { font-size: 8px; height: 15px; width: 15px; }
  [class*="_detallepartido__pitchplayer_"] > span { font-size: 8px; max-width: 52px; }
}
@media (width <= 767px) { body { padding: 12px; } }
