/*!
 * BookingCloud — aspecto del formulario de reservas.
 * Código propio de BookingCloud (FingerCloud).
 * Usa la tipografía del tema y los colores de la paleta elegida en BookingCloud → Integraciones
 * (variables --bc-*). La estructura está en front-end/css/hbook.css.
 */

.hbook-wrapper {
	--bc-p: var(--bc-primary, #1b6fa3);
	--bc-p-dark: var(--bc-primary-dark, #145480);
	--bc-p-soft: var(--bc-primary-soft, #e3eff7);
	--bc-a: var(--bc-accent, #c11222);
	--bc-a-dark: var(--bc-accent-dark, #9d0e1b);
	--bc-bg: var(--bc-surface, #f3f8fc);
	--bc-ink: var(--bc-text, #1d2a33);
	--bc-mute: var(--bc-muted, #5c6b75);
	--bc-ln: var(--bc-line, #d7e0e6);
	--bc-r: var(--bc-radius, 10px);
	color: var(--bc-ink);
	font-family: inherit;
	line-height: 1.55;
}

/* ---------- Títulos y textos ---------- */

.hbook-wrapper .hb-title,
.hbook-wrapper h3,
.hbook-wrapper h4 {
	color: var(--bc-ink);
	font-family: inherit;
	font-size: 1.25em;
	font-weight: 650;
	letter-spacing: -.01em;
	margin: 1.4em 0 .6em;
}

.hbook-wrapper a {
	color: var(--bc-p);
	text-underline-offset: 3px;
}

.hbook-wrapper label,
.hbook-wrapper .hb-search-fields > p > label {
	color: var(--bc-mute);
	font-size: .875em;
	font-weight: 500;
}

/* ---------- Campos ---------- */

.hbook-wrapper input[type="text"],
.hbook-wrapper input[type="email"],
.hbook-wrapper input[type="tel"],
.hbook-wrapper input[type="number"],
.hbook-wrapper select,
.hbook-wrapper textarea {
	appearance: none;
	background-color: #fff;
	border: 1px solid var(--bc-ln);
	border-radius: var(--bc-r);
	box-shadow: none;
	color: var(--bc-ink);
	font: inherit;
	font-size: 16px; /* evita el zoom automático en iPhone */
	min-height: 46px;
	padding: 10px 14px;
	transition: border-color .15s, box-shadow .15s;
}

.hbook-wrapper select {
	background-image: linear-gradient(45deg, transparent 50%, var(--bc-mute) 50%), linear-gradient(135deg, var(--bc-mute) 50%, transparent 50%);
	background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%;
	background-repeat: no-repeat;
	background-size: 5px 5px, 5px 5px;
	padding-right: 34px;
}

.hbook-wrapper input:focus,
.hbook-wrapper select:focus,
.hbook-wrapper textarea:focus {
	border-color: var(--bc-p);
	box-shadow: 0 0 0 3px var(--bc-p-soft);
	outline: none;
}

.hbook-wrapper .hb-input-datepicker {
	cursor: pointer;
}

.hbook-wrapper .bc-invalid {
	border-color: var(--bc-a) !important;
}

.hbook-wrapper .bc-field-error {
	color: var(--bc-a);
}

.hbook-wrapper input[type="radio"],
.hbook-wrapper input[type="checkbox"] {
	accent-color: var(--bc-p);
	height: 18px;
	vertical-align: -3px;
	width: 18px;
}

/* ---------- Botones ---------- */

.hbook-wrapper input[type="submit"],
.hbook-wrapper button,
.hbook-wrapper .hb-apply-coupon {
	background: var(--bc-p);
	border: 0;
	border-radius: var(--bc-r);
	box-shadow: none;
	color: #fff;
	cursor: pointer;
	font: inherit;
	font-size: 16px;
	font-weight: 600;
	min-height: 46px;
	padding: 0 22px;
	text-shadow: none;
	text-transform: none;
	transition: background .15s, transform .1s;
}

.hbook-wrapper input[type="submit"]:hover,
.hbook-wrapper button:hover,
.hbook-wrapper .hb-apply-coupon:hover {
	background: var(--bc-p-dark);
}

.hbook-wrapper input[type="submit"]:active {
	transform: translateY(1px);
}

.hbook-wrapper input[type="submit"]:disabled {
	cursor: not-allowed;
	opacity: .55;
}

.hbook-wrapper .hb-previous-step input[type="submit"] {
	background: transparent;
	box-shadow: inset 0 0 0 1px var(--bc-ln);
	color: var(--bc-ink);
}

.hbook-wrapper .hb-previous-step input[type="submit"]:hover {
	background: var(--bc-bg);
}

/* La acción principal ("Reservar") en el color de acento. */
.hbook-wrapper .hb-confirm-area input[type="submit"] {
	background: var(--bc-a);
	font-size: 17px;
	max-width: 360px;
	min-height: 52px;
	width: 100%;
}

.hbook-wrapper .hb-confirm-area input[type="submit"]:hover {
	background: var(--bc-a-dark);
}

/* ---------- Buscador ---------- */

.hbook-wrapper .hb-booking-search-form {
	background: var(--bc-bg);
	border: 1px solid var(--bc-ln);
	border-radius: calc(var(--bc-r) + 4px);
	padding: 16px 18px 18px;
}

.hbook-wrapper .hb-booking-search-form > .hb-title,
.hbook-wrapper .hb-booking-search-form > h3 {
	margin-top: 0;
}

.hbook-wrapper .hb-multi-accom-people-selection-wrapper {
	background: #fff;
	border: 1px solid var(--bc-ln);
	border-radius: var(--bc-r);
}

.hbook-wrapper .hb-people-popup-wrapper-close,
.hbook-wrapper .hb-people-popup-wrapper-close:hover,
.hbook-wrapper .hb-people-popup-wrapper-close:focus {
	background: none;
	border: 0;
	box-shadow: none;
	color: var(--bc-mute);
	outline-offset: 2px;
}

.hbook-wrapper h4 {
	font-size: 1.05em;
	margin: 1.2em 0 .4em;
}

/* ---------- Mensajes ---------- */

.hbook-wrapper .hb-search-error,
.hbook-wrapper .hb-confirm-error,
.hbook-wrapper .hb-policies-error,
.hbook-wrapper .hb-coupon-error,
.hbook-wrapper .hb-multi-accom-no-accom-selected {
	background: color-mix(in srgb, var(--bc-a) 8%, #fff);
	border-left: 3px solid var(--bc-a);
	border-radius: 0 var(--bc-r) var(--bc-r) 0;
	color: var(--bc-ink);
	padding: 10px 14px;
}

.hbook-wrapper .hb-coupon-msg {
	background: color-mix(in srgb, var(--bc-p) 8%, #fff);
	border-left: 3px solid var(--bc-p);
	border-radius: 0 var(--bc-r) var(--bc-r) 0;
	padding: 10px 14px;
}

.hbook-wrapper .hb-booking-searching,
.hbook-wrapper .hb-saving-resa,
.hbook-wrapper .hb-loading-summary,
.hbook-wrapper .hb-processing-coupon {
	color: var(--bc-mute);
}

.hbook-wrapper .hb-dots-loader::after {
	animation: bc-dots 1.2s steps(4, end) infinite;
	content: "";
	display: inline-block;
	width: 1.2em;
}

@keyframes bc-dots {
	0% { content: ""; }
	25% { content: "."; }
	50% { content: ".."; }
	75% { content: "..."; }
}

.hbook-wrapper .bc-thanks-head {
	background: color-mix(in srgb, var(--bc-p) 7%, #fff);
	border: 1px solid color-mix(in srgb, var(--bc-p) 25%, #fff);
	border-radius: var(--bc-r);
	font-size: 1.05em;
	font-weight: 600;
	padding: 16px 18px 16px 52px;
	position: relative;
}

.hbook-wrapper .bc-thanks-head::before {
	align-items: center;
	background: var(--bc-p);
	border-radius: 50%;
	color: #fff;
	content: "✓";
	display: flex;
	font-size: 14px;
	height: 24px;
	justify-content: center;
	left: 16px;
	position: absolute;
	top: 17px;
	width: 24px;
}

.hbook-wrapper .bc-thanks-foot {
	font-size: 1.05em;
	font-weight: 600;
	margin-top: 14px;
}

/* ---------- Tarjetas de alojamiento ---------- */

.hbook-wrapper .hb-search-result-title-section p {
	color: var(--bc-mute);
}

.hbook-wrapper .hb-multi-accom-search-results-people {
	color: var(--bc-mute);
	font-size: .9em;
	margin: -.3em 0 .8em;
}

.hbook-wrapper .hb-accom {
	background: #fff;
	border: 1px solid var(--bc-ln);
	border-radius: calc(var(--bc-r) + 4px);
	padding: 18px;
	transition: border-color .15s, box-shadow .15s;
}

.hbook-wrapper .hb-accom:hover {
	box-shadow: 0 8px 26px -14px rgba(0, 0, 0, .28);
}

.hbook-wrapper .hb-accom.hb-accom-selected {
	border-color: var(--bc-p);
	box-shadow: 0 0 0 2px var(--bc-p-soft);
}

.hbook-wrapper .hb-accom-img {
	border-radius: var(--bc-r);
}

.hbook-wrapper .hb-accom-title {
	color: var(--bc-ink);
	font-size: 1.2em;
	font-weight: 650;
}

.hbook-wrapper .hb-accom-title a {
	color: inherit;
	text-decoration: none;
}

.hbook-wrapper .hb-accom-desc {
	color: var(--bc-mute);
	font-size: .95em;
}

.hbook-wrapper .hb-accom-price {
	color: var(--bc-a);
	font-size: 1.5em;
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	line-height: 1.2;
}

.hbook-wrapper .hb-accom-price-caption {
	color: var(--bc-mute);
	font-size: .875em;
}

.hbook-wrapper .hb-accom-price-caption br {
	display: none;
}

.hbook-wrapper .hb-view-price-breakdown {
	margin-left: 6px;
}

.hbook-wrapper .hb-price-breakdown {
	background: var(--bc-bg);
	border-radius: var(--bc-r);
	color: var(--bc-mute);
	font-size: .9em;
	font-variant-numeric: tabular-nums;
	padding: 10px 14px;
}

.hbook-wrapper .hb-price-breakdown-title {
	color: var(--bc-ink);
	font-weight: 600;
}

.hbook-wrapper .hb-accom-selected-name {
	color: var(--bc-p);
	font-weight: 600;
}

.hbook-wrapper .hb-accom-selected-name::before {
	content: "✓ ";
}

.hbook-wrapper .hb-accom-left {
	color: var(--bc-a);
	font-size: .9em;
}

/* ---------- Extras ---------- */

.hbook-wrapper .hb-options-form {
	background: #fff;
	border: 1px solid var(--bc-ln);
	border-radius: calc(var(--bc-r) + 4px);
	padding: 4px 18px 18px;
}

.hbook-wrapper .hb-option {
	border-bottom: 1px dashed var(--bc-ln);
	padding-bottom: 10px;
}

.hbook-wrapper .hb-option:last-of-type {
	border-bottom: 0;
}

.hbook-wrapper .hb-options-total-price {
	font-variant-numeric: tabular-nums;
	font-weight: 650;
}

/* ---------- Datos, resumen y pago ---------- */

.hbook-wrapper .hb-coupons-area,
.hbook-wrapper .hb-resa-summary-content,
.hbook-wrapper .hb-payment-info-wrapper {
	background: var(--bc-bg);
	border: 1px solid var(--bc-ln);
	border-radius: var(--bc-r);
	padding: 4px 18px 16px;
}

.hbook-wrapper .hb-resa-summary-content {
	padding-top: 14px;
}

.hbook-wrapper .hb-resa-summary-content > div {
	border-bottom: 1px dashed var(--bc-ln);
	padding: 6px 0;
}

.hbook-wrapper .hb-resa-summary-content > div:last-child {
	border-bottom: 0;
}

.hbook-wrapper .hb-summary-total-price,
.hbook-wrapper .hb-summary-accom-total-price {
	font-variant-numeric: tabular-nums;
}

.hbook-wrapper .hb-payment-type-explanation,
.hbook-wrapper .hb-payment-form,
.hbook-wrapper .hb-bottom-area-content {
	color: var(--bc-mute);
}

/* ---------- Calendario ---------- */

.bc-datepick {
	--bc-p: var(--bc-primary, #1b6fa3);
	--bc-p-soft: var(--bc-primary-soft, #e3eff7);
	--bc-a: var(--bc-accent, #c11222);
	--bc-ink: var(--bc-text, #1d2a33);
	--bc-mute: var(--bc-muted, #5c6b75);
	--bc-ln: var(--bc-line, #d7e0e6);
	--bc-r: var(--bc-radius, 10px);
	background: #fff;
	border: 1px solid var(--bc-ln);
	border-radius: calc(var(--bc-r) + 4px);
	box-shadow: 0 20px 44px -18px rgba(0, 0, 0, .35);
	color: var(--bc-ink);
	font-family: inherit;
	font-size: 15px;
	margin-top: 6px;
}

.bc-dp-hint {
	color: var(--bc-mute);
	font-size: 13px;
}

.bc-dp-head .bc-dp-cmd {
	color: var(--bc-mute);
}

.bc-dp-nav .bc-dp-cmd {
	background: transparent;
	border-radius: 50%;
	color: var(--bc-p);
}

.bc-dp-nav .bc-dp-cmd:hover {
	background: var(--bc-p-soft);
}

.bc-dp-month-name {
	font-size: 16px;
	font-weight: 650;
}

.bc-dp-grid th {
	color: var(--bc-mute);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
}

.bc-dp-grid td a {
	border-radius: calc(var(--bc-r) - 3px);
	color: var(--bc-ink);
	font-variant-numeric: tabular-nums;
	transition: background .1s;
}

.bc-dp-grid td a:hover {
	background: var(--bc-p-soft);
}

/* Días que no se pueden elegir: pasados, ocupados o fuera de rango. */
.bc-dp-grid td span {
	color: color-mix(in srgb, var(--bc-mute) 45%, #fff);
}

.bc-dp-grid td span.bc-day-busy {
	background: color-mix(in srgb, var(--bc-a) 8%, #fff);
	border-radius: calc(var(--bc-r) - 3px);
	color: color-mix(in srgb, var(--bc-a) 45%, #fff);
	text-decoration: line-through;
}

.bc-dp-grid td .bc-dp-today {
	box-shadow: inset 0 0 0 1px var(--bc-p);
}

.bc-dp-grid td a.bc-day-in-range {
	background: var(--bc-p-soft);
}

.bc-dp-grid td a.bc-dp-selected {
	background: var(--bc-p);
	color: #fff;
}

.bc-dp-legend {
	border-top: 1px solid var(--bc-ln);
	color: var(--bc-mute);
	font-size: 12px;
	padding-top: 8px;
}

.bc-dp-legend-free i {
	border: 1px solid var(--bc-ln);
	border-radius: 3px;
}

.bc-dp-legend-busy i {
	background: color-mix(in srgb, var(--bc-a) 25%, #fff);
	border-radius: 3px;
}

/* ---------- Calendario de disponibilidad ---------- */

.hb-availability-calendar {
	--bc-p: var(--bc-primary, #1b6fa3);
	--bc-p-soft: var(--bc-primary-soft, #e3eff7);
	--bc-a: var(--bc-accent, #c11222);
	--bc-ink: var(--bc-text, #1d2a33);
	--bc-mute: var(--bc-muted, #5c6b75);
	--bc-ln: var(--bc-line, #d7e0e6);
	--bc-r: var(--bc-radius, 10px);
	--bc-busy: color-mix(in srgb, var(--bc-a) 22%, #fff);
	color: var(--bc-ink);
	font-size: 15px;
}

.hb-availability-calendar .bc-dp-nav .bc-dp-cmd {
	border-radius: 50%;
	color: var(--bc-p);
}

.hb-availability-calendar .bc-dp-nav .bc-dp-cmd:hover {
	background: var(--bc-p-soft);
}

.hb-availability-calendar .bc-dp-month-name {
	font-size: 16px;
	font-weight: 650;
}

.hb-availability-calendar .bc-dp-grid th {
	color: var(--bc-mute);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
}

.hb-availability-calendar .bc-dp-grid td span {
	border-radius: calc(var(--bc-r) - 4px);
	color: var(--bc-ink);
	font-variant-numeric: tabular-nums;
}

.hb-availability-calendar .bc-dp-grid td span.bc-av-free {
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--bc-ln);
}

.hb-availability-calendar .bc-dp-grid td span.bc-av-occupied {
	background: var(--bc-busy);
	color: color-mix(in srgb, var(--bc-a) 70%, #000);
}

/* Medio día: ocupado a la tarde (solo salida) o a la mañana (solo entrada). */
.hb-availability-calendar .bc-dp-grid td span.bc-av-out-only {
	background: linear-gradient(135deg, #fff 50%, var(--bc-busy) 50%);
	box-shadow: inset 0 0 0 1px var(--bc-ln);
}

.hb-availability-calendar .bc-dp-grid td span.bc-av-in-only {
	background: linear-gradient(135deg, var(--bc-busy) 50%, #fff 50%);
	box-shadow: inset 0 0 0 1px var(--bc-ln);
}

.hb-availability-calendar .bc-dp-grid td span.bc-av-past,
.hb-availability-calendar .bc-dp-grid td span.bc-av-closed {
	color: color-mix(in srgb, var(--bc-mute) 45%, #fff);
}

.hb-availability-calendar .bc-dp-grid td .bc-dp-today {
	font-weight: 700;
}

.hb-avail-caption-wrapper {
	color: var(--bc-muted, #5c6b75);
	font-size: 13px;
}

.hb-avail-caption {
	border-radius: 3px;
}

.hb-avail-caption-available {
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--bc-line, #d7e0e6);
}

.hb-avail-caption-occupied {
	background: color-mix(in srgb, var(--bc-accent, #c11222) 22%, #fff);
}

/* ---------- Tabla de tarifas ---------- */

.hb-rates-table {
	font-variant-numeric: tabular-nums;
}

.hb-rates-table th {
	background: var(--bc-surface, #f3f8fc);
	color: var(--bc-text, #1d2a33);
	font-weight: 650;
}

.hb-rates-table th,
.hb-rates-table td {
	border-bottom: 1px solid var(--bc-line, #d7e0e6);
}

.hb-rate-price {
	color: var(--bc-accent, #c11222);
	font-weight: 650;
}

/* ---------- Listado de alojamientos ---------- */

.hb-accom-listing-item {
	background: #fff;
	border: 1px solid var(--bc-line, #d7e0e6);
	border-radius: calc(var(--bc-radius, 10px) + 4px);
	overflow: hidden;
	padding: 0 0 18px;
}

.hb-accom-listing-desc-wrapper,
.hb-accom-listing-actions-wrapper,
.hb-accom-listing-booking-form {
	padding: 0 18px;
}

.hb-accom-listing-desc .hb-thumbnail-link {
	display: block;
	margin: 0 -18px 14px;
}

.hb-accom-listing-actions-wrapper input[type="submit"] {
	background: var(--bc-primary, #1b6fa3);
	border: 0;
	border-radius: var(--bc-radius, 10px);
	color: #fff;
	cursor: pointer;
	font: inherit;
	font-weight: 600;
	min-height: 44px;
	padding: 0 20px;
}

.hb-accom-listing-actions-wrapper .hb-listing-view-accom input[type="submit"] {
	background: transparent;
	box-shadow: inset 0 0 0 1px var(--bc-line, #d7e0e6);
	color: var(--bc-text, #1d2a33);
}

.hb-accom-listing-item.bc-listing-open {
	border-color: var(--bc-primary, #1b6fa3);
}

.hb-accom-listing-desc h1,
.hb-accom-listing-desc h2,
.hb-accom-listing-desc h3,
.hb-accom-listing-desc h4 {
	color: var(--bc-text, #1d2a33);
	font-family: inherit;
	font-size: 1.3em;
	font-weight: 650;
	letter-spacing: -.01em;
	line-height: 1.25;
	margin: 0 0 .4em;
}

.hb-accom-listing-desc h1 a,
.hb-accom-listing-desc h2 a,
.hb-accom-listing-desc h3 a,
.hb-accom-listing-desc h4 a {
	color: inherit;
	text-decoration: none;
}

.hb-accom-listing-desc small {
	color: var(--bc-accent, #c11222);
	font-size: .95em;
	font-weight: 650;
}
