/*
 * Menus de filtre des pages au design épuré (28/10/2026) : année (agenda financier, publications, communiqués, actualités
 * RSE, webcasts), catégorie des communiqués, type de webcast. Bouton arrondi « Année 2026 ⌄ » qui ouvre une carte
 * blanche : premier choix (« Toutes les années »…) séparé par un filet, puis la liste, qui défile si elle est longue ;
 * le choix en cours en rouge et coché. Les menus d'une page sont côte à côte dans une barre (div.fa-barre).
 * Gabarits : macro filtreAnnees (Classical/macros-epure.html.twig) ; script : filtre-annees.js.
 */
.fa-barre{
	--fa-rouge:#e40520;
	--fa-encre:#1d1d1b;
	--fa-gris:#6b6b6b;
	--fa-filet:#ebe6e4;
	--fa-fond:#f6f3f2;
	display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin:0 0 34px
}
.fa-menu{position:relative}
.fa-menu > summary{list-style:none}
.fa-menu > summary::-webkit-details-marker{display:none}
.fa-choix{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border-radius:999px;background:var(--fa-fond);color:var(--fa-encre);font:600 13px/1 'Poppins',Arial,sans-serif;white-space:nowrap;cursor:pointer;transition:background-color .15s,color .15s}
.fa-choix:hover{background:#eee8e6}
.fa-choix.est-choisi{color:var(--fa-rouge)}
.fa-choix:focus-visible{outline:2px solid var(--fa-rouge);outline-offset:2px}
.fa-fleche{width:12px;height:12px;transition:transform .2s}
.fa-menu[open] .fa-fleche{transform:rotate(180deg)}

/* Carte du menu */
.content .fa-barre .fa-liste{position:absolute;z-index:30;top:calc(100% + 10px);left:0;min-width:240px;max-height:min(360px,60vh);overflow-y:auto;overscroll-behavior:contain;margin:0;padding:6px;list-style:none;border:1px solid var(--fa-filet);border-radius:14px;background:#fff;box-shadow:0 14px 34px rgba(29,29,27,.12)}
.content .fa-barre .fa-annees .fa-liste{min-width:200px}
.content .fa-barre .fa-liste li{margin:0;padding:0;background:none}
.content .fa-barre .fa-liste li:before{display:none}
.content .fa-barre .fa-liste li:first-child{margin-bottom:4px;padding-bottom:4px;border-bottom:1px solid var(--fa-filet)}
.content .fa-barre .fa-option{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;margin:0;padding:10px 12px;border:0;border-radius:8px;background:none;color:var(--fa-gris);font:600 14px/1.3 'Poppins',Arial,sans-serif;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s,color .15s}
.content .fa-barre .fa-option:hover{background:var(--fa-fond);color:var(--fa-encre)}
.content .fa-barre .fa-option[aria-pressed="true"],.content .fa-barre .fa-option[aria-current="page"]{color:var(--fa-rouge)}
.content .fa-barre .fa-option:focus-visible{outline:2px solid var(--fa-rouge);outline-offset:-2px}
.fa-coche{flex:none;width:16px;height:16px;visibility:hidden}
.fa-option[aria-pressed="true"] .fa-coche,.fa-option[aria-current="page"] .fa-coche{visibility:visible}

/* Actualités RSE : les feuilles de la liste donnent un display aux articles, qui l'emportait sur l'attribut hidden */
.listing-actu [data-annee][hidden]{display:none!important}

/* Téléphone : la carte s'aligne sur le début de la barre, pour ne pas sortir de l'écran quand le menu est le second */
@media only screen and (max-width: 640px){
	.fa-barre{margin-bottom:28px}
	.fa-barre{position:relative}
	.fa-menu{position:static}
	.content .fa-barre .fa-liste{max-width:100%}
}
@media (prefers-reduced-motion: reduce){
	.fa-choix,.fa-fleche,.content .fa-barre .fa-option{transition:none}
}