/* UPD_ADAPTIVE_FINAL_CLEAN_START */

/*
  Общая адаптивность.
  Важно: ширину scanner4.html больше не регулируем здесь,
  чтобы не конфликтовать с его финальным inline-фиксатором.
*/

html {
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

*, *::before, *::after {
  box-sizing: inherit;
}

body {
  min-width: 0;
  overflow-x: hidden;
}

img,
svg,
canvas,
video {
  max-width: 100%;
}

input,
select,
textarea,
button {
  max-width: 100%;
}

/* settings.html */
body > h1,
body > .card,
body > #productsBaseConverterPanel,
body > #reportEmailSettingsPanel {
  width: min(100%, 1180px) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Шапки не ограничиваем */
body > .header,
.header {
  max-width: none !important;
}

/* login.html */
body:has(.login-logo) > .card,
body > .login-card,
body > .login-box,
body > .auth-card,
body > form {
  width: min(100%, 420px) !important;
  max-width: 420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Модалки */
.modal {
  width: min(96vw, 980px) !important;
  max-height: calc(100dvh - 32px) !important;
  overflow: auto !important;
}

@media (max-width: 640px) {
  input,
  select,
  textarea {
    font-size: 16px !important;
  }

  .card {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .modal {
    width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 14px !important;
  }
}

@media (max-width: 380px) {
  .card {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

/* UPD_ADAPTIVE_FINAL_CLEAN_END */

/* iOS safe-area fix for Dynamic Island / notch.
   Не меняет сетку и размеры кнопок, только добавляет верхний внутренний отступ шапке. */
@supports (padding-top: env(safe-area-inset-top)) {
  @media screen and (max-width: 900px) {
    .app-header,
    .topbar,
    .header,
    header {
      padding-top: max(12px, env(safe-area-inset-top)) !important;
    }

    .app-header.sticky,
    .topbar.sticky,
    .header.sticky,
    header.sticky {
      top: 0 !important;
    }
  }
}