/* ===================================================================
 * Bannière publicitaire fixe en bas d'écran — mobile uniquement.
 *
 * Balisage visé (bloc HTML placé dans le footer) :
 *
 *   .footer-s > .gmspyu > .gmspyu-single > center > a.gofollow > img
 *
 * Sur desktop la bannière est masquée : la créative 728x90 n'est pas
 * adaptée au footer du thème.
 * =================================================================== */

/* Desktop et tablette : bannière masquée. */
@media (min-width: 768px) {

	.footer-s {
		display: none;
	}
}

@media (max-width: 767.98px) {

	:root {
		/* Hauteur réelle de la créative 728x90 une fois réduite à la
		 * largeur de l'écran (moins les 8 px de gouttière de chaque côté).
		 * 90 / 728 = 0.1236. Sert à réserver l'espace en bas de page. */
		--mpn-ad-height: calc(min(100vw - 16px, 728px) * 0.1236);
		--mpn-ad-gap: calc(var(--mpn-ad-height) + 12px + env(safe-area-inset-bottom, 0px));
	}

	.footer-s {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 9998;
		padding: 6px 8px;
		/* Marge supplémentaire sur les iPhone à encoche / barre gestuelle. */
		padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px));
		background: #fff;
		box-shadow: 0 -1px 12px rgba(0, 0, 0, .12);
	}

	/* Le balisage de la régie empile trois conteneurs + un <center> :
	 * on les neutralise pour que l'image occupe toute la largeur. */
	.footer-s .gmspyu,
	.footer-s .gmspyu-single,
	.footer-s center {
		width: 100%;
		margin: 0;
		padding: 0;
	}

	.footer-s .gofollow {
		display: block;
		width: 100%;
		max-width: 728px;
		margin: 0 auto;
		/* L'image est un enfant inline : sans ceci, un liseré de 3-4 px
		 * apparaît sous la bannière (espace réservé à la ligne de base). */
		line-height: 0;
	}

	/* L'attribut width du HTML est malformé (width="728 height=" 90") :
	 * on impose les dimensions en CSS. aspect-ratio réserve la place
	 * avant le chargement de l'image et évite le saut de mise en page. */
	.footer-s .gofollow img {
		display: block;
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 728 / 90;
		border-radius: 4px;
	}

	/* Sans cela, la bannière recouvre la fin du footer (mentions légales,
	 * derniers liens) qui devient définitivement inatteignable. */
	body {
		padding-bottom: var(--mpn-ad-gap);
	}

	/* Le bouton « retour en haut » du thème est lui aussi fixé en bas à
	 * droite (.switcher-wrapper, z-index 99) : on le remonte au-dessus. */
	.switcher-wrapper {
		bottom: var(--mpn-ad-gap);
	}

	/* Mode sombre du thème (body.tg-theme-dark). */
	body.tg-theme-dark .footer-s {
		background: var(--tg-heading-color, #12141d);
		box-shadow: 0 -1px 12px rgba(0, 0, 0, .5);
	}
}
