/* Кастомные правила (наши, не из InSales) */

/* Резерв под скроллбар — чтобы при открытии меню ничего не «скакало» */
html { scrollbar-gutter: stable; }

/* «Показать все» в подкатегориях шапки (замена cut-list JS) */
.widget-type_system_widget_v4_header_1 .header__collections-submenu.is-expanded > .header__collections-item.is-hide { display: block; }

/* Слайдер статей (исходно tvist) — простой горизонтальный скролл */
.js-special-article-slider.is-scroll-slider [class*="__track"] { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; scrollbar-width: none; transform: none !important; gap: 30px; }
.js-special-article-slider.is-scroll-slider [class*="__track"]::-webkit-scrollbar { display: none; }
.js-special-article-slider.is-scroll-slider [class*="__slide"] { flex: 0 0 auto !important; width: auto; min-width: 240px; }

/* Модалки (наша замена micromodal): скрыты по умолчанию, показываются при открытии */
.modal:not(.is-open):not([aria-hidden="false"]) { display: none !important; }
.modal.is-open, .modal[aria-hidden="false"] { display: block; }

/* Живой поиск — выпадающие подсказки */
.header__search__results { position:absolute; left:0; right:0; top:100%; background:#fff; border-radius:0 0 8px 8px; box-shadow:0 8px 24px rgba(0,0,0,.15); z-index:50; display:none; max-height:60vh; overflow-y:auto; }
.header__search-form.is-show .header__search__results { display:block; }
.search-suggest__item { display:flex; align-items:center; gap:.6rem; padding:.5rem .75rem; text-decoration:none; color:#222; border-bottom:1px solid #f0f0f0; }
.search-suggest__item:hover { background:#f7f7f7; }
.search-suggest__img { width:48px; height:48px; object-fit:contain; flex:0 0 48px; }
.search-suggest__name { flex:1; font-size:.9rem; }
.search-suggest__price { font-weight:600; color:#FC5600; white-space:nowrap; }
.search-suggest__empty { padding:.75rem; color:#888; }
.search-suggest__hl { background:rgba(252,86,0,.15); color:#FC5600; font-weight:600; border-radius:2px; padding:0 1px; }
.search-suggest__all { display:block; text-align:center; padding:.6rem .75rem; font-size:.88rem; color:#04A1A4; font-weight:600; text-decoration:none; border-top:1px solid #f0f0f0; }
.search-suggest__all:hover { background:#f7f7f7; color:#FC5600; }

/* ===== Шим стоковых OC-страниц на Bootstrap-классах =====
   (кабинет: reset/newsletter/return/voucher/transaction/recurring/affiliate/download/tracking/reward
   + information/contact). Bootstrap выпилен из темы, эти классы больше нигде не используются → стили безопасны. */
.container{max-width:1240px;margin:0 auto;padding:1.5rem 1rem}
.container .row{display:flex;flex-wrap:wrap;gap:1.5rem;margin:0}
.container [class*="col-sm-"]{flex:1 1 100%;min-width:0}
@media(min-width:768px){
  .container .col-sm-3{flex:0 0 250px;max-width:250px}
  .container .col-sm-4{flex:0 0 320px}
  .container .col-sm-9,.container .col-sm-8,.container .col-sm-6{flex:1 1 0}
  .container .col-sm-2{flex:0 0 190px;max-width:190px}
  .container .col-sm-10{flex:1 1 0}
}
.container h1{font-family:var(--font-family-heading);font-weight:600;font-size:calc(var(--font-size)*var(--heading-ratio));margin:0 0 1.2rem}
.container h2,.container legend{font-family:var(--font-family-heading);font-weight:600;font-size:calc(var(--font-size)*var(--heading-ratio)/1.4);margin:0 0 1rem;padding-bottom:.5rem;border-bottom:1px solid #ececec;width:100%}
.container .breadcrumb{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;padding:0;margin:0 0 1rem;font-size:.85rem;color:#888}
.container .breadcrumb>li:not(:last-child):after{content:'/';margin-left:.4rem;color:#bbb}
.container .breadcrumb a{color:#888;text-decoration:none}
.container .breadcrumb a:hover{color:#FC5600}
.container fieldset{border:none;padding:0;margin:0 0 1rem}
.container .form-group{display:flex;flex-wrap:wrap;align-items:flex-start;gap:.4rem .8rem;margin-bottom:1rem}
.container .control-label{font-weight:500;padding-top:.4rem}
.container .panel{border:1px solid #ececec;border-radius:14px;background:#fff;margin-bottom:1.2rem;overflow:hidden}
.container .panel-heading{padding:.9rem 1.2rem;background:#f7f9f9;border-bottom:1px solid #ececec;font-weight:600}
.container .panel-body,.container .panel-footer{padding:1.2rem}
.container .btn{display:inline-flex;align-items:center;justify-content:center;padding:.6rem 1.4rem;border-radius:var(--controls-btn-border-radius,10px);border:1px solid transparent;font-weight:600;cursor:pointer;text-decoration:none;font-size:.95rem;transition:background .15s,box-shadow .15s,transform .15s}
.container .btn-primary{background:#FC5600;color:#fff}
.container .btn-primary:hover{background:#ff6315;transform:translateY(-1px)}
.container .btn-default,.container .btn-info,.container .btn-light,.container .btn-secondary{background:#f0f0f0;color:#333}
.container .btn-default:hover,.container .btn-info:hover{background:#e6e6e6}
.container .buttons{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.2rem;flex-wrap:wrap}
.container .pull-left{margin-right:auto}
.container .pull-right{margin-left:auto}
.container .text-danger{color:#c0392b;font-size:.85rem;margin-top:.25rem;flex-basis:100%}
.container .text-right{text-align:right}
.container .table{width:100%;border-collapse:collapse;margin-bottom:1rem}
.container .table td,.container .table th{padding:.6rem .5rem;border-bottom:1px solid #f0f0f0;text-align:left}
.container .well{background:#f7f9f9;border:1px solid #ececec;border-radius:12px;padding:1rem;margin-bottom:1rem}
.container .alert{padding:.8rem 1rem;border-radius:10px;margin-bottom:1rem;background:#e9f7f7;border:1px solid #cfe9e9}
/* Левое меню кабинета (column_left = OC account-модуль .list-group) */
.container .list-group{display:flex;flex-direction:column;border:1px solid #ececec;border-radius:14px;overflow:hidden;background:#fff;margin-bottom:1.2rem}
.container .list-group-item{padding:.7rem 1.1rem;border-bottom:1px solid #f0f0f0;color:#333;text-decoration:none;font-size:.92rem;background:#fff}
.container .list-group-item:last-child{border-bottom:none}
.container .list-group-item:hover{background:#f7f9f9;color:#FC5600}
.container .list-group-item.active{background:#04A1A4;color:#fff;font-weight:600}

/* ===== Куки-баннер ===== */
.cookie-consent{position:fixed;left:0;right:0;bottom:0;z-index:1050;background:#04A1A4;color:#fff;transform:translateY(100%);transition:transform .3s ease;box-shadow:0 -4px 20px rgba(0,0,0,.15)}
.cookie-consent.is-show{transform:translateY(0)}
.cookie-consent__inner{max-width:1240px;margin:0 auto;display:flex;align-items:center;gap:1rem;padding:.9rem 1rem;flex-wrap:wrap}
.cookie-consent__text{flex:1;min-width:200px;font-size:.9rem;line-height:1.4}
.cookie-consent__text a{color:#fff;text-decoration:underline}
.cookie-consent__btn{flex:0 0 auto;background:#FC5600;color:#fff;border:none;white-space:nowrap}
.cookie-consent__btn:hover{background:#ff6315;color:#fff}

/* ===== Карточка товара (chai) ===== */
.product__photos-thumbs{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.product__thumb{width:64px;height:64px;border:1px solid #e6e6e6;border-radius:6px;padding:2px;background:#fff;cursor:pointer;overflow:hidden}
.product__thumb.is-active{border-color:#0ABAB5}
.product__thumb img{width:100%;height:100%;object-fit:contain}
.product__available [data-chai-available],.product__available .is-available{color:#0ABAB5}
.product__available .is-not-available{color:#c0392b}
.option-value.is-disabled{opacity:.45;text-decoration:line-through;cursor:not-allowed}
.option-value__price{opacity:.7;font-size:.85em;margin-left:.25em}
.option.has-error .option-label{color:#c0392b}
.button.is-loading{opacity:.6;pointer-events:none}
.button:disabled{opacity:.5;pointer-events:none}

/* Вкладки описание/характеристики/отзывы */
.product-tabs__nav{display:flex;gap:4px;list-style:none;margin:0 0 16px;padding:0;border-bottom:2px solid #eee;flex-wrap:wrap}
.product-tabs__nav li a{display:inline-block;padding:10px 18px;color:#333;text-decoration:none;font-weight:600;border-bottom:2px solid transparent;margin-bottom:-2px}
.product-tabs__nav li.is-active a{color:#04A1A4;border-bottom-color:#04A1A4}
.product-tabs__pane{display:none}
.product-tabs__pane.is-active{display:block}
.product-spec{width:100%;border-collapse:collapse}
.product-spec td{padding:8px 12px;border-bottom:1px solid #eee;vertical-align:top}
.product-spec__name{color:#888;width:40%}
.product-spec__group td{background:#f7f7f7;color:#04A1A4}

/* Сетка сопутствующих товаров */
.products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.products-grid_related .product-preview{display:flex;flex-direction:column;gap:8px}
.product-preview__photo{display:block;border-radius:8px;overflow:hidden;background:#fff}
.product-preview__title a{color:#222;text-decoration:none;font-size:.95rem}
.product-preview__price{font-weight:700}
@media(max-width:991px){.products-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.products-grid{grid-template-columns:repeat(2,1fr)}}

/* Тост-уведомление */
.chai-toast{position:fixed;right:20px;bottom:20px;max-width:340px;background:#04A1A4;color:#fff;padding:14px 18px;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.18);opacity:0;transform:translateY(12px);transition:.25s;z-index:9999;pointer-events:none}
.chai-toast.is-show{opacity:1;transform:translateY(0)}
.chai-toast.is-error{background:#c0392b}

/* ===== Базовые сообщения (bootstrap отключён) — стилизуем то, что выводит наш код ===== */
.text-danger{color:#c0392b;font-size:.85rem;margin-top:4px;display:block}
.text-success{color:#1d7a33}
.alert{padding:12px 16px;border-radius:8px;margin:12px 0;border:1px solid transparent;font-size:.95rem}
.alert-success{background:#e8f8ec;border-color:#bfe6c8;color:#1d7a33}
.alert-danger,.alert-error{background:#fdecea;border-color:#f5c2bb;color:#b3261e}
.alert-info{background:#e9f6f6;border-color:#bfe6e6;color:#04A1A4}
.has-error .option-label,.has-error .control-label{color:#c0392b}

/* ===== Хлебные крошки — единый видимый стиль (перекрывает разрозненные правила скрейпа) ===== */
.breadcrumb-wrapper{display:block;padding:0}
.breadcrumb-wrapper .breadcrumb,
ul.breadcrumb{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center}
.breadcrumb-wrapper .breadcrumb > li,
ul.breadcrumb > li{display:inline-flex;align-items:center;color:#777;font-size:.9rem}
.breadcrumb-wrapper .breadcrumb > li:not(:last-child)::after,
ul.breadcrumb > li:not(:last-child)::after{content:"/";opacity:.5;margin:0 8px;color:#999}
.breadcrumb-wrapper .breadcrumb a,
ul.breadcrumb a{color:#333;text-decoration:none}
.breadcrumb-wrapper .breadcrumb a:hover,
ul.breadcrumb a:hover{color:#FC5600}
.breadcrumb-wrapper .breadcrumb > li:last-child{color:#999}

/* ===== Главная (chai) ===== */
.section-title{font-size:1.6rem;margin:0 0 18px;text-align:center}
.chai-hero{background:#04A1A4 linear-gradient(135deg,#04A1A4,#05c2c5);background-size:cover;background-position:center;border-radius:16px;padding:48px 32px;color:#fff;text-align:center}
.chai-hero__inner{max-width:680px;margin:0 auto}
.chai-hero__title{color:#fff;font-size:2rem;margin:0 0 12px}
.chai-hero__text{font-size:1.05rem;opacity:.95;margin:0 0 22px}
.chai-hero__btn{background:#FC5600;color:#fff;border:0}
.chai-hero__btn:hover{background:#e44e00;color:#fff}
.home-categories{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.home-category{display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;color:#222}
.home-category__photo{display:block;width:100%;border-radius:12px;overflow:hidden;background:#f7f7f7}
.home-category__name{font-weight:600;text-align:center}
.home-category:hover .home-category__name{color:#04A1A4}
.product-preview{position:relative;display:flex;flex-direction:column;height:100%}
.product-preview .favorites_btn{position:absolute;top:8px;right:8px;z-index:2}
/* oc-карточки: flex-колонка, перебиваем grid из pages.css (js-chai-card = наш класс → 0-2-0 > 0-1-0) */
.js-chai-card{display:flex;flex-direction:column;height:100%}
.js-chai-card .product-preview__content{display:flex;flex-direction:column;flex:1;height:auto}
.js-chai-card .product-preview__area-title{min-height:0}
.js-chai-card .product-preview__area-bottom{margin-top:auto;padding-top:8px}
.catalog-list.grid-list{align-items:stretch}
@media(max-width:991px){.home-categories{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.home-categories{grid-template-columns:repeat(2,1fr)}}

/* ===== Категория (chai) ===== */
.category-description{margin:10px 0 0;color:#555}
.catalog-subcats{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px}
.catalog-subcat{display:inline-block;padding:8px 16px;background:#f1f6f6;border:1px solid #e0eded;border-radius:999px;color:#04A1A4;text-decoration:none;font-size:.92rem;transition:.15s}
.catalog-subcat:hover{background:#04A1A4;color:#fff;border-color:#04A1A4}
.catalog-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 18px;padding-bottom:14px;border-bottom:1px solid #eee}
.catalog-toolbar__results{color:#888;font-size:.9rem}
.catalog-toolbar__controls{display:flex;gap:16px;flex-wrap:wrap}
.catalog-toolbar__field{display:flex;align-items:center;gap:8px}
.catalog-toolbar__field label{color:#888;font-size:.9rem;white-space:nowrap}
.catalog-toolbar__field select{min-width:160px}
.catalog-pagination{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:28px}
.catalog-pagination .pagination{display:inline-flex;gap:6px;list-style:none;margin:0;padding:0}
.catalog-pagination .pagination a,.catalog-pagination .pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 10px;border:1px solid #e0e0e0;border-radius:8px;color:#333;text-decoration:none}
.catalog-pagination .pagination .active span,.catalog-pagination .pagination a:hover{background:#04A1A4;color:#fff;border-color:#04A1A4}
.catalog-pagination__results{color:#888;font-size:.9rem}
.catalog-empty{padding:40px 0;text-align:center}
.catalog-empty .button{margin-top:14px}

/* ===== Категория: панель фильтр+сортировка (chai) ===== */
.collection-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 22px}
.show-mobile-filter-btn{display:inline-flex;align-items:center;gap:8px}
.collection-sort{margin-left:auto}
.collection-sort .select-wrapper select{min-width:200px}
.filter__footer{padding:16px;position:sticky;bottom:0;background:var(--bg,#fff)}
.product-preview__buy-btn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center}
.product-preview__price-old{text-decoration:line-through;opacity:.6;margin-right:6px;font-size:.9em}

/* ===== Категория: левый сайдбар + AJAX-каталог (chai) ===== */
.catalog-layout{display:flex;align-items:flex-start;gap:30px}
.catalog-sidebar{flex:0 0 260px;max-width:260px}
.catalog-main{flex:1;min-width:0}
.catalog-cats{margin-bottom:24px}
.catalog-cats__title,.catalog-filter__title{font-weight:700;font-size:1.1rem;margin:0 0 12px}
.catalog-cats__list{list-style:none;margin:0;padding:0}
.catalog-cats__list li{margin:0 0 8px}
.catalog-cats__list a{color:#333;text-decoration:none}
.catalog-cats__list a:hover{color:#04A1A4}
.catalog-filter{border-top:1px solid #eee;padding-top:18px}
.catalog-filter__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.catalog-filter__reset{font-size:.85rem;color:#04A1A4;cursor:pointer}
.catalog-filter .filter-item{color:#333;border-bottom:1px solid #eee;padding:12px 0}
.catalog-filter .filter-item__name{font-weight:600;cursor:pointer;display:block}
.catalog-filter .filter-item__content{margin-top:10px}
.catalog-filter .filter-item__list-item{margin:0 0 8px}
.catalog-filter .filter-option{display:flex;align-items:center;gap:8px;cursor:pointer}
.catalog-filter .filter-range__values{display:flex;gap:10px}
.catalog-filter .filter-range__values-item{display:flex;align-items:center;gap:6px}
.catalog-filter__apply{margin-top:18px}
.catalog-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 20px}
.catalog-toolbar__results{color:#888;font-size:.9rem}
.collection-sort .select-wrapper select{min-width:210px}
#catalog-results{transition:opacity .15s}
#catalog-results.is-loading{opacity:.45;pointer-events:none}
@media(max-width:900px){.catalog-layout{flex-direction:column}.catalog-sidebar{flex:none;max-width:100%;width:100%}}

/* ===== Категория: 2 колонки (левый фильтр-сайдбар + контент) ===== */
.collection-body{display:flex;align-items:flex-start;gap:30px;margin-top:10px}
.collection-body aside.is-large{flex:0 0 280px;max-width:280px;width:280px}
.collection-body aside.is-large:before{display:none}
.collection-content{flex:1;min-width:0}
.collection-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:16px;margin:0 0 20px}
.collection-sort .select-wrapper select{min-width:210px}
.show-mobile-filter-btn{display:none}
.sidebar-collections__menu{list-style:none;margin:0;padding:0}
.sidebar-collections__submenu{list-style:none;margin:6px 0 0;padding:0 0 0 14px}
.sidebar-collections__item{margin:0 0 7px}
.sidebar-collections__link{color:#333;text-decoration:none;font-size:.92rem}
.sidebar-collections__link.is-current{font-weight:700;color:#04A1A4}
.sidebar-collections__link:hover{color:#04A1A4}
.sidebar-collections__item.home_category .sidebar-collections__link{color:#888}
/* десктоп: фильтр-сайдбар статичный (перекрываем off-canvas базу InSales) */
@media(min-width:901px){
  .collection-body .widget-type_system_widget_v4_sidebar_filter_3 .filter{position:static;transform:none;visibility:visible;z-index:auto;padding:0;background:transparent;max-width:none;width:auto;box-shadow:none;border:0}
  .collection-body .filter__hide-mobile-filter-btn{display:none}
}
/* мобайл: сайдбар сверху, фильтр off-canvas по кнопке «Фильтры» */
@media(max-width:900px){
  .collection-body{display:block}
  .collection-body aside.is-large{width:auto;max-width:none;display:block}
  .show-mobile-filter-btn{display:inline-flex;align-items:center;gap:8px}
}

/* ===== Категория: самодостаточная раскладка (перекрывает InSales-quirks) ===== */
.chai-cat-wrap{max-width:1240px;margin:0 auto;padding:10px 20px 40px}
.chai-cat-grid{display:flex;align-items:flex-start;gap:30px}
.chai-cat-side{flex:0 0 270px;width:270px;max-width:270px}
.chai-cat-main{flex:1 1 auto;min-width:0}
/* фильтр статичный слева — перекрываем off-canvas базу InSales намертво */
.chai-cat-side .filter{position:static !important;transform:none !important;visibility:visible !important;display:block !important;width:auto !important;max-width:none !important;height:auto !important;inset:auto !important;top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;background:transparent !important;box-shadow:none !important;border:0 !important;padding:0 !important;z-index:auto !important;overflow:visible !important;transition:none !important}
.chai-cat-side .filter__head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.chai-cat-side .filter__head-title{font-size:1.2rem;font-weight:700}
.chai-cat-side .filter__hide-mobile-filter-btn{display:none}
.chai-filter-reset{margin-left:auto;font-size:.85rem;color:#04A1A4;cursor:pointer}
.collection-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:16px;margin:0 0 20px}
.collection-toolbar .show-mobile-filter-btn{display:none}
.collection-sort .select-wrapper select{min-width:210px}
.category-description{margin-top:30px;color:#555}
@media(max-width:900px){
  .chai-cat-grid{display:block}
  .chai-cat-side{width:auto;max-width:none}
  .collection-toolbar .show-mobile-filter-btn{display:inline-flex;align-items:center;gap:8px}
  .chai-cat-side .filter{position:fixed !important;visibility:hidden !important;transform:translate3d(-100%,0,0) !important;top:0 !important;left:0 !important;bottom:0 !important;width:85% !important;max-width:340px !important;background:#fff !important;z-index:9999 !important;padding:16px !important;overflow-y:auto !important;transition:.3s !important}
  .chai-cat-side .filter.is-show-mobile{transform:translate3d(0,0,0) !important;visibility:visible !important}
  .chai-cat-side .filter__hide-mobile-filter-btn{display:inline-flex}
}

/* ===== Категория: нативный лейаут page_layout_sticky_left (фильтр в сайдбаре статичный) ===== */
@media(min-width:768px){
  .page_layout_sticky_left aside.is-large .filter{position:static !important;transform:none !important;visibility:visible !important;display:block !important;width:auto !important;max-width:none !important;height:auto !important;inset:auto !important;top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;background:transparent !important;box-shadow:none !important;border:0 !important;padding:0 !important;z-index:auto !important;overflow:visible !important;transition:none !important}
  .page_layout_sticky_left aside.is-large .filter__hide-mobile-filter-btn{display:none}
  .collection-toolbar .show-mobile-filter-btn{display:none}
}
.page_layout_sticky_left aside.is-large{padding-right:0}
.page_layout_sticky_left aside.is-large .filter__content{display:block;visibility:visible}
.page_layout_sticky_left aside.is-large .filter-item{display:block}
.page_layout_sticky_left aside.is-large .filter__head-title{font-size:1.2rem;font-weight:700}
.filter-item__head{cursor:pointer}
.chai-filter-reset{margin-left:auto;font-size:.85rem;color:#04A1A4;cursor:pointer}
.collection-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:16px;margin:0 0 20px}
.collection-toolbar .show-mobile-filter-btn{display:none}
.collection-sort .select-wrapper select{min-width:210px}
#catalog-results.is-loading{opacity:.45;pointer-events:none}
.category-description{margin-top:30px;color:#555}
@media(max-width:767px){
  .collection-toolbar .show-mobile-filter-btn{display:inline-flex;align-items:center;gap:8px}
}

/* ===== Категория: жёстко форсируем десктоп 2-колонки (на случай если mobile-правило перебивает) ===== */
@media(min-width:992px){
  .page_layout.page_layout_section_top{
    grid-template-areas:"header header header header" "section-top section-top section-top section-top" ". sidebar main ." "footer footer footer footer" !important;
  }
  .page_layout_sticky_left>aside.is-large{display:flex !important}
}

/* Категория-фильтр: прячем пустой слайдер (noUiSlider не подключён) — остаются поля от/до */
.filter-range__slider:empty{display:none}
.filter-range__values{display:flex;align-items:center;gap:8px;margin-top:6px}
.filter-range__values-item{display:flex;align-items:center;gap:6px}
.filter-range__field{max-width:90px}

/* ===== Категория: отступы кнопки «Показать ещё» + карточек ===== */
.catalog-loadmore{text-align:center;margin:34px 0 8px}
.catalog-loadmore__results{color:#888;font-size:.9rem;margin-bottom:16px}
.infinity-products-controls{text-align:center}
.infinity-products-controls__btn{cursor:pointer}
/* карточка: инлайн-опции Вид/Фасовка */
.product-preview__variants{margin:10px 0}
.product-preview__variants .option{margin-bottom:8px}
.product-preview__variants .option-label{display:block;font-size:.78rem;color:#888;margin-bottom:5px}
.product-preview__variants .option-values{display:flex;flex-wrap:wrap;gap:6px}
.product-preview__variants .option-value{display:inline-block;margin:0 2px 4px 0;line-height:1;font-size:.875rem;cursor:pointer;color:var(--color-text,#222)}
.product-preview__variants .option-value>span{--option-bg:#f7f7f7;display:inline-block;padding:.3rem .5rem;border-radius:10px;border:2px solid var(--option-bg);background-color:var(--option-bg)}
.product-preview__variants .option-value.is-active>span{background-color:transparent;border:2px solid #FC5600}
.product-preview__variants .option-value.is-disabled{opacity:.4;text-decoration:line-through;pointer-events:none}
.product-preview__variants .option-value input{display:none}
/* карточка: кнопка В корзину на всю ширину + отступ */
.product-preview .product-preview__controls{display:block;margin-top:10px}
.product-preview .add-cart-counter{width:100%}
.product-preview .add-cart-counter__btn{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 16px}

/* ===== Фильтр-сайдбар: галочки + видимость пунктов (без InSales icon-font и без ajax-filter JS) ===== */
/* 1. Все пункты списка — видимые (InSales JS добавлял .ajax-filter-short-list-item-visible, у нас нет) */
.widget-type_system_widget_v4_sidebar_filter_3 .filter-item__list-item{display:block}
/* 2. Галочка ✓ через Unicode (insales-icons не грузится в OC); убираем background — он для glyph-иконки */
.widget-type_system_widget_v4_sidebar_filter_3 .filter-option__btn:before{content:"\2713";background:none}
/* 3. Стрелка аккордеона ▾ вместо icon-angle-down из icon-font */
.widget-type_system_widget_v4_sidebar_filter_3 .filter-item__head .icon-angle-down:before{content:"▾";font-size:1.1em;line-height:1;font-style:normal}
/* 4. Ограничиваем высоту длинных списков (напр. Состав) */
.widget-type_system_widget_v4_sidebar_filter_3 .filter-item__list{max-height:240px;overflow-y:auto;scrollbar-width:thin}
/* 5. Те же правила для мобильного фильтра (filter_sort_1) */
.widget-type_system_widget_v4_filter_sort_1 .filter-item__list-item{display:block}
.widget-type_system_widget_v4_filter_sort_1 .filter-option__btn:before{content:"\2713";background:none}
.widget-type_system_widget_v4_filter_sort_1 .filter-item__head .icon-angle-down:before{content:"▾";font-size:1.1em;line-height:1;font-style:normal}
.widget-type_system_widget_v4_filter_sort_1 .filter-item__list{max-height:260px;overflow-y:auto;scrollbar-width:thin}

/* ===== Карточка товара (product.twig): опции-кнопки ===== */
/* <button class="option-value is-span"> — сбрасываем браузерные дефолты; chip-стили дают pages.css через .is-span.is-span */
.js-chai-product .option-value.is-span{-webkit-appearance:none;appearance:none;font:inherit;cursor:pointer}
/* Ряд чипов: flex с равным gap; pages.css ставит только flex-wrap без display:flex */
.js-chai-product .option-values{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0}
/* Убираем margin у чипа (gap заменяет); специфичность = pages.css, но грузим позже → выигрываем */
.widget-type_system_widget_v4_product_3 .js-chai-product .option-selector .option-value.is-span{margin:0}

/* ===== Главная: табы (магазины/идеи для подарков) — показываем ТОЛЬКО активный.
   В pages.css позднее правило .tabs__item{display:block} перебивает скрытие → все табы стопкой.
   Перебиваем с widget-скоупом (выше специфичность). ===== */
[class*="widget_v4_shops"] .tabs__item:not(.is-active),
[class*="special_products_tabs"] .tabs__item:not(.is-active){display:none !important}
[class*="widget_v4_shops"] .tabs__item.is-active,
[class*="special_products_tabs"] .tabs__item.is-active{display:block}

/* ===== Страница поиска (search.twig): форма уточнения ===== */
.search-refine{display:flex;flex-direction:column;gap:10px}
.search-refine__row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.search-refine__field{flex:1 1 280px;min-width:0}
.search-refine__cat{flex:0 1 240px}
.search-refine__opts{display:flex;gap:20px;flex-wrap:wrap}
.search-refine__check{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:.95rem}
@media (max-width:767px){.search-refine__row{flex-direction:column;align-items:stretch}.search-refine__cat,.search-refine__field{flex:1 1 auto}}

/* ===== Форма отзывов (product.twig) ===== */
.review-form{max-width:560px;display:flex;flex-direction:column;gap:14px;margin-top:16px}
.review-form__title{margin:0 0 4px}
.review-form__field{display:flex;flex-direction:column;gap:6px}
.review-form__label{font-weight:600;font-size:.95rem}
.review-form__note{font-size:.8rem;color:#888}
.review-form__rating{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.review-form__rating-hint{font-size:.85rem;color:#888}
.review-form__star{cursor:pointer;line-height:1;display:inline-block}
.review-form__star input{position:absolute;opacity:0;width:0;height:0}
.review-form__star-ico:before{content:"\2605";font-size:1.7rem;color:#d9d9d9;transition:color .12s}
.review-form__star:hover .review-form__star-ico:before,.review-form__star.is-filled .review-form__star-ico:before{color:#FFB400}
.review-form__login{margin-top:8px}

/* ===== 404 ===== */
.error-page{text-align:center;padding:20px 0;max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:16px;align-items:center}
.error-page__text{color:#555}

/* ===== Аккаунт: логин/регистрация/восстановление ===== */
.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.auth-card{border:1px solid #ececec;border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:12px}
.auth-card__title{margin:0 0 4px;font-size:1.25rem}
.auth-card__text{color:#555;flex:1}
.auth-form{display:flex;flex-direction:column;gap:14px}
.auth-form__field{display:flex;flex-direction:column;gap:6px}
.auth-form__label{font-weight:600;font-size:.9rem}
.auth-form__forgot{font-size:.85rem;margin-top:4px;display:inline-block}
.auth-card .button,.auth-form .button{align-self:flex-start}
@media (max-width:767px){.auth-grid{grid-template-columns:1fr}.auth-card .button,.auth-form .button{align-self:stretch;text-align:center}}
.auth-card_single{max-width:520px}
.auth-form__controls{display:flex;gap:12px;flex-wrap:wrap}
.auth-form_wide{max-width:620px}
.auth-intro{color:#555;margin:0 0 16px}
.auth-form__legend{font-size:1.1rem;font-weight:700;margin:18px 0 10px;border-bottom:1px solid #ececec;padding-bottom:6px}
.auth-form__radios{display:flex;gap:18px;flex-wrap:wrap}
.auth-form__radio{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.auth-form__submit{display:flex;flex-direction:column;gap:12px;align-items:flex-start;margin-top:18px}
.auth-form__agree{display:inline-flex;align-items:flex-start;gap:8px;cursor:pointer;font-size:.9rem}
.auth-form__agree a{text-decoration:underline}


/* ===== from agent: A5-кабинет ===== */
/* ===== Личный кабинет (A5) ===== */
/* Дашборд-ссылки */
.account-dash{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:24px;align-items:start}
.account-dash__group{border:1px solid #ececec;border-radius:12px;padding:20px 22px}
.account-dash__title{margin:0 0 12px;font-size:1.15rem}
.account-dash__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.account-dash__list a{text-decoration:none}
.account-dash__list a:hover{text-decoration:underline}

/* Заголовки секций внутри кабинета */
.account-subtitle{margin:24px 0 12px;font-size:1.15rem}
.account-subtitle:first-child{margin-top:0}
.account-subtitle_minor{font-size:.95rem;font-weight:700;margin:0 0 8px}

/* Таблицы заказов/избранного (co-table) */
.co-table{width:100%;border-collapse:collapse;margin:0 0 8px}
.co-table-cell{padding:12px 14px;border-bottom:1px solid #ececec;text-align:left;vertical-align:middle}
.co-table-row--head .co-table-cell--head{font-weight:700;border-bottom:2px solid #e0e0e0;white-space:nowrap}
.co-table-row--body:hover .co-table-cell--body{background:#fafafa}
.co-table-cell--foot{font-weight:600}
.account-table__image img{max-width:64px;height:auto;border-radius:6px;display:block}
.account-table__actions{white-space:nowrap;display:flex;gap:8px;flex-wrap:wrap}
.account-table__total-label{text-align:right}
.account-table .price s{color:#999}

/* Информация о заказе (co-order-information) */
.co-order-information{border:1px solid #ececec;border-radius:12px;padding:6px 20px;margin:0 0 8px}
.co-order-information_row{display:flex;gap:16px;padding:10px 0;border-bottom:1px solid #f0f0f0;flex-wrap:wrap}
.co-order-information_row:last-child{border-bottom:0}
.co-order-information_title{flex:0 0 220px;color:#777;font-size:.92rem}
.co-order-information_value{flex:1 1 240px;min-width:0}

/* Адреса в заказе + комментарий */
.account-address-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin:0 0 8px}
.account-address-box{border:1px solid #ececec;border-radius:12px;padding:16px 18px;line-height:1.5}

/* Адресная книга — карточки */
.account-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin:0 0 8px}
.account-card{border:1px solid #ececec;border-radius:12px;padding:18px 20px;display:flex;flex-direction:column;gap:14px;justify-content:space-between}
.account-card__body{line-height:1.5}
.account-card__actions{display:flex;gap:10px;flex-wrap:wrap}

/* Кнопочные ряды и пагинация */
.account-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.account-actions_split{justify-content:space-between}
.account-pagination{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:16px}
.account-pagination__results{color:#777;font-size:.9rem}

/* Required-метка для адресной формы (auth-form переиспользуется) */
.auth-form__field.required>.auth-form__label::after{content:" *";color:#c0392b}

/* Адаптив: таблицы -> карточки (как co-table--to_card) */
@media (max-width:767px){
  .account-dash,.account-cards,.account-address-cols{grid-template-columns:1fr}
  .co-table thead{position:absolute;left:-9999px}
  .co-table,.co-table tbody,.co-table tfoot,.co-table tr,.co-table td{display:block;width:100%}
  .co-table .co-table-row--body,.co-table .co-table-row--foot{border:1px solid #ececec;border-radius:10px;margin-bottom:14px;padding:6px 4px}
  .co-table .co-table-cell{border:0;padding:8px 14px;display:flex;justify-content:space-between;gap:12px;text-align:right}
  .co-table .co-table-cell[data-title]::before{content:attr(data-title);font-weight:600;color:#777;text-align:left}
  .account-table__image,.account-table__actions{justify-content:flex-start}
  .co-order-information_title{flex:1 1 100%}
  .account-actions_split{flex-direction:column}
  .account-actions_split .button{width:100%;text-align:center}
}

/* ===== from agent: A6A7-модалки ===== */
/* ===== Модалки быстрого заказа / обратного звонка (A6+A7) ===== */
/* Скоупим под .modal-callback-wrap, чтобы не задеть модалки special-products. */
.modal-callback-wrap{position:fixed;inset:0;z-index:var(--zindex-modal,1040)}
.modal-callback-wrap .modal__overlay{position:fixed;inset:0;display:block;background:rgba(0,0,0,.55);z-index:1}
/* Окно поверх подложки: центрируем карточку, пустые зоны прокликиваются на overlay (закрытие). */
.modal-callback-wrap .modal__window{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;overflow-y:auto;z-index:2;pointer-events:none}
.modal-callback-wrap .modal__container{pointer-events:auto;width:100%;max-width:480px;max-height:90vh;overflow-y:auto;padding:0;background-color:var(--preview-background,#fff);border-radius:var(--border-radius,12px);box-shadow:0 12px 40px rgba(0,0,0,.25)}
/* Карточка callback внутри — без лишних отступов контейнера, отступы дают .callback__head/__main. */
.modal-callback-wrap .layout__content{max-width:none;padding:0}
.modal-callback-wrap .callback__head{border-top-left-radius:var(--border-radius,12px);border-top-right-radius:var(--border-radius,12px)}
.modal-callback-wrap .callback__field-error:empty{display:none}
/* Экран успеха (после отправки) */
.modal-callback-wrap .callback__form.is-sended .callback__content{display:none}
.modal-callback-wrap .callback__form.is-sended .callback__success-message{display:block}
/* Ссылка-триггер «Обратный звонок» в подвале */
.footer__callback{margin-top:.5rem}
.footer__callback-link{color:rgb(236,240,241);text-decoration:underline;cursor:pointer;font-size:.95rem}
.footer__callback-link:hover{text-decoration:none}

/* ===== Модалка выбора опций (сложные товары: фасовка/помол/вид) ===== */
.modal-callback-wrap.modal-product-options .modal__container{max-width:460px}
.product-options-modal{position:relative;width:100%;padding:1.6rem 1.5rem 1.5rem}
.product-options-modal__close{position:absolute;top:.6rem;right:.6rem;width:2.2rem;height:2.2rem;display:flex;align-items:center;justify-content:center;padding:0;border:none;border-radius:50%;background:transparent;color:#999;cursor:pointer;z-index:2}
.product-options-modal__close:hover{background:#f2f2f2;color:#222}
.product-options-modal__head{display:flex;gap:1rem;align-items:flex-start;margin-bottom:1.15rem;padding-right:1.5rem}
.product-options-modal__photo{flex:0 0 96px;width:96px}
.product-options-modal__photo .img-ratio{position:relative;padding-top:100%;border-radius:10px;overflow:hidden;background:#f7f7f7}
.product-options-modal__photo .img-ratio__inner{position:absolute;inset:0}
.product-options-modal__photo img{width:100%;height:100%;object-fit:contain}
.product-options-modal__info{flex:1;min-width:0}
.product-options-modal__title{font-size:1.05rem;font-weight:600;line-height:1.3;margin-bottom:.45rem;color:var(--color-text,#222)}
.product-options-modal__price{font-size:1.3rem;font-weight:700;color:#FC5600}
.product-options-modal__price .product-preview__price-cur{color:inherit}
.product-options-modal__options{margin-bottom:1.3rem}
.product-options-modal__options .option{margin-bottom:.9rem}
.product-options-modal__options .option:last-child{margin-bottom:0}
.product-options-modal__options .option-label{display:block;font-size:.82rem;color:#888;margin-bottom:.45rem}
.product-options-modal__options .option-values{display:flex;flex-wrap:wrap;gap:.5rem}
/* Чипы вариантов НЕ переопределяем: модалка использует ту же разметку
   (label.option-value.is-radio > span), что и карточка каталога, поэтому
   стили берутся 1:1 с InSales из `.js-chai-card .option-value.is-radio > span`
   (единственный бордер 2px на внутреннем span). Прежний «самодостаточный»
   блок давал ВТОРОЙ бордер/фон на самом label — удалён (двойная пилюля). */
.product-options-modal__add{width:100%;justify-content:center}
.product-options-modal__detail{display:block;text-align:center;margin-top:.8rem;font-size:.9rem;color:#999;text-decoration:underline}
.product-options-modal__detail:hover{color:#FC5600}

/* ===== from agent: A11-блог ===== */
/* ===== A11 Blog: статья (список 100% переиспользует CSS темы .widget-type_system_widget_v4_blog_1, новых правил не требует) ===== */
.widget-type_system_widget_v4_article_1 .blog-article{max-width:820px;margin:0 auto}
.widget-type_system_widget_v4_article_1 .blog-article__date{color:var(--color-text-half-shade);margin:0 0 1.25rem}
.widget-type_system_widget_v4_article_1 .blog-article__photo{margin:0 0 1.75rem}
.widget-type_system_widget_v4_article_1 .blog-article__photo img{border-radius:var(--img-border-radius,6px)}
.widget-type_system_widget_v4_article_1 .blog-article__body{line-height:1.5}
.widget-type_system_widget_v4_article_1 .blog-article__body img{max-width:100%;height:auto;border-radius:var(--img-border-radius,6px)}
.widget-type_system_widget_v4_article_1 .blog-article__back{margin-top:2rem}


/* ===== B1-корзина ===== */
/* Добавить в catalog/view/theme/default/stylesheet/chai/custom.css
   (НЕ редактировал custom.css сам — отдаю текстом по правилам).
   Все остальные классы корзины (.cart, .cart-item, .item-image/title/price/counter/total/delete,
   .cart__area-items/-controls/-coupon, .coupon-*, .submit-block, .button*, .counter*) уже
   определены в cart-checkout.css под скоупом .widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0,
   который я навесил на обёртку #checkout-cart, поэтому новый CSS нужен только для таблицы итогов,
   которую я отрисовал серверно вместо JS-блока .total из оригинала. */

.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart-totals {
  width: 100%;
  border-collapse: collapse;
  margin-top: 0.5rem;
}
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart-totals__row td {
  padding: 0.35rem 0;
  vertical-align: baseline;
}
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart-totals__label {
  color: var(--color-text-half-shade);
}
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart-totals__value {
  text-align: right;
  white-space: nowrap;
  font-weight: 500;
}
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart-totals__row.total td {
  padding-top: 0.6rem;
  border-top: 1px solid var(--bg-major-shade);
  font-size: 1.5rem;
  line-height: 1.8rem;
}
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart-totals__row.total .cart-totals__value {
  font-weight: 600;
}
/* кнопка купона не должна прятаться на мобиле — мы используем её как явный submit (без авто-сабмита формы) */
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart__area-coupon .coupon-content .coupon-button {
  display: inline-block;
}

/* ===== B2-чекаут ===== */
/* ===== B2: Чекаут (checkout/*) — наши классы, bootstrap выпилен ===== */
/* Каркас аккордеона: шаги стопкой (collapse-плагина нет — все шаги видимы) */
.co-checkout{display:flex;flex-direction:column;gap:18px;margin:0}
.co-step{border:1px solid #ececec;border-radius:12px;overflow:hidden;background:#fff}
.co-step__head{padding:14px 20px;background:#f7f9f9;border-bottom:1px solid #ececec}
.co-step__title{margin:0;font-size:1.05rem;font-weight:700;line-height:1.2}
.co-step__title a{color:#04A1A4;text-decoration:none}
.co-step__title a:hover{color:#FC5600}
.co-step__title .fa{margin-left:6px;font-size:.8em;opacity:.6}
/* Тело шага: всегда видно (нейтрализуем bootstrap .collapse{display:none}) */
.co-step__collapse.collapse,.co-step__collapse.panel-collapse{display:block;height:auto}
.co-step__body{padding:20px}
.co-step__body:empty{display:none}
/* Пустой шаг (ещё не загружен AJAX) — прячем заголовок-плейсхолдер */
.co-step:has(.co-step__body:empty){display:none}

/* Две колонки внутри шага (детали/адрес) */
.co-step__grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.co-step__col{min-width:0}
.co-step__subtitle{margin:0 0 12px;font-size:1.15rem}
.co-step__lead{margin:0 0 12px;font-weight:600}

/* Поля формы (co-input) */
.co-input{margin:0 0 14px}
.co-input-label{display:block;margin-bottom:6px;font-weight:600;font-size:.9rem}
.co-input.required>.co-input-label::after,
.co-step__col .co-input.required>.co-input-label::after{content:" *";color:#c0392b}
.co-input-field{display:block}
.co-input .form-control{width:100%}
.co-input.has-error .form-control{border-color:#c0392b}

/* Фисет (детали/пароль/адрес) */
.co-fieldset{border:0;padding:0;margin:0 0 18px;min-width:0}
.co-fieldset__legend{display:block;width:100%;font-size:1.05rem;font-weight:700;margin:0 0 12px;padding-bottom:6px;border-bottom:1px solid #ececec}

/* Дата/время-пикеры: нейтрализуем bootstrap .input-group */
.co-input .input-group{display:flex;align-items:stretch;gap:8px}
.co-input .input-group .form-control{flex:1 1 auto}
.co-input .input-group-btn{display:inline-flex;align-items:center}

/* Выбор способа доставки/оплаты (radio) */
.co-method__group-title{margin:14px 0 8px;font-size:.95rem}
.co-method__list{display:flex;flex-direction:column;gap:8px;margin:0 0 16px}
.co-method__option{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid #ececec;border-radius:10px;cursor:pointer;transition:.15s}
.co-method__option:hover{border-color:#04A1A4}
.co-method__option input{margin-top:2px}
.co-method__option-text{flex:1}

/* Выбор сохранённого/нового адреса */
.co-address-form__choice{margin:0 0 16px}

/* Чекбоксы согласия/рассылки/доставки + кнопка шага */
.co-step__agree{margin:14px 0}
.co-step__submit{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-top:20px}

/* Таблица подтверждения заказа (co-table из custom.css) */
.co-confirm{margin:0 0 18px}
.co-confirm-table .co-table-cell{text-align:left}
.co-confirm-table__total-label{text-align:right;font-weight:600}
.co-confirm__recurring{display:inline-block;background:#e9f6f6;color:#04A1A4;border-radius:6px;padding:1px 8px;font-size:.8rem}

@media (max-width:767px){
  .co-step__grid{grid-template-columns:1fr}
  .co-step__submit .button,.co-step__submit input.button{width:100%;text-align:center}
  /* co-table -> карточки (правила уже есть в custom.css; страхуем подтверждение) */
  .co-confirm-table thead{position:absolute;left:-9999px}
}


/* ===== главная-фиделити (fidelity) ===== */
/* ===========================================================================
   Дополнение к pages.css для главной (вернуть текстом — НЕ редактировать custom.css).
   Большинство классов главной уже есть в pages.css (.promo-slider, .collections,
   .collection-preview*, .special-products*, .banner-list*, .delimeter*,
   .article-list*, .special-article*, .tabs*, .grid-list.catalog-list).
   Ниже — только то, чего в теме не было: обёртки viewed-products и
   collections-and-subcollections (мобильная сетка категорий).
   =========================================================================== */

/* Ранее просмотренные: на сервере слайдер пустой (наполняется на клиенте),
   скрываем секцию пока в списке нет слайдов, как в оригинале (.is-empty-*). */
.widget-type_system_widget_v4_viewed_products_1.is-empty-viewed_products
  .splide__list:empty { display: none; }
.widget-type_system_widget_v4_viewed_products_1.is-empty-viewed_products:has(.splide__list:empty) {
  display: none;
}
.viewed-products .special-products__head { margin-bottom: 1rem; }

/* Коллекции и подколлекции — мобильная сетка категорий (десктоп скрыт через --hide-desktop). */
.collections-and-subcollections .grid-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(var(--grid-list-min-width, 270px), 100%), 1fr));
  row-gap: var(--grid-list-row-gap, 1.5rem);
  column-gap: var(--grid-list-column-gap, 1.5rem);
}
.collections-and-subcollections .collection-preview__content { height: 100%; }

/* Уважать флаги виджета --hide-desktop / --hide-mobile (если в theme их нет). */
@media (min-width: 769px) {
  .layout[style*="--hide-desktop:true"] { display: none; }
}
@media (max-width: 768px) {
  .layout[style*="--hide-mobile:true"] { display: none; }
}


/* ===== категория-фиделити (fidelity) ===== */
/* Новый CSS НЕ требуется. Все классы из правок уже определены в теме:
   - .product-preview__area-description / .product-preview__description — есть в pages.css/core-css.css
   - .static-text — есть в pages.css (13 вхождений)
   - .collection_description виджет рендерится через стандартные .layout/.layout__content/.static-text
   Подтверждено grep по pages.css + core-css.css. */


/* ===== фиделити: главная + категория (2026-06-22) ===== */
/* ===== главная-фиделити ===== */
/* ===========================================================================
   Дополнение к pages.css для главной (вернуть текстом — НЕ редактировать custom.css).
   Большинство классов главной уже есть в pages.css (.promo-slider, .collections,
   .collection-preview*, .special-products*, .banner-list*, .delimeter*,
   .article-list*, .special-article*, .tabs*, .grid-list.catalog-list).
   Ниже — только то, чего в теме не было: обёртки viewed-products и
   collections-and-subcollections (мобильная сетка категорий).
   =========================================================================== */

/* Ранее просмотренные: на сервере слайдер пустой (наполняется на клиенте),
   скрываем секцию пока в списке нет слайдов, как в оригинале (.is-empty-*). */
.widget-type_system_widget_v4_viewed_products_1.is-empty-viewed_products
  .splide__list:empty { display: none; }
.widget-type_system_widget_v4_viewed_products_1.is-empty-viewed_products:has(.splide__list:empty) {
  display: none;
}
.viewed-products .special-products__head { margin-bottom: 1rem; }

/* Коллекции и подколлекции — мобильная сетка категорий (десктоп скрыт через --hide-desktop). */
.collections-and-subcollections .grid-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(var(--grid-list-min-width, 270px), 100%), 1fr));
  row-gap: var(--grid-list-row-gap, 1.5rem);
  column-gap: var(--grid-list-column-gap, 1.5rem);
}
.collections-and-subcollections .collection-preview__content { height: 100%; }

/* Уважать флаги виджета --hide-desktop / --hide-mobile (если в theme их нет). */
@media (min-width: 769px) {
  .layout[style*="--hide-desktop:true"] { display: none; }
}
@media (max-width: 768px) {
  .layout[style*="--hide-mobile:true"] { display: none; }
}

/* ===== категория-фиделити ===== */
/* Новый CSS НЕ требуется. Все классы из правок уже определены в теме:
   - .product-preview__area-description / .product-preview__description — есть в pages.css/core-css.css
   - .static-text — есть в pages.css (13 вхождений)
   - .collection_description виджет рендерится через стандартные .layout/.layout__content/.static-text
   Подтверждено grep по pages.css + core-css.css. */

/* ============================================================
   Галерея товара: вертикальные превью + стрелки сверху/снизу
   (исходная InSales-вёрстка рассчитана на горизонтальную ленту,
    из-за вертикального режима стрелки лево/право накладывались)
   ============================================================ */
.product__gallery-tumbs > .splide { position: relative; padding: 2.4rem 0; }

/* контейнер стрелок не перехватывает клики по ленте */
.product__gallery-tumbs .splide .splide__arrows { position: static; }

/* круглые кнопки по центру сверху/снизу, всегда видимы */
.product__gallery-tumbs .splide .splide__arrow,
.product__gallery-tumbs:hover .splide .splide__arrow {
  position: absolute; left: 50%; right: auto; transform: translateX(-50%);
  width: 2.2rem; height: 2.2rem; border-radius: 50%;
  background: #fff; border: 1px solid var(--color-border, #e3e3e3);
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
  display: flex; align-items: center; justify-content: center;
  opacity: 1; z-index: 3; transition: background .15s, color .15s;
}
.product__gallery-tumbs .splide .splide__arrow.splide__arrow--prev { top: 0; bottom: auto; }
.product__gallery-tumbs .splide .splide__arrow.splide__arrow--next { bottom: 0; top: auto; }
.product__gallery-tumbs .splide .splide__arrow-icon { font-size: 1.05rem; color: var(--color-text, #333); }
.product__gallery-tumbs .splide .splide__arrow:hover { background: var(--color-accent, #0ABAB5); border-color: var(--color-accent, #0ABAB5); }
.product__gallery-tumbs .splide .splide__arrow:hover .splide__arrow-icon { color: #fff; }
.product__gallery-tumbs .splide .splide__arrow:disabled,
.product__gallery-tumbs:hover .splide .splide__arrow:disabled { opacity: .3; display: flex; }

/* превью — целиком в квадрате (contain), без кропа */
.product__gallery-tumbs .product__photo-tumb { background: #fff; border-radius: 8px; overflow: hidden; }
.product__gallery-tumbs .product__photo-tumb img { object-fit: contain !important; }

/* ============================================================
   Дефолтные OC-алерты (checkout/login/купон и пр.) — красиво,
   без поломки вёрстки. Bootstrap выпилен, поэтому .close/.fa
   и dismissible-вариант надо оформить вручную.
   ============================================================ */
.alert { display: flex; align-items: center; gap: .5rem; animation: chaiAlertIn .22s ease both; }
@keyframes chaiAlertIn { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: none; } }
.alert-dismissible { position: relative; padding-right: 2.75rem; }
.alert .close,
.alert-dismissible .close {
  position: absolute; top: 50%; right: .6rem; transform: translateY(-50%);
  width: 1.7rem; height: 1.7rem; line-height: 1.6rem; text-align: center;
  padding: 0; margin: 0; border: 0; background: transparent; cursor: pointer;
  font-size: 1.4rem; font-weight: 400; color: inherit; opacity: .5; border-radius: 50%;
  transition: opacity .15s, background .15s;
}
.alert .close:hover { opacity: 1; background: rgba(0,0,0,.08); }
/* FontAwesome не подключён — прячем пустые fa-иконки (иначе «квадратик»/сдвиг) */
.alert .fa { display: none; }
/* Купонный нотис в корзине — отступ снизу, перенос длинного текста */
.coupon-notice { word-break: break-word; line-height: 1.35; }

/* ============================================================
   Одностраничный чекаут Chai (checkout/checkout)
   ============================================================ */
.co__grid { display: grid; grid-template-columns: 1fr 360px; gap: 2rem; align-items: start; }
@media (max-width: 900px) { .co__grid { grid-template-columns: 1fr; } }
.co__main { display: grid; gap: 1.25rem; }
.co-block { border: 1px solid var(--bg-major-shade, #ececec); border-radius: 12px; overflow: hidden; background: #fff; }
.co-block__title { padding: 0.9rem 1.25rem; font-weight: 600; font-size: 1.1rem; background: var(--bg-minor-shade, #f7f9f9); border-bottom: 1px solid var(--bg-major-shade, #ececec); }
.co-block__body { padding: 1.25rem; display: grid; gap: 1rem; }
.co-field { display: grid; gap: .35rem; }
.co-field__label { font-size: .92rem; color: var(--color-text-half-shade, #555); }
.co-field__label span { color: var(--color-error, #d33); }
.co-field__error { color: var(--color-error, #d33); font-size: .85rem; min-height: 0; }
.co-input.co-has-error, .co-field.co-has-error .co-input { border-color: var(--color-error, #d33); }
.co-methods { display: grid; gap: .6rem; }
.co-methods.co-has-error { outline: 1px solid var(--color-error, #d33); border-radius: 8px; padding: .5rem; }
.co-method { display: flex; align-items: center; gap: .6rem; padding: .75rem 1rem; border: 1px solid var(--bg-major-shade, #e3e3e3); border-radius: 8px; cursor: pointer; transition: border-color .15s, background .15s; }
.co-method:hover { border-color: var(--color-accent, #0ABAB5); }
.co-method input { margin: 0; }
.co-method__title { flex: 1; }
.co-method__price { font-weight: 600; white-space: nowrap; }
.co-note { color: var(--color-text-half-shade, #777); font-size: .92rem; }

.co__aside { position: sticky; top: 1.5rem; }
.co-summary { border: 1px solid var(--bg-major-shade, #ececec); border-radius: 12px; background: var(--bg-minor-shade, #f7f9f9); padding: 1.25rem; display: grid; gap: 1rem; }
.co-summary__title { font-weight: 600; font-size: 1.15rem; }
.co-summary__items { display: grid; gap: .75rem; max-height: 320px; overflow-y: auto; }
.co-summary__item { display: grid; grid-template-columns: 48px 1fr auto; gap: .6rem; align-items: center; }
.co-summary__img img { width: 48px; height: 48px; object-fit: contain; background: #fff; border-radius: 6px; }
.co-summary__name { font-size: .9rem; line-height: 1.25; }
.co-summary__opt { font-size: .8rem; color: var(--color-text-half-shade, #777); }
.co-summary__qty { font-size: .8rem; color: var(--color-text-half-shade, #777); }
.co-summary__price { font-weight: 600; white-space: nowrap; font-size: .9rem; }
.co-summary__totals { width: 100%; border-collapse: collapse; border-top: 1px solid var(--bg-major-shade, #e3e3e3); padding-top: .5rem; }
.co-summary__error { color: var(--color-error, #d33); font-size: .9rem; }
.co-summary__error:empty { display: none; }
.co-summary__submit { width: 100%; }
.co-summary__submit.is-loading { opacity: .7; pointer-events: none; }
.co-summary__back { text-align: center; font-size: .9rem; color: var(--color-accent-text, #0ABAB5); }

/* ============================================================
   Одностраничный чекаут Chai — мелкие дополнения поверх InSales checkout2.css
   (раскладку _sided/co-sidebar/co-basket и стили co-* рисует сам checkout2.css)
   ============================================================ */
.co-button--checkout.is-loading { opacity: .65; pointer-events: none; }
#co-checkout-error { margin: 1rem 0; }
.co-checkout-login_hint { margin-top: 1.25rem; font-size: .95rem; color: var(--color-text-half-shade, #555); }
/* центрирование модалки входа (в InSales его ставит jquery.modal через JS) */
.co-modal--login { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#sms-countdown-block { font-size: .85rem; color: var(--color-text-half-shade, #777); margin-top: .6rem; text-align: center; }

/* ===== Чекаут: баннер входа сверху + промокод в сайдбаре ===== */
.co-login-banner { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; background: #fff6ec; border: 1px solid #f0d9bf; border-radius: 10px; padding: .85rem 1.1rem; margin-bottom: 1rem; }
.co-login-banner--ok { background: #eaf7ec; border-color: #bfe6c8; }
.co-login-banner__text { flex: 1 1 240px; font-size: .95rem; color: #6b5436; }
.co-login-banner__ok { color: #1d7a33; font-weight: 500; }
.co-login-banner__btn { white-space: nowrap; }
.co-basket_promo { margin: 1rem 0 .5rem; }
.co-basket_promo-row { display: flex; gap: .5rem; }
.co-basket_promo-input { flex: 1 1 auto; }
.co-basket_promo-btn { white-space: nowrap; flex: 0 0 auto; }
.co-basket_promo-msg:empty { display: none; }
.co-notice--ok { color: #1d7a33 !important; }

/* ===== Чекаут: модалка выбора ПВЗ на Яндекс.Карте ===== */
.co-modal--pick_up_modal {
  /* центрирование как у co-modal--login (база .co-modal даёт только position:fixed) */
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: min(80vw, 1000px); max-width: 95%; max-height: 92vh;
  border-radius: 14px; box-shadow: 0 12px 40px rgba(0,0,0,.22);
  overflow: hidden; display: flex; flex-direction: column;
}
.co-modal--pick_up_modal .co-modal-wrapper { padding: 1.25rem 1.5rem 1.5rem; display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto; }
.co-modal--pick_up_modal .co-modal-title { margin: 0 2rem .9rem 0; }
.co-pvz { display: flex; flex-direction: column; gap: .75rem; min-height: 0; flex: 1 1 auto; }
.co-pvz__search { width: 100%; padding: .6rem .8rem; box-sizing: border-box; border: 1px solid var(--bg-major-shade,#e3e3e3); border-radius: 8px; }
.co-pvz__search:focus { outline: none; border-color: var(--color-accent-text,#0ABAB5); }
.co-pvz__body { display: grid; grid-template-columns: 340px 1fr; gap: 1rem; flex: 1 1 auto; min-height: 360px; }
@media (max-width: 700px) { .co-pvz__body { grid-template-columns: 1fr; } .co-pvz__map { height: 300px; min-height: 300px; } }
.co-pvz__list { overflow-y: auto; border: 1px solid var(--bg-major-shade,#e3e3e3); border-radius: 10px; background: #fff; }
.co-pvz__map { border-radius: 10px; overflow: hidden; min-height: 320px; background: #eef1f3; border: 1px solid var(--bg-major-shade,#e3e3e3); }
.co-pvz__point { padding: .75rem .9rem; border-bottom: 1px solid #f0f0f0; cursor: pointer; border-left: 3px solid transparent; transition: background .12s, border-color .12s, box-shadow .12s; }
.co-pvz__point:last-child { border-bottom: none; }
.co-pvz__point:hover { background: var(--bg-minor-shade,#f1f8f8); }
/* выбранная точка — обводка-прямоугольник в стиле co-toggable */
.co-pvz__point.is-selected { background: var(--bg-minor-shade,#eafaf9); border-left-color: var(--color-accent-text,#0ABAB5); box-shadow: inset 0 0 0 2px var(--color-accent-text,#0ABAB5); border-radius: 8px; }
.co-pvz__point-name { font-weight: 600; font-size: .92rem; }
.co-pvz__point-addr { font-size: .85rem; color: var(--color-text-half-shade,#666); }
.co-pvz__point-meta { font-size: .8rem; color: #999; margin-top: .2rem; }
.co-pvz__point-pick { margin-top: .55rem; }
.co-pvz__point.is-selected .co-pvz__point-pick { background: var(--color-accent-text,#0ABAB5); color: #fff; }
.co-pvz__status { font-size: .9rem; color: var(--color-text-half-shade,#777); }
.co-pvz-chosen:not(:empty) { display: block; margin-top: .35rem; font-size: .85rem; color: #1d7a33; }
.co-delivery_method .js-pvz-map { font-size: .9rem; }

/* ===== Модалка входа: 2 шага (телефон → код) ===== */
.co-login-hint { font-size: .9rem; line-height: 1.45; color: var(--color-text-half-shade,#6b6b6b); margin: 0 0 1rem; }
#sms-step-code[hidden], #sms-step-phone[hidden] { display: none !important; } /* страховка от правил checkout2.css */
#sms_code { letter-spacing: .4em; text-align: center; font-size: 1.25rem; }
.co-login-resend { margin-top: .9rem; text-align: center; }
/* обе кнопки — каждая своей строкой по центру, иначе вставали вплотную */
.co-login-resend__btn, .co-login-resend__sms { display: block; width: -moz-fit-content; width: fit-content; margin-left: auto; margin-right: auto; background: none; border: 0; padding: .25rem 0; cursor: pointer; font-size: .9rem; line-height: 1.35; text-align: center; color: var(--color-accent-text,#0ABAB5); }
.co-login-resend__sms { margin-top: .35rem; }
/* пока идёт отсчёт, кнопка видна, но не нажимается — показываем это цветом */
.co-login-resend__btn[disabled] { color: var(--color-text-secondary,#9a9a9a); cursor: default; }
.co-login-resend__btn[hidden], .co-login-resend__sms[hidden], #sms-countdown-block[hidden] { display: none; }
/* Вход в ЛК по номеру */
.account-login { max-width: 460px; margin: 0 auto; }
.auth-form__error { color: #c0392b; font-size: .85rem; margin-top: .25rem; min-height: 1em; }
/* Глобальная модалка входа */
.modal-login .modal__container.login-modal { max-width: 440px; padding: 1.7rem 1.5rem 1.5rem; position: relative; }
.login-modal__close { position: absolute; top: .55rem; right: .6rem; width: 2.2rem; height: 2.2rem; display: flex; align-items: center; justify-content: center; padding: 0; border: none; background: transparent; color: #999; cursor: pointer; }
.login-modal__close:hover { color: #FC5600; }
.login-modal__title { font-size: 1.2rem; font-weight: 600; margin: 0 0 1rem; }
.login-modal__field { margin-bottom: 1rem; }
.login-modal__label { display: block; margin-bottom: .35rem; font-size: .9rem; color: #555; }

/* ===== Корзина: новые элементы паритета с оригиналом ===== */
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .sidebar-size-items{display:flex;justify-content:space-between;color:var(--color-text-half-shade,#777);font-size:.95rem;margin:.4rem 0 .9rem}
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart-continue-link{display:block;text-align:center;margin-top:.7rem;color:var(--color-text-half-shade,#888);text-decoration:underline;font-size:.95rem}
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart-continue-link:hover{color:#FC5600;text-decoration:none}
/* одиночная кнопка «Удалить» не висит в половине grid */
.widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart-item .item-delete{grid-template-columns:auto;justify-content:flex-start}

/* ===== Заголовки ЛК/входа — в систему .heading (Raleway 600, ~17px) ===== */
.auth-card__title,.auth-form__legend,.account-dash__title,.account-subtitle{font-size:calc(var(--font-size)*var(--heading-ratio)/1.4);font-weight:var(--heading-weight,600);font-family:var(--font-family-heading)}
.account-subtitle_minor{font-size:1rem;font-weight:600;font-family:var(--font-family-heading)}
.auth-form__label{font-weight:500}

/* ============================================================
   Освежение 2026 (аддитивно; фирменные цвета/шрифты/структуру НЕ меняем —
   распространяем приёмы, уже применённые в .bc-* лендингах бренда).
   ============================================================ */
:root{
  --color-form-controls-border-color-focus:#04A1A4;
  --color-form-controls-shadow-focus:0 0 0 3px rgba(4,161,164,.15);
}
/* Кнопки: лёгкий подъём + мягкая тень на hover */
.button{transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease, border-color .15s ease, color .15s ease}
.button:hover{transform:translateY(-1px);box-shadow:0 3px 10px rgba(0,0,0,.10)}
.button:active{transform:translateY(0)}
.button.is-loading,.button:disabled{transform:none;box-shadow:none}
/* БЕЗ тени/подъёма при наведении — по требованию (перебиваем все hover-правила карточек) */
.product-preview{transition:none}
.product-preview:hover{transform:none !important;box-shadow:none !important}
/* Наши карточки кабинета/входа/чекаута — мягкая тень + радиус 14px */
.auth-card,.account-card,.account-dash__group,.co-block,.co-summary{box-shadow:0 1px 3px rgba(0,0,0,.05);border-radius:14px}
.co-step{border-radius:14px}
/* Брендовый бирюзовый фокус-ринг инпутов (доступность) */
.form-control:focus,.co-input-field:focus,input.form-control:focus,textarea.form-control:focus,select.form-control:focus{border-color:var(--color-form-controls-border-color-focus);box-shadow:var(--color-form-controls-shadow-focus);outline:none}
/* Видимый фокус только для клавиатуры */
a:focus-visible,.button:focus-visible,button:focus-visible,.co-method:focus-visible,.catalog-subcat:focus-visible,.option-value:focus-visible{outline:2px solid #04A1A4;outline-offset:2px}
:focus:not(:focus-visible){outline:none}
/* Полировка pill-подкатегорий */
.catalog-subcat{transition:transform .15s ease, background-color .15s ease, color .15s ease, border-color .15s ease}
.catalog-subcat:hover{transform:translateY(-1px)}
/* Уважение системной настройки «меньше движения» */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important;scroll-behavior:auto !important}
  .button:hover,.product-preview:hover,.catalog-subcat:hover{transform:none !important}
}

/* ===== Чекаут: единственный способ оплаты (Т-Банк) ===== */
.co-payment_method--single{display:block;padding:14px 16px;cursor:default}
.co-payment_method--single .co-payment_method-title{display:block;font-weight:600}
.co-payment_method-subtitle{display:block;margin-top:.35rem;font-size:.88rem;color:var(--color-text-half-shade,#777);line-height:1.4}

/* ===== Галерея товара: фикс переполнения фото + вертикальные превью слева ===== */
/* (старые .product__gallery/Splide-стили удалены — галерея переписана на .pgallery ниже) */

/* ============================================================
   Галерея товара v2 (vanilla, заменяет Splide) — 2026-06-24
   ============================================================ */
.pgallery{ position:sticky; top:1rem; display:flex; align-items:flex-start; gap:.85rem; }
.pgallery--single{ display:block; }

/* колонка превью */
.pgallery__thumbs{ display:flex; flex-direction:column; align-items:center; gap:.4rem; flex:0 0 72px; width:72px; }
.pgallery__viewport{ width:100%; flex:1 1 auto; max-height:440px; overflow:hidden; }
.pgallery__track{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.55rem; will-change:transform; transition:transform .3s cubic-bezier(.22,.61,.36,1); }
.pgallery__thumb{ position:relative; width:72px; height:72px; flex:0 0 72px; box-sizing:border-box; border:2px solid #ece9e4; border-radius:12px; background:#fff; cursor:pointer; overflow:hidden; transition:border-color .18s ease, box-shadow .18s ease; }
.pgallery__thumb img{ width:100%; height:100%; object-fit:contain; padding:5px; box-sizing:border-box; display:block; }
.pgallery__thumb:hover{ border-color:#cdd6d6; }
.pgallery__thumb.is-active{ border-color:var(--color-btn-bg,#0ABAB5); box-shadow:0 0 0 1px var(--color-btn-bg,#0ABAB5) inset; }

/* стрелки вверх/вниз */
.pgallery__nav{ flex:0 0 auto; width:34px; height:26px; display:flex; align-items:center; justify-content:center; padding:0; border:none; border-radius:9px; background:transparent; color:#9a9f9f; font-size:1.05rem; line-height:1; cursor:pointer; transition:color .15s, background .15s; }
.pgallery__nav:hover:not(:disabled){ color:var(--color-btn-bg,#0ABAB5); background:#f1f3f3; }
.pgallery__nav:disabled{ opacity:.3; cursor:default; }
.pgallery__nav.is-hidden{ display:none; }

/* сцена с главным фото */
.pgallery__stage{ position:relative; flex:1 1 auto; min-width:0; align-self:flex-start; }
.pgallery__main{ display:block; width:100%; aspect-ratio:1/1; background:#fff; border-radius:16px; overflow:hidden; cursor:zoom-in; }
.pgallery__main img{ width:100%; height:100%; object-fit:contain; display:block; transition:opacity .2s ease; }
.pgallery__main.is-swapping img{ opacity:0; }

/* доступность/стикеры поверх сцены */
.pgallery__stage .product__available{ position:absolute; left:10px; bottom:10px; z-index:2; }
.pgallery__stage .stickers{ position:absolute; left:10px; top:10px; z-index:2; display:flex; flex-direction:column; gap:6px; }

/* лайтбокс */
.pgallery-lb{ position:fixed; inset:0; z-index:5000; display:flex; align-items:center; justify-content:center; background:rgba(18,20,20,.93); opacity:0; visibility:hidden; transition:opacity .22s ease; }
.pgallery-lb.is-open{ opacity:1; visibility:visible; }
.pgallery-lb__img{ max-width:92vw; max-height:88vh; object-fit:contain; border-radius:8px; box-shadow:0 12px 48px rgba(0,0,0,.4); }
.pgallery-lb__close, .pgallery-lb__arrow{ position:absolute; display:flex; align-items:center; justify-content:center; border:none; cursor:pointer; color:#fff; background:rgba(255,255,255,.14); border-radius:50%; transition:background .15s ease; }
.pgallery-lb__close:hover, .pgallery-lb__arrow:hover{ background:rgba(255,255,255,.3); }
.pgallery-lb__close{ top:18px; right:22px; width:46px; height:46px; font-size:1.7rem; line-height:1; }
.pgallery-lb__arrow{ top:50%; transform:translateY(-50%); width:54px; height:54px; font-size:1.7rem; }
.pgallery-lb__arrow--prev{ left:20px; }
.pgallery-lb__arrow--next{ right:20px; }

/* мобайл: превью горизонтально под фото, скролл пальцем, без стрелок */
@media (max-width:767px){
  .pgallery{ flex-direction:column-reverse; gap:.6rem; position:static; }
  .pgallery__thumbs{ flex-direction:row; width:100%; flex:0 0 auto; }
  .pgallery__nav{ display:none; }
  .pgallery__viewport{ width:100%; max-height:none; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; }
  .pgallery__track{ flex-direction:row; transform:none !important; }
  .pgallery__thumb{ width:64px; height:64px; flex:0 0 64px; }
  .pgallery-lb__arrow{ width:44px; height:44px; }
  .pgallery-lb__close{ width:40px; height:40px; }
}

/* ============================================================
   Карточка товара на мобиле (Task 5): фото и артикул накладывались.
   Причина: десктоп-сетка .widget-...product_3 .product{grid-template-
   columns:66%/40% 1fr} (специфичность 0,2,0, без @media) перебивала
   мобильную одноколоночную сетку .product{...} (0,1,0, в @media 992).
   Форсим одноколоночный поток с той же специфичностью внутри @media —
   фото сверху, ниже артикул/название/цена, без наложений.
   ============================================================ */
@media (max-width: 767px) {
  .widget-type_system_widget_v4_product_3 .product,
  .widget-type_system_widget_v4_product_3 .product.is-bundle,
  .widget-type_system_widget_v4_product_3 .product.ajax-product-is-bundle {
    display: flex;
    flex-direction: column;
    grid-column-gap: 0;
  }
  .widget-type_system_widget_v4_product_3 .product__area-photo { width: 100%; margin-bottom: 1rem; }
  .widget-type_system_widget_v4_product_3 .product__area-info { width: 100%; }
}

/* ============================================================
   Бренд-:root СТРАХОВКА (Task 15). core-css.css :root содержит чужие
   демо-дефолты InSales (--color-btn-bg:#6360e0 фиолетовый, system-font).
   Работает только потому, что цвет переопределён инлайном на <html>.
   Дублируем бренд-значения здесь (custom.css грузится последним) — если
   инлайн пропадёт при регрессии, цвета/шрифт останутся брендовыми.
   Инлайн на <html> по специфичности всё равно выше — это лишь фолбэк.
   ============================================================ */
:root {
  --color-btn-bg: #FC5600;
  --color-btn-bg-minor-shade: #fd6f26;
  --color-btn-bg-major-shade: #fd8347;
  --color-btn-bg-half-shade: #fec0a6;
  --color-btn-bg-hover: var(--color-btn-bg-minor-shade);
  /* вторичная кнопка (.button_second) в core-css = индиго #6360e0 (демо InSales):
     это «синий ободок» у «Посмотреть»/«Повторить» в ЛК и пр. Переводим на бренд. */
  --color-btn-second-color: #FC5600;
  --color-btn-second-border-color: #FC5600;
  --color-btn-second-color-hover: #e04e00;
  --color-btn-second-border-color-hover: #e04e00;
  --color-accent-text: #FC5600;
  --color-accent: #0ABAB5;
  /* шрифт НЕ дублируем здесь намеренно: текущая отрисовка тела опирается на
     существующие правила; задавать --font-family тут = глобальная смена шрифта,
     это отдельное осознанное изменение, а не страховка. */
}

/* ============================================================
   Мобильный список категорий на главной (Task 3, исправлено по аудиту).
   Оригинал = одноколоночный СПИСОК-аккордеон: иконка слева + название +
   шеврон справа, по тапу раскрываются подкатегории. Используем НАТИВНУЮ
   разметку .collection-item (CSS уже заскоплен под этот виджет); здесь —
   только мелкая доводка (вписать картинку, стиль подкатегорий, шеврон).
   ============================================================ */
.widget-type_system_widget_v4_collections_and_subcollections_1 .collection-img img {
  width: 100%; height: auto; display: block;
}
.widget-type_system_widget_v4_collections_and_subcollections_1 .collections-show-submenu-btn {
  display: flex; align-items: center; justify-content: center; font-size: 1.2rem;
}
.widget-type_system_widget_v4_collections_and_subcollections_1 .subcollection-items {
  padding: .25rem 0 .5rem; grid-template-columns: 1fr 1fr;
}
.widget-type_system_widget_v4_collections_and_subcollections_1 .subcollection-item {
  font-size: .85rem; color: var(--color-text-minor-shade, #666); text-decoration: none; padding: .15rem 0;
}
.widget-type_system_widget_v4_collections_and_subcollections_1 .subcollection-item:hover { color: var(--color-btn-bg, #FC5600); }

/* ============================================================
   Мобильная поисковая панель (Task 9) — собственное позиционирование.
   ФИКС: базовые правила .navigation-bar-panel в портированном CSS заданы
   ТОЛЬКО как потомок `.widget-..._bottom_navigation_bar_1 .navigation-bar-panel`,
   а наша панель — отдельный элемент (не потомок таб-бара) → те правила не
   срабатывали, панель не получала position:fixed/visibility:hidden, и её
   абсолютный .navigation-bar-search__results растягивался на весь экран и
   перехватывал клики (кнопки «пропадали»/не нажимались). Задаём явно.
   ============================================================ */
#chai-mobile-search-panel {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  z-index: var(--zindex-modal, 9999);
  background: var(--bg, #fff);
  transform: translate3d(-100%, 0, 0);
  visibility: hidden;
  overflow-y: auto;
  transition: transform .3s, visibility .3s;
}
#chai-mobile-search-panel.is-show { transform: translate3d(0, 0, 0); visibility: visible; }

/* ============================================================
   Новости/блог — список (Task 13). Оригинал (wt_article-preview-2,
   layout view_1) = сетка КАРТОЧЕК: фото сверху, дата, заголовок, анонс.
   Наш .blog-list__item был горизонтальным рядом (фото слева) — приводим
   к карточному виду как на оригинале.
   ============================================================ */
.widget-type_system_widget_v4_blog_1 .blog-list.grid-list {
  grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
  grid-row-gap: 2rem; grid-column-gap: 2rem;
}
.widget-type_system_widget_v4_blog_1 .blog-list__item {
  display: flex; flex-direction: column; gap: .55rem;
  background: transparent; height: 100%;
}
.widget-type_system_widget_v4_blog_1 .blog-list__item-photo { order: 0; width: 100%; margin: 0; border-radius: var(--img-border-radius, 6px); overflow: hidden; }
.widget-type_system_widget_v4_blog_1 .blog-list__item-photo img { border-radius: var(--img-border-radius, 6px); width: 100%; }
.widget-type_system_widget_v4_blog_1 .blog-list__item-date {
  order: 1; padding: .5rem 0 0; margin: 0;
  font-size: .8rem; color: var(--color-text-half-shade, #999);
}
.widget-type_system_widget_v4_blog_1 .blog-list__item-title {
  order: 2; padding: 0; font-size: calc(var(--font-size, 16px) * var(--widget-heading-ratio, 1.4));
  font-weight: 600; line-height: 1.25; font-family: var(--font-family-heading, 'Comfortaa', sans-serif);
}
.widget-type_system_widget_v4_blog_1 .blog-list__item-title a { color: var(--color-text, #222); text-decoration: none; }
.widget-type_system_widget_v4_blog_1 .blog-list__item-title a:hover { color: var(--color-btn-bg, #FC5600); }
.widget-type_system_widget_v4_blog_1 .blog-list__item-description {
  order: 3; padding: 0; font-size: 1.05rem; line-height: 1.45;
  color: var(--color-text-minor-shade, #666);
}

/* Мобильная шторка фильтра (Task 8): кнопка «Показать товары» снизу.
   Видна только в мобильной шторке (десктоп-сайдбар её не показывает). */
.filter__mobile-apply-bar { display: none; }
@media (max-width: 767px) {
  .filter.is-show-mobile .filter__mobile-apply-bar {
    display: block; position: sticky; bottom: 0;
    margin: 1rem -16px 0; padding: .9rem 16px;
    background: #fff; border-top: 1px solid var(--bg-major-shade, #eee);
  }
  .filter-mobile-apply { width: 100%; background: var(--color-btn-bg, #FC5600); color: #fff; }
}

/* ============================================================
   Баннеры на мобиле: НЕ квадратом и contain (по замечанию).
   page_banner_1_1 и banner_list_23 на мобиле получали --img-ratio=1
   (правило .banner-list__item-photo{--img-ratio:var(--img-ratio-mobile)}
   с неопределённым --img-ratio-mobile → фолбэк 1 → padding-top:100% =
   квадрат) + object-fit:cover (обрезка). На мобиле показываем картинку
   в НАТУРАЛЬНОМ соотношении на всю ширину, целиком (contain), без обрезки.
   ============================================================ */
@media (max-width: 767px) {
  /* зазоры между баннерами (на мобиле --grid-list-row-gap-mobile не задан → gap:0) */
  .widget-type_system_widget_v4_banner_list_23 .banner-list {
    grid-row-gap: 1rem; row-gap: 1rem; grid-column-gap: 1rem; column-gap: 1rem;
  }
  .widget-type_system_widget_v4_page_banner_1_1 .img-ratio,
  .widget-type_system_widget_v4_banner_list_23 .img-ratio {
    height: auto !important; padding-top: 0 !important; overflow: visible;
  }
  .widget-type_system_widget_v4_page_banner_1_1 .img-ratio__inner,
  .widget-type_system_widget_v4_banner_list_23 .img-ratio__inner {
    position: static !important; height: auto !important;
  }
  .widget-type_system_widget_v4_page_banner_1_1 .img-ratio picture,
  .widget-type_system_widget_v4_banner_list_23 .img-ratio picture { display: block; }
  .widget-type_system_widget_v4_page_banner_1_1 .img-ratio img,
  .widget-type_system_widget_v4_banner_list_23 .img-ratio img {
    position: static !important; width: 100% !important; height: auto !important;
    max-width: 100% !important; max-height: none !important; object-fit: contain !important;
    border-radius: var(--banner-border-radius, 0);
  }
}

/* Оверлей модалок: убираем оранжевый слой. В портированном CSS есть
   .modal__overlay:after{background:var(--color-btn-bg);opacity:.6} (оранж #FC5600)
   поверх тёмного оверлея — отсюда оранжевый фон. Гасим его для наших модалок. */
.modal-callback-wrap .modal__overlay:after { display: none !important; }

/* ============================================================
   Модалка выбора опций — вёрстка как на оригинале:
   фото сверху по центру, название, цена, ссылка «в карточку →»,
   опции, разделитель + атрибуты (Страна/Тип), счётчик + сердечко,
   кнопки «В корзину» и «Купить в 1 клик».
   ============================================================ */
.product-options-modal__form { padding: 1.6rem 1.25rem 1.25rem; display: flex; flex-direction: column; gap: .85rem; text-align: left; }
.product-options-modal__photo { width: 150px; margin: 0 auto; }
.product-options-modal__photo .img-ratio { padding-top: 100%; border-radius: 12px; overflow: hidden; background: #f7f7f7; }
.product-options-modal__photo img { width: 100%; height: 100%; object-fit: contain; }
.product-options-modal__title { font-size: 1.05rem; font-weight: 600; line-height: 1.3; margin: 0; color: var(--color-text, #222); }
.product-options-modal__price { font-size: 1.5rem; font-weight: 700; color: #FC5600; margin: 0; }
.product-options-modal__detail { color: #FC5600; text-decoration: none; font-size: .95rem; font-weight: 500; display: inline-flex; align-items: center; gap: .35rem; width: max-content; }
.product-options-modal__detail:hover { text-decoration: underline; }
.product-options-modal__detail-arrow { font-style: normal; }
.product-options-modal__options { display: flex; flex-direction: column; gap: .6rem; }
.product-options-modal__attrs { border-top: 1px solid #ececec; padding-top: .85rem; display: flex; flex-direction: column; gap: .55rem; }
.product-options-modal__attr { display: flex; flex-direction: column; line-height: 1.25; }
.product-options-modal__attr-name { font-size: .8rem; color: #999; }
.product-options-modal__attr-val { font-size: .95rem; color: #222; }
.product-options-modal__buyrow { display: flex; align-items: center; gap: .75rem; margin-top: .15rem; }
.product-options-modal__counter { flex: 1 1 auto; display: flex; align-items: center; justify-content: space-between; border: 1px solid #e2e2e2; border-radius: 10px; height: 48px; padding: 0 .35rem; }
.product-options-modal__counter-btn { width: 2.4rem; height: 100%; background: none; border: none; font-size: 1.3rem; line-height: 1; color: #333; cursor: pointer; }
.product-options-modal__counter-btn:hover { color: #FC5600; }
.product-options-modal__counter-val { font-size: .95rem; color: #222; }
.product-options-modal__fav { flex: 0 0 48px; width: 48px; height: 48px; border: 1px solid #e2e2e2; border-radius: 10px; background: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; color: #333; font-size: 1.2rem; padding: 0; }
.product-options-modal__fav:hover { border-color: #FC5600; color: #FC5600; }
.product-options-modal__fav .icon-favorites-f { display: none; }
.product-options-modal__fav.favorites-added { border-color: #FC5600; color: #FC5600; }
.product-options-modal__fav.favorites-added .icon-favorites-o { display: none; }
.product-options-modal__fav.favorites-added .icon-favorites-f { display: inline-flex; }
.product-options-modal__add { background: #FC5600 !important; color: #fff !important; border: none; margin: 0; }
.product-options-modal__add:hover { background: #e04e00 !important; }
.product-options-modal__oneclick { background: #f2f2f2 !important; color: #222 !important; border: none; margin: 0; }
.product-options-modal__oneclick:hover { background: #e8e8e8 !important; }

/* Пустая корзина (Task 15): брендовый вид вместо «голого» текста */
.empty-info { color: #777; font-size: 1rem; padding: .5rem 0 1.5rem; }
.empty-info a { color: var(--color-btn-bg, #FC5600); text-decoration: none; border-bottom: 1px solid transparent; transition: border-color .15s; }
.empty-info a:hover { border-bottom-color: currentColor; }

/* ===== КАБИНЕТ: боковое меню + layout ===== */
.account-with-sidebar { display:grid; grid-template-columns:220px 1fr; gap:2.5rem; align-items:start; }
.co-menu--personal { background:var(--bg); border:1px solid var(--bg-half-shade,#e8e8e8); border-radius:12px; overflow:hidden; position:sticky; top:1.5rem; }
.co-menu--personal .co-menu__title { font-weight:700; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--color-text-minor-shade,#888); padding:.9rem 1.1rem .4rem; }
.co-menu--personal .co-menu__list { list-style:none; margin:0; padding:0 0 .5rem; }
.co-menu--personal .co-menu__item { margin:0; }
.co-menu--personal .co-menu__link, .co-menu--personal .co-menu__link:visited { display:block; padding:.55rem 1.1rem; font-size:.92rem; color:var(--color-text,#222); text-decoration:none; border-radius:0; transition:background .15s,color .15s; }
.co-menu--personal .co-menu__link:hover { background:var(--bg-minor-shade,#f5f5f5); color:var(--color-btn-bg,#FC5600); }
.co-menu--personal .co-menu__link.is-active { color:var(--color-btn-bg,#FC5600); font-weight:600; background:rgba(252,86,0,.07); }
.co-menu--personal .co-menu__divider { height:1px; background:var(--bg-half-shade,#e8e8e8); margin:.3rem 0; }
@media (max-width:767px){
  .account-with-sidebar { grid-template-columns:1fr; }
  .co-menu--personal { position:static; margin-bottom:1rem; }
  .co-menu--personal .co-menu__list { display:flex; flex-wrap:wrap; padding:.3rem; gap:.3rem; }
  .co-menu--personal .co-menu__link { padding:.35rem .7rem; border-radius:20px; font-size:.83rem; }
  .co-menu--personal .co-menu__link.is-active { background:var(--color-btn-bg,#FC5600); color:#fff; }
  .co-menu--personal .co-menu__divider,.co-menu--personal .co-menu__title { display:none; }
}

/* Форма кабинета (секции, поля, радио-группы) */
.account-section { margin-bottom:2rem; }
.account-section__title { font-size:1.05rem; font-weight:700; margin-bottom:1rem; padding-bottom:.5rem; border-bottom:1px solid var(--bg-half-shade,#e8e8e8); }
.account-radio-group { display:flex; flex-direction:column; gap:.5rem; }
.account-radio-group.is-inline { flex-direction:row; flex-wrap:wrap; gap:.75rem; }
.account-radio-label { display:flex; align-items:center; gap:.4rem; cursor:pointer; font-size:.95rem; }
.account-radio-label input[type=radio], .account-radio-label input[type=checkbox] { accent-color:var(--color-btn-bg,#FC5600); width:1rem; height:1rem; cursor:pointer; }
.account-summary { background:var(--bg-minor-shade,#f7f7f7); border-radius:10px; padding:1.1rem 1.25rem; margin-bottom:1.5rem; display:grid; grid-template-columns:1fr 1fr; gap:.5rem 1.5rem; }
.account-summary__row { display:contents; }
.account-summary__label { font-size:.85rem; color:var(--color-text-minor-shade,#888); }
.account-summary__value { font-size:.88rem; }
@media (max-width:480px){ .account-summary { grid-template-columns:1fr; } }
/* ===== ORDER: payment badges ===== */
.order-pay-badge { display:inline-block; padding:.2rem .55rem; border-radius:20px; font-size:.78rem; font-weight:600; white-space:nowrap; }
.order-pay-badge--paid { background:rgba(40,167,69,.12); color:#1d7235; }
.order-pay-badge--pending { background:rgba(220,53,69,.1); color:#c0392b; }
.order-pay-badge--cod { background:rgba(108,117,125,.1); color:#555; }
.co-table-cell--right { text-align:right; }

/* ===== Мобильный фикс: off-canvas фильтр/меню не должны вызывать горизонтальный скролл ===== */
@media (max-width:767px){
  html,body{overflow-x:hidden;max-width:100%;}
}

/* ===== Брендовый вес заголовков 600 (а не дефолтные 700 OC/InSales) ===== */
h1,h2,h3,h4,h5,h6,.heading{font-weight:var(--heading-weight,600);}

/* ===== Мобильный нижний таб-бар (перенос адаптива chaicoffee.ru) ===== */
.chai-bottom-nav{display:none;}
@media (max-width:767px){
  .chai-bottom-nav{display:block;position:fixed;left:0;right:0;bottom:0;z-index:1000;background:#fff;border-top:1px solid var(--bg-half-shade,#e8e8e8);padding:.45rem .35rem calc(.45rem + env(safe-area-inset-bottom,0px));box-shadow:0 -2px 10px rgba(0,0,0,.07);}
  .chai-bottom-nav .navigation-bar__item{padding:.1rem 0;}
  .chai-bottom-nav .navigation-bar__icon{font-size:1.4rem;margin-bottom:.2rem;}
  .chai-bottom-nav .navigation-bar__title{font-size:.7rem;}
  .chai-bottom-nav .navigation-bar__item.is-active,
  .chai-bottom-nav .navigation-bar__item.is-active .navigation-bar__icon{color:var(--color-btn-bg,#FC5600);}
  /* место под фиксированный бар, чтобы контент/футер не перекрывались */
  body{padding-bottom:60px;}
  /* кнопка «наверх» не должна налезать на таб-бар */
  .scroll-top,.js-scroll-top,[class*=scroll-top]{bottom:72px !important;}
}

/* ============================================================
   Стрелки слайдеров (Task 7)
   Портированный InSales CSS прячет встроенные стрелки splide
   (.splide__arrow{display:none}) — он рассчитан на ВНЕШНИЕ стрелки
   (.js-move-slide) у товарных рядов. Но геро-слайдер и слайдер
   коллекций на оригинале используют ОВЕРЛЕЙНЫЕ встроенные стрелки —
   возвращаем и стилизуем их для этих двух виджетов.
   (Внешние стрелки товарных рядов чинит правка go('+1'/'-1') в site.js.)
   ============================================================ */
.widget-type_system_widget_v4_promo_slider_14 .splide__arrows,
.widget-type_system_widget_v4_collections_on_index_2 .splide__arrows { display: block; }
.widget-type_system_widget_v4_promo_slider_14 .splide__arrow,
.widget-type_system_widget_v4_collections_on_index_2 .splide__arrow {
  display: flex; align-items: center; justify-content: center;
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 4;
  width: 2.6rem; height: 2.6rem; min-width: 2.6rem; padding: 0;
  border: none; border-radius: 50%;
  background: rgba(0, 0, 0, .28); cursor: pointer; opacity: 1;
  transition: background .2s, opacity .2s;
}
.widget-type_system_widget_v4_promo_slider_14 .splide__arrow:hover,
.widget-type_system_widget_v4_collections_on_index_2 .splide__arrow:hover { background: rgba(0, 0, 0, .5); }
.widget-type_system_widget_v4_promo_slider_14 .splide__arrow--prev,
.widget-type_system_widget_v4_collections_on_index_2 .splide__arrow--prev { left: .8rem; right: auto; }
.widget-type_system_widget_v4_promo_slider_14 .splide__arrow--next,
.widget-type_system_widget_v4_collections_on_index_2 .splide__arrow--next { right: .8rem; left: auto; }
.widget-type_system_widget_v4_promo_slider_14 .splide__arrow svg,
.widget-type_system_widget_v4_collections_on_index_2 .splide__arrow svg { width: 1.1rem; height: 1.1rem; fill: #fff; }
.widget-type_system_widget_v4_promo_slider_14 .splide__arrow:disabled,
.widget-type_system_widget_v4_collections_on_index_2 .splide__arrow:disabled { opacity: .35; display: flex; }
/* стрелки коллекций темнее (на светлом фоне ряда) */
.widget-type_system_widget_v4_collections_on_index_2 .splide__arrow { background: rgba(4, 161, 164, .85); }
.widget-type_system_widget_v4_collections_on_index_2 .splide__arrow:hover { background: rgba(4, 161, 164, 1); }
@media (max-width: 767px) {
  /* на мобиле геро-стрелки мельче и ближе к краю */
  .widget-type_system_widget_v4_promo_slider_14 .splide__arrow { width: 2rem; height: 2rem; min-width: 2rem; }
}

/* ============================================================
   Карточки товара в сетках (Task 4): компактная иконка-в-корзину
   вместо полнотекстовой кнопки «В корзину» — как на оригинале.
   Хэндлер js-chai-card-add не меняется (открывает модалку опций
   для сложных товаров, иначе кладёт в корзину).
   ============================================================ */
/* flex-direction:row ОБЯЗАТЕЛЬНО для ВСЕХ наших карточек (.js-chai-card):
   в pages.css area-bottom задан column и безскоупно, и заскоупленно под
   виджеты (special_products_tabs_4, catalog_1 и т.д., специфичность 0,2,0).
   Чтобы перебить ВСЕ — берём ту же специфичность 0,2,0 через .js-chai-card
   (custom.css грузится последним → выигрывает по порядку). Цена слева,
   иконка-в-корзину справа, одна строка — как на оригинале. */
.js-chai-card .product-preview__area-bottom {
  display: flex; flex-direction: column; align-items: stretch; gap: .5rem;
  margin-top: auto; padding-top: 8px;
}
.js-chai-card .product-preview__area-bottom .product-preview__price { text-align: left; }
.js-chai-card .product-preview__controls { width: 100%; margin: 0; }
/* кнопка «В корзину» — РОДНАЯ InSales add-cart-counter (внешний вид от базового .button, без обрезки текста) */
.js-chai-card .add-cart-counter { width: 100%; }
/* «В корзину» — залито оранжевым ПО УМОЛЧАНИЮ (как InSales), не только при наведении */
.js-chai-card .add-cart-counter__btn {
  width: 100%; display: inline-flex; align-items: center; justify-content: center;
  min-height: 3rem; padding: .6rem 1rem; gap: .3rem; border: none; cursor: pointer; font-weight: 600;
  background: var(--color-btn-bg, #FC5600) !important;
  color: var(--color-btn-color, #fff) !important;
  border-radius: var(--controls-btn-border-radius, 10px);
  transition: background .2s;
}
.js-chai-card .add-cart-counter__btn:hover { background: var(--color-btn-bg-major-shade, #e04e00) !important; }
.js-chai-card .add-cart-counter__btn .button__icon { margin-left: .3rem; }
.js-chai-card .add-cart-counter__btn.is-loading { opacity: .55; pointer-events: none; }

/* ============================================================
   ДОВОДКА ПО АУДИТУ ОРИГИНАЛА (сравнение new vs chaicoffee.ru)
   ============================================================ */

/* A3: фото новостей в слайдере (article_previews_2) было гигантским —
   глобальное .img-ratio{height:100%!important;min-height:380px} протекало.
   Возвращаем квадрат по --img-ratio. */
.widget-type_system_widget_v4_article_previews_2 .article-list__item-photo {
  position: relative; height: auto !important; min-height: 0 !important;
  padding-top: calc(100% / var(--img-ratio, 1)); overflow: hidden;
  border-radius: var(--img-border-radius, 10px);
}
.widget-type_system_widget_v4_article_previews_2 .article-list__item-photo .img-ratio__inner { position: absolute; inset: 0; height: 100%; }
.widget-type_system_widget_v4_article_previews_2 .article-list__item-photo img { width: 100%; height: 100%; object-fit: cover; }
.widget-type_system_widget_v4_article_previews_2 .article-list__item-title { font-family: var(--font-family-heading, 'Comfortaa', sans-serif); font-size: 1rem; font-weight: 600; line-height: 1.25; margin-top: .5rem; }
.widget-type_system_widget_v4_article_previews_2 .article-list__item-title a { color: var(--color-text, #222); text-decoration: none; }
.widget-type_system_widget_v4_article_previews_2 .article-list__item-description { font-size: .9rem; color: var(--color-text-minor-shade, #666); line-height: 1.4; }

/* A2: на мобиле кнопка «Оформить заказ» уходила под фикс. таб-бар — клиренс снизу */
@media (max-width: 767px) {
  .widget-type_widget_v4_cart_2_328ff467494c12b6f12cfa815424e3e0 .cart__area-controls { padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)); }
}

/* A6: на мобиле секции tabs_4 (Идеи/Популярные) были горизонтальным скроллом —
   делаем перенос-сетку в 2 колонки как на оригинале */
@media (max-width: 767px) {
  .widget-type_system_widget_v4_special_products_tabs_4 .grid-list.catalog-list {
    display: grid !important; grid-auto-flow: row !important; overflow-x: visible !important;
    grid-template-columns: repeat(2, 1fr) !important; padding-bottom: 0 !important;
    gap: 1.2rem .7rem;
  }
}

/* A9: промо-слайдер (hero) — точки-пагинация (active оранжевая) + стрелки видимы */
.widget-type_system_widget_v4_promo_slider_14 .splide__pagination {
  display: flex !important; justify-content: center; gap: .4rem; list-style: none;
  position: relative; bottom: 8px; left: 0; right: 0; z-index: 4; padding: 0; margin: 22px 0 0;
}
.widget-type_system_widget_v4_promo_slider_14 .splide__pagination li { display: block; line-height: 1; margin: 0; }
.widget-type_system_widget_v4_promo_slider_14 .splide__pagination__page {
  display: block; width: 12px; height: 12px; border-radius: 50%; padding: 0; margin: 0;
  background: #CCCCCC; border: none; opacity: 1; transition: background .2s, transform .2s;
}
.widget-type_system_widget_v4_promo_slider_14 .splide__pagination__page.is-active { background: #FC5600; transform: scale(1.15); }
.widget-type_system_widget_v4_promo_slider_14 .splide__arrow { display: flex !important; }

/* A8: обрезка описания на карточках каталога (как truncatewords на оригинале) */
.catalog-list .product-preview__description {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* A7: двойной ползунок цены в фильтре (своя реализация) */
.filter-range__slider { display: block; }
.chai-range { position: relative; height: 4px; background: var(--bg-half-shade, #e2e2e2); border-radius: 2px; margin: 22px 9px 8px; }
.chai-range__fill { position: absolute; top: 0; bottom: 0; background: var(--color-btn-bg, #FC5600); border-radius: 2px; }
.chai-range__handle { position: absolute; top: 50%; width: 18px; height: 18px; border: 2px solid var(--color-btn-bg, #FC5600); border-radius: 50%; background: #fff; transform: translate(-50%, -50%); cursor: pointer; z-index: 2; touch-action: none; }
.chai-range__handle:hover, .chai-range__handle:focus { box-shadow: 0 0 0 4px rgba(252, 86, 0, .15); outline: none; }
.chai-range__handle:active { box-shadow: 0 0 0 5px rgba(252, 86, 0, .2); }

/* A10: ссылка «Вернуться к покупкам» над H1 корзины */
.cart-back-link { display: inline-block; margin-bottom: 1rem; color: var(--color-text-minor-shade, #555); text-decoration: none; font-size: .9rem; }
.cart-back-link:hover { color: var(--color-btn-bg, #FC5600); }

/* B4/rank15: телефон и город в футере одной строкой */
.footer__phone-city { display: block; }
.footer__phone-city .footer__city { margin-left: .5rem; }

/* A8 (desktop): фильтр на оригинале — в видимом левом сайдбаре, отдельной кнопки
   «Фильтры» в тулбаре НЕТ (находка аудита оказалась ложной) — кнопку не добавляем. */

/* ============================================================
   ДОВОДКА ПО ПОВТОРНОМУ АУДИТУ (round 2) — мобайл/модалки
   ============================================================ */

/* B1/rank2: «Сопутствующие товары» на товаре (special_products_16 + grid-list)
   на мобиле падал в 1 колонку → горизонтальный скроллер ~2.5 карточки */
@media (max-width: 767px) {
  .widget-type_system_widget_v4_special_products_16 .grid-list.catalog-list {
    display: flex !important; flex-wrap: nowrap !important; grid-template-columns: none !important;
    overflow-x: auto; gap: .75rem; padding-bottom: 1rem;
    -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity;
  }
  .widget-type_system_widget_v4_special_products_16 .grid-list.catalog-list > * {
    flex: 0 0 42vw; max-width: 200px; min-width: 0; scroll-snap-align: start;
  }
}

/* B1/rank3: страница поиска — горизонтальный оверфлоу. Реальная причина —
   пагинация (много страниц в строку без переноса) + select категорий без min-width:0. */
.pagination { display: flex; flex-wrap: wrap; gap: 5px; }
.catalog-pagination .pagination { justify-content: flex-start; }
@media (max-width: 767px) { .catalog-pagination__results { width: 100%; } .pagination { justify-content: center; } }
.search-refine__cat { min-width: 0; max-width: 100%; }
.search-refine__cat select { max-width: 100%; }
@media (max-width: 767px) {
  .search-refine__cat, .search-refine__field { min-width: 0; max-width: 100%; }
  .search-refine__cat select, .search-refine__field input { max-width: 100%; }
}

/* B2/rank4-5-23: мобильная поисковая панель — стили не наследовались от виджета
   таб-бара (панель не его потомок). Задаём по ID. */
#chai-mobile-search-panel .navigation-bar-search__controls {
  display: flex; align-items: center; height: 4rem;
  border-bottom: 1px solid var(--bg-major-shade, #e8e8e8); padding: 0 10px 0 16px;
}
#chai-mobile-search-panel .navigation-bar-search__field {
  flex-grow: 1; height: 100%; padding: 0; font-size: 1rem;
  background: none; border: none; border-radius: 0; box-shadow: none;
}
#chai-mobile-search-panel .navigation-bar-search__field:focus { box-shadow: none; }
#chai-mobile-search-panel .navigation-bar-panel__hide-btn {
  background: none; border: none; box-shadow: none; color: var(--color-text, #222);
  width: 2.6rem; min-width: 2.6rem; height: 2.6rem; padding: 0; margin-left: .4rem;
  border-radius: 0; display: flex; align-items: center; justify-content: center; font-size: 1.2rem;
}
#chai-mobile-search-panel .navigation-bar-panel__hide-btn:hover { background: none; color: var(--color-btn-bg, #FC5600); }
#chai-mobile-search-panel .navigation-bar-search__results { padding: .5rem 12px; }

/* B3/rank8: промо-слайдер на мобиле — точки по центру внизу (оранжевая активная)
   и стрелки. Бьём ported-правило .promo-slider .splide__pagination (0,3,0) тем же
   уровнем + !important. */
.widget-type_system_widget_v4_promo_slider_14 .promo-slider .splide__pagination {
  position: relative !important; left: 0 !important; right: 0; top: auto !important; bottom: 8px !important;
  margin-top: 22px !important;
  width: 100%; transform: none !important; justify-content: center !important; align-items: center !important;
  display: flex !important; gap: .4rem;
}
.widget-type_system_widget_v4_promo_slider_14 .promo-slider .splide__arrow { display: flex !important; }

/* ============================================================
   Карточки товара: аккуратное ховер-состояние
   (скругление + отступы + фото вписано + мягкая тень + круглая кнопка).
   Раньше: на ховере карточка «всплывала» тенью, но padding:0 и фото с
   другим радиусом → выглядело криво и резко.
   ============================================================ */
.widget-type_system_widget_v4_special_products_16 .product-preview,
/* НЕДОСТАЮЩИЕ в OC InSales-переменные — чтобы префиксный CSS карточки каталога рисовал 1:1
   (без них: пилюли/кнопки квадратные [--controls-btn-border-radius был 0], фон карточки прозрачный). */
:root {
  --controls-btn-border-radius: 10px;
  --border-radius: 10px;
  --product-bg: var(--bg, #fff);
  --product-bg-minor-shade: var(--bg-minor-shade, #f7f7f7);
}

/* каталог-карточку НЕ трогаем своими радиусами/тенями — её стилизует родной префиксный InSales-CSS в pages.css */
.widget-type_system_widget_v4_special_products_16 .product-preview,
.widget-type_system_widget_v4_special_products_tabs_4 .product-preview,
.collections-and-subcollections .product-preview {
  border-radius: 16px; padding: 10px; box-sizing: border-box;
  transition: box-shadow .22s ease, transform .22s ease;
}
.widget-type_system_widget_v4_special_products_16 .product-preview:hover,
.widget-type_system_widget_v4_special_products_tabs_4 .product-preview:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, .08); transform: translateY(-2px);
}
/* фото — скруглено и вписано (с отступом от краёв карточки) */
.product-preview .product-preview__photo { border-radius: 12px; overflow: hidden; }
/* фото товара — object-fit: cover (каталог + страница товара) */
.product-preview__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pgallery__main { display: block; aspect-ratio: 1 / 1; overflow: hidden; }
.js-pgallery-main-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pgallery__thumb img, .js-pgallery-thumb img, .pgallery__thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.product-preview .product-preview__photo .img-ratio,
.product-preview .product-preview__photo .img-ratio_cover,
.product-preview .product-preview__photo .img-ratio_contain { border-radius: 12px; overflow: hidden; }
/* кнопка «В корзину» — скруглённая полноширинная (перебиваем .product-preview__controls .button{border-radius:20px}) */
.product-preview .product-preview__cart-btn { border-radius: 22px !important; }

/* ============================================================
   ИНЛАЙН-ОПЦИИ НА КАРТОЧКЕ КАТЕГОРИИ + бейдж маркетплейса
   (возврат к виду живого chaicoffee.ru: пилюли «Вид»/«Количество
   пирамидок» со сменой цены; «Продается на Озон/ВБ»)
   ============================================================ */
.js-chai-card .product-preview__area-variants { margin: 8px 0 6px; }
.js-chai-card .option-selector { display: block; }
.js-chai-card .option { display: block; margin-bottom: 10px; }
.js-chai-card .option:last-child { margin-bottom: 0; }
.js-chai-card .option-label {
  display: block; font-size: .75rem; line-height: 1.2; margin-bottom: 5px;
  color: var(--color-text-half-shade, #8a8f98);
}
.js-chai-card .option-values { display: block; }
/* пилюля 1-в-1 InSales: обёртка БЕЗ бордера/фона, единственный бордер (2px) — на внутреннем span */
.js-chai-card .option-value.is-radio {
  display: inline-block; margin: 0 2px 5px 0; line-height: 1; cursor: pointer;
  font-size: .875rem; color: var(--color-text); user-select: none;
}
.js-chai-card .option-value input { position: absolute; opacity: 0; width: 0; height: 0; }
.js-chai-card .option-value.is-radio > span {
  --option-bg: var(--product-bg-minor-shade, var(--bg-minor-shade, #eef1f2));
  display: inline-block; padding: .3rem .5rem; border-radius: var(--controls-btn-border-radius, 12px);
  border: 2px solid var(--option-bg); background-color: var(--option-bg);
  transition: border-color .15s, background .15s;
}
.js-chai-card .option-value.is-radio.is-active > span {
  background-color: transparent; border-color: var(--color-btn-bg, #FC5600);
}
.js-chai-card .option-value.is-disabled { opacity: .45; cursor: not-allowed; }
.js-chai-card .option-value.is-disabled > span { text-decoration: line-through; }
@media (max-width: 767px) { .js-chai-card .option-value.is-radio { font-size: .75rem; } }

/* сброс утёкшего из pages.css заголовка (InSales: без padding, margin-bottom:1rem, без margin-top) */
.js-chai-card .product-preview__title { padding: 0; margin: 0 0 .75rem; }
.js-chai-card .product-preview__area-title { padding: 0; }

/* бейдж «Продается на Озон / ВБ» */
.js-chai-card .product-preview__ozon { display: flex; align-items: center; gap: 6px; margin: 4px 0 6px; }
.js-chai-card .product-preview__ozon-icon { flex: 0 0 auto; display: inline-flex; }
.js-chai-card .product-preview__ozon-icon img { width: 20px; height: 20px; border-radius: 4px; display: block; }
.js-chai-card .product-preview__ozon-title a {
  font-size: .82rem; color: var(--color-text, #22252a); text-decoration: none; border-bottom: 1px dashed currentColor;
}
.js-chai-card .product-preview__ozon-title a:hover { color: var(--color-btn-bg, #FC5600); }

/* отступы описания в карточке (без опций) */
.js-chai-card .product-preview__area-description { margin: 6px 0; }
.js-chai-card .product-preview__description {
  font-size: .82rem; line-height: 1.4; color: var(--color-text-secondary, #8a8f98);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  padding-left: 0; padding-right: 0;
}

/* Кнопка/счётчик «В корзину» в области покупки товара — скруглить */
.product__buy .add-cart-counter__btn,
.product__buy .add-cart-counter__controls,
.product__buy .add-cart-counter__detail { border-radius: 12px; }
.product__buy .add-cart-counter__controls { overflow: hidden; gap: 0; }
.product__buy .add-cart-counter__controls-btn:first-child { border-top-left-radius: 12px; border-bottom-left-radius: 12px; }
.product__buy .add-cart-counter__controls-btn:last-child { border-top-right-radius: 12px; border-bottom-right-radius: 12px; }

/* rank12: карта магазинов в Контактах (Яндекс-iframe 500x720) — адаптив,
   чтобы не распирала мобайл и не оставляла гигантский пустой блок.
   ВАЖНО: если карта пустая — проверить валидность Яндекс-конструктора в контенте. */
.contacts-map { min-height: 0 !important; height: auto !important; }
.contacts-map iframe { width: 100% !important; max-width: 100%; height: 360px !important; display: block; border: 0; border-radius: 8px; }
@media (max-width: 767px) { .contacts-map iframe { height: 300px !important; } }

/* B5/rank7: вкладки товара на мобиле — вертикальные строки во всю ширину с шевроном
   (как аккордеон оригинала); активная панель показывается ниже. */
@media (max-width: 767px) {
  .product-tabs__nav { flex-direction: column; border-bottom: none; gap: 0; margin-bottom: 0; }
  .product-tabs__nav li { border-bottom: 1px solid #ececec; }
  .product-tabs__nav li:first-child { border-top: 1px solid #ececec; }
  .product-tabs__nav li a {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%; padding: 14px 4px; margin: 0; border-bottom: none; font-size: 1rem;
  }
  .product-tabs__nav li a::after { content: "\203A"; color: #999; font-size: 1.3rem; line-height: 1; transform: rotate(90deg); transition: transform .2s, color .2s; }
  .product-tabs__nav li.is-active a { color: var(--color-btn-bg, #FC5600); }
  .product-tabs__nav li.is-active a::after { transform: rotate(-90deg); color: var(--color-btn-bg, #FC5600); }
  .product-tabs__panes { margin-top: 1rem; }
}

/* ====== Страница подарочного сертификата (/cert/КОД) ====== */
.chai-cert-card{max-width:520px;margin:0 auto;padding:32px 28px;border-radius:18px;text-align:center;color:#fff;
  background:linear-gradient(135deg,#FC5600 0%,#e04e00 100%);box-shadow:0 12px 32px rgba(252,86,0,.22)}
.chai-cert-card--used,.chai-cert-card--expired{background:linear-gradient(135deg,#8a8a8a 0%,#6d6d6d 100%);box-shadow:0 12px 32px rgba(0,0,0,.15)}
.chai-cert-card__nominal{font-size:3rem;font-weight:800;line-height:1}
.chai-cert-card__label{font-size:1.05rem;letter-spacing:.04em;text-transform:uppercase;opacity:.9;margin-top:6px}
.chai-cert-card__code{margin-top:18px;font-size:1.4rem;font-weight:700;letter-spacing:.08em}
.chai-cert-card__meta{list-style:none;padding:0;margin:18px 0 0;font-size:1rem;line-height:1.7}
.chai-cert-card__how{margin:18px 0 0;font-size:.95rem;opacity:.95}
.chai-cert-card__pdf{display:inline-block;margin-top:20px;padding:11px 26px;border-radius:10px;background:#fff;color:#FC5600;font-weight:700;text-decoration:none}
.chai-cert-card--used .chai-cert-card__pdf,.chai-cert-card--expired .chai-cert-card__pdf{color:#6d6d6d}

/* ====== Бонусы на чекауте (Loya/Set Retail) ====== */
.co-basket_bonus{margin:10px 0 0;padding:12px 14px;border:1px solid #ffe0cc;border-radius:12px;background:#fff8f4}
.co-basket_bonus-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.co-basket_bonus-label{font-weight:700}
.co-basket_bonus-balance{font-size:.95rem;color:#444}
.co-basket_bonus-balance b{color:var(--color-btn-bg,#FC5600)}
.co-basket_bonus-card{margin-top:4px;font-size:.85rem;color:#888;letter-spacing:.03em}
.co-basket_bonus-row{display:flex;gap:8px;margin-top:10px}
.co-basket_bonus-input{flex:1;min-width:0}
.co-basket_bonus-msg{margin-top:6px;font-size:.85rem;min-height:1em}
.co-basket_bonus-msg.co-notice--ok{color:#1a9c46}
.co-basket_bonus-msg.co-notice--danger{color:#d23b3b}

/* ====== Бонусы в личном кабинете ====== */
.chai-bonus-card{padding:24px 26px;border-radius:16px;color:#fff;background:linear-gradient(135deg,#FC5600 0%,#e04e00 100%);box-shadow:0 10px 28px rgba(252,86,0,.2);max-width:420px}
.chai-bonus-card__balance{font-size:2.2rem;font-weight:800;line-height:1}
.chai-bonus-card__balance span{font-size:2.6rem}
.chai-bonus-card__card{margin-top:10px;font-size:1rem;letter-spacing:.04em;opacity:.95}
.chai-bonus-card__hint{margin-top:14px;font-size:.85rem;opacity:.9}

/* ====== Мои сертификаты (ЛК) ====== */
.chai-cert-list{display:flex;flex-direction:column;gap:12px}
.chai-cert-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding:14px 16px;border:1px solid #eee;border-radius:12px;background:#fff}
.chai-cert-row--off{opacity:.6}
.chai-cert-row__main{flex:1;min-width:200px;display:flex;align-items:center;gap:16px}
.chai-cert-row__nominal{font-size:1.5rem;font-weight:800;color:var(--color-btn-bg,#FC5600)}
.chai-cert-row__meta{display:flex;flex-direction:column;gap:2px;font-size:.9rem;color:#555}
.chai-cert-row__code{font-weight:600;letter-spacing:.05em}
.chai-cert-row__actions{display:flex;gap:8px;flex-wrap:wrap}
.co-button--ghost{background:#fff;border:1px solid var(--color-btn-bg,#FC5600);color:var(--color-btn-bg,#FC5600)}
.chai-cert-row__msg{flex-basis:100%;font-size:.85rem;min-height:1em}
.chai-cert-row__msg.is-ok{color:#1a9c46}
.chai-cert-row__msg.is-err{color:#d23b3b}

/* ============================================================
   ФИЛЬТР: верхний бар «Фильтры» + сортировка, мобильная шторка СЛЕВА
   Живой лейаут = .page_layout_sticky_left aside.is-large #catalog-filter.
   Используем #id, чтобы перебить наследие (.chai-cat-side/.collection-body
   и др. — мёртвые, но с !important). Дубль .filter-mobile-controls в
   сайдбаре скрыт: бар вынесен наверх (chai-cat-topbar).
   ============================================================ */
.filter-mobile-controls { display: none !important; }

.chai-cat-topbar .layout__content { display: flex; }
.chai-cat-topbar .filter-top-controls { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; width: 100%; }
.chai-cat-topbar .collection-sort { margin-left: auto; }
.chai-cat-topbar .collection-sort .select-wrapper select { min-width: 210px; }

/* кнопка «Фильтры» (иконка слайдеров) */
.filter-top-controls .show-mobile-filter-btn {
  align-items: center; gap: 8px; padding: 8px 16px; cursor: pointer; font-weight: 600;
  border: 1px solid var(--color-border, #e3e5e8); border-radius: 22px; background: #fff;
}
.filter-top-controls .show-mobile-filter-btn:hover { border-color: var(--color-btn-bg, #FC5600); }
.filter-top-controls .show-mobile-filter-btn .icon-sliders { font-size: 1.15rem; }
.filter-top-controls .show-mobile-filter-btn__bage { display: none; }
.filter-top-controls .show-mobile-filter-btn.is-active-filters { border-color: var(--color-btn-bg, #FC5600); color: var(--color-btn-bg, #FC5600); }
.filter-top-controls .show-mobile-filter-btn.is-active-filters .show-mobile-filter-btn__bage { display: inline-flex; }

/* десктоп ≥768: фильтр — статичный сайдбар, кнопка «Фильтры» скрыта (как InSales) */
@media (min-width: 768px) {
  .filter-top-controls .show-mobile-filter-btn { display: none !important; }
  #catalog-filter.filter { position: static !important; transform: none !important; visibility: visible !important; height: auto !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; overflow: visible !important; }
  #catalog-filter .filter__hide-mobile-filter-btn { display: none !important; }
}
/* мобилка ≤767: полноэкранная off-canvas ШТОРКА, выезд СПРАВА (1:1 InSales), без оверлея/тени */
@media (max-width: 767px) {
  .filter-top-controls .show-mobile-filter-btn { display: inline-flex !important; }
  #catalog-filter.filter {
    position: fixed !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important;
    width: auto !important; max-width: none !important; height: 100vh !important; height: 100dvh !important; margin: 0 !important;
    padding: 0 0 60px 0 !important; background: var(--bg, #fff) !important; z-index: var(--zindex-modal, 1000) !important;
    box-shadow: none !important; overflow: visible !important;
    transform: translate3d(100%, 0, 0) !important; visibility: hidden !important;
    transition: transform .3s ease, visibility .3s !important;
  }
  #catalog-filter.filter.is-show-mobile { transform: translate3d(0, 0, 0) !important; visibility: visible !important; }
  #catalog-filter .filter__content { display: block !important; visibility: visible !important; height: 100% !important; overflow-y: auto !important; padding: 16px !important; }
  #catalog-filter .filter__hide-mobile-filter-btn { display: inline-flex !important; }
}

/* мобилка: 2 товара в ряд (InSales авто-fill даёт 3 на 482-767px — форсируем 2) */
@media (max-width: 767px) {
  .widget-type_widget_v4_catalog_1_6b81359050be82f052c7a5ddfd416191 .catalog-list.grid-list { grid-template-columns: repeat(2, 1fr) !important; }
}


/* ============================================================
   СТРАНИЦА ТОВАРА — стили 1:1 по InSales (табы/характеристики/отзывы + buy-card)
   Сгенерировано из InSales snippet.scss, scoped под product-виджеты.
   ============================================================ */


/* ===================== FROM AGENT: ? ===================== */
/* ============================================================
   PRODUCT PAGE — TABS + CHARACTERISTICS + REVIEWS (InSales look)
   Scope: .widget-type_system_widget_v4_product_info_2 (OC product.twig line 187)
   Targets OC classes: product-tabs__nav / __pane, product-spec(__name/__val/__group),
                       review-form (__title/__field/__label/__note/__rating/__star/__controls/__login)
   Source of truth: InSales .widget-type_system_widget_v4_product_info_2 CSS
   Paste at END of custom.css — supersedes existing rules at ~100-108, 374-385, 1593-1603.
   ============================================================ */

/* ---------- Tab nav (desktop): text tabs, grey -> dark, no underline/pill ---------- */
.widget-type_system_widget_v4_product_info_2 .product-tabs__nav{
  display:flex; flex-wrap:wrap; align-items:center;
  list-style:none; margin:0 0 1.5rem; padding:0;
  border:none; gap:0;
}
.widget-type_system_widget_v4_product_info_2 .product-tabs__nav li{ margin:0 3rem 0 0; }
.widget-type_system_widget_v4_product_info_2 .product-tabs__nav li:last-child{ margin-right:0; }
.widget-type_system_widget_v4_product_info_2 .product-tabs__nav li a{
  display:inline-block;
  color:var(--color-text-half-shade,#999);
  font-size:1.5rem; line-height:1; font-weight:400;
  padding:.5rem 0; margin:0;
  text-decoration:none; border:none;
  cursor:pointer; transition:color .2s;
}
.widget-type_system_widget_v4_product_info_2 .product-tabs__nav li a:hover{ color:var(--color-text,#111); }
.widget-type_system_widget_v4_product_info_2 .product-tabs__nav li.is-active a{
  color:var(--color-text,#111); cursor:default; border:none;
}
@media screen and (max-width:1024px){
  .widget-type_system_widget_v4_product_info_2 .product-tabs__nav li{ margin-right:2.5rem; }
  .widget-type_system_widget_v4_product_info_2 .product-tabs__nav li a{ font-size:1.25rem; }
}

/* ---------- Panes ---------- */
.widget-type_system_widget_v4_product_info_2 .product-tabs__pane{ display:none; }
.widget-type_system_widget_v4_product_info_2 .product-tabs__pane.is-active{ display:block; }
.widget-type_system_widget_v4_product_info_2 .product-tabs__pane{ font-size:1.125rem; line-height:1.6; }
.widget-type_system_widget_v4_product_info_2 .product-tabs__pane p{ margin:0 0 1rem; }
.widget-type_system_widget_v4_product_info_2 .product-tabs__pane p:last-child{ margin-bottom:0; }

/* ---------- Characteristics: dotted-leader rows, 2-col auto-fit grid ---------- */
.widget-type_system_widget_v4_product_info_2 .product-spec{
  display:block; width:100%; margin:0; border:none; border-collapse:collapse;
}
/* browser auto-inserts <tbody>; make it the responsive properties grid */
.widget-type_system_widget_v4_product_info_2 .product-spec tbody{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(440px,100%),1fr));
  gap:1rem 3rem;
}
.widget-type_system_widget_v4_product_info_2 .product-spec td{ padding:0; border:none; }
.widget-type_system_widget_v4_product_info_2 .product-spec tr{
  display:flex; align-items:flex-end; gap:1rem; width:100%;
}
/* dotted leader (no markup needed): flex pseudo between name(order1) and value(order3) */
.widget-type_system_widget_v4_product_info_2 .product-spec tr:not(.product-spec__group)::after{
  content:""; order:2; flex:1 1 auto; align-self:flex-end;
  border-bottom:1px dotted var(--color-text-half-shade,#999);
  margin-bottom:.4rem;
}
.widget-type_system_widget_v4_product_info_2 .product-spec__name{
  order:1; flex:0 1 auto; max-width:200px;
  color:var(--color-text,#222);
}
.widget-type_system_widget_v4_product_info_2 .product-spec__val{
  order:3; flex:0 0 clamp(120px,28%,200px); text-align:left; min-width:0;
  color:var(--color-text,#222);
}
/* attribute-group subheading spans the full grid width */
.widget-type_system_widget_v4_product_info_2 .product-spec__group{
  display:block; grid-column:1 / -1; margin:1.5rem 0 .5rem;
}
.widget-type_system_widget_v4_product_info_2 .product-spec__group:first-child{ margin-top:0; }
.widget-type_system_widget_v4_product_info_2 .product-spec__group td{ padding:0; }
.widget-type_system_widget_v4_product_info_2 .product-spec__group strong{
  font-size:1.25rem; font-weight:600; color:var(--color-text,#111);
}

/* ---------- Reviews list (OC AJAX target #review) ---------- */
.widget-type_system_widget_v4_product_info_2 #review{ margin-bottom:1.5rem; }
.widget-type_system_widget_v4_product_info_2 #review table{ width:100%; border-collapse:collapse; }
.widget-type_system_widget_v4_product_info_2 #review td{
  padding:.75rem 0; vertical-align:top;
  border-bottom:1px solid var(--bg-major-shade,#ececec);
}

/* ---------- Review form: InSales bg-minor-shade card ---------- */
.widget-type_system_widget_v4_product_info_2 .review-form{
  max-width:680px; display:flex; flex-direction:column; gap:1.5rem;
  background:var(--bg-minor-shade,#f7f9f9);
  padding:2rem; border-radius:var(--border-radius,10px); margin-top:1rem;
}
.widget-type_system_widget_v4_product_info_2 .review-form__title{
  margin:0; font-size:1.5rem; font-weight:600; line-height:1.1;
}
.widget-type_system_widget_v4_product_info_2 .review-form__field{
  display:flex; flex-direction:column; gap:.4rem; margin:0;
}
.widget-type_system_widget_v4_product_info_2 .review-form__label{
  font-weight:600; font-size:.95rem; color:var(--color-text,#222);
}
.widget-type_system_widget_v4_product_info_2 .review-form .form-control{
  width:100%; box-sizing:border-box; font-family:inherit; font-size:1rem;
  padding:.7rem .9rem; background:#fff;
  border:1px solid var(--bg-major-shade,#e3e3e3);
  border-radius:var(--controls-btn-border-radius,10px);
}
.widget-type_system_widget_v4_product_info_2 .review-form textarea.form-control{
  min-height:120px; resize:vertical;
}
.widget-type_system_widget_v4_product_info_2 .review-form .form-control:focus{
  outline:none; border-color:var(--color-btn-bg,#FC5600);
  box-shadow:0 0 0 3px rgba(252,86,0,.12);
}
.widget-type_system_widget_v4_product_info_2 .review-form__note{
  font-size:.8rem; color:var(--color-text-half-shade,#999);
}
.widget-type_system_widget_v4_product_info_2 .review-form__rating{
  display:inline-flex; align-items:center; gap:.4rem; flex-wrap:wrap;
}
.widget-type_system_widget_v4_product_info_2 .review-form__rating-hint{
  font-size:.85rem; color:var(--color-text-half-shade,#999);
}
.widget-type_system_widget_v4_product_info_2 .review-form__star{ cursor:pointer; line-height:1; display:inline-block; }
.widget-type_system_widget_v4_product_info_2 .review-form__star input{ position:absolute; opacity:0; width:0; height:0; }
.widget-type_system_widget_v4_product_info_2 .review-form__star-ico:before{
  content:"\2605"; font-size:1.8rem; color:#d9d9d9; transition:color .12s;
}
.widget-type_system_widget_v4_product_info_2 .review-form__star:hover .review-form__star-ico:before,
.widget-type_system_widget_v4_product_info_2 .review-form__star.is-filled .review-form__star-ico:before{ color:#FFB400; }
.widget-type_system_widget_v4_product_info_2 .review-form__controls{ margin-top:.25rem; }
.widget-type_system_widget_v4_product_info_2 .review-form__controls .button{
  width:100%; border:none; cursor:pointer;
  background:var(--color-btn-bg,#FC5600); color:#fff;
  font-weight:600; font-size:1rem; padding:.85rem 1.5rem;
  border-radius:var(--controls-btn-border-radius,10px);
  transition:background .15s, filter .15s;
}
.widget-type_system_widget_v4_product_info_2 .review-form__controls .button:hover{ filter:brightness(1.06); }
.widget-type_system_widget_v4_product_info_2 .review-form__login{ font-size:1rem; color:var(--color-text,#222); }

/* ---------- Mobile (<=767px) — matches InSales mobile behaviour ---------- */
@media screen and (max-width:767px){
  /* nav -> horizontally scrollable text tab bar (OC has no accordion markup) */
  .widget-type_system_widget_v4_product_info_2 .product-tabs__nav{
    flex-direction:row; flex-wrap:nowrap; overflow-x:auto; gap:0;
    margin-bottom:1.25rem; border-bottom:1px solid var(--bg-major-shade,#ececec);
    scrollbar-width:none; -webkit-overflow-scrolling:touch;
  }
  .widget-type_system_widget_v4_product_info_2 .product-tabs__nav::-webkit-scrollbar{ display:none; }
  .widget-type_system_widget_v4_product_info_2 .product-tabs__nav li{ flex:0 0 auto; margin:0 1.5rem 0 0; border:none; }
  .widget-type_system_widget_v4_product_info_2 .product-tabs__nav li:first-child{ border:none; }
  .widget-type_system_widget_v4_product_info_2 .product-tabs__nav li a{ font-size:1.125rem; white-space:nowrap; padding:.5rem 0; }
  .widget-type_system_widget_v4_product_info_2 .product-tabs__nav li a::after{ content:none; }

  .widget-type_system_widget_v4_product_info_2 .product-tabs__pane{ font-size:1rem; }

  /* characteristics: stack name (grey) over value, drop the dotted leader */
  .widget-type_system_widget_v4_product_info_2 .product-spec tbody{ grid-template-columns:1fr; gap:1rem; }
  .widget-type_system_widget_v4_product_info_2 .product-spec tr{ display:block; }
  .widget-type_system_widget_v4_product_info_2 .product-spec tr:not(.product-spec__group)::after{ display:none; }
  .widget-type_system_widget_v4_product_info_2 .product-spec__name{ display:block; max-width:100%; color:var(--color-text-half-shade,#999); margin-bottom:.1rem; }
  .widget-type_system_widget_v4_product_info_2 .product-spec__val{ display:block; text-align:left; }

  .widget-type_system_widget_v4_product_info_2 .review-form{ padding:1.5rem 1rem; }
}

/* ===================== FROM AGENT: ? ===================== */
/* ============================================================
   Карточка товара (BUY CARD) — вид как на живом InSales.
   Scope: .widget-type_system_widget_v4_product_3 (product.twig).
   Значения сверены с живым рендером scrape/raw/product_full.html
   (inline <style> виджета). Грузится последним (custom.css) →
   выигрывает у pages.css-порта при равной специфичности.
   НЕ трогает карточку категории (другой виджет special_products_16).
   Галерея (.pgallery) уже стилизована в custom.css — здесь не дублируется.
   ============================================================ */

/* --- Раскладка: десктоп 2 колонки (фото ~66% слева, инфо справа) --- */
.widget-type_system_widget_v4_product_3 .product{
  display:grid;
  grid-template-areas:"photo info" "photo title" "photo variants" "photo price" "photo buy" "photo .";
  grid-template-columns:66% 1fr;
  grid-template-rows:repeat(5, max-content) 1fr;
  grid-column-gap:2rem;
  grid-row-gap:1rem;
  align-items:start;
}
.widget-type_system_widget_v4_product_3 .product__area-photo{grid-area:photo;min-width:0;position:relative}
.widget-type_system_widget_v4_product_3 .product__area-info{grid-area:info;min-width:0}
.widget-type_system_widget_v4_product_3 .product__area-title{grid-area:title;min-width:0}
.widget-type_system_widget_v4_product_3 .product__area-variants{grid-area:variants;min-width:0}
.widget-type_system_widget_v4_product_3 .product__area-price{grid-area:price;min-width:0}
.widget-type_system_widget_v4_product_3 .product__area-buy{grid-area:buy;min-width:0}

/* --- Мобайл/планшет: одна колонка, фото сверху (как на живом ≤1024) --- */
@media (max-width:1024px){
  .widget-type_system_widget_v4_product_3 .product{
    grid-template-areas:"photo" "info" "title" "variants" "price" "buy";
    grid-template-columns:auto;
    grid-column-gap:0;
    grid-row-gap:1rem;
  }
  .widget-type_system_widget_v4_product_3 .product__area-photo{margin-bottom:.5rem}
}

/* --- Инфо-строка: рейтинг слева, артикул справа --- */
.widget-type_system_widget_v4_product_3 .product__info{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;line-height:1;margin-bottom:.5rem;
}
.widget-type_system_widget_v4_product_3 .product__sku{
  color:var(--color-text-half-shade);font-size:.9rem;
}
@media (max-width:767px){
  .widget-type_system_widget_v4_product_3 .product__sku{font-size:.875rem}
}

/* --- Рейтинг (звёзды icon-star) --- */
.widget-type_system_widget_v4_product_3 .product__rating{
  display:inline-flex;align-items:center;vertical-align:middle;cursor:pointer;
}
.widget-type_system_widget_v4_product_3 .product__rating-list{
  display:inline-flex;align-items:center;vertical-align:middle;gap:2px;
}
.widget-type_system_widget_v4_product_3 .product__rating-star{
  color:var(--color-text-half-shade);font-size:1rem;line-height:1;
}
.widget-type_system_widget_v4_product_3 .product__rating-star.is-active{
  color:var(--rating-color,#0ABAB5);
}
.widget-type_system_widget_v4_product_3 .product__reviews-count{
  margin-left:6px;font-size:.9rem;
}
.widget-type_system_widget_v4_product_3 .product__reviews-count a{
  color:var(--color-text-half-shade);text-decoration:none;
}
.widget-type_system_widget_v4_product_3 .product__reviews-count a:hover{
  color:var(--color-btn-bg);
}

/* --- Заголовок H1 (ФИКС: порт зажимает до 16px через
       generic .product__title{font-size:var(--font-size)};
       возвращаем размер .heading, специфичность 0,2,0 > 0,1,0) --- */
.widget-type_system_widget_v4_product_3 .product__title{
  font-family:var(--font-family-heading);
  font-weight:var(--heading-weight,700);
  font-size:calc(var(--font-size,16px) * var(--heading-ratio,2));
  line-height:1.2;
  margin-bottom:1rem;
}
@media (max-width:767px){
  .widget-type_system_widget_v4_product_3 .product__title{
    font-size:calc(var(--font-size,16px) * var(--heading-ratio,2) * .8);
    margin-bottom:.5rem;
  }
}

/* --- Цена: крупная текущая + перечёркнутая старая --- */
.widget-type_system_widget_v4_product_3 .product__price{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:0 10px;
  margin-bottom:1.2rem;line-height:1.2;
}
.widget-type_system_widget_v4_product_3 .product__price-cur{
  font-size:2.5rem;font-weight:600;white-space:nowrap;color:var(--color-text);
}
.widget-type_system_widget_v4_product_3 .product__price-old{
  font-size:1.5rem;color:var(--color-text-half-shade);
  text-decoration:line-through;white-space:nowrap;
}
.widget-type_system_widget_v4_product_3 .product__price-old:empty{display:none}
@media (max-width:767px){
  .widget-type_system_widget_v4_product_3 .product__price-cur{font-size:1.5rem}
  .widget-type_system_widget_v4_product_3 .product__price-old{font-size:1.125rem}
}

/* --- Варианты (пилюли is-span): как в каталоге —
       заливка --bg-minor-shade + рамка 2px; активная = прозрачный
       фон + оранжевая рамка (--color-btn-bg). --- */
.widget-type_system_widget_v4_product_3 .option-selector{display:flex;flex-wrap:wrap}
.widget-type_system_widget_v4_product_3 .option-selector .option{margin:0 50px 1rem 0}
.widget-type_system_widget_v4_product_3 .option-selector .option:last-child{margin-right:0}
.widget-type_system_widget_v4_product_3 .option-selector .option-label{
  display:block;line-height:1.2;margin-bottom:5px;color:var(--color-text-major-shade);
}
.widget-type_system_widget_v4_product_3 .option-selector .option-values{
  display:flex;flex-wrap:wrap;gap:6px;
}
.widget-type_system_widget_v4_product_3 .option-selector .option-value.is-span{
  -webkit-appearance:none;appearance:none;font:inherit;
  display:inline-flex;align-items:center;justify-content:center;
  margin:0;line-height:1;font-size:.875rem;cursor:pointer;color:var(--color-text);
  padding:.3rem .5rem;
  border-radius:var(--controls-btn-border-radius,10px);
  border:2px solid var(--bg-minor-shade);
  background-color:var(--bg-minor-shade);
  transition:border-color .15s,background .15s;
}
.widget-type_system_widget_v4_product_3 .product .option-selector .option-value.is-span.is-active{
  background:transparent;border-color:var(--color-btn-bg);
}
.widget-type_system_widget_v4_product_3 .option-selector .option-value.is-span.is-disabled{
  opacity:.45;text-decoration:line-through;cursor:not-allowed;
}
.widget-type_system_widget_v4_product_3 .option-value__price{
  opacity:.7;font-size:.85em;margin-left:.25em;
}
@media (max-width:767px){
  .widget-type_system_widget_v4_product_3 .option-selector .option{margin:0 30px 10px 0}
  .widget-type_system_widget_v4_product_3 .option-selector .option-label{font-size:.875rem}
}

/* --- Область покупки: «В корзину» на всю ширину (оранжевый от
       базового .button) + степпер, «Купить в 1 клик» вторичной. --- */
.widget-type_system_widget_v4_product_3 .product__controls{display:grid;gap:.75rem}
.widget-type_system_widget_v4_product_3 .product__buy-btn-area-inner{
  display:flex;width:100%;align-items:stretch;
}
.widget-type_system_widget_v4_product_3 .add-cart-counter{width:100%}
.widget-type_system_widget_v4_product_3 .add-cart-counter__btn{width:100%}
.widget-type_system_widget_v4_product_3 .add-cart-counter__btn .button__icon{margin-left:10px}
/* Скругление кнопки/счётчика в области покупки */
.widget-type_system_widget_v4_product_3 .product__buy .add-cart-counter__btn,
.widget-type_system_widget_v4_product_3 .product__buy .add-cart-counter__controls,
.widget-type_system_widget_v4_product_3 .product__buy .add-cart-counter__detail{
  border-radius:var(--controls-btn-border-radius,10px);
}
.widget-type_system_widget_v4_product_3 .product__buy .add-cart-counter__controls{overflow:hidden;gap:0}
.widget-type_system_widget_v4_product_3 .product__buy .add-cart-counter__controls-btn:first-child{
  border-top-right-radius:0;border-bottom-right-radius:0;
}
.widget-type_system_widget_v4_product_3 .product__buy .add-cart-counter__controls-btn:last-child{
  border-top-left-radius:0;border-bottom-left-radius:0;
}
/* Степпер −/+ оранжевый (страховка, если --preview-btn-bg не задан) */
.widget-type_system_widget_v4_product_3 .add-cart-counter__controls-btn{
  background-color:var(--color-btn-bg);color:var(--color-btn-color,#fff);
}

/* --- Кнопка «В избранное» рядом с «В корзину» (ФИКС: порт роняет
       position:absolute из каталожного .favorites_btn — форсим inline
       статичную серую кнопку 60px, специфичность 0,3,0 > 0,1,0) --- */
.widget-type_system_widget_v4_product_3 .product__buy-btn-area-inner .favorites_btn{
  position:static;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  width:60px;margin-left:.75rem;
  background:var(--bg-minor-shade);color:var(--color-text-half-shade);
  border:0;outline:none;
}
.widget-type_system_widget_v4_product_3 .product__buy-btn-area-inner .favorites_btn:hover{
  background:var(--bg-minor-shade);color:var(--color-btn-bg);
}
.widget-type_system_widget_v4_product_3 .favorites_btn.favorites-added{color:var(--color-btn-bg)}

/* --- «Купить в 1 клик» — вторичная кнопка во всю ширину --- */
.widget-type_system_widget_v4_product_3 .product__buy-one-click{
  width:100%;text-align:center;
}
.widget-type_system_widget_v4_product_3 .product__buy-one-click.is-secondary-button .button{
  width:100%;background:var(--bg-minor-shade);color:var(--color-text);
  border:0;font-size:1.125rem;
}
.widget-type_system_widget_v4_product_3 .product__buy-one-click.is-secondary-button .button:hover{
  background:var(--bg-major-shade);
}
@media (max-width:767px){
  .widget-type_system_widget_v4_product_3 .product__buy-one-click{text-align:left}
}
/* ============================================================
   Аналогичные/Сопутствующие (products_similar_5 / products_related_5):
   InSales-виджет схлопывает кнопку до иконки 64px — нам нужна ПОЛНОШИРИННАЯ
   «В корзину» с AJAX (js-chai-card-add). Перебиваем !important (префиксное
   правило .product-preview__controls .button специфичнее).
   ============================================================ */
.widget-type_system_widget_v4_products_similar_5 .product-preview__controls,
.widget-type_system_widget_v4_products_related_5 .product-preview__controls{
  display:block !important; width:100% !important; margin-top:.5rem !important;
}
.widget-type_system_widget_v4_products_similar_5 .add-cart-counter,
.widget-type_system_widget_v4_products_related_5 .add-cart-counter{ width:100% !important; }
.widget-type_system_widget_v4_products_similar_5 .product-preview__controls .button.add-cart-counter__btn,
.widget-type_system_widget_v4_products_related_5 .product-preview__controls .button.add-cart-counter__btn{
  width:100% !important; min-width:0 !important; height:auto !important; min-height:3rem !important;
  padding:.6rem 1rem !important; gap:.3rem !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  border:none !important; border-radius:var(--controls-btn-border-radius,10px) !important;
  background:var(--color-btn-bg,#FC5600) !important; color:var(--color-btn-color,#fff) !important;
  font-weight:600 !important; cursor:pointer !important;
}
.widget-type_system_widget_v4_products_similar_5 .add-cart-counter__btn-label,
.widget-type_system_widget_v4_products_related_5 .add-cart-counter__btn-label{ display:inline !important; }
.widget-type_system_widget_v4_products_similar_5 .add-cart-counter__btn .button__icon,
.widget-type_system_widget_v4_products_related_5 .add-cart-counter__btn .button__icon{ margin-left:.3rem !important; font-size:1.15rem !important; }

/* ===== Счётчик «в корзине» на карточках — оформление 1:1 с продом =====
   Оранжевая плашка #FC5600, белый текст, количество ИНЛАЙН в тексте («В корзине N шт»),
   на ВСЕХ страницах (каталог/поиск/главная/карточка товара), а не только внутри виджета. */
.add-cart-counter { --cc-h: 40px; }
.add-cart-counter.is-add-cart .add-cart-counter__btn { display: none !important; }
.add-cart-counter.is-add-cart .add-cart-counter__controls { display: flex !important; }
.add-cart-counter__controls { width: 100%; height: var(--cc-h); text-align: center; display: none; }
.add-cart-counter__controls-btn {
  width: var(--cc-h); min-width: var(--cc-h); height: var(--cc-h); padding: 0; margin: 0 !important;
  font-size: 1.5rem; line-height: 1; border: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  background: #FC5600 !important; color: #fff !important;
}
.add-cart-counter__controls-btn:hover { background: #e34d00 !important; }
.add-cart-counter__controls-btn[data-add-cart-counter-minus] { border-radius: 10px 0 0 10px; }
.add-cart-counter__controls-btn[data-add-cart-counter-plus] { border-radius: 0 10px 10px 0; }
.add-cart-counter__detail {
  flex-grow: 1; margin: 0 1px !important; height: var(--cc-h);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-decoration: none; line-height: 1.1; border-radius: 0; padding: 0 5px;
  font-size: 0.75rem; background: #FC5600 !important; color: #fff !important;
}
.add-cart-counter__detail:hover { background: #e34d00 !important; color: #fff !important; }
.add-cart-counter__detail-text { display: block; color: #fff !important; }
.add-cart-counter__detail-label { color: #fff !important; }
.add-cart-counter__detail-count {
  display: inline !important; position: static !important; background: transparent !important;
  color: #fff !important; font-size: 0.75rem !important; width: auto !important; height: auto !important;
  min-width: 0 !important; padding: 0 !important; margin: 0 !important; border-radius: 0 !important; box-shadow: none !important;
}
.add-cart-counter__detail-count::before, .add-cart-counter__detail-count::after { content: none !important; }
.add-cart-counter__detail-dop-text { display: block; margin-top: 3px; opacity: .9; color: #fff; }

/* ===== Мобильный фильтр: открытое состояние (is-show-mobile) должно перебивать базовое
   правило .widget-..._sidebar_filter_3 .filter { transform: translateX(100%) } той же специфичности.
   Даём выше специфичность (виджет + 2 класса), иначе шторка фильтра не выезжает на мобиле. ===== */
@media screen and (max-width: 767px) {
  .widget-type_system_widget_v4_sidebar_filter_3 .filter.is-show-mobile,
  .widget-type_system_widget_v4_filter_sort_1 .filter.is-show-mobile {
    transform: translate3d(0, 0, 0) !important;
    visibility: visible !important;
  }
}

/* отступ между фото и заголовком в карточке товара (задача: на главной нет отступа) */
.product-preview__area-title{margin-top:10px;}

/* ===== ПВЗ-модалка: тёмный оверлей + центрирование + крестик ===== */
.co-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1049;display:none}
.co-overlay.co-overlay--show{display:block}
.co-modal--pick_up_modal{top:50%;left:50%;transform:translate(-50%,-50%)}
.co-modal-close{font-size:26px;line-height:1;width:2.2rem;height:2.2rem;color:#888;cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center}
.co-modal-close:hover{color:#148bdd}
.co-pvz__map{min-height:60vh}


/* Фикс кнопки «В корзину» в блоке «Каталог» на странице корзины (widget special_products_6):
   там протекала иконочная show-modal-variants-btn (40px) с обрезанным текстом — делаем как на главной */
.widget-type_system_widget_v4_special_products_6 .product-preview__controls .add-cart-counter:not(.is-add-cart) .button.add-cart-counter__btn{width:100%!important;display:inline-flex!important;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 16px}
.widget-type_system_widget_v4_special_products_6 .add-cart-counter__btn-label{display:inline!important;white-space:nowrap}

/* Единый интерфейс: на КАРТОЧКАХ товара всегда показываем «В корзину» (клик открывает модалку выбора);
   инлайн-счётчик (−/N/Перейти) на карточках не показываем — количество выбирается внутри модалки.
   Не затрагивает саму модалку и страницу корзины. */
.product-preview .add-cart-counter.is-add-cart .add-cart-counter__btn{display:inline-flex!important;width:100%!important}
.product-preview .add-cart-counter.is-add-cart .add-cart-counter__controls{display:none!important}

/* ============================================================
   Кнопка «Оплатить» в истории заказов (06.08.2026).
   Это ссылка, и в состоянии :visited браузер красит её цветом ссылки поверх
   цвета кнопки (в getComputedStyle это состояние намеренно не видно, поэтому
   правило заметно только глазами). Первичная кнопка — всегда белый текст.
   .button_second не трогаем: там текст брендовый оранжевый на белом фоне.
   ============================================================ */
.account-table__actions a.button:not(.button_second),
.account-table__actions a.button:not(.button_second):link,
.account-table__actions a.button:not(.button_second):visited,
.account-table__actions a.button:not(.button_second):hover,
.account-table__actions a.button:not(.button_second):focus,
.account-table__actions a.button:not(.button_second):active {
  color: #fff !important;
}

/* ============================================================
   Корзина внутри оформления (06.08.2026).
   Только РАСКЛАДКА: сами элементы — родные компоненты страницы корзины
   (.counter, .counter-button, .form-control_size-s, .icon-trash),
   поэтому цвета, рамки и шрифты берутся оттуда, ничего нового не вводим.
   ============================================================ */
.co-cart-row {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #eee;
}
.co-cart-row:first-child { padding-top: 0; }
.co-cart-row:last-child { border-bottom: 0; }

.co-cart-row__image {
  display: block; width: 56px; height: 56px;
  border-radius: 8px; overflow: hidden; background: #f6f4f1;
}
.co-cart-row__image img { width: 100%; height: 100%; object-fit: contain; display: block; }

.co-cart-row__body { min-width: 0; }
.co-cart-row__title {
  display: block; font-size: .9rem; line-height: 1.25;
  color: inherit; text-decoration: none;
}
.co-cart-row__title:hover { color: var(--color-btn-bg, #FC5600); }
.co-cart-row .variant-title { display: block; font-size: .75rem; color: #888; }

.co-cart-row__controls {
  display: flex; align-items: center; gap: 8px;
  margin-top: 8px; flex-wrap: nowrap;
}
.co-cart-row__controls .item-counter { flex: 0 0 auto; }
.co-cart-row__total { flex: 1 1 auto; text-align: right; font-weight: 600; white-space: nowrap; }
.co-cart-row__delete {
  flex: 0 0 auto; padding: 4px 6px; line-height: 1;
  background: transparent; border: 0; color: #b3b3b3;
}
.co-cart-row__delete:hover { color: #b00020; background: transparent; }

/* пока летит ответ — только приглушаем. Клики НЕ блокируем: нажатия «+» склеиваются
   в один запрос, а pointer-events:none просто съедал бы их. */
#co-cart-items.is-loading { opacity: .6; }

/* Бонусы перед кнопкой оформления */
.co-bonus-block__row { display: flex; gap: 8px; align-items: center; }
.co-bonus-block__row .form-control { flex: 1 1 auto; min-width: 0; }
.co-bonus-block__row .button { flex: 0 0 auto; white-space: nowrap; }

@media (max-width: 480px) {
  .co-cart-row__controls { flex-wrap: wrap; }
  .co-cart-row__total { order: 3; width: 100%; text-align: left; }
}

/* ============================================================
   Компактная раскладка корзины в сайдбаре оформления (06.08.2026).
   Родные .counter и .coupon-content нарисованы под ШИРОКУЮ страницу корзины:
   .counter — display:block, поле разъезжалось до 173 px, а промокод ставил кнопку
   на отдельную строку. Здесь колонка ~300 px, поэтому задаём размеры явно.
   Меняем ТОЛЬКО геометрию — цвета и рамки остаются темы.
   ============================================================ */
.co-cart-row__controls { flex-wrap: nowrap; gap: 10px; }

.co-cart-row .counter {
  display: flex;
  align-items: center;
  gap: 4px;
  width: auto;
}
.co-cart-row .counter-button {
  width: 28px; min-width: 28px; height: 28px;
  padding: 0; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
}
.co-cart-row .counter-input {
  width: 40px; min-width: 40px; flex: 0 0 auto;
  height: 28px; padding: 0 4px; text-align: center;
}
.co-cart-row__total { font-size: .95rem; }
.co-cart-row__delete { width: 24px; min-width: 24px; padding: 0; }

/* Промокод: поле и кнопка в одну строку */
#co-promo .coupon-content {
  display: flex; align-items: center; gap: 8px;
}
#co-promo .coupon-input { flex: 1 1 auto; min-width: 0; }
#co-promo .coupon-input .form-control { width: 100%; }
#co-promo .coupon-button { flex: 0 0 auto; white-space: nowrap; padding: 0 14px; }

/* Узкая колонка: цена уходит на свою строку, счётчик остаётся компактным */
@media (max-width: 360px) {
  .co-cart-row__controls { flex-wrap: wrap; }
  .co-cart-row__total { order: 3; width: 100%; text-align: left; }
}

/* На широком сайдбаре (десктоп, колонка ~600 px) позиция помещается В ОДНУ СТРОКУ:
   картинка — название — счётчик — цена — удалить. На мобильном сайдбар во всю ширину
   и строится в две строки, иначе название сжимается до нечитаемого. */
@media screen and (min-width: 769px) {
  .co-cart-row {
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 10px 0;
  }
  .co-cart-row__image { width: 44px; height: 44px; }
  .co-cart-row__body {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  /* название и вариант — своей колонкой, иначе подпись варианта отжимала название в ноль */
  .co-cart-row__text { flex: 1 1 auto; min-width: 0; }
  .co-cart-row__title {
    font-size: .85rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .co-cart-row__controls { flex: 0 0 auto; margin-top: 0; gap: 8px; }
  .co-cart-row__total { flex: 0 0 auto; min-width: 62px; text-align: right; }
}


/* ---- chai: модалки с портированными классами виджета InSales ----
   Контейнер модалок «Купить в 1 клик» и «Обратный звонок» несёт классы
   .layout.widget-type_system_widget_v4_callback_modal_1. В pages.css этот класс
   скрыт (display:none) — так InSales прячет неотрендеренные виджеты. У нас их
   рендерит тема, снимать класс некому, поэтому открывался только тёмный оверлей,
   а само окно оставалось невидимым. Возвращаем показ внутри открытой модалки. */
.modal.is-open .modal__container.widget-type_system_widget_v4_callback_modal_1.layout {
  display: block;
}


/* ---- chai: единственный h1 на главной ----
   Заголовок нужен поиску и читалкам, но в дизайн главной он не заложен.
   Прячем визуально, НЕ скрывая от роботов (display:none их бы отпугнул). */
.chai-h1 {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  clip: rect(0 0 0 0); clip-path: inset(50%);
  overflow: hidden; white-space: nowrap;
}


/* ---- chai: подарок к заказу ----
   Карточка подарка — тот же .co-toggable_field, что у доставки и оплаты;
   добавляем только миниатюру и зачёркнутую старую цену. Геометрия миниатюры
   взята у строки корзины в сайдбаре, чтобы блок не выбивался. */
.co-gift-thumb { flex: 0 0 auto; width: 44px; height: 44px; margin-right: 10px;
  border-radius: 8px; overflow: hidden; background: #f6f4f1; display: flex;
  align-items: center; justify-content: center; }
.co-gift-thumb img { max-width: 100%; max-height: 100%; object-fit: contain; }
.co-gift-old { color: #747474; font-weight: 400; margin-right: 6px; }
.co-gift-block--off { opacity: .55; pointer-events: none; }
.co-gift-block.is-loading { opacity: .6; pointer-events: none; }
@media (max-width: 640px) { .co-gift-thumb { width: 36px; height: 36px; } }

/* Куки-баннер: показом управляет hidden + is-show, а pages.css принёс с оригинала
   правило display:none и центрирование через translateX. Согласуем, чтобы стили
   не гасили друг друга: скрыт — когда hidden, показан — когда is-show. */
.cookie-consent[hidden]{display:none !important}
.cookie-consent.is-show{display:block;left:50%;right:auto;bottom:20px;transform:translateX(-50%)}
.cookie-consent .cookie-consent__inner{max-width:none;margin:0;padding:0}

/* Недоступный вариант подарка: виден, но приглушён — так понятнее, чем спрятать. */
.co-gift--off { opacity: .5; }
.co-gift--off .co-input-title { color: #747474; }

/* Шкала порогов акции «От всего сердца» */
.co-gift-tiers { margin-top: .75rem; padding: .8rem 1rem; background: #FAF4F0; border-radius: 10px; font-size: .9rem; }
.co-gift-tiers__title { font-weight: 600; margin-bottom: .4rem; }
.co-gift-tiers__list { margin: 0; padding-left: 1.1rem; }
.co-gift-tiers__list li { margin: .15rem 0; color: #4a4a4a; }
.co-gift-tiers__list li.is-current { font-weight: 700; color: #1f1f1f; }
.co-gift-tiers__note { margin-top: .5rem; color: #8a8a8a; font-size: .85rem; }

/* Слайдер акций на главной: стрелки без фона и белые точки терялись на светлых
   баннерах — оставался виден только активный кружок. */
.js-promo-slider .splide__arrow { background: rgba(255,255,255,.92) !important; border-radius: 50%;
  box-shadow: 0 2px 10px rgba(0,0,0,.18); opacity: 1; width: 44px; height: 44px; }
.js-promo-slider .splide__arrow:hover { background: #fff !important; }
.js-promo-slider .splide__arrow svg { fill: #1f1f1f; width: 18px; height: 18px; }
.js-promo-slider .splide__arrow--prev { left: 12px; }
.js-promo-slider .splide__arrow--next { right: 12px; }

.js-promo-slider .splide__pagination__page { background: #CCCCCC; border: none; }
.js-promo-slider .splide__pagination__page.is-active { background: #FC5600; border: none; }

/* Подарки со скидкой 30% — вложенный список под своей акцией */
.co-gift--variant { margin-left: 22px; }
@media (max-width: 767px) { .co-gift--variant { margin-left: 12px; } }
