/**
 * Altelis - 25/09/2026 - habillage de la pop-in d information (modale #info).
 * Ticket Zammad 5037796.
 *
 * Le theme parent Dude-More habille cette modale avec ses couleurs par defaut
 * (bandeau #5d9cec bleu, bouton de fermeture #463c6c violet), qui ne sont pas
 * celles du site. On reprend ici la palette de l hotel :
 *   #dc914f  couleur principale (bandeau du haut, pied de page, boutons)
 *   #ffaf4f  couleur d action (Reserver, Accepter)
 *
 * On corrige aussi la position du bouton de fermeture. Le theme lui applique
 * "left: 0 !important" tout en lui donnant "right: 0" : l element s etire donc
 * sur toute la largeur (712 px pour une modale de 700) au lieu d etre une
 * croix dans le coin, et il deborde de 16 px sur la droite.
 *
 * DEUX POINTS A SAVOIR POUR MODIFIER CE FICHIER :
 *  - le theme cible ces elements avec ".modal#info ..." ; un simple
 *    "#info ..." est MOINS specifique et serait ignore. On garde donc la
 *    meme forme de selecteur, et c est l ordre de chargement (cette feuille
 *    est chargee apres) qui nous fait gagner ;
 *  - "left" et "top" du bouton sont poses en !important par le theme, il faut
 *    donc les surcharger en !important aussi. Rien d autre n en a besoin.
 *
 * Tout est limite a #info pour ne pas toucher aux autres modales du theme
 * (reservation, menu, cookies), qui partagent la classe .close-button.
 *
 * Ce fichier est charge par le theme enfant ; ni le theme parent ni la feuille
 * compilee styles/style.min.css ne sont modifies.
 */

/* --- Bouton de fermeture : une vraie croix dans le coin haut droit --- */

.modal#info .close-button {
	/* !important obligatoire : le theme force left et top de la meme facon. */
	left: auto !important;
	top: 14px !important;

	right: 14px;
	bottom: auto;

	width: 34px;
	height: 34px;
	padding: 0;

	font-size: 15px;
	line-height: 34px;
	text-align: center;

	background-color: #ffffff;
	color: #dc914f;
	border-radius: 50%;

	cursor: pointer;
	z-index: 10;

	-webkit-transition: background-color .2s ease, color .2s ease;
	transition: background-color .2s ease, color .2s ease;
}

.modal#info .close-button:hover,
.modal#info .close-button:focus {
	background-color: #dc914f;
	color: #ffffff;
	outline: none;
}

/* --- Bandeau du haut aux couleurs de l hotel --- */

.modal#info .message-box__header {
	background: #dc914f;
}

/*
 * La surcouche sombre du theme sert a garder le texte lisible quand une photo
 * est renseignee dans le champ ACF "Photo". Sans photo elle ne fait
 * qu assombrir la couleur de marque, on la neutralise donc dans ce seul cas.
 * Les navigateurs sans :has() conservent le comportement d origine.
 */
.modal#info .message-box__header:not(:has(img)) .message-box__overlay {
	background: transparent;
}

/* --- Bouton optionnel du message, si le champ ACF "Bouton" est renseigne --- */

.modal#info .message-box__button {
	background-color: #dc914f;
	border-color: #dc914f;
	color: #ffffff;
}

.modal#info .message-box__button:hover,
.modal#info .message-box__button:focus {
	background-color: #ffaf4f;
	border-color: #ffaf4f;
	color: #ffffff;
}

/* --- Mobile : croix un peu plus proche du bord --- */

@media (max-width: 767px) {

	.modal#info .close-button {
		top: 10px !important;
		right: 10px;
		width: 32px;
		height: 32px;
		line-height: 32px;
	}
}