/*
  Rediseño visual "Avivamiento — Fuego y Gloria" aplicado a ABN Televisión (avivamiento-tv.php)
  Capa de estilos que se aplica ENCIMA de devocional.css y del <style> inline de la página.
  No modifica estructura HTML ni la lógica del player de Video.js: solo redefine color, tipografía y esquinas.
*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;600;700&family=Open+Sans:wght@400;600&display=swap');

:root {
  --av-fire-1: #ff6a3d;
  --av-fire-2: #ffb648;
  --av-royal-1: #3b1e6d;
  --av-royal-2: #6d3bb0;
  --av-glow: rgba(255, 140, 66, 0.45);
  --av-radius: 18px;
}

/* Tipografía general */
#main h1,
#main h2,
#main h3,
#main h5,
#main .card-title {
  font-family: 'Poppins', 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px;
}

#main p,
#main .card-text {
  font-family: 'Open Sans', sans-serif;
}

#main .card-title a {
  color: inherit;
  transition: color 0.25s ease;
}

#main .card-title a:hover {
  color: var(--av-fire-1);
}

/* Player en vivo y miniaturas de video: solo se agrega el radio de esquina, sin tocar borde/sombra originales */
#main .videoImage {
  border-radius: var(--av-radius);
}

#main .about--main-video {
  border-radius: var(--av-radius);
}

#main .about--main-video img {
  border-radius: var(--av-radius);
}

/* El overlay de carga del player hereda el mismo radio para no romper las esquinas redondeadas */
#abn-loading-overlay {
  border-radius: var(--av-radius) !important;
}

/* Tarjetas de "Acerca de" — mismo tratamiento que en la portada */
#main #about-boxes .card {
  border: none;
  border-radius: var(--av-radius);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

#main #about-boxes .card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(255, 106, 61, 0.25);
}