/* assets/extra.css - CSS que el original inyectaba en tiempo de ejecucion y que NO esta en ninguna hoja descargada.
 *
 * POR QUE EXISTE: assets/estilos-originales.css es la hoja original intacta (PLANOS.md 2.1.3). Next.js anadia ademas,
 * desde JavaScript (styled-jsx, <style id="a21197af154775f4">), el bloque de abajo, ligado a la clase
 * jsx-a21197af154775f4 de "¿Por qué elegirnos?" (inicio). Sin el, los iconos de las 4 tarjetas no se sacuden al pasar
 * el raton.
 *
 * DE DONDE SALE: literal del chunk referencia/js/app_page-bb06cf2cae1d5f3f.js (modulo 8724, propiedad children del
 * <style>), cotejado con lo medido en el sitio vivo (referencia/TOKENS.md seccion 6). Se quitan solo los prefijos
 * -webkit-/-moz-/-o- duplicados (Chromium, Firefox y Safari actuales leen las propiedades sin prefijo; el efecto es
 * el mismo). No se cambia ni un valor.
 *
 * LO QUE NO VA AQUI (medido el 2026-10-07, ver assets/sitio.js, punto 13):
 *   - el giro del adorno del hero: es `.animate-spin` + `@keyframes spin` de la hoja original con style
 *     "animation-duration:6s" inline (6 s por vuelta, horario). Ya esta en estilos-originales.css.
 *   - animate-slideInLeft / animate-slideInRight: no tienen regla en el original; se dejan sin efecto, igual que alli.
 *   - bg-opacity-95 y bg-opacity-90: sin regla en el original (Tailwind v4 no las genera); sin efecto alli, sin regla aqui.
 */
@keyframes wiggle {
  0%, 100% { transform: rotate(0deg); }
  10%, 30%, 50%, 70%, 90% { transform: rotate(-15deg); }
  20%, 40%, 60%, 80% { transform: rotate(15deg); }
}
.animate-shake:hover { animation: wiggle 1s ease-in-out; }
.group:hover .group-hover-shake { animation: wiggle 1s ease-in-out; }

/* "Revisado por" y "Fuentes" (plantillas/revision-autor.html y revision-fuentes.html), agregados 2026-10-08 por la
 * clinica. No existen en el original. */
.revision-fuentes { border-top-color: #e5e7eb; }
.revision-fuentes a { text-decoration: underline; text-underline-offset: 2px; }

/* Pagina legal (plantillas/legal.html) y enlace "Aviso de privacidad" del pie, agregados 2026-10-08 por la clinica. */
.legal ol { list-style: decimal; }
.legal li { margin-bottom: .25rem; }
.aviso-privacidad a { text-decoration: underline; text-underline-offset: 2px; }

/* Enlace a las opiniones de Doctoralia bajo los testimonios del inicio (2026-10-09, clinica). */
.testimonios-fuente a { text-decoration: underline; text-underline-offset: 2px; }

/* Carrusel vertical de opiniones del inicio (plantillas/inicio.html), 2026-10-09, clinica. No existe en el original.
 * Bucle continuo: cada pista lleva su lista dos veces; se desplaza la altura de una copia (50 % de la pista menos la
 * mitad del espacio entre copias). */
.opiniones-carrusel, .opiniones-movil {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 90%, transparent);
          mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 90%, transparent);
}
.opiniones-carrusel { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; height: 620px; }
.opiniones-movil { display: none; height: 560px; }
.opiniones-col { overflow: hidden; }
.opiniones-pista, .opiniones-copia { display: flex; flex-direction: column; gap: 1.5rem; }
.opiniones-pista { animation: opiniones-subir var(--dur, 70s) linear infinite; }
.opiniones-col.inversa .opiniones-pista { animation-direction: reverse; }
.opiniones-carrusel:hover .opiniones-pista, .opiniones-movil:hover .opiniones-pista { animation-play-state: paused; }
@keyframes opiniones-subir { from { transform: translateY(0); } to { transform: translateY(calc(-50% - .75rem)); } }
.opinion-tarjeta { margin: 0; background: #fff; border-radius: 1rem; padding: 1.5rem; box-shadow: 0 4px 16px rgba(58, 68, 109, .08); border: 1px solid #eceef5; }
.opinion-estrellas { color: var(--color-mcolor2); letter-spacing: .15em; font-size: .95rem; margin-bottom: .75rem; }
.opinion-texto { margin: 0 0 1rem; color: var(--color-graydark); line-height: 1.6; font-size: .975rem; }
.opinion-pie { display: flex; align-items: center; gap: .75rem; }
.opinion-iniciales { flex-shrink: 0; min-width: 2.75rem; height: 2.75rem; padding: 0 .5rem; border-radius: 9999px; background: var(--color-mcolor1); color: #fff; font-weight: 600; font-size: .8rem; display: flex; align-items: center; justify-content: center; }
.opinion-meta { font-size: .78rem; line-height: 1.35; color: var(--color-graymedium); }
.testimonios-fuente { color: var(--color-mcolor1); }
@media (max-width: 767px) {
  .opiniones-carrusel { display: none; }
  .opiniones-movil { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  .opiniones-pista { animation: none; }
  .opiniones-copia { display: none; }
  .opiniones-carrusel, .opiniones-movil { height: auto; -webkit-mask-image: none; mask-image: none; }
}

/* /nuestro-equipo (plantilla indice), 2026-10-09: las fotos de los medicos son verticales; encuadre arriba. Y el
 * "Ver más" de los sintomas del inicio, ahora un enlace, conserva el bloque y el centrado del boton original. */
img[src^="/home/team/ourteam-img-"].object-cover { object-position: center top; }
a.ver-mas-sintoma { display: inline-block; text-align: center; }

/* Menu de escritorio con 6 opciones ("Nuestro equipo", 2026-10-09): entre 1024 y 1439 px no cabia (empujaba los iconos
 * de redes fuera de la pantalla o partia "Nuestro equipo" en dos renglones); se reduce solo la separacion entre
 * opciones. Desde 1440 px queda la del original. Las etiquetas nunca se parten. */
nav.hidden.lg\:flex span { white-space: nowrap; }
@media (min-width: 1024px) and (max-width: 1439.98px) {
  nav.hidden.lg\:flex > * { margin-inline: 0 !important; }
  nav.hidden.lg\:flex > a, nav.hidden.lg\:flex > div > button, nav.hidden.lg\:flex > div > a { padding-left: .5rem !important; padding-right: .5rem !important; }
}

/* PLANOS 11.21 (2026-10-09): el boton "subir" (contenedor fixed bottom-4 right-4) quedaba debajo del flotante de
   WhatsApp y el raton no podia pulsarlo. Se sube por encima del de WhatsApp y se alinea con el (right 1.5rem).
   Se ataca por clase y no se cambia el marcado porque sitio.js busca div.fixed.bottom-4.right-4. */
div.fixed.bottom-4.right-4.z-50 { bottom: 4rem; right: 1.5rem; }

/* PLANOS 11.22 (2026-10-09): la tira de 22 miniaturas (justify-center + overflow-x-auto) desbordaba por los dos
   lados y las primeras quedaban fuera de alcance. "safe center" centra cuando caben y, si no caben, empieza por la
   izquierda para que el desplazamiento llegue a todas. */
.galeria-miniaturas { justify-content: safe center; }

/* Recuadro "Cuándo acudir a urgencias" (plantillas/signos-alarma.html), 2026-10-12 */
.signos-alarma { background: #fef2f2; border-left: 4px solid #dc2626; border-radius: .5rem; padding: 1rem 1.25rem; margin-bottom: 2rem; }
.signos-alarma h2 { color: #b91c1c; font-size: 1.375rem; font-weight: 700; margin-bottom: .5rem; }
.signos-alarma p { color: #1f2937; font-weight: 600; margin: .75rem 0 .25rem; }
.signos-alarma p:first-of-type { margin-top: 0; }
.signos-alarma ul { list-style: disc; padding-left: 1.5rem; }
.signos-alarma li { color: #1f2937; line-height: 1.6; }
.signos-alarma a { color: #b91c1c; text-decoration: underline; }

/* Boton "Agende en linea en Doctoralia" de la tarjeta lateral (plantillas/cta-individual.html), 2026-10-12 */
.cta-doctoralia { display: block; max-width: 28rem; margin: 1rem auto 0; padding: .75rem 2rem; border-radius: .5rem;
  background: #fff; color: #2e3a6b; font-weight: 600; font-size: 1.125rem; text-align: center;
  box-shadow: 0 1px 3px rgba(0,0,0,.15); transition: background-color .3s, color .3s; }
.cta-doctoralia:hover { background: #00c3a5; color: #fff; }
