/* Lightbox (inc/lightbox.php)
   Les boites entrent l'une apres l'autre depuis la droite en clignotant,
   puis se replient en un onglet vertical colle au bord de l'ecran. Un clic
   sur l'onglet rouvre la boite. L'etat (init, open, closed) est porte par
   data-state, sur la boite et sur son onglet. */

.tvmf-lightbox *{box-sizing:border-box;}
.tvmf-lightbox{
	position:fixed;
	right:24px;
	bottom:24px;
	z-index:99998;
	width:320px;
	max-width:calc(100vw - 32px);
	box-sizing:border-box;
	padding:22px 22px 20px;
	background:#ffffff;
	color:#000;
	border:1px solid rgba(0,0,0,.06);
	border-radius:14px;
	box-shadow:0 12px 40px rgba(0,0,0,.16);
	font-family:inherit;
	line-height:1.4;
	transform:translateX(0);
	opacity:1;
	visibility:visible;
	transition:transform .5s cubic-bezier(.32,.72,0,1), opacity .35s ease .1s, visibility 0s;
}
.tvmf-lightbox:focus{outline:none;}

.tvmf-lightbox[data-state="closed"]{
	transform:translateX(calc(100% + 48px));
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	transition:transform .5s cubic-bezier(.32,.72,0,1), opacity .4s ease, visibility 0s linear .5s;
}
.tvmf-lightbox[data-state="init"],
.tvmf-lightbox-tab[data-state="init"]{
	transform:translateX(calc(100% + 48px));
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	transition:none;
}
.tvmf-lightbox[data-state="open"].is-pulse{
	transform-origin:100% 100%;
	animation:tvmf-lightbox-pulse 1s ease-in-out 2;
}
@keyframes tvmf-lightbox-pulse{
	0%, 100%{
		scale:1;
		box-shadow:0 12px 40px rgba(0,0,0,.16);
	}
	50%{
		scale:1.04;
		box-shadow:0 18px 50px rgba(0,0,0,.22);
	}
}

.tvmf-lightbox__eyebrow{
	margin:0 0 6px;
	font-size:11px;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:#6b7280;
}
.tvmf-lightbox__title{
	margin:0 0 16px;
	padding-right:18px;
	font-size:17px;
	font-weight:600;
}
.tvmf-lightbox__btn{
	display:block;
	width:100%;
	padding:13px 16px;
	background:#000;
	color:#fff !important;
	border-radius:10px;
	font-size:14px;
	font-weight:600;
	text-align:center;
	text-decoration:none !important;
	transition:transform .15s ease, opacity .15s ease;
}
.tvmf-lightbox__btn:hover{
	opacity:.88;
	transform:translateY(-1px);
}

.tvmf-lightbox__close{
	position:absolute;
	top:10px;
	right:10px;
	width:28px;
	height:28px;
	padding:0;
	display:flex;
	align-items:center;
	justify-content:center;
	background:none;
	border:0;
	border-radius:50%;
	color:#6b7280;
	cursor:pointer;
}
.tvmf-lightbox__close:hover{
	background:rgba(0,0,0,.06);
	color:#000;
}
.tvmf-lightbox__close svg{
	width:16px;
	height:16px;
	fill:none;
}
.tvmf-lightbox__btn:focus-visible,
.tvmf-lightbox__close:focus-visible{
	outline:2px solid #000;
	outline-offset:3px;
}

/* Onglets verticaux, empiles au bord droit : le premier en bas. */
.tvmf-lightbox-tabs{
	position:fixed;
	right:0;
	bottom:32px;
	z-index:99997;
	display:flex;
	flex-direction:column-reverse;
	align-items:flex-end;
	gap:8px;
	pointer-events:none;
}
.tvmf-lightbox-tab{
	padding:16px 10px;
	background:#111418;
	color:#fff;
	border:0;
	border-radius:10px 0 0 10px;
	box-shadow:-4px 4px 20px rgba(0,0,0,.18);
	font-family:inherit;
	font-size:12px;
	font-weight:700;
	line-height:1.2;
	letter-spacing:.14em;
	text-transform:uppercase;
	cursor:pointer;
	transform:translateX(100%);
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	transition:transform .45s cubic-bezier(.32,.72,0,1), opacity .3s ease, visibility 0s linear .45s, padding-right .15s ease;
}
#tvmf-lightbox-2-tab{
	background:#B08D57;
}
.tvmf-lightbox-tab span{
	display:block;
	writing-mode:vertical-rl;
	transform:rotate(180deg);
}
.tvmf-lightbox-tab[data-state="closed"]{
	transform:translateX(0);
	opacity:1;
	visibility:visible;
	pointer-events:auto;
	transition:transform .45s cubic-bezier(.32,.72,0,1) .15s, opacity .3s ease .15s, visibility 0s, padding-right .15s ease;
}
.tvmf-lightbox-tab[data-state="closed"]:hover{
	padding-right:14px;
}
.tvmf-lightbox-tab:focus-visible{
	outline:2px solid #fff;
	outline-offset:-6px;
}

@supports (padding:max(0px)){
	.tvmf-lightbox{
		bottom:max(24px, env(safe-area-inset-bottom));
	}
}

@media (prefers-reduced-motion:reduce){
	.tvmf-lightbox,
	.tvmf-lightbox-tab{
		transition-duration:.01ms;
	}
	.tvmf-lightbox[data-state="open"].is-pulse{
		animation:none;
	}
	.tvmf-lightbox__btn{
		transition:none;
	}
}

@media (max-width:600px){
	.tvmf-lightbox{
		right:12px;
		left:12px;
		bottom:max(12px, env(safe-area-inset-bottom));
		width:auto;
		padding:18px 18px 16px;
	}
	.tvmf-lightbox__eyebrow{display:none;}
	.tvmf-lightbox__title{
		font-size:15px;
		margin-bottom:12px;
	}
	.tvmf-lightbox-tabs{bottom:20px;}
	.tvmf-lightbox-tab{
		padding:14px 9px;
		font-size:11px;
	}
}