﻿/**
 * Bannières image — réservation CLS, responsive, flottant mobile.
 * Emplacements 3lachtv : leaderboard, sidebar, footer-bottom.
 */

/* ── Style 3lachtv (pleine largeur, sans cadre) — IAB 970×250 = 250px haut ── */
.tlv3-lachtv-leaderboard {
	width: 100%;
	max-width: none;
	max-height: 250px;
	height: auto;
	padding: 0;
	margin: 0;
	text-align: center;
	line-height: 0;
	overflow: hidden;
	background: var(--news-canvas, #f5f6f8);
	border-bottom: 1px solid var(--news-border, #e4e7ec);
}

.tlv3-lachtv-leaderboard .tlv3-banner--under_menu,
.tlv3-lachtv-leaderboard .tlv3-banner--lachtv {
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	background: transparent !important;
	max-height: 250px;
	min-height: 0 !important;
}

.tlv3-lachtv-leaderboard .tlv3-banner__frame {
	height: auto;
	max-height: 250px;
	min-height: 0 !important;
	overflow: hidden;
	line-height: 0;
	display: flex;
	align-items: flex-start;
	justify-content: center;
}

.tlv3-lachtv-leaderboard .tlv3-banner__link {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	width: 100%;
	height: auto;
	max-height: 250px;
	line-height: 0;
}

.tlv3-lachtv-leaderboard .tlv3-banner__viewport {
	width: 100%;
	max-width: 100%;
	max-height: 250px;
	height: auto;
	overflow: hidden;
	display: flex;
	align-items: flex-start;
	justify-content: center;
}

.tlv3-lachtv-leaderboard .tlv3-banner__viewport--desktop .tlv3-banner__img,
.tlv3-lachtv-leaderboard .tlv3-banner__viewport--tablet .tlv3-banner__img,
.tlv3-lachtv-leaderboard .tlv3-banner__viewport--single .tlv3-banner__img,
.tlv3-lachtv-leaderboard .tlv3-banner__viewport--mobile .tlv3-banner__img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 250px !important;
	min-height: 0;
	object-fit: contain;
	object-position: center center;
	margin-inline: auto;
}

.tlv3-lachtv-leaderboard .tlv3-banner--lachtv,
.tlv3-lachtv-footer-bottom .tlv3-banner--lachtv {
	margin: 0;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: 0;
}

.tlv3-lachtv-leaderboard .tlv3-banner__label,
.tlv3-lachtv-footer-bottom .tlv3-banner__label,
.tlv3-lachtv-sidebar .tlv3-banner__label {
	display: none;
}

.tlv3-lachtv-footer-bottom {
	width: 100%;
	max-width: 100%;
	padding: 10px 0;
	margin: 0;
	text-align: center;
	background: #fff;
	border-top: 1px solid var(--news-border, #e4e7ec);
	overflow: hidden;
}

.tlv3-lachtv-footer-bottom .tlv3-banner__viewport--desktop .tlv3-banner__img,
.tlv3-lachtv-footer-bottom .tlv3-banner__viewport--tablet .tlv3-banner__img,
.tlv3-lachtv-footer-bottom .tlv3-banner__viewport--single .tlv3-banner__img {
	width: 100%;
	max-width: 100%;
	height: auto;
	object-fit: contain;
}

.tlv3-lachtv-footer-bottom__inner {
	display: flex;
	justify-content: center;
	align-items: center;
}

.tlv3-lachtv-sidebar {
	margin-bottom: 16px;
}

.front-page .home-hero-zone .home-sidebar-right,
.front-page .home-hero-zone .home-sidebar-right .tlv3-lachtv-sidebar,
.front-page .home-hero-zone .home-sidebar-right .tlv3-banner--home_hero_sidebar {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
}

.front-page .home-hero-zone .tlv3-lachtv-sidebar .tlv3-banner--home_hero_sidebar,
.front-page .home-hero-zone .tlv3-lachtv-sidebar .tlv3-banner--lachtv {
	margin: 0 !important;
	padding: 0 !important;
}

.tlv3-lachtv-sidebar .tlv3-banner--lachtv {
	margin: 0 0 16px;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: 0;
}

.tlv3-lachtv-sidebar .tlv3-banner__img {
	width: 100%;
	max-width: 300px;
	margin-inline: auto;
}

body.dark-mode .tlv3-lachtv-leaderboard {
	background: var(--news-surface, #1a1a1a);
}

body.dark-mode .tlv3-lachtv-footer-bottom {
	background: var(--news-bg, #121212);
}

/* ── Responsive : un viewport visible selon l’appareil (formats IAB distincts) ── */
.tlv3-banner--device-split .tlv3-banner__viewport {
	display: none;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	line-height: 0;
	text-align: center;
	overflow: hidden;
	height: 0;
	min-height: 0;
	border: 0;
}

.tlv3-banner--device-split .tlv3-banner__viewport .tlv3-banner__img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	min-height: 0;
	margin-inline: auto;
	object-fit: contain;
	object-position: center center;
}

/* Desktop ≥1024px — leaderboard / mid-page paysage */
@media (min-width: 1024px) {
	.tlv3-banner--device-split.tlv3-banner--has-desktop .tlv3-banner__viewport--desktop {
		display: block;
		height: auto;
	}

	.tlv3-banner--device-split .tlv3-banner__viewport--desktop.tlv3-banner__format--leaderboard .tlv3-banner__img,
	.tlv3-banner--device-split .tlv3-banner__viewport--desktop.tlv3-banner__format--rectangle .tlv3-banner__img {
		width: 100%;
		max-width: min(100%, var(--tlv3-banner-w, 970px));
	}

	.tlv3-banner--device-split .tlv3-banner__viewport--desktop.tlv3-banner__format--skyscraper .tlv3-banner__img {
		width: 100%;
		max-width: min(100%, 300px);
	}
}

/* Tablette 769–1023px — 960x311 ou repli desktop */
@media (min-width: 769px) and (max-width: 1023px) {
	.tlv3-banner--device-split.tlv3-banner--has-tablet .tlv3-banner__viewport--tablet {
		display: block;
		height: auto;
	}

	.tlv3-banner--device-split:not(.tlv3-banner--has-tablet).tlv3-banner--has-desktop .tlv3-banner__viewport--desktop {
		display: block;
		height: auto;
	}

	.tlv3-banner--device-split .tlv3-banner__viewport--tablet .tlv3-banner__img,
	.tlv3-banner--device-split:not(.tlv3-banner--has-tablet) .tlv3-banner__viewport--desktop .tlv3-banner__img {
		width: 100%;
		max-width: min(100%, var(--tlv3-banner-w, 960px));
	}
}

/* Mobile ≤768px — format portrait 9:16 (9-16.jpg) */
@media (max-width: 768px) {
	.tlv3-banner--device-split.tlv3-banner--has-mobile .tlv3-banner__viewport--mobile {
		display: block;
		height: auto;
	}

	.tlv3-banner--device-split:not(.tlv3-banner--has-mobile).tlv3-banner--has-tablet .tlv3-banner__viewport--tablet {
		display: block;
		height: auto;
	}

	.tlv3-banner--device-split:not(.tlv3-banner--has-mobile):not(.tlv3-banner--has-tablet).tlv3-banner--has-desktop .tlv3-banner__viewport--desktop {
		display: block;
		height: auto;
	}

	.tlv3-banner--device-split .tlv3-banner__viewport--mobile.tlv3-banner__format--portrait .tlv3-banner__img {
		width: auto;
		max-width: min(100%, 420px);
		max-height: min(72vh, 640px);
	}

	.tlv3-banner--device-split .tlv3-banner__viewport--mobile:not(.tlv3-banner__format--portrait) .tlv3-banner__img {
		width: 100%;
		max-width: min(100%, var(--tlv3-banner-w, 320px));
	}
}

/* Viewport unique (sidebar desktop, etc.) */
.tlv3-banner__viewport--single,
.tlv3-banner__viewport--desktop:only-child,
.tlv3-banner:not(.tlv3-banner--device-split) .tlv3-banner__viewport {
	display: block;
}

.tlv3-banner__viewport--single .tlv3-banner__img,
.tlv3-banner:not(.tlv3-banner--device-split) .tlv3-banner__img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	min-height: 0;
	object-fit: contain;
	object-position: center center;
	margin-inline: auto;
}

.tlv3-lachtv-sidebar .tlv3-banner__viewport--single .tlv3-banner__img,
.tlv3-lachtv-sidebar .tlv3-banner:not(.tlv3-banner--device-split) .tlv3-banner__img {
	max-width: 300px;
}

.front-page .home-hero-zone .home-sidebar-right .tlv3-lachtv-sidebar .tlv3-banner__viewport--single .tlv3-banner__img,
.front-page .home-hero-zone .home-sidebar-right .tlv3-lachtv-sidebar .tlv3-banner:not(.tlv3-banner--device-split) .tlv3-banner__img {
	object-fit: contain;
	object-position: top center;
}

.tlv3-lachtv-mid {
	width: 100%;
	padding: clamp(12px, 2vw, 18px) 0;
	text-align: center;
}

.tlv3-lachtv-mid .tlv3-banner--lachtv {
	margin: 0;
	padding: 0;
	background: transparent;
	border: none;
}

.tlv3-banner {
	--tlv3-banner-min-h: 90px;
	display: block;
	margin: clamp(12px, 2vw, 18px) 0;
	padding: 10px 12px;
	background: var(--news-canvas, #f5f6f8);
	border: 1px dashed var(--news-border, #e4e7ec);
	border-radius: var(--news-radius-sm, 8px);
	text-align: center;
	overflow: hidden;
	box-sizing: border-box;
}

.tlv3-banner__label {
	margin: 0 0 8px;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--news-muted, #5c6670);
}

.tlv3-banner__frame {
	display: block;
	min-height: 0;
	overflow: hidden;
	line-height: 0;
}

.tlv3-banner__link {
	display: block;
	line-height: 0;
	text-decoration: none;
}

.tlv3-banner__picture {
	display: block;
	width: 100%;
	margin: 0;
}

.tlv3-banner__img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	min-height: 0;
	object-fit: contain;
	object-position: center center;
	margin-inline: auto;
}

/* ── Emplacements ── */
.header-ad .tlv3-banner,
.archive-lachtv-banner .tlv3-banner {
	margin-block: 12px 16px;
}

.tlv3-ad-home-mid-wrap .tlv3-banner,
.tlv3-banner-home-mid-wrap .tlv3-banner {
	margin-block: clamp(16px, 2.5vw, 24px);
}

.tlv3-banner--single_sidebar {
	margin-block: 0 16px;
}

.tlv3-banner--footer {
	margin-block: 0 clamp(16px, 2.5vw, 24px);
}

/* Sidebar desktop uniquement */
@media (max-width: 768px) {
	.tlv3-banner--desktop-only,
	.tlv3-banner--single_sidebar {
		display: none !important;
	}
}

/* ── Bannière flottante mobile ── */
.tlv3-banner--floating.tlv3-banner--mobile_sticky {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 9980;
	margin: 0;
	padding: 0;
	border: none;
	border-radius: 0;
	background: var(--news-charcoal, #1a1a1a);
	box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.22);
	transform: translateY(100%);
	transition: transform 0.32s ease;
	padding-bottom: env(safe-area-inset-bottom, 0);
}

.tlv3-banner--floating.tlv3-banner--mobile_sticky.is-visible {
	transform: translateY(0);
}

.tlv3-banner--floating.tlv3-banner--mobile_sticky.is-dismissed {
	display: none !important;
}

.tlv3-banner--floating .tlv3-banner__label {
	display: none;
}

.tlv3-banner--floating .tlv3-banner__frame {
	min-height: var(--tlv3-banner-min-h, 72px);
}

.tlv3-banner--floating .tlv3-banner__img {
	min-height: var(--tlv3-banner-min-h, 72px);
	max-height: 88px;
	object-fit: cover;
}

.tlv3-banner__close {
	position: absolute;
	top: 6px;
	inset-inline-end: 6px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	font-size: 1.35rem;
	line-height: 1;
	color: #fff;
	background: rgba(0, 0, 0, 0.55);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 50%;
	cursor: pointer;
	transition: background 0.2s ease;
}

.tlv3-banner__close:hover,
.tlv3-banner__close:focus-visible {
	background: rgba(0, 0, 0, 0.78);
	color: #fff;
}

body.has-banner-sticky .site-footer.site-footer--harmonized .footer-back-top.is-visible {
	bottom: calc(76px + env(safe-area-inset-bottom, 0px));
}

body.has-banner-sticky.has-sticky-share .site-footer.site-footer--harmonized .footer-back-top.is-visible {
	bottom: calc(128px + env(safe-area-inset-bottom, 0px));
}

@media (min-width: 769px) {
	.tlv3-banner--mobile-only,
	.tlv3-banner--floating {
		display: none !important;
	}
}

body.dark-mode .tlv3-banner {
	background: rgba(255, 255, 255, 0.04);
	border-color: var(--news-border);
}

body.dark-mode .tlv3-banner__label {
	color: var(--news-muted);
}

@media (prefers-reduced-motion: reduce) {
	.tlv3-banner--floating.tlv3-banner--mobile_sticky {
		transition: none;
	}
}
