/*
Theme Name: Sticks Store
Description: Storefront theme for Sticks Store.
Author: Sticks Store
Template: botiga
Version: 1.2.0
Text Domain: sticks-store
*/

:root{
  --ss-ink:#0e1420;
  --ss-ink-2:#4d5b70;
  --ss-line:#dde3ec;
  --ss-bg:#ffffff;
  --ss-soft:#f3f6fb;
  --ss-accent:#1d4ed8;
  --ss-accent-dk:#1739a8;
  --ss-accent-sf:#eef3ff;
  --ss-radius:10px;
  --ss-wrap:1200px;
}

/* ── общее ─────────────────────────────────────────────────────────── */
.ss-wrap{max-width:var(--ss-wrap);margin:0 auto;padding:0 20px}
.ss-sec{padding:64px 0}
.ss-sec--soft{background:var(--ss-soft)}
.ss-h2{font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.2;margin:0 0 8px;color:var(--ss-ink);letter-spacing:-.015em}
.ss-lead{color:var(--ss-ink-2);margin:0 0 32px;max-width:62ch;font-size:1.0625rem;line-height:1.6}
.ss-btn{display:inline-block;padding:13px 26px;border-radius:var(--ss-radius);font-weight:600;
  text-decoration:none;font-size:.9375rem;line-height:1.2;transition:background .15s,border-color .15s,color .15s}
.ss-btn--pri{background:var(--ss-accent);color:#fff;border:1px solid var(--ss-accent)}
.ss-btn--pri:hover{background:var(--ss-accent-dk);border-color:var(--ss-accent-dk);color:#fff}
.ss-btn--sec{background:transparent;color:var(--ss-ink);border:1px solid var(--ss-line)}
.ss-btn--sec:hover{border-color:var(--ss-ink);color:var(--ss-ink)}

/* ── герой ─────────────────────────────────────────────────────────── */
.ss-hero{background:linear-gradient(180deg,var(--ss-soft) 0%,#fff 100%);padding:72px 0 56px;border-bottom:1px solid var(--ss-line)}
.ss-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.ss-hero h1{font-size:clamp(2rem,4.2vw,3.15rem);line-height:1.08;letter-spacing:-.025em;margin:0 0 18px;color:var(--ss-ink)}
.ss-hero__sub{font-size:1.125rem;line-height:1.6;color:var(--ss-ink-2);margin:0 0 30px;max-width:52ch}
.ss-hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:34px}
.ss-hero__art{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ss-hero__art img{width:100%;height:190px;object-fit:contain;background:#fff;border:1px solid var(--ss-line);
  border-radius:var(--ss-radius);padding:14px}

/* ── полоса доверия ────────────────────────────────────────────────── */
.ss-trust{display:flex;gap:28px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.ss-trust li{display:flex;align-items:center;gap:9px;font-size:.875rem;color:var(--ss-ink-2);font-weight:500}
.ss-trust svg{flex:none;color:var(--ss-accent)}

/* ── карточки платформ ─────────────────────────────────────────────── */
.ss-grid{display:grid;gap:18px}
.ss-grid--3{grid-template-columns:repeat(3,1fr)}
.ss-grid--4{grid-template-columns:repeat(4,1fr)}
.ss-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--ss-line);
  border-radius:var(--ss-radius);overflow:hidden;text-decoration:none;transition:border-color .15s,box-shadow .15s}
.ss-card:hover{border-color:#c8ced6;box-shadow:0 6px 20px rgba(21,24,29,.07)}
.ss-card__img{height:150px;display:flex;align-items:center;justify-content:center;background:#fff;padding:16px}
.ss-card__img img{max-height:100%;max-width:100%;object-fit:contain}
.ss-card__b{padding:18px 18px 20px;flex:1;display:flex;flex-direction:column}
.ss-card__t{font-weight:650;font-size:1.0625rem;color:var(--ss-ink);margin:0 0 6px;letter-spacing:-.01em}
.ss-card__d{font-size:.875rem;line-height:1.55;color:var(--ss-ink-2);margin:0 0 12px;flex:1}
.ss-card__m{font-size:.8125rem;color:var(--ss-accent);font-weight:600}

/* ── чипы линеек ───────────────────────────────────────────────────── */
.ss-lines{display:grid;grid-template-columns:repeat(2,1fr);gap:40px}
.ss-lines h3{font-size:1rem;margin:0 0 4px;color:var(--ss-ink);letter-spacing:-.01em}
.ss-lines p{font-size:.875rem;color:var(--ss-ink-2);margin:0 0 16px;line-height:1.55}
.ss-chips{display:flex;flex-wrap:wrap;gap:8px}
.ss-chip{display:inline-flex;align-items:baseline;gap:7px;padding:9px 14px;border:1px solid var(--ss-line);
  border-radius:99px;background:#fff;text-decoration:none;font-size:.875rem;font-weight:600;
  color:var(--ss-ink);transition:border-color .15s,background .15s}
.ss-chip:hover{border-color:var(--ss-accent);background:var(--ss-accent-sf);color:var(--ss-ink)}
.ss-chip span{font-weight:400;font-size:.75rem;color:var(--ss-ink-2)}

/* ── объяснялка ────────────────────────────────────────────────────── */
.ss-explain{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.ss-explain h3{font-size:1.0625rem;margin:0 0 8px;color:var(--ss-ink);letter-spacing:-.01em}
.ss-explain p{font-size:.9375rem;line-height:1.65;color:var(--ss-ink-2);margin:0}
.ss-num{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;
  background:var(--ss-accent-sf);color:var(--ss-accent-dk);font-weight:700;font-size:.875rem;margin-bottom:12px}

/* ── FAQ ───────────────────────────────────────────────────────────── */
.ss-faq{max-width:820px}
.ss-faq details{border-bottom:1px solid var(--ss-line);padding:0}
.ss-faq summary{cursor:pointer;padding:18px 0;font-weight:600;font-size:1rem;color:var(--ss-ink);
  list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.ss-faq summary::-webkit-details-marker{display:none}
.ss-faq summary::after{content:"+";font-weight:400;font-size:1.4rem;color:var(--ss-accent);flex:none;line-height:1}
.ss-faq details[open] summary::after{content:"\2212"}
.ss-faq details p{margin:0 0 18px;color:var(--ss-ink-2);line-height:1.7;font-size:.9375rem;max-width:70ch}
.ss-faq details p a{color:var(--ss-accent-dk)}

/* ── витрина: бейдж наличия и цена ─────────────────────────────────── */
.woocommerce ul.products li.product .price{color:var(--ss-ink);font-weight:650}
.woocommerce ul.products li.product.outofstock a img{opacity:.5}
.ss-oos{display:inline-block;font-size:.75rem;font-weight:600;color:#8a6100;background:#fff6e0;
  border:1px solid #f0dcae;border-radius:5px;padding:3px 9px;margin-bottom:6px}

/* ── описание категории ────────────────────────────────────────────── */
.term-description{max-width:78ch;line-height:1.7;color:var(--ss-ink-2);font-size:1rem}
.term-description p{margin:0 0 14px}
.term-description strong{color:var(--ss-ink)}
.term-description a{color:var(--ss-accent-dk);text-decoration:underline;text-underline-offset:2px}

/* ── карточка товара ───────────────────────────────────────────────── */
.woocommerce div.product .woocommerce-tabs .panel p,
.woocommerce div.product .woocommerce-product-details__short-description p{line-height:1.7}
.woocommerce div.product .woocommerce-tabs .panel a{color:var(--ss-accent-dk)}
.woocommerce div.product form.cart .button{background:var(--ss-accent);border-color:var(--ss-accent)}
.woocommerce div.product form.cart .button:hover{background:var(--ss-accent-dk);border-color:var(--ss-accent-dk)}

/* ── адаптив ───────────────────────────────────────────────────────── */
@media(max-width:1024px){
  .ss-grid--4{grid-template-columns:repeat(2,1fr)}
  .ss-grid--3{grid-template-columns:repeat(2,1fr)}
  .ss-hero__grid{grid-template-columns:1fr;gap:34px}
  .ss-hero__art{max-width:460px}
  .ss-explain{grid-template-columns:1fr;gap:26px}
  .ss-lines{grid-template-columns:1fr;gap:32px}
}
@media(max-width:640px){
  .ss-sec{padding:44px 0}
  .ss-hero{padding:48px 0 40px}
  .ss-grid--4,.ss-grid--3{grid-template-columns:1fr}
  .ss-hero__art img{height:150px}
  .ss-trust{gap:14px}
  .ss-trust li{width:100%}
}

/* ── главная во всю ширину: нейтрализуем контейнер темы ────────────── */
body.home .container.content-wrapper{max-width:none;width:100%;padding:0;margin:0}
body.home .row.main-row{margin:0;display:block}
body.home #primary{width:100%;max-width:none;flex:none;padding:0;margin:0}
body.home .content-area,body.home .site-content{padding:0}

/* ── шапка ─────────────────────────────────────────────────────────── */
.site-header .site-description{display:none}
.bhfb-header .site-title{font-size:1.3125rem;font-weight:700;letter-spacing:-.02em;margin:0;line-height:1.2}
.bhfb-header .site-title a{color:var(--ss-ink);text-decoration:none}
.bhfb-header .bhfb-main_header_row{border-bottom:1px solid var(--ss-line)}
.bhfb-header .bhfb-main_header_row > .container-fluid{max-width:var(--ss-wrap);margin:0 auto;padding:0 20px}
.bhfb-header .menu-main-container > ul{display:flex;flex-wrap:nowrap;justify-content:center;gap:4px;margin:0;padding:0}
.bhfb-header .menu-main-container > ul > li > a{padding:10px 13px;font-size:.9375rem;font-weight:600;
  color:var(--ss-ink);white-space:nowrap;border-radius:7px}
.bhfb-header .menu-main-container > ul > li > a:hover{color:var(--ss-accent-dk);background:var(--ss-accent-sf)}
.bhfb-header .sub-menu a{font-size:.875rem}

/* ── подвал ────────────────────────────────────────────────────────── */
.ss-footer{background:var(--ss-ink);color:#b3bcc8;padding:52px 0 12px}
.ss-footer a{color:#d6dde6;text-decoration:none}
.ss-footer a:hover{color:#fff;text-decoration:underline}
.ss-footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px}
.ss-footer__brand{font-size:1.1875rem;font-weight:700;color:#fff;letter-spacing:-.02em;margin:0 0 10px}
.ss-footer p{margin:0 0 12px;font-size:.875rem;line-height:1.65;max-width:38ch}
.ss-footer h3{font-size:.8125rem;text-transform:uppercase;letter-spacing:.09em;color:#7f8b9a;
  margin:0 0 14px;font-weight:700}
.ss-footer ul{list-style:none;margin:0;padding:0}
.ss-footer li{margin-bottom:9px;font-size:.875rem;line-height:1.45}
.ss-footer__legal{border-top:1px solid #262c35;margin-top:40px;padding:20px 0;
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:.8125rem;color:#79838f}
.ss-footer__warn{background:#0e1116;color:#8d97a4;font-size:.75rem;line-height:1.6;
  padding:14px 0;text-align:center}
.ss-footer__warn strong{color:#c3ccd6}
@media(max-width:1024px){.ss-footer__grid{grid-template-columns:1fr 1fr;gap:30px}}
@media(max-width:640px){.ss-footer__grid{grid-template-columns:1fr;gap:26px}.ss-footer{padding:38px 0 10px}}

/* ── шапка: убрать тэглайн, дать меню всю свободную ширину ─────────── */
.bhfb-header .site-description,.site-header .site-description{display:none}
.bhfb-header .bhfb-main_header_row .bhfb-row{display:flex;align-items:center;gap:24px;flex-wrap:nowrap}
.bhfb-header .bhfb-main_header_row .bhfb-column{width:auto;max-width:none;flex:0 0 auto;padding:0}
.bhfb-header .bhfb-main_header_row .bhfb-column-2{flex:1 1 auto;min-width:0}
.bhfb-header .bhfb-main_header_row .bhfb-column-3{margin-left:auto}
.bhfb-header .menu-main-container > ul > li > a{padding:10px 10px}
@media(max-width:1200px){
  .bhfb-header .menu-main-container > ul > li > a{padding:10px 7px;font-size:.875rem}
}

/* ── подвал темы: свой копирайт уже есть ───────────────────────────── */
.bhfb-footer .bhfb-below_footer_row{display:none}

/* ── описание категории ────────────────────────────────────────────── */
.woocommerce-page-header .term-description{max-width:none;margin:14px 0 0;font-size:1rem;
  line-height:1.7;color:var(--ss-ink-2);text-align:left}
.woocommerce-page-header .term-description p{margin:0 0 12px}
.woocommerce-page-header .term-description p:last-child{margin:0}
.woocommerce-page-header .term-description strong{color:var(--ss-ink)}
.ss-cat-body{max-width:none;margin:56px 0 0;padding-top:40px;border-top:1px solid var(--ss-line);
  text-align:left}
.ss-cat-body h2{font-size:1.375rem;line-height:1.25;margin:30px 0 10px;color:var(--ss-ink);
  letter-spacing:-.015em;text-align:left}
.ss-cat-body h2:first-child{margin-top:0}
.ss-cat-body h3{font-size:1.0625rem;margin:22px 0 8px;color:var(--ss-ink);text-align:left}
.ss-cat-body p,.ss-cat-body li{font-size:.9375rem;line-height:1.75;color:var(--ss-ink-2);text-align:left}
.ss-cat-body p{margin:0 0 14px}
.ss-cat-body ul{margin:0 0 16px;padding-left:20px}
.ss-cat-body li{margin-bottom:7px}
.ss-cat-body a{color:var(--ss-accent-dk);text-decoration:underline;text-underline-offset:2px}
.ss-cat-body strong{color:var(--ss-ink)}
.ss-footer__warn p{margin:0 0 10px}
.ss-footer__warn p:last-child{margin:0}
.ss-footer__tm{font-size:.6875rem;line-height:1.55;color:#6b7684;max-width:none}

/* ── карточка товара ───────────────────────────────────────────────── */
.woocommerce-product-details__short-description p{margin:0 0 10px;line-height:1.6}
.ss-pack{font-size:.8125rem;color:var(--ss-ink-2);background:var(--ss-soft);
  border:1px solid var(--ss-line);border-radius:7px;padding:9px 12px;display:inline-block}
.woocommerce div.product .product_meta{font-size:.8125rem;color:var(--ss-ink-2);
  border-top:1px solid var(--ss-line);padding-top:14px;margin-top:18px}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--ss-accent-dk)}
.woocommerce div.product .woocommerce-tabs .panel h2{font-size:1.25rem;margin:26px 0 10px;
  letter-spacing:-.015em;color:var(--ss-ink)}
.woocommerce div.product .woocommerce-tabs .panel h2:first-child{margin-top:0}
.woocommerce div.product .woocommerce-tabs .panel{max-width:820px}
.woocommerce div.product .woocommerce-tabs .panel p{margin:0 0 13px;color:var(--ss-ink-2)}
.woocommerce div.product .woocommerce-tabs .panel strong{color:var(--ss-ink)}
.woocommerce .woocommerce-breadcrumb{font-size:.8125rem;color:var(--ss-ink-2)}
.woocommerce .woocommerce-breadcrumb a{color:var(--ss-ink-2)}
.woocommerce .woocommerce-breadcrumb a:hover{color:var(--ss-accent-dk)}
.ss-menu-label{display:inline-block;padding:10px 10px;font-size:.9375rem;font-weight:600;
  color:var(--ss-ink);white-space:nowrap;cursor:default}
@media(max-width:1200px){.ss-menu-label{padding:10px 7px;font-size:.875rem}}
.ss-footer__h3b{margin-top:22px!important}


/* ── категория: текст во всю ширину контента ───────────────────────── */
.woocommerce-page-header .woocommerce-products-header__title{text-align:left}
.woocommerce-page-header .term-description p{max-width:none}
.ss-cat-body h2,.ss-cat-body h3,.ss-cat-body p,.ss-cat-body li{max-width:none}

/* ── плотность витрины: меньше вертикального воздуха ───────────────────── */
.woocommerce-page-header{padding-top:44px;padding-bottom:44px}
ul.products{row-gap:18px!important}
ul.products li.product{padding-bottom:0}
ul.products li.product .loop-image-wrap{margin-bottom:8px}
ul.products li.product .loop-image-wrap img{max-height:240px;width:auto;margin:0 auto;object-fit:contain}
ul.products li.product .woocommerce-loop-product__title{margin-bottom:4px}
ul.products li.product .price{margin-bottom:0}
.ss-cat-body{margin-top:36px;padding-top:28px}
.ss-cat-body h2{margin-top:22px}
.header-search-form{display:none!important}
.single-product .woocommerce-tabs{margin:44px 0 36px}
.single-product .related.products{padding:48px 0}

/* ─────────────────────────────────────────────────────────────────────────
 * Кнопки: полный набор состояний
 *
 * Botiga объявляет `a:visited{color:#212121}` и `a:hover,a:focus,a:active
 * {color:#757575}` — у этих правил специфичность выше, чем у одиночного
 * класса `.ss-btn--pri`, поэтому после первого же клика текст на синей
 * кнопке становился тёмным. Ниже каждое состояние задано явно: обычное,
 * посещённое, наведение, фокус с клавиатуры, нажатие и заблокированное.
 * ────────────────────────────────────────────────────────────────────── */

/* главная кнопка */
.ss-btn--pri,
.ss-btn--pri:visited,
a.ss-btn--pri:visited{background:var(--ss-accent);border-color:var(--ss-accent);color:#fff}
.ss-btn--pri:hover,
.ss-btn--pri:focus,
.ss-btn--pri:active{background:var(--ss-accent-dk);border-color:var(--ss-accent-dk);color:#fff}
.ss-btn--pri:active{transform:translateY(1px)}

/* второстепенная кнопка */
.ss-btn--sec,
.ss-btn--sec:visited,
a.ss-btn--sec:visited{background:#fff;border-color:var(--ss-line);color:var(--ss-ink)}
.ss-btn--sec:hover,
.ss-btn--sec:focus{background:var(--ss-accent-sf);border-color:var(--ss-accent);color:var(--ss-accent-dk)}
.ss-btn--sec:active{background:#fff;transform:translateY(1px)}

/* кнопки WooCommerce: в корзину, оформить заказ, применить купон */
.woocommerce a.button,
.woocommerce a.button:visited,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .button.alt,
.woocommerce a.checkout-button,
.woocommerce #place_order,
.wc-block-components-button{background:var(--ss-accent)!important;border:1px solid var(--ss-accent)!important;
  color:#fff!important;border-radius:var(--ss-radius)}
.woocommerce a.button:hover,
.woocommerce a.button:focus,
.woocommerce a.button:active,
.woocommerce button.button:hover,
.woocommerce button.button:focus,
.woocommerce input.button:hover,
.woocommerce .button.alt:hover,
.woocommerce a.checkout-button:hover,
.woocommerce #place_order:hover,
.wc-block-components-button:hover{background:var(--ss-accent-dk)!important;border-color:var(--ss-accent-dk)!important;
  color:#fff!important}
.woocommerce .button:active,
.woocommerce button.button:active{transform:translateY(1px)}

/* заблокированная кнопка: гасим цвет, но держим читаемый текст */
.woocommerce .button:disabled,
.woocommerce .button[disabled],
.woocommerce .button.disabled,
.ss-btn[aria-disabled="true"]{background:#eef1f6!important;border-color:#dfe5ee!important;color:#6b7686!important;
  cursor:not-allowed;transform:none}

/* «в корзину» на карточке витрины */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .button:visited{background:var(--ss-accent)!important;
  border-color:var(--ss-accent)!important;color:#fff!important}
.woocommerce ul.products li.product .button:hover{background:var(--ss-accent-dk)!important;
  border-color:var(--ss-accent-dk)!important;color:#fff!important}

/* «плюс/минус» у количества */
.woocommerce .botiga-quantity-plus:hover,
.woocommerce .botiga-quantity-minus:hover{background:var(--ss-accent)!important;color:#fff!important;
  border-color:var(--ss-accent)!important}

/* ссылки в тексте — тоже переопределяем visited и добавляем наведение */
.ss-cat-body a:visited,
.entry-content a:visited,
.woocommerce-Tabs-panel a:visited{color:var(--ss-accent-dk)}
.ss-cat-body a:hover,
.entry-content a:hover,
.woocommerce-Tabs-panel a:hover{color:var(--ss-accent)}

/* видимый фокус с клавиатуры вместо точечной обводки Botiga */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.ss-btn:focus-visible{outline:2px solid var(--ss-accent);outline-offset:2px;border-radius:4px}
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
.ss-btn:focus:not(:focus-visible){outline:none}

/* ── мобильная шапка: закреплена при прокрутке, поля между иконками ───── */
@media (max-width:991px){
  /* Botiga сама ставит шапке position:fixed и компенсирует её высоту
     отступом у body — нам остаётся фон, граница и тень при прокрутке. */
  .bhfb-mobile.has-sticky-header{background:#fff;border-bottom:1px solid var(--ss-line)}
  .bhfb-mobile.has-sticky-header.sticky-shadow{box-shadow:0 1px 10px rgba(14,20,32,.07)}

  /* компактный ряд: 44px тач-зоны у иконок задают высоту шапки */
  .bhfb-mobile .bhfb-row-wrapper{padding:6px 0}
  .bhfb-mobile .bhfb-row,
  .bhfb-mobile .bhfb-row-wrapper{min-height:0}
  .bhfb-mobile .bhfb-column-3{display:flex;align-items:center;justify-content:flex-end;gap:6px}
  .bhfb-mobile .bhfb-component-mobile_hamburger{margin:0!important}
  .bhfb-mobile .site-header-cart{margin:0}
  .bhfb-mobile .site-header-cart .cart-contents,
  .bhfb-mobile .menu-toggle{display:flex;align-items:center;justify-content:center;
    width:44px;height:44px;position:relative}
  .bhfb-mobile .site-header-cart .count-number{top:4px;right:2px}

  /* Botiga компенсирует фиксированную шапку отступом body, но берёт высоту
     ДЕСКТОПНОЙ шапки (101px) — на мобильном это лишние 43px пустоты над
     контентом. Держим отступ и шапку от одной величины. */
  :root{--ss-mhead:58px}
  body.sticky-header-active{padding-top:var(--ss-mhead)!important}
  .bhfb-mobile.has-sticky-header{min-height:var(--ss-mhead)}
}

/* ─────────────────────────────────────────────────────────────────────────
 * Логотип: знак + название
 * ────────────────────────────────────────────────────────────────────── */
.site-branding{display:flex;align-items:center;gap:11px}
.site-branding .custom-logo-link{display:flex;align-items:center;line-height:0}
.site-branding .custom-logo{width:32px;height:32px;border-radius:9px;display:block}
.site-branding .site-title{margin:0}
.bhfb-mobile .site-branding{gap:9px}
.bhfb-mobile .site-branding .custom-logo{width:28px;height:28px;border-radius:8px}

/* ─────────────────────────────────────────────────────────────────────────
 * Главное меню
 *
 * Botiga открывает подменю классом .hovered, который её скрипт вешает
 * с задержкой 300 мс, и анимирует ещё 300 мс — вместе это ощущается как
 * залипание. Открываем на чистом CSS по :hover и :focus-within (клавиатура),
 * за 130 мс; класс темы оставляем как запасной путь. Закрытие — с короткой
 * задержкой, чтобы подменю не пропадало при диагональном движении мыши.
 * ────────────────────────────────────────────────────────────────────── */
.bhfb-desktop .menu-main-container > ul{display:flex;align-items:center;gap:4px}
/* Botiga разносит пункты margin-right:35px — с собственными полями пункта
   это давало 37px дыры; расстояние держим одним свойством gap. */
.bhfb-desktop .menu-main-container > ul > li{position:relative;margin:0;border-radius:9px;
  display:flex;align-items:center;
  transition:background-color .13s ease}
.bhfb-desktop .menu-main-container > ul > li:hover,
.bhfb-desktop .menu-main-container > ul > li:focus-within{background:var(--ss-soft)}

/* пункт верхнего уровня */
.bhfb-desktop .menu-main-container > ul > li > a,
.bhfb-desktop .menu-main-container > ul > li > .ss-menu-label{
  display:inline-flex;align-items:center;padding:9px 4px 9px 12px;
  font-size:.9375rem;font-weight:500;color:var(--ss-ink);line-height:1.2;
  transition:color .13s ease;cursor:pointer;background:none}
.bhfb-desktop .menu-main-container > ul > li:not(.menu-item-has-children) > a{padding-right:12px}
.bhfb-desktop .menu-main-container > ul > li:hover > a,
.bhfb-desktop .menu-main-container > ul > li:hover > .ss-menu-label,
.bhfb-desktop .menu-main-container > ul > li:focus-within > a,
.bhfb-desktop .menu-main-container > ul > li:focus-within > .ss-menu-label{color:var(--ss-accent-dk)}

/* текущий раздел */
.bhfb-desktop .menu-main-container > ul > li.current-menu-item,
.bhfb-desktop .menu-main-container > ul > li.current-menu-ancestor,
.bhfb-desktop .menu-main-container > ul > li.current-menu-parent{background:var(--ss-accent-sf)}
.bhfb-desktop .menu-main-container > ul > li.current-menu-item > a,
.bhfb-desktop .menu-main-container > ul > li.current-menu-ancestor > a,
.bhfb-desktop .menu-main-container > ul > li.current-menu-parent > a{color:var(--ss-accent-dk)}

/* Шеврон. Поворачиваем САМУ иконку, а не её коробку: раньше у коробки
   был асимметричный padding (справа 12px, слева 0) плюс margin-left:8px от темы,
   и rotate(180deg) вокруг центра коробки перекидывал стрелку в правый верхний угол
   пункта (замер: +15,8px вправо и −4,2px вверх в момент раскрытия). Квадратная
   коробка + поворот svg дают вращение строго вокруг своего центра. */
.bhfb-desktop .menu-main-container .dropdown-symbol{display:inline-flex;align-items:center;
  justify-content:center;width:16px;height:16px;margin:0 8px 0 0!important;padding:0;
  color:var(--ss-ink-2);cursor:pointer;transition:color .13s ease}
.bhfb-desktop .menu-main-container .dropdown-symbol svg{width:9px;height:9px;fill:currentColor;
  display:block;transition:transform .15s ease}
/* внутри шеврона тема держит обёртку <i>: без этого правила иконка
   садится на базовую линию строки и стоит на ~3px выше центра пункта */
.bhfb-desktop .menu-main-container .dropdown-symbol > i{
  display:flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:0}
.bhfb-desktop .menu-main-container > ul > li:hover > .dropdown-symbol,
.bhfb-desktop .menu-main-container > ul > li:focus-within > .dropdown-symbol{color:var(--ss-accent-dk)}
.bhfb-desktop .menu-main-container > ul > li:hover > .dropdown-symbol svg,
.bhfb-desktop .menu-main-container > ul > li:focus-within > .dropdown-symbol svg{transform:rotate(180deg)}

/* выпадающее меню */
.bhfb-desktop .menu-main-container .sub-menu{
  position:absolute;top:calc(100% + 9px);left:0;min-width:214px;margin:0;padding:6px;
  background:#fff;border:1px solid var(--ss-line);border-radius:12px;
  box-shadow:0 10px 30px rgba(14,20,32,.10),0 2px 6px rgba(14,20,32,.05);
  opacity:0;visibility:hidden;transform:translateY(5px);
  transition:opacity .13s ease,transform .13s ease,visibility 0s linear .22s;
  z-index:120}
/* «мост» до подменю: курсор по пути вниз не покидает пункт */
.bhfb-desktop .menu-main-container .sub-menu::before{
  content:"";position:absolute;top:-11px;left:0;right:0;height:11px}
.bhfb-desktop .menu-main-container > ul > li:hover > .sub-menu,
.bhfb-desktop .menu-main-container > ul > li:focus-within > .sub-menu,
.bhfb-desktop .menu-main-container > ul > li.hovered > .sub-menu{
  opacity:1;visibility:visible;transform:none;transition-delay:0s}

.bhfb-desktop .menu-main-container .sub-menu li{width:100%}
.bhfb-desktop .menu-main-container .sub-menu a{
  display:block;padding:8px 12px;border-radius:8px;font-size:.875rem;font-weight:500;
  color:var(--ss-ink);white-space:nowrap;transition:background-color .1s ease,color .1s ease}
.bhfb-desktop .menu-main-container .sub-menu a:hover,
.bhfb-desktop .menu-main-container .sub-menu a:focus-visible{
  background:var(--ss-accent-sf);color:var(--ss-accent-dk)}
.bhfb-desktop .menu-main-container .sub-menu li.current-menu-item > a{
  color:var(--ss-accent-dk);background:var(--ss-accent-sf)}

/* у последнего пункта подменю прижимаем к правому краю, чтобы не выходило за экран */
.bhfb-desktop .menu-main-container > ul > li:last-child > .sub-menu{left:auto;right:0}

/* уважаем системную настройку «меньше движения» */
@media (prefers-reduced-motion:reduce){
  .bhfb-desktop .menu-main-container .sub-menu{transition-duration:0s}
  .bhfb-desktop .menu-main-container .dropdown-symbol svg{transition-duration:0s}
}

/* ─────────────────────────────────────────────────────────────────────────
 * Мобильное меню (выдвижная панель)
 *
 * Пункты-родители у нас выводятся как <span> (ссылки в никуда заменены
 * подписями), поэтому без выравнивания они выглядели иначе, чем обычные
 * пункты-ссылки: разный отступ, стрелка вплотную к тексту. Приводим строки
 * к одному виду, даём тап-зону и разделители.
 * ────────────────────────────────────────────────────────────────────── */
.botiga-offcanvas-menu .menu{padding:4px 0 0}
.botiga-offcanvas-menu .menu > li{border-bottom:1px solid var(--ss-line)}
.botiga-offcanvas-menu .menu > li:last-child{border-bottom:0}
.botiga-offcanvas-menu .menu > li > a,
.botiga-offcanvas-menu .menu > li > .ss-menu-label{
  display:flex;align-items:center;min-height:48px;padding:12px 18px;margin:0;
  font-size:.9375rem;font-weight:600;color:var(--ss-ink);cursor:pointer}
.botiga-offcanvas-menu .menu > li > .dropdown-symbol{
  position:absolute;top:0;right:0;display:flex;align-items:center;justify-content:center;
  width:52px;height:48px;margin:0;padding:0;color:var(--ss-ink-2);
  transition:transform .18s ease}
.botiga-offcanvas-menu .menu > li{position:relative}
.botiga-offcanvas-menu .menu > li > .dropdown-symbol svg{width:11px;height:11px;fill:currentColor}
/* раскрытое состояние Botiga помечает классом .toggled на самом подменю */
.botiga-offcanvas-menu .menu > li:has(> .sub-menu.toggled) > .dropdown-symbol{
  transform:rotate(180deg);color:var(--ss-accent-dk)}
.botiga-offcanvas-menu .menu > li:has(> .sub-menu.toggled) > a,
.botiga-offcanvas-menu .menu > li:has(> .sub-menu.toggled) > .ss-menu-label{color:var(--ss-accent-dk)}

/* подпункты */
.botiga-offcanvas-menu .sub-menu{padding:0 0 8px;background:var(--ss-soft)}
.botiga-offcanvas-menu .sub-menu a{
  display:flex;align-items:center;min-height:44px;padding:10px 18px 10px 30px;
  font-size:.9375rem;font-weight:400;color:var(--ss-ink-2)}
.botiga-offcanvas-menu .sub-menu a:hover,
.botiga-offcanvas-menu .sub-menu a:focus-visible{color:var(--ss-accent-dk)}
.botiga-offcanvas-menu .sub-menu li.current-menu-item > a{color:var(--ss-accent-dk);font-weight:600}
.botiga-offcanvas-menu .menu > li.current-menu-ancestor > a,
.botiga-offcanvas-menu .menu > li.current-menu-item > a{color:var(--ss-accent-dk)}
/* у пунктов-ссылок padding приходит из правила темы с более высокой
   специфичностью — выравниваем строки принудительно */
.botiga-offcanvas-menu .menu > li > a{padding:12px 18px!important}
.botiga-offcanvas-menu .sub-menu a{padding:10px 18px 10px 30px!important}
/* первый пункт не должен подлезать под крестик закрытия */
.botiga-offcanvas-menu .bhfb-mobile-offcanvas-rows{padding-top:52px}

/* ─────────────────────────────────────────────────────────────────────────
 * Мобильные тап-зоны (замер 19.09.2026, ширины 320/360/390)
 *
 * Горизонтального переполнения на сайте нет ни на одной ширине, но три
 * элемента управления оказались меньше 44px — минимального размера, при
 * котором палец попадает уверенно: крестик мобильного меню 30×30,
 * ссылка-знак логотипа 28×28 и лупа увеличения на карточке товара 18×27.
 * Размеры самих иконок не меняем — расширяем только область нажатия.
 * ────────────────────────────────────────────────────────────────────── */
.botiga-offcanvas-menu .mobile-menu-close{
  display:flex!important;align-items:center;justify-content:center;
  width:44px!important;height:44px!important;top:18px!important;right:18px!important}

.site-branding .custom-logo-link{display:flex;align-items:center;min-height:44px}

.woocommerce-product-gallery__trigger{
  display:flex!important;align-items:center;justify-content:center;
  width:44px;height:44px;top:8px!important;right:6px!important;
  font-size:1.0625rem;line-height:1}

/* «Add coupons» в корзине и оформлении — строка высотой 20px */
.wc-block-components-panel__button{min-height:44px;display:flex;align-items:center}

/* Корзина: у блоков WooCommerce кнопки «−/+» 30×30, «удалить» 24×24 —
   мимо таких промахиваешься пальцем. Высоту доводим до 44, ширину «−/+»
   до 40 (шире строка не позволяет: 40+45+40 = 125px внутри 360px). */
.wc-block-components-quantity-selector{min-height:44px}
.wc-block-components-quantity-selector__button{width:40px!important;height:44px!important}
.wc-block-components-quantity-selector__input{min-height:44px}
.wc-block-cart-item__remove-link{
  display:inline-flex!important;align-items:center;justify-content:center;
  min-width:44px;min-height:44px;margin-left:-10px}

/* На мобильной ширине блоки WooCommerce ставят корзине word-break:break-all,
   и слова рвутся посреди букв («malt» → «mal|t»). Переносим по словам;
   ломаем только то, что иначе не влезет (длинные артикулы, ссылки). */
.wc-block-components-product-name,
.wc-block-components-product-metadata,
.wc-block-components-product-metadata__description,
.wc-block-cart-item__wrap,
.wc-block-components-product-metadata p{word-break:normal!important;overflow-wrap:anywhere}
