/* Settings popover, language switcher, install dialog */

.language-select:focus-visible {
      outline: 3px solid rgba(10,166,214,.28);
      outline-offset: 2px;
    }
.install-dialog {
      width: min(420px, calc(100% - 32px));
      border: 0;
      border-radius: 20px;
      padding: 0;
      color: var(--ink);
      box-shadow: 0 24px 70px rgba(10,28,44,.28);
    }
.install-dialog::backdrop { background: rgba(10,28,44,.52); backdrop-filter: blur(3px); }
.dialog-inner { padding: 24px; }
.dialog-inner h2 { margin: 0 0 8px; font-size: 21px; color: var(--navy); }
.dialog-inner p { margin: 0 0 18px; color: var(--muted); line-height: 1.5; }
.dialog-actions { display: flex; justify-content: flex-end; }
.language-switcher {
      position: absolute;
      top: 22px;
      right: 24px;
      z-index: 3;
      display: flex;
      align-items: center;
      gap: 5px;
      padding: 5px;
      border: 1px solid rgba(255,255,255,.2);
      border-radius: 15px;
      background: rgba(3,18,37,.58);
      box-shadow: 0 10px 26px rgba(0,0,0,.16);
      backdrop-filter: blur(12px);
    }
.language-flag {
      width: 43px;
      height: 34px;
      display: grid;
      place-items: center;
      padding: 0;
      border: 1px solid transparent;
      border-radius: 10px;
      background: transparent;
      cursor: pointer;
      transition: transform .16s ease, background .16s ease, border-color .16s ease;
    }
.language-flag:hover { transform: translateY(-1px); background: rgba(255,255,255,.08); }
.language-flag.active { background: rgba(17,201,239,.14); border-color: var(--accent); box-shadow: 0 0 0 2px rgba(17,201,239,.12); }
.language-flag img { width: 27px; height: 18px; display: block; object-fit: cover; border-radius: 4px; box-shadow: 0 1px 4px rgba(0,0,0,.24); }
.language-flag:focus-visible { outline: 3px solid rgba(17,201,239,.38); outline-offset: 2px; }
.install-btn { color: #fff; background: var(--navy); border-color: var(--navy); }
.install-btn:hover { color: #fff; background: var(--navy-2); border-color: var(--navy-2); }
@media (max-width: 700px) {
.language-switcher { top: 16px; right: 16px; }
}
@media print {
.language-switcher { display: none; }
}
.icon-close {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.84);
  border-radius: 50%;
  background: rgba(255,255,255,.54);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.96), 0 8px 18px rgba(36,68,113,.09);
  cursor: pointer;
}
.settings-scrim { position: fixed; z-index: 47; inset: 0; background: rgba(13,29,52,.10); backdrop-filter: blur(2px); animation: scrim-in .16s ease both; }
.settings-scrim[hidden] { display: none; }
.settings-popover {
  position: fixed;
  z-index: 50;
  top: 118px;
  right: max(18px, calc((100vw - 1120px)/2 + 18px));
  width: min(340px, calc(100vw - 28px));
  padding: 16px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 24px;
  background: rgba(249,252,255,.97);
  box-shadow: 0 24px 64px rgba(26,48,82,.19), inset 0 1px 0 #fff;
  backdrop-filter: blur(24px) saturate(140%);
  transform-origin: top right;
  animation: menu-in .2s cubic-bezier(.2,.8,.2,1) both;
}
.settings-popover[hidden] { display: none; }
.popover-head { display: flex; justify-content: space-between; align-items: center; }
.icon-close { width: 38px; height: 38px; }
.language-switcher { position: static; display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; margin-top: 14px; padding: 4px; border: 1px solid var(--sm-line); border-radius: 15px; background: rgba(229,237,248,.62); box-shadow: inset 0 1px 2px rgba(40,66,102,.05); }
.language-flag { width: 100%; height: 44px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 7px; border: 0; border-radius: 11px; color: #526580; background: transparent; cursor: pointer; }
.language-flag img { width: 26px; height: 18px; flex: 0 0 auto; display: block; object-fit: cover; border: 1px solid rgba(18,39,68,.1); border-radius: 5px; box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 2px 5px rgba(26,48,82,.16); }
.language-flag strong { display: block; min-width: 0; overflow: hidden; font-size: 12px; line-height: 1; font-weight: 780; text-overflow: ellipsis; white-space: nowrap; }
.language-flag.active { color: var(--sm-blue); background: #fff; box-shadow: 0 4px 12px rgba(36,68,113,.10); }
.language-flag.active img { box-shadow: 0 0 0 2px rgba(22,119,242,.14), 0 3px 7px rgba(26,48,82,.18); }
.menu-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 14px 0 0; }
.menu-actions .action-btn { width: 100%; }
.menu-actions .print-btn { grid-column: 1 / -1; }
.install-dialog { width: min(420px, calc(100% - 28px)); padding: 0; border: 0; border-radius: 26px; color: var(--sm-ink); background: rgba(248,251,255,.97); box-shadow: 0 30px 90px rgba(20,40,75,.28); }
.install-dialog::backdrop { background: rgba(22,33,55,.28); backdrop-filter: blur(10px); }
@media (max-width: 760px) {
.settings-popover { top: 90px; right: 10px; bottom: auto; left: auto; width: min(340px, calc(100vw - 20px)); border-radius: 23px; transform-origin: top right; animation-name: menu-in; transition: top .22s ease; }
}
@media print {
.settings-popover { display: none !important; }
}
