/* Horarios de la página y del panel: agenda primero, por sentido. */
.ihb-horarios { display: grid; gap: 0.75rem; padding-block-start: 1rem; font-size: max(13.3px, 0.875rem); line-height: 1.4; }
.ihb-horarios *, .ihb-horarios *::before, .ihb-horarios *::after { box-sizing: border-box; }
.ihb-horarios__cabecera { margin: 0; }
.ihb-horarios__lema { margin: 0; max-width: 42rem; color: var(--ihb-tinta-suave); }
.ihb-horarios__panel { min-width: 0; container-type: inline-size; }
.ihb-horarios__dias { display: grid; gap: 1rem; }
.ihb-horarios__dia { scroll-margin-block-start: 4.5rem; }
.ihb-horarios__dia:focus-visible { outline: 3px solid var(--ihb-mar); outline-offset: 2px; }
.ihb-horarios__dia[hidden], .ihb-horarios__destino[hidden], .ihb-horarios__grupo[hidden], .ihb-horarios__grupo-proxima[hidden], .ihb-horarios__manana[hidden], .ihb-horarios__vacio[hidden] { display: none; }
html body.ihb-lienzo-activo .ihb-horarios__fecha { margin: 0 0 0.65rem; font-size: max(13.3px, 1.0625rem); font-weight: 800; color: var(--ihb-marino); }
.ihb-horarios__dia > .ihb-horarios__fecha[hidden] { display: none; }
.ihb-horarios__fecha::first-letter { text-transform: uppercase; }
.ihb-horarios__hoy-marca { display: inline-block; margin-inline-end: 0.35rem; padding: 0.1rem 0.45rem; border-radius: 999px; background: var(--ihb-marino); color: #fff; font-size: max(13.3px, 0.875rem); font-weight: 800; vertical-align: 0.05em; }

/* La misma franja y el mismo color identifican cada sentido en ambas vistas. */
.ihb-horarios [data-ihb-grupo="ir"] { --ihb-grupo-tinta: var(--ihb-atardecer-tinta, #a8531a); }
.ihb-horarios [data-ihb-grupo="regresar"] { --ihb-grupo-tinta: var(--ihb-marino, #011c40); }
.ihb-horarios__grupo { min-width: 0; margin-block-end: 0.8rem; }
html body.ihb-lienzo-activo .ihb-horarios__grupo-titulo { margin: 0 0 0.5rem; font-size: max(13.3px, 0.875rem); font-weight: 800; line-height: 1.35; color: var(--ihb-grupo-tinta, var(--ihb-marino)); }
.ihb-horarios__proximas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-block-end: 0.85rem; }
.ihb-horarios__grupo-proxima { min-width: 0; padding: 0.65rem; border: 1px solid var(--ihb-linea); border-inline-start: 3px solid var(--ihb-grupo-tinta, var(--ihb-marino)); border-radius: var(--ihb-radio-ficha-chica, 0.6rem); background: var(--ihb-papel); color: var(--ihb-tinta); }
.ihb-horarios__grupo-proxima .ihb-horarios__grupo-titulo { margin-block-end: 0.3rem; }
.ihb-horarios__grupo-proxima p { margin: 0.2rem 0 0; }
.ihb-horarios__grupo-proxima bdi { font-weight: 800; font-variant-numeric: tabular-nums; }
.ihb-horarios__grupo-proxima .ihb-horarios__corrida-hora { font-size: max(13.3px, 1.125rem); }
.ihb-horarios__grupo-proxima .ihb-horarios__corrida-cuando { display: block; }
.ihb-horarios__proxima-etiqueta { font-size: max(13.3px, 0.875rem); font-weight: 700; }
.ihb-horarios__proxima-hora { font-size: max(13.3px, 1.125rem); }
.ihb-horarios__proxima-ruta { font-size: max(13.3px, 0.875rem); font-weight: 600; }

.ihb-horarios__destinos { display: grid; gap: 8px; }
.ihb-horarios__destino { padding: 0.65rem 0.75rem; }
/* Cabecera de la ruta: nombre, un solo chip del cambio de hora con su «?» y el precio a la derecha. */
.ihb-horarios__cab { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-block-end: 0.5rem; }
html body.ihb-lienzo-activo .ihb-horarios__ruta { margin: 0; font-size: max(13.3px, 0.9375rem); font-weight: 700; color: var(--ihb-grupo-tinta, var(--ihb-marino)); }
.ihb-horarios__huso { margin: 0; font-size: max(13.3px, 0.8125rem); }
.ihb-horarios__ayuda { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: -8px 0 -8px -4px; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.ihb-horarios__ayuda-signo { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 1.5px solid var(--ihb-mar); border-radius: 50%; color: var(--ihb-mar); font-size: max(13.3px, 0.875rem); font-weight: 800; line-height: 1; }
.ihb-horarios__ayuda:focus-visible { outline: 3px solid var(--ihb-mar); outline-offset: 2px; border-radius: 50%; }
.ihb dialog.ihb-horarios__ayuda-ficha { position: fixed; inset: 50% auto auto 50%; width: min(32rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); margin: 0; padding: 1.25rem; transform: translate(-50%, -50%); overflow: auto; border: 0; border-radius: var(--ihb-radio-ficha, 1rem); background: var(--ihb-papel); color: var(--ihb-tinta); box-shadow: 0 1rem 3rem rgb(1 28 64 / 28%); }
.ihb dialog.ihb-horarios__ayuda-ficha:not([open]) { display: none; }
.ihb dialog.ihb-horarios__ayuda-ficha::backdrop { background: rgb(1 17 38 / 58%); }
.ihb-horarios__ayuda-ficha h2 { margin: 0 0 0.75rem; color: var(--ihb-marino); font-size: max(16px, 1.125rem); }
.ihb-horarios__ayuda-texto { margin: 0 0 1rem; font-size: max(13.3px, 0.875rem); font-weight: 500; }
.ihb-horarios__ayuda-cerrar { min-height: 44px; padding: 0.55rem 1rem; border: 1px solid var(--ihb-marino); border-radius: 999px; background: var(--ihb-marino); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.ihb-horarios__linea { display: flex; align-items: start; gap: 8px 12px; flex-wrap: wrap; }
.ihb-horarios__horas { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ihb-horarios__horas > li { display: grid; align-content: start; justify-items: start; gap: 0.2rem; }
.ihb-horarios__hora { display: inline-flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.15rem 0.35rem; min-width: 44px; min-height: 44px; padding: 0.3rem 0.65rem; background: var(--ihb-papel); color: var(--ihb-tinta) !important; font-size: max(13.3px, 0.9375rem); font-weight: 700; font-variant-numeric: tabular-nums; text-decoration: none !important; line-height: 1.3; transition: background-color var(--ihb-t-rapida) var(--ihb-curva), border-color var(--ihb-t-rapida) var(--ihb-curva); }
a.ihb-horarios__hora:hover { border-color: var(--ihb-mar); }
.ihb-horarios__hora.is-pasada { border-color: transparent; background: transparent; color: var(--ihb-tinta-suave) !important; font-weight: 600; }
.ihb-horarios__hora.is-siguiente { background: var(--ihb-ok, #17683f); border-color: var(--ihb-ok, #17683f); color: #fff !important; }
.ihb-horarios__estado { font-size: max(13.3px, 0.875rem); font-weight: 700; color: inherit; }
.ihb-horarios__salida-precio, .ihb-horarios__zona { font-size: max(13.3px, 0.875rem); color: var(--ihb-tinta-suave); }
.ihb-horarios__hora .ihb-horarios__zona { color: inherit; }
.ihb-horarios__precio { margin-inline-start: auto; font-size: max(13.3px, 0.875rem); font-weight: 700; color: var(--ihb-tinta-suave); }
.ihb-horarios__manana { margin: 0.45rem 0 0; font-size: max(13.3px, 0.875rem); font-weight: 600; color: var(--ihb-mar); }
.ihb-horarios__sin, .ihb-horarios__vacio { margin: 0.65rem 0 0; font-size: max(13.3px, 0.875rem); color: var(--ihb-tinta-suave); }
/* Las salidas que ya pasaron, en UNA línea de texto por ruta. */
.ihb-horarios__pasadas { margin: 0.5rem 0 0; color: var(--ihb-tinta-suave); font-size: max(13.3px, 0.875rem); font-weight: 600; }
.ihb-horarios__ver-manana { display: inline-flex; align-items: center; min-height: 44px; padding-inline: 0.25rem; color: var(--ihb-marino); font-weight: 700; text-decoration: underline; }
.ihb-horarios__destino .ihb-proxima__pie { margin: 0.5rem 0 0; padding: 0.45rem 0 0; }
.ihb-horarios__destino .ihb-proxima__huso, .ihb-horarios__destino .ihb-proxima__cuando { font-size: max(13.3px, 0.875rem); }
.ihb-horarios__pista { margin: 0.65rem 0; font-size: max(13.3px, 0.875rem); font-weight: 600; color: var(--ihb-marino); }

/* «Hoy · Mañana · Elegir fecha»: botón segmentado de tres partes, de 44 px de alto.
   Es contenedor para que el mes calcule su hueco con el ancho de la tira. */
.ihb-horarios__tira { container-type: inline-size; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.ihb-horarios__atajo, .ihb-horarios__fechas > summary { display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 44px; min-height: 44px; margin: 0; padding: 0.4rem 0.7rem; border: 1px solid var(--ihb-marino); background: var(--ihb-papel); color: var(--ihb-marino); font: inherit; font-size: max(13.3px, 0.875rem); font-weight: 700; line-height: 1.25; text-align: center; text-decoration: none !important; cursor: pointer; }
.ihb-horarios__atajo { border-start-start-radius: 999px; border-end-start-radius: 999px; }
.ihb-horarios__atajo + .ihb-horarios__atajo, .ihb-horarios__fechas { margin-inline-start: -1px; }
.ihb-horarios__atajo + .ihb-horarios__atajo { border-radius: 0; }
.ihb-horarios__fechas > summary { border-start-end-radius: 999px; border-end-end-radius: 999px; }
.ihb-horarios__atajo.is-elegido, .ihb-horarios__fechas > summary.is-elegido, .ihb-horarios__fechas[open] > summary { background: var(--ihb-marino); border-color: var(--ihb-marino); color: #fff; }
.ihb-horarios__fechas { min-width: 0; grid-column: 3; }
.ihb-horarios__fechas[open] { grid-column: 1 / -1; margin-inline-start: 0; margin-block-start: 8px; }
.ihb-horarios__fechas[open] > summary { border-radius: 999px; }
.ihb-horarios__fechas > summary::marker { content: ""; }
.ihb-horarios__fechas > summary::-webkit-details-marker { display: none; }
.ihb-horarios__fechas[open] .ihb-calendario { margin-block-start: 8px; }

/* Siete objetivos de 44 px caben a 360 px: se reduce sólo el hueco del mes. */
.ihb-calendario { display: grid; gap: 8px; }
.ihb-calendario__semana, .ihb-calendario__dias { display: grid; grid-template-columns: repeat(7, minmax(44px, 1fr)); gap: clamp(0px, calc((100cqi - 308px) / 6), 8px); }
.ihb-calendario__dias { list-style: none; margin: 0; padding: 0; }
.ihb-calendario__semana span { text-align: center; font-size: max(13.3px, 0.875rem); font-weight: 700; color: var(--ihb-tinta-suave); }
.ihb-calendario__hueco { min-height: 44px; }
.ihb-calendario__dia { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; width: 100%; min-width: 44px; min-height: 44px; padding: 0.2rem 0; text-decoration: none !important; }
.ihb-calendario__dia .ihb-agenda__dia-nombre { min-height: 0; font-size: max(13.3px, 0.875rem); line-height: 1.2; letter-spacing: 0; }
.ihb-calendario__dia .ihb-agenda__dia-num { font-size: max(13.3px, 1.125rem); }
.ihb-calendario__dia.is-hoy { border-color: var(--ihb-marino); box-shadow: inset 0 0 0 1px var(--ihb-marino); }
.ihb-calendario__dia.is-elegido { background: var(--ihb-marino); border-color: var(--ihb-marino); color: #fff; }
.ihb-calendario__dia.is-elegido .ihb-agenda__dia-nombre { color: #fff; }

/* Las rutas se eligen ANTES de la lista: en móvil y en el panel son una fila de
   chips que se desliza a un lado (sólo dentro de su contenedor, la página no se
   desborda). En pantalla ancha, la página las pone en una columna a la izquierda. */
.ihb-horarios__corridas { min-width: 0; display: flex; align-items: stretch; gap: 8px; margin: -6px; padding: 6px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 6px; overscroll-behavior-x: contain; scrollbar-width: thin; }
html body.ihb-lienzo-activo .ihb-horarios__corridas-titulo { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; font-size: max(13.3px, 0.9375rem); font-weight: 800; color: var(--ihb-tinta-suave); }
.ihb-horarios__corridas .ihb-horarios__grupo { display: contents; }
html body.ihb-lienzo-activo .ihb-horarios__corridas .ihb-horarios__grupo-titulo { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.ihb-horarios__lista { display: flex; align-items: stretch; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ihb-horarios__lista > li { display: flex; flex: 0 0 auto; scroll-snap-align: start; }
.ihb-horarios__corrida { display: grid; align-content: center; gap: 0.2rem; flex: 0 0 auto; min-width: 44px; min-height: 44px; padding: 0.6rem 0.75rem; border: 1px solid var(--ihb-linea); border-inline-start: 3px solid var(--ihb-grupo-tinta, var(--ihb-linea)); border-radius: var(--ihb-radio-ficha-chica, 0.6rem); background: var(--ihb-papel); color: var(--ihb-tinta); font: inherit; text-align: start; text-decoration: none !important; white-space: nowrap; cursor: pointer; scroll-snap-align: start; transition: background-color var(--ihb-t-rapida) var(--ihb-curva), border-color var(--ihb-t-rapida) var(--ihb-curva); }
.ihb-horarios__corrida:hover { border-color: var(--ihb-mar); }
.ihb-horarios__corrida-nombre { font-size: max(13.3px, 0.875rem); font-weight: 700; line-height: 1.25; color: var(--ihb-grupo-tinta, var(--ihb-marino)); }
.ihb-horarios__corrida-dato { font-size: max(13.3px, 0.875rem); font-weight: 600; color: var(--ihb-tinta-suave); }
.ihb-horarios__corrida-hora { font-variant-numeric: tabular-nums; font-weight: 800; color: var(--ihb-tinta); }
.ihb-horarios__corrida.is-activa { background: var(--ihb-arena); border-color: var(--ihb-linea); border-inline-start-color: var(--ihb-grupo-tinta, var(--ihb-marino)); }
.ihb-horarios__corrida.is-activa .ihb-horarios__corrida-dato { color: var(--ihb-tinta); }
.ihb-horarios__sin-servicio { min-width: 0; }
.ihb-horarios__acciones { display: flex; flex-wrap: wrap; gap: 8px; margin: 0.5rem 0 0; }
.ihb-horarios__accion { min-height: 44px; font-size: max(13.3px, 0.875rem); }

/* El foco puede verse entero incluso dentro del panel y del mes. */
.ihb-horarios :is(a, button, summary):focus-visible { outline: 3px solid var(--ihb-mar); outline-offset: 2px; scroll-margin-block: 5rem 1rem; }
.ihb-horarios .ihb-calendario__dia:focus-visible { outline-offset: -3px; }
/* Escritorio: en la página, las rutas pasan a una columna a la izquierda; el
   selector y la lista, a la derecha. El panel lateral conserva la fila de chips. */
@media (min-width: 64rem) {
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) { grid-template-columns: minmax(14rem, 19rem) minmax(0, 1fr); gap: 0.75rem 2rem; align-items: start; }
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) > .ihb-horarios__cabecera, .ihb-horarios:not(.ihb-agenda .ihb-horarios) > .ihb-horarios__sin-servicio { grid-column: 1 / -1; }
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) > .ihb-horarios__fecha-activa { grid-column: 2; grid-row: 2; }
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) > .ihb-horarios__corridas { grid-column: 1; grid-row: 2 / span 3; display: block; margin: 0; padding: 0; overflow: visible; scroll-snap-type: none; position: sticky; inset-block-start: 4.5rem; }
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) > .ihb-horarios__tira { grid-column: 2; grid-row: 3; }
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) > .ihb-horarios__panel { grid-column: 2; grid-row: 4; }
	html body.ihb-lienzo-activo .ihb-horarios:not(.ihb-agenda .ihb-horarios) .ihb-horarios__corridas-titulo, html body.ihb-lienzo-activo .ihb-horarios:not(.ihb-agenda .ihb-horarios) .ihb-horarios__corridas .ihb-horarios__grupo-titulo { position: static; width: auto; height: auto; margin: 0 0 0.65rem; overflow: visible; clip-path: none; white-space: normal; }
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) .ihb-horarios__corridas .ihb-horarios__grupo { display: block; }
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) .ihb-horarios__lista { display: grid; grid-template-columns: 1fr; }
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) .ihb-horarios__corrida { width: 100%; white-space: normal; }
	.ihb-horarios:not(.ihb-agenda .ihb-horarios) .ihb-horarios__corrida[data-ihb-ruta="todas"] { margin-block-end: 0.8rem; }
}
@media (min-width: 70rem) { .ihb-agenda__cuerpo { display: block; } }
@media (prefers-reduced-motion: reduce) { .ihb-horarios *, .ihb-horarios *::before { animation: none !important; transition: none !important; } }
