/* nav-2026: шапка, меню і мобільне меню flakes.ua (06.10.2026, NZM-1182) */
.nav-extra{display:none}
.header-block-menu .main-menu a[href*="flakes-syrno-horikhovyi-smak"]{--nav-img:url(/image/catalog/nav/nav-sirgor.webp)}
.header-block-menu .main-menu a[href*="flakes-z-tsybuleyu"]{--nav-img:url(/image/catalog/nav/nav-onion.webp)}
.header-block-menu .main-menu a[href*="flakes-seredzemnomorski-travy"]{--nav-img:url(/image/catalog/nav/nav-travy.webp)}
.header-block-menu .main-menu a[href*="flakes-z-morkvoyu"]{--nav-img:url(/image/catalog/nav/nav-morkva.webp)}
.header-block-menu .main-menu a[href*="flakes-zi-spirulinoyu"]{--nav-img:url(/image/catalog/nav/nav-spirulina.webp)}

/* ---------- комп'ютер ---------- */
@media (min-width:1201px){
.header-block-menu .main-menu{column-gap:22px}
.header-block-menu .main-menu > li > a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-size:15px;font-weight:800;letter-spacing:.02em;padding:10px 0;transition:box-shadow .15s ease}
.header-block-menu .main-menu > li:nth-of-type(n):hover > a{font-weight:800}
.header-block-menu .main-menu > li:not(:first-of-type):hover > a{box-shadow:inset 0 -3px 0 #F75E02}
.header-block-menu .main-menu > li.has-sub > a::after{content:"";display:inline-block;position:static;width:7px;height:7px;background:none;border-radius:0;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-3px);right:auto;top:auto}
.header-block-menu .main-menu > li:first-of-type > a{padding:12px 26px;border:2px solid #000;font-size:15px}
.header-block-menu .main-menu > li:first-of-type > a::after{display:none}
.header-block-menu .main-menu li.dropdown ul{top:100%;left:-14px;min-width:260px;padding:10px;margin-top:4px;row-gap:2px;background:#fff;border:1px solid #f1e8cc;border-radius:20px;box-shadow:0 18px 40px rgba(0,0,0,.14);z-index:1000}
.header-block-menu .main-menu li.dropdown::after{content:"";position:absolute;left:0;right:0;top:100%;height:10px}
.header-block-menu .main-menu li.dropdown ul li a{text-transform:none;text-align:left;font-size:16px;font-weight:700;line-height:1.25;padding:11px 14px;border-radius:12px}
.header-block-menu .main-menu li.dropdown ul li a:hover{background:#FEF3CF}
/* каталог: плитки смаків */
.header-block-menu .main-menu > li:first-of-type ul{left:0;margin-top:10px;padding:16px;width:678px;display:none;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:14px 12px}
.header-block-menu .main-menu > li:first-of-type ul li{flex:0 0 118px;min-width:0;max-width:118px}
.header-block-menu .main-menu > li:first-of-type:hover ul{display:flex}
.header-block-menu .main-menu > li:first-of-type ul li a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 0 6px;text-align:center;white-space:normal;font-size:14px;line-height:1.25;hyphens:auto;overflow-wrap:anywhere;border-radius:16px;background:none}
.header-block-menu .main-menu > li:first-of-type ul li a::before{content:"";display:block;width:118px;height:150px;border-radius:16px;background:#FEF3CF var(--nav-img) center/cover no-repeat;transition:transform .15s ease}
.header-block-menu .main-menu > li:first-of-type ul li a:hover{background:none;color:#F75E02}
.header-block-menu .main-menu > li:first-of-type ul li a:hover::before{transform:translateY(-3px)}
.header-block-menu .main-menu > li:first-of-type ul li:nth-child(n+6){flex:0 0 220px;max-width:none}
.header-block-menu .main-menu > li:first-of-type ul li:nth-child(n+6) a{flex-direction:row;justify-content:center;padding:13px 16px;border:2px solid #000;border-radius:50px}
.header-block-menu .main-menu > li:first-of-type ul li:nth-child(n+6) a::before{display:none}
.header-block-menu .main-menu > li:first-of-type ul li:nth-child(n+6) a:hover{background:#000;color:#fff}
}

/* ---------- телефон і планшет: висувне меню ---------- */
@media (max-width:1200px){
.header-block-wrapper .header-block-menu{flex-direction:column;align-items:stretch;gap:0}
.header-block-menu .main-menu{row-gap:6px}
.header-block-menu .main-menu > li > a,.header-block-menu .main-menu > li:first-of-type > a{font-size:20px;font-weight:800;padding:14px 0;border-bottom:1px solid #000}
.header-block-menu .main-menu > li:nth-of-type(2) > a:after{display:none}
.header-block-menu .main-menu li.dropdown ul{margin-top:10px;row-gap:0}
.header-block-menu .main-menu li.dropdown ul li a,.header-block-menu .main-menu li li > a{text-transform:none;font-size:17px;font-weight:600;line-height:1.3;padding:12px 0 12px 16px;border-bottom:1px solid #eee}
/* каталог: смаки рядком, гортаються вбік */
.header-block-menu .main-menu > li:first-of-type ul{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:16px 10px;padding:4px 0 10px;margin-top:14px}
.header-block-menu .main-menu > li:first-of-type ul li{flex:0 0 calc((100% - 20px) / 3);width:auto;max-width:150px}
.header-block-menu .main-menu > li:first-of-type ul li a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;border:0;text-align:center;font-size:13px;font-weight:700;line-height:1.2;white-space:normal;hyphens:auto;overflow-wrap:anywhere}
.header-block-menu .main-menu > li:first-of-type ul li a::before{content:"";display:block;width:100%;aspect-ratio:4/5;height:auto;border-radius:16px;background:#FEF3CF var(--nav-img) center/cover no-repeat}
.header-block-menu .main-menu > li:first-of-type ul li:nth-child(n+6){flex:0 0 calc(50% - 5px);max-width:none}
.header-block-menu .main-menu > li:first-of-type ul li:nth-child(n+6) a{justify-content:center;padding:12px 10px;border:2px solid #000;border-radius:50px;background:none;font-size:14px;font-weight:800}
.header-block-menu .main-menu > li:first-of-type ul li:nth-child(n+6) a::before{display:none}
/* нижній блок меню */
.nav-extra{display:flex;flex-direction:column;gap:10px;margin:28px 0 40px}
.nav-extra a{display:block;padding:14px 20px;border:2px solid #000;border-radius:50px;text-align:center;font-size:16px;font-weight:800;color:#000;text-decoration:none}
.nav-extra a:first-child{background:#000;color:#fff}
}
@media (max-width:991px){
.header-block-items .header-block-items-item.nav-search{display:block!important}
.header-block-items .nav-search .icon-search{width:34px;height:34px;display:block}
.header-block-wrapper .header-block-items{position:static}
.header-block-wrapper{position:relative}
.nav-search .search-form-wrapper{top:calc(100% + 10px);left:0;right:0;width:auto;z-index:1001}
.nav-search .search-form .form-control{height:52px;box-shadow:0 12px 30px rgba(0,0,0,.18)}
.nav-search .search-form .btn{top:11px}
}
@media (prefers-reduced-motion:reduce){.header-block-menu .main-menu a,.header-block-menu .main-menu a::before{transition:none!important}}
@media (max-width:1200px){.header-block-menu .main-menu > li:has(> a[href$="/shop/nabory-flakes"]){display:none}}
@media (min-width:1201px) and (max-width:1599px){.header-block-menu .main-menu > li:has(> a[href$="/shop/nabory-flakes"]){display:none}}
/* стрілки слайдера: OpenCart ховав їх на 20 px за краєм екрана — сторінка на комп'ютері гортались вбік */
@media (min-width:768px){.swiper-viewport .swiper-button-prev{left:10px}.swiper-viewport .swiper-button-next{right:10px}}