/* =========================================================================
   Luxoos — Ajustements de sections Brizy propres à certaines pages

   Les sections sont visées par l'identifiant que Brizy leur donne (stable,
   contrairement aux classes brz-css-xxxx) et par le numéro de la page quand
   le même bloc existe sur plusieurs pages. Si une page est recréée, ces
   identifiants changent : voir notes.md.
   ========================================================================= */

/* ---------------------------------------------- Cartes « établissements »
   Accueil : « Des hôtels étoilés dorment déjà dessus »
   Hôtellerie & Gîtes : « Des établissements qui dorment déjà en Luxoos » */

@media (max-width: 767px) {

	/* La photo dépassait de son bloc, d'une hauteur différente d'une carte à
	   l'autre : bloc et photo ont maintenant la même hauteur fixe. */
	:is(#u8pEymdYTGps_u8pEymdYTGps, [data-brz-id="u8pEymdYTGps_u8pEymdYTGps"]) .brz-wrapper:has(> .brz-image):has(+ .brz-row__container),
	#mgHjNLkfTCJO_mgHjNLkfTCJO .brz-wrapper:has(> .brz-image):has(+ .brz-row__container) {
		flex: 0 0 auto !important;
		height: 210px !important;
		margin-bottom: 0 !important;
	}

	/* L'étiquette blanche remonte de 20 px sur la photo, comme sur ordinateur. */
	:is(#u8pEymdYTGps_u8pEymdYTGps, [data-brz-id="u8pEymdYTGps_u8pEymdYTGps"]) .brz-wrapper:has(> .brz-image) + .brz-row__container,
	#mgHjNLkfTCJO_mgHjNLkfTCJO .brz-wrapper:has(> .brz-image) + .brz-row__container {
		position: relative;
		z-index: 2;
		margin-top: -20px !important;
	}

	/* Même hauteur pour toutes les photos, recadrées plutôt que déformées. */
	:is(#u8pEymdYTGps_u8pEymdYTGps, [data-brz-id="u8pEymdYTGps_u8pEymdYTGps"]) .brz-wrapper:has(+ .brz-row__container) > .brz-image,
	#mgHjNLkfTCJO_mgHjNLkfTCJO .brz-wrapper:has(+ .brz-row__container) > .brz-image {
		width: 100% !important;
		max-width: none !important;
		height: 210px !important;
		margin: 0 !important;
	}

	:is(#u8pEymdYTGps_u8pEymdYTGps, [data-brz-id="u8pEymdYTGps_u8pEymdYTGps"]) .brz-wrapper:has(+ .brz-row__container) > .brz-image .brz-picture,
	#mgHjNLkfTCJO_mgHjNLkfTCJO .brz-wrapper:has(+ .brz-row__container) > .brz-image .brz-picture {
		height: 210px !important;
		padding-top: 0 !important;
	}

	:is(#u8pEymdYTGps_u8pEymdYTGps, [data-brz-id="u8pEymdYTGps_u8pEymdYTGps"]) .brz-wrapper:has(+ .brz-row__container) > .brz-image .brz-picture > .brz-img,
	#mgHjNLkfTCJO_mgHjNLkfTCJO .brz-wrapper:has(+ .brz-row__container) > .brz-image .brz-picture > .brz-img {
		position: absolute !important;
		top: 0 !important;
		left: 0 !important;
		width: 100% !important;
		height: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		object-fit: cover;
	}

	/* Hôtellerie & Gîtes : étiquette comme sur l'accueil (texte centré, en
	   retrait des bords). */
	#mgHjNLkfTCJO_mgHjNLkfTCJO .brz-wrapper:has(> .brz-image) + .brz-row__container .brz-column__items {
		padding: 4px 16px !important;
	}

	#mgHjNLkfTCJO_mgHjNLkfTCJO .brz-wrapper:has(> .brz-image) + .brz-row__container .brz-rich-text :is(p, h4, h5, h6) {
		text-align: center !important;
	}

	#mgHjNLkfTCJO_mgHjNLkfTCJO .brz-wrapper:has(> .brz-image) + .brz-row__container .brz-wrapper {
		margin-top: 6px !important;
		margin-bottom: 6px !important;
	}
}

/* ------------------------------------------------------------ Page Matelas */

/* Haut de page (titre, filtres, grille) : la section fait toute la hauteur
   de l'écran et son contenu était calé en bas. Quand un filtre masquait des
   cartes, le titre et les filtres descendaient. Contenu calé en haut. */
body.page-id-264 #jib2vzKUX7sK_jib2vzKUX7sK > .brz-section__content > .brz-container {
	justify-content: flex-start !important;
}

body.page-id-264 #jib2vzKUX7sK_jib2vzKUX7sK > .brz-section__content {
	justify-content: flex-start !important;
	min-height: min(100vh, 860px) !important;
}

/* Section « Testés en laboratoire… » (photo de matelas en fond, au-dessus de
   « Vos questions ») : sa hauteur suivait celle de l'écran (98 %), d'où un
   grand vide sous le texte sur les écrans hauts. Elle suit maintenant la
   largeur, pour garder le même cadrage de la photo. */
body.page-id-264 #noCFGjlN6vSI_noCFGjlN6vSI > .brz-section__content {
	min-height: min(98vh, 46vw, 900px) !important;
}

/* ----------------------------- Hauts de page Sur-matelas (820) et Sommier (806)
   La mise en page est faite dans Brizy (rangée à deux colonnes). Seule la
   taille du titre est corrigée ici sur tablette : le « Titre 1 » global de
   Brizy y monte à 58 px, trop grand pour une demi-largeur. */
@media (max-width: 991px) and (min-width: 768px) {
	body.page-id-820 #jib2vzKUX7sK_jib2vzKUX7sK .brz-rich-text h1,
	body.page-id-806 #jib2vzKUX7sK_jib2vzKUX7sK .brz-rich-text h1 {
		font-size: 34px !important;
		line-height: 1.15 !important;
	}
}

/* Jointure avec la section produits (#eee) : le bas du haut de page se fond
   dans sa couleur, on ne voit plus la limite entre les deux sections.
   Brizy n'accepte qu'un calque par section (déjà pris par le dégradé
   horizontal sur la page Sommier), d'où ce fondu en CSS. */
body.page-id-820 #jib2vzKUX7sK_jib2vzKUX7sK > .brz-section__content::after,
body.page-id-806 #jib2vzKUX7sK_jib2vzKUX7sK > .brz-section__content::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	height: 130px;
	background: linear-gradient(to top, #eee 0%, rgba(238, 238, 238, 0.85) 30%, rgba(238, 238, 238, 0) 100%);
	pointer-events: none;
}

body.page-id-820 #jib2vzKUX7sK_jib2vzKUX7sK > .brz-section__content::after {
	height: 170px;
}

/* Le texte et l'image restent au-dessus du fondu. */
body.page-id-820 #jib2vzKUX7sK_jib2vzKUX7sK > .brz-section__content > .brz-container,
body.page-id-806 #jib2vzKUX7sK_jib2vzKUX7sK > .brz-section__content > .brz-container {
	position: relative;
	z-index: 2;
}

/* ------------------------------------ Où essayer (333) : « Nos sept points d'essai »
   Le shortcode [luxoos_revendeurs class="lux-dealers--bg"] posait une bande
   bleu foncé. Sur cette page, le fond est le bleu clair de la zone du dessus
   (#e0e9ee, déjà celui de la section Brizy) et la forme blanche déborde sur
   les deux zones voisines (maquette du 2026-10-13). */
body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj {
	position: relative;
	z-index: 2;
}

body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .brz-wrapper {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .brz-wp-shortcode,
body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .brz-wp-shortcode > div {
	width: 100%;
}

body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .lux-dealers--bg {
	padding: 0 clamp(0.5rem, 1.75vw, 1.5rem);
	/* Le bleu clair vient du fond de la section Brizy : un fond ici suivrait
	   la forme blanche et recouvrirait les zones voisines. */
	background: transparent;
}

body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .lux-dealers__card {
	position: relative;
	box-shadow: 0 24px 60px rgba(18, 58, 86, 0.14);
}

/* Débordement sur ordinateur seulement : en dessous, les zones voisines
   commencent ou finissent par du texte. */
@media (min-width: 992px) {
	body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .brz-wrapper {
		margin-top: -28px !important;
		margin-bottom: -36px !important;
	}
}

/* Au-dessus de 1100 px la forme blanche a ses grands arrondis : pour que le
   coin bas gauche de la photo du dessus ne ressorte pas à côté de l'arrondi,
   la forme doit remonter de 125 à 140 px selon la largeur (62 px à partir de
   1600 px, où elle est centrée et plus étroite que l'écran). */
@media (min-width: 1101px) {
	body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .brz-wrapper {
		margin-top: -140px !important;
	}

	/* Zone du dessus, rangée photo + texte (ucdasT2Zbf2a) : la photo reste
	   posée sur le bas de la zone, quelle que soit la hauteur du texte. */
	body.page-id-333 #tzExQ2Jc5sH3_tzExQ2Jc5sH3 [data-brz-custom-id="bzQjmQlZiF68"] > .brz-column__items {
		justify-content: flex-end !important;
	}
}

/* Le texte de droite garde sa marge au-dessus de la forme remontée. */
@media (min-width: 1101px) and (max-width: 1599px) {
	body.page-id-333 #tzExQ2Jc5sH3_tzExQ2Jc5sH3 [data-brz-custom-id="cp4Wf450ThdO"] > .brz-column__items {
		padding-bottom: 72px !important;
	}
}

@media (min-width: 1600px) {
	body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .brz-wrapper {
		margin-top: -80px !important;
	}
}

/* Entre 992 et 1100 px, la photo est elle aussi posée sur le bas de la zone
   (elle flottait au milieu de sa colonne, loin de la forme). */
@media (min-width: 992px) and (max-width: 1100px) {
	body.page-id-333 #tzExQ2Jc5sH3_tzExQ2Jc5sH3 [data-brz-custom-id="bzQjmQlZiF68"] > .brz-column__items {
		justify-content: flex-end !important;
	}
}

/* Tablette et mobile : la photo est le dernier élément de la zone du dessus,
   la forme remonte dessus (40 px, 28 px sur mobile) et descend dans la marge
   haute de la zone du dessous, sans atteindre son titre. Les marges tiennent
   compte de la marge intérieure de la section (50 px, 25 px) et de l'espace
   laissé sous la photo (65 px, 45 px). */
@media (max-width: 991px) and (min-width: 768px) {
	body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .brz-wrapper {
		margin-top: -155px !important;
		margin-bottom: -80px !important;
	}
}

@media (max-width: 767px) {
	body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .brz-wrapper {
		margin-top: -98px !important;
		margin-bottom: -45px !important;
	}

	/* La forme prend la largeur de la photo, qui dépassait de chaque côté. */
	body.page-id-333 #c6nlnJwssHFj_c6nlnJwssHFj .lux-dealers--bg {
		padding: 0;
	}
}

/* ------------------------------------------------- Arrivée sur une ancre
   L'en-tête est fixe (sticky) : sans marge, le haut de la section visée
   (#accessoires, #sommiers-tetes-de-lit, #technologie…) passe dessous. */

.brz-section[id] {
	scroll-margin-top: 140px;
}

@media (max-width: 991px) {
	.brz-section[id] {
		scroll-margin-top: 115px;
	}
}

/* -------------------------------------------------------------------------
 * Retours client 2026-11
 * ---------------------------------------------------------------------- */

/* Rangée de cartes ajoutée (établissements) : centrée quand elle est incomplète. */
.lux-row-center {
	margin-top: 24px;
}

.lux-row-center > .brz-row {
	justify-content: center;
}

/* Emplacement d'image vide, à remplir par la graphiste (visible tant qu'il n'y a pas d'image). */
.lux-img-todo {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	aspect-ratio: 263 / 175;
	padding: 1rem 1rem 2.25rem;
	text-align: center;
	font-size: 0.8rem;
	font-weight: 600;
	line-height: 1.4;
	color: #8a6a12;
	background: repeating-linear-gradient(45deg, #fbf3dc, #fbf3dc 12px, #f4e7bf 12px, #f4e7bf 24px);
	border: 2px dashed #c8981c;
	border-radius: 12px;
}

/* Filtres de /sur-matelas-accessoires/ (assets/js/accessoires-filtres.js), 2026-11. */
.lux-acc-filters {
	width: 100%;
	margin-bottom: clamp(1.5rem, 3vw, 2.5rem) !important;
}

.lux-acc-filters .lux-products__filters {
	gap: 0.5rem;
	margin-bottom: 0;
}

.lux-acc-status {
	min-height: 1.5em;
	margin: 0;
	text-align: center;
	font-size: 0.85rem;
	color: var(--lux-prd-muted, #4d6577);
}

.lux-acc-hidden {
	display: none !important;
}

.lux-acc-row--filtered {
	justify-content: center;
}