/* ii world — i18n: language/currency switcher + country popup */

.lang-switcher{display:flex;align-items:center;gap:6px;margin-left:16px}
/* Desktop lang-switcher hidden below 1024px to match the breakpoint where
   the hamburger menu takes over (see components.css:474-501). Was 767px
   which created a 768-1023px dead zone — both the desktop switcher AND
   the mobile-menu switcher were hidden in that range. 2026-05-17 fix. */
@media (max-width: 1023px) {
  .lang-switcher { display: none; }
}
.nav__mobile-lang{display:flex;align-items:center;gap:6px;padding:16px 0 8px;margin-top:8px;border-top:1px solid var(--color-border-light)}
/* In-hamburger lang-switcher hidden at 1024px+ where the hamburger
   itself disappears. Was 768px — same dead-zone bug as above. */
@media (min-width: 1024px) {
  .nav__mobile-lang { display: none; }
}
.lang-link{color:var(--color-text-secondary);font-size:12px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;transition:color .2s;padding:12px 4px;min-height:44px;display:inline-flex;align-items:center;-webkit-tap-highlight-color:transparent}
.lang-link:hover,.lang-link.active{color:var(--color-text)}
.lang-sep{color:var(--color-border);font-size:12px}

.currency-switcher{display:flex;align-items:center;gap:6px;margin-left:8px}
#currency-select{background:transparent;color:var(--color-text-secondary);border:1px solid var(--color-border);border-radius:4px;padding:2px 6px;font-size:11px;letter-spacing:.06em;cursor:pointer;outline:none}
#currency-select:hover,#currency-select:focus{border-color:var(--color-accent);color:var(--color-text)}
#currency-select option{background:var(--color-bg-card);color:var(--color-text)}

/* Country confirmation popup */
.ii-country-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:10000;display:flex;align-items:center;justify-content:center;animation:iiOverlayIn .2s ease}
@keyframes iiOverlayIn{from{opacity:0}to{opacity:1}}
.ii-country-popup{background:var(--color-bg-card);color:var(--color-text);border-radius:12px;padding:32px;max-width:380px;width:90%;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.12);animation:iiPopIn .3s ease}
@keyframes iiPopIn{from{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}
.ii-country-text{font-size:16px;line-height:1.5;margin:0 0 8px}
.ii-country-sub{font-size:14px;color:var(--color-text-secondary);margin:0 0 24px}
.ii-country-actions{display:flex;gap:12px;justify-content:center}
.ii-country-btn{padding:10px 24px;border-radius:6px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}
.ii-country-yes{background:var(--color-accent);color:var(--color-bg)}
.ii-country-yes:hover{background:var(--color-text-secondary)}
.ii-country-no{background:var(--color-bg-alt);color:var(--color-text-secondary)}
.ii-country-no:hover{background:var(--color-border-light)}

/* --- Language-specific font overrides ---
   Lineal/Compagnon (Velvetyne) lack Cyrillic glyphs.
   Manrope substitutes Lineal; Literata substitutes Compagnon.
   Add more :root:lang() blocks for future scripts. */
:root:lang(uk) {
  --font-display: 'Manrope', 'Helvetica Neue', sans-serif;
  --font-editorial: 'Literata', Georgia, serif;
}

/* Manrope min weight=200 vs Lineal min=100. Only 404 page uses 100. */
:root:lang(uk) .error-page__code { font-weight: 200; }