/* Reserva por pasos, calendario de fechas, recibo y pase (componentes compartidos: js/reserva-flujo.js, js/calendario.js,
   js/pase.js). Solo tokens de tokens.css (con respaldo cuando una app no define alguno); nada de colores sueltos.
   Prefijo rv- para no chocar con las clases propias de cada app. */

/* Lo escondido se esconde aunque la app no traiga [hidden]{display:none} (aquí casi todo es flex o grid). */
:is(.rv-nav,.rv-paso,.rv-recibo,.rv-nav-btn)[hidden]{display:none}

/* ---------- Pasos ---------- */
.rv-pasos{margin:0 0 20px;overflow-x:auto;scrollbar-width:none}
.rv-pasos::-webkit-scrollbar{display:none}
.rv-pasos ol{list-style:none;margin:0;padding:0;display:flex;gap:6px}
.rv-pasos a{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 6px;border-radius:999px;color:var(--tinta-2);text-decoration:none;font-weight:600;font-size:var(--t-chico,.875rem);white-space:nowrap;border:1px solid var(--linea);background:var(--superficie)}
.rv-paso-n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--fondo-2,var(--fondo));color:var(--tinta)}
.rv-pasos a.rv-hecho .rv-paso-n{background:var(--ok);color:var(--superficie)}
.rv-pasos a[aria-current="step"]{background:var(--marca);border-color:var(--marca);color:var(--sobre-marca)}
.rv-pasos a[aria-current="step"] .rv-paso-n{background:var(--sobre-marca);color:var(--marca)}
.rv-pasos a[aria-disabled="true"]{opacity:.5;pointer-events:none}

.rv-rejilla{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
@media (min-width:980px){.rv-rejilla{grid-template-columns:minmax(0,1fr) 380px;align-items:start}}
.rv-paso{background:var(--superficie);border-radius:var(--radio-tarjeta,20px);box-shadow:var(--sombra);padding:clamp(16px,3vw,28px);min-width:0}
.rv-paso-tit{font-size:var(--t-2,1.75rem);margin:0 0 14px;outline:none}
.rv-paso-sub{margin:20px 0 10px;font-size:1.0625rem;font-weight:600;font-family:var(--sans)}
.rv-gris{color:var(--tinta-2)}
.rv-nota{margin:10px 0 0;font-size:var(--t-chico,.875rem);color:var(--tinta-2)}
.rv-motivo{color:var(--aviso);font-weight:600}

/* Dos maneras de reservar (radio en botones) */
.rv-segmento{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:6px;border-radius:var(--radio-tarjeta,20px);background:var(--fondo-2,var(--fondo))}
.rv-segmento button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:64px;padding:10px 14px;border:0;border-radius:var(--radio,14px);background:transparent;color:var(--tinta);text-align:left;cursor:pointer;min-width:0}
.rv-segmento button small{color:var(--tinta-2);font-size:var(--t-chico,.875rem);line-height:1.3}
.rv-segmento button[aria-checked="true"]{background:var(--superficie);box-shadow:var(--sombra)}
.rv-segmento button[aria-checked="true"] b{color:var(--marca)}
@media (max-width:379px){.rv-segmento{grid-template-columns:1fr}}

/* Opciones con foto */
.rv-opciones{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr))}
.rv-opcion{display:grid;grid-template-columns:104px minmax(0,1fr);gap:12px;align-items:center;padding:8px;border-radius:var(--radio,14px);border:2px solid var(--linea);background:var(--superficie);color:var(--tinta);text-align:left;cursor:pointer;min-width:0;font:inherit}
.rv-opcion img{width:104px;height:92px;object-fit:cover;border-radius:var(--radio-chico,10px)}
@media (min-width:400px){.rv-opcion{grid-template-columns:132px minmax(0,1fr)}.rv-opcion img{width:132px;height:104px}}
.rv-opcion:hover{border-color:var(--marca)}
.rv-opcion[aria-checked="true"]{border-color:var(--marca);background:var(--marca-suave)}
.rv-opcion-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.rv-opcion-txt b{font-size:1rem;line-height:1.25;overflow-wrap:anywhere}
.rv-opcion-txt>small{color:var(--tinta-2);font-size:var(--t-chico,.875rem);line-height:1.3}
.rv-opcion-precio{margin-top:4px;font-weight:600}
.rv-opcion-precio small{color:var(--tinta-2);font-size:var(--t-chico,.875rem);font-weight:400}

/* Detalle del día y chips */
.rv-detalle{margin-top:16px;padding:14px;border-radius:var(--radio,14px);background:var(--fondo)}
.rv-detalle p{margin:0 0 6px}
.rv-detalle-fecha{font-weight:600}
.rv-detalle-fecha::first-letter{text-transform:uppercase}
.rv-chips{border:0;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.rv-chips legend{padding:0;margin-bottom:8px;font-weight:600}
.rv-chip{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--linea);background:var(--superficie);color:var(--tinta);font:inherit;font-weight:600;cursor:pointer}
.rv-chip[aria-pressed="true"]{background:var(--marca);border-color:var(--marca);color:var(--sobre-marca)}
.rv-chip:disabled{opacity:.4;cursor:not-allowed;text-decoration:line-through}

/* Contadores de personas */
.rv-contadores{display:grid;gap:4px}
.rv-contador{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--linea)}
.rv-contador-txt{display:flex;flex-direction:column;min-width:0}
.rv-contador-txt small{color:var(--tinta-2);font-size:var(--t-chico,.875rem)}
.rv-contador-ctrl{display:flex;align-items:center;gap:10px;flex:none}
.rv-redondo{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--linea);background:var(--superficie);color:var(--tinta);font-size:1.25rem;cursor:pointer}
.rv-redondo:hover{border-color:var(--marca);color:var(--marca)}
.rv-redondo:disabled{opacity:.4;cursor:not-allowed}
.rv-contador-n{min-width:2ch;text-align:center;font-size:1.5rem;font-weight:600;display:inline-block;font-variant-numeric:tabular-nums}

/* Lista con punto (política, qué sigue) */
.rv-lista-punto{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.rv-lista-punto li{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:var(--radio-chico,10px);background:var(--fondo)}
.rv-lista-punto i{flex:none;width:12px;height:12px;border-radius:50%;margin-top:6px;background:var(--marca)}

/* Atrás / Continuar, pegados abajo mientras se elige */
.rv-nav{position:sticky;bottom:0;z-index:15;display:flex;align-items:center;gap:10px;margin-top:14px;padding:10px max(12px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));border-radius:var(--radio-tarjeta,20px) var(--radio-tarjeta,20px) 0 0;background:var(--vidrio-fuerte,var(--superficie));box-shadow:var(--sombra)}
.rv-nav [data-rv-siguiente]{margin-left:auto}
.rv-nav [aria-disabled="true"]{opacity:.55}
@media (min-width:980px){.rv-nav{padding:12px 16px calc(12px + env(safe-area-inset-bottom))}}
/* En celular la barra de resumen (hoja.css) va junto a Atrás/Continuar, que se vuelven flechas de 44 px. */
.rv-nav .resumen-barra{flex:1 1 auto;width:auto;min-width:0;min-height:48px;padding:4px 10px 4px 12px;gap:8px}
@media (max-width:979px){
  .rv-nav:has(.resumen-barra:not([hidden])){gap:6px}
  .rv-nav:has(.resumen-barra:not([hidden])) .rv-nav-btn{flex:none;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;gap:0;justify-content:center}
  .rv-nav:has(.resumen-barra:not([hidden])) .rv-nav-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .rv-recibo{display:none}
}
@media (max-width:479px){.rv-nav{margin-inline:-16px}.rv-nav .resumen-barra-flecha{display:none}}

/* ---------- Recibo ---------- */
.rv-recibo{position:sticky;top:calc(var(--cabecera-alto,72px) + 16px)}
.rv-recibo-papel{background:var(--superficie);border-radius:var(--radio-tarjeta,20px);box-shadow:var(--sombra);padding:18px;background-image:linear-gradient(var(--superficie),var(--superficie)),repeating-linear-gradient(90deg,var(--linea) 0 6px,transparent 6px 12px);background-size:100% calc(100% - 3px),100% 3px;background-position:top,bottom;background-repeat:no-repeat}
.rv-recibo-tit{font-size:1.5rem;margin:0 0 10px}
.rv-recibo-prod{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.rv-recibo-prod img{width:96px;height:72px;object-fit:cover;border-radius:var(--radio-chico,10px);flex:none}
.rv-recibo-prod span{display:flex;flex-direction:column;min-width:0}
.rv-recibo-prod b{overflow-wrap:anywhere}
.rv-recibo-prod small{color:var(--tinta-2);font-size:var(--t-chico,.875rem)}
.rv-lineas{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.rv-lineas li{display:flex;justify-content:space-between;gap:12px;font-size:.9375rem}
.rv-lineas li span:first-child{color:var(--tinta-2)}
.rv-fuertes{margin-top:10px;padding-top:10px;border-top:1px solid var(--linea)}
.rv-fuertes li span{color:var(--tinta);font-weight:600}
.rv-recibo-total{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--linea);font-weight:600}
.rv-recibo-odo{font-family:var(--display);font-size:2.2rem;color:var(--marca-oscura,var(--marca));font-variant-numeric:lining-nums}
.rv-recibo-odo .od-suf{font-family:var(--sans);font-size:var(--t-chico,.875rem);margin:.9em 0 0 .3em;color:var(--tinta-2)}
.hm-cuerpo .rv-recibo-prod{margin-top:4px}
/* Odómetro (js/odometro.js) para páginas que no cargan apps-base.css */
.rv-recibo-odo.odo{display:inline-flex;align-items:flex-start;line-height:1}
.rv-recibo-odo .od-d{display:inline-block;height:1em;overflow:hidden}
.rv-recibo-odo .od-strip{display:flex;flex-direction:column;will-change:transform}
.rv-recibo-odo .od-strip span{display:block;height:1em;line-height:1}
.rv-recibo-odo :is(.od-comma,.od-cur,.od-suf){display:inline-block;line-height:1}

/* ---------- Calendario ---------- */
.rv-cal-cab{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.rv-cal-mes{margin:0;font-family:var(--sans);font-size:1.0625rem;font-weight:600}
.rv-cal-mes::first-letter{text-transform:uppercase}
.rv-cal-nav{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--linea);background:var(--superficie);color:var(--tinta);font-size:1.5rem;cursor:pointer}
.rv-cal-nav:disabled{opacity:.35;cursor:default}
.rv-cal-sem,.rv-cal-rejilla{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.rv-cal-sem span{text-align:center;font-size:var(--t-chico,.875rem);font-weight:600;color:var(--tinta-2);text-transform:capitalize;padding:4px 0}
.rv-cal-dia{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:48px;padding:4px 2px;border-radius:var(--radio-chico,10px);border:1px solid var(--linea);background:var(--superficie);color:var(--tinta);cursor:pointer;font:inherit;min-width:0}
.rv-cal-dia:hover{border-color:var(--marca)}
.rv-cal-n{font-weight:600;font-size:.9375rem;line-height:1.1}
.rv-cal-p,.rv-cal-s{display:none;font-size:var(--t-chico,.875rem);line-height:1.1;color:var(--tinta-2);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rv-cal-punto{display:block;width:6px;height:6px;border-radius:50%;background:var(--ok)}
.rv-nivel-alto .rv-cal-punto,.rv-leyenda .rv-nivel-alto{background:var(--acento)}
.rv-nivel-pocos .rv-cal-punto,.rv-leyenda .rv-nivel-pocos{background:var(--aviso)}
.rv-nivel-confirmar .rv-cal-punto,.rv-leyenda .rv-nivel-confirmar{background:transparent;box-shadow:inset 0 0 0 1.5px var(--tinta-2)}
.rv-cal-dia.rv-no{background:transparent;border-style:dashed;color:var(--tinta-2);cursor:not-allowed}
.rv-cal-dia.rv-no .rv-cal-n{text-decoration:line-through;font-weight:400}
.rv-cal-dia.rv-no .rv-cal-punto,.rv-leyenda .rv-no{background:var(--linea)}
.rv-cal-dia.rv-elegido{background:var(--marca);border-color:var(--marca);color:var(--sobre-marca)}
.rv-cal-dia.rv-elegido :is(.rv-cal-p,.rv-cal-s){color:var(--sobre-marca)}
.rv-cal-dia.rv-elegido .rv-cal-punto{background:var(--sobre-marca);box-shadow:none}
.rv-cal-vacio{min-height:48px}
@media (min-width:640px){.rv-cal-dia{min-height:64px}.rv-cal-p,.rv-cal-s{display:block}.rv-cal-dia .rv-cal-punto{position:absolute;top:6px;right:6px}}
@media (max-width:379px){.rv-cal-sem,.rv-cal-rejilla{gap:2px}.rv-cal{margin-inline:-8px}.rv-cal-dia{padding-inline:0}}
/* Fila deslizable (crearCalendario con fila:true): pastillas en un riel con scroll-snap; se desvanece donde sigue. */
.rv-cal-fila .rv-cal-cab{margin-bottom:6px}
.rv-cal-riel{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:4px;padding:4px 4px 8px;margin-inline:-4px;scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab}
.rv-cal-riel::-webkit-scrollbar{display:none}
.rv-cal-fila.rv-hay-despues .rv-cal-riel{-webkit-mask-image:linear-gradient(90deg,black calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,black calc(100% - 40px),transparent)}
.rv-cal-fila.rv-hay-antes .rv-cal-riel{-webkit-mask-image:linear-gradient(90deg,transparent,black 40px);mask-image:linear-gradient(90deg,transparent,black 40px)}
.rv-cal-fila.rv-hay-antes.rv-hay-despues .rv-cal-riel{-webkit-mask-image:linear-gradient(90deg,transparent,black 40px,black calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent,black 40px,black calc(100% - 40px),transparent)}
.rv-cal-fila.rv-arrastrando .rv-cal-riel{scroll-snap-type:none;cursor:grabbing;user-select:none}
.rv-cal-fila .rv-cal-dia{flex:0 0 auto;width:var(--rv-pastilla,76px);min-height:96px;gap:2px;padding:10px 4px 12px;border-radius:999px;scroll-snap-align:start}
.rv-cal-sem1{font-size:var(--t-chico,.875rem);color:var(--tinta-2);text-transform:capitalize;line-height:1.1}
.rv-cal-fila .rv-cal-n{font-size:1.375rem;line-height:1.1}
.rv-cal-fila :is(.rv-cal-p,.rv-cal-s){display:block}
.rv-cal-fila .rv-cal-dia .rv-cal-punto{position:static;margin-top:2px}
.rv-cal-fila .rv-cal-dia.rv-elegido .rv-cal-sem1{color:var(--sobre-marca)}
.rv-cal-fila .rv-cal-dia.rv-no .rv-cal-n{text-decoration:none}
@media (max-width:379px){.rv-cal.rv-cal-fila{margin-inline:0}}
.rv-leyenda{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:var(--t-chico,.875rem);color:var(--tinta-2)}
.rv-leyenda li{display:flex;align-items:center;gap:6px}
.rv-leyenda .rv-cal-punto{width:10px;height:10px;flex:none}
.rv-leyenda .rv-nivel-base{background:var(--ok)}

/* ---------- Pase ---------- */
.rv-pase{position:relative;max-width:440px;margin:0 auto;background:var(--superficie);border-radius:24px;box-shadow:var(--sombra-alta,var(--sombra));overflow:hidden;color:var(--tinta)}
.rv-pase-cab{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;padding:16px 18px;background:var(--hm-cab-bg,var(--marca));color:var(--hm-cab-tinta,var(--sobre-marca))}
.rv-pase-simbolo{width:30px;height:30px;flex:none}
.rv-pase-simbolo svg,.rv-pase-viaja svg{width:100%;height:100%;display:block}
.rv-pase-marca{font-family:var(--display);font-size:1.2rem;white-space:nowrap}
.rv-pase-tit{margin-left:auto;font-size:var(--t-chico,.875rem);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.rv-pase-etiqueta{padding:2px 10px;border-radius:999px;background:var(--superficie);color:var(--tinta);font-size:var(--t-chico,.875rem);font-weight:600}
.rv-pase-ruta{display:flex;align-items:center;gap:10px;padding:18px 18px 4px}
.rv-pase-puerto{font-family:var(--display);font-size:1.9rem;color:var(--marca-oscura,var(--marca));font-variant-numeric:lining-nums}
.rv-pase-linea{position:relative;flex:1;height:2px;background:repeating-linear-gradient(90deg,var(--linea) 0 8px,transparent 8px 14px)}
.rv-pase-viaja{position:absolute;left:0;top:-22px;width:30px;height:30px;margin-left:-15px;color:var(--marca);display:block}
.rv-pase-producto{margin:8px 18px 10px;font-family:var(--display);font-size:1.6rem;line-height:1.15;overflow-wrap:anywhere}
.rv-pase-datos{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin:0;padding:0 18px}
.rv-pase-datos div{min-width:0}
.rv-pase-datos .rv-ancho{grid-column:1/-1}
.rv-pase-datos dt{font-size:var(--t-chico,.875rem);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--tinta-2)}
.rv-pase-datos dd{margin:2px 0 0;font-weight:600;overflow-wrap:anywhere}
.rv-pase-antes{margin:12px 18px 0;padding:8px 12px;border-radius:var(--radio-chico,10px);background:var(--marca-suave);font-size:var(--t-chico,.875rem);font-weight:600}
.rv-pase-corte{position:relative;height:28px;margin-top:10px;background:radial-gradient(circle at 0 50%,var(--fondo) 13px,transparent 14px),radial-gradient(circle at 100% 50%,var(--fondo) 13px,transparent 14px)}
.rv-pase-corte::after{content:"";position:absolute;left:22px;right:22px;top:50%;border-top:2px dashed var(--linea)}
.rv-pase-pie{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;padding:4px 18px 20px}
.rv-pase-pie.rv-sin-qr{grid-template-columns:1fr}
.rv-pase-qr{width:138px;height:138px}
.rv-pase-qr .qr{display:block;width:100%;height:100%}
.rv-pase-qr .qr-fondo{fill:var(--superficie)}
.rv-pase-qr .qr-mod{fill:var(--tinta)}
.rv-pase-codigo{display:flex;flex-direction:column;gap:2px;min-width:0}
.rv-pase-codigo small{color:var(--tinta-2);font-size:var(--t-chico,.875rem);font-weight:600;letter-spacing:.06em;text-transform:uppercase;margin-top:6px}
.rv-pase-codigo b{font-size:1.25rem;letter-spacing:.06em;overflow-wrap:anywhere}
.rv-pase-estado{align-self:flex-start;margin-top:4px;padding:2px 10px;border-radius:999px;font-size:var(--t-chico,.875rem);font-weight:600}
.rv-pase-estado.rv-ok{background:color-mix(in srgb,var(--ok) 14%,var(--superficie));color:color-mix(in srgb,var(--ok) 65%,var(--tinta))}
.rv-pase-estado.rv-aviso{background:color-mix(in srgb,var(--aviso) 14%,var(--superficie));color:color-mix(in srgb,var(--aviso) 60%,var(--tinta))}
@media (max-width:360px){.rv-pase-pie{grid-template-columns:1fr;justify-items:center;text-align:center}.rv-pase-codigo{align-items:center}.rv-pase-estado{align-self:center}}
@media (max-width:379px){.rv-paso{padding-inline:12px}}