/* ==========================================================================
   RestoLive — Bandeau pays
   Ancré en bas d'écran pour ne pas repousser le contenu ni gêner le bandeau
   cookies, qui occupe déjà le bas de page sur la première visite.
   ========================================================================== */

.rl-geo {
	position: fixed;
	left: 50%;
	bottom: 18px;
	z-index: 9998;
	display: flex;
	align-items: center;
	gap: 14px;
	max-width: min(680px, calc(100vw - 32px));
	padding: 13px 14px 13px 18px;
	background: #fff;
	border: 1px solid var(--rl-line);
	border-radius: 999px;
	box-shadow: 0 18px 44px -14px rgba(20, 24, 31, .3), 0 2px 6px rgba(20, 24, 31, .06);
	opacity: 0;
	transform: translateX(-50%) translateY(14px);
	transition: opacity .26s ease, transform .26s ease;
	pointer-events: none;
}

.rl-geo--visible {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
	pointer-events: auto;
}

.rl-geo__text {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 10px;
	margin: 0;
	font-size: 15px;
	line-height: 1.4;
	color: var(--rl-ink);
}

.rl-geo__flag {
	font-size: 20px;
	line-height: 1;
}

.rl-geo__link {
	font-weight: 700;
	color: var(--rl-orange-dark);
	text-decoration: underline;
	text-underline-offset: 2px;
	white-space: nowrap;
}

.rl-geo__link:hover {
	color: var(--rl-orange);
}

.rl-geo__close {
	flex: 0 0 30px;
	width: 30px;
	height: 30px;
	margin-left: auto;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--rl-bg-soft);
	color: var(--rl-body);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	transition: background .18s ease, color .18s ease;
}

.rl-geo__close:hover {
	background: var(--rl-orange-soft);
	color: var(--rl-orange-dark);
}

.rl-geo__close:focus-visible {
	outline: 2px solid var(--rl-orange);
	outline-offset: 2px;
}

/* Le bandeau cookies occupe le bas d'écran tant qu'aucun choix n'est fait. */
body.cookies-not-set .rl-geo {
	bottom: 96px;
}

@media (max-width: 620px) {
	.rl-geo {
		left: 16px;
		right: 16px;
		bottom: 14px;
		max-width: none;
		border-radius: 18px;
		transform: translateY(14px);
		align-items: flex-start;
	}

	.rl-geo--visible {
		transform: translateY(0);
	}

	.rl-geo__text {
		font-size: 14.5px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rl-geo {
		transition: none;
	}
}
