/* ==========================================================================
   LA — Header component
   Matches: desktop layout (top bar + category bar)
            mobile layout  (compact icon bar + scrollable category bar)
   ========================================================================== */

:root {
	--la-yellow: #FFCC00;
	--la-black: #111111;
	--la-text: #1a1a1a;
	--la-text-muted: #8a8a8a;
	--la-border: #ececec;
	--la-header-height: 64px;
	--la-radius: 10px;
}


.la-topnav__item {
    position: relative;
}

.la-topnav__dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 180px;
    background: #fff;
    border: 1px solid var(--la-border);
    border-radius: var(--la-radius);
    box-shadow: 0 12px 28px rgba(0,0,0,.10);
    padding: 6px;
    margin: 0;
    list-style: none;
    z-index: 999999;
}

.la-topnav__item:hover .la-topnav__dropdown,
.la-topnav__item.is-open .la-topnav__dropdown {
    display: block;
}

div#search {
    width: 50%;
    margin: 0 auto;
}


#la-search-panel{
    display:none;
}

#la-search-panel.is-open{
    display:block;
}


#la-search-panel{
    position: relative;
    z-index: 99999;
    overflow: visible;
}

#la-search-panel .dropdown-menu.autosearch{
    display: block;
    z-index: 999999;
    position: absolute;
    top: 100%;
    left: 0;
}


@media (max-width: 991px) {
li.nsmenu-issubchild a {
    font-weight: 600;
    color: #ef0000 !important;
}


ul.list-unstyled.nsmenu-ischild.nsmenu-ischild-simple a {
    color: #000000 !important;
}




	/* защита от инлайн-стилей карусели, если cs__menu_init всё же успел отработать раньше */
	.navbar-ex1-collapse .navbar-nav > li {
		width: 100% !important;
	}
	.navbar-ex1-collapse .navbar-nav {
		width: 100% !important;
	}
	.navbar-ex1-collapse .nav > li.item_menu_hidden {
		display: block !important;
	}
	.navbar-ex1-collapse .dop-menu-show_more {
		display: none !important;
	}
}

@media (max-width: 991px) {

	/* полностью нейтрализуем desktop-карусель меню (cs__menu_init из megamenu.js) —
	   она распределяет пункты по "секциям" через inline width и visibility,
	   что ломает наше мобильное меню. Просто перебиваем всё это. */

	.navbar-ex1-collapse .navbar-nav,
	.navbar-ex1-collapse .navbar-nav > li {
		width: 100% !important;
		visibility: visible !important;
		overflow: visible !important;
	}

	/* скрываем стрелки-пагинацию "1/6" и переключатель страниц меню — не нужны на мобилке */
	.navbar-ex1-collapse ~ .dop-menu-show_more,
	.horizontal-menu-box .dop-menu-show_more {
		display: none !important;
	}

	/* скрываем спрятанные каруселью пункты — показываем все на мобилке */
	.navbar-ex1-collapse .nav > li.item_menu_hidden {
		display: block !important;
	}

	/* убираем разбивку на секции визуально — все они просто одна колонка */
	.navbar-ex1-collapse .nav > li[class*="section_"] {
		width: 100% !important;
	}
}
.la-action--cart-module #cart.btn-group.btn-block {
    z-index: 1 !important;
}

@media (max-width: 991px) {
    .navbar-header .navbar-toggle-m {
        display: none !important;
    }


.horizontal-menu-box {
    height: 1px !important;
}
}

.cert-section{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:30px;
    margin:60px 0;
}

.cert-section > .col-sm-12{
    flex:0 0 100%;
}

.cert-item{
    flex:0 0 calc(50% - 15px);
    text-align:center;
}

.cert-item img{
    width:100%;
    max-width:520px;
    height:auto;
}

@media(max-width:768px){
    .cert-item{
        flex:0 0 100%;
    }
}

.ocf-btn-link {
    color: #000000!important;
}

.vk-gallery{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
    margin:35px 0;
}

.vk-gallery a{
    display:block;
    overflow:hidden;
    border-radius:18px;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
    transition:.35s;
    background:#fff;
}

.vk-gallery a:hover{
    transform:translateY(-6px);
    box-shadow:0 20px 45px rgba(0,0,0,.18);
}

.vk-gallery img{
    display:block;
    width:100%;
    height:280px;
    object-fit:cover;
    transition:.45s;
}

.vk-gallery a:hover img{
    transform:scale(1.06);
}

@media (max-width:992px){

    .vk-gallery{
        grid-template-columns:repeat(2,1fr);
    }

}

@media (max-width:576px){

    .vk-gallery{
        grid-template-columns:1fr;
        gap:15px;
    }

    .vk-gallery img{
        height:240px;
    }

}
/* ============================= */

.vs-categories{

display:grid;

grid-template-columns:2fr 1fr 2fr;

grid-template-rows:240px 240px;

gap:22px;

margin:35px 0;

}

.tile{

position:relative;

overflow:hidden;

border-radius:26px;

background:#fff;

box-shadow:0 10px 35px rgba(0,0,0,.06);

transition:.35s;

display:block;

}

.tile:hover{

transform:translateY(-6px);

box-shadow:0 18px 45px rgba(0,0,0,.12);

}

.tile img{

position:absolute;

right:0;

bottom:0;

max-width:82%;

max-height:92%;

transition:.5s;

}

.tile:hover img{

transform:scale(1.06);

}

.tile-title{

position:absolute;

left:22px;

top:18px;

font-size:28px;

font-weight:700;

line-height:1.2;

color:#111;

z-index:3;

}

.tile-label{

position:absolute;

left:22px;

top:72px;

background:#FFD200;

padding:8px 14px;

border-radius:12px;

font-size:15px;

font-weight:700;

z-index:3;

}

.tile-big{

grid-row:span 2;

}

.tile-small{

height:240px;

}

.tile-wide{

height:240px;

}

.vitamins{

background:#f8faf7;

}

.protein{

background:#fffdf7;

}

.veteran{

background:#eef8ef;

}

.sport{

background:#f5f8ff;

}

.sets{

background:#fffaf2;

}

/* ================= MOBILE ================= */

@media(max-width:991px){

.vs-categories{

grid-template-columns:1fr 1fr;

grid-template-rows:auto;

}

.tile-big{

grid-row:auto;

height:230px;

}

.tile-wide{

grid-column:span 2;

height:190px;

}

.tile-small{

height:170px;

}

.tile-title{

font-size:22px;

}

.tile img{

max-width:72%;

}

}


a.tile.tile-big.sets img {
    max-width: 64%;
    max-height: 73%;
}

/* Вітаміни - зробити більшими */
.tile.vitamins img{
    max-width: 100%;
    max-height: 100%;
}

/* Протеїн - зробити меншим */
.tile.protein img{
    max-width: 58%;
    max-height: 70%;
}

/* ---------- GRID ---------- */

.vs-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:24px;

margin:25px 0 40px;

}

/* ---------- CARD ---------- */

.vs-card{

position:relative;

display:block;

height:340px;

border-radius:24px;

overflow:hidden;

text-decoration:none;

background-size:cover;

background-position:center;

transition:.45s;

box-shadow:0 12px 35px rgba(0,0,0,.08);

}

.vs-card:hover{

transform:translateY(-8px);

box-shadow:0 30px 60px rgba(0,0,0,.18);

}

.vs-card::before{

content:"";

position:absolute;

inset:0;

background:linear-gradient(

180deg,

rgba(0,0,0,.08),

rgba(0,0,0,.15),

rgba(0,0,0,.75)

);

transition:.4s;

}

.vs-card:hover::before{

background:linear-gradient(

180deg,

rgba(0,0,0,.05),

rgba(0,0,0,.20),

rgba(0,0,0,.82)

);

}

.vs-card::after{

content:"";

position:absolute;

width:500px;

height:500px;

border-radius:50%;

background:rgba(255,255,255,.08);

top:-250px;

right:-180px;

transition:.8s;

}

.vs-card:hover::after{

transform:scale(1.15);

}

/* ---------- CONTENT ---------- */
@media only screen and (max-width: 1199px){

.vs-content{

    position: absolute;
    left: 11px;
    right: 0;
    bottom: 28px;
    z-index: 5;
    color: #fff;

}
}


@media only screen and (min-width: 1200px){

.vs-content{

position:absolute;

left:28px;

right:28px;

bottom:28px;

z-index:5;

color:#fff;

}
}




.vs-tag{

display:inline-block;

padding:8px 18px;

border-radius:40px;

background:#ffc400;

color:#111;

font-weight:700;

font-size:14px;

margin-bottom:18px;

}

.vs-content h2 {
    color: white;
}


@media only screen and (max-width: 1199px){

.vs-content p{

font-size:12px;

line-height:1.6;

margin-bottom:22px;

color:#fff;

opacity:.96;

}

}


@media only screen and (min-width: 1200px){

.vs-content p{

font-size:17px;

line-height:1.6;

margin-bottom:22px;

color:#fff;

opacity:.96;

}

}



.vs-btn{

display:inline-flex;

align-items:center;

justify-content:center;

height:48px;

padding:0 24px;

background:#ffc400;

border-radius:40px;

color:#111;

font-weight:700;

transition:.3s;

}

.vs-card:hover .vs-btn{

background:#fff;

transform:translateX(8px);

}












/* ---------- ФОНЫ ---------- */

.vs-card-1{

background-image:
linear-gradient(rgba(26,61,38,.25),rgba(26,61,38,.25)),
url("../image/catalog/banner/veteran-gym.jpg");

}

.vs-card-2{

background-image:
linear-gradient(rgba(32,44,74,.25),rgba(32,44,74,.25)),
url("../image/catalog/banner/veteran-program.jpg");

}

.vs-card-3{

background-image:
linear-gradient(rgba(98,74,0,.2),rgba(98,74,0,.2)),
url("../image/catalog/banner/veteran-sale.jpg");

}

/* ---------- MOBILE ---------- */

/* ---------- MOBILE (карусель) ---------- */

@media(max-width:991px){

.vs-grid{
    display: flex;
    grid-template-columns: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 14px;
    margin-left: -24px;
    margin-right: -24px;
    padding-left: calc(10% + 24px);
    padding-right: calc(10% + 24px);
    scrollbar-width: none;
}

.vs-grid::-webkit-scrollbar{
    display:none;
}

.vs-card{
    flex: 0 0 80%;
    height:260px;
    scroll-snap-align: center;
    scroll-snap-stop: always;
}

.vs-content h2{
    font-size:21px;
}

}



@media(max-width:991px){
.vs-dots{
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:14px;
}
.vs-dot{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#e0e0e0;
    transition:.3s;
}
.vs-dot.active{
    background:#ffc400;
    width:22px;
    border-radius:5px;
}
}






.la-logo__fallback {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}



.la-logo__link {
    display: inline-flex;
    align-items: center;
    perspective: 800px;
}

.la-logo__icon {
    height: 44px;
    width: auto;
    display: block;
    flex-shrink: 0;
    transition: transform .8s ease;
    transform-style: preserve-3d;
    backface-visibility: hidden;
}

.la-logo__link:hover .la-logo__icon {
    transform: rotateY(360deg);
}

h2.footer-contact-title {
    color: white;
}

/* =========================================================
   PRODUCT DESCRIPTION STYLE OVERRIDE
   Подключить ПОСЛЕ основного stylesheet темы.
   ========================================================= */

#tab-description {
    font-family: 'Comfortaa', sans-serif !important;
}

/* ---------- Контейнер описания ---------- */
#desc-content {
    font-size: 15px !important;
    line-height: 1.6 !important;
    font-weight: 500 !important;
}

/* ---------- Абзацы ---------- */
#desc-content p {
    margin: 0 0 20px 0 !important;
}
#desc-content p:last-child {
    margin-bottom: 0 !important;
}

/* ---------- Заголовки внутри описания ---------- */
#desc-content h1,
#desc-content h2,
#desc-content h3,
#desc-content h4,
#desc-content h5,
#desc-content h6 {
    font-family: 'Comfortaa', sans-serif !important;
    color: #111 !important;
    font-weight: 700 !important;
    margin: 24px 0 12px 0 !important;
    line-height: 1.3 !important;
}
#desc-content h1 { font-size: 24px !important; }
#desc-content h2 { font-size: 20px !important; }
#desc-content h3 { font-size: 18px !important; }
#desc-content h4,
#desc-content h5,
#desc-content h6 { font-size: 16px !important; }

/* ---------- Жирный / курсив / подчёркнутый ---------- */
#desc-content b,
#desc-content strong {
    color: #111 !important;
    font-weight: 700 !important;
}
#desc-content i,
#desc-content em {
    font-style: italic !important;
}
#desc-content u {
    text-decoration: underline !important;
}

/* ---------- Списки ---------- */
#desc-content ul,
#desc-content ol {
    margin: 0 0 20px 0 !important;
    padding-left: 22px !important;
}
#desc-content ul {
    list-style: none !important;
}
#desc-content ul li {
    position: relative !important;
    margin-bottom: 10px !important;
    padding-left: 18px !important;
    color: #1a56db !important;
}
#desc-content ul li::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 8px !important;
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    background: #F5C518 !important;
}
#desc-content ol {
    list-style: none !important;
    counter-reset: desc-counter !important;
}
#desc-content ol li {
    position: relative !important;
    margin-bottom: 10px !important;
    padding-left: 8px !important;
    color: #1a56db !important;
    counter-increment: desc-counter !important;
}
#desc-content ol li::before {
    content: counter(desc-counter) "." !important;
    position: absolute !important;
    left: -20px !important;
    font-weight: 700 !important;
    color: #e53935 !important;
}
#desc-content li ul,
#desc-content li ol {
    margin-top: 10px !important;
}

/* ---------- Ссылки ---------- */
#desc-content a {
    color: #e53935 !important;
    text-decoration: underline !important;
    font-weight: 600 !important;
    transition: color .15s ease !important;
}
#desc-content a:hover {
    color: #b71c1c !important;
}

/* ---------- Цитаты ---------- */
#desc-content blockquote {
    margin: 0 0 20px 0 !important;
    padding: 12px 18px !important;
    border-left: 4px solid #F5C518 !important;
    background: #fafafa !important;
    color: #444 !important;
    font-style: italic !important;
    border-radius: 0 8px 8px 0 !important;
}

/* ---------- Таблицы ---------- */
#desc-content table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 0 20px 0 !important;
    font-size: 14px !important;
}
#desc-content table th {
    background: #fafafa !important;
    color: #111 !important;
    font-weight: 700 !important;
    text-align: left !important;
    padding: 10px 14px !important;
    border: 1px solid #eee !important;
}
#desc-content table td {
    padding: 10px 14px !important;
    border: 1px solid #eee !important;
    color: #333 !important;
}

/* ---------- Изображения внутри описания ---------- */
#desc-content img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 12px !important;
    margin: 10px 0 !important;
}

/* ---------- Горизонтальная линия ---------- */
#desc-content hr {
    border: none !important;
    border-top: 1px solid #eee !important;
    margin: 20px 0 !important;
}

/* ---------- Код / preformatted ---------- */
#desc-content code {
    background: #f5f5f5 !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    color: #e53935 !important;
}
#desc-content pre {
    background: #f5f5f5 !important;
    padding: 12px 16px !important;
    border-radius: 8px !important;
    overflow-x: auto !important;
    margin: 0 0 20px 0 !important;
}

/* ---------- Кнопка "Показати більше / Приховати" ---------- */
.desc-toggle-btn,
#tab-description .show-more,
#tab-description .show-less {
    display: inline-block !important;
    color: #e53935 !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    text-decoration: underline !important;
    margin-top: 14px !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    font-family: 'Comfortaa', sans-serif !important;
}
.desc-toggle-btn:hover,
#tab-description .show-more:hover,
#tab-description .show-less:hover {
    color: #b71c1c !important;
}

/* ---------- Кнопка "Копіювати" ---------- */
.qw_qqqqq {
    margin-top: 16px !important;
    text-align: right !important;
}
.copy-desc-btn {
    background: #F5C518 !important;
    border: none !important;
    color: #1a1a1a !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    padding: 8px 18px !important;
    border-radius: 20px !important;
    box-shadow: none !important;
    transition: background .15s ease, transform .1s ease !important;
}
.copy-desc-btn:hover {
    background: #e6b600 !important;
    color: #1a1a1a !important;
    transform: translateY(-1px) !important;
}
.copy-desc-btn i {
    margin-right: 4px !important;
}

/* ---------- Адаптив ---------- */
@media (max-width: 480px) {
    #desc-content {
        font-size: 14px !important;
    }
    #desc-content h1 { font-size: 20px !important; }
    #desc-content h2 { font-size: 18px !important; }
    #desc-content h3 { font-size: 16px !important; }
    .qw_qqqqq {
        text-align: left !important;
    }
}



/* =========================================================
   PRODUCT PAGE STYLE OVERRIDE
   Подключить этот файл ПОСЛЕ основных стилей темы,
   чтобы !important гарантированно перебивал старые правила.
   ========================================================= */

/* ---------- Общий контейнер товара ---------- */
#product {
    font-family: 'Comfortaa', sans-serif !important;
}

/* ---------- Кнопки Prev/Next товар ---------- */
#next-prev-box .nextprevprod {
    margin-bottom: 15px !important;
}
#next-prev-box .btn {
    border-radius: 20px !important;
    border: 1px solid #eee !important;
    background: #fff !important;
    color: #333 !important;
    font-size: 12px !important;
}

/* ---------- Наявність товару ---------- */
.top-info-product.stock_rating_line {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 10px !important;
}
.stock_status_success {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #00BC52 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
}
.stock_status_success svg path {
    fill: #00BC52 !important;
}

/* остаток товара */
.cocococo {
    position: static !important;
    display: inline-block !important;
    color: #e53935 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    margin: 0 0 10px 0 !important;
}

/* ---------- Рейтинг ---------- */
.rating.info-product {
    margin-bottom: 15px !important;
}
.rating-box {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
}
.product-rating-star svg path {
    fill: #FFC107 !important;
}
.quantity-reviews a {
    margin-left: 8px !important;
    color: #999 !important;
    font-size: 13px !important;
    text-decoration: underline !important;
}

/* ---------- Блок Модель / Бренд ---------- */
.top-info-product {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 20px !important;
    padding: 12px 16px !important;
    background: #fafafa !important;
    border-radius: 12px !important;
    margin-bottom: 18px !important;
}
.info-product.p-model {
    font-size: 14px !important;
    color: #555 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}
.info-product.p-model b {
    color: #222 !important;
    font-weight: 600 !important;
}
.copy-model-btn {
    background: none !important;
    border: none !important;
    color: #999 !important;
    padding: 0 4px !important;
}
.copy-model-btn:hover {
    color: #333 !important;
}

.info-product.p-brand a span {
    display: inline-block !important;
    padding: 4px 12px !important;
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 20px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #333 !important;
}

/* ---------- Закупочная цена (служебная, скрыта визуально при желании) ---------- */
.zak {
    position: static !important;
    color: #bbb !important;
    font-size: 12px !important;
    margin-bottom: 4px !important;
}

/* ---------- Основная цена ---------- */
.price {
    margin: 10px 0 20px 0 !important;
}
.autocalc-product-price {
    font-size: 32px !important;
    font-weight: 700 !important;
    color: #e53935 !important;
    line-height: 1 !important;
}

/* ---------- Блок действий: количество + кнопки ---------- */
.actions {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex-wrap: wrap !important;
}

/* --- Счётчик количества --- */
.quantity-adder {
    display: flex !important;
    align-items: center !important;
    background: #fff !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 24px !important;
    padding: 4px 6px !important;
    float: none !important;
}
.quantity-number {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    float: none !important;
}
.quantity-number .add-action {
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #f5f5f5 !important;
    color: #e53935 !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: background .15s ease !important;
}
.quantity-number .add-action:hover {
    background: #ffe0e0 !important;
}
.quantity-product {
    width: 34px !important;
    text-align: center !important;
    border: none !important;
    background: transparent !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #222 !important;
}


button#button-cart {
    height: 46px;
    font-size: 22px !important;
}


/* --- Кнопка "В кошик" --- */
.cart .btn-general {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #F5C518 !important;
    border: none !important;
    color: #1a1a1a !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 12px 11px !important;
    border-radius: 24px !important;
    box-shadow: none !important;
    transition: background .15s ease, transform .1s ease !important;
}
.cart .btn-general:hover {
    background: #e6b600 !important;
    transform: translateY(-1px) !important;
}
.cart .btn-general .icon-cart-add {
    font-size: 16px !important;
}

/* --- Wishlist / Compare кнопки --- */
.btn-wishlist,
.btn-compare {
    width: 42px !important;
    height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    border: 1px solid #eee !important;
    background: #fff !important;
    padding: 0 !important;
}
.btn-wishlist:hover,
.btn-compare:hover {
    border-color: #F5C518 !important;
    background: #fffdf2 !important;
}

/* ---------- Адаптив ---------- */
@media (max-width: 480px) {
    .top-info-product {
        gap: 10px !important;
        padding: 10px 12px !important;
    }
    .autocalc-product-price {
        font-size: 26px !important;
    }
    .actions {
        gap: 10px !important;
    }
    .cart .btn-general {
        padding: 10px 20px !important;
        font-size: 14px !important;
    }
}

#product .actions .btn-general .icon-cart-add {
    margin-right: 5px;
    display: none;
}


.dropdown-toggle svg path {
    stroke: #111111 !important;
}
a.dropdown-toggle.dropdown-img {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}



.la-action--phone .la-action__icon-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}

.la-action__icon--round {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    min-width: 34px;
    border-radius: 50%;
    background: #F5C518; /* тот самый жёлтый, как у "Ваше місто" */
    color: #111;
}

.la-action__icon--round img,
.la-action__icon--round svg {
    width: 16px;
    height: 16px;
}

.la-action__text {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    text-align: left;
    white-space: nowrap;
}

.la-action__label {
    font-size: 11px;
    color: #9a9a9a;
    font-weight: 400;
}

.la-action__value {
    font-size: 14px;
    font-weight: 700;
    color: #1a56db; /* синий, как "Львів" */
}

@media (max-width: 768px) {
    .la-action--phone .la-action__text {
        display: none; /* на мобилке можно оставить только иконку */
    }
}


.list-right-block {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
}


.box-stock-status {
    position: absolute;
    top: 0;
    right: 0;
}


/* ==========================================================================
   CART PILL — targets the exact real markup:
   .shopping-cart.type_cart > #cart.btn-group.btn-block > button.btn.dropdown-toggle
   ========================================================================== */

.la-action--cart-module .shopping-cart.type_cart {
	display: flex;
	align-items: center;
}

.la-action--cart-module #cart.btn-group.btn-block {
	display: flex;
	width: auto;
}

.la-action--cart-module #cart > button.btn.dropdown-toggle {
	display: flex !important;
	align-items: center;
	gap: 8px;
	width: auto;
	background: #ffffff !important;
	border: 1px solid #ececec !important;
	border-radius: 22px !important;
	padding: 8px 16px !important;
	color: #111111 !important;
	box-shadow: none !important;
	height: auto !important;
	line-height: 1.2 !important;
	font-size: 15px;
}

.la-action--cart-module #cart > button.btn.dropdown-toggle:hover,
.la-action--cart-module #cart > button.btn.dropdown-toggle:focus,
.la-action--cart-module #cart > button.btn.dropdown-toggle:active {
	background: #f6f6f6 !important;
	color: #111111 !important;
	box-shadow: none !important;
}

/* icon: svg paths are white via fill="white" attribute — recolor to black */
.la-action--cart-module #cart .shop-bag {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}
.la-action--cart-module #cart .shop-bag path {
	fill: #111111 !important;
}

/* total text */
.la-action--cart-module #cart .cart-total {
	display: flex;
	align-items: center;
	gap: 3px;
	color: #111111;
	font-weight: 600;
}
.la-action--cart-module #cart .cart-total .products {
	display: none; /* hides "0 Товарів," — keep only the price, like the LA reference */
}
.la-action--cart-module #cart .cart-total .prices {
	color: #111111;
	font-weight: 600;
	font-size: 15px;
}
.la-action--cart-module #cart .cart-total .prices b {
	color: #111111 !important;
	font-weight: 600;
}

/* dropdown panel */
.la-action--cart-module #cart .dropdown-menu {
	border: 1px solid #ececec !important;
	border-radius: 14px !important;
	box-shadow: 0 16px 36px rgba(0, 0, 0, .12) !important;
	padding: 10px !important;
	margin-top: 10px !important;
	min-width: 220px;
}
.la-action--cart-module #cart .dropdown-menu .text-center {
	color: #8a8a8a;
	font-size: 14px;
	margin: 6px 0;
}

.la-header {
	background: #ffffff;
	border-bottom: 1px solid var(--la-border);
	position: relative;
	z-index: 100;
}

.la-header .container {
	margin: 0 auto;
	padding: 0 24px;
}

.la-header a {
	text-decoration: none;
	color: inherit;
}

/* --------------------------------------------------------------------
   TOP ROW
   -------------------------------------------------------------------- */

.la-header__top {
	display: flex;
	align-items: center;
	gap: 24px;
	min-height: var(--la-header-height);
	padding: 10px 0;
}


.la-burger {
	flex-shrink: 0 !important;
	box-sizing: border-box !important;
}
.la-burger span {
	flex-shrink: 0 !important;
}



@media (max-width: 991px) {

	/* строка "выезжает" ровно на величину правого padding контейнера,
	   поэтому последний flex-элемент (бургер, order:5) сам оказывается
	   у самого края экрана — без absolute-позиционирования */
	.la-header__top {
		margin-right: -12px;
	}

	.la-burger {
		border-radius: 10px 0 0 10px; /* плоский правый край у самого экрана */
	}
}




/* top links nav */
.la-topnav {
	display: flex;
	align-items: center;
	gap: 28px;
	order: 1;
}

.la-topnav__link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	background: none;
	border: none;
	padding: 8px 12px;
	font-size: 14px;
	font-weight: 500;
	color: var(--la-text);
	white-space: nowrap;
	cursor: pointer;
	border-radius: 8px;
	transition: background-color .15s ease, color .15s ease;
}
.la-topnav__link:hover {
	background: #f6f6f6;
}

/* "Акції" style pill (first item, highlighted like screenshot) */
.la-topnav > a.la-topnav__link:first-child,
.la-topnav > .la-topnav__item:first-child .la-topnav__link {
	background: #fff9e6;
	border: 1px solid var(--la-yellow);
}

/* search trigger — text button inside the top-links row (desktop) */
.la-search-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.la-search-btn svg { color: var(--la-text-muted); flex-shrink: 0; }

/* search trigger — icon-only, lives in the actions row (mobile) */
.la-action.la-action--search-icon {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	display: none; /* shown only on mobile, see media query below — overridden there */
}

.la-topnav__item {
	position: relative;
}
.la-topnav__item svg { color: var(--la-text-muted); transition: transform .15s ease; }
.la-topnav__item.is-open svg { transform: rotate(180deg); }

.la-topnav__dropdown {
	display: none;
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	min-width: 180px;
	background: #fff;
	border: 1px solid var(--la-border);
	border-radius: var(--la-radius);
	box-shadow: 0 12px 28px rgba(0,0,0,.10);
	padding: 6px;
	margin: 0;
	list-style: none;
	  z-index: 999999;
}
.la-topnav__item.is-open .la-topnav__dropdown { display: block; }
.la-topnav__dropdown li a {
	display: block;
	padding: 8px 12px;
	font-size: 14px;
	border-radius: 6px;
	color: var(--la-text);
}
.la-topnav__dropdown li a:hover { background: #f6f6f6; }

/* logo */
.la-logo {
	order: 2;
	margin: 0 auto;
	flex-shrink: 0;
}
.la-logo a { display: flex; }
.la-logo img { display: block; height: 40px; width: auto; }
.la-logo__link {
	display: flex;
	align-items: center;
	gap: 10px;
}
.la-logo__fallback {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	flex-shrink: 0;
	background: var(--la-yellow);
	color: var(--la-black);
	font-weight: 800;
	font-size: 17px;
	border-radius: var(--la-radius);
	letter-spacing: .5px;
}
.la-logo__wordmark {
	font-weight: 800;
	font-size: 16px;
	line-height: 1.15;
	color: var(--la-black);
	white-space: nowrap;
}

/* right-side actions */
.la-header__actions {
	display: flex;
	align-items: center;
	gap: 24px;
	order: 3;
	margin-left: auto;
}

.la-action {
	display: flex;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
}
.la-action__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--la-black);
	flex-shrink: 0;
}
.la-action__value {
	font-size: 15px;
	font-weight: 600;
	color: var(--la-text);
}
.la-action__value sup { font-size: 11px; margin-left: 1px; }

.la-action--city__text {
	display: flex;
	flex-direction: column;
	line-height: 1.15;
}
.la-action__label {
	font-size: 11px;
	color: var(--la-text-muted);
	font-weight: 500;
}
.la-action__value { }
.la-action--city .la-action__value { color: #2f6fed; font-weight: 700; }

/* --------------------------------------------------------------------
   SEARCH PANEL — slides open under the top row when the search
   button (desktop text link or mobile icon) is clicked
   -------------------------------------------------------------------- */

.la-search-panel {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: max-height .22s ease, opacity .18s ease;
}
.la-search-panel.is-open {
	max-height: 90px;
	opacity: 1;
	padding-bottom: 14px;
}

.la-search-panel__form {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #f6f6f6;
	border: 1px solid var(--la-border);
	border-radius: var(--la-radius);
	padding: 10px 14px;
	margin-top: 4px;
}
.la-search-panel__icon { color: var(--la-text-muted); flex-shrink: 0; }
.la-search-panel__input {
	flex: 1;
	border: none;
	background: none;
	outline: none;
	font-size: 15px;
	font-family: inherit;
	color: var(--la-text);
}
.la-search-panel__input::placeholder { color: var(--la-text-muted); }
.la-search-panel__close {
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	color: var(--la-text-muted);
	cursor: pointer;
	padding: 4px;
	flex-shrink: 0;
}
.la-search-panel__close:hover { color: var(--la-black); }

/* --------------------------------------------------------------------
   RIGHT-SIDE ACTIONS — phone / compare / wishlist / cart
   -------------------------------------------------------------------- */

.la-action__icon-btn {
	display: flex;
	align-items: center;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	color: var(--la-black);
	position: relative;
}

/* 1. phone */
.la-action--phone { position: relative; }

.la-phone-dropdown {
	display: none;
	position: absolute;
	top: calc(100% + 12px);
	right: 0;
	min-width: 260px;
	max-width: 300px;
	background: #fff;
	border: 1px solid var(--la-border);
	border-radius: var(--la-radius);
	box-shadow: 0 12px 28px rgba(0,0,0,.12);
	padding: 8px;
	margin: 0;
	list-style: none;
	z-index: 9010;
}

.breadcrumbs-box {
    margin-top: 11px;
}


.la-action--phone.is-open .la-phone-dropdown { display: block; }

.la-phone-dropdown li { padding: 0; }
.la-phone-dropdown li a,
.la-phone-dropdown__row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	font-size: 13px;
	font-weight: 500;
	color: var(--la-text);
	border-radius: 8px;
}
.la-phone-dropdown li a:hover { background: #f6f6f6; }
.la-phone-dropdown__icon { display: flex; flex-shrink: 0; }
.la-phone-dropdown__icon img { width: 16px; height: 16px; }
.la-phone-dropdown__divider { height: 1px; background: var(--la-border); margin: 4px 6px; }
.la-phone-dropdown__info {
	padding: 8px 10px 4px;
	font-size: 12px;
	color: var(--la-text-muted);
	line-height: 1.4;
}
.la-phone-dropdown__hours {
	padding: 8px 10px 4px;
	font-size: 12px;
	color: var(--la-text-muted);
	border-top: 1px solid var(--la-border);
	margin-top: 4px;
}

/* 2 & 3. compare / wishlist */
.la-action--compare,
.la-action--wishlist { position: relative; }

.la-action__badge {
	position: absolute;
	top: -6px;
	right: -8px;
	background: var(--la-yellow);
	color: var(--la-black);
	font-size: 10px;
	font-weight: 700;
	min-width: 16px;
	height: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	padding: 0 3px;
	line-height: 1;
}

/* 4. cart module — real OpenCart markup rendered via {{ cart }}, keep its own theme styling */
.la-action--cart-module { display: flex; align-items: center; }

/* --------------------------------------------------------------------
   CATEGORY ROW
   -------------------------------------------------------------------- */

.la-catnav {
	border-top: 1px solid var(--la-border);
}

.la-catnav__scroller {
	display: flex;
	align-items: center;
	gap: 8px;
	overflow-x: auto;
	padding: 12px 0;
	scrollbar-width: none;
}
.la-catnav__scroller::-webkit-scrollbar { display: none; }

.la-catnav__link {
	flex-shrink: 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--la-text);
	padding: 8px 16px;
	border-radius: 20px;
	border: 1px solid transparent;
	white-space: nowrap;
}
.la-catnav__link:hover { background: #f6f6f6; }
.la-catnav__link--active {
	border-color: var(--la-yellow);
	color: var(--la-black);
}

/* --------------------------------------------------------------------
   RESPONSIVE — MOBILE  (<= 768px), matches the phone screenshot
   -------------------------------------------------------------------- */


/* ==========================================================================
   MOBILE CATEGORY MENU (burger + slide-out panel)
   ========================================================================== */

.la-burger {
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 4px;
	width: 40px;
	height: 40px;
	background: #f6f6f6;
	border: none;
	border-radius: 10px;
	padding: 0;
	cursor: pointer;
	order: 5;
	transition: background-color .15s ease;
}
.la-burger:hover {
	background: #ececec;
}
.la-burger span {
	display: block;
	height: 2px;
	width: 18px;
	background: var(--la-black);
	border-radius: 2px;
	transition: transform .25s ease, opacity .2s ease;
}
.la-burger.is-active {
	background: #111111;
}
.la-burger.is-active span {
	background: #ffffff;
}
.la-burger.is-active span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.la-burger.is-active span:nth-child(2) { opacity: 0; }
.la-burger.is-active span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 991px) {

	.la-burger { display: flex; }

	.navbar-header .navbar-toggle-m {
		display: none !important;
	}

	/* panel slides in from the right */
	.navbar-ex1-collapse {
		position: fixed !important;
		top: 0;
		right: -100%;
		bottom: 0;
		width: 320px;
		max-width: 88vw;
		height: 100%;
		background: #fff;
		z-index: 99999;
		transition: right .32s cubic-bezier(.25,.8,.25,1);
		overflow-y: auto;
		box-shadow: -20px 0 50px rgba(0,0,0,.18);
		padding: 0 !important;
		border: 0 !important;
		-webkit-overflow-scrolling: touch;
	}
	.navbar-ex1-collapse.in {
		right: 0;
	}

	.navbar-ex1-collapse.in .navbar-nav {
		visibility: visible !important;
		overflow: visible !important;
	}

	/* sticky header inside panel: title + close button */
	.navbar-header {
		position: sticky;
		top: 0;
		background: #fff;
		z-index: 2;
		padding: 16px 16px;
		border-bottom: 1px solid var(--la-border);
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.navbar-header::before {
		content: 'Меню';
		font-size: 16px;
		font-weight: 800;
		color: var(--la-black);
	}

	/* the theme's own toggle button becomes a clean round close (X) button */
	.navbar-toggle-m {
		position: relative;
		width: 34px;
		height: 34px;
		background: #f6f6f6 !important;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		border: none;
		cursor: pointer;
		transition: background-color .15s ease;
		flex-shrink: 0;
	}
	.navbar-toggle-m:hover {
		background: #ececec !important;
	}
	.navbar-toggle-m .menu-icon { display: none; }
	.navbar-toggle-m::before,
	.navbar-toggle-m::after {
		content: '';
		position: absolute;
		width: 14px;
		height: 2px;
		background: #111;
		border-radius: 2px;
	}
	.navbar-toggle-m::before { transform: rotate(45deg); }
	.navbar-toggle-m::after { transform: rotate(-45deg); }

	/* category list */
	.navbar-ex1-collapse .navbar-nav {
		padding: 10px 10px 24px;
	}
	.navbar-ex1-collapse .navbar-nav > li {
		border-bottom: none !important;
		background: transparent !important;
		margin-bottom: 2px;
	}

	.navbar-ex1-collapse .nav > li > a {
		display: flex !important;
		align-items: center;
		padding: 14px 12px !important;
		font-size: 15px;
		font-weight: 600;
		color: #111 !important;
		border-radius: 12px;
		transition: background-color .15s ease;
	}
	.navbar-ex1-collapse .nav > li > a:active,
	.navbar-ex1-collapse .nav > li.dropdown.open > a {
		background: #f6f6f6;
	}

	/* hide the theme's own down-arrow svg on parent links */
	.navbar-ex1-collapse .nav > li.dropdown > a .arrow {
		display: none !important;
	}

	/* right-facing chevron on items with subcategories */
	.navbar-ex1-collapse .nav > li.dropdown > a {
		position: relative;
	}
	.navbar-ex1-collapse .nav > li.dropdown > a::after {
		content: '';
		position: absolute;
		right: 14px;
		top: 50%;
		width: 8px;
		height: 8px;
		border-right: 2px solid #b5b5b5;
		border-bottom: 2px solid #b5b5b5;
		transform: translateY(-60%) rotate(-45deg);
		transition: transform .2s ease, border-color .2s ease;
	}
	.navbar-ex1-collapse .nav > li.dropdown.open > a::after {
		transform: translateY(-30%) rotate(45deg);
		border-color: #111;
	}

	/* submenu — soft rounded block under the parent row */
	.navbar-ex1-collapse .dropdown-menu {
		position: static !important;
		display: none;
		float: none;
		width: 100% !important;
		margin: 2px 0 8px !important;
		box-shadow: none !important;
		border: 0 !important;
		background: #f9f9f9;
		border-radius: 12px;
		overflow: hidden;
	}
	.navbar-ex1-collapse .nav > li.dropdown.open > .dropdown-menu {
		display: block;
		animation: la-submenu-fade .18s ease;
	}
	@keyframes la-submenu-fade {
		from { opacity: 0; transform: translateY(-4px); }
		to   { opacity: 1; transform: translateY(0); }
	}


	.navbar-ex1-collapse .dropdown-menu a:active {
		background: #f0f0f0 !important;
	}
	.navbar-ex1-collapse .dropdown-menu li + li {
		border-top: 1px solid #ececec;
	}

	/* dark overlay behind the panel */
	.mobm-menu-blur.active-blur {
		display: block;
		z-index: 99998;
		background: rgba(0,0,0,.35);
	}

	/* lock page scroll while panel is open */
	body.menu-panel-open {
		overflow: hidden;
	}
}




@media (max-width: 991px) {
	.la-burger { display: flex; }
}



@media (max-width: 991px) {
    .la-header__top {
        justify-content: space-between;
        gap: 12px;
    }

    .la-header__actions {
        flex: 1 1 auto;
        justify-content: space-between; /* именно space-between, а не space-evenly —
                                            иконки прижмутся к краям блока и разъедутся между собой */
        gap: 0;
        margin-left: 0;
    }
}


/* базовый мобильный размер иконок (уже был) */
@media (max-width: 991px) {

    #wishlist-total, #compare-total {
        position: static;
        left: auto;
    }

    .la-header__actions .la-action,
    .la-header__actions .la-action--cart-module {
        width: 36px;
        min-width: 36px;
        justify-content: center;
    }

    .la-header__actions .la-action__icon-btn {
        width: 36px;
        height: 36px;
        justify-content: center;
    }

    .la-header__actions .la-action__text,
    .la-header__actions .la-action--account__text {
        display: none;
    }

    .la-action--cart-module .shopping-cart.type_cart,
    .la-action--cart-module #cart.btn-group.btn-block {
        width: 36px;
    }
    .la-action--cart-module #cart > button.btn.dropdown-toggle {
        width: 36px !important;
        padding: 8px !important;
        justify-content: center;
    }
    .la-action--cart-module #cart .cart-total {
        display: none;
    }
}

/* уже) экраны ≤370px — уменьшаем ещё */
@media (max-width: 370px) {

    .la-header__actions {
        gap: 4px; /* уменьшаем и промежутки между иконками */
    }

    .la-header__actions .la-action,
    .la-header__actions .la-action--cart-module {
        width: 32px;
        min-width: 32px;
    }

    .la-header__actions .la-action__icon-btn {
        width: 32px;
        height: 32px;
    }

    .la-header__actions .la-action__icon svg {
        width: 15px;
        height: 15px;
    }

    .la-action--cart-module .shopping-cart.type_cart,
    .la-action--cart-module #cart.btn-group.btn-block {
        width: 32px;
    }
    .la-action--cart-module #cart > button.btn.dropdown-toggle {
        width: 32px !important;
        padding: 6px !important;
    }
    .la-action--cart-module #cart .shop-bag {
        width: 16px;
        height: 16px;
    }
}

/* ещё) экраны ≤360px — минимальный размер */
@media (max-width: 360px) {

    .la-header__actions {
        gap: 2px;
    }

    .la-header__actions .la-action,
    .la-header__actions .la-action--cart-module {
        width: 28px;
        min-width: 28px;
    }

    .la-header__actions .la-action__icon-btn {
        width: 28px;
        height: 28px;
    }

    .la-header__actions .la-action__icon svg {
        width: 14px;
        height: 14px;
    }

    .la-action--cart-module .shopping-cart.type_cart,
    .la-action--cart-module #cart.btn-group.btn-block {
        width: 28px;
    }
    .la-action--cart-module #cart > button.btn.dropdown-toggle {
        width: 28px !important;
        padding: 5px !important;
    }
    .la-action--cart-module #cart .shop-bag {
        width: 14px;
        height: 14px;
    }
}




@media (max-width: 991px) {
    .la-header__top {
        justify-content: space-between; /* лого слева — остальное справа */
    }

    .la-header__actions {
        margin-left: 0;
        gap: 14px;        /* обычный фиксированный отступ между иконками */
        /* убрали: flex: 1 1 auto; justify-content: space-between; */
    }
	
	nav#la-topnav {
    display: none;
}

}

@media (max-width: 768px) {
    .la-logo { order: 0; margin: 0; }
    .la-logo img { height: 32px; }
    .la-logo__fallback { width: 38px; height: 38px; font-size: 14px; }
    .la-logo__wordmark { display: none; }

    .la-topnav { /* без изменений, как было */ }

    .la-header__actions {
        order: 2;
        margin-left: auto;   /* эта строка теперь то, что нужно — прижимает блок вправо */
        gap: 10px;
        /* убрали justify-content: space-between/evenly и flex:1 */
    }

    .la-action__value { font-size: 14px; }
    .la-phone-dropdown { right: -12px; max-width: calc(100vw - 24px); }
    .la-search-panel.is-open { max-height: 76px; padding-bottom: 10px; }
    .la-search-panel__form { padding: 8px 12px; }
    .la-catnav__scroller { padding: 10px 0; gap: 6px; }
    .la-catnav__link { font-size: 13px; padding: 7px 14px; }
}
































/* small phones */
@media (max-width: 380px) {
	.la-header__actions { gap: 10px; }
	.la-logo img { height: 28px; }
}