﻿
.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #444;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.swiper {
    width: 100%;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
}

.swiper-slide {
    background-size: cover;
    background-position: center;
}

.mySwiper2 {
    height: 80%;
    width: 100%;
}

.mySwiper {
    height: 20%;
    box-sizing: border-box;
    padding: 10px 0;
}

    .mySwiper .swiper-slide {
        width: 25%;
        height: 100%;
        opacity: 0.4;
    }

    .mySwiper .swiper-slide-thumb-active {
        opacity: 1;
    }

.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.flex-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100vw;
}
/* активний стан */
.addcart-modal-overlay.show {
    display: flex;
    opacity: 1;
}

.navbar-brand {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.popular-item.color-card.not-move:hover .popular-card {
    transform: none;
}

.popular-item:hover .img-arrow {
    opacity: 1;
}

.logo-carousel__track {
    display: flex;
    flex-wrap: nowrap; /* головне — НЕ переносити */
    align-items: center;
    white-space: nowrap;
}

.logo-carousel__wrapper {
    display: flex;
    gap: 32px;
    flex-shrink: 0; /* не стискається */
    width: auto; /* ключове — замінено з 100% */
}

.wrapper-logo-chain {
    flex: none;
}

@media (max-width: 991px) {
    /* Градієнт бекграунд для меню */
    body.light-theme .navbar-navigation {
        background-image: linear-gradient(#EFEFEF, #D6BCC5);
    }
    /* Тексти */
    body.light-theme .navbar-link,
    body.light-theme .mobile-nav-title,
    body.light-theme .mobile-nav-link {
        color: #9D9D9D;
    }
    /* Dropdown (Каталог → лінки) */
    body.light-theme .catalog-dropdown-link {
        color: #5D5D5D;
    }
    /* Лінії */
    body.light-theme .divider-nav {
        background-color: #FFFFFF;
    }
    /* Соц. іконки */
    body.light-theme .mobile-social-icon {
        background-color: #9D9D9D;
        color: #E6E6E8;
    }
    /* Лого у мобільному меню */
    body.light-theme .mobile-social-brand {
        color: #9D9D9D;
    }

    body.light-theme .burger-menu.w--open .top-line-burger,
    body.light-theme .burger-menu.w--open .center-line-burger,
    body.light-theme .burger-menu.w--open .bottom-line-burger {
        background-color: #9D9D9D;
    }

    body.light-theme .burger-button-wrapper .top-line-burger,
    body.light-theme .burger-button-wrapper .center-line-burger,
    body.light-theme .burger-button-wrapper .bottom-line-burger {
        background-color: #A9828B;
    }

    body.light-theme .footer {
        border-top: 0;
    }
}

.popular-item:hover .popular-footer {
    height: 70px;
    overflow: visible;
}

.popular-item:hover .popular-card {
    transform: translateY(-26px);
}

.wrapper-item-size.active .size-marker {
    width: 12px;
    transition: width 0.3s ease;
    background-color: #8F8E8E;
}
/* Базові стилі */
.addcart {
    transition: background-color 0.3s ease;
}
/* Ховер на всій кнопці */
.popular-footer:hover .addcart:not(:hover) {
    background-color: #E3E3E3;
}
/* Ховер безпосередньо на іконці (має пріоритет) */
.popular-footer .addcart:hover {
    background-color: #402424;
    color: white;
}

.cart-popup.is-hidden {
    transition: all .2s;
    transform: translate(106%);
}

.cart-popup.open {
    transform: translateX(0%);
    opacity: 1;
    pointer-events: auto;
}

.image-product {
    transition: transform 0.8s ease, opacity 0.8s ease;
    transform-origin: center center;
}

    .image-product.zoom-out {
        transform: scale(1.08); /* трошки збільшується */
        opacity: 0.7; /* легке затемнення */
    }
/* cart-page Якщо працюєш без препроцесора (чистий CSS) — ось той самий код: */
.cart-item:last-child {
    padding-bottom: 0;
    border-bottom: none;
    margin-bottom: 0;
}
/* 7px загальна ширина */
.cart-item-list::-webkit-scrollbar {
    width: 7px;
}
/* 2px сіра лінія — справжня, не штучна */
.cart-item-list::-webkit-scrollbar-track {
    background: #1a1a1a; /* фон */
}

    .cart-item-list::-webkit-scrollbar-track:vertical {
        background: linear-gradient( to right, transparent 2px, rgba(255,255,255,0.12) 2px, rgba(255,255,255,0.12) 4px, transparent 4px );
    }
/* 5px рожевий повзунок — строго по центру */
.cart-item-list::-webkit-scrollbar-thumb {
    background: #ca8b8e;
    border-radius: 10px;
    /* центрування хендла: */
    width: 5px;
    margin-left: 1px;
    margin-right: 1px;
}

    .cart-item-list::-webkit-scrollbar-thumb:hover {
        background: #d79a9d;
    }

@media (max-width: 991px) {
    .popular-item:hover .popular-footer {
        height: 58px;
    }

    .footer-product-info {
        width: calc(100% + 16px); /* додаємо 8px зліва і 8px справа */
        margin-left: -8px;
        margin-right: -8px;
    }
}

.image-product {
    transition: transform 0.4s ease, filter 0.4s ease;
}

.blur-anim {
    filter: blur(8px);
    transform: scale(1.08);
}



body {
    transition: background-color 0.3s ease, color 0.3s ease;
}
/* Світла тема */
body.light-theme {
    background-color: #EAEAEE !important;
}
    /* Світла тема */
    body.light-theme .is-black {
        display: none !important;
    }

    body.light-theme .is-white {
        display: inline-flex !important;
    }
    /* Світла тема — фон футера */
    body.light-theme .footer {
        margin-top: 0px;
        background-color: #EFEFEF !important;
    }
    /* Світла тема — section-team прозора */
    body.light-theme .section-team {
        background-color: transparent !important;
    }
    /* HERO */
    body.light-theme .section-head-home .hero-title {
        color: #5D5D5D;
    }

    body.light-theme .section-head-home .hero-text {
        color: #9D9D9D;
    }
    /* TECHNOLOGY */
    body.light-theme .section-technology .technology-title {
        color: #5D5D5D;
    }

    body.light-theme .section-technology .technology-text {
        color: #7C7B7B;
    }
    /* ABOUT */
    body.light-theme .section-about .about-title {
        color: #626262;
    }

    body.light-theme .section-about .about-text {
        color: #B4B4B4;
    }
    /* ЛОГО (SVG) */
    body.light-theme .navbar .logo-code-svg,
    body.light-theme .navbar .logo-code-svg svg,
    body.light-theme .navbar .logo-code-svg path {
        color: #5D5D5D;
    }

    body.light-theme .theme-toggle-btn {
        justify-content: flex-start; /* кружечок вліво */
        background-image: linear-gradient(90deg, #DEB1BF 0%, #DF9EB2 51%, #CF8CA1 100%);
    }
/* Темна тема (за замовчуванням) */
.theme-toggle-btn .black-theme {
    display: block;
}

.theme-toggle-btn .white-theme {
    display: none;
}
/* Світла тема */
body.light-theme .theme-toggle-btn .black-theme {
    display: none;
}

body.light-theme .theme-toggle-btn .white-theme {
    display: block;
}
/* Світла тема — неактивні елементи */
body.light-theme .wrapper-item-size {
    color: #C0C0C1;
}

    body.light-theme .wrapper-item-size .size-marker {
        background-color: #C0C0C1;
    }
    /* Світла тема — активний елемент */
    body.light-theme .wrapper-item-size.active {
        color: #A4A4A4;
    }

        body.light-theme .wrapper-item-size.active .size-marker {
            background-color: #A4A4A4;
        }

body.light-theme .hero-button {
    color: #402424;
}

    body.light-theme .hero-button:hover {
        background-color: #FFACC6;
    }

    body.light-theme .hero-button:active {
        background-color: #402424;
        color: #FFFFFF;
    }

body.light-theme .popular-button-text {
    color: #402424;
}

    body.light-theme .popular-button-text:hover {
        color: #402424;
        background-color: #FFACC6;
    }

body.light-theme .addcart {
    background-color: #FFACC6;
}

body.light-theme .logo-tech {
    color: #FFACC6;
}

body.light-theme .logo-footer {
    color: #C4C4C4;
}

body.light-theme .footer-link,
body.light-theme .footer-column-title,
body.light-theme .footer-contact-title,
body.light-theme .footer-contact-type,
body.light-theme .footer-contact-number {
    color: #C4C4C4;
}

body.light-theme .footer-contact-value {
    color: #ACACAC;
}

    body.light-theme .footer-contact-value:hover {
        color: #FFACC6;
    }

body.light-theme .footer-link:hover {
    color: #FFACC6;
}

body.light-theme .popular-link {
    color: #7C7B7B;
}

    body.light-theme .popular-link:hover {
        color: #FFACC6;
    }

.popular-item:hover .popular-category,
.popular-item:hover .popular-price {
    color: #585151;
}
/* Фон */
body.light-theme .cart-popup,
body.light-theme .cart-popup-header {
    background-color: #EFEFEF;
}
/* Текст 9D9D9D */
body.light-theme .cart-popup-title,
body.light-theme .cart-popup-close,
body.light-theme .cart-popup-price {
    color: #9D9D9D;
}
/* cart-popup-name — колір 5D5D5D */
body.light-theme .cart-popup-name {
    color: #5D5D5D;
}
/* Колір для size-label/value/remove — 7C7B7B */
body.light-theme .cart-popup-size-label,
body.light-theme .cart-popup-size-value,
body.light-theme .cart-popup-remove {
    color: #7C7B7B;
}
/* Кнопки кількості */
body.light-theme .quantity-btn {
    background-color: #E5E5E5;
    color: #5D5D5D; /* щоб текст не зникав */
}
/* quantity-number */
body.light-theme .quantity-number {
    border-color: #5D5D5D;
    color: #FFFFFF;
}
/* quantity-number — текст 5D5D5D */
body.light-theme .quantity-number {
    color: #5D5D5D;
    border-color: #5D5D5D;
}
/* Бордер між айтемами */
body.light-theme .cart-popup-item {
    border-bottom: 1px solid #EAEAEE;
}
/* summary блок */
body.light-theme .cart-popup-summary {
    background-color: #EFEFEF;
}
/* checkout кнопка */
body.light-theme .summary-checkout-btn {
    color: #5D5D5D;
}
/* summary labels */
body.light-theme .summary-label,
body.light-theme .summary-value {
    color: #9D9D9D;
}

body.light-theme .cart-popup-close:hover {
    color: #FFACC6;
}
/* Дефолт */
body.light-theme .summary-checkout-btn {
    color: #5D5D5D;
}
    /* Hover */
    body.light-theme .summary-checkout-btn:hover {
        background-color: #FFACC6;
    }
    /* Active (Pressed) */
    body.light-theme .summary-checkout-btn:active {
        background-color: #402424;
        color: #FFFFFF;
    }

body.light-theme .navbar-link:hover {
    color: #402424;
}
/* Заголовок товару */
body.light-theme .product-title {
    color: #5D5D5D;
}
/* Хлібні крихти */
body.light-theme .breadcrumbs-link {
    color: #9D9D9D;
}

    body.light-theme .breadcrumbs-link.last {
        color: #C4C4C4;
    }
/* Ціна */
body.light-theme .product-price {
    color: #9D9D9D;
}
/* Параметри (характеристики) */
body.light-theme .param-label {
    color: #9D9D9D;
}

body.light-theme .param-value {
    color: #5D5D5D;
}
/* Заголовок розмірів */
body.light-theme .product-size-title {
    color: #C4C4C4;
}

body.light-theme .product-size-guide {
    color: #5D5D5D;
}

body.light-theme .popular-footer.button-head {
    background-color: #FFFFFF;
}

body.light-theme .arrow-breadcrumbs {
    color: #9D9D9D;
}
/* quantity-btn — фон білий */
body.light-theme .quantity-btn._w-b {
    background-color: #FFFFFF;
}
/* quantity-number — бордер */
body.light-theme .quantity-number._w-b {
    border-color: #795F5F;
}
/* cart-title */
body.light-theme .cart-title {
    color: #5D5D5D;
}
/* summary cart labels */
body.light-theme .summary-label-cart,
body.light-theme .summary-value-cart {
    color: #9D9D9D;
}

body.light-theme .cart-popup-name:hover,
body.light-theme .cart-popup-remove:hover {
    color: #FFACC6;
}

body.light-theme .cart-item,
body.light-theme .summary-row-cart {
    border-bottom: 2px solid #D5D5D5;
}

body.light-theme .summary-checkout-btn {
    background-color: #FFFFFF;
}
/* Заголовки */
body.light-theme .checkout-title,
body.light-theme .checkout-section-title {
    color: #5D5D5D;
}
/* Рядки з бордером */
body.light-theme .checkout-row {
    border-bottom: 2px solid #D5D5D5;
}
/* Чекбокс обведення */
body.light-theme .checkout-checkbox {
    border-color: #9D9D9D;
}

body.light-theme .checkout-section {
    border-bottom: 2px solid #D5D5D5;
}

body.light-theme .checkout-input {
    border-color: #D5D5D5;
}

body.light-theme .checkout-input {
    color: #7C7B7B;
}

body.light-theme .checkout-section.not-padding {
    border-bottom: none;
}

body.light-theme .cart-item-list .cart-item:last-child {
    border-bottom: none;
}
/* Фон треку */
body.light-theme .cart-item-list::-webkit-scrollbar-track {
    background: #D5D5D5;
}
    /* 2px сіра лінія */
    body.light-theme .cart-item-list::-webkit-scrollbar-track:vertical {
        background: linear-gradient( to right, transparent 2px, #D5D5D5 2px, #D5D5D5 4px, transparent 4px );
    }
/* 5px рожевий повзунок */
body.light-theme .cart-item-list::-webkit-scrollbar-thumb {
    background: #FFACC6;
}
/* Внутрішній квадрат — зменшено пропорційно */
.checkout-checkbox::after {
    content: "";
    position: absolute;
    inset: 2px; /* ⬅ пропорційний внутрішній паддинг */
    background: transparent;
    transition: 0.25s ease;
}
/* Позбавляємось дефолтного білої заливки Webflow */
.checkout-checkbox.w--redirected-checked {
    background-color: #0E0C0C !important;
    background-image: none !important;
    border-color: #C7A8A8;
}
    /* CHECKED — білий квадрат + glow під нові розміри */
    .checkout-checkbox.w--redirected-checked::after {
        background: #FFFFFF;
        box-shadow: 0 0 14px rgba(255, 255, 255, 0.35), 0 0 7px rgba(255, 255, 255, 0.55);
    }
/* Внутрішній квадрат */
body.light-theme .checkout-checkbox::after {
    content: "";
    position: absolute;
    inset: 2px; /* новий інсет */
    background: transparent;
    transition: 0.25s ease;
}
/* Stan CHECKED — FFACC6 квадрат + glow */
body.light-theme .checkout-checkbox.w--redirected-checked {
    background-color: #EAEAEE !important;
    border-color: #9D9D9D;
    background-image: none !important;
}
    /* Внутрішній квадрат з glow */
    body.light-theme .checkout-checkbox.w--redirected-checked::after {
        background: #FFACC6;
        box-shadow: 0 0 16px rgba(255, 172, 198, 0.45), /* велике світіння */
        0 0 8px rgba(255, 172, 198, 0.65); /* ближче сильніше */
    }
/* Дефолт */
body.light-theme .catalog-tab-link {
    color: #C4C4C4;
}
    /* Hover */
    body.light-theme .catalog-tab-link:hover {
        color: #FFACC6;
    }
    /* Активний таб */
    body.light-theme .catalog-tab-link.w--current {
        color: #9D9D9D;
        border-bottom-color: #9D9D9D;
    }

body.light-theme .breadcrumbs-link:hover {
    color: #FFACC6;
}
/* Останній breadcrumb — повністю без ховера */
body.light-theme .breadcrumbs-link.last {
    color: #C4C4C4;
    pointer-events: none; /* мишка не реагує */
    cursor: default; /* курсор звичайний */
}

    body.light-theme .breadcrumbs-link.last:hover {
        color: #C4C4C4; /* фіксуємо */
    }

.breadcrumbs-link.last {
    pointer-events: none;
}

body.light-theme .delivery-content p {
    color: #9D9D9D;
}

body.light-theme .delivery-content h2 {
    color: #5D5D5D;
}

body.light-theme .delivery-nav-row {
    color: #9D9D9D;
}

    body.light-theme .delivery-nav-row:hover {
        color: #5D5D5D;
    }

    body.light-theme .delivery-nav-row.w--current {
        color: #5D5D5D;
    }

body.light-theme .popular-card.height-medium {
    background-color: #FFACC6;
}

    body.light-theme .popular-card.height-medium.card-color2 {
        background-color: #62001F;
    }

    body.light-theme .popular-card.height-medium.card-3 {
        background-color: #EAEAEE;
    }

body.light-theme .img-arrow {
    color: #CD7893;
}

body.light-theme p.text-card-cat {
    color: #A6A6A6;
}

    body.light-theme p.text-card-cat .light-span {
        color: #CD7893;
    }

body.light-theme .subtitle-tech {
    color: #CD7893;
}

body.light-theme .benefits-title {
    color: #5D5D5D;
}

body.light-theme .benefit-item {
    background-image: linear-gradient(rgba(255,255,255,0.40), rgba(255,255,255,0));
}

body.light-theme .benefit-name {
    color: #A6A6A6;
}

body.light-theme .benefit-text {
    color: #9D9D9D;
}

body.light-theme .wrapper-logo-chain {
    color: #BABABA;
}

body.light-theme .founder-name {
    color: #D9D9D9;
}

body.light-theme .text-card-cat-text2 {
    color: #A6A6A6;
}

body.light-theme .wrapper-item-size:hover {
    color: #A4A4A4 !important;
}

body.light-theme .benefit-item:hover {
    background-image: none;
    background-color: #fff;
}

body.light-theme .wrapper-404 {
    background-color: #EAEAEE;
}

@media (max-width: 479px) {
    body.light-theme a.footer-contact-value.color {
        color: rgba(255, 255, 255, 0.40);
    }

    body.light-theme p.footer-contact-type.color {
        color: rgba(255, 255, 255, 0.20);
    }
}

body.light-theme .cart-floating-btn {
    background-color: #FFFFFF;
}

    body.light-theme .cart-floating-btn:hover {
        background-color: #CD7893; /* твій рожевий */
        color: white; /* текст/іконка */
    }




/* Стандартний стан — кошик видно */
.navbar .cart-open-trigger {
    opacity: 1;
    transition: opacity 0.2s ease;
}
/* Коли бургер у стані w--open → ховаємо кошик */
.navbar:has(.w-nav-button.w--open) .cart-open-trigger {
    opacity: 0;
    pointer-events: none; /* щоб по невидимому лінку не клікалось */
}