/* Responsive-слой общей обвязки FAQ и внутренней базы знаний.
   Базовые бренд-стили остаются в vcpay.css; этот файл отвечает только за
   планшеты, телефоны и отдельное приложение поиска Diplodoc. */

/* Вторичные ссылки шапки на узком экране не помещаются. Primary CTA
   оставляем: у справки это «Выпустить карту» с utm_medium=header. */
@media (max-width: 960px) {
  .vc-header {
    gap: 10px;
    padding-inline: 16px;
  }

  .vc-header__link {
    display: none;
  }

  .vc-header__cta {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 12px;
  }

  .vc-header__search,
  .vc-header__theme {
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 0;
  }

  .vc-header__search-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
}

@media (max-width: 768px) {
  .vc-header {
    padding-inline: max(12px, env(safe-area-inset-left)) max(12px, env(safe-area-inset-right));
  }

  body:not(:has(.pc-navigation)) .dc-sidebar {
    top: calc(var(--dc-header-height) + var(--dc-subnavigation-height, 52px) + 1px);
    height: calc(100% - var(--dc-header-height) - var(--dc-subnavigation-height, 52px) - 1px);
  }

  /* wide-format платформы перебивает штатные 20px своими 8px. */
  .dc-root_wide-format .dc-doc-page__main {
    padding-inline: 20px;
  }

  .dc-sidebar-navigation__button,
  .dc-subnavigation__mini-toc-button,
  .dc-mini-toc__section-link,
  .dc-nav-toc-panel__link,
  .dc-toc-item__text,
  .dc-toc-item__link {
    min-width: 44px;
    min-height: 44px;
  }

  .pc-layout-item {
    padding: 16px 18px;
  }

  .pc-link-block__link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
}

@media (max-width: 480px) {
  .vc-header__wordmark,
  .vc-header__section {
    display: none;
  }

  .vc-header__logo {
    min-width: 44px;
    justify-content: center;
  }
}

/* На SE-ширине CTA «Выпустить карту» важнее переключателя:
   системную тему всё равно читаем из prefers-color-scheme. */
@media (max-width: 360px) {
  .vc-header__theme {
    display: none;
  }
}

@media (hover: none) {
  .pc-layout-item:hover {
    box-shadow: none;
    transform: none;
  }
}

body.vc-search-page {
  height: auto;
  min-height: 100vh;
}

body.vc-search-page #root {
  min-height: calc(100vh - var(--vc-header-height));
}

body.vc-search-page .Search {
  box-sizing: border-box;
  padding-inline: 20px;
}

body.vc-search-page .Search input,
body.vc-search-page .Search button {
  min-height: 44px;
  font-size: 16px;
}