/* FootballDoNorte: acabado final de cabeceras de competición.
   Se carga después del CSS original; no cambia los fondos de estadio. */

html[data-theme] body .competition-hero {
  min-height: 250px !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

html[data-theme] body .competition-hero > .competition-hero-overlay {
  min-height: 250px !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  padding: 22px 32px 26px !important;
}

html[data-theme="dark"] body .competition-hero > .competition-hero-overlay {
  background: linear-gradient(
    90deg,
    rgba(3, 8, 20, .76) 0%,
    rgba(3, 8, 20, .42) 48%,
    rgba(3, 8, 20, .10) 100%
  ) !important;
}

html[data-theme="light"] body .competition-hero > .competition-hero-overlay {
  background: linear-gradient(
    90deg,
    rgba(247, 249, 253, .88) 0%,
    rgba(247, 249, 253, .64) 42%,
    rgba(247, 249, 253, .12) 100%
  ) !important;
}

html[data-theme] body .competition-hero .competition-hero-content {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  width: 100% !important;
  margin: auto 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

html[data-theme] body .competition-hero .hero-left {
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: center !important;
  gap: 20px !important;
  min-width: 0 !important;
  background: transparent !important;
}

html[data-theme] body .competition-hero .competition-brand-mark {
  display: flex !important;
  flex: 0 0 112px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 112px !important;
  min-height: 68px !important;
  background: transparent !important;
}

html[data-theme] body .competition-hero .competition-brand-mark img {
  display: block !important;
  width: 100% !important;
  max-width: 112px !important;
  max-height: 76px !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  filter: drop-shadow(0 2px 5px rgba(0, 0, 0, .28)) !important;
}

html[data-theme] body .competition-hero .hero-text {
  min-width: 0 !important;
}

html[data-theme] body .competition-hero .hero-text h1 {
  margin: 7px 0 !important;
  font-size: clamp(27px, 3.2vw, 46px) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: -.6px !important;
  text-transform: uppercase !important;
  overflow-wrap: anywhere !important;
}

html[data-theme="dark"] body .competition-hero .crumb,
html[data-theme="dark"] body .competition-hero .competition-kicker,
html[data-theme="dark"] body .competition-hero .hero-text h1,
html[data-theme="dark"] body .competition-hero .hero-text p {
  color: #fff !important;
  text-shadow: 0 2px 7px rgba(0, 0, 0, .85) !important;
}

html[data-theme="light"] body .competition-hero .crumb,
html[data-theme="light"] body .competition-hero .competition-kicker,
html[data-theme="light"] body .competition-hero .hero-text h1,
html[data-theme="light"] body .competition-hero .hero-text p {
  color: #10233d !important;
  text-shadow: 0 1px 3px rgba(255, 255, 255, .72) !important;
}

html[data-theme] body .competition-hero .hero-right {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 180px !important;
  margin-left: auto !important;
}

html[data-theme] body .competition-hero .hero-season-box {
  text-align: right !important;
  background: transparent !important;
}

html[data-theme] body .competition-hero .hero-season-box label,
html[data-theme] body .competition-hero .competition-season-value {
  font-weight: 900 !important;
  text-shadow: 0 2px 7px rgba(0, 0, 0, .85) !important;
}

html[data-theme] body .competition-hero .competition-season-value {
  width: auto !important;
  padding: 7px 0 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font-size: 22px !important;
  text-align: right !important;
}

@media (max-width: 700px) {
  html[data-theme] body .competition-hero,
  html[data-theme] body .competition-hero > .competition-hero-overlay {
    min-height: 220px !important;
  }

  html[data-theme] body .competition-hero > .competition-hero-overlay {
    padding: 16px !important;
  }

  html[data-theme] body .competition-hero .competition-hero-content {
    align-items: flex-end !important;
    gap: 10px !important;
  }

  html[data-theme] body .competition-hero .hero-left {
    gap: 11px !important;
  }

  html[data-theme] body .competition-hero .competition-brand-mark {
    flex-basis: 64px !important;
    width: 64px !important;
    min-height: 44px !important;
  }

  html[data-theme] body .competition-hero .competition-brand-mark img {
    max-width: 64px !important;
    max-height: 48px !important;
  }

  html[data-theme] body .competition-hero .hero-text h1 {
    font-size: clamp(20px, 5.8vw, 31px) !important;
    letter-spacing: -.35px !important;
  }

  html[data-theme] body .competition-hero .hero-text p {
    font-size: 12px !important;
  }

  html[data-theme] body .competition-hero .hero-right {
    max-width: 100px !important;
  }

  html[data-theme] body .competition-hero .hero-season-box label {
    font-size: 10px !important;
  }

  html[data-theme] body .competition-hero .competition-season-value {
    font-size: 16px !important;
  }
}

@media (max-width: 390px) {
  html[data-theme] body .competition-hero .competition-brand-mark {
    flex-basis: 52px !important;
    width: 52px !important;
  }

  html[data-theme] body .competition-hero .competition-brand-mark img {
    max-width: 52px !important;
  }

  html[data-theme] body .competition-hero .hero-left {
    gap: 8px !important;
  }

  html[data-theme] body .competition-hero .hero-right {
    max-width: 82px !important;
  }
}

/* FDN: correcciones finales de adornos heredados en cabeceras */
html[data-theme] body .competition-hero-laliga-ea-sports::after,
html[data-theme] body .competition-hero-champions-league::after {
  content: none !important;
  display: none !important;
}

/* Evitar que adornos antiguos se inyecten junto al título */
html[data-theme] body .competition-hero .hero-text h1::before,
html[data-theme] body .competition-hero .hero-text h1::after {
  content: none !important;
  display: none !important;
}


/* La temporada no debe mostrar una bandera o imagen decorativa de fondo */
html[data-theme] body .competition-hero .hero-season-box {
  background-image: none !important;
}

html[data-theme] body .competition-hero .hero-season-box::before,
html[data-theme] body .competition-hero .hero-season-box::after {
  content: none !important;
  display: none !important;
}

/* FDN: limpieza de iconos heredados en las cabeceras */
html[data-theme] body .competition-hero-laliga-ea-sports::after,
html[data-theme] body .competition-hero-laliga-hypermotion::after,
html[data-theme] body .competition-hero-champions-league::after,
html[data-theme] body .competition-hero-europa-league::after,
html[data-theme] body .competition-hero-conference-league::after,
html[data-theme] body .competition-hero-copa-del-rey::after,
html[data-theme] body .competition-hero-resto-categorias::after,
html[data-theme] body .competition-hero-otras-competiciones::after {
  content: none !important;
  display: none !important;
  background-image: none !important;
}

/* Evitar pseudoiconos decorativos junto al título */
html[data-theme] body .competition-hero .hero-text h1::before,
html[data-theme] body .competition-hero .hero-text h1::after,
html[data-theme] body .competition-hero .competition-kicker::before,
html[data-theme] body .competition-hero .competition-kicker::after {
  content: none !important;
  display: none !important;
}

/* Temporada sin emblemas ni imágenes decorativas */
html[data-theme] body .competition-hero .hero-season-box,
html[data-theme] body .competition-hero .hero-season-box label,
html[data-theme] body .competition-hero .competition-season-value {
  background-image: none !important;
}


/* FDN: mejorar la legibilidad del logotipo de Champions */
html[data-theme] body .competition-hero-champions-league .competition-brand-mark {
  background: rgba(255,255,255,.94) !important;
  border-radius: 12px !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  box-shadow: 0 3px 12px rgba(0,0,0,.22) !important;
}

html[data-theme] body .competition-hero-champions-league .competition-brand-mark img {
  filter: none !important;
  max-width: 100% !important;
  max-height: 68px !important;
  object-fit: contain !important;
}


/* FDN: contraste correcto del botón VER COBERTURA */
html[data-theme] body .competition-view-btn {
  color: #fff !important;
  background: #ed1735 !important;
  border: 1px solid #ed1735 !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

html[data-theme] body a:hover .competition-view-btn,
html[data-theme] body a:focus-visible .competition-view-btn {
  color: #fff !important;
  background: #c90f2a !important;
  border-color: #c90f2a !important;
}

html[data-theme] body .coverage-match-link {
  color: #fff !important;
  background: #ed1735 !important;
  border-color: #ed1735 !important;
  font-weight: 800 !important;
  opacity: 1 !important;
}

html[data-theme] body .coverage-match-link:hover,
html[data-theme] body .coverage-match-link:focus-visible {
  color: #fff !important;
  background: #c90f2a !important;
  border-color: #c90f2a !important;
}
