/* Rigaux Booking — widget public. */

.rb-widget {
	--rb-accent: #2d4a35;
	--rb-accent-dark: #24402c;
	--rb-accent-light: #e8f0ec;
	--rb-star: #3d7a4b;
	--rb-booked: #d9d9d9;
	--rb-text: #1f2822;
	--rb-muted: #6f6f68;
	--rb-border: #efece6;
	--rb-radius: 12px;
	--rb-font-display: Georgia, 'Times New Roman', serif;
	color: var(--rb-text);
	font-size: 16px;
	line-height: 1.5;
	container-type: inline-size;
}

.rb-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
	gap: 0;
	align-items: start;
}

@media (max-width: 900px) {
	.rb-layout {
		grid-template-columns: 1fr;
	}
}

@media (min-width: 901px) {
	.rb-side {
		position: sticky;
		top: 24px;
	}
}

/* Le widget s'adapte à la largeur de SA colonne, pas à celle de l'écran :
   dans une colonne de contenu étroite, la carte passe sous le calendrier
   (les media queries ci-dessus restent en secours pour les navigateurs
   sans container queries). */

@container (max-width: 900px) {
	.rb-layout {
		grid-template-columns: 1fr;
	}

	.rb-side {
		position: static;
	}
}

/* Galerie */

.rb-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 8px;
	margin-bottom: 24px;
}

.rb-gallery__item {
	margin: 0;
	border-radius: var(--rb-radius);
	overflow: hidden;
}

.rb-gallery__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* En-tête logement */

.rb-housing-meta__name {
	margin: 0 0 4px;
}

.rb-housing-meta__caps {
	color: var(--rb-muted);
	margin: 0 0 24px;
}

/* Neutralise les styles que les thèmes imposent aux <button>
   (bordures, ombres, transformations) dans le widget. */

.rb-widget .rb-calendar button,
.rb-widget .rb-card__dates button {
	-webkit-appearance: none;
	appearance: none;
	box-shadow: none;
	text-shadow: none;
	text-transform: none;
	letter-spacing: normal;
	min-height: 0;
	min-width: 0;
	margin: 0;
}

/* Calendrier */

.rb-calendar {
	position: relative;
}

.rb-calendar__nav {
	position: absolute;
	top: 0;
	right: 0;
	display: flex;
	gap: 8px;
	z-index: 2;
}

.rb-widget .rb-calendar__prev,
.rb-widget .rb-calendar__next {
	width: 36px;
	height: 36px;
	border: 1px solid var(--rb-border);
	border-radius: 50%;
	background: #fff;
	color: var(--rb-text);
	font-size: 18px;
	line-height: 1;
	padding: 0;
	cursor: pointer;
	transition: background 0.15s;
}

.rb-widget .rb-calendar__prev:hover,
.rb-widget .rb-calendar__next:hover,
.rb-widget .rb-calendar__prev:focus,
.rb-widget .rb-calendar__next:focus {
	background: var(--rb-accent-light) !important;
	color: var(--rb-text) !important;
	outline: none;
}

.rb-calendar__months {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	touch-action: pan-y;
}

@media (max-width: 640px) {
	.rb-calendar__months {
		grid-template-columns: 1fr;
	}
}

@container (max-width: 640px) {
	.rb-calendar__months {
		grid-template-columns: 1fr;
	}
}

.rb-month__title {
	font-weight: 600;
	margin-bottom: 12px;
}

.rb-month__grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 2px;
}

.rb-widget .rb-day {
	position: relative;
	aspect-ratio: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	border: none;
	background: none;
	border-radius: 8px;
	color: var(--rb-text);
	font: inherit;
	font-size: 14px;
	cursor: pointer;
	padding: 2px;
}

.rb-widget .rb-day--head {
	aspect-ratio: auto;
	cursor: default;
	color: var(--rb-muted);
	font-size: 12px;
	padding: 4px 0;
}

.rb-widget .rb-day--empty {
	cursor: default;
}

.rb-widget .rb-day__price {
	font-size: 10px;
	color: var(--rb-muted);
}

/* États interactifs en !important : les kits Elementor stylent
   button:hover/:focus (rose…) et se chargent après cette feuille. */

.rb-widget .rb-day:not(:disabled):hover,
.rb-widget .rb-day:not(:disabled):focus,
.rb-widget .rb-day:not(:disabled):active {
	background: var(--rb-accent-light) !important;
	color: var(--rb-text) !important;
	outline: none;
}

.rb-widget .rb-day:disabled {
	cursor: not-allowed;
	color: #c8c4ba;
	background: none !important;
}

.rb-widget .rb-day--head,
.rb-widget .rb-day--empty {
	cursor: default;
}

/* Jours déjà réservés (site, manuel ou Airbnb importé) : grisés + barrés. */

.rb-widget .rb-day--booked,
.rb-widget .rb-day--booked:disabled {
	background: #f3f1ea !important;
}

.rb-widget .rb-day--booked .rb-day__num {
	text-decoration: line-through;
	color: #b3afa5;
}

/* Nuits hors période d'ouverture (lodges fermés l'hiver) : hachures légères,
   sans barré — la nuit n'est pas prise, le logement est simplement fermé. */

.rb-widget .rb-day--closed,
.rb-widget .rb-day--closed:disabled {
	background: repeating-linear-gradient(
		135deg,
		#faf8f3,
		#faf8f3 4px,
		#efece4 4px,
		#efece4 8px
	) !important;
	color: #b3afa5;
}

.rb-widget .rb-day--checkout-only:not(:disabled)::after,
.rb-widget .rb-day--checkin-only::after {
	content: '';
	position: absolute;
	bottom: 3px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--rb-accent);
	opacity: 0.5;
}

/* Sélection : déclarée après les états hover/focus pour rester verte
   même survolée (à priorité égale, la dernière règle gagne). */

.rb-widget .rb-day--range {
	background: var(--rb-accent-light) !important;
	border-radius: 0;
}

.rb-widget .rb-day--start,
.rb-widget .rb-day--end {
	background: var(--rb-accent) !important;
	color: #fff !important;
}

.rb-widget .rb-day--start .rb-day__price,
.rb-widget .rb-day--end .rb-day__price {
	color: rgba(255, 255, 255, 0.8);
}

.rb-calendar__hint {
	color: var(--rb-muted);
	font-size: 14px;
	margin-top: 12px;
	min-height: 1.5em;
}

/* --------------------------------------------------------------------
 * Carte de réservation
 * ------------------------------------------------------------------ */

/* La carte est nue : le cadre (fond, ombre) vient du bloc de la page. */

.rb-card__season {
	margin: 0;
	font-size: 12px;
	letter-spacing: 0.06em;
	color: var(--rb-muted);
	min-height: 1.2em;
}

.rb-card__price {
	margin: 2px 0 6px;
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.rb-card__amount {
	font-family: var(--rb-font-display);
	font-weight: 400;
	font-size: 42px;
	line-height: 1.05;
	color: var(--rb-text);
}

.rb-card__per-night {
	color: var(--rb-muted);
	font-size: 15px;
}

.rb-card__rating {
	margin: 0 0 4px;
	font-size: 14px;
	display: flex;
	align-items: center;
	gap: 7px;
}

.rb-card__stars {
	color: var(--rb-star);
	letter-spacing: 2px;
	font-size: 15px;
}

.rb-card__rating-value {
	font-weight: 600;
}

.rb-card__rating-count {
	color: var(--rb-muted);
}

/* Période d'ouverture du logement, affichée sous le prix. */

.rb-card__open {
	margin: 0 0 4px;
	font-size: 13px;
	color: var(--rb-muted);
}

/* Faux champs dates : reflètent la sélection du calendrier. Le bloc
   forme un seul cadre avec la box Voyageurs qui le suit (coins bas
   ouverts ici, refermés sur la box) — maquette client. */

.rb-widget .rb-card__dates-wrap {
	position: relative;
	margin: 16px 0 0;
}

.rb-card__dates {
	display: grid;
	grid-template-columns: 1fr 1fr;
	border: 1px solid var(--rb-border);
	border-radius: var(--rb-radius) var(--rb-radius) 0 0;
	overflow: hidden;
	margin: 0;
}

.rb-widget .rb-card__date {
	display: flex;
	flex-direction: column;
	gap: 3px;
	background: none;
	border: none;
	border-radius: 0;
	color: var(--rb-text);
	font: inherit;
	text-align: left;
	padding: 12px 14px;
	cursor: pointer;
	transition: background 0.15s;
}

.rb-widget .rb-card__date + .rb-card__date {
	border-left: 1px solid var(--rb-border);
}

/* Tous les états couverts : sans règle :focus explicite, le rose du
   thème s'appliquait après le clic (le bouton reste focusé). */

.rb-widget .rb-card__date:hover,
.rb-widget .rb-card__date:focus,
.rb-widget .rb-card__date:active,
.rb-widget .rb-card__date[aria-expanded="true"] {
	background: #faf8f3 !important;
	color: var(--rb-text) !important;
	outline: none;
}

.rb-widget .rb-card__date:hover .rb-card__date-label,
.rb-widget .rb-card__date:focus .rb-card__date-label,
.rb-widget .rb-card__date[aria-expanded="true"] .rb-card__date-label {
	color: var(--rb-muted);
}

.rb-widget .rb-card__date-label,
.rb-widget .rb-form .forminator-label,
.rb-widget .rb-form label:not(.rb-option-row):not(.forminator-checkbox) {
	display: block;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--rb-muted);
}

.rb-widget .rb-card__date-value {
	font-size: 15px;
	color: var(--rb-text);
}

/* Popover calendrier : ancré sous les champs de dates. Container à part
   entière : le calendrier s'y replie en 1 mois par ligne. */

.rb-widget .rb-popover {
	position: absolute;
	top: calc(100% + 8px);
	left: 0;
	right: 0;
	z-index: 50;
	background: #fff;
	border: 1px solid var(--rb-border);
	border-radius: var(--rb-radius);
	box-shadow: 0 18px 44px rgba(31, 40, 34, 0.18);
	padding: 18px;
	max-height: min(70vh, 560px);
	overflow-y: auto;
	container-type: inline-size;
}

.rb-widget .rb-popover[hidden] {
	display: none;
}

/* Formulaire Forminator embarqué (régler son Design sur « None »).
   Collé au bloc dates : sa première rangée (Voyageurs) le prolonge. */

.rb-form {
	margin-top: 0;
}

/* Alerte de refus recopiée par le script depuis les rangées sans champ
   visible (voir mirrorHiddenErrors). Posée en tête de formulaire, elle est
   le seul endroit où le visiteur peut lire pourquoi sa réservation part en
   erreur. */

.rb-widget .rb-form-alert {
	margin: 0 0 14px;
	padding: 10px 14px;
	border: 1px solid #e8bfbd;
	border-radius: 10px;
	background: #fdf3f2;
	color: #8a2c26;
	font-size: 14px;
	line-height: 1.45;
}

/* Jamais de boîte dans la boîte : le conteneur Forminator est mis à nu
   (fond, ombre, bordure, padding), quel que soit son design. */

.rb-widget .rb-form .forminator-custom-form,
.rb-widget .rb-form .forminator-ui,
.rb-widget .rb-form form {
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
	max-width: none !important;
}

.rb-widget .rb-form .forminator-row {
	margin-bottom: 14px;
}

/* Formulaire en étapes (sauts de page Forminator) : conteneurs de page
   à plat, en-tête d'étapes masqué (la carte tient lieu de fil
   conducteur, comme sur la maquette). */

.rb-widget .rb-form .forminator-pagination,
.rb-widget .rb-form .forminator-pagination--content {
	margin: 0 !important;
	padding: 0 !important;
}

.rb-widget .rb-form .forminator-pagination-steps,
.rb-widget .rb-form .forminator-pagination-progress {
	display: none !important;
}

/* Rangées ne contenant que des champs cachés (logement, dates, total) :
   retirées du flux, elles creuseraient un trou entre les blocs.

   Exception : une rangée qui porte un message d'erreur reste visible. Les
   refus de soumission du plugin (dates prises entre-temps, période fermée,
   minimum de nuits, jour d'arrivée imposé, montant altéré) sont attachés au
   champ caché « date d'arrivée » : masqués, ils laisseraient le visiteur
   devant un formulaire qui refuse sans dire pourquoi. */

.rb-widget .rb-form .forminator-row:has(input[type="hidden"]):not(:has(input:not([type="hidden"]), select, textarea, button)):not(:has([class*="stripe"], [name^="stripe"], iframe)):not(:has(.forminator-error-message:not(:empty))) {
	display: none;
}

/* Message d'erreur porté par une rangée de champs cachés : rien d'autre n'y
   est visible, il tient donc lieu de bloc à lui seul. */

.rb-widget .rb-form .forminator-row:has(input[type="hidden"]):not(:has(input:not([type="hidden"]), select, textarea, button)) .forminator-error-message:not(:empty) {
	display: block;
	margin: 0 0 14px;
	padding: 10px 14px;
	border: 1px solid #e8bfbd;
	border-radius: 10px;
	background: #fdf3f2;
	font-size: 14px;
}

/* Le champ Stripe (Payment Element / OCS) se rend dans un iframe, sans
   input visible : la règle ci-dessus l'aurait masqué comme une rangée de
   champs cachés. Exclu ci-dessus ; on lui redonne l'espace qui le sépare
   de la carte dates/voyageurs (il est le premier élément visible de
   l'étape paiement). */
.rb-widget .rb-form .forminator-row:has([class*="stripe"]) {
	margin-top: 24px;
}

.rb-widget .rb-form input[type="text"],
.rb-widget .rb-form input[type="email"],
.rb-widget .rb-form input[type="tel"],
.rb-widget .rb-form input[type="number"],
.rb-widget .rb-form select,
.rb-widget .rb-form textarea {
	width: 100%;
	border: 1px solid var(--rb-border);
	border-radius: 10px;
	background: #fff;
	color: var(--rb-text);
	font: inherit;
	font-size: 15px;
	padding: 10px 14px;
	box-shadow: none;
}

.rb-widget .rb-form input:focus,
.rb-widget .rb-form select:focus,
.rb-widget .rb-form textarea:focus {
	outline: none;
	border-color: var(--rb-accent);
	box-shadow: 0 0 0 3px var(--rb-accent-light);
}

/* Voyageurs (champs nombre) : prolonge le bloc dates dans le même cadre
   (la bordure basse des dates sert de séparateur horizontal), Adultes et
   Enfants côte à côte avec un séparateur vertical (le JS fusionne leurs
   rangées Forminator et les coiffe d'un titre « Voyageurs »). */

.rb-widget .rb-form .forminator-row:has(input[type="number"]) {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 18px;
	border: 1px solid var(--rb-border);
	border-top: none;
	border-radius: 0 0 var(--rb-radius) var(--rb-radius);
	padding: 12px 16px;
	margin-bottom: 20px;
}

.rb-widget .rb-form .rb-box-label {
	grid-column: 1 / -1;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--rb-muted);
	padding-bottom: 4px;
}

/* Formulaire en étapes : dès que l'écran des voyageurs est replié
   (étape 2, 3…), le bloc dates redevient une carte autonome. */

.rb-widget:has(.forminator-pagination[data-step="0"] .forminator-pagination--content[style*="display: none"]) .rb-card__dates,
.rb-widget:has(.forminator-pagination[data-step="0"] .forminator-pagination--content[style*="display:none"]) .rb-card__dates {
	border-radius: var(--rb-radius);
}

.rb-widget .rb-form .forminator-row:has(input[type="number"]) > .forminator-col {
	margin: 0;
	padding: 0;
	width: auto;
	float: none;
}

.rb-widget .rb-form .forminator-row:has(input[type="number"]) > .forminator-col + .forminator-col {
	border-left: 1px solid var(--rb-border);
	padding-left: 18px;
}

.rb-widget .rb-form .forminator-row:has(input[type="number"]) input[type="number"] {
	border: none;
	border-radius: 0;
	padding: 2px 0;
}

/* Options : box bordée (classe posée par le JS sur la rangée Forminator,
   après fusion d'éventuelles rangées multiples), chaque ligne = case +
   libellé + prix à droite. */

.rb-widget .rb-form .rb-options-box {
	border: 1px solid var(--rb-border);
	border-radius: var(--rb-radius);
	padding: 12px 16px;
}

.rb-widget .rb-form .rb-options-box .forminator-col,
.rb-widget .rb-form .rb-options-box .forminator-field {
	margin: 0;
	padding: 0;
	width: auto;
	float: none;
}

.rb-widget .rb-form .rb-option-row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 4px 0;
	font-size: 15px;
	text-transform: none;
	letter-spacing: normal;
	font-weight: 400;
	color: var(--rb-text);
}

.rb-widget .rb-form .rb-option-row input[type="checkbox"] {
	width: 17px;
	height: 17px;
	margin: 0;
	accent-color: var(--rb-accent);
	flex: none;
}

.rb-option-price {
	margin-left: auto;
	color: var(--rb-muted);
}

/* Boutons Forminator : pilule. Pas de display forcé sur la règle
   générique : la pagination Forminator cache/montre ses boutons via la
   classe forminator-hidden et des styles inline (le bouton submit
   « stock » de la pagination reste toujours masqué — c'est le bouton
   Suivant qui se transforme en Réserver à la dernière étape). */

.rb-widget .rb-form .forminator-button,
.rb-widget .rb-form button[type="submit"],
.rb-widget .rb-form input[type="submit"] {
	border: none !important;
	border-radius: 999px !important;
	background: var(--rb-accent) !important;
	color: #fff !important;
	font: inherit !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	padding: 14px 24px !important;
	box-shadow: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	cursor: pointer;
	transition: background 0.15s;
}

.rb-widget .rb-form .forminator-button:hover,
.rb-widget .rb-form .forminator-button:focus,
.rb-widget .rb-form .forminator-button:active,
.rb-widget .rb-form button[type="submit"]:hover,
.rb-widget .rb-form button[type="submit"]:focus,
.rb-widget .rb-form input[type="submit"]:hover,
.rb-widget .rb-form input[type="submit"]:focus {
	background: var(--rb-accent-dark) !important;
	color: #fff !important;
	outline: none;
}

/* Formulaire en une seule étape : le bouton Réserver seul, pleine
   largeur. */

.rb-widget .rb-form .forminator-button-submit:not(.forminator-pagination-submit),
.rb-widget .rb-form button[type="submit"]:not(.forminator-pagination-submit),
.rb-widget .rb-form input[type="submit"] {
	display: block !important;
	width: 100% !important;
	margin-top: 6px !important;
}

/* Pied de pagination : Précédent (contour) discret, Suivant / Réserver
   étiré sur l'espace restant. Déclaré après la règle pleine largeur :
   à la dernière étape, le bouton Suivant devient forminator-button-submit
   tout en restant dans ce pied. */

.rb-widget .rb-form .forminator-pagination-footer {
	display: flex !important;
	gap: 10px;
	margin-top: 6px;
}

.rb-widget .rb-form .forminator-pagination-footer .forminator-button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: auto !important;
	flex: 1 1 auto;
	margin: 0 !important;
}

.rb-widget .rb-form .forminator-pagination-footer .forminator-button-back {
	flex: 0 0 auto;
	background: #fff !important;
	color: var(--rb-accent) !important;
	border: 1px solid var(--rb-accent) !important;
}

.rb-widget .rb-form .forminator-pagination-footer .forminator-button-back:hover,
.rb-widget .rb-form .forminator-pagination-footer .forminator-button-back:focus {
	background: var(--rb-accent-light) !important;
	color: var(--rb-accent) !important;
}

/* Les boutons masqués par Forminator le restent (Précédent à la première
   étape, bouton submit « stock » de la pagination). */

.rb-widget .rb-form .forminator-button.forminator-hidden,
.rb-widget .rb-form .forminator-pagination-submit {
	display: none !important;
}

.rb-widget .rb-form .forminator-error-message {
	color: #b3312c;
	font-size: 13px;
	margin-top: 4px;
}

.rb-widget .rb-form .forminator-response-message.forminator-error {
	color: #b3312c;
}

/* Résumé du séjour */

.rb-summary {
	border-top: 1px dashed var(--rb-border);
	margin-top: 18px;
	padding-top: 14px;
}

.rb-summary__dates {
	color: var(--rb-muted);
	font-size: 14px;
	margin-bottom: 10px;
}

.rb-summary__lines {
	list-style: none;
	margin: 0 0 10px;
	padding: 0;
	border-bottom: 1px solid #f0ede5;
}

.rb-summary__line {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 5px 0;
	font-size: 14px;
	color: var(--rb-muted);
}

.rb-summary__line span:last-child {
	color: var(--rb-text);
}

.rb-summary__total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-size: 16px;
	font-weight: 600;
}

.rb-summary__total small {
	font-weight: 400;
	font-size: 12px;
	color: var(--rb-muted);
}

.rb-summary__total strong {
	font-size: 19px;
}

/* Paiement en deux temps : montant débité aujourd'hui + rappel du solde */

.rb-summary__deposit {
	border-top: 1px solid #f0ede5;
	margin-top: 10px;
	padding-top: 10px;
}

.rb-summary__pay-now {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	font-size: 15px;
	font-weight: 600;
	color: var(--rb-accent);
}

.rb-summary__pay-now strong {
	font-size: 17px;
}

.rb-summary__balance-note {
	margin: 6px 0 0;
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--rb-muted);
}

/* Mobile et tablette (taille d'ÉCRAN, volontairement pas une container
   query) : champs Arrivée/Départ et Adultes/Enfants empilés, séparateur
   horizontal. Sur PC ils restent côte à côte, même dans une colonne
   étroite. Déclaré en fin de feuille : à priorité égale, ces règles
   gagnent. */

@media (max-width: 1024px) {
	.rb-card__dates {
		grid-template-columns: 1fr;
	}

	.rb-widget .rb-card__date + .rb-card__date {
		border-left: none;
		border-top: 1px solid var(--rb-border);
	}

	.rb-widget .rb-form .forminator-row:has(input[type="number"]) {
		grid-template-columns: 1fr;
		gap: 10px 0;
	}

	.rb-widget .rb-form .forminator-row:has(input[type="number"]) > .forminator-col + .forminator-col {
		border-left: none;
		padding-left: 0;
		border-top: 1px solid var(--rb-border);
		padding-top: 10px;
	}
}

/* Mention paiement */

.rb-card__secure {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin: 16px 0 0;
	font-size: 12px;
	color: var(--rb-muted);
}

.rb-card__lock {
	flex: none;
	opacity: 0.65;
}
