/* ====================================================================
   SELECTEUR DE PAYS / LANGUE (en-tete) : drapeau + fleche (+ code sur
   grand ecran), qui ouvre la liste des pays. Meme principe que la capture
   de reference (« CAD $ ˅ » -> liste), aux couleurs du site.

   Le declencheur est un LIEN (<a role="button">) : il herite ainsi des
   couleurs que le theme donne aux liens de l'en-tete, blanc sur l'image,
   et leurs variantes quand l'en-tete devient « collant ».
   ==================================================================== */

.lmc-pays {
	position: relative;
	display: inline-flex;
	align-items: center;
	margin-right: 2px;
}

.lmc-pays a.lmc-pays__bouton {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	padding: 8px 6px;
	border: 0;
	border-radius: 2px;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
}

.lmc-pays a.lmc-pays__bouton:hover,
.lmc-pays a.lmc-pays__bouton:focus-visible {
	background: rgba(255, 255, 255, 0.16);
}

.lmc-pays a.lmc-pays__bouton:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 1px;
}

.lmc-pays .lmc-pays__drapeau {
	display: block;
	flex: 0 0 auto;
	width: 22px;
	height: 15px;
	border-radius: 2px;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18);
}

.lmc-pays .lmc-pays__fleche {
	display: block;
	flex: 0 0 auto;
	transition: transform 0.18s ease;
}

.lmc-pays--ouvert .lmc-pays__fleche {
	transform: rotate(180deg);
}

/* Le menu principal occupe le centre de l'en-tete : sous 1500 px il ne reste
   de la place que pour le drapeau et la fleche. Le code (FR, US, ES) apparait
   des que l'ecran est assez large. */
.lmc-pays .lmc-pays__code {
	display: none;
}

/* Le menu est centré dans un conteneur de 1140 px quelle que soit la largeur de l'écran : le français (menu
   le plus long, ~740 px) frôlait le déroulant. Le déroulant reste compact (drapeau et flèche) à toutes les
   largeurs et les icônes de droite sont un peu plus rapprochées (24 -> 14 px), ce qui laisse de la marge. */
@media (min-width: 1200px) {
	.header-main:has(.lmc-pays) .header-right-items > * {
		margin-left: 14px;
	}

	.lmc-pays a.lmc-pays__bouton {
		padding: 8px 4px;
	}
}

/* ------------------------------------------------------------- Liste */
.lmc-pays ul.lmc-pays__liste {
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 1100;
	display: none;
	min-width: 230px;
	margin: 8px 0 0;
	padding: 6px 0;
	list-style: none;
	background: #fff;
	border: 1px solid rgba(13, 34, 50, 0.18);
	box-shadow: 0 12px 28px rgba(13, 34, 50, 0.16);
	text-align: left;
}

/* Avec le script : c'est la classe qui ouvre. Sans lui : survol et focus. */
.lmc-pays--js.lmc-pays--ouvert ul.lmc-pays__liste,
.lmc-pays:not(.lmc-pays--js):hover ul.lmc-pays__liste,
.lmc-pays:not(.lmc-pays--js):focus-within ul.lmc-pays__liste {
	display: block;
}

.lmc-pays ul.lmc-pays__liste li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.lmc-pays a.lmc-pays__lien {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 16px;
	border: 0;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.3;
	text-transform: none;
	text-decoration: none;
	color: #0d2232;
	background: transparent;
}

.lmc-pays a.lmc-pays__lien:hover,
.lmc-pays a.lmc-pays__lien:focus-visible {
	background: #ebf2f8;
	color: #0d2232;
}

.lmc-pays a.lmc-pays__lien--actif {
	font-weight: 700;
}

.lmc-pays .lmc-pays__texte {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.lmc-pays .lmc-pays__langue {
	font-size: 12px;
	font-weight: 400;
	color: rgba(13, 34, 50, 0.6);
}

.lmc-pays ul.lmc-pays__liste .lmc-pays__drapeau {
	box-shadow: 0 0 0 1px rgba(13, 34, 50, 0.2);
}

/* Entre 1024 et 1200 px le menu du theme occupe deja toute la largeur de
   l'en-tete : le deroulant cede la place aux liens du menu mobile et du pied de page. */
@media (max-width: 1199px) {
	.header-main .lmc-pays {
		display: none;
	}
}

/* ------------------------------------- Drapeaux en image (menu mobile, pied de page) */
:root {
	--lmc-drapeau-fr: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Crect width='1' height='2' fill='%230055a4'/%3E%3Crect x='1' width='1' height='2' fill='%23fff'/%3E%3Crect x='2' width='1' height='2' fill='%23ef4135'/%3E%3C/svg%3E");
	--lmc-drapeau-us: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 13'%3E%3Crect width='19' height='13' fill='%23fff'/%3E%3Crect y='0' width='19' height='1' fill='%23b22234'/%3E%3Crect y='2' width='19' height='1' fill='%23b22234'/%3E%3Crect y='4' width='19' height='1' fill='%23b22234'/%3E%3Crect y='6' width='19' height='1' fill='%23b22234'/%3E%3Crect y='8' width='19' height='1' fill='%23b22234'/%3E%3Crect y='10' width='19' height='1' fill='%23b22234'/%3E%3Crect y='12' width='19' height='1' fill='%23b22234'/%3E%3Crect width='7.6' height='7' fill='%233c3b6e'/%3E%3Ccircle cx='0.9' cy='0.9' r='0.28' fill='%23fff'/%3E%3Ccircle cx='2.45' cy='0.9' r='0.28' fill='%23fff'/%3E%3Ccircle cx='4' cy='0.9' r='0.28' fill='%23fff'/%3E%3Ccircle cx='5.55' cy='0.9' r='0.28' fill='%23fff'/%3E%3Ccircle cx='7.1' cy='0.9' r='0.28' fill='%23fff'/%3E%3Ccircle cx='8.65' cy='0.9' r='0.28' fill='%23fff'/%3E%3Ccircle cx='1.7' cy='2.2' r='0.28' fill='%23fff'/%3E%3Ccircle cx='3.25' cy='2.2' r='0.28' fill='%23fff'/%3E%3Ccircle cx='4.8' cy='2.2' r='0.28' fill='%23fff'/%3E%3Ccircle cx='6.35' cy='2.2' r='0.28' fill='%23fff'/%3E%3Ccircle cx='7.9' cy='2.2' r='0.28' fill='%23fff'/%3E%3Ccircle cx='0.9' cy='3.5' r='0.28' fill='%23fff'/%3E%3Ccircle cx='2.45' cy='3.5' r='0.28' fill='%23fff'/%3E%3Ccircle cx='4' cy='3.5' r='0.28' fill='%23fff'/%3E%3Ccircle cx='5.55' cy='3.5' r='0.28' fill='%23fff'/%3E%3Ccircle cx='7.1' cy='3.5' r='0.28' fill='%23fff'/%3E%3Ccircle cx='8.65' cy='3.5' r='0.28' fill='%23fff'/%3E%3Ccircle cx='1.7' cy='4.8' r='0.28' fill='%23fff'/%3E%3Ccircle cx='3.25' cy='4.8' r='0.28' fill='%23fff'/%3E%3Ccircle cx='4.8' cy='4.8' r='0.28' fill='%23fff'/%3E%3Ccircle cx='6.35' cy='4.8' r='0.28' fill='%23fff'/%3E%3Ccircle cx='7.9' cy='4.8' r='0.28' fill='%23fff'/%3E%3Ccircle cx='0.9' cy='6.1' r='0.28' fill='%23fff'/%3E%3Ccircle cx='2.45' cy='6.1' r='0.28' fill='%23fff'/%3E%3Ccircle cx='4' cy='6.1' r='0.28' fill='%23fff'/%3E%3Ccircle cx='5.55' cy='6.1' r='0.28' fill='%23fff'/%3E%3Ccircle cx='7.1' cy='6.1' r='0.28' fill='%23fff'/%3E%3Ccircle cx='8.65' cy='6.1' r='0.28' fill='%23fff'/%3E%3C/svg%3E");
}


.lmc-pays__drapeau-css {
	display: inline-block;
	flex: 0 0 auto;
	width: 22px;
	height: 15px;
	border-radius: 2px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	box-shadow: 0 0 0 1px rgba(128, 128, 128, 0.45);
}

.lmc-pays__drapeau-css--fr {
	background-image: var(--lmc-drapeau-fr);
}

.lmc-pays__drapeau-css--us {
	background-image: var(--lmc-drapeau-us);
}

/* --------------------------------------------- Menu mobile (plein ecran) */
/* Le theme ne conserve que le lien et son texte : tout passe par la classe du <li>. */
li.lmc-pays-mobile--premier {
	margin-top: 22px !important;
	padding-top: 14px !important;
	border-top: 1px solid rgba(13, 34, 50, 0.18) !important;
}

li.lmc-pays-mobile > a {
	display: flex !important;
	align-items: center;
	gap: 12px;
	font-size: 15px !important;
	letter-spacing: 0.02em !important;
	text-transform: none !important;
}

li.lmc-pays-mobile > a::before {
	content: "";
	flex: 0 0 auto;
	width: 22px;
	height: 15px;
	border-radius: 2px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	box-shadow: 0 0 0 1px rgba(128, 128, 128, 0.45);
}

li.lmc-pays-mobile--fr > a::before {
	background-image: var(--lmc-drapeau-fr);
}

li.lmc-pays-mobile--us > a::before {
	background-image: var(--lmc-drapeau-us);
}

li.lmc-pays-mobile--actif > a {
	font-weight: 700;
}
/* -------------------------------------------------------- Pied de page */
.lmc-footer .lmc-footer__pays {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 28px;
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.lmc-footer .lmc-footer__pays a.lmc-footer__pays__lien {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: 13px;
	letter-spacing: 0.03em;
	text-decoration: none;
	color: inherit;
}

.lmc-footer .lmc-footer__pays a.lmc-footer__pays__lien:hover {
	text-decoration: underline;
}

.lmc-footer .lmc-footer__pays .lmc-footer__pays__lien--actif {
	font-weight: 700;
}

.lmc-footer .lmc-footer__pays .lmc-pays__drapeau-css {
	width: 20px;
	height: 14px;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35);
}