/* ===========================================================================
   oc-orchard-adapter.css
   ---------------------------------------------------------------------------
   Прослойка между вёрсткой WP-темы «orchard» и OpenCart / Bootstrap 3.

   Порядок подключения в header.twig ОБЯЗАТЕЛЬНО такой:
       1. bootstrap.min.css
       2. font-awesome.min.css
       3. stylesheet.css        (штатный OpenCart)
       4. custom.css            (fruit_garden)
       5. orchard/css/style.css        <- вёрстка WP-темы
       6. orchard/css/theme-style.css  <- допилы WP-темы
       7. oc-orchard-adapter.css       <- ЭТОТ файл, всегда последний

   Зачем он нужен: style.css из orchard начинается с агрессивного сброса
   (`*, *:before, *:after { margin:0; padding:0 }`, `ul li { list-style:none }`,
   `a:hover { color: inherit }`, `* { font-family: Roboto }`). Этот сброс ломает
   служебные страницы OpenCart — чекаут, личный кабинет, модалки Bootstrap.
   Ниже возвращаются только те дефолты, без которых магазин не работает,
   и подтягиваются компоненты OC под дизайн-токены orchard.

   Чтобы откатить визуал — достаточно отключить пункты 5-7 в header.twig.
   =========================================================================== */

:root {
    /* дизайн-токены orchard */
    --orchard-green:        #9C135F;
    --orchard-green-dark:   #7A0E49;
    --orchard-green-pale:   #F0DEE9;
    --orchard-bg-pale:      #F9EFF5;
    --orchard-text:         #555555;
    --orchard-white:        #ffffff;
    --orchard-radius:       100px;
    --orchard-container:    1640px;
    --orchard-font:         "Roboto", Arial, sans-serif;

    /* --- ФОНЫ САЙТА ---------------------------------------------------------
       Сайт графитовый, светло-серый — только внутри карточки товара (и на
       свёрстанных по её образцу страницах набора и статьи). Какой класс
       достанется странице, решает catalog/controller/common/header.php:
       список $light_bg_routes.

       Менять оттенки — здесь, больше нигде фон страницы не задаётся.        */
    --orchard-site-graphite:   #2d302f;  /* фон всех страниц           */
    --orchard-product-page-bg: #e8e9e6;  /* фон карточки товара/набора */
    --orchard-header-bg:       #F2F2F0;  /* шапка — светло-серая       */
    --orchard-hairline:        #DCDCD8;  /* разделители в шапке        */

    /* Фирменный #9C135F на графите даёт контраст 1.7 — не читается вообще.
       Для тёмных страниц нужен светлый вариант той же гаммы.               */
    --orchard-on-dark:         #F6E7F0;  /* заголовки на графите       */
    --orchard-on-dark-link:    #E8B9D2;  /* ссылки на графите          */
    --orchard-on-dark-muted:   rgba(255, 255, 255, 0.62); /* второстепенное */
}

html,
body,
button,
input,
select,
textarea {
    font-family: var(--orchard-font);
}

body {
    background: var(--orchard-site-graphite);
}

body.page-bg-product {
    background: var(--orchard-product-page-bg);
}

body.page-bg-graphite .page {
    background: var(--orchard-site-graphite);
}

body.page-bg-product .page {
    background: var(--orchard-product-page-bg);
}

body.page-bg-graphite .header,
body.page-bg-product .header {
    background: var(--orchard-header-bg);
    border-bottom: 1px solid var(--orchard-hairline);
}

body.page-bg-graphite #common-home .columns__block_title,
body.page-bg-graphite #common-home h2.title,
body.page-bg-graphite #common-home h2.slider__title,
body.page-bg-graphite #common-home .question-block__title {
    color: #f5f7ef;
}

body.page-bg-graphite #common-home .columns__block_descr,
body.page-bg-graphite #common-home .slider__descr,
body.page-bg-graphite #common-home .baner__text,
body.page-bg-graphite #common-home .question-block__result {
    color: rgba(255, 255, 255, 0.74);
}

body.page-bg-graphite #common-home .columns__block_icon img {
    filter: drop-shadow(0 8px 18px rgba(156, 19, 95, 0.22));
}

/* ---------------------------------------------------------------------------
   1. КОНТЕЙНЕР
   Bootstrap задаёт .container { width: 750/970/1170px }, orchard — только
   max-width: 1640px. Без сброса width страница осталась бы бутстраповской.
   --------------------------------------------------------------------------- */
.container {
    width: auto;
    max-width: var(--orchard-container);
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

/* .row у Bootstrap живёт на отрицательных margin — сброс orchard их убил */
.row {
    margin-left: -15px;
    margin-right: -15px;
}
.row:before,
.row:after {
    content: " ";
    display: table;
}
.row:after { clear: both; }

/* колонки Bootstrap */
[class*="col-xs-"],
[class*="col-sm-"],
[class*="col-md-"],
[class*="col-lg-"] {
    padding-left: 15px;
    padding-right: 15px;
}

/* ---------------------------------------------------------------------------
   2. ВОЗВРАТ ТИПОГРАФИКИ ВНУТРИ КОНТЕНТА
   orchard обнулил отступы у p/ul/ol/h*, из-за чего описания товаров,
   информационные страницы и блог превращаются в сплошное полотно.
   Возвращаем — но только внутри контентных зон, не трогая вёрстку секций.
   --------------------------------------------------------------------------- */
#content .oc-content p,
#content .oc-content ul,
#content .oc-content ol,
#content .oc-content dl,
#content .oc-content blockquote,
#content .oc-content table,
.product-description p,
.product-description ul,
.product-description ol,
.tab-content p,
.tab-content ul,
.tab-content ol {
    margin: 0 0 15px;
}

#content .oc-content ul,
#content .oc-content ol,
.product-description ul,
.product-description ol,
.tab-content ul:not(.nav):not(.list-unstyled),
.tab-content ol {
    padding-left: 25px;
}

#content .oc-content ul li,
.product-description ul li,
.tab-content ul:not(.nav):not(.list-unstyled) li {
    list-style: disc;
}
#content .oc-content ol li,
.product-description ol li,
.tab-content ol li {
    list-style: decimal;
}

#content .oc-content h1,
#content .oc-content h2,
#content .oc-content h3,
#content .oc-content h4,
#content .oc-content h5,
#content .oc-content h6 {
    margin: 24px 0 12px;
    font-weight: 300;
    color: var(--orchard-text);
}
#content .oc-content h1 { font-size: 42px; line-height: 1.3; }
#content .oc-content h2 { font-size: 34px; line-height: 1.3; }
#content .oc-content h3 { font-size: 27px; line-height: 1.35; }
#content .oc-content h4 { font-size: 22px; line-height: 1.4; }

#content .oc-content,
.product-description,
.tab-content {
    font-weight: 300;
    font-size: 18px;
    line-height: 1.6;
    color: var(--orchard-text);
}

/* ссылки в контенте: orchard глушит цвет через a:hover{color:inherit} */
#content .oc-content a,
.product-description a {
    color: var(--orchard-green);
    text-decoration: underline;
}
#content .oc-content a:hover,
.product-description a:hover {
    color: var(--orchard-green-dark);
}

/* ---------------------------------------------------------------------------
   3. КНОПКИ OPENCART -> ВИД ORCHARD
   Штатные .btn (корзина, чекаут, аккаунт) приводим к круглым зелёным кнопкам.
   Класс .button из orchard остаётся как есть — он описан в style.css.
   --------------------------------------------------------------------------- */
.btn {
    border-radius: var(--orchard-radius);
    font-weight: 500;
    letter-spacing: 0.02em;
    padding: 10px 28px;
    border: 1px solid transparent;
    transition: all 0.3s;
    text-shadow: none;
    background-image: none;
}
.btn-primary,
.btn-success,
.btn-danger.btn-cart,
.bttn-green {
    background: var(--orchard-green);
    border-color: var(--orchard-green);
    color: var(--orchard-white);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-success:hover,
.btn-success:focus,
.bttn-green:hover,
.bttn-green:focus {
    background: var(--orchard-green-dark);
    border-color: var(--orchard-green-dark);
    color: var(--orchard-white);
}
.btn-primary:active,
.btn-success:active {
    background: var(--orchard-green);
    border-color: var(--orchard-green);
}
.btn-default {
    background: var(--orchard-white);
    border-color: var(--orchard-green);
    color: var(--orchard-text);
}
.btn-default:hover,
.btn-default:focus {
    background: var(--orchard-green-pale);
    border-color: var(--orchard-green);
    color: var(--orchard-text);
}

/* orchard-кнопка внутри бутстраповских форм не должна схлопываться */
.button {
    border: none;
    cursor: pointer;
    text-align: center;
}
a.button,
a.button:hover,
a.button:visited {
    color: var(--orchard-white);
    text-decoration: none;
}
a.button.white,
a.button.white:hover,
a.button.white:visited {
    color: var(--orchard-text);
}

/* ---------------------------------------------------------------------------
   4. ФОРМЫ (чекаут, регистрация, обратная связь)
   Сброс orchard снял отступы у .form-group и высоту у .form-control.
   --------------------------------------------------------------------------- */
.form-group      { margin-bottom: 15px; }
.form-horizontal .form-group { margin-left: -15px; margin-right: -15px; }
.control-label   { margin-bottom: 5px; display: inline-block; font-size: 15px; }

.form-control {
    height: 44px;
    padding: 8px 18px;
    font-size: 16px;
    line-height: 1.5;
    color: var(--orchard-text);
    border: 1px solid #d6d6d6;
    border-radius: 8px;
    background-color: var(--orchard-white);
    box-shadow: none;
    width: 100%;
}
textarea.form-control { height: auto; min-height: 120px; }
.form-control:focus {
    border-color: var(--orchard-green);
    box-shadow: none;
    outline: none;
}
.has-error .form-control { border-color: #FF4A4A; }
.text-danger { color: #FF4A4A; font-size: 15px; display: block; margin-top: 4px; }

.radio, .checkbox { margin: 8px 0; }
.radio label, .checkbox label { padding-left: 22px; position: relative; font-size: 16px; }
.input-group { display: table; width: 100%; }
.input-group .form-control { border-radius: 8px 0 0 8px; }
.input-group-btn .btn { border-radius: 0 8px 8px 0; }

/* ---------------------------------------------------------------------------
   5. АЛЕРТЫ, ПАНЕЛИ, ТАБЫ, ТАБЛИЦЫ, ХЛЕБНЫЕ КРОШКИ
   --------------------------------------------------------------------------- */
.alert {
    padding: 15px 20px;
    margin-bottom: 20px;
    border-radius: 10px;
    font-size: 16px;
}
.alert-success { background: var(--orchard-bg-pale); border-color: var(--orchard-green); color: #5E0B39; }

.panel { margin-bottom: 20px; border-radius: 10px; }
.panel-body { padding: 20px; }
.panel-heading { padding: 14px 20px; border-radius: 10px 10px 0 0; }

.nav-tabs { margin-bottom: 20px; border-bottom: 1px solid #ddd; }
.nav-tabs > li { float: left; margin-bottom: -1px; list-style: none; }
.nav-tabs > li > a { padding: 10px 18px; display: block; font-size: 17px; color: var(--orchard-text); }
.nav-tabs > li.active > a { border-bottom-color: transparent; color: var(--orchard-green); }

.table { width: 100%; margin-bottom: 20px; }
.table > thead > tr > th,
.table > tbody > tr > td { padding: 12px; border-top: 1px solid #eee; }

.breadcrumb {
    padding: 18px 0;
    margin-bottom: 20px;
    background: transparent;
    border-radius: 0;
    font-size: 20px;
    font-weight: 300;
}
.breadcrumb > li { display: inline-block; list-style: none; }
.breadcrumb > li + li:before { content: "/"; padding: 0 10px; color: #b5b5b5; }
.breadcrumb a { color: var(--orchard-text); }
.breadcrumb a:hover { color: var(--orchard-green); }

.pagination > li { display: inline-block; list-style: none; }
.pagination > li > a,
.pagination > li > span { padding: 8px 15px; color: var(--orchard-text); }
.pagination > .active > span { background: var(--orchard-green); border-color: var(--orchard-green); color: #fff; }

/* ---------------------------------------------------------------------------
   6. МОДАЛКИ BOOTSTRAP
   .page { overflow: hidden } из orchard подрезает модалки — выносим их наружу.
   --------------------------------------------------------------------------- */
.modal { z-index: 10500; }
.modal-backdrop { z-index: 10400; }
.modal-dialog { margin: 40px auto; }
.modal-content { border-radius: 12px; }
.modal-header,
.modal-body,
.modal-footer { padding: 18px 22px; }
.modal-header .close { font-size: 26px; opacity: .5; background: none; }

/* дропдауны (валюта, язык, корзина) не должны обрезаться шапкой */
.dropdown-menu { z-index: 10600; }
.dropdown-menu > li { list-style: none; }
.dropdown-menu > li > a { padding: 8px 18px; display: block; }

/* ---------------------------------------------------------------------------
   7. ШАПКА: элементы OpenCart внутри orchard-разметки
   Корзина и вишлист живут в .header__wrapper вместе с .phone/.lang-block.
   --------------------------------------------------------------------------- */
/* Тема fruit_garden робила <header> флекс-контейнером під свою стару шапку.
   В orchard шапка — звичайний блок з .container всередині. Поки .header
   лишався flex, .container ставав флекс-елементом і стискався по вмісту
   (767px замість 1466px) та центрувався — через це вся шапка з'їжджалась
   у купку посередині. Повертаємо блокову модель. */
.header {
    display: block;
    /* Тема відсувала контент від своєї старої шапки на 79px.
       В orchard промо-банер починається одразу під шапкою. */
    margin-bottom: 0;
}
.header > .container {
    width: auto;
    max-width: 1640px;
    margin-left: auto;
    margin-right: auto;
}
.header__wrapper {
    width: 100%;
}

/* --- Логотип і телефон у шапці --------------------------------------------
   Логотип магазину квадратний (499x500) і без обмеження висоти виглядав
   удвічі меншим за оригінал. В orchard він 103px заввишки.
   Телефон без nowrap ламався на два рядки і збивав висоту шапки. */
.header__wrapper .logo img {
    height: 103px;
    width: auto;
    max-height: none;
    max-width: none;
}
.header__wrapper .phone a {
    white-space: nowrap;
}

/* --- Горизонтальне меню (модуль Horizontal Mega Menu / supermenu) ---------
   Модуль сам вішає на <nav> клас respsmall і згортається у зелену кнопку
   з бургером — вимикача цього в його налаштуваннях немає. Тому розгортаємо
   його в звичайний текстовий рядок, як на fruitsad.com.ua.

   В адмінці модуля вже вимкнено «Add supermenu in a bootstrap container» —
   інакше він загортався у вкладений .container і стискався до 166px.

   Мобільну версію не чіпаємо: нижче 992px лишається штатний бургер модуля. */
@media (min-width: 992px) {
    .header__wrapper #supermenu {
        background: transparent;
        width: auto;
        flex: 1 1 auto;
        margin: 0 24px;
    }
    .header__wrapper #supermenu .mobile-trigger {
        display: none;
    }
    .header__wrapper #supermenu > ul {
        display: flex;
        align-items: center;
        gap: 26px;
        height: auto;
        overflow: visible;
        position: static;
    }
    .header__wrapper #supermenu > ul > li.tlli {
        display: block;
        width: auto;
        float: none;
    }
    .header__wrapper #supermenu > ul > li.tlli > a.tll {
        font-size: 20px;
        font-weight: 400;
        color: #555555;
        background: transparent;
        padding: 8px 0;
        white-space: nowrap;
    }
    .header__wrapper #supermenu > ul > li.tlli > a.tll:hover {
        color: #9C135F;
    }
}

.header__wrapper #supermenu ul li.tlli.mobile-contact {
    display: none;
}

.header__wrapper .header__oc {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-left: 20px;
}
.header__wrapper .header__oc #cart > button,
.header__wrapper .header__oc .modal-wishlist-toggle {
    background: transparent;
    border: none;
    padding: 0;
    display: flex;
    align-items: center;
    color: var(--orchard-text);
    font-size: 16px;
    line-height: 1;
}
.header__wrapper .header__oc #cart > button:hover,
.header__wrapper .header__oc .modal-wishlist-toggle:hover {
    color: var(--orchard-green);
}
.header__wrapper .header__oc #cart-total {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    margin-left: 6px;
    border-radius: 11px;
    background: var(--orchard-green);
    color: #fff;
    font-size: 13px;
    font-weight: 500;
}
.header__wrapper .header__oc .custom-icon {
    width: 26px;
    height: 26px;
    fill: currentColor;
}
.header__wrapper .header__oc #cart .dropdown-menu {
    right: 0;
    left: auto;
    min-width: 320px;
    padding: 15px;
}

/* поисковая форма OpenCart внутри orchard-поповера .search__popup */
.search__popup #search {
    display: flex;
    align-items: center;
    width: 100%;
}
.search__popup #search .search-input {
    flex: 1 1 auto;
    height: 48px;
    border: 1px solid var(--orchard-green);
    border-radius: var(--orchard-radius);
    padding: 0 22px;
    font-size: 16px;
    font-weight: 300;
    color: var(--orchard-text);
}
.search__popup #search .search-icon,
.search__popup #search .close-search-modal,
.search__popup #search .clear-search-input { display: none; }
.search__popup .search-submit {
    margin-left: -54px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--orchard-green);
    border: none;
    color: #fff;
    flex: 0 0 auto;
}

/* ---------------------------------------------------------------------------
   8. КАРТОЧКИ ТОВАРА В orchard-СЕТКЕ
   .product-thumb из OpenCart приводим к виду .slider__block / .assortment__block
   --------------------------------------------------------------------------- */
.product-thumb {
    border: none;
    background: transparent;
    margin-bottom: 40px;
    text-align: center;
}
/* ВАЖЛИВО: в custom.css теми лежить
       .product-thumb .image a img { width:100%; height:100%; object-fit:cover }
   Раніше висоту задавала сама тема, але скидання orchard її зняло — і
   height:100% у картинки, чий батько <a> не має висоти, дає циклічний
   розрахунок: браузер роздував зображення до ~6 700 000 px, а разом з ним
   і всю сторінку. Селектор нижче повторює їхній один-в-один (та сама
   специфічність) і виграє порядком підключення. Ширину/висоту НЕ чіпати. */
.product-thumb .image a img,
.product-thumb .image img {
    width: auto;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    border-radius: 12px;
}
.product-thumb h4 {
    margin: 18px 0 10px;
    font-weight: 300;
    font-size: 22px;
    line-height: 1.4;
}
.product-thumb h4 a { color: var(--orchard-text); }
.product-thumb h4 a:hover { color: var(--orchard-green); }
.product-thumb .price {
    font-weight: 500;
    font-size: 22px;
    color: var(--orchard-green);
    margin-bottom: 14px;
}
.product-thumb .price-old {
    text-decoration: line-through;
    color: #a5a5a5;
    font-size: 18px;
    margin-right: 8px;
}
.product-thumb .button-group { display: flex; justify-content: center; gap: 10px; }

/* ---------------------------------------------------------------------------
   9. ПОДВАЛ: волна fruit_garden не должна конфликтовать с orchard-подвалом
   --------------------------------------------------------------------------- */
.footer.orchard-footer { position: relative; z-index: 2; }

/* Логотип магазина (config_logo) — PNG 499x500. В шапке его ужимает CSS orchard,
   в подвале ограничения не было и он рендерился в полный размер. */
.footer.orchard-footer .logo img {
    max-width: 180px;
    height: auto;
}
.footer.orchard-footer a { color: inherit; }
.footer.orchard-footer a:hover { color: var(--orchard-green); }

/* ---------------------------------------------------------------------------
   10. SWIPER
   orchard рассчитан на разметку `.swiper-container` (Swiper 6-8).
   Версия зафиксирована в header.twig — 8.4.7. Ниже страховка на случай,
   если подключат Swiper 9+, где контейнер называется `.swiper`.
   --------------------------------------------------------------------------- */
.swiper-container { overflow: hidden; position: relative; }
.swiper-container .swiper-wrapper { display: flex; }
.swiper-button-next,
.swiper-button-prev { cursor: pointer; }
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled { opacity: .35; }

/* ---------------------------------------------------------------------------
   11. АДАПТИВ
   --------------------------------------------------------------------------- */
@media screen and (max-width: 1201px) {
    #content .oc-content h1 { font-size: 34px; }
    #content .oc-content h2 { font-size: 28px; }
}

@media screen and (max-width: 992px) {
    .header__wrapper .header__oc { margin-left: 12px; gap: 12px; }
    #content .oc-content,
    .product-description { font-size: 17px; }
}

@media screen and (max-width: 768px) {
    .container { padding-left: 12px; padding-right: 12px; }
    #content .oc-content h1 { font-size: 28px; }
    #content .oc-content h2 { font-size: 24px; }
    #content .oc-content,
    .product-description { font-size: 16px; }
    .btn { padding: 9px 22px; font-size: 15px; }
    .header__wrapper .header__oc .custom-icon { width: 22px; height: 22px; }
}

/* ===========================================================================
   ЧАСТЬ 2. ВНУТРЕННИЕ СТРАНИЦЫ
   ---------------------------------------------------------------------------
   Тема fruit_garden построена на CSS-переменных `--fg-color-*` и собственных
   BEM-классах. Вместо переписывания двух десятков шаблонов переопределяем
   палитру и шрифты — весь магазин разом переходит на дизайн-токены orchard.
   =========================================================================== */

:root {
    /* фирменные цвета: тёмно-хвойный fruit_garden -> салатовый orchard */
    --fg-color-darkgreen:       #5E0B39;
    --fg-color-green:           #7A0E49;
    --fg-color-lightgreen:      #9C135F;

    /* фоновые подложки */
    --fg-color-bg-lightgreen:   #F9EFF5;
    --fg-color-bg-beige:        #F7F5F0;

    /* шрифты темы -> Roboto */
    --fg-ff-sans-serif:         'Roboto', sans-serif;
    --fg-ff-headers-ss:         'Roboto', sans-serif;
}

/* ---------------------------------------------------------------------------
   12. ВОЛНЫ (.vaved)
   Декоративные SVG-волны — фирменный приём fruit_garden. В orchard секции
   разделяются отступами, а сами SVG залиты старым тёмно-зелёным, который
   после смены палитры перестаёт совпадать. Поэтому волны отключаем.

   Вернуть: удалить этот блок целиком.
   --------------------------------------------------------------------------- */
.vaved::before,
.vaved::after,
.vaved-top-only::before,
.vaved-bottom-only::after,
footer.vaved-special-green::before {
    display: none !important;
}
.vaved-top-only    { margin-top: 0; }
.vaved-bottom-only { margin-bottom: 0; }

/* ---------------------------------------------------------------------------
   13. ЗАГОЛОВКИ СТРАНИЦ
   В orchard заголовок секции — .title: Roboto 300, 64px, по центру.
   --------------------------------------------------------------------------- */
#content > h1,
#content > h2,
.product-category h1,
.blog-articles-container h1,
.contacts-page h1 {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 48px;
    line-height: 1.35;
    letter-spacing: 0.05em;
    color: var(--orchard-text);
    margin: 40px 0 30px;
}

.product-category-description .vaved h1 {
    margin: 0 0 18px;
    color: var(--fg-color-green);
    font-size: clamp(28px, 3vw, 38px);
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0;
}

/* ---------------------------------------------------------------------------
   14. КНОПКИ ТЕМЫ (.bttn)
   --------------------------------------------------------------------------- */
.bttn {
    border-radius: var(--orchard-radius);
    font-weight: 500;
    letter-spacing: 0.02em;
    transition: all 0.3s;
}
.bttn-green {
    background: var(--orchard-green);
    color: var(--orchard-white);
}
.bttn-green:hover,
.bttn-green:focus {
    background: var(--orchard-green-dark);
    color: var(--orchard-white);
}
.bttn-green:active { background: var(--orchard-green); }

/* ---------------------------------------------------------------------------
   15. ЛИСТИНГ КАТЕГОРИИ
   --------------------------------------------------------------------------- */
.sub-cats__item {
    border-radius: 12px;
    transition: all 0.3s;
}
.sub-cats__item:hover {
    background: var(--orchard-bg-pale);
}
.product-layout .price,
.price-inner,
.prod-option__price_new {
    color: var(--orchard-green);
    font-weight: 500;
}
.price-inner_special,
.prod-option__price_old {
    color: #a5a5a5;
}
.select-view .btn-default.active,
.select-view .btn-default:active {
    background: var(--orchard-green);
    border-color: var(--orchard-green);
    color: #fff;
}

/* количество: круглые кнопки +/- как у orchard */
.prod-option_btn {
    border-radius: 50%;
    transition: all 0.3s;
}
.prod-option_add-to-cart,
.prod-option_add-to-cart-cb {
    border-radius: var(--orchard-radius);
    background: var(--orchard-green);
    color: #fff;
}
.prod-option_add-to-cart:hover,
.prod-option_add-to-cart-cb:hover {
    background: var(--orchard-green-dark);
}
.product-add-to-fav_added { color: var(--orchard-green); }

/* ---------------------------------------------------------------------------
   16. МОДАЛКА ВЫБОРА ОПЦИЙ
   --------------------------------------------------------------------------- */
.modal-options-inner,
.md-options {
    border-radius: 14px;
}
.md-options__title-inner {
    font-weight: 300;
    font-size: 26px;
    color: var(--orchard-text);
}
.md-option_error { border-color: #FF4A4A; }
.md-option__error-msg {
    color: #FF4A4A;
    font-size: 15px;
    font-weight: 300;
    margin-top: 6px;
}

/* ---------------------------------------------------------------------------
   17. КАРТОЧКА ТОВАРА
   --------------------------------------------------------------------------- */
.product-images__slider,
.product-images__gallery-thumbs { border-radius: 12px; overflow: hidden; }
.related-products__slider .swiper-slide { padding-bottom: 10px; }

/* ---------------------------------------------------------------------------
   18. БЛОГ
   --------------------------------------------------------------------------- */
.blog-article__header {
    font-weight: 300;
    font-size: 42px;
    line-height: 1.35;
    color: var(--orchard-text);
    margin-bottom: 24px;
}
.blog-article__description,
.blog-articles-description {
    font-weight: 300;
    font-size: 18px;
    line-height: 1.6;
    color: var(--orchard-text);
}
.blog-article__description p  { margin: 0 0 15px; }
.blog-article__description ul { padding-left: 25px; margin: 0 0 15px; }
.blog-article__description ul li { list-style: disc; }
.blog-article__description ol { padding-left: 25px; margin: 0 0 15px; }
.blog-article__description ol li { list-style: decimal; }
.blog-article-thumb { border-radius: 12px; overflow: hidden; }
.blog-tools__input { border-radius: 8px; }

/* ---------------------------------------------------------------------------
   19. КОНТАКТЫ
   В orchard форма обратной связи — .contacts__form: круглый инпут
   с зелёной обводкой и круглая кнопка.
   --------------------------------------------------------------------------- */
.contacts-page__store-name {
    font-weight: 300;
    font-size: 32px;
    color: var(--orchard-text);
}
.contacts-page__image { border-radius: 12px; overflow: hidden; }
.contacts-page__map iframe { border-radius: 12px; }
.contacts-form__header {
    font-weight: 300;
    font-size: 42px;
    text-align: center;
    letter-spacing: 0.05em;
    color: var(--orchard-text);
    margin-bottom: 40px;
}
.contacts-form__input-container input,
.contacts-form__input-container textarea {
    border: 1px solid var(--orchard-green);
    border-radius: 22px;
    padding: 14px 28px;
    font-weight: 300;
    font-size: 17px;
    color: var(--orchard-text);
    width: 100%;
}
.contacts-form__input-container input { border-radius: var(--orchard-radius); }

/* ---------------------------------------------------------------------------
   20. КОРЗИНА, ЧЕКАУТ, ЛИЧНЫЙ КАБИНЕТ
   Тут важнее читаемость и рабочие отступы, чем точное попадание в orchard —
   в WP-теме этих страниц не было вовсе.
   --------------------------------------------------------------------------- */
#checkout-checkout .panel,
#account-account .panel,
#checkout-cart .panel {
    border-radius: 12px;
    border-color: #e6e6e6;
    box-shadow: none;
}
#checkout-checkout .panel-heading,
#account-account .panel-heading {
    background: var(--orchard-bg-pale);
    border-color: #e6e6e6;
    color: var(--orchard-text);
    font-weight: 500;
}
#checkout-cart .table > thead > tr > th {
    background: var(--orchard-bg-pale);
    border-bottom: none;
    font-weight: 500;
    color: var(--orchard-text);
}
#checkout-cart .table td.text-right { white-space: nowrap; }
.cart-mdl-content { border-radius: 12px; }

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    background: var(--orchard-green);
    border-color: var(--orchard-green);
}

/* ---------------------------------------------------------------------------
   21. АДАПТИВ ВНУТРЕННИХ СТРАНИЦ
   --------------------------------------------------------------------------- */
@media screen and (max-width: 992px) {
    #content > h1,
    .product-category h1,
    .blog-articles-container h1,
    .contacts-page h1 { font-size: 36px; margin: 30px 0 22px; }
    .blog-article__header,
    .contacts-form__header { font-size: 32px; }
}

@media screen and (max-width: 768px) {
    #content > h1,
    .product-category h1,
    .blog-articles-container h1,
    .contacts-page h1 { font-size: 28px; margin: 22px 0 18px; }
    .blog-article__header,
    .contacts-form__header { font-size: 26px; margin-bottom: 24px; }
    .blog-article__description,
    .blog-articles-description { font-size: 16px; }
    .contacts-form__input-container input,
    .contacts-form__input-container textarea { padding: 12px 22px; font-size: 16px; }
    .content-block .content-block__link a {
        width: 100%;
        min-width: 0;
        min-height: 46px;
        padding: 11px 22px;
        font-size: 15px;
    }
}

/* ---------------------------------------------------------------------------
   22. СЕКЦИЯ «ПРО НАС» (.about)

   На fruitsad.com.ua между низом hero и зелёной карточкой ровно 240px:
   у .about margin-top 200px, а внутри неё лежит осиротевший .about__docs —
   пустой .columns с margin 120px 0 (в WP там когда-то были кнопки скачивания
   документов, сейчас блок пустой). Пустой контейнер сюда не переносим,
   поэтому отступ задаём напрямую. Место нужно ещё и под декоративную иконку
   .about__wrapper::before, она висит на top: -110px.

   Отступ задаём именно padding'ом, а не margin'ом у карточки: у .about нет
   ни рамки, ни padding'а, поэтому верхний margin ребёнка схлопнулся бы с
   margin-top: 200px самой секции — вместо 440px над карточкой получилось бы
   240px. Оригинал от схлопывания спасал непустой первый ребёнок.

   Карточка приходит из HTML-модуля «Про нас», поэтому здесь же гасим
   типографику OpenCart, которая иначе перебивает orchard внутри .oc-content.
   --------------------------------------------------------------------------- */
.about {
    /*padding-top: 240px;*/
}

/* HTML-модуль сам рисует <h2> со своим заголовком (heading_title). Заголовок
   секции у нас лежит внутри контента как .about__title, поэтому служебный
   h2 без класса прячем — иначе он добавляет 48px пустоты над «Про нас». */
.about__wrapper > div > h2:not([class]) {
    display: none;
}

/* Заголовок карточки: orchard .title = 64px/300. Тема OpenCart назначает
   h2 свои размеры, поэтому возвращаем оригинальные. */
.about__wrapper .about__title {
    font-weight: 300;
    font-size: 64px;
    line-height: 150%;
    color: #555555;
    text-align: center;
    margin: 0;
    padding: 0;
    border: 0;
}

/* .oc-content — обёртка для контента из админки. Внутри карточки её правила
   про p/ul/ol не нужны: разметка модуля уже orchard-овская. */
#content .about__wrapper .about__descr,
.about__wrapper .about__descr {
    font-weight: 300;
    font-size: 22px;
    line-height: 150%;
    text-align: center;
    color: #686868;
    margin: 40px auto 0;
    max-width: 790px;
}

#content .about__wrapper .about__bottom,
.about__wrapper .about__bottom {
    font-weight: 400;
    font-size: 22px;
    line-height: 150%;
    text-align: center;
    color: #9C135F;
    margin: 40px auto 0;
    max-width: 790px;
}

@media screen and (max-width: 992px) {
    .about > .about__wrapper { margin-top: 150px; padding: 70px 30px; }
    .about__wrapper .about__title { font-size: 40px; }
    .about__wrapper .about__descr,
    .about__wrapper .about__bottom { font-size: 18px; margin-top: 28px; }
}

@media screen and (max-width: 768px) {
    .about > .about__wrapper { margin-top: 110px; padding: 55px 20px; }
    .about__wrapper .about__title { font-size: 30px; }
    .about__wrapper .about__descr,
    .about__wrapper .about__bottom { font-size: 16px; margin-top: 22px; }
}

/* ---------------------------------------------------------------------------
   23. ВЫСОТА СЛАЙДЕРОВ «АСОРТИМЕНТ» И «БАЗА РОСЛИН»

   На fruitsad.com.ua .swiper-container обеих каруселей ровно 700px. От неё
   пляшет всё остальное: Swiper держит .swiper-slide на height:100%, большая
   плитка растягивается на всю высоту строки, а .slider__block_column
   .slider__block берёт свои 49% и получает 343px.

   Если высоту не зафиксировать, она начинает зависеть от пропорций
   загруженных в админку картинок: height:100% при неопределённой высоте
   родителя вырождается в auto, и высоту строки задаёт intrinsic-размер
   изображения. На практике секция из-за этого «плавала» на 60-100px и
   зависела от того, какое фото залили в категорию. Фиксируем, как в оригинале.

   На мобильных (<670px) orchard раскладывает .slider__item в колонку и даёт
   плиткам min-height: 320px — там фиксированная высота только мешает.
   --------------------------------------------------------------------------- */
.slider .swiper-container {
    height: 700px;
}

.slider .swiper-slide,
.slider .slider__item {
    height: 100%;
}

@media screen and (max-width: 670px) {
    .slider .swiper-container,
    .slider .swiper-slide,
    .slider .slider__item {
        height: auto;
    }
}

/* ---------------------------------------------------------------------------
   24. ЗАГОЛОВКИ СЕКЦИЙ .title

   orchard рисует их обычными <div class="title">, у нас это <h2> — ради
   семантики и SEO. Из-за этого тема OpenCart добавляет свои margin
   (20px сверху, 10px снизу) и секция уезжает от оригинала на 30px.
   --------------------------------------------------------------------------- */
h2.title,
h2.slider__title {
    margin: 0;
    padding: 0;
    border: 0;
    font-weight: 300;
    font-size: 64px;
    line-height: 150%;
    text-align: center;
    letter-spacing: 0.05em;
    color: var(--orchard-text);
}

@media screen and (max-width: 992px) {
    h2.title,
    h2.slider__title { font-size: 40px; }
}

@media screen and (max-width: 768px) {
    h2.title,
    h2.slider__title { font-size: 30px; }
}

/* ---------------------------------------------------------------------------
   25. ИКОНКИ БЛОКА .columns

   Бокс .columns__block_icon — 50x50, внутри orchard кладёт <img> и ограничивает
   его max-width/max-height. Наш <img> подчиняется, но общий сброс темы задаёт
   картинкам width:100% — при непропорциональной иконке её бы растянуло.
   --------------------------------------------------------------------------- */
.columns__block_icon img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* ---------------------------------------------------------------------------
   26. РЕЗУЛЬТАТ ОТПРАВКИ ЗАЯВКИ НА ЗВОНОК

   Строка под формой «Виникли питання?». Пустая — не занимает места,
   поэтому блок не дёргается при появлении сообщения (min-height).
   --------------------------------------------------------------------------- */
.question-block__result {
    min-height: 28px;
    margin-top: 18px;
    text-align: center;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5;
}

.question-block__result.is-success { color: var(--orchard-green); }
.question-block__result.is-error   { color: #FF4A4A; }

/* Пока письмо уходит, кнопка неактивна — показываем это явно. */
.question-block__form_btn[disabled] {
    opacity: 0.6;
    cursor: default;
}

/* ---------------------------------------------------------------------------
   27. КОНТЕНТ-БЛОКИ И МОДУЛИ В CONTENT_BOTTOM

   На главной content_bottom выводится в голый <div id="content"> без
   бутстраповского .container — так задумано, чтобы .gallery могла разъезжаться
   на всю ширину (у её слайдера margin: 0 -225px). Но всем остальным модулям
   контейнер нужен, иначе текст упирается в левый край окна.
   Даём его точечно тем блокам, у которых своей обёртки нет.
   --------------------------------------------------------------------------- */
#content > .content-block,
#content > .products-latest-container,
#content > .box,
#content > .banner-module {
    max-width: var(--orchard-container);
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

/* Заголовки контент-блоков — под типографику orchard, а не тему по умолчанию */
.content-block__desc h2,
.products-latest-container > h2 {
    font-weight: 300;
    color: var(--orchard-text);
    letter-spacing: 0.02em;
}

.content-block .content-block__link {
    margin-top: 28px;
}

.content-block .content-block__link a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    min-width: 190px;
    padding: 12px 30px;
    border: 1px solid var(--fg-color-lightgreen);
    border-radius: 999px;
    background: var(--fg-color-lightgreen);
    box-shadow: 0 10px 24px rgba(156, 19, 95, 0.18);
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

.content-block .content-block__link a:hover,
.content-block .content-block__link a:focus {
    border-color: var(--fg-color-green);
    background: var(--fg-color-green);
    box-shadow: 0 12px 28px rgba(122, 14, 73, 0.2);
    color: #fff;
    text-decoration: none;
    outline: none;
}

.content-block .content-block__link a:active {
    box-shadow: 0 6px 16px rgba(122, 14, 73, 0.16);
}

.products-latest-container h2 {
    color: var(--fg-color-green);
    font-size: 26px;
}

/* ---------------------------------------------------------------------------
   28. КНОПКИ КАРТОЧКИ ТОВАРА

   Правила общие для всех блоков с товарами: «Новинки», «Рекомендовані»,
   «Хіти продажів», «Акції», листинг категории. Тема рисует кнопки
   квадратными и капсом — это стиль старого шаблона; приводим к orchard:
   капсула, зелёный #9C135F, круглое сердце рядом.
   --------------------------------------------------------------------------- */
.product-thumb .product-buttons {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 16px;
}

.product-thumb .product-buttons .bttn {
    border-radius: var(--orchard-radius);
    text-transform: none;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 0.02em;
    padding: 12px 24px;
    min-height: 52px;
    justify-content: center;
    text-align: center;
    line-height: 1.2;
    transition: all 0.3s;
}

.product-thumb .product-buttons .add-to-cart-no-options,
.product-thumb .product-buttons .toggle-modal-options {
    flex: 1 1 auto;
    background: var(--orchard-green);
    border: 1px solid var(--orchard-green);
    color: var(--orchard-white);
    text-decoration: none;
}

.product-thumb .product-buttons .add-to-cart-no-options:hover,
.product-thumb .product-buttons .add-to-cart-no-options:focus,
.product-thumb .product-buttons .toggle-modal-options:hover,
.product-thumb .product-buttons .toggle-modal-options:focus {
    background: var(--orchard-green-dark);
    border-color: var(--orchard-green-dark);
    color: var(--orchard-white);
}

.product-thumb .product-buttons .add-to-cart-no-options[disabled],
.product-thumb .product-buttons .toggle-modal-options[disabled] {
    opacity: 0.5;
    cursor: default;
}

/* Сердце. Круг задаём ЖЁСТКО по всем трём осям: родитель — flex-строка,
   и без фиксированной высоты кнопка растягивалась по высоте соседа,
   превращаясь в овал. align-self убирает растягивание, flex: 0 0 —
   сжатие, поэтому круг остаётся кругом при любой длине названия. */
.product-thumb .product-buttons .product-add-to-fav {
    flex: 0 0 52px;
    align-self: center;
    width: 52px;
    height: 52px;
    min-height: 0;
    padding: 0;
    border-radius: 50%;
    background: transparent;
    border: 1px solid var(--orchard-green);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}

.product-thumb .product-buttons .product-add-to-fav svg {
    width: 20px;
    height: 19px;
    display: block;
}

.product-thumb .product-buttons .product-add-to-fav svg path {
    stroke: var(--orchard-green);
    fill: none;
    transition: all 0.3s;
}

.product-thumb .product-buttons .product-add-to-fav:hover {
    background: var(--orchard-green-pale);
}

/* В избранном — сердце заливается */
.product-thumb .product-buttons .product-add-to-fav_added {
    background: var(--orchard-green);
    border-color: var(--orchard-green);
}
.product-thumb .product-buttons .product-add-to-fav_added svg path {
    stroke: var(--orchard-white);
    fill: var(--orchard-white);
}

/* Карточки в слайдерах тянутся на одну высоту, кнопки прижаты к низу */
.products-latest-row .swiper-slide,
.products-latest-row .swiper-slide .product-thumb,
.products-latest-row .swiper-slide .product-content {
    height: auto;
}
.products-latest-row .swiper-slide {
    display: flex;
}
.products-latest-row .swiper-slide .product-layout,
.products-latest-row .swiper-slide .product-thumb {
    width: 100%;
}
.products-latest-row .swiper-slide .product-thumb,
.products-latest-row .swiper-slide .product-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}
.products-latest-row .swiper-slide .product-buttons {
    margin-top: auto;
}

@media screen and (max-width: 768px) {
    .product-thumb .product-buttons .bttn { font-size: 15px; padding: 10px 18px; min-height: 46px; }
    .product-thumb .product-buttons .product-add-to-fav { flex: 0 0 46px; width: 46px; height: 46px; }
}

/* Штатная разметка OpenCart .button-group — её используют «Рекомендовані»
   (featured), «Хіти продажів» (bestseller), «Акції» (special) и
   featured_product. Там три кнопки подряд: корзина, обране, порівняння.
   Приводим к тому же виду, что и .product-buttons выше. */
.product-thumb .button-group {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 16px;
    background: transparent;
    border: 0;
}

.product-thumb .button-group button {
    border-radius: 50%;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    padding: 0;
    background: transparent;
    border: 1px solid var(--orchard-green);
    color: var(--orchard-green);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}

/* Первая кнопка в группе — «купити», она главная: капсула во всю ширину */
.product-thumb .button-group button:first-child {
    flex: 1 1 auto;
    width: auto;
    border-radius: var(--orchard-radius);
    background: var(--orchard-green);
    border-color: var(--orchard-green);
    color: var(--orchard-white);
    padding: 0 24px;
    font-weight: 500;
    font-size: 16px;
    gap: 8px;
}

.product-thumb .button-group button:first-child:hover,
.product-thumb .button-group button:first-child:focus {
    background: var(--orchard-green-dark);
    border-color: var(--orchard-green-dark);
    color: var(--orchard-white);
}

.product-thumb .button-group button:not(:first-child):hover {
    background: var(--orchard-green-pale);
}

.product-thumb .button-group button[disabled] {
    opacity: 0.5;
    cursor: default;
}

/* В этих модулях подпись кнопки спрятана бутстраповскими hidden-* классами —
   на широких экранах текст нужен, поэтому возвращаем. */
.product-thumb .button-group button:first-child span {
    display: inline;
}

@media screen and (max-width: 768px) {
    .product-thumb .button-group button { flex-basis: 46px; width: 46px; height: 46px; }
    .product-thumb .button-group button:first-child { width: auto; font-size: 15px; padding: 0 18px; }
}

/* ---------------------------------------------------------------------------
   29. ПОДВАЛ

   Что чинится:

   1. Колонка с логотипом в orchard занимает до 560px и не даёт себя ужать —
      правым колонкам оставалось мало места.
   2. .footer__column — flex-строка без переноса, поэтому на узких экранах
      последняя колонка (Youtube / Facebook) уезжала за край экрана.
   3. У колонок стоит flex: 0 1 auto, то есть им разрешено сжиматься меньше
      содержимого. Почта sadok_prom@ukr.net — одно длинное слово, перенести
      его негде, вот она и вылезала поверх соседней колонки с адресом.
   --------------------------------------------------------------------------- */
.footer__wrapper {
    flex-wrap: wrap;
    row-gap: 40px;
}

.footer__wrapper .footer__left {
    flex: 0 1 400px;
    max-width: 400px;
    min-width: 280px;
    margin-right: 40px;
}

.footer__wrapper .footer__column {
    max-width: none;
    flex: 1 1 620px;
    flex-wrap: wrap;
    gap: 34px 40px;
    justify-content: space-between;
}

/* min-width не даёт колонке сжаться уже содержимого, overflow-wrap разрешает
   разорвать длинную почту, если места всё же не хватило. */
.footer__wrapper .footer__column_item {
    flex: 0 1 auto;
    min-width: 170px;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Колонка с адресом длиннее прочих — пусть забирает больше места */
.footer__wrapper .footer__column_item:nth-child(2) {
    flex: 1 1 300px;
    min-width: 260px;
}

/* Логотип в подвале — соразмерно колонке */
.footer__wrapper .footer__left .logo img {
    max-width: 200px;
    height: auto;
}

.footer__wrapper .footer__left_text {
    font-size: 26px;
    margin-top: 28px;
}

.footer__wrapper .footer__left_btn {
    margin-top: 40px;
}

@media screen and (max-width: 1200px) {
    .footer__wrapper .footer__left { flex-basis: 320px; max-width: 320px; margin-right: 30px; }
    .footer__wrapper .footer__left_text { font-size: 22px; }
    .footer__wrapper .footer__column { flex-basis: 100%; gap: 28px 30px; }
}

@media screen and (max-width: 768px) {
    .footer__wrapper .footer__left { flex: 1 1 100%; max-width: none; margin-right: 0; }
    .footer__wrapper .footer__column_item,
    .footer__wrapper .footer__column_item:nth-child(2) { flex: 1 1 100%; min-width: 0; }
}

/* ---------------------------------------------------------------------------
   30. ИКОНКИ «ОБРАНЕ» И КОРЗИНЫ В ШАПКЕ

   Две проблемы подряд:

   1. Модуль отдаёт кнопку с классом .btn, а блок 3 делает из любой .btn
      капсулу с padding 10px 28px — рядом с голой лупой 26x26 это выглядело
      белым овалом 84x57.

   2. Убрав овал, я задал svg 22x22 — и иконки стали заметно МЕЛЬЧЕ лупы.
      Причина в самих файлах: у них viewBox="0 0 28 44", а рисунок занимает
      в нём лишь середину — по getBBox() сердце это 19.3x17.6 в точке (4.4, 13.2),
      корзина 26.2x18.7 в точке (0.9, 10.6). Остальное — пустота.
      preserveAspectRatio вписывает ВЕСЬ viewBox 28x44 в квадрат 22x22,
      масштаб выходит 0.5, и от сердца остаётся 9x8 пикселей.

   Поэтому задаём svg размер по пропорциям viewBox (34x53 — это масштаб 1.21,
   при нём рисунок получается ~22px в высоту, как у лупы), а лишнюю пустоту
   viewBox обрезаем самой кнопкой через overflow: hidden.
   --------------------------------------------------------------------------- */
.header__oc .btn.btn-icon-labeled {
    padding: 0;
    width: 34px;
    height: 30px;
    min-width: 0;
    overflow: hidden;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* У лупы подписи нет — убираем и здесь, иначе иконки в шапке разной высоты */
.header__oc .btn.btn-icon-labeled .icon-label {
    display: none;
}

.header__oc .btn.btn-icon-labeled svg {
    width: 34px;
    height: 53px;
    flex: none;
    display: block;
}

.header__oc .btn.btn-icon-labeled svg path {
    fill: var(--orchard-text);
    transition: fill 0.3s;
}

.header__oc .btn.btn-icon-labeled:hover svg path {
    fill: var(--orchard-green);
}

/* Счётчик товаров у корзины не должен уезжать вместе с обрезкой */
.header__oc .btn.btn-icon-labeled .cart-total,
.header__oc .btn.btn-icon-labeled .badge {
    position: absolute;
}

.header__oc #cart > .btn.btn-icon-labeled {
    overflow: visible;
    position: relative;
}

.header__oc #cart > .btn.btn-icon-labeled #cart-total {
    position: absolute;
    top: -3px;
    right: -7px;
    z-index: 2;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    margin: 0;
    border: 2px solid #fff;
    border-radius: 999px;
    background: var(--orchard-green);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

.header__oc {
    display: flex;
    align-items: center;
    gap: 18px;
}

/* ---------------------------------------------------------------------------
   31. ПОИСК В ШАПКЕ

   Здесь сталкивались два разных механизма:

   • orchard показывает .search__popup ПО НАВЕДЕНИЮ (.search:hover), из-за чего
     поле выскакивало само собой, стоило провести мышью мимо лупы. Клик при
     этом не работал: orchard.js вешает класс .search.active, а правила под
     него в style.css просто нет.
   • Внутри попапа лежит собственный поиск темы (#search). По фокусу он
     становится position: fixed и превращается в модалку — она рассчитана на
     57px шапку, а у нас 131px, поэтому накрывала меню.

   Оставляем модалку темы (в ней живой поиск по товарам), но открываем её
   кликом и подгоняем под orchard.
   --------------------------------------------------------------------------- */

/* 1. Открытие — только по клику */
.search:hover .search__popup { display: none; }
.search.active .search__popup { display: block; }
.search:hover::before { display: none; }

/* 2. Поле внутри попапа: тема красит его в сплошной зелёный, orchard —
      светлое поле с зелёной рамкой */
.search__popup .header #search,
.header .search__popup #search,
.search__popup #search {
    width: 100%;
}

.header .search__popup #search .search-input {
    background: var(--orchard-white);
    border: 1px solid var(--orchard-green);
    border-radius: var(--orchard-radius);
    color: var(--orchard-text);
    height: 60px;
    font-size: 18px;
    padding: 12px 20px 12px 56px;
}

.header .search__popup #search .search-input::placeholder {
    color: #767676;
    opacity: 1;
}

/* Иконка внутри поля — она белая, на светлом фоне была не видна */
.header .search__popup #search .search-icon {
    top: 10px;
    left: 14px;
    width: 30px;
    height: 30px;
    fill: var(--orchard-green);
}

/* 3. Модалка живого поиска */
.header #search.focused {
    top: 150px;
    border-radius: 24px;
    padding: 24px;
    padding-bottom: 24px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18);
    max-height: calc(100vh - 190px);
}

.header #search.focused .search-input,
.header #search.focused .search-input:focus {
    height: 60px;
    border-radius: var(--orchard-radius);
    border: 1px solid var(--orchard-green);
    color: var(--orchard-text);
    padding: 12px 20px 12px 56px;
    width: calc(100% - 72px);
}

.header #search.focused .search-icon {
    top: 39px;
    left: 38px;
    fill: var(--orchard-green);
}

.header #search.focused .close-search-modal {
    top: 24px;
    right: 24px;
    width: 60px;
    height: 60px;
    border-color: var(--orchard-green);
    color: var(--orchard-green);
    background-color: var(--orchard-green-pale);
    font-size: 20px;
}

/* Кнопка очистки поля — она рядом с крестом закрытия, разводим их */
.header #search.focused .clear-search-input {
    top: 41px;
    right: 104px;
}

.search-backdrop.show {
    display: block;
    z-index: 1;
}

@media screen and (max-width: 992px) {
    .header #search.focused {
        top: 90px;
        padding: 16px;
        border-radius: 16px;
        max-height: calc(100vh - 120px);
    }
    .header #search.focused .search-icon { top: 31px; left: 30px; }
    .header #search.focused .close-search-modal { top: 16px; right: 16px; width: 48px; height: 48px; }
    .header #search.focused .clear-search-input { top: 32px; right: 78px; }
}

/* ---------------------------------------------------------------------------
   32. ФОКУС И КУРСОР У ИКОНОК ШАПКИ

   Чёрная рамка после клика — это стандартный outline браузера/Bootstrap на
   :focus. У кнопки-иконки он смотрится как рамка вокруг сердца. Убираем его
   для мыши, но НЕ убираем для клавиатуры: :focus-visible срабатывает только
   при переходе табом, поэтому навигация с клавиатуры остаётся видимой.

   Лупа — это <span>, а не кнопка, поэтому курсор над ней был стрелкой.
   --------------------------------------------------------------------------- */
.header__oc .btn.btn-icon-labeled:focus,
.header__oc .btn.btn-icon-labeled:active,
.header__oc .btn.btn-icon-labeled:focus:active,
.search__toggle:focus {
    outline: none;
    box-shadow: none;
    border: 0;
    background: transparent;
}

.header__oc .btn.btn-icon-labeled:focus-visible,
.search__toggle:focus-visible {
    outline: 2px solid var(--orchard-green);
    outline-offset: 3px;
    border-radius: 4px;
}

.search,
.search__toggle,
.search__toggle img,
.search__toggle picture {
    cursor: pointer;
}

/* Внутри уже открытого поля курсор должен быть обычным для текста */
.search__popup,
.search__popup input {
    cursor: auto;
}

/* ---------------------------------------------------------------------------
   33. Header menu hover and in-header modal stacking

   orchard draws a hover bridge for submenu items via .menu__list::before. In
   the OpenCart header it becomes visible as a thin top line over menu links,
   especially under modal backdrops. The submenu itself still opens from the
   regular hover rule below, so the visual bridge can be disabled here.

   Cart and favorites are custom in-header modals, not Bootstrap modals, so
   they need their own z-index layer above the header/menu.
   --------------------------------------------------------------------------- */
.header .menu__list:hover::before {
    border: 0;
    box-shadow: none;
    opacity: 0;
    outline: 0;
}

.header .menu__link,
.header .menu__link:hover,
.header .menu__link:focus {
    border-top: 0;
    box-shadow: none;
    outline: none;
    text-decoration: none;
}

#cart.open .mdl-backdrop,
.favorites-backdrop_show {
    z-index: 10400;
}

#cart.open .mdl-content,
.favorites-modal_show {
    z-index: 10410;
}

/* ---------------------------------------------------------------------------
   34. Supermenu dropdown chrome

   The live menu can still be rendered by the Horizontal Mega Menu module
   (#supermenu). Its stock "white" skin adds a top border to hovered root
   items, a framed dropdown panel, and a generated "link of top item" button.
   orchard's header design keeps the dropdown clean, without these module
   controls.
   --------------------------------------------------------------------------- */
.header #supermenu.white,
.header #supermenu.imgmenu,
.main-menu #supermenu.white,
.main-menu #supermenu.imgmenu {
    border: 0;
    box-shadow: none;
}

.header #supermenu.white ul li a.tll,
.header #supermenu.white ul li.tlli:hover > a.tll,
.header #supermenu.respsmall.white ul li.tlli:hover > a.tll,
.header #supermenu.imgmenu ul li.tlli,
.main-menu #supermenu.white ul li a.tll,
.main-menu #supermenu.white ul li.tlli:hover > a.tll,
.main-menu #supermenu.respsmall.white ul li.tlli:hover > a.tll,
.main-menu #supermenu.imgmenu ul li.tlli {
    border: 0;
    box-shadow: none;
}

.header #supermenu.white ul li div.bigdiv,
.header #supermenu.white.respsmall ul li div.bigdiv,
.header #supermenu.imgmenu ul li div.bigdiv,
.main-menu #supermenu.white ul li div.bigdiv,
.main-menu #supermenu.white.respsmall ul li div.bigdiv,
.main-menu #supermenu.imgmenu ul li div.bigdiv {
    border: 0;
    box-shadow: none;
}

.header #supermenu ul li div.bigdiv .linkoftopitem,
.main-menu #supermenu ul li div.bigdiv .linkoftopitem {
    display: none;
}

/* ---------------------------------------------------------------------------
   35. Supermenu item alignment and desktop header fit

   The dropdown item image and title are separate links. Hovering the image
   should still communicate that the whole category tile is active.
   --------------------------------------------------------------------------- */
.header #supermenu ul li div .withimage,
.main-menu #supermenu ul li div .withimage {
    text-align: center;
}

.header #supermenu ul li div .withimage .image,
.main-menu #supermenu ul li div .withimage .image,
.header #supermenu ul li div .withimage .name,
.main-menu #supermenu ul li div .withimage .name {
    display: block;
    text-align: center;
}

.header #supermenu ul li div .withimage .image a,
.main-menu #supermenu ul li div .withimage .image a,
.header #supermenu ul li div .withimage .name a,
.main-menu #supermenu ul li div .withimage .name a {
    display: block;
    text-align: center;
}

.header #supermenu ul li div .withimage .image img,
.main-menu #supermenu ul li div .withimage .image img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    border: 0;
    border-radius: 8px;
}

.header #supermenu ul li div .withimage:hover .name a,
.main-menu #supermenu ul li div .withimage:hover .name a,
.header #supermenu ul li div .withimage:focus-within .name a,
.main-menu #supermenu ul li div .withimage:focus-within .name a {
    text-decoration: underline;
}

.header #supermenu.white ul li div.bigdiv,
.header #supermenu.white.respsmall ul li div.bigdiv,
.header #supermenu.imgmenu ul li div.bigdiv,
.main-menu #supermenu.white ul li div.bigdiv,
.main-menu #supermenu.white.respsmall ul li div.bigdiv,
.main-menu #supermenu.imgmenu ul li div.bigdiv {
    background: #FDF9FB;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 18px 42px rgba(74, 10, 45, 0.16);
    box-sizing: border-box;
    padding: 20px 22px 22px;
}

.header #supermenu.white ul li.tlli:hover > a.tll,
.header #supermenu.white ul li.tlli:focus-within > a.tll,
.header #supermenu.imgmenu ul li.tlli:hover > a.tll,
.header #supermenu.imgmenu ul li.tlli:focus-within > a.tll,
.main-menu #supermenu.white ul li.tlli:hover > a.tll,
.main-menu #supermenu.white ul li.tlli:focus-within > a.tll,
.main-menu #supermenu.imgmenu ul li.tlli:hover > a.tll,
.main-menu #supermenu.imgmenu ul li.tlli:focus-within > a.tll {
    background: #F9EFF5;
    border-radius: 6px;
    color: #9C135F;
}

.header__wrapper .phone > a {
    display: block;
    border-radius: 6px;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.header__wrapper .phone:hover > a,
.header__wrapper .phone:focus-within > a {
    background: #F9EFF5;
    color: #9C135F;
}

.header__wrapper .phone__popup {
    width: 286px;
    height: auto;
    min-height: 0;
    top: 66px;
    padding: 18px 20px;
    background: #FDF9FB;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 18px 42px rgba(74, 10, 45, 0.16);
    z-index: 120;
}

.header__wrapper .phone__popup a {
    width: 100%;
    padding: 8px 12px;
    border-radius: 6px;
    text-align: center;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.header__wrapper .phone__popup a:hover,
.header__wrapper .phone__popup a:focus {
    background: #F9EFF5;
    color: #9C135F;
}

@media (min-width: 992px) {
    .header__wrapper {
        min-width: 0;
    }

    .header__wrapper > .logo {
        flex: 0 0 auto;
        margin-right: 24px;
    }

    .header__wrapper > .main-menu,
    .header__wrapper > .menu {
        flex: 1 1 auto;
        min-width: 0;
        margin-right: 18px;
    }

    .header__wrapper #supermenu {
        min-width: 0;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    .header__wrapper #supermenu > ul {
        justify-content: flex-start;
        gap: 24px;
        min-width: 0;
    }

    .header__wrapper .menu__wrapper {
        justify-content: flex-start;
        gap: 24px;
        min-width: 0;
    }

    .header__wrapper .menu__list {
        margin-right: 0;
    }

    .header__wrapper .phone {
        flex: 0 0 auto;
        margin-left: 0;
    }

    .header__wrapper .phone > a {
        margin-left: -10px;
        margin-right: -10px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .header__wrapper .search {
        flex: 0 0 auto;
        margin-left: 36px;
    }

    .header__wrapper .header__oc {
        flex: 0 0 auto;
        gap: 24px;
        margin-left: 24px;
    }
}

@media (min-width: 992px) and (max-width: 1880px) {
    .header__wrapper > .logo {
        margin-right: 18px;
    }

    .header__wrapper > .main-menu,
    .header__wrapper > .menu {
        margin-right: 12px;
    }

    .header__wrapper #supermenu > ul,
    .header__wrapper .menu__wrapper {
        gap: 18px;
    }

    .header__wrapper #supermenu > ul > li.tlli > a.tll,
    .header__wrapper .menu__link,
    .header__wrapper .phone a {
        font-size: 19px;
    }

    .header__wrapper #supermenu > ul > li.tlli > a.tll {
        border-radius: 6px;
        margin-left: -10px;
        margin-right: -10px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .header__wrapper .search {
        margin-left: 30px;
    }

    .header__wrapper .header__oc {
        gap: 20px;
        margin-left: 20px;
    }
}

@media (min-width: 992px) and (max-width: 1680px) {
    .header__wrapper > .logo {
        margin-right: 14px;
    }

    .header__wrapper #supermenu > ul,
    .header__wrapper .menu__wrapper {
        gap: 16px;
    }

    .header__wrapper #supermenu > ul > li.tlli > a.tll,
    .header__wrapper .menu__link,
    .header__wrapper .phone a {
        font-size: 18px;
    }

    .header__wrapper .search {
        margin-left: 22px;
    }

    .header__wrapper .header__oc {
        gap: 16px;
        margin-left: 16px;
    }
}

/* ---------------------------------------------------------------------------
   36. Header search modal and live results
   --------------------------------------------------------------------------- */
.header #search.focused {
    width: min(940px, calc(100vw - 48px));
    max-width: none;
    padding: 30px;
    padding-bottom: 30px;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(45, 6, 28, 0.22);
    box-sizing: border-box;
}

.header #search.focused .search-input,
.header #search.focused .search-input:focus {
    width: calc(100% - 140px) !important;
    height: 60px;
    box-sizing: border-box;
    padding: 12px 56px 12px 70px;
}

.header #search.focused .search-icon {
    top: 40px;
    left: 48px;
}

.header #search.focused .close-search-modal {
    top: 30px;
    right: 30px;
    width: 60px;
    height: 60px;
}

.header #search.focused .clear-search-input {
    top: 47px;
    right: 168px;
    width: 26px;
    height: 26px;
    background: #F9EFF5;
    color: #9C135F;
    font-size: 12px;
    line-height: 1;
}

.header #search.focused .smartsearch {
    width: 100%;
    margin-top: 26px;
    padding: 0 2px 2px;
    overflow-y: auto;
    max-height: calc(100vh - 310px);
}

.header #search.focused .smartsearch ul.items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 12px;
}

.header #search.focused .smartsearch li.item {
    flex: none !important;
    width: auto !important;
    padding: 0 !important;
}

.header #search.focused .smartsearch li.item .item_block {
    position: relative;
    display: grid !important;
    grid-template-columns: 108px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 14px;
    align-items: center;
    height: auto !important;
    min-height: 0;
    margin: 0 !important;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #F0DEE9;
    border-radius: 10px;
    box-shadow: 0 10px 28px rgba(74, 10, 45, 0.08);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.header #search.focused .smartsearch li.item .item_block:hover {
    border-color: #E3C6D6;
    box-shadow: 0 14px 34px rgba(74, 10, 45, 0.14);
    transform: translateY(-2px);
}

.header #search.focused .smartsearch li.item .item_block .image {
    grid-row: 1 / 3;
    width: 108px !important;
    height: 108px;
    padding: 0 !important;
    overflow: hidden;
    background: #FBF4F8;
}

.header #search.focused .smartsearch li.item .item_block .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: none;
}

.header #search.focused .smartsearch li.item .item_block .image:hover img {
    transform: none;
}

.header #search.focused .smartsearch li.item .item_block .title {
    width: auto !important;
    min-width: 0;
    padding: 14px 48px 4px 0 !important;
}

.header #search.focused .smartsearch li.item .item_block .title a {
    color: #2f2f2f;
    font-size: 16px !important;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
}

.header #search.focused .smartsearch li.item .item_block .title a b {
    color: #9C135F;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom {
    margin-top: 0 !important;
    padding: 4px 48px 14px 0 !important;
    gap: 10px;
    align-self: start;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom .price {
    color: #555555;
    font-size: 14px !important;
    line-height: 1.35;
    white-space: normal;
}

.header #search.focused .smartsearch li.item .item_block .price-inner {
    color: #9C135F;
    font-weight: 500;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom button.product-add-to-fav {
    position: absolute;
    right: 12px;
    bottom: 12px;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #F9EFF5;
}

.header #search.focused .smartsearch .button {
    margin: 18px 0 0;
    border: 0;
    border-radius: 8px;
    background: #9C135F;
}

.header #search.focused .smartsearch .button a {
    box-shadow: none;
    border-radius: 8px;
}

@media (max-width: 767.98px) {
    .header #search.focused {
        width: calc(100vw - 24px);
        padding: 16px;
    }

    .header #search.focused .search-input,
    .header #search.focused .search-input:focus {
        width: calc(100% - 64px) !important;
        padding-left: 48px;
        padding-right: 44px;
    }

    .header #search.focused .search-icon {
        top: 31px;
        left: 28px;
    }

    .header #search.focused .close-search-modal {
        top: 16px;
        right: 16px;
        width: 48px;
        height: 48px;
    }

    .header #search.focused .clear-search-input {
        top: 33px;
        right: 74px;
    }

    .header #search.focused .smartsearch ul.items {
        grid-template-columns: 1fr;
    }

    .header #search.focused .smartsearch li.item .item_block {
        grid-template-columns: 92px minmax(0, 1fr);
    }

    .header #search.focused .smartsearch li.item .item_block .image {
        width: 92px !important;
        height: 92px;
    }
}

/* ---------------------------------------------------------------------------
   37. Search modal exact controls and stable result cards
   --------------------------------------------------------------------------- */
.header #search .search-modal-row {
    width: 100%;
}

.header #search.focused .search-modal-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 60px;
    gap: 16px;
    align-items: center;
}

.header #search .search-input-wrap {
    position: relative;
    min-width: 0;
}

.header #search.focused .search-input,
.header #search.focused .search-input:focus {
    width: 100% !important;
    padding-left: 70px;
    padding-right: 58px;
}

.header #search.focused .search-icon {
    top: 50% !important;
    left: 18px !important;
    transform: translateY(-50%);
}

.header #search.focused .clear-search-input {
    top: 50% !important;
    right: 18px !important;
    transform: translateY(-50%);
}

.header #search.focused .close-search-modal {
    position: static !important;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    padding: 0;
    border: 1px solid var(--orchard-green);
    border-radius: 50%;
    background: var(--orchard-green-pale);
    color: var(--orchard-green);
    line-height: 1;
}

.header #search.focused .smartsearch ul.items {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.header #search.focused .smartsearch li.item {
    display: block !important;
    padding: 0 !important;
    width: auto !important;
}

.header #search.focused .smartsearch li.item .item_block {
    display: grid !important;
    grid-template-columns: 132px minmax(0, 1fr) 44px;
    grid-template-rows: 1fr auto;
    column-gap: 16px;
    align-items: stretch !important;
    min-height: 132px;
    height: 132px !important;
    padding: 0;
}

.header #search.focused .smartsearch li.item .item_block .image {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 132px !important;
    height: 132px !important;
    align-self: stretch;
}

.header #search.focused .smartsearch li.item .item_block .title {
    grid-column: 2 / 4;
    grid-row: 1;
    align-self: start;
    padding: 18px 18px 6px 0 !important;
    text-align: left !important;
}

.header #search.focused .smartsearch li.item .item_block .title a {
    display: block;
    text-align: left !important;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom {
    grid-column: 2 / 4;
    grid-row: 2;
    align-self: end;
    justify-content: flex-start;
    padding: 6px 58px 18px 0 !important;
    text-align: left !important;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom .price {
    text-align: left !important;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom button.product-add-to-fav {
    right: 12px;
    bottom: 12px;
}

@media (max-width: 767.98px) {
    .header #search.focused .search-modal-row {
        grid-template-columns: minmax(0, 1fr) 48px;
        gap: 10px;
    }

    .header #search.focused .search-input,
    .header #search.focused .search-input:focus {
        padding-left: 48px;
        padding-right: 44px;
    }

    .header #search.focused .search-icon {
        left: 12px !important;
    }

    .header #search.focused .clear-search-input {
        right: 12px !important;
    }

    .header #search.focused .close-search-modal {
        width: 48px;
        height: 48px;
    }

    .header #search.focused .smartsearch ul.items {
        grid-template-columns: 1fr;
    }

    .header #search.focused .smartsearch li.item .item_block {
        grid-template-columns: 96px minmax(0, 1fr) 40px;
        min-height: 112px;
        height: auto !important;
    }

    .header #search.focused .smartsearch li.item .item_block .image {
        width: 96px !important;
        height: 112px !important;
    }
}

/* ---------------------------------------------------------------------------
   38. Search modal final layout polish
   --------------------------------------------------------------------------- */
.header #search.focused {
    width: min(1176px, calc(100vw - 48px)) !important;
}

.header #search.focused .search-modal-row {
    width: min(100%, 976px) !important;
    margin-left: auto;
    margin-right: auto;
    grid-template-columns: minmax(0, 1fr) 60px;
}

.header #search.focused .search-input-wrap {
    position: relative;
    width: 100%;
}

.header #search.focused .search-input,
.header #search.focused .search-input:focus {
    width: 100% !important;
    height: 60px;
    padding: 12px 58px 12px 70px !important;
}

.header #search.focused .clear-search-input {
    top: 50% !important;
    right: 18px !important;
    transform: translateY(-50%);
    display: none;
    align-items: center;
    justify-content: center;
}

.header #search.focused .smartsearch {
    width: min(100%, 900px) !important;
    margin-left: auto;
    margin-right: auto;
}

.header #search.focused .smartsearch ul.items {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px;
}

.header #search.focused .smartsearch li.item .item_block {
    display: grid !important;
    grid-template-columns: 144px minmax(0, 1fr) 44px;
    grid-template-rows: 1fr auto;
    column-gap: 18px;
    min-height: 134px;
    height: auto !important;
    padding: 14px !important;
    align-items: stretch !important;
}

.header #search.focused .smartsearch li.item .item_block .image {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 144px !important;
    height: 106px !important;
    border-radius: 8px;
    align-self: center;
}

.header #search.focused .smartsearch li.item .item_block .image img {
    border-radius: 8px;
}

.header #search.focused .smartsearch li.item .item_block .title {
    grid-column: 2 / 4;
    grid-row: 1;
    align-self: start;
    padding: 4px 10px 8px 0 !important;
    text-align: left !important;
}

.header #search.focused .smartsearch li.item .item_block .title a {
    text-align: left !important;
    font-size: 18px !important;
    line-height: 1.35;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom {
    grid-column: 2 / 4;
    grid-row: 2;
    align-self: end;
    justify-content: flex-start;
    padding: 8px 58px 0 0 !important;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom .price {
    font-size: 16px !important;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom button.product-add-to-fav {
    right: 14px;
    bottom: 14px;
}

.header #search.focused .smartsearch .button {
    width: min(100%, 900px);
    height: 44px;
    margin: 16px auto 0;
    padding: 0;
}

.header #search.focused .smartsearch .button a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.2;
}

@media (max-width: 767.98px) {
    .header #search.focused .search-modal-row {
        width: 100% !important;
        grid-template-columns: minmax(0, 1fr) 48px;
    }

    .header #search.focused .smartsearch {
        width: 100% !important;
    }

    .header #search.focused .smartsearch li.item .item_block {
        grid-template-columns: 96px minmax(0, 1fr) 40px;
        column-gap: 12px;
        padding: 10px !important;
        min-height: 112px;
    }

    .header #search.focused .smartsearch li.item .item_block .image {
        width: 96px !important;
        height: 92px !important;
    }

    .header #search.focused .smartsearch li.item .item_block .title a {
        font-size: 16px !important;
    }
}

/* ---------------------------------------------------------------------------
   39. Search modal final button placement
   --------------------------------------------------------------------------- */
.header #search.focused {
    padding-top: 36px;
}

.header #search.focused .search-modal-row {
    display: block;
    width: min(100%, 1124px) !important;
    padding-right: 144px;
    box-sizing: border-box;
}

.header #search.focused .search-input,
.header #search.focused .search-input:focus {
    width: 100% !important;
    padding-right: 58px !important;
}

.header #search.focused .close-search-modal {
    position: absolute !important;
    top: 36px;
    right: 36px;
    width: 74px;
    height: 74px;
}

.header #search.focused .clear-search-input {
    top: 50% !important;
    right: 18px !important;
    transform: translateY(-50%);
    display: none !important;
    align-items: center;
    justify-content: center;
    z-index: 3;
}

.header #search.focused.search-has-value .clear-search-input {
    display: flex !important;
}

.header #search.focused .smartsearch li.item .item_block .item-block-bottom .price {
    font-size: 18px !important;
    line-height: 1.35;
}

.header #search.focused .smartsearch li.item .item_block .price-inner {
    font-size: 18px !important;
}

@media (max-width: 767.98px) {
    .header #search.focused .search-modal-row {
        padding-right: 58px;
    }

    .header #search.focused .close-search-modal {
        top: 16px;
        right: 16px;
        width: 48px;
        height: 48px;
    }
}

/* ---------------------------------------------------------------------------
   40. Search modal unified content width
   --------------------------------------------------------------------------- */
.header #search.focused {
    --fg-search-content-width: min(100%, 900px);
    display: flex;
    flex-direction: column;
    width: min(1176px, calc(100vw - 48px)) !important;
    max-height: calc(100vh - 110px);
    overflow: hidden;
    padding: 36px 36px 30px;
}

.header #search.focused .search-modal-row {
    display: block;
    flex: 0 0 auto;
    width: var(--fg-search-content-width) !important;
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
}

.header #search.focused .search-input-wrap {
    display: grid;
    position: relative;
    width: 100%;
}

.header #search.focused .search-input-wrap .clear-search-input {
    position: absolute !important;
    top: 50% !important;
    right: 18px !important;
    grid-area: auto;
    justify-self: end;
    align-self: center;
    margin-right: 0;
    transform: translateY(-50%) !important;
}

.header #search.focused .search-input,
.header #search.focused .search-input:focus {
    grid-area: 1 / 1;
    width: 100% !important;
    padding-right: 58px !important;
}

.header #search.focused .clear-search-input {
    top: 50% !important;
    right: 18px !important;
    transform: translateY(-50%);
}

.header #search.focused .close-search-modal {
    position: absolute !important;
    top: 36px;
    right: 36px;
    width: 74px;
    height: 74px;
}

.header #search.focused .smartsearch {
    flex: 1 1 auto;
    min-height: 0;
    width: var(--fg-search-content-width) !important;
    max-height: calc(100vh - 290px);
    margin: 26px auto 0;
    padding: 0 0 2px;
    overflow-y: auto;
}

.header #search.focused .smartsearch .button {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    margin: 16px 0 0;
}

@media (max-width: 767.98px) {
    .header #search.focused {
        width: calc(100vw - 24px) !important;
        max-height: calc(100vh - 24px);
        padding: 16px;
    }

    .header #search.focused .search-modal-row,
    .header #search.focused .smartsearch {
        width: 100% !important;
    }

    .header #search.focused .close-search-modal {
        top: 16px;
        right: 16px;
        width: 48px;
        height: 48px;
    }
}

/* ---------------------------------------------------------------------------
   41. Favorites modal polish
   --------------------------------------------------------------------------- */
#favorites .favorites-modal {
    --fg-favorites-content-width: min(100%, 900px);
    top: 50%;
    left: 50%;
    display: flex;
    flex-direction: column;
    width: min(1176px, calc(100vw - 48px));
    max-width: none;
    max-height: calc(100vh - 110px);
    height: auto;
    padding: 28px 36px 30px;
    overflow: hidden;
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 24px 70px rgba(45, 6, 28, 0.22);
    box-sizing: border-box;
    transform: translate(-50%, -50%) scale(0.98);
    pointer-events: none;
}

#favorites .favorites-modal.favorites-modal_show {
    top: 50%;
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
    pointer-events: auto;
}

#favorites .favorites-modal__container {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

#favorites .favorites-modal__header {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0 96px 22px 0;
    border-bottom: 0;
    color: var(--fg-color-green);
    font-size: 20px;
    line-height: 1.25;
}

#favorites .favorites-modal__close-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 74px;
    height: 74px;
    border: 1px solid #9C135F;
    border-radius: 50%;
    background: #F9EFF5;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

#favorites .favorites-modal__close-btn:hover,
#favorites .favorites-modal__close-btn:focus {
    background: #F2E1EB;
    transform: scale(1.03);
}

#favorites .favorites-modal__close-btn span {
    width: 34px;
    background-color: #86104F;
}

#favorites .favorites-modal__content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    width: var(--fg-favorites-content-width);
    min-height: 0;
    margin: 0 auto;
    overflow: hidden;
}

#favorites .favorites-modal__products {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 16px;
    min-height: 0;
    padding: 0 0 2px;
    overflow-y: auto;
}

#favorites .fm-item {
    display: grid;
    flex: 0 0 auto;
    grid-template-columns: 144px minmax(0, 1fr) 54px;
    grid-template-rows: auto;
    align-items: center;
    column-gap: 18px;
    width: 100%;
    min-height: 134px;
    padding: 14px;
    border: 1px solid #EDD8E4;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(74, 10, 45, 0.06);
    box-sizing: border-box;
}

#favorites .fm-item:hover {
    background: #FDF9FB;
}

#favorites .fm-item__image {
    display: block;
    width: 144px;
    height: 106px;
    overflow: hidden;
    border-radius: 8px;
}

#favorites .fm-item__image img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
}

#favorites .fm-item__info {
    min-width: 0;
    margin: 0;
    text-align: left;
}

#favorites .fm-item__name {
    margin: 0;
    color: #111;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
    text-align: left;
    text-transform: none;
}

#favorites .fm-item__name:hover,
#favorites .fm-item__name:focus {
    color: #86104F;
    text-decoration: underline;
}

#favorites .fm-item__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0;
}

#favorites .fm-item__actions button.fm-item__remove,
#favorites .fm-item__actions .fm-item__watch-product {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

#favorites .fm-item__actions button.fm-item__remove {
    background: #F9EFF5;
}

#favorites .fm-item__actions button.fm-item__remove:hover,
#favorites .fm-item__actions button.fm-item__remove:focus,
#favorites .fm-item__actions .fm-item__watch-product:hover,
#favorites .fm-item__actions .fm-item__watch-product:focus {
    transform: scale(1.04);
}

#favorites .fm-item__actions button.fm-item__remove svg {
    width: 28px;
    height: 28px;
}

#favorites .fm-item__actions .fm-item__watch-product {
    background: var(--fg-color-green);
}

#favorites .fm-item__actions .fm-item__watch-product svg {
    width: 24px;
    height: 16px;
}

#favorites .favorites-modal__watch-all {
    flex: 0 0 auto;
    width: 100%;
    height: 44px;
    margin: 16px 0 0;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: #9C135F;
    text-align: center;
}

#favorites .favorites-modal__watch-all a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 0 18px;
    border-radius: 8px;
    box-shadow: none;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
}

#favorites .favorites-modal__watch-all a:hover,
#favorites .favorites-modal__watch-all a:focus {
    background: #86104F;
    color: #fff;
}

#favorites .favorites-modal__empty {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 260px;
    padding: 24px;
    color: #111;
    font-size: 18px;
    line-height: 1.4;
}

#favorites .favorites-modal__empty svg {
    width: 112px;
    height: 112px;
    margin: 24px auto 0;
}

@media (max-width: 767.98px) {
    #favorites .favorites-modal,
    #favorites .favorites-modal.favorites-modal_show {
        top: 12px;
        left: 12px;
        width: calc(100vw - 24px);
        max-height: calc(100vh - 24px);
        padding: 16px;
        border-radius: 18px;
        transform: none;
    }

    #favorites .favorites-modal__header,
    #favorites .favorites-modal__content {
        width: 100%;
    }

    #favorites .favorites-modal__header {
        min-height: 48px;
        padding: 4px 62px 16px 0;
        font-size: 18px;
    }

    #favorites .favorites-modal__close-btn {
        width: 48px;
        height: 48px;
    }

    #favorites .favorites-modal__close-btn span {
        width: 26px;
    }

    #favorites .fm-item {
        grid-template-columns: 96px minmax(0, 1fr) 44px;
        column-gap: 12px;
        min-height: 112px;
        padding: 10px;
    }

    #favorites .fm-item__image {
        width: 96px;
        height: 92px;
    }

    #favorites .fm-item__name {
        font-size: 16px;
    }
}

/* ---------------------------------------------------------------------------
   42. Breadcrumb duplicate separator cleanup
   --------------------------------------------------------------------------- */
.breadcrumb > li:after {
    content: none;
    display: none;
}

/* ---------------------------------------------------------------------------
   43. Latest products slider polish
   --------------------------------------------------------------------------- */
.products-latest-container .latest-slider-btn-next,
.products-latest-container .latest-slider-btn-prev {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 82px;
    min-width: 82px;
    height: 40px;
    min-height: 0;
    left: auto;
    top: 15px;
    background: transparent;
    border: 0;
    box-shadow: none;
    color: var(--orchard-green);
    fill: var(--orchard-green);
    transform: none;
    transition: opacity 0.2s ease;
}

.products-latest-container .latest-slider-btn-next:hover,
.products-latest-container .latest-slider-btn-prev:hover,
.products-latest-container .latest-slider-btn-next:focus,
.products-latest-container .latest-slider-btn-prev:focus {
    background: transparent;
    opacity: 0.72;
    transform: none;
}

.products-latest-container .latest-slider-btn-next {
    right: 0;
}

.products-latest-container .latest-slider-btn-prev {
    right: 112px;
}

.products-latest-container .latest-slider-btn-next svg,
.products-latest-container .latest-slider-btn-prev svg {
    display: block;
    width: 82px;
    max-width: none;
    height: 9px;
    max-height: none;
}

.products-latest-container .latest-slider-btn-next svg path,
.products-latest-container .latest-slider-btn-prev svg path {
    fill: currentColor;
}

.products-latest-row {
    padding: 10px 4px 12px;
}

.products-latest-row .product-grid .product-thumb {
    padding: 14px;
    border: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 10px;
    background: #FDF9FB;
    box-shadow: 0 8px 24px rgba(74, 10, 45, 0.08);
    box-sizing: border-box;
}

.products-latest-row .product-grid .product-thumb .image {
    width: 100%;
    height: 300px;
    margin-bottom: 14px;
    overflow: hidden;
    border-radius: 8px;
    background: transparent;
}

.products-latest-row .product-grid .product-thumb .image a {
    display: block;
    width: 100%;
    height: 100%;
}

.products-latest-row .product-grid .product-thumb .image a img,
.products-latest-row .product-grid .product-thumb .image img {
    display: block;
    width: 100%;
    max-width: none;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
    object-position: center;
}

.products-latest-row .product-grid .product-thumb .caption {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    margin-bottom: 12px;
    text-align: center;
}

.products-latest-row .product-grid .product-thumb .products-latest-description {
    margin: 0 0 12px;
    color: #111;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.35;
}

.products-latest-row .product-grid .product-thumb .product-bottom_v2,
.products-latest-row .product-grid .product-thumb .product-buttons {
    padding-left: 0;
    padding-right: 0;
}

.products-latest-row .product-grid .product-thumb .product-bottom_v2 .price {
    margin-bottom: 14px;
    font-size: 18px;
    line-height: 1.35;
}

.products-latest-row .product-grid .product-thumb .product-bottom_v2 .price-inner {
    color: var(--fg-color-green);
    font-weight: 700;
}

@media (max-width: 767.98px) {
    .products-latest-container .latest-slider-btn-next,
    .products-latest-container .latest-slider-btn-prev {
        top: 20px;
        transform: scale(0.72);
        transform-origin: center;
    }

    .products-latest-container .latest-slider-btn-next:hover,
    .products-latest-container .latest-slider-btn-prev:hover,
    .products-latest-container .latest-slider-btn-next:focus,
    .products-latest-container .latest-slider-btn-prev:focus {
        transform: scale(0.72);
    }

    .products-latest-container .latest-slider-btn-next {
        right: 0;
    }

    .products-latest-container .latest-slider-btn-prev {
        right: 82px;
    }

    .products-latest-row .product-grid .product-thumb .image {
        height: 260px;
    }
}

/* ---------------------------------------------------------------------------
   44. Product cards: match Latest visual style
   --------------------------------------------------------------------------- */
#category-products.pc-grid .product-grid .product-thumb,
.search-products-row .product-grid .product-thumb,
.content-block .cb-products .cb-products__item {
    padding: 14px;
    border: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 10px;
    background: #FDF9FB;
    box-shadow: 0 8px 24px rgba(74, 10, 45, 0.08);
    box-sizing: border-box;
    overflow: hidden;
}

#category-products.pc-grid .product-grid .product-thumb .image,
.search-products-row .product-grid .product-thumb .image,
.content-block .cb-products .cb-products__image {
    width: 100%;
    height: 300px;
    margin-bottom: 14px;
    overflow: hidden;
    border: 0;
    border-radius: 8px;
    background: transparent;
    box-sizing: border-box;
}

#category-products.pc-grid .product-grid .product-thumb .image a,
.search-products-row .product-grid .product-thumb .image a,
.content-block .cb-products .cb-products__image {
    display: block;
    width: 100%;
    height: 100%;
}

#category-products.pc-grid .product-grid .product-thumb .image a img,
#category-products.pc-grid .product-grid .product-thumb .image img,
.search-products-row .product-grid .product-thumb .image a img,
.search-products-row .product-grid .product-thumb .image img,
.content-block .cb-products .cb-products__image img {
    display: block;
    width: 100%;
    max-width: none;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
    object-position: center;
}

#category-products.pc-grid .product-grid .product-thumb .caption,
.search-products-row .product-grid .product-thumb .caption {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    margin-bottom: 12px;
    text-align: center;
}

.search-products-row .product-grid .product-thumb .search-product-info {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
}

#category-products.pc-grid .product-grid .product-thumb .caption > p,
.search-products-row .product-grid .product-thumb .search-product-description,
.content-block .cb-products .cb-products__description {
    margin: 0 0 12px;
    color: #111;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.35;
    text-align: center;
}

#category-products.pc-grid .product-grid .product-thumb .product-title,
.search-products-row .product-grid .product-thumb .caption h4,
.content-block .cb-products .cb-products__title {
    margin: 0 0 10px;
    padding: 0;
    border-top: 0;
    text-align: center;
}

#category-products.pc-grid .product-grid .product-thumb .product-title a,
.search-products-row .product-grid .product-thumb .caption h4 a,
.content-block .cb-products .cb-products__title {
    color: var(--fg-color-green);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
}

#category-products.pc-grid .product-grid .product-thumb .price,
.search-products-row .product-grid .product-thumb .price,
.content-block .cb-products .cb-products__price {
    margin: auto 0 14px;
    color: #111;
    font-size: 18px;
    line-height: 1.35;
    text-align: center;
}

#category-products.pc-grid .product-grid .product-thumb .price-inner,
.search-products-row .product-grid .product-thumb .price-inner,
.content-block .cb-products .cb-products__price-inner {
    color: var(--fg-color-green);
    font-weight: 700;
}

.content-block .cb-products .cb-products__bottom {
    width: 100%;
    margin-bottom: 0;
}

.content-block .cb-products .cb-products__bottom .cb-products__button button {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    #category-products.pc-grid .product-grid .product-thumb .image,
    .search-products-row .product-grid .product-thumb .image,
    .content-block .cb-products .cb-products__image {
        height: 260px;
    }
}

/* ---------------------------------------------------------------------------
   45. Category listing interface refresh
   --------------------------------------------------------------------------- */
#product-category .sub-cats.category-assortment__wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 24px;
    margin: 0 0 34px;
}

#product-category .sub-cats__item {
    flex: none;
    max-width: none;
    border-radius: 0;
    background: transparent;
    transition: none;
}

#product-category .sub-cats__item:hover {
    background: transparent;
    transform: none;
}

#product-category .sub-cats__item .category-assortment__link {
    width: 100%;
    height: clamp(260px, 28vw, 360px);
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 14px;
    background: transparent;
    box-shadow: none;
    color: #fff;
    display: block;
    overflow: hidden;
    position: relative;
    text-decoration: none;
}

#product-category .sub-cats__item .category-assortment__link::before {
    opacity: 1;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.02) 30%, rgba(0, 0, 0, 0.62) 100%);
    z-index: 2;
}

#product-category .sub-cats__item .category-assortment__link::after {
    display: none;
}

#product-category .sub-cats__item .category-assortment__link:hover,
#product-category .sub-cats__item .category-assortment__link:focus {
    background: transparent;
    color: #fff;
    text-decoration: none;
    outline: none;
}

#product-category .sub-cats__item .category-assortment__image {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    z-index: 1;
}

#product-category .sub-cats__item .category-assortment__image img {
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: inherit;
    object-fit: cover;
    object-position: center;
    transition: transform 0.9s ease;
}

#product-category .sub-cats__item .category-assortment__link:hover .category-assortment__image img,
#product-category .sub-cats__item .category-assortment__link:focus .category-assortment__image img {
    transform: scale(1.1);
}

#product-category .sub-cats__item .category-assortment__title {
    left: 34px;
    bottom: 34px;
    width: calc(100% - 68px);
    min-height: 74px;
    opacity: 1;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

#product-category .sub-cats__item .category-assortment__title span {
    color: #fff;
    display: -webkit-box;
    flex: 1 1 auto;
    min-width: 0;
    max-width: none;
    font-size: clamp(24px, 2.1vw, 32px);
    font-weight: 500;
    line-height: 1.08;
    letter-spacing: 0;
    overflow: hidden;
    padding-right: 0;
    position: relative;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.22);
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

#product-category .sub-cats__item .category-assortment__title span::before {
    display: none;
}

#product-category .sub-cats__item .category-assortment__title span::after {
    display: none;
}

#product-category .sub-cats__item .category-assortment__title::after {
    content: "";
    display: block;
    flex: 0 0 94px;
    width: 94px;
    height: 24px;
    background: url("../orchard/img/icons/arrow-right.svg") center / contain no-repeat;
}

#product-category .category-top {
    align-items: center;
    gap: 18px;
    margin: 0 0 22px;
    padding: 0;
}

#product-category .category-tools,
#product-category .category-sort-tools {
    display: flex;
    align-items: center;
    gap: 12px;
}

#product-category .category-sort-tools .sort-products-tool {
    margin-left: 0;
}

#product-category .sort-products-tool .form-group {
    margin-bottom: 0;
}

#product-category .sort-products-tool .input-group {
    display: inline-flex;
    align-items: stretch;
    width: auto;
    max-width: 100%;
    overflow: hidden;
    border: 1px solid #EDD8E4;
    border-radius: 8px;
    background: #fff;
}

#product-category .sort-products-tool .input-group-addon {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    width: auto;
    min-height: 44px;
    padding: 0 14px;
    border: 0;
    border-right: 1px solid #EDD8E4;
    border-radius: 0;
    background: #FDF9FB;
    color: #7A0E49;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    box-shadow: none;
}

#product-category .sort-products-tool select.form-control {
    flex: 1 1 auto;
    width: auto;
    height: 44px;
    min-width: 92px;
    border: 0;
    border-radius: 0;
    background-color: #fff;
    box-shadow: none;
    color: #333;
    font-size: 14px;
}

#product-category .sort-products-tool select#input-sort {
    min-width: 236px;
}

#product-category .sort-products-tool .input-group:focus-within {
    border-color: #9C135F;
    box-shadow: 0 0 0 3px rgba(156, 19, 95, 0.12);
}

#product-category .sort-products-tool select.form-control:focus {
    outline: none;
    box-shadow: none;
}

#product-category .category-tools .select-view {
    display: inline-flex;
    overflow: hidden;
    border: 1px solid #EDD8E4;
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
}

#product-category .category-tools .select-view button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    color: #6f8f8a;
}

#product-category .category-tools .select-view button + button {
    border-left: 1px solid #EDD8E4;
}

#product-category .category-tools .select-view button.active,
#product-category .category-tools .select-view button:hover,
#product-category .category-tools .select-view button:focus {
    background: #F9EFF5;
    color: #9C135F;
    outline: none;
}

#product-category .category-nav {
    overflow: hidden;
    border: 1px solid #EDD8E4;
    border-radius: 10px;
    background: #FDF9FB;
    box-shadow: 0 8px 24px rgba(74, 10, 45, 0.06);
}

#product-category .category-nav .category-nav__item_top {
    border-bottom: 1px solid #EDD8E4;
}

#product-category .category-nav .category-nav__item_top:last-child {
    border-bottom: 0;
}

#product-category .category-nav .category-nav__item_top a.category-nav__link_top {
    padding: 14px 16px;
    color: #7A0E49;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.25;
}

#product-category .category-nav .category-nav__item_top a.category-nav__link_top:hover,
#product-category .category-nav .category-nav__item_top.active a.category-nav__link_top {
    background: #F9EFF5;
    color: #7A0E49;
    text-decoration: none;
}

#product-category .category-nav .category-nav__child-list {
    background: #fff;
}

#product-category .category-nav .category-nav__item_child .category-nav__link_child {
    margin: 0;
    padding: 12px 16px 12px 28px;
    border-top: 1px solid #F7EBF2;
    color: #86104F;
    font-size: 16px;
    line-height: 1.25;
    transition: background-color 0.2s ease, color 0.2s ease;
}

#product-category .category-nav .category-nav__item_child .category-nav__link_child:hover,
#product-category .category-nav .category-nav__item_child.active .category-nav__link_child {
    background: #F9EFF5;
    color: #7A0E49;
    text-decoration: none;
}

#product-category .category-nav .category-nav__link.category-nav__dropdown-toggle + ul {
    padding: 8px 0;
    background: #FDF9FB;
    box-shadow: none;
}

#product-category .category-nav a.category-nav__link.category-nav__link_subchild,
#product-category .category-nav .category-nav__subchild-list .category-nav__item_watch-all a {
    padding: 8px 16px 8px 42px;
    color: #7A0E49;
    font-size: 15px;
}

#product-category .category-nav a.category-nav__link.category-nav__link_subchild:hover,
#product-category .category-nav .category-nav__subchild-list .category-nav__item_watch-all a:hover,
#product-category .category-nav__item_subchild.active a {
    background: #F7EBF2;
    color: #7A0E49;
    text-decoration: none;
}

@media (max-width: 991.98px) {
    #product-category .category-top {
        flex-direction: column;
        align-items: stretch;
    }

    #product-category .category-tools,
    #product-category .category-sort-tools {
        justify-content: space-between;
        flex-wrap: wrap;
    }

    #product-category .sort-products-tool {
        flex: 1 1 220px;
    }

    #product-category .sort-products-tool .input-group,
    #product-category .sort-products-tool select.form-control {
        width: 100%;
    }

    #product-category .sub-cats.category-assortment__wrapper {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    #product-category .sub-cats__item .category-assortment__link {
        height: 300px;
    }
}

@media (max-width: 767.98px) {
    #product-category .sub-cats.category-assortment__wrapper {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-bottom: 28px;
    }

    #product-category .sub-cats__item .category-assortment__link {
        height: 260px;
    }

    #product-category .sub-cats__item .category-assortment__title {
        left: 22px;
        bottom: 58px;
        width: calc(100% - 44px);
        min-height: 64px;
        padding: 0;
        background: transparent;
        gap: 14px;
    }

    #product-category .sub-cats__item .category-assortment__title span {
        max-width: none;
        font-size: clamp(23px, 6vw, 30px);
        line-height: 1.06;
        padding-right: 0;
        text-align: left;
    }

    #product-category .sub-cats__item .category-assortment__title span::after {
        display: none;
    }

    #product-category .sub-cats__item .category-assortment__title::after {
        display: block;
        flex: 0 0 82px;
        width: 82px;
        height: 20px;
    }
}

/* ---------------------------------------------------------------------------
   46. Options modal controls
   --------------------------------------------------------------------------- */
.modal-options-container .md-option__container {
    gap: 18px;
}

.modal-options-container .md-option__name {
    text-align: left;
}

.modal-options-container .md-option__price {
    color: #111;
    font-size: 18px;
    line-height: 1.25;
    white-space: nowrap;
    word-break: normal;
}

.modal-options-container .prod-option__actions {
    flex: 0 0 auto;
    justify-content: flex-end;
    gap: 0;
    white-space: nowrap;
}

.modal-options-container .prod-option_btn {
    width: 42px;
    min-width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid var(--fg-color-green);
    background: #FDF9FB;
    color: #111;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    box-shadow: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.modal-options-container .prod-option_dec {
    border-radius: 21px 0 0 21px;
}

.modal-options-container .prod-option_inc {
    border-radius: 0 21px 21px 0;
}

.modal-options-container .prod-option_btn:hover,
.modal-options-container .prod-option_btn:focus {
    background: #F9EFF5;
    color: var(--fg-color-green);
    outline: none;
}

.modal-options-container .prod-option__actions input[type="number"] {
    width: 54px;
    height: 42px;
    padding: 0 8px;
    border: 1px solid var(--fg-color-green);
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    background: #fff;
    color: #111;
    font-size: 18px;
    line-height: 42px;
    text-align: center;
}

.modal-options-container .prod-option__actions input[type="number"]:focus {
    background: #fff;
    outline: none;
    box-shadow: inset 0 0 0 1px rgba(156, 19, 95, 0.14);
}

.modal-options-container .prod-option_add-to-cart,
.modal-options-container .prod-option_add-to-cart-cb {
    width: 48px;
    min-width: 48px;
    height: 48px;
    margin-left: 10px;
    border: 0;
    border-radius: 50%;
    background: var(--fg-color-green);
    color: #fff;
}

.modal-options-container .prod-option_add-to-cart:hover,
.modal-options-container .prod-option_add-to-cart:focus,
.modal-options-container .prod-option_add-to-cart-cb:hover,
.modal-options-container .prod-option_add-to-cart-cb:focus {
    background: var(--fg-color-darkgreen);
    color: #fff;
}

.modal-options-container .prod-option_add-to-cart svg,
.modal-options-container .prod-option_add-to-cart-cb svg {
    width: 24px;
    height: 20px;
    fill: currentColor;
}

.orchard-cart-alert,
.orchard-wishlist-alert {
    position: fixed;
    top: 24px;
    left: 50%;
    z-index: 12000;
    width: min(620px, calc(100vw - 32px));
    margin: 0;
    padding: 16px 52px 16px 20px;
    border: 1px solid rgba(156, 19, 95, 0.22);
    border-radius: 10px;
    background: #FDF9FB;
    box-shadow: 0 14px 38px rgba(74, 10, 45, 0.16);
    color: #4A0A2D;
    font-size: 16px;
    line-height: 1.45;
    transform: translateX(-50%);
}

.orchard-cart-alert a,
.orchard-wishlist-alert a {
    color: var(--fg-color-green);
    font-weight: 700;
    text-decoration: underline;
}

.orchard-cart-alert .fa,
.orchard-wishlist-alert .fa {
    margin-right: 8px;
    color: var(--fg-color-green);
}

.orchard-cart-alert .close,
.orchard-wishlist-alert .close {
    position: absolute;
    top: 50%;
    right: 16px;
    color: var(--fg-color-green);
    font-size: 26px;
    line-height: 1;
    opacity: 1;
    transform: translateY(-50%);
    text-shadow: none;
}

@media (max-width: 767.98px) {
    .modal-options-container .md-option__container {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .modal-options-container .md-option__name,
    .modal-options-container .md-option__price,
    .modal-options-container .prod-option__actions {
        flex: 1 1 100%;
        text-align: left;
    }

    .modal-options-container .prod-option__actions {
        justify-content: flex-start;
    }
}

/* ---------------------------------------------------------------------------
   47. Cart and SimpleCheckout pages refresh
   --------------------------------------------------------------------------- */
#checkout-cart #content > h1 {
    margin: 10px 0 28px;
    color: var(--fg-color-green);
    font-size: 34px;
    font-weight: 700;
    line-height: 1.25;
}

#checkout-cart .table-responsive {
    overflow: visible;
    margin-bottom: 24px;
    border: 0;
}

#checkout-cart .table {
    margin: 0;
    border: 0;
    border-collapse: separate;
    border-spacing: 0 12px;
}

#checkout-cart .table > thead > tr > td {
    padding: 0 16px 10px;
    border: 0;
    background: transparent;
    color: #6B6B6B;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

#checkout-cart .table > tbody > tr {
    background: #FDF9FB;
    box-shadow: 0 8px 24px rgba(74, 10, 45, 0.07);
}

#checkout-cart .table > tbody > tr > td {
    padding: 18px 16px;
    border-top: 1px solid rgba(156, 19, 95, 0.16);
    border-bottom: 1px solid rgba(156, 19, 95, 0.16);
    background: transparent;
    vertical-align: middle;
}

#checkout-cart .table > tbody > tr > td:first-child {
    border-left: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 10px 0 0 10px;
}

#checkout-cart .table > tbody > tr > td:last-child {
    border-right: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 0 10px 10px 0;
}

#checkout-cart .table .img-thumbnail {
    width: 86px;
    height: 86px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    object-fit: cover;
    object-position: center;
}

#checkout-cart .table td.text-left a {
    color: var(--fg-color-green);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
}

#checkout-cart .table td.text-left small {
    display: inline-block;
    margin-top: 5px;
    color: #666666;
    font-size: 14px;
    line-height: 1.35;
}

#checkout-cart .table td.text-right {
    color: #111;
    font-size: 16px;
    font-weight: 500;
}

#checkout-cart .table td.text-right:last-child {
    color: var(--fg-color-green);
    font-weight: 700;
}

#checkout-cart .table .input-group.btn-block {
    display: inline-flex;
    align-items: center;
    width: auto;
    max-width: none !important;
}

#checkout-cart .table .input-group .form-control {
    width: 58px;
    height: 42px;
    padding: 0 8px;
    border: 1px solid var(--fg-color-lightgreen);
    border-right: 0;
    border-radius: 21px 0 0 21px;
    color: #111;
    font-size: 16px;
    text-align: center;
}

#checkout-cart .table .input-group-btn {
    display: inline-flex;
    width: auto;
}

#checkout-cart .table .input-group-btn .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
}

#checkout-cart .table .input-group-btn .btn-primary {
    border-color: var(--fg-color-lightgreen);
    background: #F9EFF5;
    color: var(--fg-color-green);
}

#checkout-cart .table .input-group-btn .btn-danger {
    margin-left: 8px;
    border: 0;
    border-radius: 50%;
    background: #f7e9e5;
    color: #b84b38;
}

#checkout-cart .table .input-group-btn .btn-primary:hover,
#checkout-cart .table .input-group-btn .btn-primary:focus {
    background: var(--fg-color-lightgreen);
    color: #fff;
}

#checkout-cart .table .input-group-btn .btn-danger:hover,
#checkout-cart .table .input-group-btn .btn-danger:focus {
    background: #b84b38;
    color: #fff;
}

#checkout-cart #accordion .panel,
#checkout-cart .col-sm-4 .table {
    overflow: hidden;
    border: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 10px;
    background: #FDF9FB;
    box-shadow: 0 8px 24px rgba(74, 10, 45, 0.07);
}

#checkout-cart #accordion .panel-heading {
    border: 0;
    border-bottom: 1px solid rgba(156, 19, 95, 0.12);
    background: #FBF4F8;
}

#checkout-cart #accordion .panel-title a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #333;
    font-size: 18px;
    font-weight: 500;
    text-decoration: none;
}

#checkout-cart #accordion .panel-body {
    padding: 24px;
}

#checkout-cart #accordion .panel-body .control-label {
    display: block;
    float: none;
    width: 100%;
    margin: 0 0 10px;
    padding: 0;
    color: #111;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.35;
    text-align: left;
    white-space: nowrap;
}

#checkout-cart #accordion .panel-body .input-group {
    display: flex;
    align-items: stretch;
    width: 100%;
}

#checkout-cart #accordion .panel-body .input-group .form-control {
    flex: 1 1 auto;
    height: 52px;
    min-height: 52px;
    border: 1px solid #EDD8E4;
    border-right: 0;
    border-radius: 8px 0 0 8px;
    box-shadow: none;
}

#checkout-cart #accordion .panel-body .input-group-btn {
    display: flex;
    width: auto;
}

#checkout-cart #accordion .panel-body #button-coupon,
#checkout-cart #accordion .panel-body #button-voucher {
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: 52px;
    min-height: 52px;
    padding: 0 28px;
    border: 1px solid var(--fg-color-lightgreen);
    border-radius: 0 8px 8px 0;
    background: var(--fg-color-lightgreen);
    color: #fff;
    box-shadow: none;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

#checkout-cart #accordion .panel-body #button-coupon:hover,
#checkout-cart #accordion .panel-body #button-coupon:focus,
#checkout-cart #accordion .panel-body #button-voucher:hover,
#checkout-cart #accordion .panel-body #button-voucher:focus {
    border-color: var(--fg-color-green);
    background: var(--fg-color-green);
}

#checkout-cart .col-sm-4 .table {
    border-collapse: collapse;
    border-spacing: 0;
}

#checkout-cart .col-sm-4 .table tr,
#checkout-cart .col-sm-4 .table td {
    border: 0;
}

#checkout-cart .col-sm-4 .table td {
    padding: 12px 16px;
    border-bottom: 1px solid rgba(156, 19, 95, 0.12);
    color: #333;
    font-size: 16px;
}

#checkout-cart .col-sm-4 .table tr:last-child td {
    border-bottom: 0;
    color: var(--fg-color-green);
    font-size: 19px;
    font-weight: 700;
}

#checkout-cart .buttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 26px 0 34px;
}

#checkout-cart .buttons::before,
#checkout-cart .buttons::after {
    display: none;
}

#checkout-cart .buttons .pull-left,
#checkout-cart .buttons .pull-right {
    float: none !important;
}

#checkout-cart .buttons .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    border-radius: 999px;
    box-shadow: none;
}

#checkout-cart .buttons .btn-default {
    border-color: rgba(156, 19, 95, 0.38);
    background: #fff;
    color: var(--fg-color-green);
}

#checkout-cart .buttons .btn-primary {
    border-color: var(--fg-color-lightgreen);
    background: var(--fg-color-lightgreen);
    color: #fff;
}

#checkout-cart .buttons .btn-primary:hover,
#checkout-cart .buttons .btn-primary:focus {
    border-color: var(--fg-color-green);
    background: var(--fg-color-green);
}

.simple-content {
    margin: 0;
}

.simplecheckout {
    color: #333;
}

.simplecheckout-left-column,
.simplecheckout-right-column,
.simplecheckout-three-column {
    min-width: 0;
}

.simplecheckout-block {
    overflow: hidden;
    margin-bottom: 22px;
    border: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(74, 10, 45, 0.07);
}

.simplecheckout-block:not(#simplecheckout_cart) {
    background: #FDF9FB;
}

.simple-content .checkout-heading,
.simple-content .simplecheckout-block .panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 52px;
    padding: 14px 18px;
    border: 0;
    border-bottom: 1px solid rgba(156, 19, 95, 0.14);
    border-radius: 0;
    background: #F9EFF5;
    color: var(--fg-color-green);
    font-size: 18px;
    font-weight: 700;
}

.simple-content .checkout-heading h4,
.simplecheckout .simplecheckout-vertical-menu .checkout-heading h4 {
    margin: 0;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
}

.simplecheckout-block-content {
    padding: 18px;
}

.simplecheckout .form-horizontal .form-group {
    margin-right: 0;
    margin-left: 0;
}

.simplecheckout .form-horizontal .control-label,
.simplecheckout label,
.simpleregister label {
    margin-bottom: 7px;
    color: #4A4A4A;
    font-size: 14px;
    font-weight: 500;
}

.simplecheckout .form-control,
.simple-content input[type=text],
.simple-content input[type=password],
.simple-content input[type=email],
.simple-content input[type=tel],
.simple-content input[type=phone],
.simple-content input[type=date],
.simple-content input[type=time],
.simple-content select,
.simple-content textarea {
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid #EDD8E4;
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
    color: #333;
    font-size: 15px;
}

.simplecheckout .form-control:focus,
.simple-content input:focus,
.simple-content select:focus,
.simple-content textarea:focus {
    border-color: var(--fg-color-lightgreen);
    outline: none;
    box-shadow: 0 0 0 3px rgba(156, 19, 95, 0.12);
}

.simplecheckout .radio,
.simplecheckout .checkbox {
    margin: 8px 0;
}

.simplecheckout .radio label,
.simplecheckout .checkbox label {
    display: inline-flex !important;
    align-items: flex-start;
    gap: 8px;
    color: #333;
    line-height: 1.4;
}

#simplecheckout_cart {
    background: #fff;
}

#simplecheckout_cart .checkout-heading-button a {
    color: #b84b38;
    font-size: 13px;
    font-weight: 700;
}

.smp-cart {
    margin: 0;
    padding: 18px;
}

.smp-cart__product-item {
    align-items: center;
    gap: 18px;
    margin-bottom: 12px;
    padding: 14px;
    border: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 10px;
    background: #FDF9FB;
    box-shadow: none;
}

.smp-cart__product-item:last-child {
    margin-bottom: 0;
}

.smp-cart__product-item:nth-child(even) {
    background: #FDF9FB;
}

.smp-cart__left {
    align-items: center;
    min-width: 0;
}

.smp-cart__left .smp-cart__image {
    flex: 0 0 82px;
    width: 82px;
    height: 82px;
    margin-right: 14px;
    overflow: hidden;
    border-radius: 8px;
    background: #fff;
}

.smp-cart__left .smp-cart__image a,
.smp-cart__left .smp-cart__image img {
    display: block;
    width: 100%;
    height: 100%;
}

.smp-cart__left .smp-cart__image img {
    object-fit: cover;
    object-position: center;
}

.smp-cart__left .smp-cart__name .smp-cart__name-link {
    color: var(--fg-color-green);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}

.smp-cart__left .smp-cart__name .options {
    margin-top: 6px;
    color: #666666;
    font-size: 13px;
    line-height: 1.45;
}

.smp-cart__right {
    gap: 16px;
}

.smp-cart__right .quantity {
    flex: 0 0 auto;
    margin: 0;
}

.smp-cart__right .quantity > .quantity {
    display: inline-flex;
    align-items: center;
}

.smp-cart__right .simple-btn__update-quantity {
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid var(--fg-color-lightgreen);
    border-radius: 0;
    background: #F9EFF5;
    color: var(--fg-color-green);
    box-shadow: none;
}

.smp-cart__right .simple-btn__update-quantity:first-child {
    border-radius: 19px 0 0 19px;
}

.smp-cart__right .simple-btn__update-quantity + input + .simple-btn__update-quantity {
    border-radius: 0 19px 19px 0;
}

.smp-cart__right input.simple-input__quantity {
    width: 48px;
    height: 38px;
    min-height: 38px;
    padding: 0 6px;
    border: 1px solid var(--fg-color-lightgreen);
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    background: #fff;
    font-size: 15px;
    text-align: center;
}

.smp-cart__right .simple-btn__remove-product {
    position: static;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    margin-left: 10px;
    border-radius: 50%;
    background: #f7e9e5;
    color: #b84b38;
    box-shadow: none;
}

.smp-cart__right .simple-btn__remove-product:hover,
.smp-cart__right .simple-btn__remove-product:focus {
    background: #b84b38;
    color: #fff;
}

.smp-cart__right .prices {
    gap: 16px;
    min-width: 180px;
}

.smp-cart__right .price {
    margin-right: 0;
    color: #666666;
    font-size: 14px;
    white-space: nowrap;
}

.smp-cart__right .prices .total {
    color: var(--fg-color-green);
    font-size: 17px;
    font-weight: 700;
    white-space: nowrap;
}

#simplecheckout_cart .simplecheckout-cart-total {
    margin: 0 18px;
    padding: 12px 0;
    border: 0;
    border-top: 1px solid rgba(156, 19, 95, 0.12);
    background: transparent;
    color: #333;
}

#simplecheckout_cart .simplecheckout-cart-total .sct-group,
#simplecheckout_cart .simplecheckout-cart-total > span {
    color: #333;
}

#simplecheckout_cart .simplecheckout-cart-total-value {
    min-width: 92px;
    margin: 0;
    color: var(--fg-color-green);
    font-size: 16px;
    font-weight: 700;
    text-align: right;
}

#simplecheckout_cart .simplecheckout-cart-total#total_total {
    margin: 8px 0 0;
    padding: 16px 24px;
    border-top: 1px solid rgba(156, 19, 95, 0.18);
    background: #F9EFF5;
}

#simplecheckout_cart .simplecheckout-cart-total#total_total .simplecheckout-cart-total-value {
    font-size: 22px;
}

.simplecheckout-button-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 18px 0 34px;
    padding: 20px 0 0;
    border-top: 1px solid rgba(156, 19, 95, 0.18);
    background: transparent;
}

.simplecheckout-button-right,
.simplecheckout-button-left {
    float: none;
}

.simplecheckout-button-block #agreement_checkbox {
    margin-top: 0;
    margin-right: 24px;
}

.simplecheckout-button-block .btn-primary,
.simplecheckout-button-block .btn-primary:active,
.simplecheckout-button-block .btn-primary:visited,
.simplecheckout-button-block .btn-primary:hover,
.simplecheckout-button-block .btn-primary:focus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 12px 34px;
    border: 1px solid var(--fg-color-lightgreen);
    border-radius: 999px;
    background: var(--fg-color-lightgreen);
    color: #fff;
    box-shadow: none;
    font-size: 15px;
    font-weight: 700;
}

.simplecheckout-button-block .btn-primary:hover,
.simplecheckout-button-block .btn-primary:focus {
    border-color: var(--fg-color-green);
    background: var(--fg-color-green);
}

.simplecheckout-error-text,
.simplecheckout-warning-text {
    color: #b84b38;
}

.simplecheckout-warning-block {
    border-color: rgba(184, 75, 56, 0.22);
    border-radius: 8px;
    background: #fff4f1;
}

@media (max-width: 991.98px) {
    #checkout-cart .table-responsive {
        overflow-x: auto;
    }

    .smp-cart__product-item {
        align-items: flex-start;
    }

    .smp-cart__right {
        width: 100%;
        margin-top: 16px;
    }
}

@media (max-width: 767.98px) {
    #checkout-cart #content > h1 {
        font-size: 28px;
    }

    #checkout-cart .table {
        min-width: 760px;
    }

    #checkout-cart .buttons,
    .simplecheckout-button-block {
        flex-direction: column;
        align-items: stretch;
    }

    #checkout-cart .buttons .btn,
    .simplecheckout-button-block .btn-primary {
        width: 100%;
    }

    #checkout-cart #accordion .panel-body .control-label {
        white-space: normal;
    }

    #checkout-cart #accordion .panel-body .input-group {
        flex-direction: column;
    }

    #checkout-cart #accordion .panel-body .input-group .form-control {
        border-right: 1px solid #EDD8E4;
        border-radius: 8px 8px 0 0;
    }

    #checkout-cart #accordion .panel-body #button-coupon,
    #checkout-cart #accordion .panel-body #button-voucher {
        width: 100%;
        border-radius: 0 0 8px 8px;
    }

    .smp-cart {
        padding: 14px;
    }

    .smp-cart__left {
        width: 100%;
    }

    .smp-cart__right {
        flex-wrap: wrap;
        gap: 12px;
    }

    .smp-cart__right .prices {
        min-width: 0;
    }
}

@media (max-width: 539.98px) {
    .smp-cart__left .smp-cart__image {
        flex-basis: 70px;
        width: 70px;
        height: 70px;
    }

    .smp-cart__right .prices {
        justify-content: space-between;
        width: 100%;
    }

    .smp-cart__right .prices .price {
        display: block;
    }
}

/* ---------------------------------------------------------------------------
   48. Success page and legacy link color cleanup
   --------------------------------------------------------------------------- */
body a,
.btn-link {
    color: var(--fg-color-lightgreen);
}

body a:hover,
body a:focus,
.btn-link:hover,
.btn-link:focus {
    color: var(--fg-color-green);
}

.dropdown-menu li > a:hover,
.dropdown-menu li > a:focus {
    background: var(--fg-color-lightgreen);
    color: #fff;
}

#common-success #content > h1 {
    margin: 10px 0 22px;
    color: var(--fg-color-green);
    font-size: 34px;
    font-weight: 700;
    line-height: 1.25;
}

#common-success #content > p {
    color: #333;
    font-size: 17px;
    line-height: 1.55;
}

.success-order-number {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 18px;
    padding: 12px 18px;
    border: 1px solid rgba(156, 19, 95, 0.18);
    border-radius: 10px;
    background: #FDF9FB;
    color: #4A4A4A;
    font-size: 17px;
    line-height: 1.3;
}

.success-order-number strong {
    color: var(--fg-color-green);
    font-size: 20px;
}

#common-success .payment-instruction {
    padding: 18px;
    border: 1px solid rgba(156, 19, 95, 0.18);
    border-radius: 10px;
    background: #FDF9FB;
}

/* ---------------------------------------------------------------------------
   49. Product page options and details
   --------------------------------------------------------------------------- */
.product__options {
    overflow: hidden;
    margin-top: 18px;
    border: 1px solid rgba(156, 19, 95, 0.18);
    border-radius: 12px;
    background: #FDF9FB;
    box-shadow: 0 10px 28px rgba(74, 10, 45, 0.06);
}

.product__title {
    font-size: 28px;
    line-height: 1.25;
}

.product__options-item {
    border-bottom: 1px solid rgba(156, 19, 95, 0.16);
}

.product__options-item:last-child {
    border-bottom: 0;
}

.product .prod-option__container {
    gap: 18px;
    padding: 16px 18px;
}

.product .prod-option__name {
    flex: 1 1 auto;
    min-width: 0;
    margin-right: 0;
    color: #222;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.3;
    text-align: left;
}

.product .prod-option__stock {
    margin-top: 7px;
    color: #767676;
    font-size: 13px;
    font-weight: 400;
}

.product .prod-option__price {
    flex: 0 0 auto;
    min-width: 110px;
    margin-right: 0;
    color: var(--fg-color-green);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
    text-align: right;
    white-space: nowrap;
    word-break: normal;
}

.product .prod-option__actions {
    flex: 0 0 auto;
    justify-content: flex-end;
    gap: 0;
    white-space: nowrap;
}

.product .prod-option_btn,
.product .prod-no-options_btn {
    width: 42px;
    min-width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid var(--fg-color-green);
    background: #FDF9FB;
    color: #111;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    box-shadow: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.product .prod-option_dec,
.product .prod-no-option_dec {
    border-radius: 21px 0 0 21px;
}

.product .prod-option_inc,
.product .prod-no-option_inc {
    border-radius: 0 21px 21px 0;
}

.product .prod-option_btn:hover,
.product .prod-option_btn:focus,
.product .prod-no-options_btn:hover,
.product .prod-no-options_btn:focus {
    background: #F9EFF5;
    color: var(--fg-color-green);
    outline: none;
}

.product .prod-option__actions input[type="number"],
.product .button-cart-block input[type="number"] {
    width: 54px;
    height: 42px;
    padding: 0 8px;
    border: 1px solid var(--fg-color-green);
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    background: #fff;
    color: #111;
    font-size: 18px;
    line-height: 42px;
    text-align: center;
}

.product .prod-option__actions input[type="number"]:focus,
.product .button-cart-block input[type="number"]:focus {
    background: #fff;
    outline: none;
    box-shadow: inset 0 0 0 1px rgba(156, 19, 95, 0.14);
}

.product .prod-option_add-to-cart,
.product .prod-option_add-to-cart-cb {
    width: 48px;
    min-width: 48px;
    height: 48px;
    margin-left: 10px;
    border: 0;
    border-radius: 50%;
    background: var(--fg-color-green);
    color: #fff;
}

.product .prod-option_add-to-cart:hover,
.product .prod-option_add-to-cart:focus,
.product .prod-option_add-to-cart-cb:hover,
.product .prod-option_add-to-cart-cb:focus {
    background: var(--fg-color-darkgreen);
    color: #fff;
}

.product .prod-option_add-to-cart svg,
.product .prod-option_add-to-cart-cb svg {
    width: 24px;
    height: 20px;
    fill: currentColor;
}

.product .button-cart-block__actions {
    display: flex;
    align-items: center;
    gap: 0;
}

.product .button-cart-block .add-to-cart-no-options {
    min-height: 48px;
    margin-left: 12px;
    padding: 0 28px;
    border-radius: 24px;
}

.product-info_right {
    margin-top: 22px;
}

.product-info_right .dropdown-item {
    overflow: hidden;
    margin-bottom: 10px;
    border: 1px solid rgba(156, 19, 95, 0.18);
    border-radius: 10px;
    background: #fff;
}

.product-info_right .dropdown-item:last-child {
    border-bottom: 1px solid rgba(156, 19, 95, 0.18);
}

.product-info_right .dropdown-item__title {
    padding: 14px 16px;
    background: #FDF9FB;
    color: var(--fg-color-green);
    font-size: 16px;
    line-height: 1.35;
}

.product-info_right .dropdown-item__title svg {
    flex: 0 0 14px;
    width: 14px;
    height: 14px;
    margin-right: 0;
}

.product-info_right .dropdown-item__content {
    padding: 16px;
}

.product-info_right .product-attr__group {
    padding-bottom: 0;
    font-size: 15px;
    line-height: 1.45;
}

.product-info_right .product-attr__item {
    display: flex;
    gap: 8px;
    padding: 7px 0;
    border-bottom: 1px solid rgba(156, 19, 95, 0.12);
}

.product-info_right .product-attr__item:last-child {
    border-bottom: 0;
}

.product-info_right .product-attr__name {
    color: #333;
}

.product-info_right .product-attr__text {
    color: #4A4A4A;
}

#form-review #review {
    margin-bottom: 22px;
}

.product-info_right #review > p {
    margin: 0;
    color: #4A4A4A;
}

.product-info_right .product-reviews__item {
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(156, 19, 95, 0.14);
}

.product-info_right .product-reviews__author {
    color: var(--fg-color-green);
    font-size: 15px;
}

.product-info_right .product-reviews__text {
    padding: 8px 0;
    color: #333;
    line-height: 1.45;
}

.product-info_right #review .row {
    margin-right: 0;
    margin-left: 0;
}

.product-info_right #review .row > [class*="col-"] {
    float: none;
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    text-align: left;
}

#form-review .product-review-form {
    padding-top: 4px;
}

#form-review .product-review-form h3 {
    margin: 0 0 16px;
    color: var(--fg-color-green);
    font-size: 20px;
    font-weight: 700;
}

#form-review .control-label {
    margin-bottom: 7px;
    color: #333;
    font-size: 14px;
    font-weight: 600;
}

#form-review .form-control {
    border: 1px solid rgba(156, 19, 95, 0.28);
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
    color: #222;
    font-size: 15px;
}

#form-review #input-name {
    max-width: 100%;
}

#form-review .form-control:focus {
    border-color: var(--fg-color-lightgreen);
    box-shadow: 0 0 0 3px rgba(156, 19, 95, 0.12);
}

#form-review .help-block {
    margin-top: 8px;
    color: #7D7D7D;
    font-size: 12px;
    line-height: 1.4;
}

#form-review .form-group-rating {
    margin: 16px 0;
}

#form-review .custom-rating-input {
    gap: 6px;
    margin-top: 8px;
}

#form-review .custom-rating-input .rating-input-block label {
    width: 34px;
    height: 34px;
    margin-right: 0;
    border: 1px solid rgba(156, 19, 95, 0.36);
    border-radius: 50%;
    outline: 0;
    background: #FDF9FB;
    color: var(--fg-color-green);
    font-size: 14px;
    line-height: 1;
}

#form-review .custom-rating-input .rating-input-block:hover label,
#form-review .custom-rating-input .rating-input-block input[type="radio"]:checked + label,
#form-review .custom-rating-input label.rating-input-active {
    background: var(--fg-color-green);
    color: #fff;
}

#form-review .buttons {
    margin-top: 18px;
}

#form-review .buttons .pull-right {
    float: none !important;
}

#button-review {
    min-height: 46px;
    padding: 0 26px;
    border-radius: 23px;
    font-size: 15px;
}

.product-info_right .alert {
    margin: 14px 0 0;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 14px;
}

@media (max-width: 1199.98px) {
    .product .prod-option__container {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .product .prod-option__name {
        flex: 1 1 calc(100% - 130px);
    }

    .product .prod-option__price {
        flex: 0 0 110px;
    }

    .product .prod-option__actions {
        flex: 1 1 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 767.98px) {
    .product-info_description {
        margin-top: 28px;
    }

    .product-info_right {
        margin-top: 18px;
    }
}

@media (max-width: 479.98px) {
    .product .prod-option__container {
        padding: 14px;
    }

    .product .prod-option__name,
    .product .prod-option__price,
    .product .prod-option__actions {
        flex: 1 1 100%;
        min-width: 0;
        text-align: left;
    }

    .product .button-cart-block__actions {
        flex-wrap: wrap;
    }

    .product .button-cart-block .add-to-cart-no-options {
        width: 100%;
        margin: 12px 0 0;
    }

    #button-review {
        width: 100%;
    }
}

/* ---------------------------------------------------------------------------
   50. Product related slider: match Latest
   --------------------------------------------------------------------------- */
.related-products_product {
    margin-top: 70px;
    position: relative;
}

.related-products_product > h2 {
    margin: 70px 0 30px;
    color: var(--fg-color-green);
    font-size: 26px;
    font-weight: 700;
    line-height: 1.25;
}

.related-products_product .related-products__slider {
    overflow: hidden;
    padding: 10px 4px 12px;
}

.related-products_product .related-slider-btn-next,
.related-products_product .related-slider-btn-prev {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 82px;
    height: 40px;
    min-width: 82px;
    min-height: 0;
    left: auto;
    top: 15px;
    background: transparent;
    border: 0;
    box-shadow: none;
    color: var(--orchard-green);
    fill: var(--orchard-green);
    transform: none;
    transition: opacity 0.2s ease;
}

.related-products_product .related-slider-btn-next:hover,
.related-products_product .related-slider-btn-prev:hover,
.related-products_product .related-slider-btn-next:focus,
.related-products_product .related-slider-btn-prev:focus {
    background: transparent;
    opacity: 0.72;
    transform: none;
}

.related-products_product .related-slider-btn-next {
    right: 0;
}

.related-products_product .related-slider-btn-prev {
    right: 150px;
}

.related-products.related-products_product .swiper-arrow.related-slider-btn-next {
    right: 0;
}

.related-products.related-products_product .swiper-arrow.related-slider-btn-prev {
    right: 150px;
}

.related-products_product .related-slider-btn-next svg,
.related-products_product .related-slider-btn-prev svg {
    display: block;
    width: 82px;
    max-width: none;
    height: 9px;
    max-height: none;
}

.related-products_product .related-slider-btn-next svg path,
.related-products_product .related-slider-btn-prev svg path {
    fill: currentColor;
}

.related-products_product .related-products__item {
    display: flex;
    flex-direction: column;
    height: auto;
}

.related-products_product .product-thumb {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
    padding: 14px;
    border: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 10px;
    background: #FDF9FB;
    box-shadow: 0 8px 24px rgba(74, 10, 45, 0.08);
    box-sizing: border-box;
    overflow: hidden;
}

.related-products_product .product-thumb .image {
    width: 100%;
    height: 300px;
    max-width: none;
    margin-bottom: 14px;
    overflow: hidden;
    border-radius: 8px;
    background: transparent;
}

.related-products_product .product-thumb .image a {
    display: block;
    width: 100%;
    height: 100%;
}

.related-products_product .product-thumb .image a img,
.related-products_product .product-thumb .image img {
    display: block;
    width: 100%;
    max-width: none;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
    object-position: center;
}

.related-products_product .product-thumb .caption {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: center;
    min-height: 0;
    height: auto;
    margin: 0 0 12px;
    padding: 0;
    border-top: 0;
    text-align: center;
}

.related-products_product .product-thumb .caption h4 {
    margin: 0 0 10px;
    padding: 0;
}

.related-products_product .product-thumb .caption h4 a {
    color: var(--fg-color-green);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
}

.related-products_product .related-products__description {
    margin: 0 0 12px;
    color: #111;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.35;
    text-align: center;
}

.related-products_product .related-products__price {
    margin: auto 0 14px;
    color: #111;
    font-size: 18px;
    line-height: 1.35;
    text-align: center;
}

.related-products_product .related-products__price-inner {
    color: var(--fg-color-green);
    font-weight: 700;
}

.related-products_product .product-buttons {
    width: 100%;
    margin-top: auto;
}

.related-products_product .related-products__buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: auto;
}

.related-products_product .related-products__buttons .product-add-to-fav,
.related-products_product .related-products__buttons .related-products__watch-product {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin: 0;
    border: 1px solid rgba(156, 19, 95, 0.24);
    border-radius: 50%;
    background: #F9EFF5;
    color: var(--fg-color-green);
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.related-products_product .related-products__buttons .related-products__watch-product {
    transform: rotate(-90deg);
}

.related-products_product .related-products__buttons .product-add-to-fav:hover,
.related-products_product .related-products__buttons .product-add-to-fav:focus,
.related-products_product .related-products__buttons .product-add-to-fav.product-add-to-fav_added,
.related-products_product .related-products__buttons .related-products__watch-product:hover,
.related-products_product .related-products__buttons .related-products__watch-product:focus {
    border-color: var(--fg-color-green);
    background: var(--fg-color-green);
    color: #fff;
}

.related-products_product .related-products__buttons .product-add-to-fav svg {
    width: 24px;
    height: 24px;
}

.related-products_product .related-products__buttons .product-add-to-fav svg path {
    stroke: currentColor;
}

.related-products_product .related-products__buttons .product-add-to-fav:hover svg,
.related-products_product .related-products__buttons .product-add-to-fav.product-add-to-fav_added svg {
    fill: currentColor;
}

.related-products_product .related-products__buttons .related-products__watch-product svg {
    width: 18px;
    height: 24px;
}

.related-products_product .related-slider-pagination {
    display: none;
}

.related-products_product .related-slider-pagination .swiper-pagination-bullet-active {
    background: var(--fg-color-green);
}

@media (max-width: 767.98px) {
    .related-products_product .related-slider-btn-next,
    .related-products_product .related-slider-btn-prev {
        display: flex;
        top: 20px;
        transform: scale(0.72);
        transform-origin: center;
    }

    .related-products_product .related-slider-btn-next:hover,
    .related-products_product .related-slider-btn-prev:hover,
    .related-products_product .related-slider-btn-next:focus,
    .related-products_product .related-slider-btn-prev:focus {
        transform: scale(0.72);
    }

    .related-products_product .related-slider-btn-next {
        right: 0;
    }

    .related-products_product .related-slider-btn-prev {
        right: 104px;
    }

    .related-products.related-products_product .swiper-arrow.related-slider-btn-next {
        right: 0;
    }

    .related-products.related-products_product .swiper-arrow.related-slider-btn-prev {
        right: 104px;
    }

    .related-products_product .product-thumb .image {
        height: 260px;
    }
}

/* ---------------------------------------------------------------------------
   51. Contacts page refresh
   --------------------------------------------------------------------------- */
#information-contact #content > h1 {
    margin: 10px 0 28px;
    color: var(--fg-color-green);
    font-size: 34px;
    font-weight: 700;
    line-height: 1.25;
}

#information-contact .message-sent-notification {
    margin: 0 0 22px;
    padding: 14px 18px;
    border: 1px solid rgba(156, 19, 95, 0.22);
    border-radius: 10px;
    background: #FDF9FB;
    color: #4A0A2D;
    font-size: 16px;
    line-height: 1.45;
}

#information-contact .contacts-page_modern {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(420px, 1.25fr);
    gap: 24px;
    align-items: stretch;
    margin-bottom: 36px;
}

#information-contact .contacts-page_no-map {
    grid-template-columns: 1fr;
}

#information-contact .contacts-page__info,
#information-contact .contacts-page__map {
    border: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 12px;
    background: #FDF9FB;
    box-shadow: 0 10px 28px rgba(74, 10, 45, 0.07);
    box-sizing: border-box;
}

#information-contact .contacts-page__info {
    display: flex;
    flex: none;
    flex-direction: column;
    padding: 24px;
}

#information-contact .contacts-page__info .info-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 0 0 22px;
}

#information-contact .contacts-page__image {
    flex: 0 0 78px;
    width: 78px;
    height: 78px;
    margin: 0;
    overflow: hidden;
    border-radius: 10px;
    background: #fff;
}

#information-contact .contacts-page__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

#information-contact .contacts-page__eyebrow {
    margin-bottom: 5px;
    color: #7D7D7D;
    font-size: 13px;
    line-height: 1.3;
}

#information-contact .contacts-page__store-name {
    color: var(--fg-color-green);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
}

#information-contact .contacts-page__cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

#information-contact .contacts-page__info .info-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
    margin: 0;
    padding: 14px;
    border: 1px solid rgba(156, 19, 95, 0.14);
    border-radius: 10px;
    background: #fff;
    color: #333;
    line-height: 1.45;
}

#information-contact .contacts-page__info .info-item_wide {
    grid-column: 1 / -1;
}

#information-contact .contacts-page__info .info-item__icon {
    display: flex;
    flex: 0 0 38px;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #F9EFF5;
    color: var(--fg-color-green);
}

#information-contact .contacts-page__info .info-item__icon svg {
    flex: 0 0 auto;
    margin: 0;
}

#information-contact .contacts-page__info .info-item__content {
    display: block;
    min-width: 0;
}

#information-contact .contacts-page__info .info-item__label {
    display: block;
    margin-bottom: 4px;
    color: #7D7D7D;
    font-size: 13px;
    line-height: 1.3;
}

#information-contact .contacts-page__info .info-item a,
#information-contact .contacts-page__info .info-item__content > span:not(.info-item__label) {
    color: #222;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
}

#information-contact .contacts-page__info .info-item a:hover,
#information-contact .contacts-page__info .info-item a:focus {
    color: var(--fg-color-green);
}

#information-contact .contacts-page__info .info-comment {
    margin: 18px 0 0;
    padding: 14px 16px;
    border-left: 3px solid var(--fg-color-lightgreen);
    border-radius: 8px;
    background: #fff;
    color: #4A4A4A;
    font-size: 15px;
    line-height: 1.5;
}

#information-contact .contacts-page__map {
    flex: none;
    min-height: 420px;
    overflow: hidden;
    padding: 0;
}

#information-contact .contacts-page__map iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 420px;
    border: 0;
    border-radius: 12px;
}

#information-contact .contacts-form {
    margin: 0 0 20px;
    border: 1px solid rgba(156, 19, 95, 0.16);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(74, 10, 45, 0.07);
}

#information-contact .contacts-form .vaved-container {
    padding: 28px;
}

#information-contact .contacts-form__header {
    margin: 0 0 22px;
    color: var(--fg-color-green);
    font-size: 26px;
    font-weight: 700;
    line-height: 1.25;
}

#information-contact .contacts-form form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

#information-contact .contacts-form .form-horizontal .form-group {
    margin: 0;
}

#information-contact .contacts-form .form-group_message,
#information-contact .contacts-form form .buttons,
#information-contact .contacts-form form > .form-group:not(.form-group_name):not(.form-group_email):not(.form-group_message) {
    grid-column: 1 / -1;
}

#information-contact .contacts-form .control-label {
    display: block;
    margin: 0 0 7px;
    color: #333;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    text-align: left;
}

#information-contact .contacts-form .contacts-form__input-container input,
#information-contact .contacts-form .contacts-form__input-container textarea {
    width: 100%;
    height: auto;
    padding: 13px 16px;
    border: 1px solid rgba(156, 19, 95, 0.28);
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
    color: #222;
    font-size: 15px;
    line-height: 1.4;
}

#information-contact .contacts-form .contacts-form__input-container textarea {
    min-height: 150px;
    min-width: 100%;
    max-width: 100%;
    resize: vertical;
}

#information-contact .contacts-form .contacts-form__input-container input:focus,
#information-contact .contacts-form .contacts-form__input-container textarea:focus {
    border-color: var(--fg-color-lightgreen);
    outline: none;
    box-shadow: 0 0 0 3px rgba(156, 19, 95, 0.12);
}

#information-contact .contacts-form .contacts-form__input-container .text-danger {
    margin-top: 7px;
    color: #b50800;
    font-size: 13px;
    line-height: 1.35;
}

#information-contact .contacts-form form .buttons {
    margin: 4px 0 0;
}

#information-contact .contacts-form form .buttons .pull-right {
    float: none !important;
}

#information-contact .contacts-form input[type="submit"].bttn {
    min-height: 48px;
    padding: 0 30px;
    border: 0;
    border-radius: 24px;
    font-size: 15px;
}

@media (max-width: 991.98px) {
    #information-contact .contacts-page_modern {
        grid-template-columns: 1fr;
    }

    #information-contact .contacts-page__map,
    #information-contact .contacts-page__map iframe {
        min-height: 340px;
    }
}

@media (max-width: 767.98px) {
    #information-contact #content > h1 {
        margin: 6px 0 22px;
        font-size: 28px;
    }

    #information-contact .contacts-page__info,
    #information-contact .contacts-form .vaved-container {
        padding: 18px;
    }

    #information-contact .contacts-page__cards,
    #information-contact .contacts-form form {
        grid-template-columns: 1fr;
    }

    #information-contact .contacts-page__store-name {
        font-size: 21px;
    }

    #information-contact .contacts-form {
        margin-right: 0;
        margin-left: 0;
    }

    #information-contact .contacts-form__header {
        font-size: 22px;
    }

    #information-contact .contacts-form input[type="submit"].bttn {
        width: 100%;
    }
}

/* ---------------------------------------------------------------------------
   52. Scroll-to-top progress button
--------------------------------------------------------------------------- */

.scroll-top-progress {
    --scroll-progress: 0deg;
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: var(--fg-color-green);
    background:
        conic-gradient(var(--fg-color-green) var(--scroll-progress), rgba(156, 19, 95, 0.18) 0deg);
    box-shadow: 0 14px 34px rgba(74, 10, 45, 0.18);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(12px);
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.scroll-top-progress::before {
    content: "";
    position: absolute;
    inset: 5px;
    border-radius: 50%;
    background: #fff;
}

.scroll-top-progress svg {
    position: relative;
    z-index: 1;
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.scroll-top-progress.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.scroll-top-progress:hover,
.scroll-top-progress:focus {
    color: #fff;
    background:
        conic-gradient(var(--fg-color-green) var(--scroll-progress), rgba(156, 19, 95, 0.25) 0deg);
    box-shadow: 0 16px 38px rgba(74, 10, 45, 0.24);
    outline: none;
}

.scroll-top-progress:hover::before,
.scroll-top-progress:focus::before {
    background: var(--fg-color-green);
}

@media (max-width: 767.98px) {
    .scroll-top-progress {
        right: 16px;
        bottom: 88px;
        width: 46px;
        height: 46px;
    }

    .scroll-top-progress::before {
        inset: 4px;
    }

    .scroll-top-progress svg {
        width: 21px;
        height: 21px;
    }
}

/* ---------------------------------------------------------------------------
   53. Mobile header reset
--------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
    .header {
        position: relative;
        z-index: 12000;
        background: #fff;
        padding: 10px 0 12px;
    }

    .header > .container {
        padding-right: 16px;
        padding-left: 16px;
    }

    .header__wrapper {
        display: grid !important;
        grid-template-columns: 108px minmax(0, 1fr) auto;
        grid-template-areas:
            "logo search actions"
            "nav nav nav";
        align-items: center;
        gap: 10px 12px;
        width: 100%;
        min-width: 0;
    }

    .header__wrapper > .logo {
        grid-area: logo;
        display: flex;
        align-items: center;
        width: 108px;
        margin: 0;
    }

    .header__wrapper .logo img {
        width: 108px;
        height: auto;
        max-width: 108px;
        max-height: 82px;
        object-fit: contain;
    }

    .header__wrapper > .main-menu,
    .header__wrapper > .menu,
    .header__wrapper > #supermenu {
        grid-area: nav;
        width: 100%;
        min-width: 0;
        margin: 0;
    }

    .header__wrapper .phone,
    .header__wrapper .lang-block,
    .header__wrapper > .burger {
        display: none !important;
    }

    .header__wrapper .search {
        grid-area: search;
        justify-self: end;
        width: 40px;
        height: 40px;
        margin: 0;
    }

    .header__wrapper .search__toggle,
    .header__wrapper .search__toggle picture {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
    }

    .header__wrapper .search__toggle img {
        width: 34px;
        height: 34px;
        object-fit: contain;
    }

    .header__wrapper .header__oc {
        grid-area: actions;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 10px;
        min-width: 0;
        margin: 0;
    }

    .header__wrapper .header__oc #favorites,
    .header__wrapper .header__oc #cart {
        width: auto;
        min-width: 0;
    }

    .header__wrapper .header__oc #cart > button,
    .header__wrapper .header__oc .favorites-toggle,
    .header__wrapper .header__oc .modal-wishlist-toggle {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        min-width: 40px;
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
        color: #555;
    }

    .header__wrapper .header__oc .icon-label {
        display: none !important;
    }

    .header__wrapper .header__oc .custom-icon,
    .header__wrapper .header__oc #cart > button svg.custom-icon,
    .header__wrapper .header__oc .favorites-toggle svg.custom-icon {
        width: 34px !important;
        height: 34px !important;
        max-width: 34px;
        max-height: 34px;
        margin: 0 !important;
        fill: currentColor;
    }

    .header__wrapper .header__oc #cart-total {
        position: absolute;
        top: 1px;
        right: -2px;
        min-width: 18px;
        height: 18px;
        margin: 0;
        padding: 0 5px;
        border-radius: 9px;
        font-size: 11px;
        line-height: 18px;
        z-index: 2;
    }

    .header__wrapper #supermenu.respsmall {
        width: 100%;
        margin: 0;
        padding: 0;
        background: transparent;
        position: relative;
    }

    .header__wrapper #supermenu.respsmall a.mobile-trigger {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        min-height: 48px;
        padding: 0 16px;
        border: 1px solid rgba(156, 19, 95, 0.2);
        border-radius: 10px;
        background: var(--fg-color-green);
        color: #fff !important;
        font-size: 18px;
        font-weight: 500;
        line-height: 1.2;
        text-decoration: none;
        box-shadow: 0 7px 18px rgba(94, 11, 57, 0.16);
    }

    .header__wrapper #supermenu.respsmall a.mobile-trigger .mt-bars {
        display: flex;
        flex-direction: column;
        gap: 4px;
        flex: 0 0 24px;
        width: 24px;
        float: none;
        margin: 0 0 0 12px;
    }

    .header__wrapper #supermenu.respsmall a.mobile-trigger .mt-bars span {
        display: block;
        width: 24px;
        height: 2px;
        margin: 0;
        border-radius: 2px;
        background: #fff;
    }

    .header__wrapper #supermenu.respsmall > ul {
        position: absolute;
        top: calc(100% + 8px);
        left: 50%;
        width: calc(100vw - 32px);
        max-width: 540px;
        height: auto;
        max-height: 0;
        overflow: hidden;
        visibility: hidden;
        padding: 0;
        border: 1px solid rgba(156, 19, 95, 0.18);
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 14px 34px rgba(74, 10, 45, 0.16);
        z-index: 12020;
        transform: translateX(-50%);
        transition: max-height 0.24s ease, padding 0.24s ease;
    }

    .header__wrapper #supermenu.respsmall > ul.exped {
        visibility: visible;
        max-height: calc(100vh - 160px);
        padding: 8px;
        overflow-y: auto;
    }

    .header__wrapper #supermenu.respsmall ul li.tlli,
    .header__wrapper #supermenu.respsmall ul li.tlli.sep {
        display: block;
        width: 100%;
        padding: 0;
        border: 0;
        background: transparent;
    }

    .header__wrapper #supermenu.respsmall ul li.tlli.sep {
        height: 1px;
        margin: 4px 0;
        background: rgba(156, 19, 95, 0.12);
        overflow: hidden;
    }

    .header__wrapper #supermenu.respsmall ul li.tlli.mobile-contact {
        display: block;
        margin-top: 6px;
        padding-top: 8px;
        /*border-top: 1px solid rgba(156, 19, 95, 0.14);*/
    }

    .header__wrapper #supermenu.respsmall ul li a.tll {
        display: block;
        min-height: 44px;
        padding: 12px 52px 12px 14px;
        border: 0;
        border-radius: 8px;
        background: transparent;
        color: #333 !important;
        font-size: 16px;
        font-weight: 500;
        line-height: 1.25;
        text-transform: none;
    }

    .header__wrapper #supermenu.respsmall ul li.tlli.mobile-contact a.tll {
        background: #F9EFF5;
        color: var(--fg-color-green) !important;
        font-weight: 700;
    }

    .header__wrapper #supermenu.respsmall.white ul li.tlli:hover a.tll,
    .header__wrapper #supermenu.respsmall ul li.tlli.exped > a.tll {
        border: 0;
        background: #F9EFF5;
        color: var(--fg-color-green) !important;
    }

    .header__wrapper #supermenu.respsmall .superdropper {
        top: 2px;
        right: 2px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        padding: 0;
        z-index: 3;
    }

    .header__wrapper #supermenu.respsmall .superdropper span {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        margin: 0;
        padding: 0;
        border-radius: 50%;
        background: #F9EFF5;
        color: var(--fg-color-green);
        font-size: 18px;
        line-height: 1;
    }

    .header__wrapper #supermenu.respsmall .superdropper span + span,
    .header__wrapper #supermenu.respsmall ul li.tlli.exped .superdropper span {
        display: none !important;
    }

    .header__wrapper #supermenu.respsmall ul li.tlli.exped .superdropper span + span {
        display: flex !important;
    }

    .header__wrapper #supermenu.respsmall ul li div.bigdiv {
        width: 100% !important;
        margin: 0 !important;
        padding: 2px 0 8px 10px;
        border: 0;
        background: transparent;
        box-shadow: none !important;
    }

    .header__wrapper #supermenu.respsmall ul li div .withchild,
    .header__wrapper #supermenu.respsmall ul li div .withimage {
        display: block;
        float: none !important;
        clear: none !important;
        width: 100% !important;
        margin: 0;
        padding: 4px 0;
    }

    .header__wrapper #supermenu.respsmall ul li div .withimage {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .header__wrapper #supermenu.respsmall ul li div .withimage .image img {
        width: 44px !important;
        height: 44px;
        margin: 0;
        border-radius: 8px;
        object-fit: cover;
    }

    .header__wrapper #supermenu.respsmall ul li div .withimage .name a,
    .header__wrapper #supermenu.respsmall ul li div .withchild a.theparent {
        display: block;
        padding: 9px 6px;
        color: #4A4A4A !important;
        font-size: 15px !important;
        font-weight: 500;
        line-height: 1.3;
        text-align: left;
    }

    .header #search.focused .close-search-modal {
        top: 22px !important;
        right: 22px !important;
        width: 44px;
        height: 44px;
    }

    #checkout-cart #content > h1 {
        margin-bottom: 20px;
        font-size: 30px;
    }

    #checkout-cart #content > h2 {
        margin: 28px 0 14px;
        color: #555;
        font-size: 25px;
        font-weight: 300;
        line-height: 1.25;
    }

    #checkout-cart #content > p {
        font-size: 15px;
        line-height: 1.45;
    }

    #checkout-cart form .table-responsive {
        overflow: visible;
        margin-bottom: 18px;
    }

    #checkout-cart form .table {
        display: block;
        min-width: 0;
        width: 100%;
        border-spacing: 0;
    }

    #checkout-cart form .table thead {
        display: none;
    }

    #checkout-cart form .table tbody,
    #checkout-cart form .table tr,
    #checkout-cart form .table td {
        display: block;
        width: 100%;
    }

    #checkout-cart form .table > tbody > tr {
        display: grid;
        grid-template-columns: 112px minmax(0, 1fr);
        grid-template-areas:
            "image name"
            "image qty"
            "price price"
            "total total";
        gap: 12px 14px;
        margin-bottom: 14px;
        padding: 14px;
        border: 1px solid rgba(156, 19, 95, 0.16);
        border-radius: 12px;
        background: #FDF9FB;
        box-shadow: 0 8px 24px rgba(74, 10, 45, 0.07);
    }

    #checkout-cart form .table > tbody > tr > td {
        width: auto;
        min-width: 0;
        max-width: 100%;
        padding: 0;
        border: 0;
        background: transparent;
    }

    #checkout-cart form .table > tbody > tr > td:first-child,
    #checkout-cart form .table > tbody > tr > td:last-child {
        border: 0;
        border-radius: 0;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(1) {
        grid-area: image;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(2) {
        grid-area: name;
        align-self: start;
        overflow: hidden;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(3) {
        display: none;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(4) {
        grid-area: qty;
        align-self: center;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(5) {
        grid-area: price;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(6) {
        grid-area: total;
    }

    #checkout-cart form .table .img-thumbnail {
        width: 112px;
        height: 112px;
        border-radius: 10px;
    }

    #checkout-cart form .table td.text-left a {
        display: block;
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: normal;
        font-size: 18px;
        line-height: 1.25;
    }

    #checkout-cart form .table td.text-left small {
        display: block;
        margin-top: 7px;
        white-space: normal;
        overflow-wrap: anywhere;
        line-height: 1.35;
    }

    #checkout-cart form .table .input-group.btn-block {
        display: flex;
        width: 100%;
        max-width: 166px !important;
    }

    #checkout-cart form .table .input-group .form-control {
        width: 54px;
        height: 40px;
        min-height: 40px;
    }

    #checkout-cart form .table .input-group-btn .btn {
        width: 40px;
        height: 40px;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(5),
    #checkout-cart form .table > tbody > tr > td:nth-child(6) {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-width: 0;
        padding-top: 12px;
        border-top: 1px solid rgba(156, 19, 95, 0.12);
        font-size: 16px;
        text-align: left;
        white-space: normal;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(5)::before {
        content: "Ціна:";
        margin-right: 8px;
        color: #666666;
        font-weight: 500;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(6)::before {
        content: "Разом:";
        margin-right: 8px;
        color: #666666;
        font-weight: 500;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(5) {
        padding-top: 14px;
    }

    #checkout-cart form .table > tbody > tr > td:nth-child(6) {
        padding-top: 8px;
    }

    #checkout-cart .row > .col-sm-4.col-sm-offset-8 {
        width: 100%;
        margin-left: 0;
    }

    #checkout-cart #content > .row {
        margin-right: 0;
        margin-left: 0;
    }

    #checkout-cart #content > .row > .col-sm-4.col-sm-offset-8 {
        float: none;
        max-width: 100%;
        padding-right: 0;
        padding-left: 0;
    }

    #checkout-cart .col-sm-4 .table {
        display: block;
        width: 100%;
        min-width: 0 !important;
        max-width: 100%;
        margin-bottom: 18px;
        overflow: hidden;
    }

    #checkout-cart .col-sm-4 .table tbody {
        display: block;
        width: 100%;
    }

    #checkout-cart .col-sm-4 .table tr {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        box-sizing: border-box;
        width: 100%;
        padding: 0 16px;
        border-bottom: 1px solid rgba(156, 19, 95, 0.12);
    }

    #checkout-cart .col-sm-4 .table td {
        display: block;
        width: auto;
        min-width: 0;
        padding: 13px 0;
        border: 0;
        font-size: 17px;
    }

    #checkout-cart .col-sm-4 .table td:first-child {
        flex: 1 1 auto;
        text-align: left;
        white-space: normal;
    }

    #checkout-cart .col-sm-4 .table td:last-child {
        flex: 0 0 auto;
        max-width: 48%;
        text-align: right;
        white-space: nowrap;
    }

    #checkout-cart .col-sm-4 .table tr:last-child td {
        font-size: 20px;
    }
}

@media (max-width: 374.98px) {
    .header > .container {
        padding-right: 12px;
        padding-left: 12px;
    }

    .header__wrapper {
        grid-template-columns: 96px minmax(0, 1fr) auto;
        gap: 8px;
    }

    .header__wrapper > .logo,
    .header__wrapper .logo img {
        width: 96px;
        max-width: 96px;
    }

    .header__wrapper .search,
    .header__wrapper .search__toggle,
    .header__wrapper .search__toggle picture,
    .header__wrapper .header__oc #cart > button,
    .header__wrapper .header__oc .favorites-toggle,
    .header__wrapper .header__oc .modal-wishlist-toggle {
        width: 36px;
        height: 36px;
        min-width: 36px;
    }

    .header__wrapper .search__toggle img,
    .header__wrapper .header__oc .custom-icon,
    .header__wrapper .header__oc #cart > button svg.custom-icon,
    .header__wrapper .header__oc .favorites-toggle svg.custom-icon {
        width: 30px !important;
        height: 30px !important;
        max-width: 30px;
        max-height: 30px;
    }
}

/* ---------------------------------------------------------------------------
   54. НАБОРИ (модуль наборов товаров)

   Список наборов и карточка повторяют разметку категории и товара, поэтому
   почти всё оформление приходит из темы. Здесь только то, чего у товара нет:
   плашка выгоды, состав набора и блок цены на странице набора.
   --------------------------------------------------------------------------- */

/* Плашка выгоды — рядом со стикером «Акційна ціна», в том же ряду */
.product-thumb-stickers .thumb-option-special-price {
    white-space: nowrap;
}

/* Фото набора: одна картинка вместо галереи — рамка та же, что у слайдера */
.product-images__single img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
}

/* Строка покупки набора — «вариант» с ценой и счётчиком */
.fg-bundle__buy .prod-option__price {
    white-space: nowrap;
    font-weight: 500;
    color: var(--orchard-green);
    font-size: 22px;
}

.fg-bundle__buy .prod-option__price_old {
    font-size: 16px;
    font-weight: 300;
    color: #767676;
    text-decoration: line-through;
}

.fg-bundle__buy .prod-option__price_new {
    color: var(--orchard-green);
}

.fg-bundle__buy .prod-option__stock {
    font-weight: 300;
    font-size: 15px;
    color: #686868;
}

/* Страница набора свёрстана по образцу карточки товара, поэтому почти всё
   оформление приходит из блока 49. Здесь — только заголовок состава и
   колонка с количеством, которых у товара нет. */
.fg-bundle__composition {
    margin-top: 22px;
}

.fg-bundle__composition-head {
    padding: 14px 18px 0;
}

.product .fg-bundle__composition .prod-option__container {
    gap: 18px;
    padding: 16px 18px;
}

/* Состав в карточке — вспомогательный текст, а не заголовок: набор из трёх
   позиций с опциями иначе занимает пол-карточки и спорит с названием.
   Кегль меньше, цвет приглушён, длинные списки обрезаются по четырём строкам. */
.fg-bundle-card__composition {
    font-size: 15px;
    line-height: 1.45;
    color: #686868;
    margin-bottom: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.fg-bundles__empty {
    font-size: 20px;
    font-weight: 300;
    color: #686868;
    padding: 40px 0 80px;
}

/* --- страница набора ------------------------------------------------------ */
.fg-bundle__price {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 12px;
    margin: 14px 0 10px;
}

.fg-bundle__price .product-price_old {
    font-size: 20px;
    color: #767676;
    text-decoration: line-through;
}

.fg-bundle__price .product-price_new {
    font-size: 34px;
    font-weight: 500;
    color: var(--orchard-green);
}

.fg-bundle__saving-label {
    background: var(--orchard-green-pale);
    color: var(--orchard-green-dark);
    font-size: 16px;
    padding: 4px 14px;
    border-radius: var(--orchard-radius);
}

.fg-bundle__stock {
    margin-bottom: 18px;
    font-size: 17px;
    font-weight: 300;
}

.fg-bundle__in-stock { color: var(--orchard-green); }
.fg-bundle__out-of-stock { color: #FF4A4A; }

.fg-bundle__sets {
    display: block;
    color: #686868;
    font-size: 15px;
    margin-top: 2px;
}

.fg-bundle__buttons {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 26px;
}

.fg-bundle__buttons .add-to-cart-no-options {
    flex: 1 1 auto;
}

/* --- состав набора -------------------------------------------------------- */
.fg-bundle__composition-head {
    font-size: 20px;
    font-weight: 400;
    color: var(--orchard-text);
    margin-bottom: 12px;
}

.fg-bundle__composition .prod-option__container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.fg-bundle__composition .prod-option__qty {
    white-space: nowrap;
    color: #686868;
    font-weight: 300;
}

.fg-bundle__composition .prod-option_out {
    opacity: 0.6;
}

.fg-bundle__item-option {
    color: var(--orchard-green);
}

@media screen and (max-width: 992px) {
    .fg-bundle__price .product-price_new { font-size: 28px; }
}

/* ---------------------------------------------------------------------------
   55. ШИРИНА КОНТЕЙНЕРА ГЛАВНОГО МЕНЮ

   Меню (#supermenu) лежит в собственном .container внутри .header__wrapper.
   У .container из блока 1 стоит width: auto, и как flex-элемент он сжимается
   по содержимому — меню получало ~700px вместо ~1000px.

   Скрипт модуля меряет ширину и при нехватке места переключает меню в
   мобильный режим: класс superbig меняется на respsmall, пункты прячутся
   под бургер. Отдаём контейнеру свободное место — меню помещается в строку.

   ВАЖНО: не удалять при правках соседних блоков. Меню уходит под бургер
   молча, и связь с этим правилом неочевидна.
   --------------------------------------------------------------------------- */
@media screen and (min-width: 993px) {
    .header__wrapper > .container {
        flex: 1 1 auto;
        width: auto;
    }
}

/* На мобильных .header__wrapper — это GRID, а не flex. Поэтому все свойства
   flex-* к контейнеру меню не применялись вообще: ширину ему задавала
   колонка сетки, и он сжимался по тексту кнопки — 108px при экране 412px.
   Отсюда обе поломки сразу:
     • кнопка «Каталог» шириной 108px вместо полной;
     • выпадающая панель уезжала за левый край, потому что тема центрирует
       её как left: 50% + translateX(-50%) ОТНОСИТЕЛЬНО РОДИТЕЛЯ: 50% от 108
       это 54px, а сдвиг влево — половина от 380px панели, итого -136px.

   Растягиваем контейнер на всю строку сетки — и кнопка, и панель встают
   на место сами. Замерено: 16 / 380 у всех трёх элементов. */
@media screen and (max-width: 992px) {
    .header__wrapper > .container {
        grid-column: 1 / -1;
        width: 100%;
        max-width: none;
        padding-left: 0;
        padding-right: 0;
    }
}

/* ---------------------------------------------------------------------------
   56. СПИСОК СТАТЕЙ БЛОГА (blog/latest)

   Карточка статьи собрана из тех же классов, что карточка товара, поэтому
   плашка, скругления, кнопка и сетка приходят из темы. Здесь только то, чего
   у товара нет: строка с датой и просмотрами вместо цены.
   --------------------------------------------------------------------------- */
.blog-card__meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    margin-bottom: 10px;
    font-size: 15px;
    font-weight: 300;
    color: #767676;
}

.blog-card__meta i {
    margin-right: 5px;
    color: var(--orchard-green);
}

/* Анонс — вспомогательный текст: длинные вступления иначе растягивают
   карточки на разную высоту и ломают ряд */
.blog-card__description {
    font-size: 15px;
    line-height: 1.5;
    color: #686868;
    margin-bottom: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Ссылка-кнопка «Читати далі» ведёт себя как кнопка товара */
.blog-card .product-buttons .bttn {
    flex: 1 1 auto;
    text-decoration: none;
}

.blog-card .rating {
    margin-bottom: 10px;
}

/* ---------------------------------------------------------------------------
   57. СТРАНИЦА СТАТЬИ (blog/article)

   Что тут было не так и почему я дважды промахнулся.

   В custom.css у темы стоит `.blog-article { max-width: 740px; margin: 20px
   auto 40px }` — колонка для чтения. Само по себе разумно, но:
     • .blog-info, форма отзывов и блоки «Схожі товари / статті» этого
       ограничения не имеют и идут на все 1436px;
     • на графитовом фоне тёмный текст статьи почти не читался.

   Сначала я сузил статью до 900px и отцентрировал — рассинхрон стал только
   заметнее. Потом растянул карточку, но 740px из темы никуда не делись,
   и карточка осталась узкой.

   Решение: одна ширина колонки для ВСЕХ блоков статьи — 900px, заданная
   переменной. Меняете число в одном месте — двигается вся страница целиком,
   и разъехаться блокам больше нечем.
   --------------------------------------------------------------------------- */
:root {
    --fg-article-width: 900px;
}

/* перебиваем 740px из custom.css */
.blog-article,
.blog-info,
.blog-reviews,
.related-products,
.related-articles {
    max-width: var(--fg-article-width);
    margin-left: auto;
    margin-right: auto;
}

.blog-article,
.blog-reviews {
    margin-bottom: 40px;
    padding: 40px;
    background: #FDF9FB;
    border: 1px solid rgba(156, 19, 95, 0.18);
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(74, 10, 45, 0.06);
}

.blog-article { margin-top: 20px; }

.blog-article__header {
    text-align: left;
    margin-top: 0;
}

.blog-info {
    margin-bottom: 30px;
    font-size: 15px;
    font-weight: 300;
    color: #767676;
}

.blog-info i { color: var(--orchard-green); margin-right: 5px; }

/* Слайдеры похожих товаров и статей выше по странице получают отступ сверху */
.related-products,
.related-articles {
    margin-top: 60px;
}

/* -------------------------------------------------------------------------
   Чистка мусора из Word.

   Статьи вставляли копипастом из Word, и в HTML остались его inline-стили:
       <p style="line-height:1.38; margin-left:-42.55pt; ...">
   Отрицательный отступ -42.55pt — это -56.7px, ровно на столько текст и
   вылезал за левый край карточки. Правил в теме тут нет, дело в контенте.

   Inline-стиль перебить обычным правилом нельзя, поэтому !important —
   тот редкий случай, когда он оправдан. Сбрасываем только горизонтальные
   отступы и принудительную ширину у прямых потомков: вложенные списки и
   их padding не трогаем, иначе развалится нумерация.

   Правильнее почистить HTML статей в админке, но пока этого не сделали,
   вёрстка не должна разъезжаться из-за одной вставки из Word.
   ------------------------------------------------------------------------- */
.blog-article__description > *,
.blog-article__description > * > span {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
}

.blog-article__description > *[style*="width"] {
    width: auto !important;
}

/* Длинные слова и ссылки без пробелов не должны растягивать карточку */
.blog-article__description {
    overflow-wrap: anywhere;
}

/* Картинки внутри текста статьи не должны вылезать за карточку */
.blog-article__description img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    margin: 6px 0 18px;
}

.blog-article__description h2,
.blog-article__description h3 {
    font-weight: 400;
    color: var(--orchard-text);
    margin: 28px 0 12px;
}

.blog-article__description h2 { font-size: 28px; }
.blog-article__description h3 { font-size: 22px; }

.blog-article__description a {
    color: var(--orchard-green);
    text-decoration: underline;
}

.blog-article__description a:hover {
    color: var(--orchard-green-dark);
}

.blog-article__description blockquote {
    margin: 20px 0;
    padding: 16px 22px;
    border-left: 3px solid var(--orchard-green);
    background: var(--orchard-green-pale);
    border-radius: 0 10px 10px 0;
    font-style: normal;
}

/* Форма отзыва внутри карточки: тема красит её в голубой
   (--fg-color-bg-lightblue) — единственное голубое пятно на всём сайте.
   Убираем подложку совсем: карточка вокруг уже даёт нужный фон,
   вложенный прямоугольник другого цвета только дробит блок. */
#form-review .review-form.vaved.vaved-lightblue .vaved-content,
#form-review .review-form.vaved .vaved-content {
    background-color: transparent;
    padding: 0;
}

#form-review .review-form h3,
.blog-reviews h3 {
    font-weight: 400;
    font-size: 24px;
    color: var(--orchard-text);
    margin: 0 0 20px;
}

/* Кнопка отправки — обычная орчардовская, без капса */
#form-review #button-review,
.blog-reviews #button-review {
    text-transform: none;
    font-size: 16px;
    padding: 12px 30px;
    border-radius: var(--orchard-radius);
}

/* Оценка и кнопка на одной линии, без прижатия к краям */
#form-review .review-form.vaved .vaved-content .form-group-rating {
    align-items: center;
    gap: 24px;
    justify-content: flex-start;
    margin-top: 8px;
}

/* Заголовки блоков «Схожі товари» и «Схожі статті» */
.related-products > h2,
.related-articles > h2,
.related-products__title,
.related-articles__title {
    font-weight: 300;
    font-size: 34px;
    color: var(--orchard-text);
    margin-bottom: 24px;
}

@media screen and (max-width: 992px) {
    :root { --fg-article-width: 100%; }
}

@media screen and (max-width: 768px) {
    .blog-article,
    .blog-reviews { padding: 22px 18px; }
    .blog-article__description h2 { font-size: 22px; }
    .blog-article__description h3 { font-size: 19px; }
}

/* ---------------------------------------------------------------------------
   58. ВЫПАДАЮЩЕЕ МЕНЮ: ШРИФТ И КАРТИНКИ КАТЕГОРИЙ

   Модуль supermenu задаёт в выпадающем 12px — мелко рядом с 18px верхнего
   уровня и мелко само по себе. Поднимаем до 16px.

   Картинки категорий возвращены в контроллере: getOrchardCategoryChildren()
   отдавал thumb пустой строкой, а пункт «Каталог» шёл без view = '1'
   (режим «категории с картинками»), поэтому шаблон их и не выводил.
   Здесь — только размеры и выравнивание плиток.
   --------------------------------------------------------------------------- */
.header #supermenu div.bigdiv a,
.main-menu #supermenu div.bigdiv a {
    font-size: 16px;
    line-height: 1.5;
}

.header #supermenu div.bigdiv a.nname,
.main-menu #supermenu div.bigdiv a.nname {
    font-size: 17px;
    font-weight: 400;
}

.header #supermenu div.bigdiv .child-level a,
.main-menu #supermenu div.bigdiv .child-level a {
    font-size: 15px;
}

/* Раскладка в несколько колонок.

   Плитки .withimage лежат прямыми детьми .supermenu-left, у которого
   display: block — отсюда «полотно на километр»: 28 категорий в один
   столбик. Раскладываем сеткой. auto-fill с minmax подбирает число колонок
   сам, поэтому раскладка не сломается, когда категорий станет больше
   или меньше. */
.header #supermenu div.bigdiv .supermenu-left,
.main-menu #supermenu div.bigdiv .supermenu-left {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 4px 22px;
    align-items: start;
}

/* Плитка категории с картинкой */
.header #supermenu div.bigdiv .withimage,
.main-menu #supermenu div.bigdiv .withimage {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 0;
}

.header #supermenu div.bigdiv .withimage .image,
.main-menu #supermenu div.bigdiv .withimage .image {
    flex: 0 0 auto;
    line-height: 0;
}

.header #supermenu div.bigdiv .withimage .image img,
.main-menu #supermenu div.bigdiv .withimage .image img {
    width: 52px;
    height: 52px;
    object-fit: cover;
    border-radius: 8px;
    display: block;
}

.header #supermenu div.bigdiv .withimage .name,
.main-menu #supermenu div.bigdiv .withimage .name {
    flex: 1 1 auto;
    min-width: 0;
}

@media screen and (max-width: 992px) {
    .header #supermenu div.bigdiv .withimage .image img { width: 42px; height: 42px; }
    .header #supermenu div.bigdiv a { font-size: 15px; }
}

/* ---------------------------------------------------------------------------
   59. МОБИЛЬНОЕ МЕНЮ: СТРЕЛКА РАСКРЫТИЯ ПОДПУНКТОВ

   У пунктов с подменю («Каталог», «Ще») справа есть стрелка a.superdropper,
   и её обработчик в supermenu-responsive.js исправно вешает li классом
   `exped` — механизм рабочий. Но нажать по ней было невозможно:

       a.superdropper — position: absolute, z-index: 3, зона 343..385
       a.tll          — position: relative, z-index: 6, зона  25..387

   Ссылка пункта лежит ПОВЕРХ стрелки и шире её. elementFromPoint в центре
   стрелки возвращал a.tll — палец всегда попадал по ссылке, поэтому пункт
   переходил вместо раскрытия.

   Поднимаем стрелку над ссылкой и освобождаем под неё место справа, чтобы
   длинное название не заезжало под стрелку.
   --------------------------------------------------------------------------- */
@media screen and (max-width: 992px) {
    .header__wrapper #supermenu.respsmall > ul > li.tlli > a.superdropper {
        z-index: 9;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .header__wrapper #supermenu.respsmall > ul > li.tlli.mkids > a.tll {
        padding-right: 52px;
    }

    /* Раскрытый пункт — стрелка разворачивается */
    .header__wrapper #supermenu.respsmall > ul > li.tlli.exped > a.superdropper svg {
        transform: rotate(180deg);
        transition: transform 0.2s ease;
    }

    .header__wrapper #supermenu.respsmall > ul > li.tlli > a.superdropper svg {
        transition: transform 0.2s ease;
    }
}

/* ---------------------------------------------------------------------------
   60. ФИРМЕННАЯ ПАЛИТРА И СВЕТЛЫЙ ФОН

   Магазин переехал с зелёной палитры orchard на фирменный цвет логотипа
   #9C135F, а графитовый фон — на светло-серый. Основная замена сделана
   прямо в значениях (все зелёные hex/rgb в четырёх CSS темы переписаны на
   пурпурные), здесь — только то, что автозаменой не чинится: места, где
   цвет текста был рассчитан на тёмный фон или на зелёную подложку.

   Палитра:
     #9C135F  основной (кнопки, ссылки, заголовки)
     #7A0E49  наведение / нажатие
     #5E0B39  самый тёмный
     #F9EFF5  светлая подложка (подвал, «Про нас», карточки)
     #F0DEE9  рамки на светлой подложке
   --------------------------------------------------------------------------- */

/* --- 60.1 Подвал ----------------------------------------------------------
   stylesheet.css красит подвал под старую тёмно-зелёную заливку:
   footer { color: #e2e2e2 } и footer a { color: #ccc }. Подложка теперь
   светлая, поэтому такой текст просто исчезает — копирайт был не виден. */
/* Подвал в одном тоне с шапкой — светло-серый, а не розовая подложка
   orchard. Оттенок берётся из той же переменной, что и шапка. */
footer.footer,
footer.footer.orchard-footer {
    background: var(--orchard-header-bg);
    border-top: 1px solid var(--orchard-hairline);
}

footer.footer {
    color: #4a4a4a;
}
footer.footer a {
    color: #4a4a4a;
}
footer.footer a:hover {
    color: var(--orchard-green);
}
footer.footer .footer__copyrights {
    color: #6f6f6f;
}
/* кнопка в подвале — белый текст на фирменной заливке, наследование выше
   её не касается */
footer.footer .footer__left_btn,
footer.footer .footer__left_btn.button,
footer.footer .footer__left_btn:hover {
    color: #fff;
}

/* --- 60.2 Хлебные крошки --------------------------------------------------
   Были чёрные (#111) поверх графита — не читались вообще. Плюс тема
   подчёркивала все крошки разом, из-за чего текущая страница выглядела
   как ссылка.

   Цвет зависит от фона страницы: фирменный #9C135F на графите даёт
   контраст 1.7, поэтому на тёмных страницах берём светлый вариант. */
.breadcrumb {
    font-size: 15px;
}
/* stylesheet.css вешает на каждую крошку `text-shadow: 0 1px 0 #FFF` —
   приём из времён светлой темы. На графите белая тень под буквами читается
   как обводка, текст рябит. Снимаем. */
.breadcrumb > li,
.breadcrumb > li a {
    text-shadow: none;
}
.breadcrumb > li a {
    text-decoration: none;
}
.breadcrumb > li a:hover {
    text-decoration: underline;
}
/* текущая страница — последняя крошка, без ссылочного вида */
.breadcrumb > li:last-child,
.breadcrumb > li:last-child a,
.breadcrumb > li:last-child a:hover {
    text-decoration: none;
    cursor: default;
    pointer-events: none;
}

/* светлые страницы: карточка товара, набор, статья */
body.page-bg-product .breadcrumb > li a          { color: var(--orchard-green); }
body.page-bg-product .breadcrumb > li a:hover    { color: var(--orchard-green-dark); }
body.page-bg-product .breadcrumb > li:last-child,
body.page-bg-product .breadcrumb > li:last-child a { color: #6b6b6b; }
body.page-bg-product .breadcrumb > li + li:before,
body.page-bg-product .breadcrumb > li:after      { color: #b9b9b9; }

/* графитовые страницы */
body.page-bg-graphite .breadcrumb > li a         { color: var(--orchard-on-dark-link); }
body.page-bg-graphite .breadcrumb > li a:hover   { color: #ffffff; }
body.page-bg-graphite .breadcrumb > li:last-child,
body.page-bg-graphite .breadcrumb > li:last-child a { color: var(--orchard-on-dark-muted); }
body.page-bg-graphite .breadcrumb > li + li:before,
body.page-bg-graphite .breadcrumb > li:after     { color: rgba(255, 255, 255, 0.38); }

/* --- 60.3 Заголовки страниц и товара --------------------------------------
   Просили фирменный цвет для заголовков. Он работает на светлом фоне —
   карточка товара, набор, статья, «Контакты». На графите тот же цвет
   пропадает, поэтому там светлый вариант. */
body.page-bg-product #content h1,
body.page-bg-product .page-content .product h1,
body.page-bg-product .product__right_inner h1,
body.page-bg-product .blog-article__header,
body.page-bg-product #product-fg-bundle h1,
.contacts-page h1 {
    color: var(--orchard-green);
}

body.page-bg-graphite #content h1,
body.page-bg-graphite .product-category h1,
body.page-bg-graphite .blog-articles-container h1 {
    color: var(--orchard-on-dark);
}
/* «Контакты»: я ошибочно решил, что заголовок лежит на светлой карточке.
   Он лежит прямо на графите — фирменный цвет там сливается. */
body.page-bg-graphite .contacts-page h1 {
    color: var(--orchard-on-dark);
}

/* заголовки в шапке-баннере и на промо-блоке главной поверх фото остаются
   белыми — там любой цвет утонул бы в картинке */
.baner-two h1,
.promo h1,
.header h1 {
    color: inherit;
}

/* --- 60.4 Мелкий серый текст ----------------------------------------------
   #767676 на светлой подложке даёт контраст 2.7 — ниже нормы. */
.blog-card__date,
.blog-card__views,
.blog-article__meta,
.product-thumb .product-thumb__meta {
    color: #767676;
}

/* --- 60.5 Текст на графите и на светлых блоках поверх него -----------------
   Аудит контраста на графитовой главной нашёл шесть мест, где текст
   практически не виден. Часть из них была сломана и до смены палитры.

   Причина одна и та же: правило `body.page-bg-graphite #common-home h2.title`
   красит ВСЕ заголовки главной в почти белый — включая те, что лежат
   внутри светлых блоков «Про нас» и баннера. Белым по светло-розовому
   контраст 1.04, то есть текста нет.                                       */
body.page-bg-graphite #common-home .about__wrapper .about__title,
body.page-bg-graphite #common-home .about__wrapper h2.title,
body.page-bg-graphite #common-home .baner .baner__title {
    color: #2c2c2c;
}
body.page-bg-graphite #common-home .about__wrapper .about__descr,
body.page-bg-graphite #common-home .about__wrapper p,
body.page-bg-graphite #common-home .baner .baner__text {
    color: #55565a;
}

/* Обратный случай: заголовки, которые лежат прямо на графите, но остались
   тёмными от старой темы. #555 по #2d302f — контраст 1.79.                */
body.page-bg-graphite .gallery__title,
body.page-bg-graphite .products-latest-container h2,
body.page-bg-graphite .products-latest-container .header-understyled,
body.page-bg-graphite .content-block h2,
body.page-bg-graphite .content-block h3 {
    color: var(--orchard-on-dark);
}
body.page-bg-graphite .content-block,
body.page-bg-graphite .content-block p,
body.page-bg-graphite .content-block span,
body.page-bg-graphite .content-block li {
    color: rgba(255, 255, 255, 0.78);
}
body.page-bg-graphite .content-block a {
    color: var(--orchard-on-dark-link);
}

/* --- 60.6 Корзина, чекаут и «Контакты» на графите --------------------------
   Эти страницы графитовые, но их вёрстка досталась от светлой темы:
   заголовки, шапка таблицы корзины и строка согласия остались тёмными
   (#333, #111, #555) прямо на тёмном фоне — контраст 1.06–1.8.

   Про !important: секции 47 и 51 адресуют эти узлы через два id
   (`#checkout-cart #content > h1`), обычным правилом их не перебить, а
   плодить трёхэтажные селекторы ради цвета текста — хуже, чем один флаг.
   Правила намеренно узкие: только то, что лежит на самом графите. Текст
   внутри белых карточек (строки товара, поля формы) не трогаем.          */
body.page-bg-graphite #checkout-cart #content > h1,
body.page-bg-graphite #checkout-cart #content h2,
body.page-bg-graphite.route-checkout-simplecheckout #content > h1,
body.page-bg-graphite.route-checkout-simplecheckout #content > h2 {
    color: var(--orchard-on-dark) !important;
}

/* пояснительный текст и шапка таблицы корзины */
body.page-bg-graphite #checkout-cart #content > p,
body.page-bg-graphite #checkout-cart .table-responsive > table.table > thead > tr > td,
body.page-bg-graphite #checkout-cart .table-responsive > table.table > thead > tr > th {
    color: rgba(255, 255, 255, 0.82) !important;
}

/* «Я погоджуюсь з умовами» — единственная строка чекаута вне белой
   карточки, поэтому целимся точно в неё, а не в label вообще */
body.page-bg-graphite #agreement_checkbox,
body.page-bg-graphite #agreement_checkbox label {
    color: rgba(255, 255, 255, 0.82) !important;
}
body.page-bg-graphite #agreement_checkbox a,
body.page-bg-graphite #agreement_checkbox a b {
    color: var(--orchard-on-dark-link) !important;
}
body.page-bg-graphite #agreement_checkbox a:hover,
body.page-bg-graphite #agreement_checkbox a:hover b {
    color: #ffffff !important;
}