/*
 * Estilos del plugin de reservas. Los selectores usan siempre el prefijo
 * ".ner-" y se fijan explícitamente propiedades básicas (box-sizing,
 * position, float, line-height) para no heredar reglas raras del tema o
 * de Elementor que puedan hacer que las cajas se vean gigantes, que el
 * texto se monte encima de otro texto, o que los botones se sobrepongan.
 */

.ner-booking-calendar,
.ner-delivery-box {
	all: revert;
	box-sizing: border-box;
	position: static;
	float: none;
	clear: both;
	display: block;
	width: 100%;
	flex-basis: 100%; /* si el tema pone display:flex en form.cart, esto obliga a que el resto (cantidad, botón) pase a la siguiente línea en vez de montarse encima */
	margin: 1em 0;
	padding: .85em 1em;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	background: #fff;
	font-size: 14px;
	line-height: 1.45;
	overflow: visible;
	color: #333;
}

/* Si el tema usa flexbox en el formulario de compra, que al menos se ajuste
   en filas en vez de encimarse. La cantidad y el botón de "Añadir al
   carrito" no deberían compartir fila con el calendario de reservas. */
.woocommerce div.product form.cart {
	flex-wrap: wrap;
}

.ner-booking-calendar *,
.ner-delivery-box *,
.ner-booking-calendar *::before,
.ner-delivery-box *::before,
.ner-booking-calendar *::after,
.ner-delivery-box *::after {
	box-sizing: border-box;
}

.ner-booking-calendar p,
.ner-delivery-box p {
	margin: 0 0 .5em;
	padding: 0;
	line-height: 1.4;
	position: static;
	float: none;
}

.ner-booking-calendar input,
.ner-booking-calendar button,
.ner-delivery-box input,
.ner-delivery-box select,
.ner-delivery-box button {
	position: static !important;
	float: none !important;
	display: block;
	vertical-align: middle;
	font-family: inherit;
	line-height: 1.3;
	height: auto;
	width: 100%;
	max-width: 100%;
	margin: 0 0 .5em;
	padding: .6em .8em;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	font-size: 15px;
}

.ner-booking-calendar .ner-booking-label {
	margin: 0 0 .5em;
}

.ner-date-fields {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: .6em;
	margin-bottom: .5em;
}

.ner-date-field {
	flex: 1 1 45%;
	min-width: 110px;
	display: flex;
	flex-direction: column;
}

.ner-date-field .ner-date-sublabel {
	display: flex;
	align-items: flex-end; /* si el texto ocupa 2 líneas en un campo y 1 en el otro, los cuadros de abajo igual arrancan a la misma altura */
	min-height: 2.6em;
	font-size: .8em;
	font-weight: 600;
	color: #555;
	margin-bottom: .3em;
	line-height: 1.3;
}

.ner-booking-calendar .ner-date-single {
	width: 100%;
	padding: .6em .8em;
	border: 1px solid #ccc;
	border-radius: 4px;
	cursor: pointer;
	background: #fff;
	font-size: 15px;
	margin-bottom: 0;
}

.ner-booking-calendar .ner-date-single:disabled {
	background: #f4f4f4;
	cursor: not-allowed;
}

.ner-booking-hint {
	margin: -.2em 0 .6em;
	font-size: .82em;
	color: #8a94a3;
	line-height: 1.4;
}

.ner-availability-message {
	margin-top: .6em;
	font-weight: 600;
	line-height: 1.4;
}

.ner-availability-message.ner-available {
	color: #1a7f37;
}

.ner-availability-message.ner-unavailable {
	color: #c0392b;
}

.ner-price-breakdown {
	margin-top: .5em;
	font-size: .95em;
}

.ner-price-breakdown .ner-line {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	gap: .5em;
	padding: .2em 0;
	line-height: 1.4;
}

.ner-price-breakdown .ner-note {
	color: #8a6d3b;
	justify-content: flex-start;
}

/* El monto final se destaca (más grande, en negrita y con color) para que se
   note de un vistazo que ya incluye los recargos que apliquen. */
.ner-price-breakdown .ner-total-amount {
	font-size: 1.2em;
	font-weight: 700;
	color: #1d4ed8;
}

/* Cuadro de zona de entrega (carrito, checkout o producto): mismo ancho
   máximo que el calendario de reservas, para que ambos cuadros se vean del
   mismo tamaño uno debajo del otro. */
.ner-delivery-box .ner-delivery-title {
	margin-bottom: .35em;
}

.ner-delivery-box select#ner_delivery_zone {
	cursor: pointer;
	background: #fff;
}

.ner-delivery-box .ner-delivery-result {
	margin-top: .5em;
	font-weight: 600;
	line-height: 1.4;
}

.ner-delivery-box .ner-delivery-error {
	color: #c0392b;
	font-weight: 600;
}

/* Fila de propina dentro de la tabla de totales del carrito/checkout (se
   inserta justo antes del "Total", usando los hooks propios de WooCommerce). */
.ner-tip-row th {
	font-weight: 400;
}

.ner-tip-input-wrap {
	display: flex;
	align-items: center;
	gap: .3em;
	justify-content: flex-end;
}

.ner-tip-input-wrap .ner-tip-currency {
	color: #666;
}

.ner-tip-row input#ner_tip_amount {
	width: 6.5em;
	max-width: 100%;
	padding: .35em .5em;
	text-align: right;
}

/* Ajustes específicos para pantallas de teléfono: todo se apila en vertical */
@media (max-width: 480px) {
	.ner-booking-calendar,
	.ner-delivery-box {
		padding: .75em;
		margin: 1em 0;
		font-size: 13px;
	}

	.ner-date-field {
		min-width: 0; /* las dos fechas se quedan lado a lado también en teléfono, para no alargar el proceso */
	}

	.ner-date-field .ner-date-sublabel {
		font-size: .78em;
	}

	.ner-booking-calendar .ner-date-single,
	.ner-delivery-box select {
		font-size: 16px; /* evita el zoom automático de iOS/Android */
		padding: .7em .8em;
	}

	.ner-tip-row input#ner_tip_amount {
		font-size: 16px; /* evita el zoom automático de iOS/Android */
		width: 5.5em;
	}

	.ner-price-breakdown .ner-line {
		flex-wrap: wrap;
	}

	.ner-availability-message,
	.ner-price-breakdown,
	.ner-delivery-box .ner-delivery-result {
		font-size: .95em;
		word-break: break-word;
	}
}

/* La ventana del calendario de flatpickr no debe salirse de la pantalla en móvil */
.flatpickr-calendar {
	max-width: 94vw;
	z-index: 9999;
}

/* Aviso de firma obligatoria en el checkout (bloquea el botón de pagar
   hasta que se firme el acuerdo de alquiler). */
.ner-terms-gate {
	box-sizing: border-box;
	max-width: 100%;
	margin: 0 0 1.2em;
	padding: .9em 1.1em;
	border-radius: 6px;
	font-size: 14px;
	line-height: 1.5;
}

.ner-terms-gate p {
	margin: 0 0 .6em;
}

.ner-terms-gate p:last-child {
	margin-bottom: 0;
}

.ner-terms-gate-pending {
	border: 1px solid #f0c36d;
	background: #fff8ea;
	color: #6b4d00;
}

.ner-terms-gate-hint {
	font-size: .85em;
	color: #8a6d3b;
}

.ner-terms-gate-link {
	display: inline-block;
}

.ner-terms-gate-ok {
	border: 1px solid #9fd8ae;
	background: #edfaf0;
	color: #1a7f37;
	font-weight: 600;
}

.ner-terms-gate-disabled-button {
	opacity: .55;
	cursor: not-allowed !important;
}

/* ── Firma: QR solo en computadora, botón solo en teléfono ── */
.ner-terms-desktop { display: block; }
.ner-terms-mobile  { display: none; }

.ner-terms-qr {
	display: inline-block;
	margin: 4px 0 8px;
	padding: 10px;
	background: #fff;
	border: 1px solid #e4e8f0;
	border-radius: 12px;
	line-height: 0;
}
.ner-terms-qr img,
.ner-terms-qr canvas { display: block; }

@media (max-width: 768px) {
	.ner-terms-desktop { display: none; }
	.ner-terms-mobile  { display: block; }
}