/* Sélecteur de langue FR / EN et fenêtre de suggestion. Utilise les variables de chaque page. */
html.i18n-wait body{visibility:hidden;animation:i18n-show 0s 1.5s forwards}
@keyframes i18n-show{to{visibility:visible}}

.lang{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:2px;background:var(--surface,transparent);flex:none}
.lang button{font:600 13px/1 var(--body,inherit);letter-spacing:.04em;color:var(--muted);background:transparent;border:0;border-radius:999px;padding:7px 10px;cursor:pointer;min-width:38px}
.lang button:hover{color:var(--ink)}
.lang button[aria-pressed="true"]{background:var(--green,var(--blue));color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lang button[aria-pressed="true"]{color:#0E1824}}
:root[data-theme="dark"] .lang button[aria-pressed="true"]{color:#0E1824}

.lang-pop{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:30;width:min(360px,calc(100% - 40px));background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:18px 18px 16px;box-shadow:0 24px 48px -20px rgba(10,40,70,.45);animation:lang-in .35s cubic-bezier(.2,.8,.2,1) both}
@keyframes lang-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.lang-pop{animation:none}}
.lang-pop strong{display:block;font:700 17px/1.25 var(--display,inherit);margin-bottom:4px}
.lang-pop p{font-size:15px;line-height:1.45;color:var(--muted);margin:0 0 14px}
.lang-pop .row{display:flex;gap:10px;flex-wrap:wrap}
.lang-pop button{font:600 15px var(--body,inherit);border-radius:10px;padding:10px 16px;cursor:pointer;border:1.5px solid var(--line);background:var(--surface);color:var(--ink)}
.lang-pop button:hover{border-color:var(--ink)}
.lang-pop button.go{background:var(--green,var(--blue));border-color:transparent;color:#fff}
.lang-pop button.go:hover{background:var(--green-deep,var(--blue-deep))}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lang-pop button.go{color:#0E1824}}
:root[data-theme="dark"] .lang-pop button.go{color:#0E1824}
@media (max-width:520px){.lang-pop{left:20px;right:20px;width:auto}}
@media (max-width:480px){
  .nav{gap:8px}
  .nav-right{gap:8px}
  .nav .brand{font-size:17px;gap:6px}
  .nav .brand img{width:28px;height:26px}
  .nav .btn-sm{padding:8px 10px;font-size:13px}
  .lang button{padding:6px 7px;min-width:30px;font-size:12px}
}
@media (max-width:400px){
  .nav .brand{font-size:0;gap:0} /* petit écran : seul le logo, le nom reste lu par les lecteurs d'écran (aria-label) */
  .nav .brand img{width:34px;height:32px}
}