/* ==========================================================================
   Rento · css/paginas/reservar.css
   #reservar-<id> ("Confirmá y pagá": pasos en acordeón + tarjeta de precio) y
   #reserva-<id> (detalle de reserva con chat). Estilo marketplace blanco y azul.
   Prefijo .pg-reservar; clases internas rv-*. Sólo tokens de base.css: funciona en
   tema claro y oscuro (dev/VERSION-FINAL.md §1), sin colores literales.
   ========================================================================== */

.pg-reservar {
  padding-block: clamp(20px, 3vw, 32px) 8px;
}

.pg-reservar .rv-gris { color: var(--tinta-2); }
.pg-reservar .rv-anio { color: var(--tinta-2); font-weight: 400; }
.pg-reservar .rv-opcional { color: var(--tinta-2); font-weight: 400; }
.pg-reservar p { margin: 0; }

/* Errores inline (ícono + texto) */
.pg-reservar .campo-error { align-items: flex-start; }
.pg-reservar .campo-error .icono { flex: none; margin-top: 2px; }

/* --------------------------------------------------------------------------
   Vistas de acceso (auto inexistente, auto propio, sin sesión, no encontrada)
   -------------------------------------------------------------------------- */
.pg-reservar .rv-acceso { padding-block: clamp(24px, 6vw, 64px); }
.pg-reservar .rv-acceso .vacio { max-width: 520px; }

/* --------------------------------------------------------------------------
   Checkout: cabecera ("‹" + h1) y layout de dos columnas
   -------------------------------------------------------------------------- */
.pg-reservar .rv-contenedor { max-width: calc(1120px + 2 * var(--gutter)); }

.pg-reservar .rv-cabecera {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 8px 0 32px;
}
.pg-reservar .rv-cabecera h1 { margin: 0; } /* 32/600 (28 en móvil) desde base.css */

.pg-reservar .rv-volver {
  flex: none;
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-left: -10px;
  border-radius: 50%;
  color: var(--tinta);
  text-decoration: none;
  transition: background-color 0.15s;
}
.pg-reservar .rv-volver:hover { background: var(--fondo-2); color: var(--tinta); }
.pg-reservar .rv-volver .icono { stroke-width: 2.4; }

.pg-reservar .rv-layout { display: flex; flex-direction: column; gap: 24px; }
.pg-reservar .rv-columna { min-width: 0; }
.pg-reservar .rv-demo { margin-bottom: 16px; }

/* Una columna (tablet): lectura cómoda, sin renglones larguísimos */
@media (max-width: 1023px) {
  .pg-reservar .rv-contenedor { max-width: calc(760px + 2 * var(--gutter)); }
}
@media (min-width: 1024px) {
  .pg-reservar .rv-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(340px, 30vw, 400px);
    align-items: start;
    gap: 0 clamp(40px, 5vw, 88px);
  }
  .pg-reservar .rv-columna { grid-column: 1; grid-row: 1; }
  .pg-reservar .rv-resumen {
    grid-column: 2;
    grid-row: 1;
    position: sticky;
    /* --rv-tope lo calcula reservar.js: si la tarjeta no entra en la pantalla, el tope es negativo y
       la tarjeta acompaña el scroll hasta mostrar el total, y ahí se queda. */
    top: var(--rv-tope, calc(var(--cabecera-alto) + 24px));
  }
}

/* --------------------------------------------------------------------------
   Pasos en acordeón
   -------------------------------------------------------------------------- */
.pg-reservar .rv-form { display: grid; gap: 16px; min-width: 0; }

.pg-reservar .rv-paso {
  min-width: 0;
  padding: 24px;
  border: 1px solid var(--borde);
  border-radius: var(--radio-m);
  background: var(--superficie);
}
.pg-reservar .rv-paso.is-actual { border-color: var(--borde); box-shadow: var(--sombra-suave); }

.pg-reservar .rv-paso-cabecera {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.pg-reservar .rv-paso-encabezado { min-width: 0; }
.pg-reservar .rv-paso-titulo {
  margin: 0;
  font-size: var(--t-22);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.01em;
}
.pg-reservar .rv-paso.is-futuro .rv-paso-titulo { color: var(--tinta-2); }
.pg-reservar .rv-paso-resumen { margin-top: 6px; color: var(--tinta-2); font-size: 15px; line-height: 1.45; font-variant-numeric: tabular-nums; }
.pg-reservar .rv-paso-resumen p + p { margin-top: 2px; }
.pg-reservar .rv-editar { flex: none; margin-top: 3px; font-size: 16px; }
.pg-reservar .rv-editar:disabled { opacity: 0.4; cursor: not-allowed; }

.pg-reservar .rv-paso-cuerpo { margin-top: 24px; }
.pg-reservar .rv-paso-pie { display: flex; justify-content: flex-end; margin-top: 32px; }
.pg-reservar .rv-siguiente { min-width: 128px; }

/* Grupos dentro de un paso: separados por un divisor fino */
.pg-reservar .rv-grupo { min-width: 0; margin: 0; padding: 0; border: 0; }
.pg-reservar .rv-grupo + .rv-grupo {
  margin-top: 32px;
  padding-top: 32px;
  border-top: 1px solid var(--borde-suave);
}
.pg-reservar .rv-grupo-titulo {
  float: left;
  width: 100%;
  margin: 0 0 16px;
  padding: 0;
  color: var(--tinta);
  font-size: var(--t-18);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.005em;
}
.pg-reservar .rv-grupo-titulo + * { clear: both; }
.pg-reservar .rv-grupo-ayuda { margin: 0 0 16px; }
.pg-reservar .rv-grupo > .campo-error { margin-top: 12px; }
.pg-reservar .rv-ayuda-icono { display: flex; align-items: flex-start; gap: 8px; margin-top: 12px; }
.pg-reservar .rv-ayuda-icono .icono { flex: none; margin-top: 2px; color: var(--tinta-2); }

/* Fechas: celdas pegadas 2 × 2 (Retiro | Hora / Devolución | Hora); bordes de .grupo-celdas-grilla */
.pg-reservar .rv-celdas-fechas { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
.pg-reservar .rv-celdas-fechas .control { font-variant-numeric: tabular-nums; }

.pg-reservar .rv-disponibilidad {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 12px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}
.pg-reservar .rv-disponibilidad .icono { flex: none; margin-top: 1px; }
.pg-reservar .rv-disponibilidad:empty { display: none; }
.pg-reservar .rv-disponibilidad.is-exito { color: var(--exito); }
.pg-reservar .rv-disponibilidad.is-alerta { color: var(--alerta); }
.pg-reservar .rv-disponibilidad.is-error { color: var(--error); }
.pg-reservar #rv-fechas .campo-error { margin-top: 12px; }

/* Filas radio con borde (entrega, protección, medio de pago) */
.pg-reservar .rv-opciones { display: grid; gap: 12px; }
.pg-reservar .rv-opcion {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 4px 16px;
  padding: 16px 20px;
  border: 1px solid var(--borde);
  border-radius: var(--radio-m);
  background: var(--superficie);
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.pg-reservar .rv-opcion:hover { border-color: var(--tinta); }
.pg-reservar .rv-opcion:has(input:checked) { border-color: var(--tinta); box-shadow: inset 0 0 0 1px var(--tinta); }
.pg-reservar .rv-opcion:has(input:focus-visible) { outline: 2px solid var(--tinta); outline-offset: 2px; }
.pg-reservar .rv-opcion-icono {
  grid-column: 1;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  color: var(--tinta);
}
.pg-reservar .rv-opcion-escudo { line-height: 0; }
.pg-reservar .rv-opcion-cuerpo { grid-column: 2; display: grid; gap: 2px; min-width: 0; }
.pg-reservar .rv-opcion-titulo { font-size: 16px; font-weight: 600; line-height: 1.3; }
.pg-reservar .rv-opcion-texto { color: var(--tinta-2); font-size: 14px; line-height: 1.45; }
.pg-reservar .rv-opcion-precio {
  grid-column: 3;
  font-size: 15px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  text-align: right;
}
.pg-reservar .rv-opcion-nota { color: var(--tinta-2); font-size: 14px; font-weight: 500; }
.pg-reservar .rv-opcion > .rv-radio { grid-column: 4; }

/* Radio redondo estilo marketplace: anillo grueso negro cuando está elegido */
.pg-reservar .rv-radio {
  appearance: none;
  -webkit-appearance: none;
  flex: none;
  width: 24px;
  height: 24px;
  margin: 0;
  border: 1px solid var(--borde-control);
  border-radius: 50%;
  background: var(--superficie);
  cursor: pointer;
  transition: border-width 0.12s, border-color 0.12s;
}
.pg-reservar .rv-radio:checked { border: 7px solid var(--tinta); }
.pg-reservar .rv-radio:focus-visible { outline: none; }

.pg-reservar .rv-direccion { margin-top: 16px; }

/* Multivehículo: operador (capitán, piloto…), pasajeros, seguro incluido y requisitos */
.pg-reservar .rv-opcion-unidad { color: var(--tinta-2); font-size: 13px; font-weight: 500; }
.pg-reservar .rv-incluido {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 20px;
  border-radius: var(--radio-m);
  background: var(--fondo-2);
  line-height: 1.5;
}
.pg-reservar .rv-incluido .icono { flex: none; margin-top: 1px; color: var(--azul); }
.pg-reservar .rv-incluido strong { font-weight: 600; }
.pg-reservar .rv-pasajeros-campo { max-width: 320px; }
.pg-reservar .rv-pasajeros .campo-ayuda { margin-top: 8px; }
.pg-reservar .rv-pasajeros .campo-error { margin-top: 8px; }
.pg-reservar .rv-requisitos { display: grid; gap: 8px; margin: 0 0 20px; line-height: 1.45; }
.pg-reservar .rv-requisitos-nota { margin: 0 0 20px; padding: 12px 16px; font-size: 15px; }
.pg-reservar .rv-requisitos-nota .icono { color: var(--exito); }
.pg-reservar .rv-declaracion { margin-top: 4px; }
.pg-reservar .rv-fila-incluido dd { color: var(--tinta-2); }

/* Cuotas: mosaicos */
.pg-reservar .rv-cuotas { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.pg-reservar .rv-cuota {
  position: relative;
  display: grid;
  gap: 2px;
  padding: 16px 48px 16px 16px;
  border: 1px solid var(--borde);
  border-radius: var(--radio-m);
  cursor: pointer;
  font-variant-numeric: tabular-nums;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.pg-reservar .rv-cuota:hover { border-color: var(--tinta); }
.pg-reservar .rv-cuota:has(input:checked) { border-color: var(--tinta); box-shadow: inset 0 0 0 1px var(--tinta); }
.pg-reservar .rv-cuota:has(input:focus-visible) { outline: 2px solid var(--tinta); outline-offset: 2px; }
.pg-reservar .rv-cuota .rv-radio { position: absolute; top: 16px; right: 16px; width: 20px; height: 20px; }
.pg-reservar .rv-cuota .rv-radio:checked { border-width: 6px; }
.pg-reservar .rv-cuota-n { font-size: 14px; font-weight: 600; }
.pg-reservar .rv-cuota-monto { font-size: 18px; font-weight: 600; }
.pg-reservar .rv-cuota-nota { color: var(--tinta-2); font-size: 13px; }

.pg-reservar .rv-nota-pago { margin-top: 16px; }
.pg-reservar .rv-deposito-texto { color: var(--tinta-2); font-size: 15px; line-height: 1.55; }
.pg-reservar .rv-deposito-texto strong { color: var(--tinta); font-weight: 600; }

/* Conductor */
.pg-reservar .rv-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pg-reservar .rv-campo-ancho { grid-column: 1 / -1; }
.pg-reservar .rv-check {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 16px;
  line-height: 1.45;
  cursor: pointer;
}
.pg-reservar .rv-check input { flex: none; margin: 2px 0 0; }
/* Tu identidad: estado de la validación (nombre, DNI ••••NNNN, licencia) */
.pg-reservar .rv-identidad {
  padding: 16px 20px;
  border: 1px solid var(--borde);
  border-radius: var(--radio-m);
  background: var(--superficie);
}
.pg-reservar .rv-identidad:focus-visible { outline: 2px solid var(--tinta); outline-offset: 2px; }
.pg-reservar .rv-id-lista { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.pg-reservar .rv-id-item { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: start; gap: 12px; }
.pg-reservar .rv-id-marca {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--alerta-chip);
  color: var(--alerta);
}
.pg-reservar .rv-id-item.is-ok .rv-id-marca { background: var(--exito); color: var(--tinta-inversa); }
.pg-reservar .rv-id-item.is-ok .rv-id-marca .icono { stroke-width: 3; }
.pg-reservar .rv-id-texto { display: grid; gap: 2px; min-width: 0; padding-top: 3px; line-height: 1.4; }
.pg-reservar .rv-id-titulo { font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
.pg-reservar .rv-id-detalle { color: var(--tinta-2); font-size: 14px; font-variant-numeric: tabular-nums; }
.pg-reservar .rv-id-acciones {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--borde-suave);
}
.pg-reservar .rv-validar { flex: none; display: inline-flex; align-items: center; gap: 8px; }
.pg-reservar .rv-id-ayuda { flex: 1 1 240px; min-width: 0; margin: 0; }
.pg-reservar .rv-identidad > .campo-error { margin-top: 12px; }

/* Medios de pago a tu nombre */
.pg-reservar .rv-medios-vacio {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 20px;
  border: 1px dashed var(--borde-control);
  border-radius: var(--radio-m);
  color: var(--tinta-2);
  line-height: 1.5;
}
.pg-reservar .rv-medios-vacio .icono { flex: none; margin-top: 2px; color: var(--tinta); }
.pg-reservar .rv-medio.is-deshabilitado { background: var(--fondo-2); cursor: not-allowed; }
.pg-reservar .rv-medio.is-deshabilitado:hover { border-color: var(--borde); }
.pg-reservar .rv-medio.is-deshabilitado .rv-opcion-titulo,
.pg-reservar .rv-medio.is-deshabilitado .rv-opcion-icono { color: var(--tinta-2); }
.pg-reservar .rv-medio.is-deshabilitado .rv-radio { background: var(--borde-suave); cursor: not-allowed; }
.pg-reservar .rv-medio-motivo { display: flex; align-items: flex-start; gap: 6px; margin-top: 2px; color: var(--error); font-size: 13px; font-weight: 600; line-height: 1.4; }
.pg-reservar .rv-medio-motivo .icono { flex: none; margin-top: 2px; }
.pg-reservar .rv-agregar-medio { display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; }
.pg-reservar #rv-medios-grupo > .campo-error { margin-top: 12px; }

.pg-reservar .rv-anfitrion { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.pg-reservar .rv-anfitrion p { display: grid; line-height: 1.35; }
.pg-reservar .rv-anfitrion strong { font-weight: 600; }
.pg-reservar .rv-anfitrion p span { color: var(--tinta-2); font-size: 14px; }
.pg-reservar .rv-mensaje { min-height: 112px; }

.pg-reservar .rv-ingreso {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px 20px;
}
.pg-reservar .rv-ingreso-icono {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--fondo-2);
  color: var(--tinta);
}
.pg-reservar .rv-ingreso-titulo { font-size: 16px; font-weight: 600; }
.pg-reservar .rv-ingreso-bajada { margin-top: 4px; color: var(--tinta-2); font-size: 14px; line-height: 1.5; }

/* Revisá y confirmá */
.pg-reservar .rv-rev-bloque + .rv-rev-bloque { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--borde-suave); }
.pg-reservar .rv-rev-titulo { margin: 0 0 12px; font-size: var(--t-18); font-weight: 600; }
.pg-reservar .rv-rev-texto { color: var(--tinta-2); line-height: 1.55; }
.pg-reservar .rv-rev-cabeza { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 12px; }
.pg-reservar .rv-rev-cabeza .rv-rev-titulo { margin: 0; }

/* Condiciones y garantías del anfitrión (checkout y detalle) */
.pg-reservar .rv-condiciones { display: grid; gap: 16px; margin: 0; }
.pg-reservar .rv-condicion {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 2px 14px;
  align-items: start;
}
.pg-reservar .rv-condicion-icono { grid-row: 1 / span 2; display: grid; place-items: center; width: 24px; height: 24px; color: var(--tinta); }
.pg-reservar .rv-condicion dt { font-size: 15px; font-weight: 600; line-height: 1.4; }
.pg-reservar .rv-condicion dd { margin: 0; color: var(--tinta-2); font-size: 15px; line-height: 1.5; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.pg-reservar .rv-condiciones-otras { display: grid; gap: 4px; margin: 2px 0 0; padding-left: 18px; }
.pg-reservar .rv-condiciones-otras li::marker { color: var(--tinta-3); }
.pg-reservar .rv-intermediario {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: var(--radio-s);
  background: var(--fondo-2);
  color: var(--tinta-2);
  font-size: 13px;
  line-height: 1.5;
}
.pg-reservar .rv-intermediario .icono { flex: none; margin-top: 1px; color: var(--tinta); }
.pg-reservar .rv-rev-condiciones { padding: 20px; border: 1px solid var(--borde); border-radius: var(--radio-m); }
.pg-reservar .rv-rev-condiciones + .rv-rev-bloque { border-top: 0; }
.pg-reservar .rv-reglas { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px 24px; }
.pg-reservar .rv-aviso-aprobacion { display: flex; align-items: flex-start; gap: 12px; line-height: 1.5; }
.pg-reservar .rv-aviso-aprobacion .icono { flex: none; margin-top: 1px; color: var(--alerta); }
.pg-reservar .rv-aviso-aprobacion.is-instantanea .icono { color: var(--azul); }
.pg-reservar .rv-aviso-aprobacion strong { font-weight: 600; }
.pg-reservar .rv-acepto-grupo { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--borde-suave); }
.pg-reservar .rv-acepto-grupo .campo-error { margin-top: 10px; }
.pg-reservar .rv-legal { margin-top: 20px; color: var(--tinta-2); font-size: 14px; line-height: 1.5; }
.pg-reservar .rv-legal strong { color: var(--tinta); }
.pg-reservar .rv-procesando { margin-top: 12px; color: var(--tinta-2); font-size: 14px; }
.pg-reservar .rv-procesando:empty { display: none; }
.pg-reservar .rv-error-final {
  gap: 10px;
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--error) 35%, var(--borde));
  border-radius: var(--radio-m);
  background: var(--error-suave);
}
.pg-reservar .rv-error-final p { margin: 0 0 10px; }
.pg-reservar .rv-paso-pie .rv-confirmar { width: 100%; min-height: 56px; font-size: 17px; }
.pg-reservar .rv-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid color-mix(in srgb, var(--sobre-azul) 40%, transparent);
  border-top-color: var(--sobre-azul);
  border-radius: 50%;
  animation: rv-girar 0.8s linear infinite;
}
@keyframes rv-girar { to { transform: rotate(360deg); } }

/* --------------------------------------------------------------------------
   Tarjeta de precio (sticky a la derecha; arriba y plegable en móvil)
   -------------------------------------------------------------------------- */
.pg-reservar .rv-resumen { min-width: 0; }
.pg-reservar .rv-resumen-tarjeta {
  padding: 24px;
  border: 1px solid var(--borde);
  border-radius: var(--radio-m);
  background: var(--superficie);
}
.pg-reservar .rv-resumen-auto {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
}
.pg-reservar .rv-resumen-foto { border-radius: var(--radio-s); }
.pg-reservar .rv-resumen-auto-texto { display: grid; gap: 2px; min-width: 0; }
.pg-reservar .rv-resumen-titulo { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.3; letter-spacing: 0; }
.pg-reservar .rv-resumen-lugar { color: var(--tinta-2); font-size: 14px; }
.pg-reservar .rv-resumen-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; margin-top: 2px; font-size: 14px; }
.pg-reservar .rv-resumen-meta .estrellas { font-size: 14px; }
.pg-reservar .rv-resumen-estrella { color: var(--tinta-2); }
.pg-reservar .rv-resumen-host { margin-top: 6px; }

.pg-reservar .rv-resumen-seccion { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--borde-suave); }
.pg-reservar .rv-resumen-subtitulo { margin: 0 0 14px; font-size: var(--t-18); font-weight: 600; letter-spacing: 0; }
.pg-reservar .rv-viaje { display: grid; gap: 12px; margin: 0; }
.pg-reservar .rv-viaje dt { font-size: 14px; font-weight: 600; }
.pg-reservar .rv-viaje dd { margin: 2px 0 0; color: var(--tinta); font-size: 15px; font-variant-numeric: tabular-nums; }
.pg-reservar .rv-resumen-vacio {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--borde-suave);
  color: var(--tinta-2);
}
.pg-reservar .rv-resumen-vacio .icono { flex: none; margin-top: 2px; }
.pg-reservar .rv-resumen-politica {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--borde-suave);
  color: var(--tinta-2);
  font-size: 14px;
}
.pg-reservar .rv-resumen-politica .icono { flex: none; margin-top: 2px; color: var(--tinta); }
.pg-reservar .rv-resumen-politica strong { color: var(--tinta); font-weight: 600; }

/* Desglose (compartido con el detalle) */
.pg-reservar .rv-desglose { display: grid; gap: 12px; margin: 0; }
.pg-reservar .rv-fila { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.pg-reservar .rv-fila dt { min-width: 0; color: var(--tinta); font-size: 15px; }
.pg-reservar .rv-fila dd { margin: 0; font-size: 15px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pg-reservar .rv-fila-descuento dd { color: var(--exito); font-weight: 600; }
.pg-reservar .rv-total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--borde-suave);
  font-size: 16px;
  font-weight: 600;
}
.pg-reservar .rv-total-moneda { text-decoration: underline; text-underline-offset: 0.16em; }
.pg-reservar .rv-total-monto { font-size: 16px; }
.pg-reservar .rv-total-nota { margin-top: 2px; color: var(--tinta-2); font-size: 13px; }
.pg-reservar .rv-cuotas-linea { display: flex; align-items: flex-start; gap: 8px; margin-top: 14px; font-size: 14px; }
.pg-reservar .rv-cuotas-linea .icono { flex: none; margin-top: 2px; color: var(--azul); }
.pg-reservar .rv-cuotas-linea strong { font-weight: 600; font-variant-numeric: tabular-nums; }
.pg-reservar .rv-extras {
  display: grid;
  gap: 6px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
  color: var(--tinta-2);
  font-size: 13px;
  line-height: 1.4;
}
.pg-reservar .rv-extras li { display: flex; align-items: flex-start; gap: 8px; }
.pg-reservar .rv-extras .icono { flex: none; margin-top: 1px; width: 14px; height: 14px; }

/* Alternador de la tarjeta (sólo en una columna) */
.pg-reservar .rv-resumen-alternar { display: none; }

@media (max-width: 1023px) {
  .pg-reservar .rv-resumen-tarjeta { padding: 16px; }
  .pg-reservar .rv-resumen-auto { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; }
  .pg-reservar .rv-resumen-alternar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    margin-top: 16px;
    padding: 14px 0 0;
    border: 0;
    border-top: 1px solid var(--borde-suave);
    border-radius: 0;
    background: none;
    color: var(--tinta);
    font-size: 16px;
    text-align: left;
    cursor: pointer;
  }
  .pg-reservar .rv-resumen-alternar:focus-visible { outline-offset: 4px; border-radius: 4px; }
  .pg-reservar .rv-resumen-alternar-total { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; font-weight: 600; }
  .pg-reservar .rv-resumen-alternar-accion { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 0.16em; white-space: nowrap; }
  .pg-reservar .rv-resumen-alternar-accion .icono { transition: transform 0.2s; }
  .pg-reservar .rv-resumen.is-abierto .rv-resumen-alternar-accion .icono { transform: rotate(180deg); }
  .pg-reservar .rv-resumen:not(.is-abierto) .rv-resumen-cuerpo { display: none; }
  .pg-reservar .rv-resumen .rv-resumen-cuerpo > :first-child { margin-top: 16px; }
}

/* --------------------------------------------------------------------------
   Detalle de reserva (#reserva-<id>)
   -------------------------------------------------------------------------- */
.pg-reserva .rv-det-layout { display: grid; gap: 8px; }
.pg-reserva .rv-det-main { min-width: 0; }
.pg-reserva .rv-det-aside { min-width: 0; }

@media (min-width: 1128px) {
  .pg-reserva .rv-det-layout {
    grid-template-columns: minmax(0, 1fr) 380px;
    align-items: start;
    gap: 0 64px;
  }
  .pg-reserva .rv-det-aside { position: sticky; top: calc(var(--cabecera-alto) + 24px); }
  .pg-reserva .rv-chat { height: min(700px, calc(100vh - var(--cabecera-alto) - 48px)); }
}

/* Encabezado: foto grande, estado, código, título, fechas */
.pg-reserva .rv-det-cabecera { padding-bottom: 32px; }
.pg-reserva .rv-det-foto {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: var(--radio-m);
  background: var(--fondo-2);
}
.pg-reserva .rv-det-foto .foto-auto { aspect-ratio: auto; width: 100%; height: 100%; }
.pg-reserva .rv-det-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin: 24px 0 12px;
}
.pg-reserva .rv-det-codigo { color: var(--tinta-2); font-size: 14px; }
.pg-reserva .rv-codigo { color: var(--tinta); font-weight: 600; letter-spacing: 0.02em; font-variant-numeric: tabular-nums; }
.pg-reserva .rv-det-cabecera h1 { margin: 0; }
.pg-reserva .rv-det-fechas { margin-top: 8px; color: var(--tinta-2); font-size: 16px; font-variant-numeric: tabular-nums; }
.pg-reserva .rv-det-auto { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 12px; }
.pg-reserva .rv-det-auto-texto { min-width: 0; font-size: 15px; }
.pg-reserva .rv-det-auto-texto a { font-weight: 600; }
.pg-reserva .rv-matricula {
  padding: 2px 8px;
  border: 1px solid var(--borde);
  border-radius: 6px;
  color: var(--tinta);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.pg-reserva .rv-requisitos-intro { margin-bottom: 14px; }
.pg-reserva .rv-det-requisitos .rv-requisitos { max-width: 62ch; margin-bottom: 0; }
.pg-reserva .rv-requisitos-estado { display: flex; align-items: center; gap: 8px; margin-top: 16px; font-weight: 600; }
.pg-reserva .rv-requisitos-estado .icono { color: var(--exito); }
.pg-reserva .rv-requisitos-estado.is-falta .icono { color: var(--alerta); }
.pg-reserva .rv-condiciones-intro { max-width: 62ch; margin-bottom: 20px; }
.pg-reserva .rv-det-condiciones .rv-condiciones,
.pg-reserva .rv-det-condiciones .rv-intermediario { max-width: 62ch; }
.pg-reserva .rv-persona-badge { margin-top: 4px; }
.pg-reserva .rv-politica-nombre { display: flex; align-items: flex-start; gap: 10px; max-width: 62ch; margin-bottom: 8px; line-height: 1.5; }
.pg-reserva .rv-politica-nombre .icono { flex: none; margin-top: 2px; }
.pg-reserva .rv-politica-nombre strong { font-weight: 600; }
.pg-reserva .rv-det-estado {
  margin-top: 20px;
  padding: 16px 20px;
  border-radius: var(--radio-m);
  background: var(--fondo-2);
  line-height: 1.5;
}
.pg-reserva .rv-det-acciones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }

/* Secciones separadas por divisores */
.pg-reserva .rv-det-seccion { padding-block: 32px; border-top: 1px solid var(--borde-suave); }
.pg-reserva .rv-det-h2 { margin: 0 0 20px; font-size: var(--t-22); font-weight: 600; }

/* Línea de tiempo simple */
.pg-reserva .rv-linea-tiempo {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.pg-reserva .rv-hito { position: relative; display: grid; gap: 10px; min-width: 0; }
.pg-reserva .rv-hito + .rv-hito::before {
  content: '';
  position: absolute;
  /* Del borde derecho de la marca anterior (−ancho − gap + 24 + 6) al izquierdo de esta (−6) */
  top: 11px;
  left: calc(-100% + 22px);
  width: calc(100% - 28px);
  height: 2px;
  background: var(--borde);
}
.pg-reserva .rv-hito.is-hecho + .rv-hito::before { background: var(--tinta); }
.pg-reserva .rv-hito-marca {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 2px solid var(--borde);
  border-radius: 50%;
  background: var(--superficie);
  color: var(--tinta-inversa);
}
.pg-reserva .rv-hito-marca .icono { stroke-width: 3; }
.pg-reserva .is-hecho .rv-hito-marca { border-color: var(--tinta); background: var(--tinta); }
.pg-reserva .is-actual .rv-hito-marca { border-color: var(--azul); background: var(--azul); box-shadow: inset 0 0 0 4px var(--superficie); }
.pg-reserva .is-corte .rv-hito-marca { border-color: var(--error); background: var(--error); }
.pg-reserva .is-anulado .rv-hito-marca { border-style: dashed; }
.pg-reserva .rv-hito-texto { display: grid; gap: 2px; min-width: 0; }
.pg-reserva .rv-hito-titulo { font-size: 14px; font-weight: 600; line-height: 1.3; }
.pg-reserva .is-pendiente .rv-hito-titulo { color: var(--tinta-2); font-weight: 500; }
.pg-reserva .is-actual .rv-hito-titulo { color: var(--azul); }
.pg-reserva .is-corte .rv-hito-titulo { color: var(--error); }
.pg-reserva .is-anulado .rv-hito-titulo { color: var(--tinta-3); font-weight: 500; text-decoration: line-through; }
.pg-reserva .rv-hito-detalle { color: var(--tinta-2); font-size: 13px; line-height: 1.35; font-variant-numeric: tabular-nums; }

/* Retiro y devolución */
.pg-reserva .rv-horarios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pg-reserva .rv-horario { min-width: 0; }
.pg-reserva .rv-horario + .rv-horario { padding-left: 24px; border-left: 1px solid var(--borde-suave); }
.pg-reserva .rv-horario-rotulo { font-size: 14px; font-weight: 600; }
.pg-reserva .rv-horario-dia { margin-top: 4px; font-size: 16px; }
.pg-reserva .rv-horario-dia::first-letter { text-transform: uppercase; }
.pg-reserva .rv-bloque {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: start;
  gap: 16px;
  margin-top: 24px;
}
.pg-reserva .rv-bloque-icono { display: grid; place-items: center; width: 32px; height: 28px; color: var(--tinta); }
.pg-reserva .rv-bloque-escudo { line-height: 0; }
.pg-reserva .rv-bloque-texto { display: grid; gap: 2px; min-width: 0; line-height: 1.45; }
.pg-reserva .rv-entrega-titulo { font-size: 16px; font-weight: 600; }
.pg-reserva .rv-bloque-texto strong { font-weight: 600; }

/* Anfitrión / conductor */
.pg-reserva .rv-persona { display: flex; align-items: center; gap: 16px; }
.pg-reserva .rv-persona-texto { display: grid; gap: 2px; min-width: 0; }
.pg-reserva .rv-persona-nombre { font-size: var(--t-18); font-weight: 600; }
.pg-reserva .rv-persona-bio { max-width: 62ch; margin-top: 16px; color: var(--tinta-2); line-height: 1.55; }
.pg-reserva .rv-ir-chat { margin-top: 20px; }

/* Pago y reintegro */
.pg-reserva .rv-pago { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; max-width: 560px; }
.pg-reserva .rv-pago-linea { display: flex; align-items: center; gap: 10px; font-weight: 500; }
.pg-reserva .rv-det-desglose { max-width: 560px; margin-top: 24px; }
.pg-reserva .rv-monto-destacado {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 16px;
  max-width: 560px;
  margin-top: 20px;
  padding: 16px 20px;
  border-radius: var(--radio-m);
  background: var(--fondo-2);
}
.pg-reserva .rv-monto-destacado strong { font-size: var(--t-18); font-weight: 600; }
.pg-reserva .rv-reintegro strong { color: var(--exito); }

/* Política */
.pg-reserva .rv-politica-texto { max-width: 62ch; color: var(--tinta-2); line-height: 1.55; }
.pg-reserva .rv-politica-ahora { max-width: 62ch; margin-top: 16px; }

/* Reseña */
.pg-reserva .rv-resena-bajada { margin: -8px 0 20px; }
.pg-reserva .rv-resena-form { display: grid; gap: 20px; max-width: 560px; }
.pg-reserva .rv-estrellas-campo { min-width: 0; margin: 0; padding: 0; border: 0; }
.pg-reserva .rv-resena-rotulo { margin-bottom: 8px; padding: 0; font-size: 16px; font-weight: 600; }
.pg-reserva .rv-estrellas { display: flex; gap: 4px; }
.pg-reserva .rv-estrella {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: var(--radio-s);
  color: var(--borde);
  cursor: pointer;
  transition: color 0.12s, transform 0.12s;
}
.pg-reserva .rv-estrella:hover { transform: scale(1.06); }
.pg-reserva .rv-estrella.is-on { color: var(--tinta); }
.pg-reserva .rv-estrellas input:focus-visible + .rv-estrella { outline: 2px solid var(--tinta); outline-offset: 2px; }
.pg-reserva .rv-estrellas-texto { min-height: 1.5em; margin-top: 6px; color: var(--tinta-2); font-size: 14px; }
.pg-reserva .rv-estrellas-campo .campo-error { margin-top: 6px; }
.pg-reserva .rv-resena-estrellas { display: flex; align-items: center; gap: 12px; font-weight: 600; }
.pg-reserva .rv-resena-cita { margin: 14px 0 0; padding: 0; }
.pg-reserva .rv-resena-cita p { max-width: 62ch; font-size: 16px; line-height: 1.55; }
.pg-reserva .rv-resena-fecha { margin-top: 10px; color: var(--tinta-2); font-size: 14px; }

/* Chat estilo mensajes */
.pg-reserva .rv-chat {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--borde);
  border-radius: var(--radio-m);
  background: var(--superficie);
}
.pg-reserva .rv-chat-cabecera {
  flex: none;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--borde-suave);
}
.pg-reserva .rv-chat-cabecera-texto { min-width: 0; }
.pg-reserva .rv-chat-titulo { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.3; letter-spacing: 0; }
.pg-reserva .rv-chat-meta { color: var(--tinta-2); font-size: 13px; }
.pg-reserva .rv-chat-lista {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 240px;
  max-height: 480px;
  margin: 0;
  padding: 20px;
  overflow-y: auto;
  overscroll-behavior: contain;
  list-style: none;
}
@media (min-width: 1128px) {
  .pg-reserva .rv-chat-lista { max-height: none; min-height: 0; }
}
.pg-reserva .rv-chat-lista:focus-visible { outline-offset: -4px; }
.pg-reserva .rv-msj-dia { align-self: center; color: var(--tinta-2); font-size: 12px; font-weight: 600; }
.pg-reserva .rv-msj-sistema { align-self: center; max-width: 92%; text-align: center; }
.pg-reserva .rv-msj-sistema p { color: var(--tinta-2); font-size: 13px; line-height: 1.45; }
.pg-reserva .rv-msj-sistema time { margin-left: 2px; color: var(--tinta-2); white-space: nowrap; }
.pg-reserva .rv-msj-otro { display: flex; align-items: flex-end; gap: 8px; max-width: 88%; }
.pg-reserva .rv-msj-otro .rv-msj-avatar { margin-bottom: 20px; }
.pg-reserva .rv-msj-propio { align-self: flex-end; max-width: 85%; }
.pg-reserva .rv-msj-cuerpo { min-width: 0; }
.pg-reserva .rv-burbuja {
  padding: 10px 14px;
  border-radius: 18px 18px 18px 6px;
  background: var(--borde-suave);
  color: var(--tinta);
  font-size: 15px;
  line-height: 1.42;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.pg-reserva .rv-msj-propio .rv-burbuja { border-radius: 18px 18px 6px 18px; background: var(--azul-relleno); color: var(--sobre-azul); }
.pg-reserva .rv-msj-autor { display: flex; gap: 6px; margin: 4px 6px 0; color: var(--tinta-2); font-size: 12px; }
.pg-reserva .rv-msj-propio .rv-msj-autor { justify-content: flex-end; }
.pg-reserva .rv-msj-vacio { margin: auto 0; padding: 24px 8px; color: var(--tinta-2); font-size: 14px; text-align: center; }
.pg-reserva .rv-chat-form {
  flex: none;
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 12px 16px 6px;
  border-top: 1px solid var(--borde-suave);
}
.pg-reserva .rv-chat-texto {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 44px;
  max-height: 160px;
  padding: 11px 16px;
  border: 1px solid var(--borde-control);
  border-radius: 22px;
  background: var(--superficie);
  color: var(--tinta);
  font-size: 15px;
  line-height: 1.4;
  resize: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.pg-reserva .rv-chat-texto::placeholder { color: var(--tinta-2); }
.pg-reserva .rv-chat-texto:hover { border-color: var(--tinta); }
.pg-reserva .rv-chat-texto:focus { outline: none; border-color: var(--tinta); box-shadow: inset 0 0 0 1px var(--tinta); }
.pg-reserva .rv-chat-enviar {
  flex: none;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--azul-gradiente);
  background-color: var(--azul-relleno);
  color: var(--sobre-azul);
  cursor: pointer;
  transition: transform 0.1s;
}
.pg-reserva .rv-chat-enviar:hover { background: var(--azul-gradiente-hover); background-color: var(--azul-relleno); }
.pg-reserva .rv-chat-enviar:active { transform: scale(0.95); }
.pg-reserva .rv-chat-enviar .icono { stroke-width: 2.4; }
.pg-reserva .rv-chat-ayuda { flex: none; padding: 0 20px 12px; color: var(--tinta-2); font-size: 12px; }

/* --------------------------------------------------------------------------
   Móvil
   -------------------------------------------------------------------------- */
@media (max-width: 743px) {
  .pg-reservar .rv-cabecera { margin: 0 0 20px; gap: 8px; }
  .pg-reservar .rv-paso { padding: 20px; }
  .pg-reservar .rv-paso-titulo { font-size: 20px; }
  .pg-reservar .rv-paso-cuerpo { margin-top: 20px; }
  .pg-reservar .rv-paso-pie { margin-top: 28px; }
  .pg-reservar .rv-siguiente { width: 100%; }
  .pg-reservar .rv-grupo + .rv-grupo { margin-top: 28px; padding-top: 28px; }

  /* Filas radio: el precio baja debajo del texto */
  .pg-reservar .rv-opcion { grid-template-columns: auto minmax(0, 1fr) auto; padding: 14px 16px; gap: 6px 14px; }
  .pg-reservar .rv-opcion-icono { grid-row: 1 / span 2; align-self: start; }
  .pg-reservar .rv-opcion-precio { grid-column: 2; grid-row: 2; text-align: left; }
  .pg-reservar .rv-opcion > .rv-radio { grid-column: 3; grid-row: 1 / span 2; }

  /* Cuotas: filas compactas (plan a la izquierda, monto a la derecha) */
  .pg-reservar .rv-cuotas { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .pg-reservar .rv-cuota { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0 12px; padding: 12px 52px 12px 16px; }
  .pg-reservar .rv-cuota-n { grid-column: 1; grid-row: 1; }
  .pg-reservar .rv-cuota-nota { grid-column: 1; grid-row: 2; }
  .pg-reservar .rv-cuota-monto { grid-column: 2; grid-row: 1 / span 2; font-size: 17px; }
  .pg-reservar .rv-cuota .rv-radio { top: 50%; transform: translateY(-50%); }

  .pg-reservar .rv-campos { grid-template-columns: minmax(0, 1fr); }
  .pg-reservar .rv-ingreso { grid-template-columns: auto minmax(0, 1fr); }
  .pg-reservar .rv-ingreso-boton { grid-column: 1 / -1; width: 100%; }
  .pg-reservar .rv-identidad { padding: 16px; }
  .pg-reservar .rv-rev-condiciones { padding: 16px; }
  .pg-reservar .rv-validar { width: 100%; justify-content: center; }

  .pg-reserva .rv-det-foto { aspect-ratio: 4 / 3; }
  .pg-reserva .rv-det-meta { margin-top: 20px; }
  .pg-reserva .rv-det-acciones .btn { flex: 1 1 auto; }
  .pg-reserva .rv-det-seccion { padding-block: 28px; }
  .pg-reserva .rv-det-h2 { font-size: 20px; }

  /* Línea de tiempo vertical */
  .pg-reserva .rv-linea-tiempo { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .pg-reserva .rv-hito { grid-template-columns: 24px minmax(0, 1fr); gap: 14px; padding-bottom: 20px; }
  .pg-reserva .rv-hito:last-child { padding-bottom: 0; }
  .pg-reserva .rv-hito + .rv-hito::before { content: none; }
  .pg-reserva .rv-hito:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 11px;
    top: 28px;
    bottom: 4px;
    width: 2px;
    background: var(--borde);
  }
  .pg-reserva .rv-hito.is-hecho:not(:last-child)::after { background: var(--tinta); }
  .pg-reserva .rv-horario + .rv-horario { padding-left: 16px; }
  .pg-reserva .rv-chat-lista { padding: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .pg-reservar .rv-spinner { animation-duration: 2.4s; }
}