/*
Theme Name: Twal Mutualpharm
Template: twal
Version: 1.0.0
*/

:root {
	--tw-fond-section-paire : #f7f7f7;
	--tw-fond-interieur-section-paire : rgba(255,255,255, 0.5);
}


.tw-surtitre {
	font-weight : 300;
}

.tmp_tw-surtitre.tw-card_surtitre {
	display: none;
}
.home .tw-text.tw-card_text{
	display: none;
}
.tmp_tw-card_actions a {
	font-weight: 400;
	font-size: 90%;
}



/*== HERO ==*/

.tw-hero_content .tw-accroche.tw-hero_accroche,
.tw-accroche.tw-card_accroche{
	font-weight: 400;
}
/* composants : adresse, tel, horaire */
.tw-hero_components {
	display : block;
}
/* horaire */

.tw-hero_hours  {
	background : rgba(255,255,255, 0.9);
	padding : 5px;
	border-radius : 5px;
	max-width: min(350px, 400px);
	font-size: 14px;
}
.tw-hero_content .tw-hero_hours {
	margin-top: 15px;
}
.tw-hero .tw-horaire_compact > .tw-horaire_status, .tw-hero .tw-horaire_compact .tw-horaire_details, .tw-hero .tw-horaire_compact .tw-horaire_row, .tw-hero .tw-horaire_compact .tw-horaire_slots, .tw-hero .tw-horaire_compact .tw-horaire_note

 {
    color: #000;
}

.tw-hero_content > p.tw-accroche + nav.tw-cta-group {
    margin-top: 2rem;
}

/* Bloc de référence et priorité d’affichage */
.tw-hero_hours {
    position: relative;
    z-index: 20;
    overflow: visible;
}

.tw-hero_hours .tw-horaire {
    position: relative;
    overflow: visible;
}

/* Liste déroulante superposée au contenu */
.tw-hero_hours .tw-horaire_details {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1;

    box-sizing: border-box;
    margin: 0;
    padding: 12px 8px;
    background: #fff;
    color: #152f43;
    border-radius: 0 0 4px 4px;
    box-shadow: 0 8px 20px rgb(0 0 0 / 20%);
}

/* Autoriser le panneau à dépasser du héros */
.tw-hero.tw-hero_home {
    position: relative;
    overflow: visible;
    z-index: 20;
}

/* Autoriser aussi le débordement des conteneurs intermédiaires */
.tw-hero.tw-hero_home .tw-hero_inner,
.tw-hero.tw-hero_home .tw-hero_content,
.tw-hero.tw-hero_home .tw-hero_components {
    overflow: visible;
}

/* Conserver le recadrage de l’image dans son propre conteneur */
.tw-hero.tw-hero_home .tw-hero_media {
    overflow: hidden;
}
/*=========================================
 * LOGO
 * =======================================*/
.tw-navbar_identity {
	border: solid 1px  #F6F7F6;
	tmp_background : #F6F7F6; /* bleu clair mtp -> #76C1C3; */
	border-radius : 4px;
	padding : 5px;
	gap: 8px;
	font-family : var(--tw-menu-font-family))
	
}

.tw-navbar_brand-title {
	font-size: 16px;
    font-weight: 300;
	text-align: left;
	line-height: 1.3em;
}
.tw-navbar_brand-title .tw-navbar_brand-title-word_1 {
    display: block;
}

/*=========================
 * GAMME
 * =======================*/
.mtp-ms_gammes-public_carte strong {
	display: none;
}
/*===========================================
 * 
 * SECTION INNER
 * 
 * Section parente en ligne
 * 
 * =========================================*/
#specialites-a-la-une {
	padding: 10px 0px 10px 0px;
}
/* bordure cartouche */
.tw-section_inner {
	border: solid 0px;
	padding: 30px 25px;
}
/* section promotion */
.mtp-promo-web_section {
	padding: 0px 0px 30px 0px;
}
.mtp-promo-web_section .tw-section_inner {
		padding: 15px 0px;
}
.tw-section_child .tw-section_inner .tw-section_header:after {
	 content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 150px;
  height: 1px;
  background: linear-gradient(to right, black, white);
	margin-bottom: 10px;
}

.tw-section_media-text,
.tw-section_standard.tw-home-section_page-branch:not(.tw-section_has-cards) {
    position: relative;
    isolation: isolate;
    overflow: hidden;

    padding-top: 15px;
    padding-bottom: 15px;

/*    background:
        linear-gradient(
            115deg,
            var(--tw-hero_bg) 0%,
            color-mix(
                in srgb,
                var(--tw-hero_bg) 70%,
                var(--tw-hero_overline-color)
            ) 100%
        );
	background: linear-gradient(76deg,rgba(24, 50, 77, 0.5) 50%, rgba(24, 50, 77, 0.2) 100%);
	*/
/*	background: linear-gradient(180deg,rgba(255, 255, 255, 1) 23%, rgba(242, 242, 242, 1) 100%);
	background: linear-gradient(180deg,rgba(242, 242, 242, 1) 6%, rgba(255, 255, 255, 1) 51%, rgba(242, 242, 242, 1) 100%);
	background: linear-gradient(180deg,rgba(255, 255, 255, 1) 6%, rgba(242, 242, 242, 1) 51%, rgba(255, 255, 255, 1) 100%);
	*/
	
}
/* si odd (impaire) alors couleur inner even (paire) */
.tw-section_standard.tw-home-section_page-branch.tw-section_odd:not(.tw-section_has-cards)  {
	background: linear-gradient(180deg,var(--tw-fond-section-impaire) 6%, var(--tw-fond-section-paire) 51%, var(--tw-fond-section-impaire)  100%);
	background: linear-gradient(180deg,var(--tw-fond-section-impaire) 50%, var(--tw-fond-section-paire) 90%);
	
}
.tw-section_standard.tw-home-section_page-branch.tw-section_even:not(.tw-section_has-cards)  {
	background: linear-gradient(180deg,var(--tw-fond-section-paire) 6%, var(--tw-fond-section-impaire) 51%, var(--tw-fond-section-paire)  100%);
	border-left:  solid 5px var(--tw-fond-section-paire);
	
}
.tw-section_standard.tw-home-section_page-branch.tw-section_odd:not(.tw-section_has-cards) .tw-section_inner .tw-section_header  {
	/* border-left:  solid 5px var(--tw-fond-section-paire);
	padding-left: 15px;
	*/
}
.tw-section_standard.tw-home-section_page-branch.tw-section_even:not(.tw-section_has-cards) .tw-section_inner  {
	border-left:  solid 20px var(--tw-fond-section-impaire);
}
.tw-section_standard.tw-home-section_page-branch:not(.tw-section_has-cards) .tw-section_inner {
    position: relative;
    z-index: 1;

    padding-top: 10px; /* clamp(2.5rem, 5vw, 4rem);*/
    padding-bottom: 5px; /*clamp(3rem, 5vw, 4.5rem); */

    background: transparent;
    border: 0;
    border-radius: 0;
}

.tw-section_standard.tw-home-section_page-branch:not(.tw-section_has-cards)
.tw-section_surtitre {
    tmp_color: var(--tw-hero_overline-color);
	
}

.tw-section_standard.tw-home-section_page-branch:not(.tw-section_has-cards)
.tw-section_title {
    tmp_color: var(--tw-hero_title-color);
	font-size: 200%;
	font-size: 3em;
}

.tw-section_standard.tw-home-section_page-branch:not(.tw-section_has-cards)
.tw-section_accroche {
    tmp_color: var(--tw-hero_lead-color);
}

.tw-section_standard.tw-home-section_page-branch:not(.tw-section_has-cards)
.tw-section_header::after {
   display: none;
}
/*----- INNER ------*/


/**************************************************/

/*=================================
 * MENU a déplacer par la suite
 * ===============================*/
@media(min-width: 992px) {
    .tw-navbar_menu > .tw-mega-menu > .sub-menu > li > a, .tw-navbar_menu > .tw-mega-menu > .sub-menu > li > .tw-submenu_toggle-label
 {
        display: block;
        margin: 0 0 0px;
        padding: 9px 0 9px 0; /* à modifier */
        color: var(--tw-submenu_active-color);
        border-bottom: 1px solid currentColor;
        font-size: 17px;
        font-weight: 700;
        line-height: 1.25;
        white-space: normal;
    }
}
/* image hero, ne pas l'afficher en responsive */
@media(max-width: 992px) {
	.tw-hero_media.tw-hero_visual {
		display: none;
	}
}
/*==============================================
 * LISTE LIENS DANS SECTIONS PARENTS
 * =============================================*/
.tw-child-list {
	margin-bottom : 20px;
	margin-left: 20px;
}

/*--------------------------------*/

/* Variante : chevron */
.tw-child-list .tw-child-list_item {
    padding-left: 1.1rem;
}

.tmp_tw-child-list .tw-child-list_item::before {
    content: "›";
    top: .05em;
    width: auto;
    height: auto;
    background: none;
    border-radius: 0;
    transform: none;
    font-size: 1.15em;
    font-weight: 700;
    line-height: 1;
}

/* Variante : tiret fin */

.tw-child-list .tw-child-list_item::before {
    width: .65rem;
    height: 1px;
    top: .78em;
    border-radius: 0;
}

/* Variante : barre verticale */
/*
.tw-child-list .tw-child-list_item {
    padding-left: .9rem;
}

.tw-child-list .tw-child-list_item::before {
    top: .15em;
    bottom: .15em;
    width: 2px;
    height: auto;
    border-radius: 2px;
    transform: none;
}
*/

/* format bouton */
.tmp_tw-child-list .tw-child-list_item a {
    border: solid 1px;
	border-radius : 5px;
	padding : 5px 10px;
}
/* sur 2 colonnes */
/*
@media (min-width: 900px) {
    .tw-child-list_sections .tw-child-list_items {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .45rem 1.5rem;
    }

    .tw-child-list_sections .tw-child-list_item + .tw-child-list_item {
        margin-top: 0;
    }
}
*/

/* Spécialités : présentation en sommaire */
.tw-child-list_sections .tw-child-list_items {
    list-style: none;
    max-width: 32rem;
    margin: 1.25rem 0 1.5rem;
    padding: 0;
}

.tw-child-list_sections .tw-child-list_item {
    padding: 0;
    border-bottom: 1px solid rgba(20, 45, 65, .12);
}

.tw-child-list_sections .tw-child-list_item + .tw-child-list_item {
    margin-top: 0;
}

/* Supprime la puce actuelle */
.tw-child-list_sections .tw-child-list_item::before {
    content: none;
}

.tw-child-list_sections .tw-child-list_item a,
.tw-child-list_sections .tw-child-list_item span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem .15rem;
    color: inherit;
    text-decoration: none;
    transition: color .2s ease, padding .2s ease;
}

/* Losange fin, inspiré de l’image 2 */
.tw-child-list_sections .tw-child-list_item a::after,*
.tw-child-list_sections .tw-child-list_item span::after {
    content: "";
    flex: 0 0 .38rem;
    width: .38rem;
    height: .38rem;
    margin-right: .2rem;
    border: 1px solid currentColor;
    transform: rotate(45deg);
    opacity: .6;
}

.tw-child-list_sections .tw-child-list_item a:hover {
    color: var(--tw-link_color);
    padding-left: .45rem;
}

.tw-child-list_sections .tw-child-list_item a:focus-visible {
    outline: 2px solid var(--tw-link_color);
    outline-offset: 2px;
}

/*------------------------------------
 * CTA GLOBAL
 * ----------------------------------*/
.tw-global-cta.tw-section {
	background: var(--tw-hero_bg);
}
.tw-global-cta.tw-section .tw-global-cta_inner {
	background : #fff;
}
/*********************************************
 * PROMO 
 * réglages personnalisés
 * ******************************************/

.mtp-promo-web_section .tw-section_inner {
	width: 100%;
	max-width: 100%;
}

.mtp-promo-web_section .tw-section_inner {
	text-align: center!important;
	background: transparent;
	border: solid 0px;
}
.mtp-promo-web_accroche {
	margin: auto;
}
.mtp-promo-web_section--cartes-paysage .mtp-promo-web {
	max-width: 650px;
	min-width: 450px;
}

.mtp-promo-web_prix-public .mtp-promo-web_prix-valeur {
	text-decoration: line-through;
}
/* couleur scroll */

.mtp-promo-web_fenetre {
	/* #FBFBFB -> bg guerlain / autre : #F6F7F6*/
		scrollbar-color: #FBFBFB transparent;
}
/* --tw-palette_primary */


	/*************** PROMOTIONS ************************************
	 * MutualPharm – Promotions / CSS 0.1.7
	 *
	 * A. Variables du composant
	 * B. En-tête et grille de la section
	 * C. Formats des cartes
	 * D. Images et pastille d’offre
	 * E. Contenu, prix et mentions
	 * F. Navigation du carrousel
	 * G. Adaptation tablette et téléphone
	 **************************************************/

	/*=========================================================
	  A — VARIABLES DU COMPOSANT
		  Couleurs, formes et espacements modifiables dans le thème.
	 =========================================================*/

	/* Ce fichier reste indépendant du plugin et n’utilise ni
	 * `.tw-card` ni les variables historiques `--tw-card_*`. */

	.mtp-promo-web_section {
		/* Couleurs principales du composant */
		--mtp-promo-web_surface: var(--tw-palette_light, #ffffff);
		--mtp-promo-web_image-bg: #ffffff;
		--mtp-promo-web_text: var(--tw-color_text, #263f49);
		--mtp-promo-web_heading: var(--tw-color_heading, #15303c);
		--mtp-promo-web_muted: var(--tw-color_muted, #65757c);
		--mtp-promo-web_border: var(--tw-palette_primary, #d8e0e2);
		--mtp-promo-web_accent: var(--tw-palette_primary, #178b7b);

		/* Pastille de l’offre */
		--mtp-promo-web_offer-bg: var(--tw-palette_primary, #178b7b);
		--mtp-promo-web_offer-text: var(--tw-palette_on-primary, #ffffff);

		/* Forme et espacement */
		--mtp-promo-web_radius: 12px;
		--mtp-promo-web_shadow: 0 4px 18px rgba(21, 48, 60, 0.08);
		--mtp-promo-web_gap: 24px;
		--mtp-promo-web_card-min-width: 450px;
		--mtp-promo-web_card-max-width: 650px;

		/* Images paysage et panoramiques */
		--mtp-promo-web_landscape-column: 50%;
		--mtp-promo-web_landscape-padding-inline: 8px;
		--mtp-promo-web_panorama-padding-inline: 0px;
	}

	/*=========================================================
	  B — EN-TÊTE ET GRILLE FLEXIBLE
		  Titres, alignement et nombre maximal de cartes par ligne.
	 =========================================================*/

	/*---------------------------------------------------------
	  B.1 — En-tête éditorial
			Espacement du surtitre, du titre et de l’accroche.
	 ---------------------------------------------------------*/

	.mtp-promo-web_entete {
		margin-bottom: 28px;
	}

	.mtp-promo-web_titre-section {
		margin-bottom: 0;
	}

	/*---------------------------------------------------------
	  B.2 — Largeurs et colonnes
			Grille Flexbox pilotée par les réglages du site.
	 ---------------------------------------------------------*/

	.mtp-promo-web_configuration {
		width: 100%;
	}

	.mtp-promo-web_liste {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: var(--mtp-promo-web_gap);
		width: 100%;
		margin-inline: auto;
	}

	.mtp-promo-web_section_colonnes-1 .mtp-promo-web_liste {
		max-width: var(--mtp-promo-web_card-max-width);
	}

	.mtp-promo-web_section_colonnes-2 .mtp-promo-web_liste {
		max-width: calc(
			var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_gap)
		);
	}

	.mtp-promo-web_section_colonnes-3 .mtp-promo-web_liste {
		max-width: calc(
			var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_gap)
			+ var(--mtp-promo-web_gap)
		);
	}

	.mtp-promo-web_section_colonnes-4 .mtp-promo-web_liste {
		max-width: calc(
			var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_gap)
			+ var(--mtp-promo-web_gap)
			+ var(--mtp-promo-web_gap)
		);
	}

	.mtp-promo-web_section_colonnes-1 .mtp-promo-web {
		flex-basis: min(100%, var(--mtp-promo-web_card-max-width));
	}

	.mtp-promo-web_section_colonnes-2 .mtp-promo-web {
		flex-basis: calc(50% - 12px);
	}

	.mtp-promo-web_section_colonnes-3 .mtp-promo-web {
		flex-basis: calc(33.333333% - 16px);
	}

	.mtp-promo-web_section_colonnes-4 .mtp-promo-web {
		flex-basis: calc(25% - 18px);
	}

	/*---------------------------------------------------------
	  B.3 — Alignement TWAL
			Position de l’en-tête et du groupe de cartes.
	 ---------------------------------------------------------*/

	.mtp-promo-web_section.tw-section-align_left .mtp-promo-web_entete {
		text-align: left;
	}

	.mtp-promo-web_section.tw-section-align_center .mtp-promo-web_entete {
		text-align: center;
	}

	.mtp-promo-web_section.tw-section-align_right .mtp-promo-web_entete {
		text-align: right;
	}

	.mtp-promo-web_section.tw-section-align_left .mtp-promo-web_liste {
		justify-content: flex-start;
		margin-right: auto;
		margin-left: 0;
	}

	.mtp-promo-web_section.tw-section-align_right .mtp-promo-web_liste {
		justify-content: flex-end;
		margin-right: 0;
		margin-left: auto;
	}

	/*=========================================================
	  C — FORMATS DES CARTES
		  Socle commun puis variantes paysage et portrait.
	 =========================================================*/

	/*---------------------------------------------------------
	  C.1 — Socle commun
			Surface, bordure, ombre et comportement de grille.
	 ---------------------------------------------------------*/

	.mtp-promo-web {
		display: grid;
		flex-grow: 1;
		flex-shrink: 1;
		width: 100%;
		min-width: min(100%, var(--mtp-promo-web_card-min-width));
		max-width: min(100%, var(--mtp-promo-web_card-max-width));
		overflow: clip;
		color: var(--mtp-promo-web_text);
		background: var(--mtp-promo-web_surface);
		border: 1px solid var(--mtp-promo-web_border);
		border-radius: var(--mtp-promo-web_radius);
		box-shadow: var(--mtp-promo-web_shadow);
	}

	/*---------------------------------------------------------
	  C.2 — Carte paysage
			Image à gauche et contenu à droite sur écran large.
	 ---------------------------------------------------------*/

	.mtp-promo-web_section_cartes-paysage .mtp-promo-web {
		grid-template-columns: minmax(170px, 42%) minmax(0, 1fr);
		min-height: 220px;
	}

	/*---------------------------------------------------------
	  C.3 — Carte portrait
			Image au-dessus et contenu en dessous.
	 ---------------------------------------------------------*/

	.mtp-promo-web_section_cartes-portrait .mtp-promo-web {
		grid-template-columns: minmax(0, 1fr);
		min-height: 0;
	}

	.mtp-promo-web_section_cartes-portrait .mtp-promo-web_visuel {
		aspect-ratio: 4 / 3;
	}

	.mtp-promo-web_section_cartes-portrait .mtp-promo-web_contenu {
		min-height: 260px;
	}

	/*=========================================================
	  D — IMAGES ET PASTILLE D’OFFRE
		  Zone visuelle, ratios automatiques et offre superposée.
	 =========================================================*/

	/*---------------------------------------------------------
	  D.1 — Zone visuelle commune
			Image entière, centrée et jamais rognée.
	 ---------------------------------------------------------*/

	.mtp-promo-web_visuel {
		position: relative;
		display: grid;
		place-items: center;
		min-width: 0;
		aspect-ratio: 1;
		padding: 22px;
		background: var(--mtp-promo-web_image-bg);
	}

	.mtp-promo-web_image {
		display: block;
		width: 100%;
		height: 100%;
		max-width: 260px;
		max-height: 200px;
		object-fit: contain;
	}

	/*---------------------------------------------------------
	  D.2 — Images paysage et panoramiques
			Modificateurs calculés depuis les dimensions du flux.
	 ---------------------------------------------------------*/

	/* Le plugin classe une image paysage dès 1,25 et une image
	 * panoramique dès 1,60 ; object-fit conserve le produit entier. */
	@media (min-width: 641px) {
		.mtp-promo-web_section_cartes-paysage .mtp-promo-web_image-paysage {
			grid-template-columns:
				minmax(200px, var(--mtp-promo-web_landscape-column))
				minmax(0, 1fr);
		}

		.mtp-promo-web_section_cartes-paysage
		.mtp-promo-web_image-paysage
		.mtp-promo-web_visuel {
			aspect-ratio: auto;
			align-self: stretch;
			padding-inline: var(--mtp-promo-web_landscape-padding-inline);
		}

		.mtp-promo-web_image-paysage .mtp-promo-web_image {
			max-width: none;
		}

		.mtp-promo-web_image-panoramique .mtp-promo-web_visuel {
			padding-inline: var(--mtp-promo-web_panorama-padding-inline);
		}
	}

	/*---------------------------------------------------------
	  D.3 — Pastille d’offre
			Position et couleurs de la réduction commerciale.
	 ---------------------------------------------------------*/

	.mtp-promo-web_offre {
		position: absolute;
		z-index: 1;
		top: 14px;
		left: 14px;
		max-width: calc(100% - 28px);
		padding: 8px 13px;
		color: var(--mtp-promo-web_offer-text);
		background: var(--mtp-promo-web_offer-bg);
		border-radius: 999px;
		font-size: 0.875rem;
		line-height: 1.15;
		text-align: center;
		overflow-wrap: anywhere;
	}

	/*=========================================================
	  E — CONTENU, PRIX ET MENTIONS
		  Informations commerciales affichées dans chaque carte.
	 =========================================================*/

	/*---------------------------------------------------------
	  E.1 — Contenu textuel
			Laboratoire, titre et description de la promotion.
	 ---------------------------------------------------------*/

	.mtp-promo-web_contenu {
		display: flex;
		flex-direction: column;
		min-width: 0;
		padding: 26px 24px 22px;
		text-align: left;
	}

	.mtp-promo-web_contenu p {
		margin: 0;
	}

	.mtp-promo-web_laboratoire {
		margin-bottom: 4px !important;
		color: var(--mtp-promo-web_accent);
		font-size: 0.75rem;
		font-weight: 700;
		line-height: 1.25;
		letter-spacing: 0.06em;
		text-transform: uppercase;
	}

	.mtp-promo-web_titre {
		margin: 0 0 10px;
		color: var(--mtp-promo-web_heading);
		font-size: 1.25rem;
		line-height: 1.25;
		overflow-wrap: anywhere;
	}

	.mtp-promo-web_description {
		color: var(--mtp-promo-web_muted);
		line-height: 1.45;
	}

	/*---------------------------------------------------------
	  E.2 — Prix
			Entier dominant, décimales et symbole euro réduits.
	 ---------------------------------------------------------*/

	.mtp-promo-web_prix {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 12px;
		margin-top: 18px !important;
		padding-top: 14px;
		border-top: 1px solid var(--mtp-promo-web_border);
	}

	.mtp-promo-web_prix-promotionnel,
	.mtp-promo-web_prix-public {
		white-space: nowrap;
	}

	.mtp-promo-web_prix-promotionnel {
		color: var(--mtp-promo-web_accent);
		font-size: 1.75rem;
		font-weight: 750;
		line-height: 1;
	}

	.mtp-promo-web_prix-public {
		color: var(--mtp-promo-web_muted);
		font-size: 1rem;
	}

	.mtp-promo-web_prix-valeur {
		display: inline-flex;
		align-items: baseline;
	}

	.mtp-promo-web_prix-decimales,
	.mtp-promo-web_prix-devise {
		font-size: 0.62em;
		line-height: 1;
	}

	.mtp-promo-web_prix-decimales {
		margin-left: 0.06em;
	}

	.mtp-promo-web_prix-devise {
		margin-left: 0.2em;
	}

	/*---------------------------------------------------------
	  E.3 — Disponibilité et mention légale
			Présence en officine et période de validité de l’offre.
	 ---------------------------------------------------------*/

	.mtp-promo-web_disponibilite {
		tmp_margin-top: auto !important;
		padding-top: 18px;
		color: var(--mtp-promo-web_accent);
		font-size: 0.8125rem;
		font-weight: 650;
	}

	.mtp-promo-web_mention {
		padding-top: 6px;
		color: var(--mtp-promo-web_muted);
		font-size: 0.6875rem;
		line-height: 1.4;
	}

	/*=========================================================
	  F — NAVIGATION DU CARROUSEL
		  Fenêtre défilable, commandes et activation conditionnelle.
	 =========================================================*/

	/*---------------------------------------------------------
	  F.1 — Rangée défilable
			Une seule ligne avec points d’arrêt sur chaque carte.
	 ---------------------------------------------------------*/

	.mtp-promo-web_carrousel {
		width: 100%;
		margin-inline: auto;
	}

	.mtp-promo-web_section_colonnes-1 .mtp-promo-web_carrousel {
		max-width: var(--mtp-promo-web_card-max-width);
	}

	.mtp-promo-web_section_colonnes-2 .mtp-promo-web_carrousel {
		max-width: calc(
			var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_gap)
		);
	}

	.mtp-promo-web_section_colonnes-3 .mtp-promo-web_carrousel {
		max-width: calc(
			var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_gap)
			+ var(--mtp-promo-web_gap)
		);
	}

	.mtp-promo-web_section_colonnes-4 .mtp-promo-web_carrousel {
		max-width: calc(
			var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_card-max-width)
			+ var(--mtp-promo-web_gap)
			+ var(--mtp-promo-web_gap)
			+ var(--mtp-promo-web_gap)
		);
	}

	.mtp-promo-web_section.tw-section-align_left .mtp-promo-web_carrousel {
		margin-right: auto;
		margin-left: 0;
	}

	.mtp-promo-web_section.tw-section-align_right .mtp-promo-web_carrousel {
		margin-right: 0;
		margin-left: auto;
	}

	.mtp-promo-web_fenetre {
		width: 100%;
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		scroll-behavior: smooth;
		scroll-snap-type: x mandatory;
		scrollbar-width: thin;
	}

	.mtp-promo-web_carrousel-actif .mtp-promo-web_fenetre {
		cursor: grab;
	}

	.mtp-promo-web_carrousel-actif.mtp-promo-web_en-deplacement
	.mtp-promo-web_fenetre {
		cursor: grabbing;
		scroll-behavior: auto;
		user-select: none;
	}

	.mtp-promo-web_carrousel-actif .mtp-promo-web_image {
		-webkit-user-drag: none;
	}

	.mtp-promo-web_section_ligne-unique .mtp-promo-web_liste {
		flex-wrap: nowrap;
		justify-content: flex-start;
		max-width: none;
	}

	.mtp-promo-web_section_ligne-unique .mtp-promo-web {
		flex-grow: 0;
		flex-shrink: 0;
		scroll-snap-align: start;
	}

	.mtp-promo-web_section_ligne-unique.tw-section-align_center
	.mtp-promo-web:first-child {
		margin-left: auto;
	}

	.mtp-promo-web_section_ligne-unique.tw-section-align_center
	.mtp-promo-web:last-child {
		margin-right: auto;
	}

	.mtp-promo-web_section_ligne-unique.tw-section-align_left
	.mtp-promo-web:last-child {
		margin-right: auto;
	}

	.mtp-promo-web_section_ligne-unique.tw-section-align_right
	.mtp-promo-web:first-child {
		margin-left: auto;
	}

	/*---------------------------------------------------------
	  F.2 — Commandes
			Flèches et lecture automatique affichées si nécessaire.
	 ---------------------------------------------------------*/

	.mtp-promo-web_commandes {
		display: flex;
		justify-content: center;
		gap: 10px;
		margin-top: 18px;
	}

	.mtp-promo-web_commandes[hidden] {
		display: none !important;
	}

	.mtp-promo-web_commande {
		display: inline-grid;
		place-items: center;
		width: 44px;
		height: 44px;
		padding: 0;
		color: var(--mtp-promo-web_offer-text);
		background: var(--mtp-promo-web_accent);
		border: 0;
		border-radius: 50%;
		font: inherit;
		font-size: 1.2rem;
		line-height: 1;
		cursor: ew-resize; /*pointer;*/
	}

	.mtp-promo-web_commande:hover,
	.mtp-promo-web_commande:focus-visible {
		filter: brightness(0.9);
	}

	.mtp-promo-web_commande:focus-visible {
		outline: 3px solid currentColor;
		outline-offset: 3px;
	}

	.mtp-promo-web_commande:disabled {
		cursor: not-allowed;
		opacity: 0.35;
	}

	/*=========================================================
	  G — ADAPTATION TABLETTE ET TÉLÉPHONE
		  Format des cartes et espacements sur les petits écrans.
	 =========================================================*/

	/*---------------------------------------------------------
	  G.1 — Tablette
			Ajustement de la carte paysage.
	 ---------------------------------------------------------*/

	@media (max-width: 1180px) {
		.mtp-promo-web_section_cartes-paysage .mtp-promo-web {
			grid-template-columns: minmax(190px, 34%) minmax(0, 1fr);
		}
	}

	/*---------------------------------------------------------
	  G.2 — Téléphone
			Carte verticale et espacements plus compacts.
	 ---------------------------------------------------------*/

	@media (max-width: 640px) {
		.mtp-promo-web_section {
			--mtp-promo-web_gap: 18px;
		}

		.mtp-promo-web_entete {
			margin-bottom: 20px;
		}

		.mtp-promo-web_section_cartes-paysage .mtp-promo-web,
		.mtp-promo-web_section_cartes-portrait .mtp-promo-web {
			grid-template-columns: 1fr;
			min-height: 0;
		}

		.mtp-promo-web_visuel {
			width: 100%;
			max-height: none;
			padding: 24px;
		}

		.mtp-promo-web_image {
			max-width: 300px;
			max-height: 300px;
		}

		.mtp-promo-web_contenu {
			min-height: 250px;
			padding: 22px 20px 20px;
		}
	}

	/*---------------------------------------------------------
	  G.3 — Réduction des animations
			Suppression du défilement fluide non indispensable.
	 ---------------------------------------------------------*/

	@media (prefers-reduced-motion: reduce) {
		.mtp-promo-web_fenetre {
			scroll-behavior: auto;
		}
	}


