/* ============================================================================
   KRASAVTO.BY — кастомная шапка (kr-header.css)  [ИСПРАВЛЕННАЯ ВЕРСИЯ]
   Префикс kr-header / kr-  — не конфликтует со стандартной темой OpenCart.
   Брейкпоинты: >=1024 desktop · 768–1023 tablet · <=767 mobile.
   Без !important. box-sizing: border-box. Контейнер 1280px, padding 16px.

   ИСПРАВЛЕНИЯ:
   1. Планшет: nth-child — «Акции» теперь не скрываются.
   2. Hover-эффекты для пунктов меню.
   3. Transition для плавного hover.
   ============================================================================ */

:root{
  --kr-accent:#ff6a00;        /* акцент */
  --kr-accent-d:#d95a00;      /* тёмный акцент (текст на светлом) */
  --kr-accent-soft:#fff4ec;   /* мягкий акцент-фон */
  --kr-menu:#1f272b;          /* тёмное меню */
  --kr-ink:#22282b;           /* основной текст */
  --kr-muted:#667085;         /* подписи */
  --kr-line:#e3e5e7;          /* границы */
  --kr-bar:#f7f8f9;           /* фон верхней строки */
  --kr-radius:12px;
  --kr-container:1280px;
}

/* сброс только внутри шапки — не трогаем глобальные стили темы */
.kr-header, .kr-header *{ box-sizing:border-box; }
.kr-header{ background:#fff; font-family:'Manrope', system-ui, Arial, sans-serif; color:var(--kr-ink); }
.kr-header a{ color:inherit; text-decoration:none; }

.kr-container{ max-width:var(--kr-container); margin:0 auto; padding:0 16px; }
.kr-dot{ width:3px; height:3px; border-radius:50%; background:#c7cbce; flex:none; }

/* видимость по устройствам (по умолчанию desktop) */
.kr-header__mobile, .kr-header__drawer{ display:none; }

/* ============ ВЕРХНЯЯ СТРОКА ============ */
.kr-header__top{ background:var(--kr-bar); border-bottom:1px solid #ecedef; font-size:13px; color:#6a7075; font-weight:500; }
.kr-header__top-inner{ display:flex; align-items:center; justify-content:space-between; height:34px; white-space:nowrap; }
.kr-header__top-list{ display:flex; align-items:center; gap:13px; }
.kr-header__top-list b{ color:#565b5f; font-weight:600; }
.kr-header__top-account{ display:inline-flex; align-items:center; gap:7px; color:#565b5f; font-weight:600; transition:color .2s; }
.kr-header__top-account:hover{ color:var(--kr-accent); }
.kr-header__top-list > a:hover{ color:var(--kr-accent); }

/* ============ ОСНОВНАЯ СТРОКА ============ */
.kr-header__main-inner{ display:flex; align-items:center; gap:16px; padding-top:18px; padding-bottom:18px; }

.kr-header__logo{ flex:none; display:flex; flex-direction:column; justify-content:center; line-height:1; }
.kr-header__logo-img{ max-height:58px; max-width:210px; width:auto; height:auto; display:block; }
.kr-header__logo-mark{ font-size:27px; font-weight:800; letter-spacing:-.02em; color:var(--kr-ink); }
.kr-header__logo-mark span{ color:var(--kr-accent); }
.kr-header__logo-tag{ font-size:13px; color:#4a4f54; font-weight:700; margin-top:7px; white-space:nowrap; }

.kr-header__search{ flex:1; min-width:420px; max-width:560px; display:flex; height:52px; border:2px solid var(--kr-ink); border-radius:var(--kr-radius); overflow:hidden; transition:border-color .2s; }
.kr-header__search:focus-within{ border-color:var(--kr-accent); }
.kr-header__search-input{ flex:1; min-width:0; border:none; outline:none; padding:0 18px; font:inherit; font-size:15px; color:var(--kr-ink); background:#fff; }
.kr-header__search-btn{ display:flex; align-items:center; gap:7px; padding:0 16px; background:var(--kr-accent); border:none; font:inherit; font-size:15px; font-weight:700; color:#fff; cursor:pointer; flex:none; transition:background .2s; }
.kr-header__search-btn:hover{ background:var(--kr-accent-d); }

.kr-header__phone{ display:flex; align-items:center; gap:7px; flex:none; }
.kr-header__phone-icon{ width:38px; height:38px; border-radius:50%; background:var(--kr-accent-soft); display:flex; align-items:center; justify-content:center; flex:none; }
.kr-header__phone-num{ display:block; font-size:16px; font-weight:800; color:var(--kr-ink); letter-spacing:-.01em; white-space:nowrap; transition:color .2s; }
.kr-header__phone-num:hover{ color:var(--kr-accent); }
.kr-header__phone-hours{ display:block; font-size:13px; color:var(--kr-muted); font-weight:500; margin-top:2px; white-space:nowrap; }

.kr-header__paint{ display:flex; align-items:center; gap:8px; padding:0 16px; height:52px; background:var(--kr-accent); border:none; border-radius:11px; font:inherit; font-size:14px; font-weight:700; color:#fff; white-space:nowrap; cursor:pointer; flex:none; box-shadow:0 4px 12px rgba(255,106,0,.26); transition:background .2s, box-shadow .2s; }
.kr-header__paint:hover{ background:var(--kr-accent-d); box-shadow:0 6px 16px rgba(255,106,0,.38); }
.kr-header__paint-long{ display:inline; }
.kr-header__paint-short{ display:none; }

.kr-header__cart{ position:relative; flex:none; }
.kr-header__cart-link{ display:flex; align-items:center; gap:9px; padding:0 14px; height:52px; background:#fff; border:1.5px solid var(--kr-line); border-radius:var(--kr-radius); transition:border-color .2s; }
.kr-header__cart-link:hover{ border-color:var(--kr-accent); }
.kr-header__cart-ic{ position:relative; display:inline-flex; }
.kr-header__cart-badge{ position:absolute; top:-7px; right:-8px; min-width:18px; height:18px; padding:0 4px; border-radius:9px; background:var(--kr-accent); color:#fff; font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; }
.kr-header__cart-meta{ text-align:left; line-height:1.15; }
.kr-header__cart-label{ display:block; font-size:13px; color:var(--kr-muted); font-weight:500; }
.kr-header__cart-sum{ display:block; font-size:14px; font-weight:800; color:var(--kr-ink); white-space:nowrap; }

/* ============ STICKY WRAPPER (JS-controlled) ============ */
.kr-header__sticky{ z-index:500; background:#fff; }
.kr-header__sticky.kr-is-fixed{ position:fixed; top:0; left:0; right:0; z-index:999; box-shadow:0 2px 18px rgba(0,0,0,.13); }
.kr-header__sticky-placeholder{ display:block; }

/* ============ НИЖНЕЕ МЕНЮ ============ */
.kr-header__menu{ background:var(--kr-menu); }
.kr-header__menu-inner{ display:flex; align-items:stretch; }

/* КАТАЛОГ DROPDOWN WRAP */
.kr-header__catalog-wrap{ position:relative; display:flex; align-items:stretch; }
.kr-header__menu-catalog{ display:flex; align-items:center; gap:9px; margin-left:-16px; padding:0 18px 0 16px; height:52px; background:var(--kr-accent); border:none; font:inherit; font-size:14.5px; font-weight:700; color:#fff; flex:none; cursor:pointer; transition:background .2s; }
.kr-header__menu-catalog:hover,
.kr-header__catalog-wrap.kr-is-open .kr-header__menu-catalog{ background:var(--kr-accent-d); }
.kr-header__catalog-arrow{ flex:none; transition:transform .2s; }
.kr-header__catalog-wrap.kr-is-open .kr-header__catalog-arrow{ transform:rotate(180deg); }

/* DROPDOWN ПАНЕЛЬ */
.kr-header__catalog-dropdown{
  position:absolute; top:100%; left:0; min-width:230px;
  background:#fff; border-radius:0 0 12px 12px;
  box-shadow:0 8px 28px rgba(0,0,0,.16);
  padding:6px 0;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .18s, transform .18s, visibility .18s;
  z-index:50;
}
.kr-header__catalog-wrap:hover .kr-header__catalog-dropdown,
.kr-header__catalog-wrap.kr-is-open .kr-header__catalog-dropdown{
  opacity:1; visibility:visible; transform:translateY(0);
}
.kr-header__catalog-dropdown a{
  display:block; padding:10px 20px;
  font-size:14px; font-weight:500; color:var(--kr-ink);
  white-space:nowrap; transition:background .12s, color .12s;
}
.kr-header__catalog-dropdown a:hover{ background:var(--kr-accent-soft); color:var(--kr-accent-d); }
.kr-header__menu-list{ display:flex; align-items:center; gap:18px; padding:0 20px; flex:1; }
/* [ИСПРАВЛЕНО] повышена специфичность — перебивает .kr-header a { color:inherit } */
.kr-header .kr-header__menu-link{ font-size:14px; font-weight:500; color:#cdd2d5; white-space:nowrap; transition:color .2s; }
.kr-header .kr-header__menu-link:hover{ color:#fff; }
.kr-header .kr-header__menu-link.kr-is-accent{ display:inline-flex; align-items:center; gap:7px; font-weight:800; color:#ff8d44; }
.kr-header .kr-header__menu-link.kr-is-accent:hover{ color:#fff; }
.kr-header .kr-header__menu-link.kr-is-sale{ display:inline-flex; align-items:center; gap:6px; font-weight:600; color:#fff; }
.kr-header .kr-header__menu-link.kr-is-sale:hover{ color:var(--kr-accent); }

/* ============ MOBILE HEADER ============ */
.kr-header__mobile{ background:#fff; }
.kr-header__mobile-top{ display:flex; align-items:center; justify-content:center; gap:7px; height:30px; background:var(--kr-menu); font-size:14px; color:#cfd4d7; font-weight:500; }
.kr-header__mobile-row{ display:flex; align-items:center; gap:10px; padding:11px 16px; }
.kr-header__burger,
.kr-header__mobile-icon{ position:relative; display:flex; align-items:center; justify-content:center; width:44px; height:44px; border:1.5px solid var(--kr-line); border-radius:11px; background:#fff; cursor:pointer; flex:none; }
.kr-header__burger{ background:var(--kr-ink); border-color:var(--kr-ink); }
.kr-header__mobile-logo{ font-size:20px; font-weight:800; letter-spacing:-.02em; color:var(--kr-ink); margin-right:auto; }
.kr-header__mobile-logo span{ color:var(--kr-accent); }
.kr-header__mobile-logo img{ max-height:34px; width:auto; display:block; }
.kr-header__mobile-cart .kr-header__cart-badge{ top:-4px; right:-4px; }
.kr-header__mobile-search{ display:flex; height:48px; margin:0 16px 12px; border:2px solid var(--kr-ink); border-radius:11px; overflow:hidden; }
.kr-header__mobile-search:focus-within{ border-color:var(--kr-accent); }
.kr-header__mobile-search input{ flex:1; min-width:0; border:none; outline:none; padding:0 14px; font:inherit; font-size:15px; }
.kr-header__mobile-search button{ flex:none; width:50px; background:var(--kr-accent); border:none; color:#fff; cursor:pointer; transition:background .2s; }
.kr-header__mobile-search button:hover{ background:var(--kr-accent-d); }
.kr-header__mobile-cta{ display:flex; align-items:center; justify-content:center; gap:9px; margin:0 16px 14px; height:48px; background:var(--kr-accent-soft); border:1.5px solid #ffd2af; border-radius:10px; color:var(--kr-accent-d); font-size:14.5px; font-weight:700; transition:background .2s; }
.kr-header__mobile-cta:hover{ background:#ffe8d4; }

/* ============ MOBILE DRAWER ============ */
.kr-header__drawer{ position:fixed; inset:0; z-index:1000; }
.kr-header__drawer.kr-is-open{ display:block; }
.kr-header__drawer-scrim{ position:absolute; inset:0; background:rgba(20,24,26,.5); }
.kr-header__drawer-panel{ position:absolute; top:0; left:0; bottom:0; width:86%; max-width:340px; background:#fff; overflow-y:auto; transform:translateX(-100%); transition:transform .25s ease; }
.kr-header__drawer.kr-is-open .kr-header__drawer-panel{ transform:none; }
.kr-header__drawer-head{ display:flex; align-items:center; gap:12px; padding:16px; border-bottom:1px solid #eef0f1; }
.kr-header__drawer-logo{ font-size:19px; font-weight:800; letter-spacing:-.02em; }
.kr-header__drawer-logo span{ color:var(--kr-accent); }
.kr-header__drawer-account{ font-size:14px; font-weight:600; color:var(--kr-muted); margin-left:auto; }
.kr-header__drawer-close{ width:36px; height:36px; border:none; background:#f1f2f3; border-radius:9px; cursor:pointer; font-size:22px; line-height:1; color:#444; transition:background .2s; }
.kr-header__drawer-close:hover{ background:#e2e4e6; }
.kr-header__drawer-cta{ display:flex; align-items:center; gap:11px; margin:14px 16px; height:54px; padding:0 16px; background:var(--kr-accent); border-radius:12px; box-shadow:0 6px 16px rgba(255,106,0,.32); transition:background .2s; }
.kr-header__drawer-cta:hover{ background:var(--kr-accent-d); }
.kr-header__drawer-cta .t{ display:block; font-size:15px; font-weight:800; color:#fff; }
.kr-header__drawer-cta .s{ display:block; font-size:14px; color:#ffe2cc; font-weight:500; }
.kr-header__drawer-nav a{ display:flex; align-items:center; justify-content:space-between; min-height:48px; padding:12px 16px; border-bottom:1px solid #eef0f1; font-size:15px; font-weight:700; color:var(--kr-ink); transition:background .15s; }
.kr-header__drawer-nav a:hover{ background:#f8f9fa; }
.kr-header__drawer-nav a.kr-is-sale{ color:var(--kr-accent); }
.kr-header__drawer-foot{ padding:16px; color:var(--kr-muted); font-size:14px; }
.kr-header__drawer-foot a{ display:block; font-size:17px; font-weight:800; color:var(--kr-ink); margin-top:4px; transition:color .2s; }
.kr-header__drawer-foot a:hover{ color:var(--kr-accent); }
.kr-header__drawer-hours{ display:block; margin-top:8px; }

/* блокировка прокрутки фона при открытом drawer */
body.kr-no-scroll{ overflow:hidden; }

/* ============ TABLET 768–1023 ============ */
@media (max-width:1023px){
  .kr-header__main-inner{ flex-wrap:wrap; }
  .kr-header__logo-mark{ font-size:24px; }
  /* поиск отдельной строкой на всю ширину */
  .kr-header__search{ order:5; flex-basis:100%; min-width:0; max-width:none; margin-top:14px; }
  /* CTA: короткий «Подбор краски» -> «Подбор по коду» */
  .kr-header__paint-long{ display:none; }
  .kr-header__paint-short{ display:inline; }
  /* [ИСПРАВЛЕНО] скрываем лишние пункты, но НЕ «Акции» (kr-is-sale)
     nth-child(n+6) скрывало бы Абразивы, Инструмент и Акции.
     Теперь скрываем только Абразивы и Инструмент, явно исключая kr-is-sale. */
  .kr-header__menu-link:nth-child(n+6):not(.kr-is-sale){ display:none; }
}

/* ============ MOBILE <=767 ============ */
@media (max-width:767px){
  .kr-header__top, .kr-header__main, .kr-header__menu, .kr-header__sticky{ display:none; }
  .kr-header__mobile{ display:block; position:sticky; top:0; z-index:500; box-shadow:0 2px 12px rgba(0,0,0,.10); }
}

/* drawer существует только на мобильном */
@media (min-width:768px){
  .kr-header__drawer{ display:none; }
}