/**
 * Mejoras WooCommerce Booking - estilos del formulario de reserva.
 *
 * Usa las variables del theme (--wc-*) con valores de reserva por si el
 * plugin se usa con otro theme.
 */

/* --------------------------------------------------------------------------
   Aforo maximo superado
   -------------------------------------------------------------------------- */

/* Sin boton de reservar mientras se vea el aviso. El JS de Bookings le pone
   display en linea al cargar, de ahi el !important. Al cambiar las personas
   se recalcula, el aviso desaparece y el boton vuelve. */
form.cart:has(.mwcb-aforo) .wc-bookings-booking-form-button {
	display: none !important;
}

.wc-bookings-booking-cost:has(.mwcb-aforo) {
	background: var(--wc-vino-suave, #fff4e7);
}

.mwcb-aforo {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 4px 0 6px;
}

.mwcb-aforo__texto {
	margin: 0;
	color: var(--wc-texto, #222222);
	font-size: 1em;
	line-height: 1.5em;
}

.mwcb-aforo__texto strong {
	color: var(--wc-vino, #74522a);
}

.woocommerce .mwcb-aforo .mwcb-aforo__boton {
	display: block;
	width: 100%;
	margin: 0;
	text-align: center;
}

/* --------------------------------------------------------------------------
   Producto combinado: paso "Hora del Wine Spa"
   El JS lo coloca dentro de .wc-bookings-booking-form, encima del precio.
   Mismo aspecto que las horas de Bookings (pastillas), pero con clases
   propias: el JS de Bookings escucha los clics en .block-picker.
   -------------------------------------------------------------------------- */

.mwcb-combo {
	margin: 0;
	padding-top: 18px;
	border-top: 1px solid var(--wc-borde, #dce4f1);
}

.mwcb-combo__titulo {
	margin: 0 0 12px;
	color: var(--wc-azul-oscuro, #26385e);
	font-size: 0.92em;
	font-weight: 600;
	line-height: 1.35em;
}

.mwcb-combo__horas {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.mwcb-combo__horas:empty {
	display: none;
}

.mwcb-combo__horas li {
	margin: 0;
	padding: 0;
}

/* Se anulan los estilos genericos de <button> del tema. */
.woocommerce form.cart .mwcb-combo__hora {
	display: block;
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 8px 8px 11px 8px;
    background: var(--wc-blanco, #ffffff);
    border: 1px solid var(--wc-borde-fuerte, #cad9ed);
    border-radius: 10px;
    box-shadow: none;
    color: var(--wc-azul-oscuro, #26385e);
    font: inherit;
    font-size: 1.2em;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1;
    text-align: center;
    text-transform: none;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.woocommerce form.cart .mwcb-combo__hora:hover,
.woocommerce form.cart .mwcb-combo__hora:focus-visible {
	background: var(--wc-azul-suave, #eaf0f9);
	border-color: var(--wc-azul-medio, #637eaf);
	color: var(--wc-azul-oscuro, #26385e);
	outline: none;
}

.woocommerce form.cart .mwcb-combo__hora.selected {
	background: var(--wc-azul, #3e5683);
	border-color: var(--wc-azul, #3e5683);
	color: var(--wc-blanco, #ffffff);
	box-shadow: 0 6px 14px -6px rgba(38, 56, 94, 0.6);
}

/* Pista bajo las horas, o en su lugar si aun no hay visita elegida. */
.mwcb-combo__aviso {
	margin: 10px 0 0;
	color: var(--wc-texto-suave, #605d57);
	font-size: 0.88em;
	line-height: 1.45em;
}

.mwcb-combo__horas:empty + .mwcb-combo__aviso {
	margin: 0;
	padding: 16px 18px;
	background: var(--wc-azul-claro, #f6f9fc);
	border: 1px dashed var(--wc-borde-fuerte, #cad9ed);
	border-radius: 10px;
	font-size: 0.95em;
	text-align: center;
}

.mwcb-combo--cargando .mwcb-combo__aviso {
	opacity: 0.7;
}

/* Se intento reservar sin hora del spa. */
.mwcb-combo--falta .mwcb-combo__titulo,
.mwcb-combo--falta .mwcb-combo__aviso {
	color: var(--wc-rojo, #924134);
}

.mwcb-combo--falta .mwcb-combo__horas:empty + .mwcb-combo__aviso {
	background: #fdf4f2;
	border-color: #eccec7;
}
