/* Copied as is from Tempo (webacappella.lite), packages/portal/studio/engine/lang-switch.css, on
   2026-10-13, like the menu files beside it: its colours come through the --wpl-* variables set in
   public/www.css, never by rewriting a rule here. To update it, copy the file again. */

/* ---------- Sélecteur de langue du chrome (renderLangSwitch, les deux moteurs) ----------
   UN fichier, deux consommateurs : les sites clients (importé par site.css pour l'éditeur, lu
   par buildCssBundle à la publication) et l'en-tête du site officiel, qui l'inline
   (portal/src/official/langs.ts) au lieu d'en tenir une copie. Sorti de site.css le 2026-09-29,
   le jour où le site officiel a pris le globe : c'est la même histoire que wfm-effects.css.

   Couleurs de la barre = jetons de SURFACE (--c-link, --c-link-h, --c-head) : justes sur une
   barre claire, sombre, en dégradé ou sur photo, sans une règle par surface. La liste ouverte
   flotte AU-DESSUS du contenu : elle a sa propre surface claire, comme la bulle de sous-menu,
   donc des couleurs fixes et non les jetons de la barre (encre claire sur fond clair sinon,
   en-tête sombre).

   VARIABLES --wpl-* : chacune est en tête de ses replis, et AUCUNE n'est déclarée ici. Un site
   client ne les pose pas, le repli donne exactement la valeur d'avant ; le site officiel les pose
   sur son en-tête, parce que sa palette n'est pas un thème client. */

/* Présentation des icônes du sprite, pour une page qui n'a pas le `.i` de site.css (le site
   officiel). Même poids que `.i` (0,1,0, :where ne compte pas) et placée AVANT site.css dans les
   deux assemblages : chez un client, c'est `.i` qui l'emporte, à valeurs égales. */
:where(.wp-langs) .i{width:1em;height:1em;flex:none;display:inline-block;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wp-langs-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.wp-langs--menu{position:relative;font-size:.92rem;font-weight:600}
.wp-langs--menu > summary{display:flex;align-items:center;gap:6px;min-height:40px;padding:0 10px;border-radius:var(--wpl-radius,var(--radius-btn));color:var(--wpl-color,var(--c-link,var(--ink-2)));cursor:pointer;list-style:none;white-space:nowrap}
.wp-langs--menu > summary::-webkit-details-marker{display:none}
.wp-langs--menu > summary:hover{color:var(--wpl-hover,var(--c-link-h,var(--brand-readable)))}
.wp-langs--menu > summary:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.wp-langs-globe .i{width:1.15em;height:1.15em}
.wp-langs-code{letter-spacing:.04em}
.wp-langs-chev .i{width:.9em;height:.9em;transition:transform .15s}
.wp-langs--menu[open] .wp-langs-chev .i{transform:rotate(180deg)}
.wp-langs--menu .wp-langs-list{position:absolute;top:calc(100% + 6px);right:0;z-index:60;min-width:11rem;margin:0;padding:6px;list-style:none;background:var(--wpl-pop-bg,var(--surface));border:1px solid var(--wpl-pop-border,var(--line));border-radius:var(--wpl-pop-radius,var(--radius-sm,12px));box-shadow:var(--wpl-pop-shadow,var(--shadow))}
.wp-langs--menu .wp-langs-list a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;border-radius:var(--wpl-item-radius,var(--radius-sm,8px));color:var(--wpl-item-color,var(--ink));font-weight:500;text-decoration:none;white-space:nowrap}
.wp-langs--menu .wp-langs-list a:hover{background:var(--wpl-item-hover,var(--brand-08))}
.wp-langs--menu .wp-langs-list a[aria-current]{font-weight:700}
.wp-langs--menu .wp-langs-check{color:var(--wpl-accent,var(--brand-readable))}
/* Pied de page : liens directs en ligne, dans le corps de texte du pied (pas de taille propre). */
.wp-langs--list .wp-langs-list{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;padding:0;list-style:none}
.wp-langs--list a{color:var(--c-link,var(--ink-2));text-decoration:none}
.wp-langs--list a:hover{color:var(--c-link-h,var(--brand-readable))}
.wp-langs--list a[aria-current]{color:var(--c-head,var(--ink))}
.wp-langs--list .wp-langs-check{display:none}
/* PAS de règle de PLACE ici (masquer le globe sur téléphone, le compacter) : elle dépend de ce
   que la rangée porte d'autre. header_01 le masque sous 640 px à cause de son bouton d'action
   (site.css) ; le site officiel, sans bouton, le garde et le compacte (official/langs.ts). */