/*
 * Общая навигация + шапка 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;
}

body:has(> #hf-site-nav) > *: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));
}

/* Общая навигация (страницы кроме карты) — под шапкой авторизации, по центру окна */

.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;
}