/* ЯЗЫКИ — ОДИН СПИСОК НА ВЕСЬ ПРОЕКТ.
   Разметка: resources/views/components/language-picker.blade.php; поведение:
   language-picker.js; список языков: App\Services\AppLocale::NAMES.
   Флаги — одна картинка-спрайт (из пакета intl-tel-input, MIT): 22 флага вместо
   22 запросов, и они рисуются одинаково во всех системах, в отличие от эмодзи,
   которые в Windows показываются двумя буквами. */
.lang-flag{display:block;flex-shrink:0;width:20px;height:15px;border-radius:2px;
  background-image:url(/flags/flags.png?v=1);background-repeat:no-repeat;background-color:#dbdbdb;
  background-size:5652px 15px;box-shadow:0 0 1px 0 rgba(0,0,0,.45)}
@media (min-resolution:2x){ .lang-flag{background-image:url(/flags/flags@2x.png?v=1)} }
.lang-flag--ru{height:14px;background-position:-4295px 0}
.lang-flag--en{height:10px;background-position:-1775px 0}
.lang-flag--de{height:12px;background-position:-1269px 0}
.lang-flag--fr{height:14px;background-position:-1731px 0}
.lang-flag--es{height:14px;background-position:-1555px 0}
.lang-flag--it{height:14px;background-position:-2523px 0}
.lang-flag--pt{height:14px;background-position:-4141px 0}
.lang-flag--pl{height:13px;background-position:-4031px 0}
.lang-flag--nl{height:14px;background-position:-3752px 0}
.lang-flag--uk{height:14px;background-position:-5175px 0}
.lang-flag--tr{height:14px;background-position:-5065px 0}
.lang-flag--az{height:10px;background-position:-352px 0}
.lang-flag--kk{height:10px;background-position:-2853px 0}
.lang-flag--uz{height:10px;background-position:-5307px 0}
.lang-flag--zh{height:14px;background-position:-1049px 0}
.lang-flag--ja{height:14px;background-position:-2611px 0}
.lang-flag--ko{height:14px;background-position:-2787px 0}
.lang-flag--hi{height:14px;background-position:-2413px 0}
.lang-flag--bn{height:12px;background-position:-418px 0}
.lang-flag--id{height:14px;background-position:-2325px 0}
.lang-flag--vi{height:14px;background-position:-5434px 0}
.lang-flag--th{height:14px;background-position:-4911px 0}

/* ── сам список ──
   <details>: открывается без скрипта, и при выключенном JS язык всё равно меняется —
   ссылки ведут на /lang/{код}, а не на обработчик в браузере. */
.lang-picker{position:relative;font-size:14px}
.lang-picker__btn{list-style:none;display:flex;align-items:center;gap:8px;min-height:40px;padding:0 12px;
  border:1px solid var(--lang-border,#e3e6e3);border-radius:999px;background:var(--lang-bg,#fff);
  color:var(--lang-ink,#141916);cursor:pointer;user-select:none;white-space:nowrap}
.lang-picker__btn::-webkit-details-marker{display:none}
.lang-picker__btn:hover,.lang-picker[open] .lang-picker__btn{border-color:var(--lang-border-hover,#c7ccc7)}
.lang-picker__btn svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .15s}
.lang-picker[open] .lang-picker__btn svg{transform:rotate(180deg)}
.lang-picker__name{font-weight:600}
.lang-picker__list{position:absolute;z-index:60;top:calc(100% + 8px);right:0;margin:0;padding:6px;list-style:none;
  width:220px;max-height:min(420px,calc(100svh - 96px));overflow-y:auto;background:var(--lang-bg,#fff);
  border:1px solid var(--lang-border,#e3e6e3);border-radius:14px;box-shadow:0 12px 32px rgba(0,0,0,.14)}
.lang-picker--up .lang-picker__list{top:auto;bottom:calc(100% + 8px)}
.lang-picker--left .lang-picker__list{right:auto;left:0}
.lang-picker__list a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;
  color:var(--lang-ink,#141916);text-decoration:none}
.lang-picker__list a:hover{background:var(--lang-hover,#f4f6f4)}
.lang-picker__list a[aria-current]{background:var(--lang-active,#eceeec);font-weight:600}
.lang-picker__btn:focus-visible,.lang-picker__list a:focus-visible{outline:2px solid currentColor;outline-offset:2px}
/* На тёмном фоне (лендинг, тёмная тема) цвета задаются переменными, а не вторым набором правил. */
.lang-picker--dark{--lang-bg:#161e1a;--lang-ink:#f2f5f1;--lang-border:rgba(255,255,255,.18);
  --lang-border-hover:rgba(255,255,255,.34);--lang-hover:rgba(255,255,255,.08);--lang-active:rgba(255,255,255,.14)}