/****************************
Le menu déroulant des actions
****************************/
	.header_text_block {
		position: relative;
		display: flex;
		flex-direction: column;
		width: 100%;
		padding-bottom: 50px; /* Espace pour laisser le bouton en bas à droite */
	}

	/* Positionnement par défaut (Mobile & PC) */
	.header_actions_dropdown {
		position: absolute;
		bottom: 0;
		right: 0;
		display: inline-block;
	}

	/* Style du bouton */
	.dropdown_button {
		background-color: #FFFFFF;
		color: #4A5568;
		padding: 8px 14px;
		font-size: 13px;
		font-weight: 500;
		border: 1px solid #E2E8F0;
		border-radius: 6px;
		cursor: pointer;
		display: flex;
		align-items: center;
		gap: 6px;
		transition: all 0.2s ease;
		-webkit-tap-highlight-color: transparent; /* Désactive le flash bleu sur mobile */
	}

	/* --- STYLE DE LA FLÈCHE INITIALE --- */
	.dropdown_button .arrow {
		display: inline-block;
		font-size: 10px;
		margin-left: 4px;
		/* Transition fluide pour l'animation de rotation */
		transition: transform 0.2s ease; 
	}

	/* --- ANIMATION DE LA FLÈCHE --- */

	/* Sur PC : Rotation de la flèche au survol du conteneur */
	@media (min-width: 1025px) {
		.header_actions_dropdown:hover .dropdown_button .arrow {
			transform: rotate(180deg);
		}
	}

	/* Sur Mobile / Tablette : Rotation de la flèche au clic (quand la classe active est présente) */
	.header_actions_dropdown.is-active .dropdown_button .arrow {
		transform: rotate(180deg);
	}

	/* --- S'OUVRE VERS LE HAUT PAR DÉFAUT --- */
	.dropdown_menu {
		position: absolute;
		bottom: calc(100% + 8px); /* Position initiale en haut */
		right: 0;
		background-color: #FFFFFF;
		min-width: 250px;
		box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
		z-index: 100;
		border-radius: 8px;
		border: 1px solid #E2E8F0;
		list-style: none;
		padding: 6px 0;
		margin: 0;

		/* État masqué avec translation vers le bas (effet d'apparition vers le haut) */
		opacity: 0;
		visibility: hidden;
		transform: translateY(10px);
		transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
	}

	/* --- INVERSION : S'OUVRE VERS LE BAS SI MANQUE DE PLACE --- */
	.header_actions_dropdown.open-down .dropdown_menu {
		bottom: auto;
		top: calc(100% + 8px); /* Bascule en bas du bouton */
		transform: translateY(-10px); /* Inversion de l'animation */
		box-shadow: 0 10px 15px 3px rgba(0, 0, 0, 0.05);
	}

	/* --- AFFICHAGE ACTIF (Sert pour le Hover PC et le Clic Mobile) --- */
	.header_actions_dropdown:hover .dropdown_menu,
	.header_actions_dropdown.is-active .dropdown_menu {
		/* Écrans PC (hover) et Mobile (is-active) gérés proprement */
		opacity: 1;
		visibility: visible;
		transform: translateY(0) !important; /* Force l'état final de l'animation */
	}

	.dropdown_menu li a {
		padding: 12px 16px; /* Légèrement plus grand pour faciliter le clic sur smartphone */
		text-decoration: none;
		display: flex;
		align-items: center;
		gap: 10px;
	}

	.dropdown_menu li a iconify-icon {
		font-size: 180%;
	}

	.dropdown_menu li a:hover {
		color: #ABABAB;
		background: #FBFBFB;
	}

	/* --- LE MOTEUR D'AFFICHAGE --- */

	/* Version PC (Écrans de plus de 1024px) : On utilise le survol (:hover) */
	@media (min-width: 1025px) {
		.header_actions_dropdown:hover .dropdown_menu {
			opacity: 1;
			visibility: visible;
			transform: translateY(0);
		}

		.dropdown_button:hover {
			background-color: #F7FAFC;
		}
	}

	/* Version Mobile & Tablette : On utilise le clic (Classe injectée par JS) */
	.header_actions_dropdown.is-active .dropdown_menu {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	/* --- AJUSTEMENTS RESPONSIVE / ACCESSIBILITÉ MOBILE --- */
	@media (max-width: 768px) {
		.header_text_block {
			padding-bottom: 10px;
		}

		.dropdown_menu {
			min-width: 280px; /* Plus large sur tablette/mobile pour une meilleure lisibilité */
			max-width: 90vw;   /* Évite que le menu ne sorte de l'écran sur les téléphones très étroits */
		}
	}

	@media (max-width: 480px) {
		.header_actions_dropdown {
			/* Si le parent (.header_text_block) est trop étroit, 
			   on s'assure que le menu ne dépasse pas à droite de l'écran */
			position: relative; 
			display: flex;
			justify-content: flex-end;
			margin-top: 10px;
		}

		.header_wiki {
			flex-direction: column; /* Image au-dessus du texte sur téléphone */
		}

		.dropdown_menu {
			right: 0;
			left: auto; /* Reste calé à droite */
			min-width: 220px;
		}
	}
/****************************
*****************************
****************************/