/*
 * Общая навигация + шапка Key без зазоров от краёв окна.
 * Ограничение max-width у блока шапки задаётся в embed.css на этом же сайте —
 * снимаем его здесь; отступы страницы body не нужны у краёв (иначе «полоска» не к краю).
 */

/* !important — иначе inline `body { padding: … }` на страницах журнала/данных перебивает отступ от края */
body:has(> #hf-site-nav) {
  padding-top: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Карта исключена: её полосы и сам #map — fixed на всю ширину окна, свои отступы у них
   уже есть, а padding на #map ужал бы вьюпорт Leaflet. */
body:has(> #hf-site-nav):not(.hf-page-map) > *:not(#kobets-header):not(#hf-site-nav) {
  padding-left: max(0.75rem, env(safe-area-inset-left));
  padding-right: max(0.75rem, env(safe-area-inset-right));
}

/* Шапка сервиса на всю ширину окна (фон и строка контролов) */
#kobets-header {
  width: 100%;
  margin: 0;
  box-sizing: border-box;
}

#kobets-header.kobets-header--contained,
#kobets-header .kobets-header-inner {
  max-width: none !important;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

#kobets-header .kobets-header-inner {
  padding-left: max(0.65rem, env(safe-area-inset-left));
  padding-right: max(0.65rem, env(safe-area-inset-right));
}

/* Общая навигация — под шапкой авторизации, по центру окна.
   На карте она дополнительно переводится в position: fixed (стили в самой карте). */

.hf-site-nav-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  padding: 0.45rem 0.75rem 0.65rem;
  border-bottom: 1px solid var(--hf-border, rgba(255, 255, 255, 0.12));
  background: var(--hf-bg-panel, rgba(20, 20, 28, 0.85));
}

.hf-app-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: safe center;
  align-items: center;
  gap: 0.35rem 0.45rem;
  margin: 0 auto;
  padding: 0;
  width: 100%;
  max-width: 100%;
}

.hf-app-nav__link {
  display: inline-block;
  padding: 0.42rem 0.9rem;
  border-radius: 8px;
  text-decoration: none;
  color: var(--hf-link, #8ab4f8);
  font-size: 0.9rem;
  font-weight: 500;
  border: 1px solid transparent;
  transition: background 0.12s ease, border-color 0.12s ease;
}

.hf-app-nav__link:hover {
  background: var(--hf-bg-panel-solid, rgba(255, 255, 255, 0.06));
  border-color: var(--hf-border, rgba(255, 255, 255, 0.12));
}

.hf-app-nav__link--current {
  background: var(--hf-btn-secondary, rgba(255, 255, 255, 0.12));
  color: var(--hf-text, #eee);
  border-color: var(--hf-border, rgba(255, 255, 255, 0.2));
  pointer-events: none;
  cursor: default;
}

/* Подвал: ссылка «О программе» + версия сервиса.
   На обычных страницах — в конце содержимого; на карте страница не прокручивается,
   поэтому там он прижат к нижнему правому углу поверх карты (как было у прежней
   нижней навигации). */

.hf-site-footer {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.6rem 0.75rem 0.8rem;
  font-size: 0.82rem;
  color: var(--hf-muted, #8b8b9a);
}

.hf-site-footer__link {
  color: var(--hf-link, #8ab4f8);
  text-decoration: none;
}

.hf-site-footer__link:hover { text-decoration: underline; }

.hf-site-footer__version { font-variant-numeric: tabular-nums; }

body.hf-page-map .hf-site-footer {
  position: fixed;
  right: 0.65rem;
  bottom: 0;
  z-index: 1100;
  padding: 0.45rem 0.75rem;
  background: var(--hf-bg-panel, rgba(20, 20, 28, 0.85));
  border: 1px solid var(--hf-border, rgba(255, 255, 255, 0.12));
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  backdrop-filter: blur(6px);
}

/* В режиме правки карты подвал мешает панели инструментов — прячем, как прежнюю навигацию. */
body.map-edit .hf-site-footer { display: none; }

/* Подпись: по умолчанию полная, короткая скрыта. */
.hf-app-nav__short { display: none; }

/* Узкий экран: одна строка вместо двух — короткие подписи, меньше отступы, при нехватке
   ширины полоса прокручивается вбок. Высоту меню на карте меряет её собственный скрипт,
   так что карта подстроится сама. */
@media (max-width: 42rem) {
  .hf-site-nav-wrap {
    padding: 0.3rem 0.5rem 0.4rem;
  }

  .hf-app-nav {
    flex-wrap: nowrap;
    justify-content: flex-start;
    /* Отступы подобраны так, чтобы все пять пунктов помещались на 375 px без прокрутки;
       на более узких экранах полоса прокручивается вбок, страница — нет. */
    gap: 0.15rem;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .hf-app-nav::-webkit-scrollbar { display: none; }

  .hf-app-nav__link {
    padding: 0.3rem 0.42rem;
    font-size: 0.82rem;
    white-space: nowrap;
    flex: 0 0 auto;
  }

  .hf-app-nav__full { display: none; }
  .hf-app-nav__short { display: inline; }
}