/*
 * CLEVER MOBILE HEADER + PROFILE CLEAN FIX V4
 *
 * Важно:
 * - не меняет display/visibility/opacity модального окна;
 * - не меняет его исходное позиционирование;
 * - не заставляет скрытую модалку отображаться;
 * - исправляет только мобильную шапку и порядок слоёв.
 */

@media (max-width: 767px) {
  .header[data-v-2cf0aac7],
  .header__top[data-v-2cf0aac7],
  .header__container[data-v-2cf0aac7],
  .header__inner-top[data-v-2cf0aac7],
  .header__user[data-v-2cf0aac7] {
    overflow: visible !important;
  }

  .header__container[data-v-2cf0aac7] {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;

    padding-left: max(
      10px,
      env(safe-area-inset-left)
    ) !important;

    padding-right: max(
      10px,
      env(safe-area-inset-right)
    ) !important;
  }

  .header__inner-top[data-v-2cf0aac7] {
    display: flex !important;
    align-items: center !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    gap: 6px !important;
  }

  .header__items[data-v-2cf0aac7] {
    display: none !important;
  }

  .header__logo[data-v-2cf0aac7] {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    overflow: hidden !important;
  }

  .header-logo {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .header-logo__image.clever-logo-holder {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 235px !important;
    height: 24px !important;

    background-size: contain !important;
    background-position: left center !important;
    background-repeat: no-repeat !important;
  }

  .kk-lang-switch {
    flex: 0 0 auto !important;

    display: flex !important;
    align-items: center !important;

    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;

    white-space: nowrap !important;
  }

  .kk-lang-btn {
    box-sizing: border-box !important;

    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;

    padding: 4px !important;
    margin: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    font-size: 11px !important;
    line-height: 1 !important;
  }

  .header__user[data-v-2cf0aac7] {
    flex: 0 0 40px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;

    margin: 0 !important;
    padding: 0 !important;

    position: relative !important;
    left: auto !important;
    right: auto !important;

    transform: none !important;

    visibility: visible !important;
    opacity: 1 !important;

    z-index: 100 !important;
  }

  .header__user[data-v-2cf0aac7] > span:empty {
    display: none !important;
  }

  .header__user .navigation,
  .header__user .navigation__container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
  }

  .navigation__person,
  .navigation__person.kk-profile-native-btn {
    box-sizing: border-box !important;

    flex: 0 0 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 38px !important;
    height: 38px !important;

    min-width: 38px !important;
    min-height: 38px !important;

    max-width: 38px !important;
    max-height: 38px !important;

    margin: 0 !important;

    position: relative !important;
    left: auto !important;
    right: auto !important;

    transform: none !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .navigation__person svg,
  .navigation__person.kk-profile-native-btn svg {
    width: 20px !important;
    height: 20px !important;
  }

  /*
   * Модальное окно оставляет все исходные размеры,
   * display, position, inset, overflow и анимацию.
   * Меняется только порядок слоёв.
   */
  .kp-profile-modal {
    z-index: 2147483000 !important;
  }

  .kp-profile-modal__overlay,
  .kp-profile-modal__backdrop {
    z-index: 2147483000 !important;
  }

  .kp-profile-modal__panel {
    z-index: 2147483001 !important;
  }

  .kp-profile-modal__close,
  .kp-profile-modal [aria-label="Close"],
  .kp-profile-modal [aria-label="Schließen"] {
    z-index: 2147483002 !important;
  }

  /*
   * Поиск больше не перекрывает открытый профиль.
   */
  .header__search,
  .header__search-wrapper,
  .header__search-container,
  .search,
  .search-wrapper {
    z-index: 10 !important;
  }
}

@media (max-width: 430px) {
  .header__inner-top[data-v-2cf0aac7] {
    gap: 4px !important;
  }

  .header-logo__image.clever-logo-holder {
    max-width: 205px !important;
    height: 22px !important;
  }

  .kk-lang-switch {
    gap: 3px !important;
  }

  .kk-lang-btn {
    width: 30px !important;
    min-width: 30px !important;
    height: 32px !important;

    padding: 3px !important;
    font-size: 10px !important;
  }

  .header__user[data-v-2cf0aac7],
  .header__user .navigation,
  .header__user .navigation__container {
    flex-basis: 36px !important;

    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
  }

  .navigation__person,
  .navigation__person.kk-profile-native-btn {
    flex-basis: 36px !important;

    width: 36px !important;
    height: 36px !important;

    min-width: 36px !important;
    min-height: 36px !important;

    max-width: 36px !important;
    max-height: 36px !important;
  }
}

/* CLEVER MOBILE HEADER + PROFILE CLEAN FIX V4 END */
/* CLEVER NO DOUBLE TAP ZOOM START */

@media (pointer: coarse) {
  /*
   * Разрешены:
   * - вертикальная и горизонтальная прокрутка;
   * - pinch-to-zoom двумя пальцами.
   *
   * Отключается увеличение двойным тапом.
   */
  html,
  body {
    touch-action: manipulation;
  }

  a,
  button,
  input,
  textarea,
  select,
  label,
  [role="button"],
  [tabindex],
  .navigation__person,
  .kk-profile-native-btn,
  .kk-lang-btn,
  .header__logo,
  .header-logo,
  .product-card,
  .service-card {
    touch-action: manipulation;
  }
}

@media (max-width: 767px) {
  /*
   * Safari также увеличивает страницу при фокусе,
   * когда размер текста поля меньше 16px.
   */
  input,
  textarea,
  select {
    font-size: 16px !important;
  }
}

/* CLEVER NO DOUBLE TAP ZOOM END */