/**
 * @author Gilles Capelluto - MOLDEREZ-CONSULT
 * @purpose-fr Sélecteur de langue du chat : langue active visible, panneau en feuille du bas sur mobile, cibles de 44 px minimum.
 * @purpose-en Chat language picker: active language always visible, panel as a bottom sheet on mobile, 44 px minimum targets.
 * @audit-scope asset
 * @inputs-fr Classes .ufm-lang* du <details> rendu par le chat.
 * @inputs-en The .ufm-lang* classes of the <details> rendered by the chat.
 * @effects-fr Règles de présentation uniquement.
 * @effects-en Presentation rules only.
 */
.ufm-lang{position:relative;justify-self:end}
.ufm-lang-trigger{min-height:46px;padding:0 14px;display:flex;align-items:center;gap:8px;border:1px solid #e2dcea;border-radius:15px;color:#251a3d;background:rgb(255 255 255/.9);box-shadow:0 6px 18px #2417370f;font-weight:800;cursor:pointer;list-style:none;user-select:none}
.ufm-lang-trigger::-webkit-details-marker{display:none}
.ufm-lang-trigger::after{content:"";width:8px;height:8px;margin-left:2px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.ufm-lang[open] .ufm-lang-trigger::after{transform:translateY(2px) rotate(225deg)}
.ufm-lang-trigger b{font-size:.92rem}
.ufm-lang-trigger small{padding:2px 6px;border-radius:6px;color:#4b3575;background:#ece5f5;font-size:.68rem;font-weight:850}
.ufm-lang-trigger:hover{background:#fff}
.ufm-lang-trigger:focus-visible{outline:3px solid #5b3a80;outline-offset:2px}
.ufm-lang-panel{position:absolute;z-index:40;right:0;top:calc(100% + 8px);width:min(380px,calc(100vw - 32px));max-height:min(70vh,560px);padding:14px;display:flex;flex-direction:column;gap:10px;overflow:auto;border:1px solid #e2dcea;border-radius:18px;color:#171327;background:#fff;box-shadow:0 22px 60px #24173733}
.ufm-lang-head{display:flex;align-items:center;gap:8px}
.ufm-lang-head strong{font-size:1rem}
.ufm-lang-head small{color:#5f5869;font-size:.74rem;font-weight:750}
.ufm-lang-close{width:44px;height:44px;margin-left:auto;border:0;border-radius:12px;color:#251a3d;background:#f3eff7;font-size:1.4rem;line-height:1;cursor:pointer}
.ufm-lang-close:focus-visible,.ufm-lang-filter:focus-visible,.ufm-lang-list a:focus-visible{outline:3px solid #5b3a80;outline-offset:2px}
.ufm-lang-filter{min-height:44px;padding:0 12px;border:1px solid #d9d1df;border-radius:12px;color:#171327;background:#faf8fc;font:inherit}
.ufm-lang-label{margin:2px 0 -4px;color:#5f5869;font-size:.7rem;font-weight:850;letter-spacing:.06em;text-transform:uppercase}
.ufm-lang-list{margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;list-style:none}
.ufm-lang-list[data-lang-suggested]{padding-bottom:10px;border-bottom:1px solid #eee8f3}
.ufm-lang-list a{min-height:44px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid #eee8f3;border-radius:12px;color:#171327;background:#fff;text-decoration:none;font-weight:700}
.ufm-lang-list a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ufm-lang-list a small{flex:none;color:#5f5869;font-size:.66rem;font-weight:850}
.ufm-lang-list a:hover{border-color:#cbbde0;background:#faf7fd}
.ufm-lang-list a[aria-current]{border-color:#33204e;color:#fff;background:#33204e}
.ufm-lang-list a[aria-current] small{color:#e6dcf3}
.ufm-lang-list a[aria-current] small::before{content:"✓ "}
.ufm-lang-empty{margin:0;color:#5f5869;font-size:.85rem}

/* Phones: bottom sheet over a dimmed page. */
@media(max-width:620px){
  .ufm-lang-trigger{padding:0 10px}
  .ufm-lang-trigger b{max-width:28vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ufm-lang[open]::before{content:"";position:fixed;inset:0;z-index:39;background:#17132766}
  .ufm-lang-panel{position:fixed;left:0;right:0;top:auto;bottom:0;width:auto;max-height:82vh;padding:16px 16px max(16px,env(safe-area-inset-bottom));border-radius:22px 22px 0 0}
}
@media(prefers-reduced-motion:no-preference){.ufm-lang[open] .ufm-lang-panel{animation:ufm-lang-in .16s ease-out}}
@keyframes ufm-lang-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(forced-colors:active){.ufm-lang-trigger,.ufm-lang-list a,.ufm-lang-close{border:1px solid ButtonText}.ufm-lang-list a[aria-current]{outline:2px solid Highlight}}
/* Right-to-left pages: the trigger sits on the left, so the panel opens towards the page. */
[dir=rtl] .ufm-lang-panel{right:auto;left:0}
@media(max-width:620px){[dir=rtl] .ufm-lang-panel{left:0;right:0}}

/* Touch target of at least 44 px. */
.ufm-lang-close{min-width:44px;min-height:44px}
