.elementor-kit-170{--e-global-color-primary:#FFFFFF;--e-global-color-secondary:#333333;--e-global-color-text:#000000;--e-global-color-accent:#9D7544;--e-global-typography-primary-font-family:"Tenor Sans";--e-global-typography-primary-font-size:40px;--e-global-typography-primary-font-weight:500;--e-global-typography-secondary-font-family:"Tenor Sans";--e-global-typography-secondary-font-size:32px;--e-global-typography-secondary-font-weight:500;--e-global-typography-text-font-family:"Tenor Sans";--e-global-typography-text-font-size:18px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Tenor Sans";--e-global-typography-accent-font-size:17px;--e-global-typography-accent-font-weight:500;font-family:"Helvetica", Tenor-sans;font-size:18px;}.elementor-kit-170 e-page-transition{background-color:#FFBC7D;}.elementor-kit-170 a{color:#000000;font-family:"Tenor Sans", Tenor-sans;}.elementor-kit-170 a:hover{color:#9D7544;}.elementor-kit-170 h1{color:var( --e-global-color-text );font-family:"Tenor Sans", Tenor-sans;font-size:45px;font-weight:500;}.elementor-kit-170 h2{color:var( --e-global-color-text );font-family:"Tenor Sans", Tenor-sans;font-size:35px;font-weight:500;}.elementor-kit-170 h3{color:#000000;font-family:"Tenor Sans", Tenor-sans;font-size:30px;font-weight:500;}.elementor-kit-170 h4{font-family:"Tenor Sans", Tenor-sans;font-size:30px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1600px;}.e-con{--container-max-width:1600px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-170 h2{font-size:22px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Стили для прозрачных плашек с черной обводкой */
.wpf_items_wrapper .wpf_item label {
    display: inline-block; /* Чтобы элементы располагались по горизонтали */
    padding: 10px 20px; /* Паддинг для создания квадратной формы */
    margin: 5px; /* Уменьшаем расстояние между элементами */
    border-radius: 0px; /* Убираем округление углов */
    background-color: rgba(255, 255, 255, 0.2); /* Прозрачный фон */
    color: rgba(3, 3, 3, 1); /* Черный цвет текста */
    border: 1px solid rgba(0, 0, 0, 1); /* Черная обводка */
    font-family: 'Tenor Sans', sans-serif; /* Шрифт Tenor Sans */
    transition: background-color 0.3s, transform 0.3s, border-color 0.3s;
}

/* Уменьшаем расстояние между категориями */
.wpf_items_wrapper .wpf_item {
    margin-bottom: 5px; /* Уменьшаем расстояние между категориями */
}

/* При наведении на плашку — заполняем фон белым */
.wpf_items_wrapper .wpf_item label:hover {
    background-color: #FFFFFF; /* Заполняем фон белым при наведении */
    color: rgba(3, 3, 3, 1); /* Черный цвет текста */
    transform: scale(1.05); /* Немного увеличиваем плашку при наведении */
}

/* Когда элемент выбран — изменяем цвет рамки */
.wpf_items_wrapper .wpf_item input[type="radio"]:checked + label {
    border-color: #C7B100; /* Цвет рамки при выборе */
}

/* Медиазапрос для мобильных устройств */
@media (max-width: 768px) {
    .wpf_items_wrapper .wpf_item label {
        padding: 8px 16px; /* Уменьшаем паддинги */
        font-size: 14px; /* Уменьшаем размер шрифта */
    }

    .wpf_items_wrapper .wpf_item {
        margin-bottom: 4px; /* Уменьшаем расстояние между элементами */
    }

    /* При наведении на плашку на мобильных устройствах */
    .wpf_items_wrapper .wpf_item label:hover {
        transform: scale(1); /* Убираем увеличение при наведении на мобильных */
    }
}






/* Если Tenor Sans не подключён где-то ещё */
@import url('https://fonts.googleapis.com/css2?family=Tenor+Sans&display=swap');

/* Контейнер цены вариации */
.single_variation_wrap .woocommerce-variation-price {
  margin: 20px 0 !important;    /* отступ сверху/снизу */
  display: block !important;
}

/* Лейбл "Ціна:" и сама сумма в твоей разметке */
.single_variation_wrap .woocommerce-variation-price .price,
.single_variation_wrap .woocommerce-variation-price .variation-price-label,
.single_variation_wrap .woocommerce-variation-price .woocommerce-Price-amount,
.single_variation_wrap .woocommerce-variation-price .woocommerce-Price-amount bdi,
.single_variation_wrap .woocommerce-variation-price .price ins,
.single_variation_wrap .woocommerce-variation-price .price del {
  font-family: 'Tenor Sans', serif !important;
  font-size: 26px !important;
  color: #000 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
}



/* Мобильная версия (до 768px) */
@media (max-width: 768px) {
  .single_variation_wrap .woocommerce-variation-price .price,
  .single_variation_wrap .woocommerce-variation-price .variation-price-label,
  .single_variation_wrap .woocommerce-variation-price .woocommerce-Price-amount,
  .single_variation_wrap .woocommerce-variation-price .woocommerce-Price-amount bdi,
  .single_variation_wrap .woocommerce-variation-price .price ins,
  .single_variation_wrap .woocommerce-variation-price .price del {
    font-size: 20px !important;
  }
}



/* Убираем фон и уменьшаем внешние отступы у блока выбора вариации */
.single-product table.variations {
  background-color: transparent !important;
  margin-top: -50px !important;   /* уменьшенный верхний отступ */
  margin-bottom: 0px !important; /* снизу, чтобы тоже было компактно */
}

/* На всякий случай убираем фон у ячеек */
.single-product table.variations th,
.single-product table.variations td {
  background-color: transparent !important;
}

.woocommerce a.added_to_cart {
    display: none !important;
}




.woocommerce-order-received .woocommerce-thankyou-order-received {
    font-size: 28px;
    color: #FFF;
    text-align: center;
    padding: 20px;
    background-color: #000;
}



.woocommerce-column--billing-address {
    display: none !important;
}


.woocommerce-column--shipping-address {
    float: left !important;
    margin-right: 20px; /* Отступ справа, чтобы не прилипал */
    width: 40%; /* Уменьши ширину, если нужно */
}

.woocommerce-order-details {
    
    width: 60%; /* Подстрой ширину (50%, 70% — как тебе удобно) */
    text-align: left; /* Текст внутри слева, убери или замени на center, если нужен центр текста */
	color: #000;
}


.woocommerce-order-details,
.woocommerce-order-details a,
.woocommerce-order-details p,
.woocommerce-order-details span {
    color: #000000 !important; /* Черный цвет для текста и ссылок */
    text-decoration: none !important; /* Убрать подчеркивание у ссылок, если нужно */
}







.wpf-label-option-all {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}





html, body {
  overflow-x: hidden;  /* запрещаем прокрутку всей страницы вправо */
}



/* Общий стиль для пагинации */
.swiper-pagination-bullets .swiper-pagination-bullet {
  width: 25px !important;
  height: 25px !important;
  border: 2px solid #000 !important;
  border-radius: 0 !important;          /* квадрат */
  background: transparent !important;   /* пустой внутри */
  opacity: 1 !important;                /* не тусклые */
  margin: 0 8px !important;             /* расстояние */
  box-sizing: border-box;
  vertical-align: middle;
  transform: none !important;
  line-height: 0;
}

/* У некоторых тем точка рисуется через псевдоэлемент — выключим его */
.swiper-pagination-bullets .swiper-pagination-bullet::after {
  display: none !important;
}

/* Активный квадрат — залитый */
.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #000 !important;
  border-color: #000 !important;
}

/* --- Адаптивность --- */

/* На планшетах и меньше */
@media (max-width: 1024px) {
  .swiper-pagination-bullets .swiper-pagination-bullet {
    width: 18px !important;
    height: 18px !important;
    margin: 0 6px !important;
  }
}

/* На телефонах */
@media (max-width: 767px) {
  .swiper-pagination-bullets .swiper-pagination-bullet {
    width: 12px !important;
    height: 12px !important;
    margin: 0 4px !important;
		border: 1px solid #000 !important;
  }
}






















































/* Скрыть нативные селекты именно наших атрибутов */
form.variations_form select[name="attribute_pa_size"],
form.variations_form select[name="attribute_pa_aromat"],
form.variations_form .reset_variations { display:none !important; }

/* Лейбл + контрол в одну строку */
.attr-block.label-inline{ display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.attr-block .attr-label{
  margin:0;
  font-family:"Tenor Sans","TenorSense",serif;
  font-size:20px; font-weight:400; line-height:1;
  min-width:max-content;
}

/* КНОПКИ размера (M/L): 20px, weight 400, паддинги 8, инверсия при active */
.attr-buttons{ display:flex; gap:12px; }
.attr-btn{
  font-family:"Tenor Sans","TenorSense",serif;
  font-size:20px; font-weight:400; line-height:1;
  border:1px solid #000; background:transparent; color:#000;
  padding:8px; border-radius:8px; min-width:48px; text-align:center; cursor:pointer;
}
.attr-btn.active{ background:#000; color:#fff; }

/* Псевдо-селект “Аромат” */
.aroma-select{ position:relative; width:100%; max-width:360px; }
.aroma-selected{
  display:grid; grid-template-columns: 28px 1fr 16px; align-items:center; gap:8px;
  border:1px solid #000; background:transparent; border-radius:8px; padding:8px 12px;
  font-family:"Tenor Sans","TenorSense",serif; font-size:20px; font-weight:400;
  text-align:left; cursor:pointer; width:100%;
}
.aroma-selected .aroma-thumb img{ width:24px; height:24px; border-radius:6px; object-fit:cover; display:block; }
.aroma-selected .aroma-name{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aroma-selected .aroma-caret{
  width:0; height:0; justify-self:end;
  border-left:5px solid transparent; border-right:5px solid transparent; border-top:7px solid #000;
}
.aroma-select.is-open .aroma-selected .aroma-caret{ transform:rotate(180deg); }

/* Дропдаун: ~7 видимых пунктов, скролл */
.aroma-dropdown{
  position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:50;
  background:#fff; border:1px solid #000; border-radius:8px;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  padding:8px; display:none;
  max-height: calc(7 * 48px + 8px); overflow-y:auto;
}
.aroma-select.is-open .aroma-dropdown{ display:block; }

/* Пункты дропдауна */
.aroma-option{
  display:grid; grid-template-columns: 28px 1fr; gap:8px; align-items:center;
  border:1px solid #eee; border-radius:8px; padding:8px; cursor:pointer; margin-bottom:6px;
  font-family:"Tenor Sans","TenorSense",serif; font-size:18px; font-weight:400;
}
.aroma-option:last-child{ margin-bottom:0; }
.aroma-option img{ width:28px; height:28px; border-radius:6px; object-fit:cover; display:block; }
.aroma-option.active{ border-color:#000; box-shadow:0 0 0 2px rgba(0,0,0,.05) inset; }








/* Спрятать нативные селекты и "сброс" */
.single-product form.variations_form .variations,
.single-product form.variations_form .reset_variations { display: none !important; }

/* Лейбл + контрол в одну строку */
.attr-block.label-inline{ display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.attr-block .attr-label{
  margin:0;
  font-family:"Tenor Sans","TenorSense",serif;
  font-size:20px; font-weight:400; line-height:1; min-width:max-content;
}

/* === РАЗМЕР: квадратные кнопки === */
.attr-buttons{
  display:flex; gap:12px;
  --size-btn: 36px* 20px шрифт + по 8px паддинги = 36px. Хочешь меньше/больше — поменяй это значение. */
}

.attr-btn{
  box-sizing: border-box;
  display:inline-flex; align-items:center; justify-content:center;
  width: var(--size-btn) !important;
  height: var(--size-btn) !important;
  padding: 8px;                 /* ровно 8 со всех сторон */
  border: 1px solid #000;
  background: transparent; color:#000;
  border-radius: 0 !important;  /* без скруглений */
  cursor: pointer; user-select: none;

  font-family:"Tenor Sans","TenorSense",serif;
  font-size:20px; font-weight:400; line-height:1;
  min-width: 0 !important;      /* снимаем прежние min-width */
}

.attr-btn:hover,
.attr-btn:focus-visible,
.attr-btn.active{
  background:#000; color:#fff; border-color:#000;
}

/* === АРОМАТ: псевдо-селект === */
.aroma-select{ position:relative; width:280px; max-width:100%; }
.aroma-selected{
  display:grid; grid-template-columns:23px 1fr 12px; align-items:center; gap:8px;
  width:100%; padding:8px; border:1px solid #000;
  background:transparent; color:#000; border-radius:0 !important;
  font-family:"Tenor Sans","TenorSense",serif; font-size:20px; font-weight:400; line-height:1.1;
  text-align:left; cursor:pointer;
}
.aroma-selected .aroma-thumb img{ width:23px; height:23px; object-fit:cover; display:block; }
.aroma-selected .aroma-name{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aroma-selected .aroma-caret{
  width:0; height:0; justify-self:end;
  border-left:5px solid transparent; border-right:5px solid transparent; border-top:7px solid #000;
}

/* Дропдаун: фикс ширина как у селекта, 7 строк, без скруглений */
.aroma-dropdown{
  position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:50;
  display:none; padding:8px; background:#fff; border:1px solid #000; border-radius:0 !important;
  max-height: calc(7 * 39px + 8px); overflow-y:auto; overflow-x:hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}
.aroma-select.is-open .aroma-dropdown{ display:block; }

/* Пункты дропдауна */
.aroma-option{
  display:grid; grid-template-columns:23px 1fr; gap:8px; align-items:center;
  
  padding:8px; margin:0 0 6px 0; border:1px solid #e6e6e6; border-radius:0 !important;
  cursor:pointer;

  font-family:"Tenor Sans","TenorSense",serif; font-size:18px; font-weight:400; line-height:1.1;
}
.aroma-option:last-child{ margin-bottom:0; }
.aroma-option img{ width:23px; height:23px; object-fit:cover; display:block; }
.aroma-option.active{ border-color:#000; box-shadow: inset 0 0 0 2px rgba(0,0,0,.05); }

/* Если у аромата нет картинки */
.aroma-option:not(:has(img)){ grid-template-columns:1fr; }
.aroma-selected:not(:has(img)) .aroma-thumb{ display:none; }

/* Тонкий скролл */
.aroma-dropdown::-webkit-scrollbar{ width:6px; }
.aroma-dropdown::-webkit-scrollbar-track{ background:transparent; }
.aroma-dropdown::-webkit-scrollbar-thumb{ background:#c9c9c9; }
.aroma-dropdown:hover::-webkit-scrollbar-thumb{ background:#aaa; }
.aroma-dropdown{ scrollbar-width: thin; scrollbar-color:#c9c9c9 transparent; }





/* === ЖЕСТКИЙ РЕСЕТ И РАЗМЕРЫ ДЛЯ КНОПОК РАЗМЕРА === */
.single-product .attr-buttons { --size-btn: 40px; 
margin-left: 80px; 
gap: 7px !important;
} /* <-- ПРАВЬ здесь: 34px, 32px, 36px и т.п. */

/* плотнее друг к другу */
.single-product .attr-buttons { justify-content:flex-start !important; padding:0 !important; }

/* убираем любые внутренние отступы/минимальные ширины у кнопок */
.single-product .attr-buttons .attr-btn{ margin:0px !important; }

/* задаём расстояние между соседними кнопками */
.single-product .attr-buttons .attr-btn + .attr-btn{ margin-left:10px !important; }

/* на случай, если тема навешивает column-gap/gap */
.single-product .attr-buttons{ column-gap:0px !important; gap:0 !important; }




.single-product .attr-buttons .attr-btn{
  /* убиваем наследование темы */
  
  box-sizing: border-box;

  /* размеры (квадрат) */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: var(--size-btn) !important;
  height: var(--size-btn) !important;
  padding: 10px !important;

  /* рамка/цвета/курсор */
  border: 1px solid #000 !important;
  background: transparent !important;
  color: #000 !important;
  cursor: pointer !important;

  /* типографика */
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-align: center !important;

  /* на всякий случай */
  min-width: 0 !important;
  border-radius: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

.single-product .attr-buttons .attr-btn:hover,
.single-product .attr-buttons .attr-btn:focus-visible,
.single-product .attr-buttons .attr-btn.active{
  background:#000 !important;
  color:#fff !important;
  border-color:#000 !important;
}






































/* ── Aroma: верхняя плашка = как пункты в дропдауне ─────────────────────────── */
.single-product .aroma-selected{
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-size:18px !important;           /* как в дропдауне */
  font-weight:400 !important;
  line-height:1.1 !important;
  width:100% !important;

  display:grid !important;
  grid-template-columns:23px 1fr 12px !important;  /* иконка | название | стрелка */
  column-gap:12px !important;                      /* «жирный пробел» перед стрелкой */
  align-items:center !important;

  padding:8px !important;              /* компактнее, как у пунктов */
  border:1px solid #000 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#000 !important;
  text-align:left !important;
  cursor:pointer !important;
}
.single-product .aroma-selected .aroma-thumb img{
  width:26px !important; height:26px !important; object-fit:cover !important; display:block !important;
  border-radius:0 !important;          /* без скруглений у иконки */
}
.single-product .aroma-selected .aroma-caret{
  width:0; height:0; justify-self:end;
  border-left:5px solid transparent; border-right:5px solid transparent; border-top:7px solid #000;
}
.single-product .aroma-selected:hover,
.single-product .aroma-select.is-open .aroma-selected{
  background:#000 !important; color:#fff !important; border-color:#000 !important;
}
.single-product .aroma-selected:hover .aroma-caret,
.single-product .aroma-select.is-open .aroma-selected .aroma-caret{
  border-top-color:#fff !important;
}

/* ── Aroma: дропдаун ровно под плашкой, 7 видимых пунктов без обрезания ─────── */
.single-product .aroma-dropdown{
  position:absolute !important; left:0; right:0; top:calc(100% + 6px) !important; z-index:50;
  background:#fff !important; border:1px solid #000 !important; border-radius:0 !important;
  padding:8px !important; box-shadow:0 8px 24px rgba(0,0,0,.08) !important;

  display:none; flex-direction:column !important; row-gap:6px !important;  /* вместо margin'ов у пунктов */
  /* 7 строк: каждая 39px высотой + 6 промежутков по 6px + сверху/снизу по 8px = всё видно, ничего не режется */
  max-height: calc(7 * 39px + 6 * 6px + 16px) !important;
  overflow-y:auto !important; overflow-x:hidden !important;
}
.single-product .aroma-select.is-open .aroma-dropdown{ display:flex !important; }

/* пункты в списке — компактные, без скруглений, фикс-высота */
.single-product .aroma-option{
  display:grid !important; grid-template-columns:23px 1fr !important; align-items:center !important;
  padding:7px !important;
  padding-bottom:px !important;
  min-height:39px !important;
  border:1px solid #e6e6e6 !important; border-radius:0 !important;
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:18px !important; font-weight:400 !important;
  cursor:pointer !important;
}
.single-product .aroma-option img{ width:23px !important; height:23px !important; object-fit:cover !important; border-radius:0 !important; display:block !important; }
.single-product .aroma-option.active{ border-color:#000 !important; box-shadow:inset 0 0 0 2px rgba(0,0,0,.05) !important; }

/* тонкий скролл */
.single-product .aroma-dropdown::-webkit-scrollbar{ width:2px; }
.single-product .aroma-dropdown::-webkit-scrollbar-track{ background:transparent; }
.single-product .aroma-dropdown::-webkit-scrollbar-thumb{ background:#bdbdbd; }
.single-product .aroma-dropdown:hover::-webkit-scrollbar-thumb{ background:#9a9a9a; }
.single-product .aroma-dropdown{ scrollbar-width:thin; scrollbar-color:#bdbdbd transparent; }

/* на всякий пожарный: убить скругления и большие внутренние отступы, если их навешивает тема */
.single-product .aroma-selected,
.single-product .aroma-dropdown,
.single-product .aroma-option{ border-radius:0 !important; }




































/* ===== Вариативные товары: выстраиваем ряд количествo + 2 кнопки ===== */
.single-product .single_variation_wrap .variations_button{
  display:flex !important;
  align-items:stretch !important;
  flex-wrap:wrap !important;
}
.single-product .single_variation_wrap .variations_button .quantity{
  margin-right:12px !important;
}
.single-product .single_variation_wrap .variations_button .single_add_to_cart_button,
.single-product .single_variation_wrap .variations_button .oneclick-btn{
  display:inline-flex !important;
  width:auto !important;
  margin:0 !important;
}
.single-product .single_variation_wrap .variations_button .oneclick-btn{
  margin-left:12px !important;   /* расстояние между кнопками */
}

/* ===== Простые товары (без вариаций): тот же ряд ===== */
.single-product form.cart:not(.variations_form){
  display:flex !important;
  align-items:stretch !important;
  flex-wrap:wrap !important;
}
.single-product form.cart:not(.variations_form) .quantity{
  margin-right:12px !important;
}
.single-product form.cart:not(.variations_form) .single_add_to_cart_button,
.single-product form.cart:not(.variations_form) .oneclick-btn{
  display:inline-flex !important;
  width:auto !important;
  margin:0 !important;
}
.single-product form.cart:not(.variations_form) .oneclick-btn{
  margin-left:12px !important;
}

/* На всякий случай: убиваем «full-width» у темы */
.single-product .single_add_to_cart_button{ width:auto !important; }

































/* общая высота/выравнивание двух кнопок */
.single-product form.cart .single_add_to_cart_button,
.single-product .oneclick-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  height:44px !important;           /* единая высота */
  padding:0 18px !important;         /* одинаковые боковые отступы */
  border:1px solid #000 !important;
  border-radius:0 !important;
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1 !important;          /* фиксим “подъём” текста */
  text-transform:none !important;
  letter-spacing:0 !important;
  cursor:pointer !important;
  vertical-align:middle !important;  /* страховка */
}

/* расстояние между кнопками */
.single-product .oneclick-btn{ margin-left:12px !important; }

/* дефолт/ховер — инверсия */
.single-product form.cart .single_add_to_cart_button{
  background:#000 !important; color:#fff !important;
}
.single-product form.cart .single_add_to_cart_button:hover{
  background:#fff !important; color:#000 !important;
}
.single-product .oneclick-btn{
  background:#fff !important; color:#000 !important;
}
.single-product .oneclick-btn:hover{
  background:#000 !important; color:#fff !important;
}

/* маленькая иконка корзины слева у “Додати в кошик” */
.single-product form.cart .single_add_to_cart_button::before{
  content:"";
  display:inline-block;
  width:16px; height:16px;
  margin-right:8px;
  background-color: currentColor;     /* наследует цвет текста кнопки → инвертится автоматически */
  /* маска с простым SVG “корзина” */
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM5.1 5h-.6a1 1 0 0 0 0 2h1.2l2.2 8.2A2 2 0 0 0 9.8 17h7.8a2 2 0 0 0 1.9-1.4l2.1-6.2A1 1 0 0 0 21.6 8H7.2L6.6 5.8A2 2 0 0 0 5.1 5Z"/></svg>') no-repeat center / contain;
          mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM5.1 5h-.6a1 1 0 0 0 0 2h1.2l2.2 8.2A2 2 0 0 0 9.8 17h7.8a2 2 0 0 0 1.9-1.4l2.1-6.2A1 1 0 0 0 21.6 8H7.2L6.6 5.8A2 2 0 0 0 5.1 5Z"/></svg>') no-repeat center / contain;
}

/* чтобы количество было той же высоты */
.single-product form.cart .quantity .qty{
  height:44px !important; line-height:44px !important;
  padding:0 10px !important;
  border:1px solid #000 !important; border-radius:0 !important;
  text-align:center !important;
}

/* если вдруг тема тянет кнопки на всю ширину — глушим */
.single-product form.cart .single_add_to_cart_button,
.single-product .oneclick-btn{ width:auto !important; min-width:0 !important; }




























/* дефолтные состояния + инверсия */
.single-product form.cart .single_add_to_cart_button{ background:#000 !important; color:#fff !important; }
.single-product form.cart .single_add_to_cart_button:hover{ background:#fff !important; color:#000 !important; }
.single-product .oneclick-btn{ background:#fff !important; color:#000 !important; }
.single-product .oneclick-btn:hover{ background:#000 !important; color:#fff !important; }

/* чуть выправляем вертикаль, если тема оборачивает текст в span/strong */
.single-product form.cart .single_add_to_cart_button > *,
.single-product .oneclick-btn > *{ line-height:1 !important; }

/* ИКОНКА: "пакет" слева у «Додати в кошик» (наследует цвет текста → сама инвертится) */
.single-product form.cart .single_add_to_cart_button::before{
  content:"";
  display:inline-block;
  width:18px; height:18px; margin-right:10px;
  background-color: currentColor;
  -webkit-mask: url('data:image/svg+xml;utf8,\
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\
    <path d="M7 6V5a5 5 0 0 1 10 0v1h3a1 1 0 0 1 1 1l-1.6 12a2 2 0 0 1-2 2H6.6a2 2 0 0 1-2-1.8L3 7a1 1 0 0 1 1-1h3zm2 0h6V5a3 3 0 0 0-6 0v1z"/>\
  </svg>') no-repeat center / contain;
          mask: url('data:image/svg+xml;utf8,\
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\
    <path d="M7 6V5a5 5 0 0 1 10 0v1h3a1 1 0 0 1 1 1l-1.6 12a2 2 0 0 1-2 2H6.6a2 2 0 0 1-2-1.8L3 7a1 1 0 0 1 1-1h3zm2 0h6V5a3 3 0 0 0-6 0v1z"/>\
  </svg>') no-repeat center / contain;
}

/* Ряд для variable/simple уже настроен у тебя; на всякий случай отключим full-width тем */
.single-product .single_add_to_cart_button,
.single-product .oneclick-btn{ width:3px !important; }

/* Адаптив (если на мобиле не влазит по ширине) */
@media (max-width: 768px){
  .single-product .oneclick-btn{ margin-left:0 !important; margin-top:10px !important; }
  .single-product form.cart .single_add_to_cart_button,
  .single-product .oneclick-btn{ width:100% !important; height:56px !important; font-size:20px !important; }
}

/* === МОДАЛКА 1-КЛІК: компактнее, квадратные поля/кнопка, нормальный Х === */
/* бьем inline-стили из PHP через !important */
#oneclick-modal{ display:none; position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,.45) !important; }
#oneclick-dialog{
  background:#fff !important;
  max-width:420px !important;
  margin:10vh auto !important;
  padding:24px 24px 20px !important;   /* больше паддинги */
  border:1px solid #000 !important; border-radius:0 !important;
  position:relative !important;
}
#oneclick-close{
  position:absolute !important; right:10px !important; top:10px !important;
  width:32px !important; height:32px !important;
  border:1px solid #000 !important; border-radius:0 !important;
  background:#fff !important; color:#000 !important;
  line-height:30px !important; font-size:18px !important; cursor:pointer !important;
}
#oneclick-close:hover{ background:#000 !important; color:#fff !important; }

#oneclick-modal h3{
  margin:0 0 12px 0 !important;
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-weight:400 !important; font-size:18px !important; line-height:1.2 !important;
}
/* прячем заголовок, когда начали вводить */
#oneclick-modal.oc-has-input h3{ display:none !important; }

#oneclick-form label{ display:block !important; font-size:12px !important; margin:0 0 6px 0 !important; color:#333 !important; }
#oneclick-form input{
  width:100% !important; height:48px !important;
  padding:0 12px !important; border:1px solid #000 !important; border-radius:0 !important;
  font-size:16px !important; margin:0 0 12px 0 !important;
}
#oneclick-submit{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  margin:14px auto 0 !important;
  height:52px !important; padding:0 24px !important;
  border:1px solid #000 !important; border-radius:0 !important;
  background:#000 !important; color:#fff !important;
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:18px !important; font-weight:400 !important;
}
#oneclick-submit:hover{ background:#fff !important; color:#000 !important; }





















/* === ОБЕ КНОПКИ: ровно 314×60, 24px Tenor Sans, одинаковые === */
.single-product form.cart .single_add_to_cart_button,
.single-product .oneclick-btn{
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:20px !important;            /* одинаковая ширина */
  height:60px !important;            /* одинаковая высота */
  padding:0 24px !important;
  border:1px solid #000 !important;
  border-radius:0 !important;
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-size:24px !important;
  font-weight:400 !important;
  line-height:1 !important;
  text-transform:none !important;
  letter-spacing:0 !important;
  cursor:pointer !important;
  vertical-align:middle !important;
  min-width:0 !important;
}

/* дефолт/ховер — инверсия */
.single-product form.cart .single_add_to_cart_button{ background:#000 !important; color:#fff !important; }
.single-product form.cart .single_add_to_cart_button:hover{ background:#fff !important; color:#000 !important; }
.single-product .oneclick-btn{ background:#fff !important; color:#000 !important; }
.single-product .oneclick-btn:hover{ background:#000 !important; color:#fff !important; }

/* если вдруг 1-click кажется уже — запрети теме «растягивать» соседние элементы */
.single-product .single_add_to_cart_button,
.single-product .oneclick-btn{ flex:0 0 290px !important; }

/* ИКОНКА «пакет» слева у “Додати в кошик” — твой файл, красится под currentColor */
.single-product form.cart .single_add_to_cart_button::before{
  content:"";
  display:inline-block;
  width:18px; height:18px; margin-right:10px;
  background-color:currentColor;
  -webkit-mask: url("https://marmar.company/wp-content/uploads/2025/09/Vector.png") no-repeat center / contain;
          mask: url("https://marmar.company/wp-content/uploads/2025/09/Vector.png") no-repeat center / contain;
}

/* ===== МОДАЛКА: компактнее, квадратные поля, нормальный крестик ===== */

/* сам контейнер и диалог — чуть больше внутренних отступов */
#oneclick-modal{ background:rgba(0,0,0,.45) !important; }
#oneclick-dialog{
  padding:28px 28px 22px !important;
  border:1px solid #000 !important; border-radius:0 !important;
}

/* крестик — без «розового», без смещений, ровно в углу */
#oneclick-close{
  position:absolute !important; right:12px !important; top:12px !important;
  width:32px !important; height:32px !important;
  border:0 !important; border-radius:0 !important;
  background:transparent !important; color:#000 !important;
  font-size:26px !important; line-height:32px !important; text-align:center !important;
}
#oneclick-close:hover{ background:#000 !important; color:#fff !important; }

/* заголовок — поменьше; скрывается, когда начинаешь вводить (JS уже есть) */
#oneclick-modal h3{
  margin:0 0 12px 0 !important; font-size:18px !important; font-weight:400 !important;
}
#oneclick-modal.oc-has-input h3{ display:none !important; }

/* лейблы форм — крупнее и с отступом от поля */
#oneclick-form label{
  display:block !important; font-size:14px !important; color:#333 !important;
  margin:0 0 6px 0 !important;
}

/* поля — квадратные, без скруглений даже на focus, чуть выше */
#oneclick-form input{
  width:100% !important; height:52px !important;
  padding:0 12px !important; border:1px solid #000 !important; border-radius:0 !important;
  font-size:16px !important; margin:0 0 14px 0 !important;
}
#oneclick-form input:focus{ border-radius:0 !important; outline:2px solid #0002 !important; outline-offset:0 !important; }

/* кнопка “Купити” — по центру, крупнее, квадратная */
#oneclick-submit{
  display:block !important; margin:16px auto 0 !important;
  height:56px !important; padding:0 28px !important;
  border:1px solid #000 !important; border-radius:0 !important;
  background:#000 !important; color:#fff !important;
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:20px !important; font-weight:400 !important; line-height:1 !important;
}
#oneclick-submit:hover{ background:#fff !important; color:#000 !important; }


















#oneclick-close{
  position:absolute !important; right:12px !important; top:12px !important;
  width:32px !important; height:32px !important;
  padding:0 !important; border:0 !important; border-radius:0 !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  background:transparent !important; color:#000 !important;
  font-size:22px !important; line-height:1 !important; text-align:center !important;
}
#oneclick-close:hover{ background:#000 !important; color:#fff !important; }
#oneclick-close:active{ transform:none !important; }















/* контейнер «спасибі» по центру */
.oc-thanks-view{ text-align:center !important; }

/* большая кнопка «Зрозуміло» */
.oc-ok{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  margin:16px auto 0 !important;
  height:56px !important; padding:0 28px !important;
  border:1px solid #000 !important; border-radius:0 !important;
  background:#000 !important; color:#fff !important;
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:20px !important; font-weight:400 !important; line-height:1 !important;
  cursor:pointer !important;
}
.oc-ok:hover{ background:#fff !important; color:#000 !important; }





















/* Заголовок прячем только после успешной отправки */
#oneclick-modal h3{ transition:opacity .15s ease, max-height .15s ease, margin .15s ease; }
#oneclick-modal.oc-sent h3{ opacity:0; max-height:0; margin:0; overflow:hidden; }

/* Блок «спасибі» и кнопка по центру, крупная */
#oneclick-modal .oc-thanks-view{ text-align:center !important; }
#oneclick-modal .oc-thanks-view .oc-ok{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  margin:16px auto 0 !important;
  height:56px !important; padding:0 28px !important;
  border:1px solid #000 !important; border-radius:0 !important;
  background:#000 !important; color:#fff !important;
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:20px !important; font-weight:400 !important; line-height:1 !important;
  cursor:pointer !important;
}
#oneclick-modal .oc-thanks-view .oc-ok:hover{ background:#fff !important; color:#000 !important; }

/* Крестик ровно по центру своей области */
#oneclick-close{
  position:absolute !important; right:12px !important; top:12px !important;
  width:32px !important; height:32px !important; padding:0 !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  background:transparent !important; color:#000 !important; border:0 !important; border-radius:0 !important;
  font-size:22px !important; line-height:1 !important; text-align:center !important;
}
#oneclick-close:hover{ background:#000 !important; color:#fff !important; }













/* заголовок — чуть крупнее */
#oneclick-modal h3{
  font-size:20px !important;   /* было ~18 */
  line-height:1.25 !important;
}

/* лейблы над полями — больше, и чуть отступа */
#oneclick-form label{
  font-size:16px !important;   /* было 14 */
  margin:0 0 8px 0 !important; /* отступ от текста-лейбла до поля */
}

/* поля: небольшой зазор снизу (5–10px) */
#oneclick-form input{
  margin:5px 0 10px 0 !important;  /* было больше/меньше — делаем 10 */
}

/* на всякий: квадратные поля/кнопка */
#oneclick-form input,
#oneclick-submit{ border-radius:0 !important; }












/* Повідомлення про помилку у формі 1-клік — по центру */
#oneclick-error,
#oneclick-modal .oc-error{
  display:block;                 /* коли JS вмикає, щоб займало всю ширину */
  width:100%;
  text-align:center;             /* по центру */
  margin:10px 0 0;               /* невеликий відступ зверху */
  font-family:"Tenor Sans","TenorSense",serif;
  font-size:16px;                /* можеш збільшити, якщо треба */
  color:#b00020;                 /* червоний залишаємо */
}




#oneclick-form input:invalid{ outline:2px solid #b0002022; }















/* 1) Шапка "Аромат": увеличить иконку чуть-чуть */
.single-product .aroma-selected .aroma-thumb img{
  width:26px !important;  /* поменяешь на 25/27/28 при желании */
  height:26px !important;
}
.single-product .aroma-selected{
  grid-template-columns:26px 1fr 12px !important; /* под новую иконку */
  min-height:40px !important;                     /* чтобы не скакала высота */
}

/* 2) Не подсвечивать шапку при открытом списке */
.single-product .aroma-select.is-open .aroma-selected{
  background:transparent !important;
  color:#000 !important;
  border-color:#000 !important;
}
/* стрелка тоже остаётся чёрной */
.single-product .aroma-select.is-open .aroma-selected .aroma-caret{
  border-top-color:#000 !important;
}

/* 3) Шапка + дропдаун = одно окно (нет зазора, общая рамка) */
.single-product .aroma-select.is-open .aroma-selected{
  border-bottom-color:transparent !important; /* убираем нижнюю линию у шапки */
}
.single-product .aroma-dropdown{
  top:100% !important;            /* вплотную к шапке */
  margin-top:0 !important;
  border-top:0 !important;        /* без “двойной” рамки между ними */
}
/* если всё же видна тонкая щель в теме — можно так: */
/* .single-product .aroma-dropdown{ top:calc(100% - 1px) !important; } */

/* 4) Тоньше скролл в списке */
.single-product .aroma-dropdown::-webkit-scrollbar{ width:3px; }
.single-product .aroma-dropdown::-webkit-scrollbar-thumb{ background:#bdbdbd; }
.single-product .aroma-dropdown:hover::-webkit-scrollbar-thumb{ background:#9a9a9a; }
.single-product .aroma-dropdown{ scrollbar-width:thin; scrollbar-color:#bdbdbd transparent; }











/* В выпадающем списке "Аромат" не показывать уже выбранный вариант */
.single-product .aroma-select .aroma-dropdown .aroma-option.active{
  display:none !important;
}















/* hover по варианту в списке: чёрный фон, белый текст, чёрная рамка */
.single-product .aroma-option:hover{
  background:#000 !important; color:#fff !important; border-color:#000 !important;
}
.single-product .aroma-option:hover .aroma-name{ color:#fff !important; }






















/* ===== Таблица характеристик — под макет ===== */
.single-product .m-product-specs{
  --fs-body: 20px;     /* размер текста в ячейках */
  --fs-head: 16px;     /* размер заголовков колонок */
  --row-divider: #ECECEC; /* линия между строками */
  margin: 12px 0;
  overflow-x: auto;    /* вдруг не влезет на мобилке */
}

.single-product .m-product-specs .m-specs{
  width:100%;
  border-collapse: collapse;
  border: none !important;            /* без внешних рамок */
  font-family: "Tenor Sans","TenorSense",serif;
}

/* шапка колонок: 16px, серовато, без рамок */
.single-product .m-product-specs .m-specs thead th{
  padding: 8px 0;
  text-align: left;
  font-weight: 400;
  font-size: var(--fs-head);
  color: #7A7A7A;
  border: none !important;
}

/* тело таблицы: всё 20px, без внешних рамок */
.single-product .m-product-specs .m-specs tbody td{
  padding: 10px 0;
  font-size: var(--fs-body);
  color: #000;
  border: none !important;            /* убираем любые дефолтные рамки темы */
}

/* только ОДНА разделительная линия между строками (без верхней/нижней) */
.single-product .m-product-specs .m-specs tbody tr + tr td{
  border-top: 1px solid var(--row-divider) !important;
}

/* чуть фиксируем первую колонку с меткой (L/M) */
.single-product .m-product-specs .m-specs td.sz{
  width: 60px; white-space: nowrap;
}






/* Убрать полосатость (зебру) у таблицы характеристик */
.single-product .m-product-specs .m-specs tr,
.single-product .m-product-specs .m-specs tr:nth-child(odd),
.single-product .m-product-specs .m-specs tr:nth-child(even),
.single-product .m-product-specs .m-specs tbody tr:hover,
.single-product .m-product-specs .m-specs td,
.single-product .m-product-specs .m-specs th{
  background: transparent !important;
}

/* На случай, если Gutenberg-вставка со стилем "Stripes" затесалась */
.single-product .m-product-specs .wp-block-table.is-style-stripes tbody tr{
  background: transparent !important;
}















/* ===== PRO АРОМАТИ — ЖЁСТКИЙ ОВЕРРАЙД ДЛЯ SINGLE PRODUCT ===== */
.single-product .m-aroma-acc{ position:relative; border:0 !important; box-sizing:border-box; }

/* Заголовок */
.single-product .m-aroma-acc .m-acc-head{
  position:relative; display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px !important; margin:0 !important;
  background:#fff !important; border:0 !important; cursor:pointer;
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-weight:400 !important; font-size:26px !important; color:#000 !important;
}

/* Стрелка (картинка), без текста ^ */
.single-product .m-aroma-acc .m-acc-caret{
  display:inline-block; width:16px; height:10px; flex:0 0 auto;
  background:url("https://marmar.company/wp-content/uploads/2025/10/Polygon-1.png") no-repeat center/contain;
  font-size:0; line-height:0; margin-left:8px;
  transition:transform .2s ease;
}
.single-product .m-aroma-acc.is-open .m-acc-caret{ transform:rotate(180deg); }

/* ОДНА чёрная линия: закрыто — под заголовком; открыто — внизу тела */
.single-product .m-aroma-acc .m-acc-head::after,
.single-product .m-aroma-acc .m-acc-body::after{
  content:""; position:absolute; left:50px; right:18px; height:1px; background:#000;
  pointer-events:none; transition:opacity .2s ease;
}
.single-product .m-aroma-acc .m-acc-head::after{ bottom:-1px; opacity:1; }
.single-product .m-aroma-acc .m-acc-body::after{ bottom:0;   opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-head::after{ opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-body::after{ opacity:1; }

/* Тело — плавное раскрытие */
.single-product .m-aroma-acc .m-acc-body{
  position:relative; padding:8px 12px 14px 12px !important;
  overflow:hidden; max-height:0; transition:max-height .28s ease;
  border:0 !important;
}

/* Список: без маркеров, без розового, без полосы прокрутки */
.single-product .m-aroma-acc .m-aroma-list{
  list-style:none !important; margin:0 !important; padding:0 12px 0 12px !important;
  max-height:260px; overflow:auto; scrollbar-width:none;
}
.single-product .m-aroma-acc .m-aroma-list::-webkit-scrollbar{ width:0; height:0; }
.single-product .m-aroma-acc .m-aroma-list > li{ list-style:none !important; margin:0 !important; padding:0 !important; }
.single-product .m-aroma-acc .m-aroma-list > li::marker{ content:''; }

/* Строки */
.single-product .m-aroma-acc .m-aroma-line{
  display:grid; grid-template-columns:26px 1fr auto; column-gap:12px;
  align-items:center; padding:10px 0 !important;
}
.single-product .m-aroma-acc .m-aroma-thumb{ width:26px; height:26px; background:#eee; }
.single-product .m-aroma-acc .m-aroma-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.single-product .m-aroma-acc .m-aroma-name{
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:18px !important; color:#000 !important;
}

/* Плюсы — без рамки/заливки, без чёрного ховера */
.single-product .m-aroma-acc .m-aroma-more{
  border:0 !important; background:transparent !important; color:#000 !important;
  width:auto; height:auto; padding:0 2px !important; line-height:1; font-size:20px !important; cursor:pointer;
}
.single-product .m-aroma-acc .m-aroma-more:hover{ background:transparent !important; color:#000 !important; transform:none !important; }

/* Текст описания */
.single-product .m-aroma-acc .m-aroma-desc{ padding:8px 0 12px 40px !important; font-size:16px !important; line-height:1.4 !important; color:#000 !important; }








/* ===== PRO АРОМАТИ — ХАРД-РЕСЕТ ПОД ДИЗАЙН ===== */
.single-product .m-aroma-acc, .single-product .m-aroma-acc * { box-sizing:border-box; }

.single-product .m-aroma-acc{ position:relative; border:0 !important; }

/* Заголовок */
.single-product .m-aroma-acc .m-acc-head{
  position:relative; display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px !important; margin:0 !important;
  background:#fff !important; border:0 !important; cursor:pointer;
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-weight:400 !important; font-size:26px !important; color:#000 !important;
}

/* Стрелка (из картинки) */
.single-product .m-aroma-acc .m-acc-caret{
  display:inline-block; width:16px; height:10px; flex:0 0 auto;
  background:url("https://marmar.company/wp-content/uploads/2025/10/Polygon-1.png") no-repeat center/contain !important;
  font-size:0; line-height:0;
  transition:transform .2s ease;
}
.single-product .m-aroma-acc.is-open .m-acc-caret{ transform:rotate(180deg); }

/* ОДНА чёрная линия: закрыто — под заголовком; открыто — внизу тела */
.single-product .m-aroma-acc .m-acc-head::after,
.single-product .m-aroma-acc .m-acc-body::after{
  content:""; position:absolute; left:50px; right:18px; height:1px; background:#000;
  pointer-events:none; transition:opacity .2s ease;
}
.single-product .m-aroma-acc .m-acc-head::after{ bottom:-1px; opacity:1; }
.single-product .m-aroma-acc .m-acc-body::after{ bottom:0;   opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-head::after{ opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-body::after{ opacity:1; }

/* Тело — плавное раскрытие */
.single-product .m-aroma-acc .m-acc-body{
  position:relative; padding:8px 12px 14px 12px !important;
  overflow:hidden; max-height:0; transition:max-height .28s ease;
  border:0 !important;
}

/* Список: без маркеров/розового/отступов, скрыть полосу прокрутки */
.single-product .m-aroma-acc .m-aroma-list{
  list-style:none !important; margin:0 !important; padding:0 12px 0 12px !important;
  max-height:260px; overflow:auto; scrollbar-width:none;
}
.single-product .m-aroma-acc .m-aroma-list::-webkit-scrollbar{ width:0; height:0; }
.single-product .m-aroma-acc .m-aroma-list > li{ list-style:none !important; margin:0 !important; padding:0 !important; }

/* Строки */
.single-product .m-aroma-acc .m-aroma-line{
  display:grid; grid-template-columns:26px 1fr auto;
  column-gap:12px; align-items:center; padding:10px 0 !important;
}
.single-product .m-aroma-acc .m-aroma-thumb{ width:26px; height:26px; background:#eee; }
.single-product .m-aroma-acc .m-aroma-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.single-product .m-aroma-acc .m-aroma-name{
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:18px !important; color:#000 !important;
}

/* Плюсы — без рамок/заливки; при открытии будет «−» через JS */
.single-product .m-aroma-acc .m-aroma-more{
  border:0 !important; background:transparent !important; color:#000 !important;
  display:inline-block !important; width:18px !important; text-align:center !important;
  padding:0 !important; line-height:1 !important; font-size:20px !important; cursor:pointer;
}
.single-product .m-aroma-acc .m-aroma-more:hover{ background:transparent !important; color:#000 !important; transform:none !important; }

/* Текст описания */
.single-product .m-aroma-acc .m-aroma-desc{
  padding:8px 0 12px 40px !important; font-size:16px !important; line-height:1.4 !important; color:#000 !important;
}






/* ===== PRO АРОМАТИ — ХАРД-РЕСЕТ ПОД ДИЗАЙН ===== */
.single-product .m-aroma-acc, .single-product .m-aroma-acc * { box-sizing:border-box; }

.single-product .m-aroma-acc{ position:relative; border:0 !important; }

/* Заголовок */
.single-product .m-aroma-acc .m-acc-head{
  position:relative; display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px !important; margin:0 !important;
  background:#fff !important; border:0 !important; cursor:pointer;
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-weight:400 !important; font-size:26px !important; color:#000 !important;
}

/* Стрелка (из картинки) */
.single-product .m-aroma-acc .m-acc-caret{
  display:inline-block; width:16px; height:10px; flex:0 0 auto;
  background:url("https://marmar.company/wp-content/uploads/2025/10/Polygon-1.png") no-repeat center/contain !important;
  font-size:0; line-height:0;
  transition:transform .2s ease;
}
.single-product .m-aroma-acc.is-open .m-acc-caret{ transform:rotate(180deg); }

/* ОДНА чёрная линия: закрыто — под заголовком; открыто — внизу тела */
.single-product .m-aroma-acc .m-acc-head::after,
.single-product .m-aroma-acc .m-acc-body::after{
  content:""; position:absolute; left:50px; right:18px; height:1px; background:#000;
  pointer-events:none; transition:opacity .2s ease;
}
.single-product .m-aroma-acc .m-acc-head::after{ bottom:-1px; opacity:1; }
.single-product .m-aroma-acc .m-acc-body::after{ bottom:0;   opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-head::after{ opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-body::after{ opacity:1; }

/* Тело — плавное раскрытие */
.single-product .m-aroma-acc .m-acc-body{
  position:relative; padding:8px 12px 14px 12px !important;
  overflow:hidden; max-height:0; transition:max-height .28s ease;
  border:0 !important;
}

/* Список: без маркеров/розового/отступов, скрыть полосу прокрутки */
.single-product .m-aroma-acc .m-aroma-list{
  list-style:none !important; margin:0 !important; padding:0 12px 0 12px !important;
  max-height:260px; overflow:auto; scrollbar-width:none;
}
.single-product .m-aroma-acc .m-aroma-list::-webkit-scrollbar{ width:0; height:0; }
.single-product .m-aroma-acc .m-aroma-list > li{ list-style:none !important; margin:0 !important; padding:0 !important; }

/* Строки */
.single-product .m-aroma-acc .m-aroma-line{
  display:grid; grid-template-columns:26px 1fr auto;
  column-gap:12px; align-items:center; padding:10px 0 !important;
}
.single-product .m-aroma-acc .m-aroma-thumb{ width:26px; height:26px; background:#eee; }
.single-product .m-aroma-acc .m-aroma-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.single-product .m-aroma-acc .m-aroma-name{
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:18px !important; color:#000 !important;
}

/* Плюсы — без рамок/заливки; при открытии будет «−» через JS */
.single-product .m-aroma-acc .m-aroma-more{
  border:0 !important; background:transparent !important; color:#000 !important;
  display:inline-block !important; width:18px !important; text-align:center !important;
  padding:0 !important; line-height:1 !important; font-size:20px !important; cursor:pointer;
}
.single-product .m-aroma-acc .m-aroma-more:hover{ background:transparent !important; color:#000 !important; transform:none !important; }

/* Текст описания */
.single-product .m-aroma-acc .m-aroma-desc{
  padding:8px 0 12px 40px !important; font-size:16px !important; line-height:1.4 !important; color:#000 !important;
}







/* ===== Про Аромати — точечный фикс под макет ===== */
.single-product .m-aroma-acc, .single-product .m-aroma-acc *{ box-sizing:border-box; }

/* Заголовок */
.single-product .m-aroma-acc .m-acc-head{
  display:flex !important; align-items:center !important; gap:12px !important;
  justify-content:flex-start !important;
  padding:10px 12px !important; margin:0 !important;
  background:#fff !important; border:0 !important; cursor:pointer;
  font-family:"Tenor Sans","TenorSense",serif !important; font-weight:400 !important;
  font-size:26px !important; color:#000 !important;
}
.single-product .m-aroma-acc .m-acc-title{ flex:1 1 auto !important; }
.single-product .m-aroma-acc .m-acc-caret{
  order:2; flex:0 0 16px !important; width:16px !important; height:10px !important;
  display:block !important; margin-left:auto !important;
  background:url("https://marmar.company/wp-content/uploads/2025/10/Polygon-1.png")
             no-repeat center/contain !important;
  transition:transform .22s ease !important;
}
.single-product .m-aroma-acc.is-open .m-acc-caret{ transform:rotate(180deg) !important; }

/* Одна чёрная линия */
.single-product .m-aroma-acc .m-acc-head::after,
.single-product .m-aroma-acc .m-acc-body::after{
  content:""; position:absolute; left:50px; right:18px; height:1px; background:#000;
  pointer-events:none; transition:opacity .2s ease;
}
.single-product .m-aroma-acc .m-acc-head::after{ bottom:-1px; opacity:1; }
.single-product .m-aroma-acc .m-acc-body::after{ bottom:0;   opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-head::after{ opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-body::after{ opacity:1; }

/* Тело: полностью скрыто в закрытом состоянии (без «просветов») */
.single-product .m-aroma-acc .m-acc-body{
  position:relative; padding:8px 12px 14px 12px !important;
  overflow:hidden; max-height:0; transition:max-height .28s ease;
  border:0 !important; visibility:hidden;   /* по умолчанию скрыто */
}
.single-product .m-aroma-acc.is-open .m-acc-body{ visibility:visible; }
.single-product .m-aroma-acc:not(.is-open) .m-acc-body{
  padding-top:0 !important; padding-bottom:0 !important;
}

/* Список: без маркеров и полосы прокрутки */
.single-product .m-aroma-acc .m-aroma-list{
  list-style:none !important; margin:0 !important; padding:0 !important;
  max-height:260px; overflow:auto; scrollbar-width:none;
}
.single-product .m-aroma-acc .m-aroma-list::-webkit-scrollbar{ width:0; height:0; }

/* Строка и разделители */
.single-product .m-aroma-acc .m-aroma-line{
  position:relative; display:grid !important;
  grid-template-columns:26px 1fr auto !important; column-gap:12px !important;
  align-items:center !important; padding:12px 0 !important;
}
.single-product .m-aroma-acc .m-aroma-line::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:#ECECEC;
}
.single-product .m-aroma-acc .m-aroma-item:last-child .m-aroma-line::after{ display:none; }

.single-product .m-aroma-acc .m-aroma-thumb{ width:26px !important; height:26px !important; background:#eee; }
.single-product .m-aroma-acc .m-aroma-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.single-product .m-aroma-acc .m-aroma-name{
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:18px !important; color:#000 !important;
}

/* «+» крупнее и с анимацией масштаба; без рамок/заливки */
.single-product .m-aroma-acc .m-aroma-more{
  border:0 !important; background:transparent !important; color:#000 !important;
  width:24px !important; text-align:center !important; padding:0 !important;
  line-height:1 !important; font-size:24px !important; cursor:pointer; transition:transform .18s ease;
}
.single-product .m-aroma-acc .m-aroma-more:hover{ transform:scale(1.1) !important; }

/* Анимация описания аромата */
.single-product .m-aroma-acc .m-aroma-desc{
  max-height:0; opacity:0; overflow:hidden; transition:max-height .25s ease, opacity .25s ease;
  padding:8px 0 12px 40px !important; font-size:16px !important; line-height:1.4 !important; color:#000 !important;
}
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-desc{ max-height:500px; opacity:1; }

















/* ===== PRO АРОМАТИ — патч под твои требования ===== */

/* Заголовок: стрелка у правого края, линия нормальной длины */
.single-product .m-aroma-acc .m-acc-head{
  position:relative; display:flex; align-items:center;
  width:100%; padding:10px 40px 10px 12px !important;  /* справа запас под стрелку */
  background:#fff !important; border:0 !important; cursor:pointer;
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-weight:400 !important; font-size:26px !important; color:#000 !important;
}
.single-product .m-aroma-acc .m-acc-title{ flex:1 1 auto; }

/* стрелка — фиксируем у правого края */
.single-product .m-aroma-acc .m-acc-caret{
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  width:16px !important; height:10px !important;
  background:url("https://marmar.company/wp-content/uploads/2025/10/Polygon-1.png")
             no-repeat center/contain !important;
  transition:transform .22s ease;
}
.single-product .m-aroma-acc.is-open .m-acc-caret{ transform:translateY(-50%) rotate(180deg); }

/* одна чёрная линия: закрыто — под заголовком; открыто — внизу контента */
.single-product .m-aroma-acc .m-acc-head::after,
.single-product .m-aroma-acc .m-acc-body::after{
  content:""; position:absolute; left:12px; right:12px; height:1px; background:#000; pointer-events:none;
  transition:opacity .2s ease;
}
.single-product .m-aroma-acc .m-acc-head::after{ bottom:-1px; opacity:1; }
.single-product .m-aroma-acc .m-acc-body::after{ bottom:0;   opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-head::after{ opacity:0; }
.single-product .m-aroma-acc.is-open .m-acc-body::after{ opacity:1; }

/* тело: полностью скрыто, ничего не «просвечивает» */
.single-product .m-aroma-acc .m-acc-body{
  position:relative; padding:8px 12px 14px 12px !important;
  overflow:hidden; max-height:0; transition:max-height .28s ease;
  visibility:hidden;
}
.single-product .m-aroma-acc.is-open .m-acc-body{ visibility:visible; }

/* список */
.single-product .m-aroma-acc .m-aroma-list{
  list-style:none !important; margin:0 !important; padding:0 !important;
  max-height:400px; overflow:auto; scrollbar-width:none;
}
.single-product .m-aroma-acc .m-aroma-list::-webkit-scrollbar{ width:0; height:0; }

/* строка + серый разделитель */
.single-product .m-aroma-acc .m-aroma-line{
  position:relative; display:grid !important;
  grid-template-columns:26px 1fr 24px !important;  /* иконка | текст | плюс */
  column-gap:12px !important; align-items:center !important; padding:12px 0 !important;
}
.single-product .m-aroma-acc .m-aroma-line::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:#ECECEC;
}
.single-product .m-aroma-acc .m-aroma-item:last-child .m-aroma-line::after{ display:none; }

.single-product .m-aroma-acc .m-aroma-thumb{ width:26px !important; height:26px !important; }
.single-product .m-aroma-acc .m-aroma-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.single-product .m-aroma-acc .m-aroma-name{
  font-family:"Tenor Sans","TenorSense",serif !important; font-size:18px !important; color:#000 !important;
}

/* «+» рисуем линиями (тонко и длинно), с ховером и превращением в «–» */
.single-product .m-aroma-acc .m-aroma-more{
  position:relative; width:24px !important; height:24px !important;
  border:0 !important; background:transparent !important; cursor:pointer; padding:0 !important;
}
.single-product .m-aroma-acc .m-aroma-more::before,
.single-product .m-aroma-acc .m-aroma-more::after{
  content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:18px; height:1px; background:#000; transition:transform .18s ease, opacity .18s ease;
}
/* вертикальная палка плюса */
.single-product .m-aroma-acc .m-aroma-more::after{
  width:1px; height:18px;
}
/* ховер — лёгкое движение */
.single-product .m-aroma-acc .m-aroma-more:hover{ transform:translateX(1px); }

/* когда строка открыта — «минус» (прячем вертикаль) */
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-more::after{
  transform:translate(-50%,-50%) scaleY(0);
  opacity:.0;
}

/* описание: СТАРТУЕТ ПОД ЛЕВОЙ ГРАНИЦЕЙ ИКОНКИ (не уезжает вправо) */
.single-product .m-aroma-acc .m-aroma-desc{
  max-height:0; opacity:0; overflow:hidden;
  transition:max-height .25s ease, opacity .25s ease;
  margin:0; padding:12px 0 12px 0 !important;   /* без левого отступа */
}
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-desc{
  max-height:1000px; opacity:1;
}















/***** PRO АРОМАТИ — точечный патч *****/

/* заголовок строго слева */
.single-product .m-aroma-acc{ position:relative; text-align:left !important; }
.single-product .m-aroma-acc .m-acc-head{
  display:flex !important; align-items:center !important; justify-content:flex-start !important;
  width:100%; padding:10px 40px 10px 12px !important; /* слева 12, справа запас под стрелку */
  background:#fff !important; border:0 !important; cursor:pointer;
  font-family:"Tenor Sans","TenorSense",serif !important; font-weight:400 !important;
  font-size:26px !important; color:#000 !important; text-align:left !important;
}
.single-product .m-aroma-acc .m-acc-head *{ text-align:left !important; }
.single-product .m-aroma-acc .m-acc-title{ flex:1 1 auto; margin:0 !important; }





/* стрелку чуть левее (ровно над колонкой плюсов) */
.single-product .m-aroma-acc .m-acc-caret{
  right:10px; /* было 12px */
}



/* описание: плавный fade+slide (и строго по левому краю, без уезда вправо) */
.single-product .m-aroma-acc .m-aroma-desc{
  max-height:0; opacity:0; transform:translateY(6px);
  overflow:hidden;
  transition:max-height .28s ease, opacity .28s ease, transform .28s ease;
  margin:0; padding:12px 0 12px 0 !important; /* без левого отступа */
}
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-desc{
  max-height:1200px; opacity:1; transform:translateY(0);
}

/* чёрная линия в ОТКРЫТОМ состоянии — снизу всего блока (всегда видима при open) */
.single-product .m-aroma-acc::after{
  content:""; position:absolute; left:12px; right:12px; bottom:0; height:1px; background:#000; display:none;
}
.single-product .m-aroma-acc.is-open::after{ display:block; }

/* (на всякий случай) заголовок строго слева, без центровки наследуемой темой */
.single-product .m-aroma-acc,
.single-product .m-aroma-acc .m-acc-head,
.single-product .m-aroma-acc .m-acc-title{ text-align:left !important; }









/* Стрелка и колонка плюсов должны совпадать по ширине */
.single-product .m-aroma-acc .m-acc-head{ padding:10px 40px 10px 12px !important; }
.single-product .m-aroma-acc .m-acc-caret{
  position:absolute; right:10px; top:50%; transform:translateY(-50%);
  width:20px !important; height:14px !important;              /* бокс такой же, как у плюса */
  background:url("https://marmar.company/wp-content/uploads/2025/10/Polygon-1.png")
            no-repeat center/16px 10px !important;
}

/* Последняя колонка (=кнопка) тоже 20px, чтобы быть ровно под стрелкой */
.single-product .m-aroma-acc .m-aroma-line{
  grid-template-columns:26px 1fr 20px !important;
  column-gap:12px !important;
}

/* ПЛЮС/МИНУС — только CSS, чёткие SVG через data-URI, без ховеров */
.single-product .m-aroma-acc .m-aroma-more{
  width:20px !important; height:20px !important;
  margin:0 !important; padding:0 !important; border:0 !important; box-shadow:none !important;
  background: center/20px 20px no-repeat transparent !important;
  cursor:pointer; transition:none !important;
  /* ► ПЛЮС */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'%3E%3Cpath d='M3 10.5H17' stroke='%23000' stroke-width='1'/%3E%3Cpath d='M10.5 3V17' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E");
}
.single-product .m-aroma-acc .m-aroma-more:hover{ background-position:center !important; }

/* ► МИНУС (когда строка открыта; класс .is-open уже есть) */
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-more{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'%3E%3Cpath d='M3 10.5H17' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E");
}
/* 1) Полный ресет всего "старого" внутри кнопки (текст, псевдоэлементы и прочее) */
.single-product .m-aroma-acc .m-aroma-more{
  position:relative;
  width:20px !important; height:20px !important;
  margin:0 !important; padding:0 !important; border:0 !important; box-shadow:none !important;
  background: center/20px 20px no-repeat transparent !important;
  cursor:pointer;
  font-size:0 !important; line-height:0 !important; color:transparent !important; /* прячем возможный текст */
}
.single-product .m-aroma-acc .m-aroma-more::before,
.single-product .m-aroma-acc .m-aroma-more::after{
  content:none !important; display:none !important; background:none !important;
  width:0 !important; height:0 !important; border:0 !important; box-shadow:none !important;
  transform:none !important;
}
.single-product .m-aroma-acc .m-aroma-more > *{ display:none !important; } /* если внутри остались <i>/<span>/<svg> */

/* 2) Наши чёткие иконки только фоном (SVG data-URI) */
.single-product .m-aroma-acc .m-aroma-more{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'%3E%3Cpath d='M3 10.5H17' stroke='%23000' stroke-width='1'/%3E%3Cpath d='M10.5 3V17' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); /* + */
}
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-more{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'%3E%3Cpath d='M3 10.5H17' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); /* – */
}

/* 3) Стрелка и колонка плюсов совпадают по оси */
.single-product .m-aroma-acc .m-acc-head{ padding-right:40px !important; }
.single-product .m-aroma-acc .m-acc-caret{ right:10px; }

.single-product .m-aroma-acc .m-aroma-line{ grid-template-columns:26px 1fr 20px !important; }





/* ——— стрелка чуть левее, чтобы колонка совпала ——— */
.single-product .m-aroma-acc .m-acc-caret{ right:10px; }

/* ——— колонка под плюс: фиксированная ширина под стрелкой ——— */
.single-product .m-aroma-acc .m-aroma-line{
  grid-template-columns:26px 1fr 20px !important;
  column-gap:12px !important;
}

/* ——— СБРОС всего «старого» внутри кнопки (чтоб не накладывалось) ——— */
.single-product .m-aroma-acc .m-aroma-more::before,
.single-product .m-aroma-acc .m-aroma-more::after{ content:none !important; display:none !important; }
.single-product .m-aroma-acc .m-aroma-more{ font-size:0 !important; line-height:0 !important; color:transparent !important; }
/* если раньше вставляли <i>/<span>/<svg> внутрь — вернём им показ, фон накроет их сверху */
.single-product .m-aroma-acc .m-aroma-more > *{ display:initial !important; }

/* ——— ПЛЮС/МИНУС ТОЛЬКО ФОНОМ (SVG), шортхенд с !important ——— */
.single-product .m-aroma-acc .m-aroma-more{
  display:block !important; width:20px !important; height:20px !important;
  margin:0 !important; padding:0 !important; border:0 !important; box-shadow:none !important; cursor:pointer;
  background: center/20px 20px no-repeat transparent !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'><path d='M3 10.5H17' stroke='%23000' stroke-width='1'/><path d='M10.5 3V17' stroke='%23000' stroke-width='1'/></svg>") !important; /* ПЛЮС */
}
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-more{
  background: center/20px 20px no-repeat transparent !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'><path d='M3 10.5H17' stroke='%23000' stroke-width='1'/></svg>") !important; /* МИНУС */
}



/* +/−: толще (2px) и никогда не исчезают при hover/focus/active */
.single-product .m-aroma-acc .m-aroma-more{
  display:block !important; width:20px !important; height:20px !important;
  margin:0 !important; padding:0 !important; border:0 !important; box-shadow:none !important; cursor:pointer;
  background: center/20px 20px no-repeat transparent !important;
  /* ПЛЮС (2px, crisp) */
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'><rect x='3' y='9' width='14' height='2' fill='%23000'/><rect x='9' y='3' width='2' height='14' fill='%23000'/></svg>") !important;
}
.single-product .m-aroma-acc .m-aroma-more:hover,
.single-product .m-aroma-acc .m-aroma-more:focus,
.single-product .m-aroma-acc .m-aroma-more:active{
  /* тот же фон — чтобы ничего не пропадало на hover */
  background: center/20px 20px no-repeat transparent !important;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'><rect x='3' y='9' width='14' height='2' fill='%23000'/><rect x='9' y='3' width='2' height='14' fill='%23000'/></svg>") !important;
}

/* МИНУС (2px, crisp) — и тоже фикс на hover/focus/active */
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-more{
  background: center/20px 20px no-repeat transparent !important;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'><rect x='3' y='9' width='14' height='2' fill='%23000'/></svg>") !important;
}
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-more:hover,
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-more:focus,
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-more:active{
  background: center/20px 20px no-repeat transparent !important;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' shape-rendering='crispEdges'><rect x='3' y='9' width='14' height='2' fill='%23000'/></svg>") !important;
}




/* убираем любые внешние отступы между пунктами */
.single-product .m-aroma-acc .m-aroma-item{ margin:0 !important; }

/* строка списка как была — если нужно плотнее/реже, правь цифру */
.single-product .m-aroma-acc .m-aroma-line{ padding:12px 0 !important; }

/* ✦ описание: в закрытом состоянии НУЛЕВОЙ паддинг → нет лишнего пространства */
.single-product .m-aroma-acc .m-aroma-desc{
  display:block !important;
  overflow:hidden;
  max-height:0;
  opacity:0;
  transform:translateY(6px);
  padding:0 !important;                 /* было 12px — из-за этого и был «зазор» */
  margin:0 !important;
  transition:
    max-height .30s ease,
    opacity    .25s ease,
    transform  .30s ease,
    padding    .30s ease;               /* плавно добавим паддинг при открытии */
}

/* открыто: даём паддинг, остальное как есть */
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-desc{
  max-height:900px;                     /* увеличь, если нужно больше текста */
  opacity:1;
  transform:translateY(0);
  padding:12px 0 !important;
}

/* прибьём внутренние маргины в тексте, чтобы не надувало блок */
.single-product .m-aroma-acc .m-aroma-desc > *{ margin:0 0 10px 0 !important; }
.single-product .m-aroma-acc .m-aroma-desc > *:first-child{ margin-top:0 !important; }
.single-product .m-aroma-acc .m-aroma-desc > *:last-child{ margin-bottom:0 !important; }






























/* 1) Спрятать бейдж «Розпродаж» и иконку лупы на странице товара */
.single-product .onsale,
.single-product .woocommerce-product-gallery__trigger { display:none !important; }

/

/* старая цена (del) — справа, серее и с зачёркиванием */
.single-product .summary .price del,
.single-product .single_variation_wrap .woocommerce-variation-price .price del{
  order:2 !important;
  color:#9a9a9a !important;
  opacity:1 !important;
  margin-left:6px !important;
  text-decoration:line-through !important;
  text-decoration-thickness:1px !important;
}

/* 3) На всякий случай убираем «дефолтное» подчёркивание у INS глобально в карточке */
.single-product .price ins,
.single-product .price ins *{
  text-decoration:none !important;
  border:0 !important;
  background:transparent !important;
}









/* ===== НОВАЯ (АКЦИОННАЯ) ЦЕНА — Tenor Sans, чёткая, слева ===== */
@import url('https://fonts.googleapis.com/css2?family=Tenor+Sans:wght@400&display=swap');

/* Везде, где есть .price, делаем <ins> Tenor Sans */
.price ins,
.price ins *{
  font-family: 'Tenor Sans', serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
  color:#000 !important;
  text-decoration: none !important;
  letter-spacing: 0 !important;
  line-height: 1.1 !important;
  font-variant-numeric: lining-nums tabular-nums;
  -webkit-font-smoothing: antialiased;
}



/* Разворачиваем порядок: новая слева, старая справа */
.single-product .summary .price,
.single_variation_wrap .woocommerce-variation-price .price{
  display:flex !important;
  align-items: baseline !important;
  gap: 10px !important;
}
.single-product .summary .price ins,
.single_variation_wrap .woocommerce-variation-price .price ins{ order:1 !important; }
.single-product .summary .price del,
.single_variation_wrap .woocommerce-variation-price .price del{ order:2 !important; }

/* На всякий: убить любые подчёркивания/рамки, которые тема могла повесить */
.price .amount,
.price .woocommerce-Price-amount,
.price .woocommerce-Price-amount bdi{
  border:0 !important;
  box-shadow:none !important;
  text-decoration:none !important;
}







/* плавные раскрытия */
.single-product .m-aroma-acc .m-acc-body{ transition:max-height .28s ease; overflow:hidden; }
.single-product .m-aroma-acc .m-aroma-desc{
  max-height:0; opacity:0; transform:translateY(6px);
  overflow:hidden; transition:max-height .25s ease, opacity .25s ease, transform .25s ease;
}
.single-product .m-aroma-acc .m-aroma-item.is-open .m-aroma-desc{
  opacity:1; transform:translateY(0);
}





/* маленькая иконка слева внутри селекта "Аромат" */
.m-aroma-wrap{ position:relative; display:inline-block; }
.m-aroma-wrap select{
  padding-left:36px !important;   /* отступ под иконку */
}
.m-aroma-wrap .m-aroma-ico{
  position:absolute; left:10px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; overflow:hidden;
  background:#fff; border:1px solid #eee;
  pointer-events:none;
}
.m-aroma-wrap .m-aroma-ico img{ width:100%; height:100%; object-fit:cover; display:block; }




















/* === PATCH: только Add to Cart + One-click (чуть компактнее) === */
.single-product form.cart .single_add_to_cart_button,
.single-product .oneclick-btn{
  height:60px !important;       /* было выше → чуть меньше */
  padding:0 14px !important;    /* уже бока */
  font-size:20px !important;    /* на волос ниже размер шрифта */
  line-height:1 !important;

  /* не даём старым правилам ломать ширины */
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  flex:0 1 auto !important;     /* если родитель flex — кнопки не распирает */
  white-space:nowrap !important; /* текст в одну строку, высота не растёт */
}

/* очень узко — каждая кнопка на всю строку (чтобы точно не налезали) */
@media (max-width: 640px){
  .single-product form.cart .single_add_to_cart_button,
  .single-product .oneclick-btn{
    width:100% !important;
  }
}





/* === MOBILE STACK: Add to Cart + One-click на всю ширину === */
@media (max-width: 768px){
  /* тільки ці дві кнопки */
  .single-product form.cart .single_add_to_cart_button,
  .single-product .oneclick-btn{
    display: block !important;
    width: 100% !important;       /* на всю ширину контейнера */
    flex: 0 0 100% !important;    /* якщо батько flex – займати цілий ряд */
    height: 44px !important;      /* тонка «полоска»; можеш змінити на 40/48 */
    padding: 0 16px !important;
    font-size: 18px !important;   /* читабельно; за бажанням 16px */
    line-height: 1 !important;
    border-radius: 0 !important;
    white-space: nowrap !important;
  }

  /* відступ між ними (зовнішні відступи сторінки не чіпаємо) */
  .single-product .oneclick-btn{
    margin-top: 10px !important;
  }
}












/* === MOBILE FIX: две кнопки во всю ширину, одна под другой === */
@media (max-width: 768px){
  /* обе кнопки — на всю ширину контейнера */
  .single-product form.cart .single_add_to_cart_button,
  .single-product .oneclick-btn{
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    /* если родитель flex — заставим занимать всю строку */
    flex: 0 0 100% !important;
    align-self: stretch !important;

    /* убиваем любые старые смещения */
    margin: 0 !important;
    height: 44px !important;
    padding: 0 16px !important;
    line-height: 1 !important;
    font-size: 18px !important;
    border-radius: 0 !important;
    white-space: nowrap !important;
    text-align: center !important;
    justify-content: center !important;
    align-items: center !important;
  }

  /* вторая кнопка — отступ сверху */
  .single-product .oneclick-btn{
    margin-top: 10px !important;
  }

  /* на всякий: убьём экзотические ширины из прошлых патчей */
  .single-product form.cart .single_add_to_cart_button,
  .single-product .oneclick-btn{
    /* встречались такие правила как width:3px, flex:0 0 290px и т.п. */
    width: 100% !important;
    flex-basis: 100% !important;
  }
}









/* === MOBILE NUKE: только Add to Cart + One-click, 100% ширина, одна под другой === */
@media (max-width: 900px){

  /* разрешаем перенос внутри формы single product */
  .single-product form.cart{
    display: flex !important;
    flex-wrap: wrap !important;   /* ключ, чтобы элементы уходили на новую строку */
    gap: 10px !important;
  }

  /* сами кнопки — максимально специфично, чтобы перебить старые !important */
  .single-product form.cart .single_add_to_cart_button.single_add_to_cart_button[type="submit"],
  .single-product form.cart .oneclick-btn.oneclick-btn{
    display: block !important;
    box-sizing: border-box !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 100% !important;     /* каждая занимает всю строку */
    align-self: stretch !important;

    margin: 0 !important;
    height: 44px !important;       /* «тонкая полоска»; можно 40–48 */
    padding: 0 95px !important;
    font-size: 18px !important;
    line-height: 1 !important;
    border-radius: 0 !important;
    white-space: nowrap !important;
    text-align: center !important;
    justify-content: center !important;
    align-items: center !important;
  }

  /* отступ между кнопками */
  .single-product form.cart .oneclick-btn.oneclick-btn{
    margin-top: 8px !important;
  }
}

/* страховка от старых «микро-ширин» (встречались 3px/290px) — бьем ровно по этим двум */
.single-product form.cart .single_add_to_cart_button.single_add_to_cart_button[type="submit"],
.single-product form.cart .oneclick-btn.oneclick-btn{
  width: auto !important;         /* вне мобилки пусть ведут себя нормально */
  flex-basis: auto !important;
}





/* === MOBILE: только Add to Cart + One-click === */
@media (max-width: 900px){

  /* подчищаем родителей, чтобы ничего не сжимало */
  .single-product .single_variation_wrap .variations_button,
  .single-product form.cart{
    display:block !important;
    width:100% !important;
  }

  /* ОБЕ кнопки в колонку на всю строку */
  .single-product form.cart .single_add_to_cart_button,
  .single-product form.cart .oneclick-btn{
    display:block !important;
    box-sizing:border-box !important;
    width:100% !important;          /* если тема всё равно давит ширину — ниже есть ручные паддинги */
    max-width:100% !important;
    margin:0 !important;
    height:44px !important;
    line-height:1 !important;
    border-radius:0 !important;
    white-space:nowrap !important;
    text-align:center !important;
  }

  /* ── РАЗДЕЛЬНЫЕ ПАДДИНГИ (подгони числа под идеальную «полоску») ── */

  /* ВЕРХНЯЯ: Додати в кошик */
  .single-product form.cart .single_add_to_cart_button.single_add_to_cart_button{
    padding:0 95px !important;      /* ↑ ты уже подобрал — оставляю 95px */
    font-size:18px !important;
  }

  /* НИЖНЯЯ: Купити в 1 клік */
  .single-product form.cart .oneclick-btn.oneclick-btn{
    padding:0 115px !important;     /* ← ПОДБЕРИ: начни зі 110px, +/- 5–10px */
    font-size:18px !important;
    margin-top:10px !important;     /* відступ між кнопками */
  }
}

/* Вне мобилки ничего не меняем */



@media (max-width: 768px){
  .single-product .mm-bullets{
    position: static !important;
    display: flex !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 10px 0 0 !important;   /* сверху небольшой отступ */
    clear: both !important;        /* если тема где-то плавает — не даст залезть вверх */
  }
}

/* === MOBILE GALLERY BULLETS === */
@media (max-width: 768px){
  /* прячем полосу миниатюр */
  .single-product .woocommerce-product-gallery .flex-control-nav,
  .single-product .woocommerce-product-gallery .flex-control-thumbs,
  .single-product .woocommerce-product-gallery__thumbs,
  .single-product .woocommerce-product-thumbnails,
  .single-product .elementor-swiper .swiper-thumbs,
  .single-product .elementor-swiper .swiper-container-thumbs {
    display: none !important;
  }

  /* контейнер для наших «квадратиков» */
  .single-product .mm-bullets{
    display:flex; justify-content:center; align-items:center;
    gap:8px; margin-top:10px;
  }

  .single-product .mm-bullet{
    width:14px; height:14px; box-sizing:border-box;
    border:1px solid #000; border-radius:0;
    background:transparent; padding:0; cursor:pointer;
    display:inline-block;
  }
  .single-product .mm-bullet.is-active{
    background:#000;
  }

  /* совсем узкие экраны — поменьше */
  @media (max-width: 480px){
    .single-product .mm-bullet{ width:12px; height:12px; }
  }
}



/* ===== MOBILE: Add to Cart + One-click = как nv-option (100% ширина) ===== */
@media (max-width: 768px){

  /* и для simple, и для variable карточек */
  html body.single-product form.cart,
  html body.single-product .single_variation_wrap .variations_button{
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    width: 100% !important;
  }

  /* сама кнопка "Додати в кошик" (перебиваем любые старые !important) */
  html body.single-product form.cart
  .single_add_to_cart_button.single_add_to_cart_button[type="submit"]{
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    min-width: 0 !important; max-width: 100% !important;

    height: 44px !important;
    padding: 0 12px !important;
    font-size: 18px !important;
    line-height: 1 !important;
    border-radius: 0 !important;
    margin: 0 !important;
    white-space: nowrap !important;
    justify-content: center !important;
    align-items: center !important;
  }

  /* "Купити в 1 клік" — та же ширина и параметры */
 
  /* (опционально) количество в ту же высоту */
  html body.single-product form.cart .quantity .qty{
    height: 44px !important;
    line-height: 44px !important;
  }
}













/* Размеры (M/L и т.п.) — всегда слева */
body.single-product .attr-block.label-inline{
  justify-content: flex-start !important;   /* подпись + контрол в одну линию, слева */
}
body.single-product .attr-buttons{
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;   /* главное — слева */
  align-items: center !important;
  gap: 5px !important;

  margin-left: 7px !important;                /* убираем авто-центрирование */
  margin-right: auto !important;
  text-align: left !important;
  width: auto !important;
}
body.single-product .attr-buttons .attr-btn{
  margin-left: 0 !important;                /* не даём «съезжать» вправо */
}

/* если тема центрирует через таблицу вариаций — добьём и её */
body.single-product table.variations td.value{
  text-align: left !important;
}

















/* ---- бейдж -XX% в каталоге ---- */
.woocommerce ul.products li.product { position: relative; }
.mm-sale-badge{
  position: absolute;
  left: 10px; top: 10px;
  z-index: 5;
  background: #000; color: #fff;
  padding: 4px 8px;
  font-family: "Tenor Sans", sans-serif;
  font-size: 14px; line-height: 1;
  border-radius: 0;
}

/* ---- цена в каталоге: новая слева (крупнее), старая справа (меньше) ---- */
.woocommerce ul.products li.product .price{
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  flex-wrap: wrap;
}

/* новая (скидочная) */
.woocommerce ul.products li.product .price ins{
  order: 1 !important;
  text-decoration: none !important;
  font-family: "Tenor Sans", serif !important;
  font-weight: 400 !important;
  font-size: 18px !important;
  color: #000 !important;
}

/* старая (зачёркнутая) */
.woocommerce ul.products li.product .price del{
  order: 2 !important;
  font-family: "Tenor Sans", serif !important;
  font-weight: 400 !important;
  font-size: 14px !important;
  color: #7a7a7a !important;
  opacity: 1 !important;
  text-decoration: line-through !important;
  text-decoration-thickness: 1px !important;
}

/* нормализуем вложенные amount/bdi, если тема туда ставит размеры */
.woocommerce ul.products li.product .price ins .woocommerce-Price-amount,
.woocommerce ul.products li.product .price ins .woocommerce-Price-amount bdi,
.woocommerce ul.products li.product .price del .woocommerce-Price-amount,
.woocommerce ul.products li.product .price del .woocommerce-Price-amount bdi{
  font-size: 1em !important;
  color: inherit !important;
}













/* Бейдж -XX% прямо в углу изображения, больше размер */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product .woocommerce-loop-product__link,
.woocommerce ul.products li.product .product-thumbnail{
  position: relative !important;   /* чтобы абсолют позиционировался от картинки */
  display: block !important;
}

.mm-sale-badge{
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  z-index: 5;
  pointer-events: none;             /* клик по картинке проходит сквозь бейдж */
  background: #000 !important;
  color: #fff !important;

  /* крупнее бейдж */
  padding: 8px 14px !important;
  font-family: "Tenor Sans", sans-serif !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

/* можно ещё больше на десктопе */
@media (min-width: 1024px){
  .mm-sale-badge{
    padding: 10px 16px !important;
    font-size: 20px !important;
  }
}










/* === Каталог/архив: новая цена слева, старая справа === */

/* 1) Контейнер цены -> flex */
.woocommerce ul.products li.product .price,
.woocommerce .products .product .price,
.elementor-widget-wc-archive-products .products .product .price{
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  white-space: nowrap;
}

/* 2) Новая (INS) — первая, крупнее, без подчёркивания */
.woocommerce ul.products li.product .price ins,
.woocommerce .products .product .price ins,
.elementor-widget-wc-archive-products .products .product .price ins{
  order: 1 !important;
  text-decoration: none !important;
  font-family: "Tenor Sans","TenorSense",serif !important;
  font-weight: 400 !important;
  font-size: 18px !important;      /* подгони при желании */
  line-height: 1.2 !important;
  color: #000 !important;
}

/* 3) Старая (DEL) — вторая, меньше и серее */
.woocommerce ul.products li.product .price del,
.woocommerce .products .product .price del,
.elementor-widget-wc-archive-products .products .product .price del{
  order: 2 !important;
  font-family: "Tenor Sans","TenorSense",serif !important;
  font-weight: 400 !important;
  font-size: 14px !important;      /* поменьше */
  line-height: 1.2 !important;
  color: #7a7a7a !important;
  opacity: 1 !important;
  text-decoration: line-through !important;
  text-decoration-thickness: 1px !important;
}

/* 4) У некоторых тем размеры сидят на .amount/bdi — нормализуем */
.woocommerce ul.products li.product .price ins .woocommerce-Price-amount,
.woocommerce ul.products li.product .price ins .woocommerce-Price-amount bdi,
.woocommerce ul.products li.product .price del .woocommerce-Price-amount,
.woocommerce ul.products li.product .price del .woocommerce-Price-amount bdi{
  font-size: 1em !important;
  color: inherit !important;
}

/* 5) Мобилка — чуть компактнее, если нужно */
@media (max-width: 768px){
  .woocommerce ul.products li.product .price ins,
  .woocommerce .products .product .price ins{
    font-size: 16px !important;
  }
  .woocommerce ul.products li.product .price del,
  .woocommerce .products .product .price del{
    font-size: 13px !important;
  }
}






/* === Каталог: нова ціна зліва (велика), стара справа (менша, сіра) === */

/* Контейнер ціни як flex, щоб можна було міняти порядок */
.woocommerce ul.products li.product .price,
.woocommerce .products .product .price,
.elementor-widget-wc-archive-products .products .product .price{
  display:flex !important;
  align-items:baseline !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  white-space:nowrap;
}

/* СТАРА (зачеркнута) — завжди праворуч і менша */
.woocommerce ul.products li.product .price > del,
.woocommerce .products .product .price > del{
  order:2 !important;
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-weight:400 !important;
  font-size:14px !important;
  line-height:1.2 !important;
  color:#7a7a7a !important;
  opacity:1 !important;
  text-decoration:line-through !important;
  text-decoration-thickness:1px !important;
}

/* НОВА (акційна) — ліворуч і більша.
   Працює і коли ціна в <ins>, і коли просто перший .woocommerce-Price-amount */
.woocommerce ul.products li.product .price > ins,
.woocommerce .products .product .price > ins,
.woocommerce ul.products li.product .price > .woocommerce-Price-amount,
.woocommerce .products .product .price > .woocommerce-Price-amount{
  order:1 !important;
  text-decoration:none !important;
  font-family:"Tenor Sans","TenorSense",serif !important;
  font-weight:400 !important;
  font-size:18px !important;
  line-height:1.2 !important;
  color:#000 !important;
}

/* Нормалізуємо вкладені <bdi> / .amount, якщо тема вішає розміри туди */
.woocommerce ul.products li.product .price ins .woocommerce-Price-amount,
.woocommerce ul.products li.product .price ins .woocommerce-Price-amount bdi,
.woocommerce ul.products li.product .price del .woocommerce-Price-amount,
.woocommerce ul.products li.product .price del .woocommerce-Price-amount bdi{
  font-size:1em !important;
  color:inherit !important;
}

/* Прибрати "від" у списках, якщо з'являється */
.woocommerce ul.products li.product .price .from{ display:none !important; }








/* === Каталог: центрируем содержимое карточек товара === */

/* Базово — центр всего текста в плитке */
.woocommerce ul.products li.product,
.elementor-widget-wc-archive-products .products .product{
  text-align: center !important;
}

/* Картинка по центру (если тема не центрирует) */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link img{
  display: block !important;
  margin: 0 auto !important;
}

/* Название */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.elementor-widget-wc-archive-products .products .product .woocommerce-loop-product__title{
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Цена: у нас flex — центрируем ряд */
.woocommerce ul.products li.product .price,
.elementor-widget-wc-archive-products .products .product .price{
  display: flex !important;
  align-items: baseline !important;
  justify-content: center !important;   /* ключевое */
  gap: 10px !important;
  flex-wrap: wrap !important;
}

/* Кнопка «В кошик/Опції» по центру и не на всю ширину */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product .add_to_cart_button,
.elementor-widget-wc-archive-products .products .product .button{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 10px auto 0 !important;       /* центр */
  float: none !important;                /* на случай, если тема флотит */
}

/* Рейтинг — тоже по центру (если есть) */
.woocommerce ul.products li.product .star-rating{
  float: none !important;
  margin: 6px auto !important;
}




/* === Каталог: центр "Додати в кошик" === */

/* Сама кнопка: убираем float/absolute и центруем */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product .add_to_cart_button,
.woocommerce ul.products li.product .product_type_variable,
.woocommerce ul.products li.product .added_to_cart{
  float: none !important;
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 10px auto 0 !important;   /* центр */
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

/* Если кнопка обёрнута в контейнер, который выравнивает вправо — центрируем его */
.woocommerce ul.products li.product .woocommerce-loop-product__buttons,
.woocommerce ul.products li.product .elementor-product-loop__buttons,
.elementor-widget-wc-archive-products .products .product .elementor-product-loop__buttons{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* На некоторых темах блок кнопок ставят в угол через absolute — сбрасываем */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link ~ .button,
.woocommerce ul.products li.product .woocommerce-LoopProduct-link ~ .woocommerce-loop-product__buttons{
  position: static !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

/* На всякий: сама карточка по центру (не влияет на сетку) */
.elementor-widget-wc-archive-products .products .product,
.woocommerce ul.products li.product{
  text-align: center !important;
}







/* === NUKE: один вид для ЛЮБОЙ таблицы на single product === */

/* Сама таблица */
body.single-product table,
body.single-product .wp-block-table table {
  width: 100% !important;
  border-collapse: collapse !important;
  border: none !important;
  background: transparent !important;
  margin: 12px 0 !important;
  font-family: "Tenor Sans","TenorSense",serif !important;
}

/* Шапка */
body.single-product table thead th,
body.single-product .wp-block-table table thead th {
  text-align: left !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  color: #7A7A7A !important;
  padding: 8px 0 !important;
  border: none !important;
  background: transparent !important;
}

/* Ячейки */
body.single-product table td,
body.single-product .wp-block-table table td {
  font-size: 20px !important;
  color: #000 !important;
  padding: 10px 0 !important;
  border: none !important;
  background: transparent !important;
  vertical-align: top !important;
}

/* ОДНА разделительная линия между строками */
body.single-product table tbody tr + tr td,
body.single-product .wp-block-table table tbody tr + tr td {
  border-top: 1px solid #ECECEC !important;
}

/* Узкая первая колонка (метка) */
body.single-product table td:first-child,
body.single-product .wp-block-table table td:first-child {
  white-space: nowrap !important;
  width: 1% !important;
  padding-right: 16px !important;
}

/* Убить зебру/фоны/границы у любой темы/Гутенберга/Элементор */
body.single-product table :is(tr, th, td),
body.single-product .wp-block-table table :is(tr, th, td) {
  background: transparent !important;
  border: none !important;
}

/* Ссылки как обычный текст */
body.single-product table a,
body.single-product .wp-block-table table a {
  color: inherit !important;
  text-decoration: none !important;
}

/* Мобилка */
@media (max-width: 768px){
  body.single-product table thead th,
  body.single-product .wp-block-table table thead th {
    font-size: 14px !important;
    padding: 6px 0 !important;
  }
  body.single-product table td,
  body.single-product .wp-block-table table td {
    font-size: 18px !important;
    padding: 8px 0 !important;
  }
}

















/* === Герой-баннер категории === */
.mm-hero-cat{position:relative;margin:0 0 16px;border-radius:6px;overflow:hidden}
.mm-hero-cat__bg{
  height:160px;
  background:#2b2f33 center/cover no-repeat;
}
.mm-hero-cat__overlay{
  position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.45),rgba(0,0,0,.45));
}
.mm-hero-cat__inner{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:12px;
}
.mm-hero-cat__title{
  margin:0;color:#fff;font:700 28px/1.15 "Tenor Sans","TenorSense",serif;letter-spacing:.01em;
}

/* === Плитки подкатегорий (по центру) === */
.mm-tiles{
  display:flex;flex-wrap:wrap;justify-content:center;gap:18px 24px;
  margin:14px 0 20px;
}
.mm-tiles__item{
  display:flex;flex-direction:column;align-items:center;text-decoration:none;color:#111;position:relative;
}
.mm-tiles__thumb{
  width:84px;height:84px;border-radius:10px;overflow:hidden;background:#f3f3f3;display:block;
}
.mm-tiles__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.mm-tiles__name{
  margin-top:8px;font:400 16px/1 "Tenor Sans","TenorSense",serif;
}
.mm-tiles__underline{
  position:absolute;left:0;right:0;bottom:-6px;height:2px;background:#111;opacity:0;transition:opacity .15s ease;
}
.mm-tiles__item.is-active .mm-tiles__underline{opacity:1;}
.mm-tiles__item:hover .mm-tiles__underline{opacity:.5}

/* === Панель "Категорія: [селект]" — опустить чуть ниже, чтобы быть на уровне селекта сортировки Woo === */
.mmc-bar{display:flex;align-items:center;gap:12px;padding:2px 0 14px;border-bottom:1px solid #eee;font-family:"Tenor Sans","TenorSense",serif}
.mmc-left{display:flex;align-items:center;gap:10px;margin-top:6px;} /* ← опускаем левый блок слегка */
.mmc-label{font-size:20px;font-weight:800;color:#111;letter-spacing:.01em;white-space:nowrap}
.mmc-select-wrap{position:relative}
.mmc-select-wrap select{
  appearance:none;-webkit-appearance:none;
  padding:10px 44px 10px 12px;border:1px solid #000;border-radius:0;background:#fff;
  font-size:16px;line-height:1.1;min-width:280px;cursor:pointer;font-family:"Tenor Sans","TenorSense",serif;
}
.mmc-caret{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:12px;pointer-events:none}

/* Адаптивы */
@media (max-width:900px){
  .mm-hero-cat__bg{height:130px}
  .mm-hero-cat__title{font-size:24px}
  .mm-tiles__thumb{width:76px;height:76px}
  .mmc-bar{flex-direction:column;align-items:stretch}
  .mmc-left{margin-top:0}
  .mmc-select-wrap select{min-width:100%}
}






/* Панель слева: категория */
.mmc-bar{
  display:flex;
  align-items:flex-end;
  gap:12px;
  padding:10px 0 14px;
  border-bottom:1px solid #eee;
  font-family:"Tenor Sans","TenorSense",serif;
}
.mmc-left{ display:flex; align-items:flex-end; gap:12px; }
.mmc-label{
  font-size:20px;
  font-weight:800;
  color:#111;
  letter-spacing:.01em;
  line-height:1;
  padding-bottom:4px;
  white-space:nowrap;
}
.mmc-select-wrap{ position:relative; }
.mmc-select-wrap select{
  appearance:none; -webkit-appearance:none;
  padding:10px 44px 10px 12px;
  border:1px solid #000;
  border-radius:0;          /* квадратные углы */
  background:#fff;
  font-size:16px;
  line-height:1.1;
  min-width:280px;
  cursor:pointer;
  font-family:"Tenor Sans","TenorSense",serif;
}
.mmc-caret{
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  font-size:12px;
  pointer-events:none;
}
/* дочерние опции — без точек, просто немного светлее можно не делать; оставим одинаково */
option.mm-opt-sub{ font-weight:400; }

@media (max-width:900px){
  .mmc-bar{ flex-direction:column; align-items:stretch; gap:8px; }
  .mmc-label{ font-size:18px; padding-bottom:0; }
  .mmc-select-wrap select{ min-width:100%; }
}







/* === Герой-баннер категории: без скруглений, белый заголовок === */
.mm-hero-cat{position:relative;margin:0 0 16px;border-radius:0;overflow:hidden}
.mm-hero-cat__bg{
  height:160px;background:#2b2f33 center/cover no-repeat;border-radius:0
}
.mm-hero-cat__overlay{
  position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.45),rgba(0,0,0,.45))
}
.mm-hero-cat__inner{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:12px
}
.mm-hero-cat__title{
  margin:0;color:#fff;font:700 28px/1.15 "Tenor Sans","TenorSense",serif;letter-spacing:.01em
}

/* === Плитки подкатегорий: больше, без скруглений, подписи чёрные; активная — нижняя полоска === */
.mm-tiles{
  display:flex;flex-wrap:wrap;justify-content:center;gap:20px 26px;margin:14px 0 22px
}
.mm-tiles__item{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:#111;position:relative}
.mm-tiles__thumb{
  width:100px;height:100px;border-radius:0;overflow:hidden;background:#f3f3f3;display:block
}
.mm-tiles__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.mm-tiles__name{
  margin-top:10px;font:400 16px/1 "Tenor Sans","TenorSense",serif;color:#111
}
.mm-tiles__underline{
  position:absolute;left:0;right:0;bottom:-8px;height:2px;background:#111;opacity:0;transition:opacity .15s ease
}
.mm-tiles__item.is-active .mm-tiles__underline{opacity:1}
.mm-tiles__item:hover .mm-tiles__underline{opacity:.5}

/* === Панель "Категорія: …" — опустить «по-дебильному» отрицательным margin-bottom :) === */
.mmc-bar{display:flex;align-items:center;gap:12px;padding:2px 0 14px;border-bottom:1px solid #eee;font-family:"Tenor Sans","TenorSense",serif}
.mmc-left{display:flex;align-items:center;gap:10px;margin-bottom:-65px} /* ↓ опустили левый блок */
.mmc-label{font-size:20px;font-weight:800;color:#111;letter-spacing:.01em;white-space:nowrap}
.mmc-select-wrap{position:relative}
.mmc-select-wrap select{
  appearance:none;-webkit-appearance:none;
  padding:10px 44px 10px 12px;border:1px solid #000;border-radius:0;background:#fff;
  font-size:16px;line-height:1.1;min-width:280px;cursor:pointer;font-family:"Tenor Sans","TenorSense",serif
}
.mmc-caret{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:12px;pointer-events:none}

@media (max-width:900px){
  .mm-hero-cat__bg{height:130px}
  .mm-hero-cat__title{font-size:24px}
  .mm-tiles__thumb{width:96px;height:96px}
  .mmc-bar{flex-direction:column;align-items:stretch}
  .mmc-left{margin-bottom:0}
  .mmc-select-wrap select{min-width:100%}
}




/* 1) Заголовок архи-категории белым */
.mm-hero__title{ color:#fff !important; text-shadow:0 1px 2px rgba(0,0,0,.25); }

/* 2) Плитки подкатегорий — убираем чёрную заливку/подчёркивание у активной */
.mm-subcats__pill.is-active{
  background:transparent !important;
}
.mm-subcats__pill.is-active .mm-subcats__name{
  text-decoration:none !important;
}

/* 3) Индикатор выбора — тонкая линия под плиткой */
.mm-subcats__pill{ position:relative; }
.mm-subcats__pill::after{
  content:""; display:block; height:2px; width:0;
  background:#111; margin-top:8px; transition:width .15s ease;
}
.mm-subcats__pill.is-active::after{ width:100%; }

/* по желанию: лёгкая подсветка при ховере без заливки */
.mm-subcats__pill:hover::after{ width:100%; }



/* Архив товаров: заголовок всегда занимает 2 строки */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.elementor-widget-wc-archive-products .woocommerce ul.products li.product .woocommerce-loop-product__title,
.elementor-widget-woocommerce-archive-products .woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2.woocommerce-loop-product__title {
  line-height: 1.25 !important;           /* высота строки */
  max-height: calc(1em * 4) !important;/* ровно 2 строки */
  min-height: calc(1em * 4) !important;/* держим место даже для коротких */
  overflow: hidden !important;

  /* аккуратный обрез после 2 строк */
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* (опционально) многоточие на браузерах без line-clamp */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  text-overflow: ellipsis;
}











/* Панель: подпись и два селекта */
.mmc-bar{display:flex;align-items:center;gap:12px;padding:10px 0 14px;border-bottom:1px solid #eee;font-family:"Tenor Sans","TenorSense",serif;}
.mmc-left{display:flex;align-items:center;gap:10px;margin-bottom:-65px;} /* опустили, если надо — подправь число */
.mmc-label{font-size:20px;font-weight:800;color:#111;white-space:nowrap;}



/* Селект WooCommerce СОРТИРОВКИ — чуть крупнее, чтобы матчился по высоте */
.woocommerce-ordering{position:relative;margin:0;}
.woocommerce-ordering select{
  appearance:none;-webkit-appearance:none;
  padding:10px 44px 10px 12px; /* +1px к вертикальным отступам */
  border:1px solid #000;border-radius:0;background:#fff;
  font-size:16px;line-height:1.2;min-width:280px;cursor:pointer;
  font-family:"Tenor Sans","TenorSense",serif;
}
.woocommerce-ordering::after{
  content:"▾";position:absolute;right:12px;top:50%;transform:translateY(-50%);
  font-size:12px;pointer-events:none;
}

/* Баннер и плитки (без скруглений, белый заголовок, чёрные подписи, подчёркивание активной) */
.mm-hero-cat{position:relative;margin:0 0 16px;border-radius:0;overflow:hidden;}
.mm-hero-cat__bg{height:160px;background:#2b2f33 center/cover no-repeat;border-radius:0;}
.mm-hero-cat__overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.45),rgba(0,0,0,.45));}
.mm-hero-cat__inner{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:12px;}
.mm-hero-cat__title{margin:0;color:#fff;font:700 28px/1.15 "Tenor Sans","TenorSense",serif;}

.mm-tiles{display:flex;flex-wrap:wrap;justify-content:center;gap:20px 26px;margin:14px 0 22px;}
.mm-tiles__item{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:#111;position:relative;}
.mm-tiles__thumb{width:110px;height:110px;border-radius:0;overflow:hidden;background:#f3f3f3;display:block;}
.mm-tiles__thumb img{width:50%;height:100%;object-fit:cover;display:block;}
.mm-tiles__name{margin-top:10px;font:400 16px/1 "Tenor Sans","TenorSense",serif;color:#111;}
.mm-tiles__underline{position:absolute;left:0;right:0;bottom:-8px;height:2px;background:#111;opacity:0;transition:opacity .15s ease;}
.mm-tiles__item.is-active .mm-tiles__underline{opacity:1;}
.mm-tiles__item:hover .mm-tiles__underline{opacity:.5;}

@media (max-width:900px){
  .mm-hero-cat__bg{height:130px;}
  .mm-hero-cat__title{font-size:24px;}
  .mm-tiles__thumb{width:96px;height:96px;}
  .mmc-bar{flex-direction:column;align-items:stretch;}
  .mmc-left{margin-bottom:0;}
  .mmc-select-wrap select{min-width:100%;}
}

/* Заголовок родительской категории — всегда белый */
.mm-hero-cat__title,
.mm-hero__title,
.woocommerce-products-header__title.page-title,
.archive.tax-product_cat .page-title,
.tax-product_cat .elementor-widget-woocommerce-archive-title .page-title {
  color:#fff !important;
}

/* На всякий случай затемняем подложку, чтобы белый читался */
.mm-hero-cat__overlay{
  background:linear-gradient(0deg, rgba(0,0,0,.45), rgba(0,0,0,.45)) !important;
}






/* ===== MOBILE TWEAKS ===== */
@media (max-width: 680px){

  /* Заголовок в баннере: всегда белый и меньше */
  .mm-hero__title,
  .mm-hero-cat__title,
  .woocommerce-products-header__title.page-title{
    color:#fff !important;
    font-size:30px !important;      /* было крупнее — делаем меньше */
    line-height: 1.15 !important;
    letter-spacing: .01em;
  }

  /* Доп. затемнение подложки на мобиле, чтобы белый читался */
  .mm-hero-cat__overlay,
  .mm-hero__bg::after{
    content:"";
    position:absolute; inset:0;
    background:rgba(0,0,0,.45);
    pointer-events:none;
  }

  /* Горизонтальная «карусель» категорий под баннером */
  .mm-subcats{
    display:flex;
    gap:12px;
    overflow-x:auto;                  /* скролл пальцем */
    -webkit-overflow-scrolling:touch; /* плавность на iOS */
    scroll-snap-type:x mandatory;     /* щёлкает к элементам */
    padding:10px 12px 6px;
    margin:8px -12px 16px;            /* на всю ширину экрана */
  }
  .mm-subcats::-webkit-scrollbar{ display:none; } /* скрыть скроллбар */
  .mm-subcats{ scrollbar-width:none; }            /* Firefox */

  /* Каждая «пилюля» — фикс. ширина, без скруглений, защёлка */
  .mm-subcats__pill{
    flex:0 0 auto;
    scroll-snap-align:start;
    border-radius:0;                  /* без закруглений */
    padding:8px 10px;
  }

  /* Картинка категории больше и без скруглений */
  .mm-subcats__thumb{
    width:64px; height:64px;
    border-radius:0;
    background-size:cover; background-position:center;
  }

  /* Название категории — чёрное и читаемое */
  .mm-subcats__name{
    color:#000;
    font:400 14px/1.1 "Tenor Sans","TenorSense",serif;
    white-space:nowrap;
  }

  /* Активная категория — подчёркивание вместо «чёрного блока» */
  .mm-subcats__pill.is-active{
    background:#fff; color:#000;
    box-shadow: inset 0 -2px 0 #000;  /* тонкая чёрная полоска снизу */
  }
}


/* ===== только мобильная версия ===== */
@media (max-width: 680px){

  /* Заголовок баннера: белый и меньше */
  .mm-hero__title,
  .mm-hero-cat__title,
  .woocommerce-products-header__title.page-title{
    color:#fff !important;
    font-size:20px !important;
    line-height:1.15 !important;
  }

  /* ГОРИЗОНТАЛЬНАЯ ЛЕНТА ДЛЯ ОБОИХ ТИПОВ СПИСКОВ */
  /* контейнер со списком категорий */
  .mm-subcats,
  .mmc-hero__cats{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:12px !important;
    overflow-x:auto !important;              /* скролл пальцем */
    -webkit-overflow-scrolling:touch !important;
    scroll-snap-type:x mandatory !important; /* щёлкает к элементам */
    padding:10px 12px 6px !important;
    margin:8px -12px 16px !important;        /* во всю ширину экрана */
  }
  /* скрываем полосу прокрутки */
  .mm-subcats::-webkit-scrollbar,
  .mmc-hero__cats::-webkit-scrollbar{ display:none; }
  .mm-subcats, .mmc-hero__cats{ scrollbar-width:none; }

  /* каждый элемент ленты фиксированной ширины */
  .mm-subcats > a,
  .mm-subcats > li,
  .mmc-hero__cats > li,
  .mm-subcats__pill{
    flex:0 0 auto !important;
    scroll-snap-align:start !important;
  }

  /* карточка категории (ссылка) */
  .mm-subcats__pill,
  .mmc-hero__cats > li > a{
    display:inline-flex !important;
    align-items:center !important;
    gap:8px !important;
    padding:8px 10px !important;
    border-radius:0 !important;              /* без скруглений */
    background:#fff !important;
    color:#000 !important;
    text-decoration:none !important;
  }

  /* превью категории крупнее и без скруглений */
  .mm-subcats__thumb{
    width:72px !important; height:72px !important;
    border-radius:0 !important;
    background-size:cover !important;
    background-position:center !important;
  }
  .mmc-hero__cats .mmc-hero__thumb img{
    width:72px !important; height:72px !important;
    object-fit:cover !important;
    border-radius:0 !important;
  }

  /* название категории — чёрное */
  .mm-subcats__name,
  .mmc-hero__cats .mmc-hero__name{
    color:#000 !important;
    font:400 14px/1.1 "Tenor Sans","TenorSense",serif !important;
    white-space:nowrap !important;
  }

  /* активная — подчёркивание тонкой линией снизу */
  .mm-subcats__pill.is-active,
  .mmc-hero__cats > li.is-active > a{
    box-shadow: inset 0 -2px 0 #000 !important;
    background:#fff !important;
    color:#000 !important;
  }
}




@media (max-width:680px){
  /* контейнеры двух вариантов списка */
  .mm-subcats,
  .mmc-hero__cats{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:12px !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    scroll-snap-type:x mandatory !important;
    padding:10px 12px 6px !important;
    margin:8px -12px 16px !important;
  }
  /* элементы */
  .mm-subcats > a,
  .mmc-hero__cats > li{ flex:0 0 auto !important; scroll-snap-align:start !important; }

  /* карточка-ссылка */
  .mm-subcats__pill,
  .mmc-hero__cats > li > a{
    display:inline-flex !important;
    align-items:center !important;
    gap:8px !important;
    padding:8px 10px !important;
    border-radius:0 !important;
    background:#fff !important;
    color:#000 !important;
    text-decoration:none !important;
  }

  /* превью крупнее, без скруглений */
  .mm-subcats__thumb{ width:72px !important; height:72px !important; border-radius:0 !important; }
  .mmc-hero__cats .mmc-hero__thumb img{
    width:72px !important; height:72px !important; object-fit:cover !important; border-radius:0 !important;
  }

  /* подпись чёрная */
  .mm-subcats__name,
  .mmc-hero__cats .mmc-hero__name{ color:#000 !important; font:400 14px/1.1 "Tenor Sans","TenorSense",serif !important; white-space:nowrap !important; }

  /* активная — тонкая линия снизу */
  .mm-subcats__pill.is-active,
  .mmc-hero__cats > li.is-active > a{ box-shadow: inset 0 -2px 0 #000 !important; }
}









/* === Горизонтальный скролл для блока подкатегорий (.mm-tiles) — ТОЛЬКО мобила === */
@media (max-width: 768px){
  .mm-tiles{
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    padding: 8px 12px;
    margin: 10px -12px 16px;               /* чтобы тянулось к краям экрана */
    -webkit-overflow-scrolling: touch;     /* инерционный скролл */
    scroll-snap-type: x mandatory;         /* мягкая фиксация элементов */
  }

  .mm-tiles__item{
    flex: 0 0 auto !important;             /* НЕ растягивать на всю ширину */
    scroll-snap-align: start;
  }

  /* спрятать полосы прокрутки */
  .mm-tiles::-webkit-scrollbar{ display:none; }
  .mm-tiles{ scrollbar-width: none; }

  /* на всякий случай: чтобы родитель не отрезал скролл */
  .elementor-widget-container,
  .mm-hero-cat,
  .mm-hero-cat *{
    overflow: visible !important;
  }
}



/* === Горизонтальный скролл .mm-tiles — фикс "пропадают первые пункты" === */
@media (max-width: 768px){
  .mm-tiles{
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    padding: 8px 12px;           /* только паддинги, БЕЗ отрицательного margin */
    margin: 10px 0 16px;         /* убрали -12px по бокам */
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 12px;   /* чтобы первый снап не «упирался» в край */
  }

  .mm-tiles__item{
    flex: 0 0 auto !important;
    scroll-snap-align: start;
    margin: 0 !important;        /* на всякий случай, гасим внутренние маргины */
  }

  /* полосы прокрутки скрываем аккуратно */
  .mm-tiles::-webkit-scrollbar{ display:none; }
  .mm-tiles{ scrollbar-width: none; }

  /* чтобы родители гарантированно не обрезали содержимое */
  .mm-hero-cat,
  .mm-hero-cat *{
    overflow: visible !important;
  }
}




/* Горскролл только на мобиле, без трюков */
@media (max-width: 768px){
  .mm-tiles{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:12px !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;

    padding:8px 12px !important;   /* никаких отрицательных маргинов */
    margin:8px 0 16px !important;

    /* убираем агрессивный снап, чтобы ничего не «прилипало» к середине */
    scroll-snap-type:x proximity;
  }
  .mm-tiles__item{
    flex:0 0 auto !important;
    scroll-snap-align:start;
    margin:0 !important;
  }

  /* прячем полосу прокрутки эстетично */
  .mm-tiles::-webkit-scrollbar{display:none;}
  .mm-tiles{scrollbar-width:none;}

  /* на всякий случай, чтобы родители не подрезали по X */
  .mm-tiles,
  .mm-tiles *{min-width:0;}
}

/* Мобильный горизонтальный скролл для .mm-tiles */
@media (max-width: 768px){
  /* сам контейнер ленты */
  .mm-tiles{
    display:block !important;
    white-space:nowrap !important;          /* все элементы в одну строку */
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x: contain;
    padding:8px 0 !important;
    margin:8px 0 16px !important;
    max-width:100% !important;
    scroll-snap-type:none !important;       /* никаких прилипаний */
  }
  /* элементы в ленте — в ряд */
  .mm-tiles__item{
    display:inline-block !important;        /* критично: не flex */
    vertical-align:top;
    white-space:normal;
    margin:0 12px 0 0 !important;           /* зазор между карточками */
  }
  .mm-tiles__item:first-child{ margin-left:12px !important; }
  .mm-tiles__item:last-child{  margin-right:12px !important; }

  /* чтобы родительские обёртки Elementor/Woo не подрезали по X */
  .mm-hero-cat,
  .mm-hero-cat > *,
  .elementor-widget-container{
    overflow-x:visible !important;
  }

  /* спрятать полосу прокрутки красиво */
  .mm-tiles::-webkit-scrollbar{ display:none; }
  .mm-tiles{ scrollbar-width:none; }
}




/* ===== Плитки подкатегорий: центрирование и одинаковая ширина карточек ===== */

/* сама «плитка» */
.mm-tiles__item{
  display:inline-block !important;   /* чтобы лента по X работала */
  vertical-align:top;
  text-align:center;                 /* центрируем текст */
  width:170px;                       /* фиксированная ширина карточки — смотрится ровно */
  margin:0 12px 0 0 !important;      /* зазор между плитками */
}

/* кликабельная область — столбиком и по центру */
.mm-tiles__item > a{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  text-decoration:none;
}

/* ВАРИАНТ 1: если превью задано как фон через style="background-image:..." */
.mm-tiles__thumb{
  width:140px;
  height:140px;
  display:block;
  margin:0 auto;                     /* центрировать сам блок превью */
  background-position:center;
  background-size:cover;
  border-radius:0;                   /* без скруглений */
}

/* ВАРИАНТ 2: если внутри <span class="mm-tiles__thumb"><img ...></span> */
.mm-tiles__thumb img{
  display:block;
  width:140px;
  height:140px;
  object-fit:cover;
  margin:0 auto;                     /* центр изображения */
  border-radius:0;                   /* без скруглений */
}

/* подпись под картинкой */
.mm-tiles__name{
  margin:6px 0 0;
  font:400 16px/1.2 "Tenor Sans","TenorSense",serif;
  color:#111;                        /* чёрный текст */
  text-align:center;
}

/* мобильный горизонтальный скролл — оставляем как делали ранее */
@media (max-width:768px){
  .mm-tiles{
    display:block !important;
    white-space:nowrap !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    padding:4px 0 !important;
    margin:8px 0 16px !important;
    max-width:100% !important;
  }
  .mm-tiles__item:first-child{ margin-left:px !important; }
  .mm-tiles__item:last-child{  margin-right:5px !important; }

  /* без видимой полосы прокрутки */
  .mm-tiles::-webkit-scrollbar{ display:none; }
  .mm-tiles{ scrollbar-width:none; }
}
/* ——— МЕНЬШЕ КАРТИНКА И МЕНЬШЕ ОТСТУП МЕЖДУ ПЛИТКАМИ ——— */
.mm-tiles__item{
  width:150px;                 /* было 170 */
  margin:0 8px 0 0 !important; /* было 12px */
}

.mm-tiles__item > a{ gap:6px; }

/* если превью фоном */
.mm-tiles__thumb{
  width:120px;                 /* было 140 */
  height:120px;
}

/* если превью <img> */
.mm-tiles__thumb img{
  width:120px;
  height:120px;
}

/* подпись оставим как есть, но можно сделать на 15px, если нужно */
/* .mm-tiles__name{ font-size:15px; } */


/* ——— МОБИЛЬНЫЙ ГОРИЗОНТАЛЬНЫЙ СКРОЛЛ + ИНДИКАТОР ——— */
@media (max-width:768px){
  .mm-tiles{
    position:relative;               /* для псевдоэлементов */
    display:block !important;
    white-space:nowrap !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    padding:8px 0 12px !important;
    margin:8px 0 16px !important;
    max-width:100% !important;
    scroll-snap-type:x mandatory;    /* приятный «прилипальный» скролл */
  }
  .mm-tiles__item{ scroll-snap-align:start; }
  .mm-tiles__item:first-child{ margin-left:12px !important; }
  .mm-tiles__item:last-child{  margin-right:12px !important; }

  /* видимая тонкая полоска прокрутки */
  .mm-tiles::-webkit-scrollbar{ height:4px; }
  .mm-tiles::-webkit-scrollbar-track{ background:#f0f0f0; }
  .mm-tiles::-webkit-scrollbar-thumb{ background:#c9c9c9; border-radius:2px; }
  .mm-tiles{ scrollbar-color:#c9c9c9 #f0f0f0; scrollbar-width:thin; }

  /* индикатор скролла: справа лёгкий градиент + шеврон */
  .mm-tiles::after{
    content:"";
    position:absolute;
    top:0; right:0; bottom:4px;      /* оставим место под скроллбар */
    width:42px;
    pointer-events:none;
    background:
      linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0)) /* светлый fade */,
      
    background-size:auto 100%, 18px 18px;
    opacity:.9;
  }
  /* слева тоже лёгкий fade, чтобы видно начало ленты */
  .mm-tiles::before{
    content:"";
    position:absolute;
    top:0; left:0; bottom:4px;
    width:18px;
    pointer-events:none;
    background:linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));
    opacity:.9;
  }
}





















/* Чтобы панель позиционировалась относительно шапки */
header, .site-header, .elementor-location-header { position:relative; z-index:20; }

/* Коробка панели */
#mm-mega{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:100%;                /* прямо под хедером */
  width:100vw;             /* на всю ширину экрана */
  background:#fff;
  border-top:1px solid #eee;
  box-shadow:0 18px 40px rgba(0,0,0,.12);
  padding:16px 0 20px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .15s ease, transform .15s ease, visibility .15s;
}

/* Внутренняя сетка */
#mm-mega .mm-mega__inner{
  width:min(1280px, calc(100% - 48px));
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:24px 48px;
  font-family:"Tenor Sans","TenorSense",serif;
}

/* Заголовок (родительская категория) — кликабельный */
#mm-mega .mm-mega__title{
  display:block;
  margin:0 0 10px;
  font-weight:800;
  font-size:22px;
  line-height:1.15;
  letter-spacing:.01em;
  color:#111;
  text-decoration:none;
}
#mm-mega .mm-mega__title:hover{ text-decoration:underline; }

/* Список дочерних категорий */
#mm-mega .mm-mega__list{ list-style:none; margin:0; padding:0; }
#mm-mega .mm-mega__list li{ margin:0; }
#mm-mega .mm-mega__list li + li{ margin-top:6px; }
#mm-mega .mm-mega__list a{
  display:block;
  padding:6px 10px;
  border-radius:8px;
  text-decoration:none;
  color:#222;
  transition:background .15s ease, color .15s ease, transform .05s ease;
}
#mm-mega .mm-mega__list a:hover{
  background:#f5f5f5; color:#000; transform:translateY(-1px);
}

/* Открытое состояние (включает JS) */
#mm-mega.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translate(-50%, 0);
  z-index:9999;
}

/* Адаптив */
@media (max-width: 1024px){
  #mm-mega .mm-mega__inner{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:18px 28px; }
  #mm-mega .mm-mega__title{ font-size:20px; }
}
@media (max-width: 680px){
  #mm-mega{ padding:12px 0 14px; }
  #mm-mega .mm-mega__inner{ grid-template-columns:1fr; gap:12px; width:calc(100% - 24px); }
  #mm-mega .mm-mega__list a{ padding:10px 12px; border:1px solid #eee; border-radius:10px; }
}





/* ——— MM header mega: правки по тз ——— */

/* опустим панель на пару пикселей и зададим семейство шрифтов */
#mm-mega{
  margin-top: 40px; /* ↓ чуть ниже хедера */
  font-family: "TenorSense", "Tenor Sans", serif !important;
}

/* внутренняя сетка тоже с этим шрифтом (на всякий случай) */
#mm-mega .mm-mega__inner{
  font-family: "TenorSense", "Tenor Sans", serif !important;
}

/* родительские категории: менее жирные, без подчёркивания и на ховере тоже без него */
#mm-mega .mm-mega__title{
  font-weight: 500;            /* было 700/800 — делаем спокойнее */
  text-decoration: none;       /* без подчёркивания по умолчанию */
  color: #111;                 /* как и было */
}
#mm-mega .mm-mega__title:hover,
#mm-mega .mm-mega__title:focus{
  text-decoration: none;       /* и на ховере тоже НЕ подчёркивать */
  color: #000;                 /* лёгкое затемнение ок */
}

/* дочерние ссылки — тоже без подчёркивания (у нас и так подсветка фоном) */
#mm-mega .mm-mega__list a{
  text-decoration: none;
  font-weight: 400;            /* нормальное начертание */
  font-family: "TenorSense", "Tenor Sans", serif !important;
}
#mm-mega .mm-mega__list a:hover{
  text-decoration: none;
}









/* Общий стиль */
.woo-bc,
.rank-math-breadcrumb,
.yoast-breadcrumbs {
  color: #000 !important;
  font-size: 16px;
  margin-left: 10px;
  
  line-height: 1.4;
}

/* Ссылки — чёрные, без подчёркивания по умолчанию */
.woo-bc a,
.rank-math-breadcrumb a,
.yoast-breadcrumbs a {
  color: #000;
  text-decoration: none;
}
.woo-bc a:hover,
.rank-math-breadcrumb a:hover,
.yoast-breadcrumbs a:hover {
  text-decoration: underline;
  
}

/* Разделитель */
.woo-bc .crumb-sep { margin: 0 .5em; }

/* Текущая страница — подчёркнута и чёрная */
.woo-bc .crumb-item:last-of-type,
.rank-math-breadcrumb .last,
.yoast-breadcrumbs .breadcrumb_last {
  color: #000;
  text-decoration: underline;
}

/* На всякий случай: если WooCommerce не добавил классы — подчеркнуть всё, что не ссылка, в конце */
.woo-bc .crumb-item:last-of-type:not(a) { text-decoration: underline; }




.back-to-cat {
  display:inline-block;
  color:#000;
  font-weight:600;
  text-decoration:none;
  font-size: 20px;
}
.back-to-cat:hover { text-decoration: underline; }


.back-to-cat::before {
  content:"←";
  font-size:22px;     /* увеличьте по вкусу */
  margin-right:.4em;
  position: relative;
  top: -1px;          /* лё
  гкое выравнивание */
  
}



/* размер стрелки в крошках */
.woo-bc .crumb-sep {
  font-size: 20px;   /* сделайте 24–28px если нужно крупнее */
  line-height: 1;
  margin: 0 .6em;    /* расстояние вокруг */
  display: inline-block;
  transform: translateY(-1px); /* чуть «выровнять» по базовой линии */
  
  
}


@media (min-width:1024px){
.mm-tiles{ gap:16px 5px; }
single-product .woo-bc,
.single-product .back-to-cat {
 margin-left: 80px;
    
}
}

/* Общий стиль для хлебных крошек Woo */
.woo-bc.woocommerce-breadcrumb {
    font-size: 12px;      /* размер на десктопе */
    line-height: 1.3;
    margin-bottom: 8px;   /* можешь уменьшить/увеличить отступ по вкусу */
}

/* Элементы внутри крошек (текст и стрелка) */
.woo-bc .crumb-item,
.woo-bc .crumb-sep {
    font-size: inherit;
}

/* На мобильных делаем ещё чуть меньше */
@media (max-width: 767px) {
    .woo-bc.woocommerce-breadcrumb {
        font-size: 11px;
        margin-bottom: 6px;
        
    }
}




















/* 1. Крошки и "← назад в категорию" всегда поверх всего */
.single-product .woo-bc,
.single-product .back-to-cat {
    position: relative;
    z-index: 50;
    font-size: 12px;
    
}

/* 2. Всё, что связано с картинкой товара и секцией продукта — ниже крошек */
.single-product .elementor-location-single .elementor-section,
.single-product .elementor-location-single .elementor-column,
.single-product .elementor-location-single .woocommerce-product-gallery,
.single-product .elementor-location-single .woocommerce-product-gallery__wrapper,
.single-product .elementor-location-single .woocommerce-product-gallery__image {
    position: relative;
    z-index: 1;
}



/* 2. "← Кашпо" — стиль как у крошек */
body.single-product .back-to-cat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;         /* тот же размер, что и для крошек */
    line-height: 1.4;
    letter-spacing: 0.04em;
   
    font-weight: 400;
    color: #111;
    text-decoration: none;
}

body.single-product .back-to-cat:hover {
    color: #000;
}

/* Иконка слева, как у крошек */
body.single-product .back-to-cat::before {
    content: '←';
    display: inline-block;
    font-size: 13px;
    line-height: 1;
}

/* 3. Крошки и "Кашпо" НЕ выше хедера и выпадающего меню */
body.single-product nav.woo-bc,
body.single-product .back-to-cat {
    position: relative;
    z-index: 5;              /* ниже хедера/мегаменю */
}

/* Хедер и мегаменю всегда поверх всего контента */
header,
.site-header,
.elementor-location-header,
#mm-mega {
    position: ;
    z-index: 1000;
}


/* Меньше расстояние между стрелкой и текстом "Кашпо" */
body.single-product .back-to-cat {
    gap: 0px; /* можешь попробовать 1px, если хочешь прям вплотную */
}













/* MOBILE: сортировка = маленький квадрат с двумя стрелками, без текста */
@media (max-width: 767px) {

  /* сам блок сортировки */
  .woocommerce-ordering {
    position: relative;
    width: 44px;
    height: 44px;
    border: 1px solid #000;
    margin: 8px 0 20px auto; /* прижимаем вправо под категорией */
  }

  /* прячем текст, но оставляем кликабельность селекта */
  .woocommerce-ordering select {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;          /* невидимый, но работает */
    cursor: pointer;
  }



  


}











/* Мобільна версія: квадрат сортування з ↑↓ замість тексту і без мікрострілки */
@media (max-width: 768px) {

  /* Сам квадрат сортування справа від "Категорія" */
  form.woocommerce-ordering {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0 0 0 8px;          /* трохи відступ зліва від селекта категорій */
    padding: 0;
    border: 1px solid #000;     /* рамка 1px */
    box-sizing: border-box;
    vertical-align: middle;     /* щоб було в один ряд з селектом категорії */
    background: transparent;
  }

  /* ВИРУБУЄМО всі фонові і псевдо-стрілки всередині форми */
  form.woocommerce-ordering select.orderby,
  form.woocommerce-ordering *,
  form.woocommerce-ordering *::before,
  form.woocommerce-ordering *::after,
  form.woocommerce-ordering::after {
    background: none !important;
    background-image: none !important;
    box-shadow: none !important;
    content: none !important;
  }

  /* Ховаємо сам <select>, але він займає весь квадрат і клікабельний */
  form.woocommerce-ordering select.orderby {
    position: absolute !important;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    opacity: 0 !important;    
   повністю невидимий */
    border: none !important;
    cursor: pointer;
    -webkit-appearance: none !important;
    appearance: none !important;
    color: transparent !important;  /* текст не видно */
  }

  /* У нативному дропдауні текст хай буде нормальний */
  form.woocommerce-ordering select.orderby option {
    color: #000;
  }

  /* ТЕПЕР малюємо свою іконку ↑↓ поверх всього */
  form.woocommerce-ordering::before {
    content: "↑↓";
    position: relative;
    z-index: 1;
    font-size: 25px;      /* розмір стрілок — можна збільшити, якщо хочеш */
    font-weight: 700;
    line-height: 1;
    letter-spacing: -6px; /* стрілки ближче одна до одної */
    display: inline-block;
    margin-right:5px;
    margin-bottom: 1px;
  }
}












/* MOBILE: укоротить панель категорий и немного опустить */
@media (max-width: 767px) {

  /* Чуть короче справа и чуть ниже */
  .mmc-select-wrap {
    max-width: 55% !important;   /* укорачиваем СПРАВА, высота не трогаем */
    max-height:59px;
    margin-top: px !important;  /* слегка опускаем вниз */
  }

  /* Тот же по высоте, просто чуть меньше текст */
  .mmc-select-wrap select#mmc-cat {
    width: 100% !important;      /* растянуть по новой ширине обёртки */
    font-size: 13px;             /* меньше шрифт, но паддинги/высота те же */
  }
}



/* MOBILE: чуть опустить блок "Категорія" относительно квадратика сортировки */
@media (max-width: 767px) {
  .mmc-bar {
    align-items: flex-start; /* чтобы flex не выравнивал их по центру принудительно */
  }

  .mmc-bar .mmc-left {
    transform: translateY(84px); /* можно 2px / 6px — подгони по вкусу */
    margin-top: -70px;
    
  }
}














@media (max-width: 767px) {
  form.woocommerce-ordering select.orderby {
    position: relative;
    margin-left: -40px; /* двигает hitbox ВЛЕВО, число подбери под себя */
  }
}

























/* === ГОЛОВНА СТОРІНКА КАТАЛОГУ: 3 баннери === */
.mm-catalog-heroes {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin: 0 0 32px;
}

.mm-cat-hero {
    position: relative;
    height: 240px;
    border-radius: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: transform 0.2s ease;
}
.mm-cat-hero:hover {
    transform: translateY(-4px);
}

.mm-cat-hero__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
}

.mm-cat-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(0,0,0,0.45), rgba(0,0,0,0.45));
}

.mm-cat-hero__title {
    position: relative;
    z-index: 2;
    margin: 0;
    color: #fff;
    font-family: "Tenor Sans","TenorSense", serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    padding: 12px;
}

/* === МОБІЛКА: колонкою або скрол === */
@media (max-width: 768px) {
    .mm-catalog-heroes {
        grid-template-columns: 1fr; /* один під одним */
        gap: 16px;
        margin-bottom: 24px;
    }
    .mm-cat-hero {
        height: 180px;
    }
    .mm-cat-hero__title {
        font-size: 24px;
    }
}

/* Якщо хочеш горизонтальний скрол замість колонки — закоментуй верхній блок @media і розкоментуй цей: */
/*
@media (max-width: 768px) {
    .mm-catalog-heroes {
        display: flex;
        flex-wrap: nowrap;
        gap: 12px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        padding: 8px 12px;
        margin: 0 -12px 24px;
    }
    .mm-cat-hero {
        flex: 0 0 85%;
        scroll-snap-align: start;
        height: 180px;
    }
    .mm-catalog-heroes::-webkit-scrollbar { display: none; }
    .mm-catalog-heroes { scrollbar-width: none; }
}
*/








/* === ГОЛОВНА СТОРІНКА КАТАЛОГУ: 3 баннери === */
.mm-catalog-heroes {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;                          /* 10px між баннерами */
    margin: 0 0 32px;
}

.mm-cat-hero {
    position: relative;
    height: 180px;                      /* фікс висота 180px на десктопі */
    border-radius: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: transform 0.2s ease;
}
.mm-cat-hero:hover {
    transform: translateY(-4px);
}

.mm-cat-hero__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
}

.mm-cat-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(0,0,0,0.45), rgba(0,0,0,0.45));
}

.mm-cat-hero__title {
    position: relative;
    z-index: 2;
    margin: 0;
    color: #fff !important;             /* БІЛИЙ колір тексту */
    font-family: "Tenor Sans","TenorSense", serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    padding: 12px;
}

/* === МОБІЛКА: висота 80px, текст білий === */
@media (max-width: 768px) {
    .mm-catalog-heroes {
        grid-template-columns: 1fr;     /* один під одним */
        gap: 10px;                      /* 10px між баннерами */
        margin-bottom: 24px;
    }
    .mm-cat-hero {
        height: 80px !important;        /* фікс висота 80px на мобілі */
    }
    .mm-cat-hero__title {
        font-size: 20px !important;     /* менший шрифт на мобілі */
        color: #fff !important;         /* БІЛИЙ колір на мобілі */
    }
}


















/* Ховаємо дропдаун "Категорія" ВСЮДИ в каталозі */
.mmc-bar {
    display: none !important;
}/* End custom CSS */