# Mockups E250-C0095 — Reservas como maestro-detalle

Superficie mockupeada: la vista de Reservas (`/panel/booking`) rediseñada como maestro-detalle
(listado de experiencias a la izquierda + formulario de reserva inline a la derecha). Ambas
variantes reutilizan el shell real del panel (aside nav + header breadcrumb de `PanelView.vue`),
el tema `e250` y las clases DaisyUI del producto (`card`, `steps`, `btn btn-primary`, `badge`,
`menu`).

## Variantes — eje explorado: cuánta info lleva cada ítem del listado

- **v1-lista-simple.html** — Listado minimalista (sólo el nombre de la experiencia, estilo
  `menu` de DaisyUI). Ítem activo resaltado en `bg-primary`. Derecha: formulario de reserva con
  step-indicator y el paso «Opción» abierto. Lo más cercano a la pestaña de nav lateral existente:
  poco ruido, foco total en el formulario.

- **v2-lista-rica-estados.html** — Listado más rico: cada ítem añade el badge de completitud
  (Completa / Incompleta) y el conteo de opciones/tarifas, reutilizando la semántica de la tabla
  de Experiencias condensada. Además muestra los **tres estados** apilados para revisión completa:
  - Estado A — entrar sin selección → la derecha invita a elegir (no formulario en blanco).
  - Estado B — experiencia seleccionada y resaltada → formulario inline (paso «Participantes»).
  - Estado C — sin ninguna experiencia creada → listado vacío legible + invitación en la derecha.

## Cobertura de criterios con superficie visual

- Listado lateral con todas las experiencias por su nombre de producto TuriTop — v1 y v2.
- Ítem activo resaltado + enfocable por teclado (`tabindex="0"`, `role="option"`, `aria-selected`) — v1 y v2.
- Estado vacío del listado (sin experiencias) — v2 (Estado C).
- Invitación a elegir cuando no hay selección (no formulario en blanco) — v2 (Estado A).
- Formulario de reserva inline (flujo sin pago: opción → participantes → día → hora → datos → confirmar) — v1 y v2.
- Convivencia con la pestaña Experiencias (sigue en el nav lateral) — v1 y v2.

Los estados A/B/C los lleva v2 apilados; v1 muestra sólo el caso nominal (selección activa) para
juzgar el listado minimalista sin ruido. `review-mockup` aprueba una variante como referencia.