/* Reservar día, opción C: calendario del mes y horas de llegada a la izquierda, resumen a la derecha.
   Debajo de 992 px, una columna y el resumen fijo abajo para tener el botón siempre a mano. */
.reservar{--libre:#23824a;--pocas:#b77900;--completo:var(--mal);
  display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:clamp(32px,5vw,72px);align-items:start;margin:8px 0 56px;padding-bottom:48px;border-bottom:1px solid var(--tinta)}
.reservar-elegir{min-width:0;max-width:600px}
.reservar-titulo{margin:0;font:400 56px/1 var(--t-hue);letter-spacing:-.02em;text-wrap:balance;outline:0}
.reservar-sub{margin:12px 0 28px;max-width:46ch;color:var(--tinta-suave)}

.reservar-cabeza{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.reservar-cabeza h3{flex:1;order:-1;margin:0;font:400 30px/1.1 var(--t-hue)}
.reservar-flecha{width:44px;height:44px;border:1px solid var(--tinta);border-radius:50%;background:var(--blanco);color:var(--tinta);cursor:pointer;font:400 22px/1 var(--t-suisse)}
.reservar-flecha:disabled{opacity:.3;cursor:default}

.reservar-semana,.reservar-dias{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;text-align:center}
.reservar-semana{margin-bottom:6px;font:400 13px/18px var(--t-greed);text-transform:uppercase;color:var(--tinta-suave)}
.reservar-dias button{position:relative;aspect-ratio:1;min-height:44px;padding:0;border:1px solid #d6d6d6;border-radius:10px;background:var(--blanco);color:var(--tinta);cursor:pointer;font:400 15px/1 var(--t-suisse);transition:background-color .18s ease,color .18s ease,border-color .18s ease}
.reservar-dias button:disabled{border-color:transparent;background:none;color:#a3a3a3;cursor:default}
.reservar-dias button.completo{text-decoration:line-through}
.reservar-dias button:is(.libre,.pocas,.completo)::after{content:"";position:absolute;left:50%;bottom:16%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--libre)}
.reservar-dias button.pocas::after{background:var(--pocas)}
.reservar-dias button.completo::after{background:var(--completo)}
.reservar-dias button[aria-pressed="true"]{border-color:var(--tinta);background:var(--tinta);color:#fff}
.reservar-dias button[aria-pressed="true"]::after{background:#fff}
.reservar-dias[aria-busy="true"]{opacity:.45;transition:opacity .2s ease .15s}

.reservar-leyenda{display:flex;flex-wrap:wrap;gap:6px 16px;margin:14px 0 30px;font-size:14px;color:var(--tinta-suave)}
.reservar-leyenda span::before{content:"";display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%;background:var(--libre)}
.reservar-leyenda .pocas::before{background:var(--pocas)}.reservar-leyenda .completo::before{background:var(--completo)}

/* Horas compactas (DIRECCIÓN, 11 nov): dos franjas, Mañana y Tarde, con pastillas de hora; las plazas solo cuando quedan pocas. */
.reservar-horas{display:grid;gap:14px;margin-top:10px}
.reservar-franja{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.reservar-franja .etq{flex:0 0 100%;margin:0;font-size:13px;line-height:16px;color:var(--tinta-suave)}
.reservar-horas button{display:grid;align-content:center;justify-items:center;min-width:64px;min-height:44px;padding:4px 10px;border:1px solid #d6d6d6;border-radius:72px;background:var(--blanco);color:var(--tinta);cursor:pointer;animation:entra .22s var(--sal) backwards}
.reservar-horas b{font:400 15px/18px var(--t-suisse)}
.reservar-horas small{font-size:11px;line-height:13px;color:var(--tinta-suave)}
.reservar-horas button[aria-pressed="true"]{border-color:var(--tinta);background:var(--tinta);color:#fff}
.reservar-horas button[aria-pressed="true"] small{color:#e2e2e2}
.reservar-horas button:disabled{border-style:dashed;border-color:#b5b5b5;background:none;color:#a3a3a3;cursor:default}
/* Sin venta en la web ese día: el sello de las hormigas, no una X. */
.reservar-dias button.sin-venta::after{content:"";position:absolute;left:50%;bottom:8%;width:14px;height:14px;margin-left:-7px;background:url("/mi-eito/cuenta/simbolo.svg") 50%/contain no-repeat;opacity:.45}
.reservar-leyenda .sin-venta::before{width:12px;height:12px;border-radius:0;background:url("/mi-eito/cuenta/simbolo.svg") 50%/contain no-repeat;vertical-align:-2px}
.reservar-leyenda [hidden]{display:none}
.reservar :is(.reservar-dias,.reservar-horas) button:focus-visible{outline:2px solid var(--tinta);outline-offset:2px}

.reservar-resumen{position:sticky;top:24px;display:grid;gap:12px;padding:24px;border:1px solid var(--tinta);border-radius:var(--radio);background:var(--blanco)}
.reservar-resumen .etq{margin:0}
.reservar-elegido{margin:0;font:400 26px/1.15 var(--t-hue)}
.reservar-aviso{margin:0;font:400 15px/21px var(--t-suisse);outline:0}
.reservar :is(.reservar-flecha,.seguir)[aria-disabled="true"]{opacity:.55;cursor:progress}.reservar-aviso:empty{display:none}
.reservar-resumen .seguir{text-wrap:balance}
.reservar-no{justify-self:center;display:inline-flex;align-items:center;min-height:44px;font-size:15px}
.reservar[data-estado="hecho"] :is(.reservar-sub,.reservar-cabeza,.reservar-semana,.reservar-dias,.reservar-leyenda,#reservar-horas-titulo,.reservar-horas,#reservar-boton){display:none}
.reservar[data-estado="parado"] :is(.reservar-cabeza,.reservar-semana,.reservar-dias,.reservar-leyenda,#reservar-horas-titulo,.reservar-horas,#reservar-boton){display:none}
.reservar-ok{margin:0 0 10px;font:400 15px/18px var(--t-greed);text-transform:uppercase;letter-spacing:.04em}
@media (hover:hover) and (pointer:fine){
  .reservar-dias button:not(:disabled,[aria-pressed="true"]):hover,.reservar-horas button:not(:disabled,[aria-pressed="true"]):hover{border-color:var(--tinta);box-shadow:inset 0 0 0 1px var(--tinta)}
  .reservar-flecha:not(:disabled):hover{background:var(--tinta);color:#fff}
}

@media (max-width:991px){
  .reservar{grid-template-columns:minmax(0,1fr);gap:24px;margin:0 0 40px;padding-bottom:0;border-bottom:0}
  .reservar-elegir{max-width:none}
  .reservar-titulo{font-size:40px}
  .reservar-resumen{top:auto;bottom:0;gap:8px;margin:0 -3vw;padding:14px 3vw calc(14px + env(safe-area-inset-bottom));border-width:1px 0 0;border-radius:var(--radio) var(--radio) 0 0;box-shadow:0 -10px 24px rgba(40,40,40,.08)}
  .reservar-elegido{font-size:21px}
  .reservar-resumen .etq{font-size:13px}
  .reservar-no{min-height:40px}
}
@media (min-width:600px) and (max-width:991px){.reservar-cabeza,.reservar-dias,.reservar-semana{max-width:560px}}
@media (prefers-reduced-motion:reduce){.reservar-horas button{animation:none}.reservar-dias button{transition:none}}
.compra-vuelta:not([data-estado="elegir"]) .reservar{display:none}

/* Antes de pagar (compra-calendario.js): el calendario va bajo la galería, con el ticket al lado. «Tu reserva» y «Pagar» están en la barra de pago. */
.reservar.antes{margin:40px 0 0;padding:32px 0 0;border-top:1px solid var(--tinta);border-bottom:0;scroll-margin-top:16px}
.compra-vuelta .reservar.antes{margin-inline:max(16px,calc(50% - 520px))}
.reservar.antes .reservar-titulo{font-size:40px}
.reservar.antes .reservar-resumen{position:sticky;top:24px;bottom:auto;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.reservar.antes :is(.reservar-resumen>.etq,.reservar-elegido,#reservar-boton,.reservar-no,.reservar-ok){display:none}
/* «Siguiente» (Andrea, 12 nov): siempre hay cómo seguir sin reservar. Debajo dice qué pasa: «Sin reservar por ahora». */
.reservar-siguiente{display:inline-grid;justify-items:start;align-content:center;gap:2px;min-height:48px;margin:28px 0 0;padding:6px 26px;border:1px solid var(--tinta);border-radius:72px;background:var(--blanco);color:var(--tinta);cursor:pointer;text-align:left}
.reservar-siguiente b{font:400 16px/19px var(--t-suisse)}
.reservar-siguiente small{font:400 12px/14px var(--t-suisse);color:var(--tinta-suave)}
.reservar-siguiente small:empty{display:none}
.reservar-siguiente:focus-visible{outline:2px solid var(--tinta);outline-offset:2px}
.reservar.antes[data-estado="saltado"] .reservar-siguiente{margin-top:0}
.reservar.antes[data-estado="saltado"] :is(.reservar-cabeza,.reservar-semana,.reservar-dias,.reservar-leyenda,#reservar-horas-titulo,.reservar-horas){display:none}
@media (max-width:991px){.reservar.antes .reservar-titulo{font-size:32px}.reservar.antes .reservar-resumen{position:static}}