/* bookings-setup.css — bloque «Configurar reservas» del formulario y asistente paso a paso.
   Reutiliza la ventana de los filtros del buscador (`.ctop-pick-*`, en search-filters.css); aquí sólo
   se añade el pie fijo que aquella no tenía y el contenido de los pasos.

   Nota de especificidad, ya cara en este proyecto: `reset.css` trae `input[type="date"]{width:100%}`
   y `.elementor-kit-4 a` pinta de azul cualquier enlace, ambos (0,1,1)/(0,2,0). Lo que tenga que
   ganarles lleva clase + elemento. */

/* ============================== Bloque en el formulario ============================== */

/* Los tres desplegables no se enseñan nunca sueltos: se editan en el asistente. Doble vía porque
   `:has()` no existe en navegadores viejos y entonces la hoja no alcanza el contenedor del campo;
   la clase la pone el JS. */
.hp-form__field:has(.ctop-reserva-ajuste),
.hp-form__field.ctop-reserva-oculto{ display:none !important; }

/* El bloque del botón sólo existe si se han aceptado las reservas. */
.hp-form__field.ctop-reserva-cfg{ display:none; }
.hp-form__field.ctop-reserva-cfg.is-on{ display:block; }

/* El label del campo sobra: el botón ya dice lo que hace. */
.ctop-reserva-cfg > label{ display:none; }

.hp-form__field button.ctop-reserva-cfg-btn{
  display:inline-flex; align-items:center; gap:9px;
  padding:11px 20px; cursor:pointer;
  border:1px solid #BFDBFE; border-radius:12px; background:#EFF6FF; color:#1D4ED8;
  font:700 14.5px/1 Inter,sans-serif;
  transition:background .15s, border-color .15s;
}
.hp-form__field button.ctop-reserva-cfg-btn:hover{ background:#DBEAFE; border-color:#2563EB; }

/* El `caption` del campo `button` de HivePress se escapa, así que el icono no puede ir en el texto:
   lo pone el CSS. Font Awesome 5 — en FA6 el nombre existe pero no hay glifo y sale un cuadro. */
.ctop-reserva-cfg-btn::before{
  content:"\f013";                     /* fa-cog */
  font-family:"Font Awesome 5 Free"; font-weight:900; font-size:14px;
}

.ctop-reserva-cfg__resumen{
  margin:9px 0 0; font:500 13px/1.5 Inter,sans-serif; color:#64748B;
}
.ctop-reserva-cfg__resumen:empty{ display:none; }

/* ============================== Asistente ============================== */

.ctop-wiz .ctop-pick-box{ max-width:520px; }

/* Pie fijo: la ventana de los filtros sólo tenía cabecera y cuerpo. */
.ctop-pick-foot{
  display:flex; justify-content:flex-end; gap:10px;
  padding:14px 20px; border-top:1px solid #EEF2F7; background:#FBFCFE;
  border-radius:0 0 18px 18px;
}

.ctop-wiz__btn{
  padding:10px 20px; cursor:pointer; border-radius:11px;
  font:700 14px/1 Inter,sans-serif;
  transition:background .15s, border-color .15s, color .15s;
}
.ctop-wiz__btn--pri{ border:0; background:#2563EB; color:#fff; }
.ctop-wiz__btn--pri:hover{ background:#1D4ED8; }
.ctop-wiz__btn--sec{ border:1px solid #D7DEE8; background:#fff; color:#0F172A; }
.ctop-wiz__btn--sec:hover{ background:#F8FAFC; border-color:#94A3B8; }
.ctop-wiz__btn[disabled]{ opacity:.45; cursor:default; }
.ctop-wiz__btn[disabled]:hover{ background:#fff; border-color:#D7DEE8; }

/* ---------- Progreso ---------- */
.ctop-wiz__cab{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.ctop-wiz__puntos{ display:flex; align-items:center; gap:7px; }
.ctop-wiz__puntos span{
  width:9px; height:9px; border-radius:50%; background:#E2E8F0;
  transition:background .2s, width .2s;
}
.ctop-wiz__puntos span.is-hecho{ background:#93C5FD; }
.ctop-wiz__puntos span.is-ahora{ width:24px; border-radius:99px; background:#2563EB; }
.ctop-wiz__n{ font:600 12px/1.4 Inter,sans-serif; color:#94A3B8; }

.ctop-wiz__titulo{
  margin:0 0 6px; font:800 17px/1.35 Montserrat,sans-serif; color:#0F172A;
}
.ctop-wiz__sub{
  margin:22px 0 4px; font:700 14px/1.35 Montserrat,sans-serif; color:#0F172A;
}
.ctop-wiz__sub:first-of-type{ margin-top:6px; }
.ctop-wiz__ayuda{
  margin:0 0 14px; font:500 13px/1.6 Inter,sans-serif; color:#64748B;
}

/* ---------- Tarjetas de opción ---------- */
.ctop-wiz__ops{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:4px; }
.ctop-wiz__op{
  flex:1 1 calc(50% - 4px); min-width:130px;
  padding:12px 14px; cursor:pointer; text-align:left;
  border:1px solid #D7DEE8; border-radius:12px; background:#fff; color:#0F172A;
  font:600 14px/1.2 Inter,sans-serif;
  transition:background .15s, border-color .15s, color .15s;
}
.ctop-wiz__op:hover{ background:#F8FAFC; border-color:#93C5FD; }
.ctop-wiz__op.is-on{
  background:#EFF6FF; border-color:#2563EB; color:#1D4ED8; font-weight:800;
  box-shadow:inset 0 0 0 1px #2563EB;
}

/* ---------- Previsualización ---------- */
.ctop-wiz__vista{ margin-top:16px; }
.ctop-wiz__vista-t{
  margin:0 0 8px; font:600 13px/1.4 Inter,sans-serif; color:#475569;
}
.ctop-wiz__horas{ display:flex; flex-wrap:wrap; gap:6px; }
.ctop-wiz__horas span{
  padding:6px 10px; border-radius:9px; background:#F1F5F9; color:#334155;
  font:700 12.5px/1 Inter,sans-serif;
}
.ctop-wiz__horas .ctop-wiz__mas{ background:#E2E8F0; color:#64748B; }
.ctop-wiz__vista-p{
  margin:9px 0 0; font:600 12.5px/1.4 Inter,sans-serif; color:#94A3B8;
}
.ctop-wiz__cargando{
  margin:0; font:500 13px/1.4 Inter,sans-serif; color:#94A3B8;
}

/* ---------- Aviso ---------- */
.ctop-wiz__aviso{
  margin:0 0 14px; padding:11px 14px; border-radius:10px;
  background:#FFFBEB; border:1px solid #FDE68A; color:#92400E;
  font:600 13px/1.55 Inter,sans-serif;
}
.ctop-wiz__aviso:empty{ display:none; }

/* ---------- Resumen ---------- */
.ctop-wiz__resumen{ list-style:none; margin:6px 0 16px; padding:0; }
.ctop-wiz__resumen li{
  display:flex; align-items:center; gap:11px;
  padding:11px 14px; margin-bottom:8px;
  border:1px solid #E9EEF5; border-radius:11px; background:#fff;
  font:500 13.5px/1.4 Inter,sans-serif; color:#475569;
}
.ctop-wiz__resumen i{ color:#2563EB; width:16px; text-align:center; }
.ctop-wiz__resumen strong{ color:#0F172A; font-weight:700; }
.ctop-wiz__nota{
  margin:0; padding:11px 14px; border-radius:10px;
  background:#EFF6FF; color:#1D4ED8;
  font:600 13px/1.5 Inter,sans-serif;
}

/* ---------- El editor de horario, prestado ----------
   En el formulario el editor es una rejilla de tres columnas (110px 150px 1fr) que sólo colapsa por
   debajo de 560 px de **ventana**. Dentro del modal la ventana sigue siendo ancha pero el hueco no:
   las horas se salían por la derecha y los botones de quitar tramo quedaban fuera. Aquí se fuerza la
   disposición en una columna, con cada día como una tarjeta, sin tocar el editor del formulario. */
.ctop-wiz .uv-sched-editor{
  margin:0; padding:0; gap:9px;
  background:none; border:0;
}
.ctop-wiz .uv-sched-row{
  grid-template-columns:1fr; gap:8px;
  padding:12px 14px; border:1px solid #E9EEF5; border-radius:12px; background:#F8FAFC;
}
.ctop-wiz .uv-sched-day{ font-weight:700; }
.ctop-wiz .uv-sched-editor select.uv-sched-mode{ width:100%; max-width:190px; }
.ctop-wiz .uv-sched-range{ flex-wrap:nowrap; }

/* ---------- Móvil ---------- */
@media (max-width:640px){
  .ctop-wiz__op{ flex:1 1 100%; }
  .ctop-pick-foot{ border-radius:0; }
  .ctop-wiz__btn{ flex:1 1 0; }
}