/* ───────────────────────────────────────────────────────────────
 * K-Promo — PATCH 1.4
 * ───────────────────────────────────────────────────────────────
 * Фиксит 3 конкретные проблемы, выявленные по скринам:
 *
 *   1. Белая полоса слева у топ-бара / шапки / sticky-меню
 *      Причина: WoodMart-овский .website-wrapper / body имеет
 *      внутренний padding/margin, из-за чего fullwidth-блоки не
 *      доходят до края экрана слева.
 *      Решение: break-out из контейнера через 100vw + margin
 *      компенсация. Плюс гасим body-овские отступы на главной.
 *
 *   2. Мега-меню разваливается в одну колонку при открытии
 *      Причина: PATCH 1.2 в main.css использовал display:revert,
 *      который отменяет .kp-mega { display:grid } и возвращает
 *      user-agent default (block).
 *      Решение: убрать костыль revert, оставить только !important
 *      на .kp-mega-hidden, восстановить display:grid.
 *
 *   3. Futura PT не применяется к топ-бару / шапке / снаву
 *      Причина: font-family назначен на .kp-page, но топ-бар,
 *      шапка и sticky-меню находятся ВНЕ <main class="kp-page">.
 *      Решение: назначить на body.kp-body и на корневые элементы
 *      .kp-topbar/.kp-header/.kp-snav-wrap явно.
 *
 * Подключается в functions.php после kp-main, чтобы перебить.
 * ─────────────────────────────────────────────────────────────── */


/* ═══════════════════════════════════════════════════════════════
 * FIX 1 — Fullwidth для топ-бара, шапки и sticky-меню
 * ═══════════════════════════════════════════════════════════════ */

/* Гасим WoodMart-овские внешние отступы у body на главной.
 * .kp-body — наш класс (см. header.php), цепляется только когда
 * активна kpromo-страница, не трогает другие шаблоны. */
body.kp-body {
  margin: 0 !important;
  padding: 0 !important;
}

/* WoodMart обычно оборачивает контент в .website-wrapper или
 * .full-width-wrapper с боковыми padding. Если они есть — убираем
 * для нашего топ-блока. Селектор узкий, не сломает другие страницы. */
body.kp-body .website-wrapper,
body.kp-body > .website-wrapper,
body.kp-body .main-page-wrapper,
body.kp-body .site-content,
body.kp-body .kp-fullwidth-wrapper {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
  width: 100% !important;
  overflow-x: clip; /* защита от горизонтального скролла */
}

/* WoodMart-овский .container на главной может мешать — заменяем
 * на наш .kp-container внутри template-parts. На случай если родительский
 * .container остаётся выше по дереву — сбрасываем его max-width. */
body.kp-body > .container,
body.kp-body .website-wrapper > .container {
  max-width: none !important;
  padding: 0 !important;
}

/* Гарантируем, что наши full-width блоки занимают всю ширину
 * viewport, даже если родитель уже их подсуживает. */
.kp-topbar,
.kp-header,
.kp-snav-wrap {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

/* Защита от случайного появления горизонтального скролла */
body.kp-body {
  overflow-x: clip;
}


/* ═══════════════════════════════════════════════════════════════
 * FIX 2 — Мега-меню: восстанавливаем 3-колоночный grid
 * ═══════════════════════════════════════════════════════════════ */

/* Перебиваем PATCH 1.2 (display:revert ломал grid). 
 * Просто и надёжно: видимое состояние — всегда grid. */
.kp-mega {
  display: grid !important;
  grid-template-columns: 280px 1fr 380px;
}

/* Стартовое скрытие до инициализации JS (FOUC-защита).
 * Использует ту же логику, что и mega-hidden — display:none. */
.kp-mega:not(.kp-mega-init),
.kp-mega-scrim:not(.kp-mega-init) {
  display: none !important;
}

/* Скрытое состояние через класс — приоритет над display:grid */
.kp-mega.kp-mega-hidden,
.kp-mega-scrim.kp-mega-hidden,
.kp-mega-group-pane.kp-mega-hidden {
  display: none !important;
}

/* Скрим — fixed, без grid */
.kp-mega-scrim {
  display: block !important;
}
.kp-mega-scrim.kp-mega-hidden {
  display: none !important;
}

/* Подкатегории — flex/grid внутри pane */
.kp-mega-group-pane {
  display: block;
}
.kp-mega-group-pane.kp-mega-hidden {
  display: none !important;
}


/* ═══════════════════════════════════════════════════════════════
 * FIX 3 — Futura PT на body и корневых блоках темы
 * ═══════════════════════════════════════════════════════════════ */

/* Применяем Futura PT глобально на наших страницах (через body.kp-body)
 * с высокой специфичностью, чтобы перебить WoodMart-овский CSS,
 * который ставит свой font-family на body. */
body.kp-body,
body.kp-body .kp-topbar,
body.kp-body .kp-header,
body.kp-body .kp-snav-wrap,
body.kp-body .kp-snav,
body.kp-body .kp-page,
body.kp-body .kp-footer,
body.kp-body button,
body.kp-body input,
body.kp-body select,
body.kp-body textarea {
  font-family: "Futura PT", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* Сглаживание шрифта и feature-settings — на всех корневых блоках,
 * не только на .kp-page (раньше было только на .kp-page) */
body.kp-body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv11";
}


/* ═══════════════════════════════════════════════════════════════
 * BONUS — небольшие правки по дизайну (соответствие Claude Design)
 * ═══════════════════════════════════════════════════════════════ */

/* Hero-заголовок — в дизайне line-height 0.98, не 1.4.
 * Сейчас на скрине получается с большим воздухом между строк. */
.kp-hero-title {
  line-height: 0.98;
}

/* Логотип в шапке — высота 34px (дизайн), не 40px */
.kp-logo img,
.kp-logo .kp-logo-mark-img {
  height: 34px;
}