/* ==========================================================================
   Affichage mobile v2 (inc/mobile.php) — téléphones uniquement (< 768 px)
   Actif seulement quand <body> porte la classe .ad-mobile-v2 : aperçu réservé aux
   administrateurs, puis activation pour tous (Réglages > Général). Rien ici ne touche
   l'affichage tablette ou ordinateur ; supprimer ce fichier = retour à l'ancien rendu.
   ========================================================================== */

/* La barre inférieure est imprimée sur toutes les pages : sans style au-delà de 767 px, ses icônes
   s'afficheraient en pleine largeur sous le pied de page. */
@media (min-width: 768px) {
	.ad-barre-mobile { display: none; }
}

@media (max-width: 767px) {

	/* ---- Barre de navigation inférieure ------------------------------------------------- */
	body.ad-mobile-v2 { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
	.ad-barre-mobile {
		position: fixed;
		inset: auto 0 0;
		z-index: 9990;
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
		background: rgb(251 245 236 / 0.96);
		-webkit-backdrop-filter: blur(12px);
		backdrop-filter: blur(12px);
		border-top: 1px solid rgb(83 50 28 / 0.12);
		box-shadow: 0 -10px 30px -18px rgb(43 26 16 / 0.45);
	}
	.ad-barre-mobile a {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 3px;
		padding: 4px 2px;
		border-radius: 12px;
		color: var(--e-global-color-text, #3D2A1E);
		font-size: 0.6875rem;
		font-weight: 500;
		line-height: 1.1;
		text-decoration: none;
		-webkit-tap-highlight-color: transparent;
	}
	.ad-barre-mobile svg { width: 24px; height: 24px; }
	.ad-barre-mobile a[aria-current="page"] { color: var(--e-global-color-caramelf, #A95A17); font-weight: 700; }
	.ad-barre-mobile a[aria-current="page"] svg { transform: translateY(-1px); }
	.ad-barre-mobile a:focus-visible { outline: 2px solid var(--e-global-color-accent, #D47B2C); outline-offset: -2px; }
	/* Retour visuel à l'appui : pastille orange, gardée jusqu'au chargement de la page suivante
	   (classe .ad-barre-appui posée par inc/mobile.php). */
	.ad-barre-mobile a { transition: background-color 0.15s ease, color 0.15s ease, transform 0.15s ease; }
	.ad-barre-mobile a:active,
	.ad-barre-mobile a.ad-barre-appui {
		background-color: rgb(212 123 44 / 0.16);
		color: var(--e-global-color-caramelf, #A95A17);
		transform: scale(0.94);
	}
	@media (hover: hover) {
		.ad-barre-mobile a:hover { background-color: rgb(212 123 44 / 0.12); color: var(--e-global-color-caramelf, #A95A17); }
	}
	.ad-barre-mobile .ad-barre-pastille {
		position: absolute;
		top: 0;
		left: calc(50% + 6px);
		min-width: 18px;
		height: 18px;
		padding: 0 5px;
		border-radius: 9px;
		background: var(--e-global-color-accent, #D47B2C);
		color: var(--e-global-color-primary, #2B1A10);
		font-size: 0.6875rem;
		font-weight: 700;
		line-height: 18px;
		text-align: center;
	}
	.ad-barre-mobile .ad-barre-pastille[hidden] { display: none; }

	/* Les boutons flottants (retour en haut, choix des cookies) passent au-dessus de la barre. */
	body.ad-mobile-v2 .ad-haut { bottom: calc(76px + env(safe-area-inset-bottom)) !important; }
	body.ad-mobile-v2 .cky-btn-revisit-wrapper.cky-revisit-bottom-left {
		right: max(18px, env(safe-area-inset-right)) !important;
		bottom: calc(130px + env(safe-area-inset-bottom)) !important;
		width: 38px !important;
		height: 38px !important;
	}
	body.ad-mobile-v2 .cky-btn-revisit-wrapper .cky-btn-revisit img { width: 24px; height: 24px; }
	/* Le bandeau cookies s'affiche au-dessus de la barre. */
	body.ad-mobile-v2 .cky-consent-container { bottom: calc(64px + env(safe-area-inset-bottom)) !important; }

	/* ---- En-tête : logo + recherche + compte ---------------------------------------------- */
	body.ad-mobile-v2 #site-header .header-inner { padding-block: 10px; }
	body.ad-mobile-v2 #site-header .site-logo img { max-height: 44px; width: auto; }
	body.ad-mobile-v2 #site-header .site-navigation-toggle-holder,
	body.ad-mobile-v2 #site-header .site-navigation-dropdown { display: none !important; }
	body.ad-mobile-v2 #site-header .site-navigation { display: flex !important; margin-inline-start: auto; }
	body.ad-mobile-v2 #site-header .site-navigation ul.menu { display: flex !important; gap: 8px; }
	body.ad-mobile-v2 #site-header .site-navigation ul.menu > li:not(.menu-compte):not(.menu-recherche) { display: none !important; }
	body.ad-mobile-v2 #site-header .site-navigation ul.menu > li.menu-compte { margin-inline-start: 0 !important; }
	/* Champ de recherche : toute la largeur, sous l'en-tête. */
	body.ad-mobile-v2 #site-header .ad-recherche-panneau { top: calc(100% + 6px); left: 0; right: 0; width: auto; }
	body.ad-mobile-v2 #site-header .site-navigation .ad-recherche-bouton,
	body.ad-mobile-v2 #site-header .site-navigation ul.menu > li.menu-compte > a {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		border-radius: 50%;
		background-color: var(--ad-menu-survol, rgb(235 220 198 / 0.6));
	}

	/* ---- Typographie : titres et textes plus compacts ------------------------------------ */
	/* Classe répétée : le titre des bandeaux d'ouverture a une règle très précise dans autodistri.css. */
	body.ad-mobile-v2.ad-mobile-v2.ad-mobile-v2.ad-mobile-v2 .elementor .elementor-widget-heading h1.elementor-heading-title,
	body.ad-mobile-v2.ad-mobile-v2.ad-mobile-v2.ad-mobile-v2 .elementor .ad-bascule-panneau .elementor-widget-heading h2.elementor-heading-title { font-size: 1.9rem !important; line-height: 1.08 !important; }
	body.ad-mobile-v2 .elementor h2.elementor-heading-title { font-size: 1.6rem !important; line-height: 1.12 !important; }
	body.ad-mobile-v2 .ad-cta-final h2.elementor-heading-title { font-size: 1.75rem !important; }
	body.ad-mobile-v2 .elementor h3.elementor-heading-title { font-size: 1.1rem !important; line-height: 1.2 !important; }
	body.ad-mobile-v2 .elementor .elementor-widget-text-editor,
	body.ad-mobile-v2 .elementor .elementor-widget-text-editor p { font-size: 0.95rem !important; line-height: 1.5 !important; }
	body.ad-mobile-v2 .elementor .elementor-widget-text-editor p { margin-block-end: 0.6em; }
	/* Sections : moins de marges verticales. */
	body.ad-mobile-v2 .elementor > .e-con:not(.ad-hero-3d) {
		--padding-top: 44px !important;
		--padding-bottom: 44px !important;
		padding-top: 44px !important;
		padding-bottom: 44px !important;
	}

	/* ---- Défilement horizontal des cartes ------------------------------------------------- */
	body.ad-mobile-v2 :is(.ad-vitrine ul.products, .ad-etapes-express, .ad-zones-cartes, .ad-gamme-grille, .ad-avantages, .ad-criteres, .ad-metiers, .ad-offres, .ad-frise) {
		display: flex !important;
		flex-wrap: nowrap !important;
		flex-direction: row !important;
		gap: 12px !important;
		margin-inline: -16px !important;
		padding: 4px 16px 14px !important;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scroll-padding-inline: 16px;
		scrollbar-width: none;
	}
	body.ad-mobile-v2 :is(.ad-vitrine ul.products, .ad-etapes-express, .ad-zones-cartes, .ad-gamme-grille, .ad-avantages, .ad-criteres, .ad-metiers, .ad-offres, .ad-frise)::-webkit-scrollbar { display: none; }
	body.ad-mobile-v2 :is(.ad-vitrine ul.products > li, .ad-etapes-express > .ad-etape-express, .ad-zones-cartes > .ad-zone, .ad-gamme-grille > .ad-gamme-carte, .ad-avantages > .ad-avantage, .ad-criteres > .ad-critere, .ad-metiers > .ad-metier, .ad-offres > .ad-offre, .ad-frise > .ad-etape-histoire) {
		flex: 0 0 auto !important;
		scroll-snap-align: start;
		margin: 0 !important;
	}
	body.ad-mobile-v2 :is(.ad-avantages > .ad-avantage, .ad-criteres > .ad-critere, .ad-metiers > .ad-metier, .ad-frise > .ad-etape-histoire) { width: 70% !important; }
	body.ad-mobile-v2 .ad-offres > .ad-offre { width: 82% !important; }

	/* ---- Bandeaux d'ouverture des pages intérieures : hauteur selon le contenu ------------- */
	body.ad-mobile-v2 .ad-hero-page { min-height: 0 !important; --min-height: 0px !important; padding-top: 104px !important; padding-bottom: 36px !important; }
	body.ad-mobile-v2 .ad-hero-page > .e-con-inner { padding: 8px 0 0 !important; }

	/* ---- Accueil : bandeau d'ouverture ---------------------------------------------------- */
	body.ad-mobile-v2 .ad-hero-bascule { min-height: 0 !important; --min-height: 0px !important; padding-top: 96px !important; padding-bottom: 28px !important; }
	body.ad-mobile-v2 .ad-hero-bascule .ad-defiler-widget { display: none !important; }
	/* Bandeaux d'ouverture : un seul bouton, le principal. */
	body.ad-mobile-v2 .ad-hero-3d .elementor-widget-button + .elementor-widget-button { display: none !important; }
	body.ad-mobile-v2 .ad-hero-bascule .ad-bascule-onglets button { min-height: 38px; padding-block: 6px; font-size: 0.875rem; }

	/* ---- Accueil : sections masquées sur mobile (visibles sur ordinateur) ---------------- */
	body.ad-mobile-v2.home .elementor-element-9652f3f,
	body.ad-mobile-v2.home .elementor-element-31b91bf,
	body.ad-mobile-v2.home .ad-separateur-boutique { display: none !important; }

	/* ---- Vitrine boutique : filtres sur une ligne, cartes produits défilantes ------------ */
	body.ad-mobile-v2 .ad-section-vitrine { padding-top: 32px !important; }
	body.ad-mobile-v2 .ad-vitrine-barre {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center;
		gap: 10px;
		margin-bottom: 10px;
	}
	body.ad-mobile-v2 .ad-vitrine-onglets {
		display: flex !important;
		flex: 1 1 auto;
		flex-wrap: nowrap !important;
		gap: 6px !important;
		min-width: 0;
		overflow-x: auto;
		scrollbar-width: none;
	}
	body.ad-mobile-v2 .ad-vitrine-onglets::-webkit-scrollbar { display: none; }
	body.ad-mobile-v2 .ad-vitrine-onglets button {
		flex: none;
		min-height: 34px !important;
		padding: 6px 12px !important;
		font-size: 0.8125rem !important;
		white-space: nowrap;
	}
	body.ad-mobile-v2 .ad-vitrine-tout {
		flex: none;
		display: inline-flex !important;
		align-items: center;
		justify-content: flex-start !important;
		gap: 0 !important;
		width: auto !important;
		min-height: 0 !important;
		padding: 6px 2px !important;
		border: 0 !important;
		background: none !important;
		box-shadow: none !important;
		color: var(--e-global-color-caramelf, #A95A17) !important;
		font-size: 0 !important;
		white-space: nowrap;
	}
	body.ad-mobile-v2 .ad-vitrine-tout::before { content: "Tout voir"; font-size: 0.8125rem; font-weight: 700; }
	body.ad-mobile-v2 .ad-vitrine-tout span { font-size: 0.8125rem !important; margin-inline-start: 4px; }
	body.ad-mobile-v2 .ad-vitrine ul.products > li { width: 58% !important; max-width: 220px; }
	body.ad-mobile-v2 .ad-vitrine ul.products > li img { aspect-ratio: 1; object-fit: contain; max-height: 150px; }
	body.ad-mobile-v2 .ad-vitrine ul.products > li .woocommerce-loop-product__title { font-size: 0.95rem !important; line-height: 1.25 !important; }
	body.ad-mobile-v2 .ad-vitrine ul.products > li .button { min-height: 36px !important; padding: 8px 10px !important; font-size: 0.8125rem !important; }

	/* ---- Dépôt express : étapes défilantes, un seul bouton -------------------------------- */
	body.ad-mobile-v2 .ad-depot-express-entete .elementor-widget-text-editor { display: none !important; }
	/* Carte en grille : pictogramme et numéro sur la 1re ligne, le texte sur toute la largeur. */
	body.ad-mobile-v2 .ad-etapes-express > .ad-etape-express {
		width: 72% !important;
		min-height: 0 !important;
		grid-template-columns: auto 1fr !important;
		align-content: start !important;
		row-gap: 6px !important;
		padding: 16px !important;
	}
	body.ad-mobile-v2 .ad-etape-express .ad-etape-express-icone { grid-column: 1 !important; grid-row: 1 !important; }
	body.ad-mobile-v2 .ad-etape-express .ad-etape-express-num { grid-column: 2 !important; grid-row: 1 !important; justify-self: end; align-self: center; }
	body.ad-mobile-v2 .ad-etape-express > .elementor-widget { grid-column: 1 / -1 !important; }
	body.ad-mobile-v2 .ad-depot-express-actions .elementor-widget-button + .elementor-widget-button { display: none !important; }

	/* ---- Gamme de distributeurs : cartes plus petites, bloc « combiner » allégé ----------- */
	body.ad-mobile-v2 .ad-gamme-tete .elementor-widget-text-editor { display: none !important; }
	body.ad-mobile-v2 .ad-gamme-grille > .ad-gamme-carte { width: 66% !important; }
	body.ad-mobile-v2 .ad-gamme-visuel { height: 150px !important; min-height: 0 !important; }
	body.ad-mobile-v2 .ad-gamme-visuel img { max-height: 140px; width: auto; }
	body.ad-mobile-v2 :is(.ad-gamme-trio, .ad-gamme-formules, .ad-gamme-combo-texte .elementor-widget-text-editor:not(.ad-gamme-lien-secondaire)) { display: none !important; }
	/* « Comparer les formules » pointe vers la section des formules, masquée sur l'accueil mobile. */
	body.ad-mobile-v2.home .ad-gamme-lien-secondaire { display: none !important; }
	body.ad-mobile-v2 .ad-gamme-carte .elementor-widget-text-editor:not(.ad-gamme-lien) p {
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	/* ---- Zones : texte raccourci, cartes défilantes --------------------------------------- */
	body.ad-mobile-v2 .ad-zones-v3 .elementor-widget-text-editor p + p,
	body.ad-mobile-v2 .ad-zones-v3 .ad-zones-action { display: none !important; }
	body.ad-mobile-v2 .ad-zones-cartes > .ad-zone {
		width: 70% !important;
		align-content: start !important;
		column-gap: 12px !important;
		row-gap: 8px !important;
	}
	/* Pictogramme et nom du département sur une ligne, villes en dessous sur toute la largeur. */
	body.ad-mobile-v2 .ad-zone .ad-zone-icone { grid-area: 1 / 1 / 2 / 2 !important; }
	body.ad-mobile-v2 .ad-zone > .elementor-widget-heading:not(.ad-zone-code) { grid-area: 1 / 2 / 2 / 3 !important; align-self: center; }
	body.ad-mobile-v2 .ad-zone > .elementor-widget-text-editor { grid-column: 1 / -1 !important; grid-row: 2 !important; }

	/* ---- Appel final ---------------------------------------------------------------------- */
	body.ad-mobile-v2 .ad-cta-final .ad-lueur { padding: 28px 22px !important; }

	/* ---- Pied de page compact ------------------------------------------------------------- */
	body.ad-mobile-v2 .elementor > .e-con.ad-pied { --padding-top: 28px !important; --padding-bottom: 20px !important; padding-top: 28px !important; padding-bottom: 20px !important; }
	body.ad-mobile-v2 .ad-pied > .e-con-inner { gap: 20px !important; }
	body.ad-mobile-v2 .ad-pied .ad-pied-marques,
	body.ad-mobile-v2 .ad-pied .elementor-widget-divider { display: none !important; }
	body.ad-mobile-v2 .ad-pied > .e-con-inner > .e-grid {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		gap: 22px 16px !important;
	}
	body.ad-mobile-v2 .ad-pied > .e-con-inner > .e-grid > .e-con:first-child { grid-column: 1 / -1; }
	body.ad-mobile-v2 .ad-pied > .e-con-inner > .e-grid > .e-con:first-child .elementor-widget-text-editor p:first-child { display: none; }
	body.ad-mobile-v2 .ad-pied > .e-con-inner > .e-grid > .e-con:last-child { grid-column: 1 / -1; }
	body.ad-mobile-v2 .ad-pied .ad-pied-logo-site img { width: 120px !important; }
	body.ad-mobile-v2 .ad-pied h2.elementor-heading-title { font-size: 0.75rem !important; margin-bottom: 4px; }
	body.ad-mobile-v2 .ad-pied .elementor-widget-text-editor p { font-size: 0.875rem !important; line-height: 1.75 !important; }
	body.ad-mobile-v2 .ad-pied > .e-con-inner > .e-con:last-child { gap: 10px !important; padding-top: 16px; border-top: 1px solid rgb(235 220 198 / 0.15); }
	body.ad-mobile-v2 .ad-pied nav p { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 0.8125rem !important; }
}