/* ═══ RR-REDESIGN v1 (31.08.2026) — суто візуальний скін поверх теми coloring.
   Не змінює розмітку/логіку/URL. Єдине приховування: #account-bar
   (кнопки Кабінет/Бажання/Порівняння в шапці — рішення власника; сторінки живі).
   ВІДКАТ: прибрати <link rr-redesign.css> з header.tpl (source + modification)
   або tar xzf /home/radio/redesign_rollback_20260831.tar.gz -C /home/radio/public_html ═══ */
:root{
  --rr-bg:#F6F9FC; --rr-ink:#263248; --rr-soft:#596272;
  --rr-blue:#1873CC; --rr-blue-deep:#126BC0; --rr-tint:#EAF3FC;
  --rr-orange:#F08030; --rr-orange-deep:#D96B14; --rr-orange-tint:#FEF1E4;
  --rr-line:#E3E9F2;
  --rr-warm:linear-gradient(90deg, rgb(251,138,138) 0%, rgb(253,200,78) 100%);
  --rr-warm-h:linear-gradient(90deg, rgb(244,120,120) 0%, rgb(248,188,56) 100%);
}
body{background:var(--rr-bg); color:var(--rr-ink)}

/* ── шапка ── */
header #top{border-bottom:1px solid var(--rr-line)}
#header-menu a.btn:hover span{color:var(--rr-orange-deep)}
#account-bar{display:none !important}

/* смуга меню+пошук: з темної у світлу фірмову */
.menu-background{background:#fff !important; border-bottom:1px solid var(--rr-line); box-shadow:0 4px 14px rgba(38,50,72,.05)}
#menu .btn-menu{background:var(--rr-blue) !important; color:#fff !important; border-radius:10px; font-weight:700}
#menu .btn-menu:hover{background:var(--rr-orange) !important}
#menu-list{border:1px solid var(--rr-line); border-radius:0 0 12px 12px; box-shadow:0 14px 30px rgba(38,50,72,.14)}
#menu-list > li > a{color:var(--rr-ink)}
#menu-list > li > a:hover{color:var(--rr-orange-deep)}
.child-box{box-shadow:0 14px 30px rgba(38,50,72,.10)}
.child-box .h5 a:hover{color:var(--rr-orange-deep) !important}
#search .form-control{border:2px solid var(--rr-blue); background:#fff; color:var(--rr-ink); border-radius:10px 0 0 10px; box-shadow:none; height:42px}
#search .form-control:focus{border-color:var(--rr-orange)}
#search .input-group-btn .btn{background:var(--rr-blue); color:#fff; border:2px solid var(--rr-blue); border-left:0; border-radius:0 10px 10px 0; height:42px}
#search .input-group-btn .btn:hover{background:var(--rr-orange); border-color:var(--rr-orange)}
#cart > .btn{background:var(--rr-tint) !important; color:var(--rr-blue-deep) !important; border:0; border-radius:10px; font-weight:700}
#cart > .btn:hover{background:var(--rr-orange) !important; color:#fff !important}
#cart > .btn:hover b{color:#fff}
#open-menu{color:var(--rr-blue-deep)}

/* ── картки товарів ── */
.product-thumb{border:1px solid var(--rr-line); border-radius:12px; overflow:hidden; background:#fff;
  box-shadow:0 2px 10px rgba(38,50,72,.05); transition:box-shadow .15s}
.product-thumb:hover{box-shadow:0 8px 20px rgba(38,50,72,.14)}
.product-thumb .caption .name a{color:var(--rr-ink); font-weight:600}
.product-thumb .caption .name a:hover{color:var(--rr-orange-deep)}
.product-thumb .price{color:var(--rr-ink); font-weight:800}

/* кнопки «Купити»: фірмовий теплий градієнт (як кнопка на оформленні) */
.product-thumb .addtocart .btn-primary, .product-thumb .btn-primary[onclick*="cart.add"],
#button-cart{
  background:var(--rr-warm) !important; color:#263248 !important; border:0 !important;
  font-weight:700; border-radius:9px; text-shadow:none}
.product-thumb .addtocart .btn-primary:hover, .product-thumb .btn-primary[onclick*="cart.add"]:hover,
#button-cart:hover{background:var(--rr-warm-h) !important}

/* ── заголовки, крихти, пагінація ── */
#content h1, #content h2, #content h3{color:var(--rr-ink); letter-spacing:-.01em; font-weight:800}
.breadcrumb{background:transparent}
.breadcrumb a{color:var(--rr-soft)}
.breadcrumb a:hover{color:var(--rr-orange-deep)}
.pagination > li > a, .pagination > li > span{border:1px solid var(--rr-line); color:var(--rr-ink); border-radius:9px !important; margin:0 3px}
.pagination > .active > span, .pagination > .active > a{background:var(--rr-blue) !important; border-color:var(--rr-blue) !important}
.pagination > li > a:hover{border-color:var(--rr-orange); color:var(--rr-orange-deep); background:#fff}

/* плитки підкатегорій */
.thumbnail.subcategory{border:1px solid var(--rr-line); border-radius:12px; transition:border-color .15s}
.thumbnail.subcategory:hover{border-color:var(--rr-orange)}

/* ── футер: фірмовий темно-синій ── */
footer{background:var(--rr-ink) !important; color:#C7D0DE}
footer h5, footer h5 span{color:#fff !important}
footer a{color:#C7D0DE}
footer a:hover{color:#fff}

/* ── v2: точні селектори кнопок ── */
/* «Купити» в плитках (btn-addtocart = основна + стрілка dropup) — фірмовий градієнт */
.btn-addtocart{background:var(--rr-warm) !important; color:#263248 !important; border:0 !important; font-weight:700; text-shadow:none}
.btn-addtocart:hover, .btn-addtocart:focus{background:var(--rr-warm-h) !important; color:#263248 !important}
/* лічильник кошика в шапці: читабельний на світлій плашці (не чіпаємо кнопки модалки всередині #cart) */
#cart > .btn-primary, #cart > .btn-primary #cart-total, #cart > .btn-primary #cart-total *{color:var(--rr-blue-deep) !important}
#cart > .btn-primary:hover, #cart > .btn-primary:hover #cart-total, #cart > .btn-primary:hover #cart-total *{color:#fff !important}

/* ── v3: мобільна шапка ── */
/* бургер: світла плашка + синя іконка (іконка була невидима синім по синьому) */
#open-menu{background:var(--rr-tint) !important; color:var(--rr-blue-deep) !important; border:0; border-radius:10px}
#open-menu i{color:var(--rr-blue-deep) !important}
/* іконка кошика в шапці — того ж кольору, що й текст лічильника */
#cart > .btn-primary i{color:var(--rr-blue-deep) !important}
#cart > .btn-primary:hover i{color:#fff !important}

/* ── v4: іконка кошика (малюється псевдоелементом) + бейдж ── */
#cart > .btn-primary, #cart > .btn-primary *,
#cart > .btn-primary:before, #cart > .btn-primary *:before{color:var(--rr-blue-deep) !important}
#cart > .btn-primary:hover, #cart > .btn-primary:hover *,
#cart > .btn-primary:hover:before, #cart > .btn-primary:hover *:before{color:#fff !important}
#cart .badge, .cart-box .badge{background:var(--rr-blue) !important; color:#fff !important}

/* ── v5: іконка кошика = ::before на самій кнопці (подвійні двокрапки) ── */
#cart > .btn::before{color:var(--rr-blue-deep) !important}
#cart:hover > .btn::before{color:#fff !important}
/* мобільний бейдж-кружок лічильника */
#cart > button.btn #cart-total{background:var(--rr-blue) !important}
#cart > button.btn #cart-total .products b{color:#fff !important}

/* ── v6: квадратик кошика — білий SVG на фірмовому синьому (був блідий градієнт) ── */
#cart > .btn::before{
  background:url("/catalog/view/theme/coloring/image/cart.svg"), linear-gradient(-90deg, var(--rr-blue) 0%, var(--rr-blue-deep) 100%) !important;
  background-position:center !important; background-repeat:no-repeat !important; border-radius:10px}
#cart:hover > .btn::before{
  background:url("/catalog/view/theme/coloring/image/cart.svg"), linear-gradient(-90deg, var(--rr-orange) 0%, var(--rr-orange-deep) 100%) !important;
  background-position:center !important; background-repeat:no-repeat !important}

/* ── v7: головна за погодженим макетом (hero, банери, сітка категорій) ── */
.rr-wrap{max-width:1160px;margin:0 auto;padding:0 20px}
.rr-hero{background:linear-gradient(180deg,#FFFFFF 0%, var(--rr-tint) 100%);border-bottom:1px solid var(--rr-line)}
.rr-hero .rr-wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:30px;padding:44px 20px 40px;align-items:center}
.rr-kicker{display:inline-block;background:var(--rr-orange-tint);color:var(--rr-orange-deep);font-size:12px;letter-spacing:.1em;padding:5px 12px;border-radius:99px;text-transform:uppercase;font-weight:700}
.rr-hero h1{font-size:clamp(28px,4.3vw,44px);line-height:1.08;margin:14px 0 10px;font-weight:800;color:var(--rr-ink);letter-spacing:-.01em}
.rr-hero h1 .rr-accent{color:var(--rr-orange-deep)}
.rr-hero p{max-width:52ch;color:var(--rr-soft);margin:0 0 22px;font-size:15.5px}
.rr-btn{display:inline-block;border-radius:10px;padding:12px 22px;font-weight:700;background:var(--rr-warm);color:#263248 !important;box-shadow:0 6px 16px rgba(253,170,90,.35);text-decoration:none !important}
.rr-btn:hover{background:var(--rr-warm-h)}
.rr-btn.rr-ghost{background:#fff;color:var(--rr-blue-deep) !important;border:1.5px solid var(--rr-blue);box-shadow:none;margin-left:10px}
.rr-waves{justify-self:center}
.rr-sec{padding:34px 0 6px}
.rr-sec-head{display:flex;align-items:baseline;gap:14px;margin-bottom:18px}
.rr-sec-head h2{font-size:23px;margin:0;font-weight:800;color:var(--rr-ink)}
.rr-sec-head .rr-rule{flex:1;border-top:1px solid var(--rr-line)}
.rr-banners{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.rr-banner{border-radius:14px;background:#fff;border:1px solid var(--rr-line);box-shadow:0 2px 10px rgba(38,50,72,.06);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .15s,transform .15s;text-decoration:none !important}
.rr-banner:hover{box-shadow:0 8px 22px rgba(240,128,48,.20);transform:translateY(-2px)}
.rr-banner .rr-art{height:110px;display:grid;place-items:center}
.rr-b1 .rr-art{background:linear-gradient(135deg,#DDEBFA,#F2F8FF)} .rr-b2 .rr-art{background:linear-gradient(135deg,#E2F3F5,#F2FBFC)}
.rr-b3 .rr-art{background:linear-gradient(135deg,#F1EBFB,#F9F6FE)} .rr-b4 .rr-art{background:linear-gradient(135deg,#E6F5EA,#F4FBF6)}
.rr-banner .rr-txt{padding:13px 16px 15px}
.rr-banner h3{margin:0 0 4px;font-size:16px;color:var(--rr-ink);font-weight:700}
.rr-banner p{margin:0;font-size:13.5px;color:var(--rr-soft)}
.rr-banner .rr-tag{display:inline-block;margin-top:8px;font-size:12.5px;font-weight:700;color:var(--rr-orange-deep)}
.rr-cats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rr-cat{border-radius:12px;background:#fff;border:1px solid var(--rr-line);padding:16px 17px;transition:border-color .12s,box-shadow .15s;text-decoration:none !important;display:block}
.rr-cat:hover{border-color:var(--rr-orange);box-shadow:0 4px 14px rgba(240,128,48,.16)}
.rr-cat:hover h3{color:var(--rr-orange-deep)}
.rr-cat h3{margin:0 0 6px;font-size:16px;display:flex;justify-content:space-between;gap:8px;color:var(--rr-blue-deep);font-weight:700}
.rr-cat h3 .rr-n{font-size:12px;color:var(--rr-soft);font-weight:500;white-space:nowrap}
.rr-cat p{margin:0;font-size:13.6px;color:var(--rr-soft)}
@media (max-width:960px){.rr-banners{grid-template-columns:repeat(2,1fr)}.rr-cats-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:840px){.rr-hero .rr-wrap{grid-template-columns:1fr}.rr-waves{display:none}}
@media (max-width:560px){
  .rr-hero .rr-wrap{padding:26px 20px 22px}
  .rr-banners{grid-template-columns:1fr;gap:10px}
  .rr-banner{flex-direction:row;align-items:stretch}
  .rr-banner .rr-art{height:auto;width:92px;flex:0 0 92px}
  .rr-banner .rr-art svg{width:46px;height:auto}
  .rr-banner .rr-txt{padding:11px 13px;flex:1;min-width:0}
  .rr-cats-grid{grid-template-columns:1fr;gap:10px}
  .rr-btn{display:block;text-align:center;margin:0 0 9px}
  .rr-btn.rr-ghost{margin-left:0}
  .rr-sec{padding:26px 0 4px}
  .rr-sec-head h2{font-size:19px}
}

/* ── v8: кружок лічильника — ТІЛЬКИ мобільний (на десктопі фарбував текст синім по синьому) ── */
@media (min-width:992px){
  #cart > button.btn #cart-total{background:transparent !important}
}
@media (max-width:991px){
  #cart > button.btn #cart-total{background:var(--rr-blue) !important}
  #cart > button.btn #cart-total .products b{color:#fff !important}
}
/* v9: цифра лічильника на десктопі — синя (v5 фарбувала білим глобально) */
@media (min-width:992px){
  #cart > button.btn #cart-total .products b, #cart > .btn-primary #cart-total b{color:var(--rr-blue-deep) !important}
  #cart:hover > .btn-primary #cart-total b{color:#fff !important}
}

/* ══ v10: структура як у погодженому макеті ══ */
/* верхня смужка прихована (Акції/Контакти/Про нас лишаються у футері та меню) */
header #top{display:none !important}

/* верхній рядок: лого | пошук | кошик | мова */
@media (min-width:992px){
  .logo-line{display:flex; align-items:center; padding:10px 0}
  .logo-line > div{float:none}
  .logo-line #logo img{max-height:54px; width:auto}
  .rr-top-search #search .form-control{height:44px}
  .rr-top-search #search .input-group-btn .btn{height:44px}
  .rr-top-cart #cart{margin:0; width:100%}
  .rr-top-lang .curlang{white-space:nowrap}
}

/* ── горизонтальна смуга категорій з випадайками (як nav.cats у макеті) ── */
@media (min-width:992px){
  .menu-background .menu-line .menu-box{width:100%}
  #menu .btn-menu{display:none}
  #menu-list{display:flex !important; position:static; flex-wrap:wrap; gap:2px; border:0; box-shadow:none;
    background:transparent; padding:0; margin:0; width:100%; float:none; border-radius:0}
  #menu-list > li{position:relative; float:none; list-style:none}
  #menu-list > li > a{display:flex; align-items:center; padding:0 11px; height:44px; font-size:13.6px; font-weight:600;
    color:var(--rr-ink); border-bottom:3px solid transparent; cursor:pointer; white-space:nowrap; margin:0}
  #menu-list > li:hover > a{color:var(--rr-orange-deep); border-bottom-color:var(--rr-orange); background:transparent}
  #menu-list .toggle-child{display:none !important}
  #menu-list > li > a .arrow{display:none}
  #menu-list > li > a .mobilink{display:none}
  #menu-list > li .child-box{display:none; position:absolute; top:100%; left:0; z-index:1000; min-width:280px;
    max-height:72vh; overflow-y:auto; background:#fff; border:1px solid var(--rr-line); border-radius:0 0 12px 12px;
    box-shadow:0 14px 30px rgba(38,50,72,.14); padding:8px 0; margin:0}
  #menu-list > li:hover .child-box{display:block}
  #menu-list .child-box .row{margin:0}
  #menu-list .child-box .row > div{width:100% !important; float:none; padding:0}
  #menu-list .child-box .row > .clearfix{display:none}
  #menu-list .child-box .child-box-cell{padding:0}
  #menu-list .child-box .h5{margin:0; padding:0}
  #menu-list .child-box .h5 a{display:block; padding:9px 18px; font-size:14px; color:var(--rr-ink); font-weight:600}
  #menu-list .child-box .h5 a:hover{color:var(--rr-orange-deep); background:var(--rr-orange-tint)}
  #menu-list .child2-box{list-style:none; padding:0; margin:0}
  #menu-list .child2-box li a{display:block; padding:7px 18px 7px 30px; font-size:13.2px; color:var(--rr-soft)}
  #menu-list .child2-box li a:hover{color:var(--rr-orange-deep)}
  #menu-list .child2-box .livel-down{color:var(--rr-orange); margin-right:4px; display:inline}
  #menu-list .toggle-child2{display:none}
  #menu-list .see-all-categories{border-top:1px solid var(--rr-line); margin-top:6px}
  #menu-list .see-all-categories a{display:block; padding:10px 18px; font-weight:700; color:var(--rr-blue-deep); font-size:13.5px}
  #menu-list .see-all-categories a:hover{color:var(--rr-orange-deep)}
}

/* ── футер: видимі лінки на темному + платіжки ── */
footer .footer-box h5, footer .footer-box h5 span{color:#fff !important; font-size:15px}
footer .footer-box ul li a, footer .footer-box a{color:#C7D0DE !important; font-size:13.8px}
footer .footer-box ul li a:hover{color:#fff !important}
footer .footer-box ul li{margin-bottom:7px}
footer .end{background:#1E2839 !important; border-top:1px solid #3A4763; padding:14px 0}
footer .end p, footer .end{color:#93A1B8 !important}
footer .pay-icons{margin:0}
footer .pay-icons li{background:#fff; border-radius:6px; padding:4px 10px; display:inline-block; margin-left:8px; height:28px; vertical-align:middle}
footer .pay-icons img{height:18px; width:auto; display:block}
#scroll-top-button{background:var(--rr-blue); color:#fff; border-radius:10px}
#scroll-top-button:hover{background:var(--rr-orange)}

/* ── кошик: попап праворуч (десктоп) / нижній аркуш (мобільний) — як у макеті ── */
#modal-cart .modal-content{border-radius:14px; border:1px solid var(--rr-line); box-shadow:0 16px 40px rgba(38,50,72,.22)}
#modal-cart .modal-header{border-bottom:1px solid var(--rr-line)}
@media (min-width:992px){
  #modal-cart .modal-dialog{position:absolute; top:64px; right:20px; left:auto; margin:0; width:380px}
}
@media (min-width:1200px){
  #modal-cart .modal-dialog{right:calc((100vw - 1140px)/2)}
}
@media (max-width:991px){
  #modal-cart .modal-dialog{position:fixed; left:10px; right:10px; bottom:calc(10px + env(safe-area-inset-bottom)); top:auto; margin:0; width:auto}
  #modal-cart .modal-content{max-height:calc(100vh - 80px); overflow-y:auto}
}
#modal-cart .modal-footer .btn-primary{background:var(--rr-warm) !important; color:#263248 !important; border:0; font-weight:700; border-radius:10px}
#modal-cart .modal-footer .btn-primary:hover{background:var(--rr-warm-h) !important}

/* ── плитки підкатегорій: чипи без порожніх картинок ── */
.thumbnail.subcategory{border:1px solid var(--rr-line); border-radius:99px; padding:9px 16px; box-shadow:none; margin-bottom:10px}
.thumbnail.subcategory .image{display:none}
.thumbnail.subcategory .name-wrapper{font-size:13.5px; font-weight:600; color:var(--rr-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.thumbnail.subcategory:hover{border-color:var(--rr-orange)}
.thumbnail.subcategory:hover .name-wrapper{color:var(--rr-orange-deep)}

/* v11: чистка смуги категорій (стрілки, відступи теми) */
@media (min-width:992px){
  .menu-background{padding:0}
  .menu-background .menu-line{margin:0}
  .menu-background .menu-line .menu-box{padding:0 15px}
  #menu{margin:0; width:100%}
  #menu-list > li{margin:0 !important; padding:0 !important; width:auto; height:auto; border:0; background:transparent; display:block}
  #menu-list > li > a{height:42px !important; margin:0 !important; line-height:1.2}
  #menu-list .arrow{display:none !important}
  #menu-list .peace-icon, #menu-list .hover-icon{display:none !important}
  #menu-list .livel-down.hidden-md{display:none !important}
}
/* v12: тема ставила li min-height 112px — скидаємо, смуга стає компактною */
@media (min-width:992px){
  #menu #menu-list > li{min-height:0 !important; height:auto !important; max-height:none !important}
  #menu #menu-list > li + li{border-top:0 !important}
}
/* v13: тема давала #menu-list фіксовану висоту (350px) — флекс розтягував рядки */
@media (min-width:992px){
  #menu #menu-list{height:auto !important; min-height:0 !important; max-height:none !important; align-content:flex-start}
}
/* v14: кнопки модалки кошика — «Оформити» градієнтом, «Назад» охайним привидом */
#modal-cart .order-button, #modal-cart .modal-footer .btn-danger{
  background:var(--rr-warm) !important; color:#263248 !important; border:0 !important;
  font-weight:700; border-radius:10px; text-shadow:none}
#modal-cart .order-button:hover{background:var(--rr-warm-h) !important}
#modal-cart .modal-footer .btn-default{border:1.5px solid var(--rr-line); border-radius:10px; color:var(--rr-ink)}
#modal-cart .modal-footer .btn-default:hover{border-color:var(--rr-orange); color:var(--rr-orange-deep); background:#fff}
#modal-cart .modal-title{color:var(--rr-ink); font-weight:800}

/* ══ v15 ══ */
/* кошик: жодних чорних кутів у hover/focus/active/open — один радіус і фон у всіх станах */
#cart > .btn, #cart > .btn:hover, #cart > .btn:focus, #cart > .btn:active,
#cart.open > .btn, #cart > .btn:active:focus{
  border-radius:10px !important; outline:0 !important; box-shadow:none !important;
  border:0 !important; background-image:none}
#cart > .btn:hover, #cart.open > .btn{background:var(--rr-orange) !important}
#cart-total .fa-shopping-cart{display:none} /* ajax-іконка дублює квадратик зліва */
@media (min-width:992px){
  #cart > .btn #cart-total b{background:var(--rr-blue); color:#fff !important; border-radius:99px;
    padding:1px 9px; font-size:13px; margin-left:2px; display:inline-block}
  #cart > .btn:hover #cart-total b{background:#fff; color:var(--rr-orange-deep) !important}
  #cart > .btn #cart-total{font-size:14.5px; font-weight:700}
}

/* меню: специфічність вище теми (#menu #menu-list) + обидва стани (:hover CSS і .hover від JS теми) */
@media (min-width:992px){
  #menuMask{display:none !important} /* маска теми накривала пункти — звідси миготіння */
  #menu #menu-list > li.hover > .with-child, #menu #menu-list > li:hover > .with-child{background:transparent !important}
  #menu #menu-list > li.hover > .with-child:after{display:none !important}
  #menu #menu-list > li:hover > a, #menu #menu-list > li.hover > a{
    color:var(--rr-orange-deep) !important; border-bottom-color:var(--rr-orange) !important; z-index:auto !important}
  #menu #menu-list > li > .child-box{display:none !important; position:absolute !important; top:100% !important;
    left:0 !important; right:auto !important; bottom:auto !important; width:auto !important; height:auto !important;
    min-width:280px; max-height:72vh; overflow-y:auto; background:#fff !important;
    border:1px solid var(--rr-line); border-radius:0 0 12px 12px;
    box-shadow:0 14px 30px rgba(38,50,72,.14) !important; padding:8px 0 !important; margin:0 !important; z-index:1000}
  #menu #menu-list > li:hover > .child-box, #menu #menu-list > li.hover > .child-box{display:block !important}
  #menu #menu-list > li .child-box > .row{padding:0 !important; margin:0 !important}
  #menu #menu-list > li .child-box .row > div{width:100% !important; float:none !important; padding:0 !important}
  #menu #menu-list > li .child-box .child-box-cell{padding:0 !important; margin:0 !important}
  #menu #menu-list .see-all-categories{position:static !important; background:transparent !important}
}

/* картки товарів (головна і категорія) — як у макеті */
.product-thumb .caption{padding:12px 14px 6px}
.product-thumb .caption .name{min-height:40px}
.product-thumb .caption .name a{font-size:14px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.product-thumb .price{font-size:17px; margin:6px 0 4px}
.product-thumb .buttons, .product-thumb .dropup{display:flex; gap:6px; align-items:stretch; padding:0 14px 13px}
.product-thumb .dropup{padding:0; flex:1}
.product-thumb .btn-addtocart{border-radius:9px !important; padding:9px 12px}
.product-thumb .dropup > .btn-addtocart:first-child{flex:1}
.product-thumb .dropup > .btn-addtocart.dropdown-toggle{flex:0 0 42px}
.product-thumb .rating{margin:0}

/* v16: вміст попапа кошика — рядки товару і клікер кількості */
#modal-cart .well.products{background:#fff; border:0; box-shadow:none; margin:0; padding:0}
#modal-cart .product{border-bottom:1px solid var(--rr-line); padding:12px 0; margin:0}
#modal-cart .product:last-child{border-bottom:0}
#modal-cart .product > .row > .col-sm-6{width:100%; float:none}
#modal-cart .product .image{float:left; margin-right:10px}
#modal-cart .product .image img{width:52px; height:52px; object-fit:cover; border-radius:9px; border:1px solid var(--rr-line); padding:0}
#modal-cart .product .name a{font-size:13.5px; line-height:1.35; color:var(--rr-ink); font-weight:600}
#modal-cart .product .name a:hover{color:var(--rr-orange-deep)}
#modal-cart .cartCell{display:block; float:left}
#modal-cart .cartCellContent{padding:6px 0 0}
/* клікер кількості: рівні квадратні кнопки з одним радіусом по краях */
#modal-cart .popup-quantity{width:116px; display:flex; align-items:stretch}
#modal-cart .popup-quantity .input-group-btn{width:auto; display:block}
#modal-cart .popup-quantity .btn{width:34px; height:34px; padding:0; border:1px solid var(--rr-line);
  background:var(--rr-bg); color:var(--rr-ink); font-size:17px; line-height:1; box-shadow:none; border-radius:0}
#modal-cart .popup-quantity .input-group-btn:first-child .btn{border-radius:9px 0 0 9px}
#modal-cart .popup-quantity .input-group-btn:last-child .btn{border-radius:0 9px 9px 0}
#modal-cart .popup-quantity .btn:hover{background:var(--rr-orange-tint); color:var(--rr-orange-deep); border-color:var(--rr-orange)}
#modal-cart .popup-quantity .form-control{height:34px; width:46px; text-align:center; border-color:var(--rr-line);
  box-shadow:none; padding:0 4px; border-left:0; border-right:0; font-weight:700}
#modal-cart .pprice .cartCellContent{font-weight:800; font-size:15px; padding-top:12px; white-space:nowrap}
#modal-cart .product .fa-trash-o{color:var(--rr-soft); padding-top:12px}
#modal-cart .product a:hover .fa-trash-o{color:#D9534F}
#modal-cart .modal-body{padding:10px 16px}
/* v17: бейдж лічильника — акуратний кружок, не тумблер */
@media (min-width:992px){
  #cart > .btn #cart-total b{min-width:22px; height:22px; line-height:22px; padding:0 6px;
    text-align:center; font-size:12.5px; vertical-align:middle; margin-left:6px}
}

/* ══ v18: шапка і картки головної — точні токени макета ══ */
/* лого-бейдж */
.rr-logo{display:flex; align-items:center; gap:10px; text-decoration:none !important}
.rr-logo-badge{width:40px; height:40px; border-radius:10px; background:var(--rr-orange); display:grid; place-items:center; flex:0 0 auto}
.rr-logo-name{font-weight:800; font-size:18.5px; line-height:1.05; color:var(--rr-ink); letter-spacing:-.01em}
.rr-logo-name small{display:block; font-weight:500; font-size:11px; color:var(--rr-soft); letter-spacing:.03em}
.rr-logo:hover .rr-logo-name{color:var(--rr-ink)}

/* пошук — рамка 2px, кнопка «Знайти» */
#search{display:flex; border:2px solid var(--rr-blue); border-radius:10px; overflow:hidden; background:#fff; transition:border-color .15s; width:100%}
#search:hover, #search:focus-within{border-color:var(--rr-orange)}
#search .form-control{flex:1; border:0 !important; border-radius:0 !important; height:40px !important; padding:10px 14px; box-shadow:none !important; font-size:14.5px}
#search .input-group-btn{width:auto; display:block}
#search .input-group-btn .btn{border:0 !important; border-radius:0 !important; height:40px !important; background:var(--rr-blue); color:#fff; padding:0 20px; font-weight:700; font-size:14px; transition:background .15s}
#search .input-group-btn .btn:hover{background:var(--rr-orange)}
@media (min-width:992px){ #search .glyphicon-search{display:none} }
@media (max-width:991px){ .rr-find-txt{display:none} #search .input-group-btn .btn{padding:0 16px} }

/* кошик — пілюля БЕЗ квадрата (джерело чорних кутів прибрано) */
@media (min-width:992px){
  #cart > .btn{display:flex !important; align-items:center; gap:9px; padding:10px 16px !important;
    height:44px; background:var(--rr-tint) !important; width:auto; min-width:0}
  #cart > .btn::before{content:"" !important; position:static !important; width:20px !important; height:20px !important;
    border-radius:0 !important; flex:0 0 auto;
    background:url("/catalog/view/theme/coloring/image/cart-blue.svg") center/20px no-repeat !important}
  #cart:hover > .btn::before, #cart.open > .btn::before{
    background:url("/catalog/view/theme/coloring/image/cart.svg") center/20px no-repeat !important}
  #cart > .btn #cart-total{position:static !important; font-size:14.5px; font-weight:700; white-space:nowrap}
  .rr-top-cart{display:flex; justify-content:flex-end}
  .rr-top-cart #cart{width:auto !important}
}

/* перемикач мови — акуратна пілюля в дизайні */
.rr-top-lang .btn.btn-link, .rr-top-lang .btn{border:1px solid var(--rr-line) !important; border-radius:10px !important;
  background:#fff !important; color:var(--rr-soft) !important; padding:9px 10px !important; height:44px;
  text-decoration:none !important; box-shadow:none !important; display:inline-flex; align-items:center; gap:6px; font-size:13px}
.rr-top-lang .btn:hover{border-color:var(--rr-orange) !important; color:var(--rr-orange-deep) !important}
.rr-top-lang .btn img{margin:0}
.rr-top-lang .dropdown-menu{border:1px solid var(--rr-line); border-radius:12px; box-shadow:0 14px 30px rgba(38,50,72,.14)}

/* смуга категорій — токени макета (14px, спокійний колір, ховер-підкреслення) */
@media (min-width:992px){
  #menu #menu-list > li > a{font-size:14px !important; font-weight:400 !important; color:var(--rr-soft) !important;
    padding:0 13px !important; height:42px !important}
  #menu #menu-list > li:hover > a, #menu #menu-list > li.hover > a{color:var(--rr-orange-deep) !important}
}

/* картки «Хіти тижня» (.box-product .product-item) — макетні .prod */
.box-product .product-item{border:1px solid var(--rr-line) !important; border-radius:12px !important; background:#fff;
  box-shadow:0 2px 10px rgba(38,50,72,.05); overflow:hidden; transition:box-shadow .15s}
.box-product .product-item:hover{box-shadow:0 8px 20px rgba(38,50,72,.12)}
.box-product .product-item .caption{padding:12px 14px 4px}
.box-product .product-item .name{min-height:40px; margin:0 0 8px}
.box-product .product-item .name a{font-size:14px; font-weight:600; color:var(--rr-ink); line-height:1.4;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.box-product .product-item .name a:hover{color:var(--rr-orange-deep)}
.box-product .product-item .price{display:flex; align-items:center; justify-content:space-between; gap:8px;
  font-weight:800; font-size:17px; color:var(--rr-ink); margin:0}
.rr-stock{font-size:12px; color:#2E9E5B; font-weight:600; white-space:nowrap}
.box-product .product-item .buttons{padding:9px 14px 13px}
.box-product .product-item .btn-addtocart{padding:8px 16px}
/* панель хітів — заголовок як .sec-head макета */
.panel-sl{background:transparent; border:0; box-shadow:none}
.panel-sl .panel-heading{background:transparent; border:0; font-size:23px; font-weight:800; color:var(--rr-ink); padding:0 0 18px}
/* v19: лого-флекс на #logo (на головній анкер розгортається скриптом) + пошук overflow */
#logo{display:flex; align-items:center; gap:10px; padding:12px 0 !important}
#logo .rr-logo{display:flex; align-items:center; gap:10px}
#search{overflow:hidden}
/* v20: мобільна шапка — лого одним рядком, кнопка пошуку фірмово-синя */
@media (max-width:991px){
  .rr-logo-name{font-size:16.5px; white-space:nowrap}
  .rr-logo-name small{display:none}
  .rr-logo-badge{width:36px; height:36px; border-radius:9px}
  #logo{padding:6px 0 !important}
  #search .input-group-btn .btn{background:var(--rr-blue) !important; color:#fff !important}
}

/* ══ v21: залізобетон на кути кошика + геометрія пошуку ══ */
@media (min-width:992px){
  /* кошик: радіус і кліп на КОЖНОМУ шарі — нічому фізично нема звідки вилізти */
  .rr-top-cart #cart, .rr-top-cart #cart.btn-group{
    background:transparent !important; box-shadow:none !important; border:0 !important;
    border-radius:10px !important; overflow:hidden; width:auto !important; margin:0 !important; padding:0 !important}
  #cart > .btn{overflow:hidden; position:relative}
  #cart > .btn::after{display:none !important}
  #cart:hover > .btn::before{background-color:transparent !important}

  /* пошук: рамка 44px, кнопка тягнеться на всю висоту врівень */
  #search{height:44px; padding:0 !important; margin:0 !important; align-items:stretch; z-index:10}
  #search .form-control{height:40px !important; min-height:0 !important; padding:0 14px !important; margin:0 !important; align-self:stretch}
  #search .input-group-btn{display:flex !important; align-items:stretch; height:auto}
  #search .input-group-btn .btn, #search-button{
    height:100% !important; min-height:0 !important; padding:0 22px !important; margin:0 !important;
    background:var(--rr-blue) !important; color:#fff !important; border:0 !important; border-radius:0 !important;
    display:flex; align-items:center; font-weight:700; font-size:14px; box-shadow:none !important; text-shadow:none !important}
  #search .input-group-btn .btn:hover, #search-button:hover{background:var(--rr-orange) !important}

  /* мова — та сама висота що кошик і пошук */
  .rr-top-lang .btn{height:44px !important}
}

/* ══ v22: бейдж кошика — біла цифра, мокапна пілюлька (v9-правило було специфічніше і фарбувало цифру синім по синьому) ══ */
@media (min-width:992px){
  #cart > button.btn #cart-total .products b, #cart > .btn #cart-total b{
    background:var(--rr-blue) !important; color:#fff !important;
    min-width:0 !important; width:auto !important; height:auto !important;
    line-height:1.5 !important; padding:1px 8px !important; border-radius:99px !important;
    font-size:12.5px !important; display:inline-block; vertical-align:middle;
    margin-left:4px; position:static !important; text-align:center}
  #cart:hover > button.btn #cart-total .products b, #cart:hover > .btn #cart-total b{
    background:#fff !important; color:var(--rr-orange-deep) !important}
  #cart > .btn #cart-total{display:flex; align-items:center; gap:0}
  #cart > .btn #cart-total .products{display:flex; align-items:center}
  #cart > .btn{font-size:15px}
}

/* ══ v23: білий фон шапки, мокапна композиція рядка, значок-візок ══ */
@media (min-width:992px){
  header{background:#fff; box-shadow:0 1px 0 var(--rr-line), 0 4px 14px rgba(38,50,72,.05)}
  header > .container{width:1160px; max-width:100%}
  /* рядок як у макеті: лого | пошук на всю середину | кошик | мова */
  .logo-line{display:flex; align-items:center; gap:22px; padding:13px 0; margin:0}
  .logo-line > div[class*="col-"]{width:auto !important; float:none !important; padding:0 !important; margin:0 !important}
  .rr-top-search{flex:1 1 auto !important; min-width:0}
  .rr-top-cart, .rr-top-lang{flex:0 0 auto !important}
  .logo-line > .col-xs-6{flex:0 0 auto}
  /* смуга категорій: білий фон, тонка лінія зверху — як nav.cats */
  .menu-background{background:#fff !important; border-top:1px solid var(--rr-line); border-bottom:1px solid var(--rr-line); box-shadow:none}
  .menu-background > .container{width:1160px; max-width:100%}
  /* значок кошика — мокапний візок */
  #cart > .btn::before{background:url("/catalog/view/theme/coloring/image/rr-cart-blue.svg") center/20px no-repeat !important}
  #cart:hover > .btn::before, #cart.open > .btn::before{background:url("/catalog/view/theme/coloring/image/rr-cart-white.svg") center/20px no-repeat !important; background-color:transparent !important}
}
@media (max-width:991px){
  /* мобільний квадратик — той самий візок білим */
  #cart > .btn::before{
    background:url("/catalog/view/theme/coloring/image/rr-cart-white.svg"), linear-gradient(-90deg, var(--rr-blue) 0%, var(--rr-blue-deep) 100%) !important;
    background-position:center !important; background-repeat:no-repeat !important; background-size:22px, cover !important}
}

/* ══ v24: випадайка категорій — компактний мокапний список ══ */
@media (min-width:992px){
  #menu #menu-list > li .child-box{border:1px solid var(--rr-line) !important; border-radius:0 0 12px 12px !important; padding:6px 0 10px !important}
  #menu #menu-list > li .child-box .h5{font-size:14px !important; margin:0 !important; padding:0 !important; line-height:1.35 !important; font-weight:500}
  #menu #menu-list > li .child-box .h5 a{display:block !important; padding:9px 18px !important; font-size:14px !important;
    color:var(--rr-ink) !important; font-weight:500 !important; line-height:1.35 !important; text-decoration:none !important}
  #menu #menu-list > li .child-box .h5 a:hover{background:var(--rr-orange-tint) !important; color:var(--rr-orange-deep) !important}
  #menu #menu-list > li .child-box .h5 .livel-down{display:none !important}
  #menu #menu-list .child2-box{padding:0 !important; margin:0 !important; list-style:none !important}
  #menu #menu-list .child2-box li{margin:0 !important; padding:0 !important; border:0 !important}
  #menu #menu-list .child2-box li a{display:block !important; padding:6px 18px 6px 32px !important; font-size:13.2px !important;
    color:var(--rr-soft) !important; line-height:1.35 !important; text-decoration:none !important}
  #menu #menu-list .child2-box li a:hover{background:var(--rr-orange-tint) !important; color:var(--rr-orange-deep) !important}
  #menu #menu-list .child2-box .livel-down{color:var(--rr-orange) !important; margin-right:4px !important; display:inline !important}
  #menu #menu-list .child-box .child-box-cell{padding:0 !important; margin:0 !important}
  #menu #menu-list .child-box .see-all-categories{margin-top:6px !important; padding:0 !important}
  #menu #menu-list .child-box .see-all-categories a{display:block !important; padding:9px 18px !important; font-size:13.5px !important; font-weight:700 !important; color:var(--rr-blue-deep) !important}
  #menu #menu-list .child-box .see-all-categories a:hover{color:var(--rr-orange-deep) !important}
  #menu #menu-list .child-box .toggle-child2{display:none !important}
}

/* ══ v25: смуга категорій — компактна як у макеті ══ */
@media (min-width:992px){
  /* 1. без розмиття фону при відкритому меню (давало відчуття підлагування) */
  .blured .content-wrapper, .blured footer, .blured header #top,
  .blured header .logo-line, .blured header .search-box, .blured header .cart-box,
  .blured *{-webkit-filter:none !important; filter:none !important}
  /* 2. мінімальний відступ між пошуком і смугою */
  .menu-background{padding:0 !important}
  .menu-background .menu-line{padding:0 !important; margin:0 !important}
  .menu-background .menu-line .menu-box{padding:0 15px !important; height:auto !important}
  #menu{margin:0 !important; padding:0 !important}
  #menu #menu-list{padding:2px 0 !important}
  #menu #menu-list > li > a{height:44px !important}
  /* 3. стрілочки ▾ біля категорій з випадайкою */
  #menu #menu-list > li > a.with-child::after{content:"▾"; margin-left:6px; font-size:11px; opacity:.55; transition:transform .15s; display:inline-block}
  #menu #menu-list > li:hover > a.with-child::after, #menu #menu-list > li.hover > a.with-child::after{transform:rotate(180deg); opacity:1}
}
/* v26: bootstrap dropdown-menu давав margin-top 21px усій смузі */
@media (min-width:992px){ #menu #menu-list{margin:0 !important} }
/* v27: стрілочки 1-в-1 з мокапа (▼ 10px, opacity .55, поворот 180° при відкритій випадайці) */
@media (min-width:992px){
  #menu #menu-list > li > a.with-child::after{content:"▼" !important; margin-left:5px !important;
    font-size:10px !important; line-height:1; opacity:.55 !important; transition:transform .15s;
    display:inline-block; transform:none}
  #menu #menu-list > li:hover > a.with-child::after,
  #menu #menu-list > li.hover > a.with-child::after{transform:rotate(180deg); opacity:.55 !important}
}
/* v28: на відкритому пункті стрілка теж лишається (перекриває display:none з v15 і абсолютний ::after теми) */
@media (min-width:992px){
  #menu #menu-list > li.hover > a.with-child::after, #menu #menu-list > li.hover > .with-child:after{
    display:inline-block !important; content:"▼" !important; position:static !important;
    width:auto !important; height:auto !important; background:transparent !important; z-index:auto !important;
    margin-left:5px !important; font-size:10px !important; opacity:.55 !important;
    transform:rotate(180deg); transition:transform .15s}
}

/* ══ v29: картка товару за мокапом ══ */
.product-page{width:1160px; max-width:100%}
/* кнопки без стрілочок і без іконок — чистий «Купити» як у макеті */
.box-product .product-item .dropup .dropdown-toggle,
.product-thumb .dropup .dropdown-toggle,
.product-thumb .buttons .dropdown-toggle{display:none !important}
.btn-addtocart .fa, #button-cart .fa{display:none !important}
.box-product .product-item .dropup > .btn-addtocart:first-child{flex:1 1 auto; width:100%}
/* заголовок, ціна */
.product-page h1{font-size:23px !important; font-weight:800 !important; letter-spacing:-.01em}
.product-page .priceBig span:first-child{font-size:31px; font-weight:800; color:var(--rr-ink)}
/* велика кнопка купити */
#button-cart{font-size:16px !important; font-weight:800 !important; padding:13px 34px !important; border-radius:10px !important}
/* таби як у макеті */
.nav-tabs.product-tabs{border-bottom:2px solid var(--rr-line); margin:8px 0 16px}
.nav-tabs.product-tabs > li{margin-bottom:-2px}
.nav-tabs.product-tabs > li > a{border:0 !important; background:transparent !important; border-radius:0 !important;
  padding:10px 18px; font-weight:600; font-size:14.5px; color:var(--rr-soft); border-bottom:3px solid transparent !important; margin:0}
.nav-tabs.product-tabs > li > a:hover{color:var(--rr-orange-deep)}
.nav-tabs.product-tabs > li.active > a{color:var(--rr-orange-deep) !important; border-bottom:3px solid var(--rr-orange) !important}
.product-page .tab-content{background:#fff; border:1px solid var(--rr-line); border-radius:12px; padding:20px 22px; margin-bottom:24px}
/* відгуки — вмальовані в дизайн */
.item-review{border-bottom:1px solid var(--rr-line); padding:4px 0 10px; margin-bottom:10px}
.item-review:last-child{border-bottom:0}
.item-review .table{margin:0}
.item-review .table td{border:0 !important; padding:4px 0}
.item-review strong{font-size:14.5px; color:var(--rr-ink)}
.item-review .stars .fa-star{color:var(--rr-line)}
.item-review .stars .fa-star.active{color:#FFC000}
.item-review .text-right{color:var(--rr-soft); font-size:12.5px}
.item-review p{font-size:14px; color:var(--rr-ink); margin:4px 0 0}
/* блоки доставка/оплата/гарантія */
.rr-shipgrid{display:grid; gap:10px; margin:16px 0}
.rr-shiprow{display:flex; gap:12px; align-items:flex-start; background:#fff; border:1px solid var(--rr-line); border-radius:12px; padding:12px 14px}
.rr-ic{width:38px; height:38px; flex:0 0 auto; border-radius:10px; display:grid; place-items:center}
.rr-ic-np{background:#FDE8E4; color:#D52B1E}
.rr-ic-pay{background:var(--rr-tint); color:var(--rr-blue-deep)}
.rr-ic-grt{background:#E6F5EA; color:#2E8C55}
.rr-shiptxt b{display:block; font-size:13.5px; color:var(--rr-ink); margin-bottom:2px}
.rr-shiptxt > span{font-size:13px; color:var(--rr-soft); line-height:1.45; display:block}
.rr-payicons{display:flex; gap:7px; margin-top:6px; align-items:center; flex-wrap:wrap}
.rr-payicons img{height:16px; width:auto; border:1px solid var(--rr-line); border-radius:6px; padding:3px 8px; height:24px; background:#fff}

/* ══ v30: хіти на головній — сітка і картки як у мокапі ══ */
@media (min-width:992px){
  .box-product .panel-body{display:grid !important; grid-template-columns:repeat(4,1fr); gap:16px; width:auto}
}
@media (min-width:560px) and (max-width:991px){
  .box-product .panel-body{display:grid !important; grid-template-columns:repeat(2,1fr); gap:12px}
}
.box-product .product-item{width:auto !important; margin:0 !important; float:none !important}
.box-product .product-item .image{height:190px; display:flex; align-items:center; justify-content:center; overflow:hidden; padding:10px}
.box-product .product-item .image img{max-height:100% !important; max-width:100% !important; width:auto !important; object-fit:contain}
/* кнопка мала зліва, як у мокапі */
.box-product .product-item .dropup{display:block; padding:0}
.box-product .product-item .dropup > .btn-addtocart:first-child{flex:none; width:auto !important; padding:8px 18px !important; border-radius:9px !important}
.box-product .product-item .buttons{display:block; padding:9px 14px 14px}
/* SEO-текст головної — у білій картці, як .seo мокапа */
#rr-hits > div:last-of-type{background:#fff; border:1px solid var(--rr-line); border-radius:14px; padding:26px 28px; margin:10px 0 36px}
#rr-hits > div:last-of-type h2{margin-top:0}
#rr-hits > div:last-of-type p{color:var(--rr-soft); max-width:78ch}
#rr-hits > div:last-of-type li{color:var(--rr-soft); margin-bottom:8px; font-size:14.3px}
#rr-hits > div:last-of-type li b{color:var(--rr-ink)}
/* v31: залишки owl не заважають сітці; кнопка хітів — компактна зліва */
.box-product .panel-body .owl-wrapper-outer, .box-product .panel-body .owl-wrapper{width:auto !important; display:contents !important; transform:none !important}
.box-product .panel-body .owl-item{width:auto !important; float:none !important}
.box-product .owl-controls{display:none !important}
.box-product .product-item .buttons .btn-addtocart{width:auto !important; display:inline-flex !important; align-items:center}
/* v32: SEO-картка через власний клас + сітка хітів без паддінгів теми */
.rr-seo{background:#fff; border:1px solid var(--rr-line); border-radius:14px; padding:26px 28px; margin:10px 0 36px}
.rr-seo h2{margin-top:0; font-size:20px; font-weight:800; color:var(--rr-ink)}
.rr-seo p{color:var(--rr-soft); max-width:78ch}
.rr-seo li{color:var(--rr-soft); margin-bottom:8px; font-size:14.3px}
.rr-seo li b, .rr-seo li strong{color:var(--rr-ink)}
#rr-hits > div:last-of-type{background:transparent; border:0; padding:0; margin:0}
.box-product .panel-body{padding:0 !important; margin:0 !important; width:auto !important}
.box-product{padding:0 !important}
/* v33: ЄДИНА ширина макета 1160px (тема на широких екранах давала 1400 — усе «розповзалось») */
@media (min-width:1200px){
  .container{width:1160px !important; max-width:100%}
}
/* v34: хіти — flex замість grid (grid дивно зсував перший елемент) */
@media (min-width:992px){
  .box-product .panel-body{display:flex !important; flex-wrap:nowrap; gap:16px; align-items:stretch}
  .box-product .product-item{flex:1 1 0; min-width:0; width:auto !important}
}
@media (min-width:560px) and (max-width:991px){
  .box-product .panel-body{display:flex !important; flex-wrap:wrap; gap:12px}
  .box-product .product-item{flex:1 1 44%; min-width:0}
}
/* v35: кнопка «Купити» в хітах — компактна зліва, як у мокапі */
.box-product .product-item .buttons{display:block !important}
.box-product .product-item .buttons .dropup{display:inline-block !important; width:auto !important; padding:0}
.box-product .product-item .buttons .btn-addtocart,
.box-product .product-item .dropup > .btn-addtocart:first-child{
  width:auto !important; flex:none !important; display:inline-block !important; padding:8px 20px !important}
/* v36: стрілочка-каретка прихована остаточно (v35 її випадково воскресив) */
.box-product .product-item .buttons .dropdown-toggle,
.product-thumb .buttons .dropdown-toggle,
.product-thumb .dropup .dropdown-toggle{display:none !important}

/* ══ v37: зірочки відгуків на картках ══ */
.rr-stars{margin:2px 0 6px; line-height:1}
.rr-stars .fa-star{color:var(--rr-line); font-size:12.5px; margin-right:1px}
.rr-stars .fa-star.on{color:#FFC000}
/* категорійні плитки: рейтинг і наявність */
.product-thumb .rating .fa-star{color:var(--rr-line); font-size:12.5px}
.product-thumb .rating .fa-star.active{color:#FFC000}
.product-thumb .rating #sm-comments, .product-thumb .rating #sm-comments a{color:var(--rr-soft); font-size:12px; text-decoration:none}
.product-thumb .rating .fa-comment{color:var(--rr-soft); font-size:11px}
.product-thumb .stock{color:#2E9E5B !important; font-size:12px; font-weight:600}

/* ══ v39: типографіка мокапа — системний шрифтовий стек по всьому фронту ══ */
body, .btn, input, select, textarea, button,
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5,
.product-thumb, .product-item, .panel-heading, #menu-list, .breadcrumb{
  font-family:-apple-system,"Segoe UI",Roboto,system-ui,sans-serif !important}
body{font-size:15px; line-height:1.55; color:var(--rr-ink)}
/* v40: кеглі та вага заголовків — точно мокапні */
body{font-size:15.5px}
.rr-hero h1{font-size:clamp(28px,4.3vw,46px) !important; font-weight:800 !important; letter-spacing:-.01em !important; line-height:1.08 !important}
.rr-sec-head h2{font-size:23px !important; font-weight:800 !important; letter-spacing:-.01em !important; color:var(--rr-ink) !important}
.panel-sl .panel-heading{font-size:23px !important; font-weight:800 !important; letter-spacing:-.01em !important; color:var(--rr-ink) !important}
.rr-seo h2{font-size:20px !important; font-weight:800 !important; letter-spacing:-.01em !important}
.rr-banner h3, .rr-cat h3{font-weight:700 !important}
.box-product .product-item .name a{font-weight:600 !important}

/* ══ v41: хіти — зірки з кількістю справа від кнопки, компактна кнопка, лінія заголовка, SEO 2 колонки ══ */
.box-product .product-item .buttons{display:flex !important; align-items:center; justify-content:space-between; gap:10px; padding:6px 14px 14px !important}
.box-product .product-item .buttons .dropup{flex:0 0 auto}
.box-product .product-item .buttons .btn-addtocart{padding:7px 16px !important; font-size:13.5px !important}
.rr-stars-btn{display:inline-flex; align-items:center; gap:1px; margin:0; white-space:nowrap}
.rr-stars-btn em{font-style:normal; font-size:12px; color:var(--rr-soft); margin-left:5px}
/* лінія-роздільник після заголовка хітів (як .sec-head .rule) */
.panel-sl .panel-heading{display:flex !important; align-items:baseline; gap:14px}
.panel-sl .panel-heading::after{content:""; flex:1; border-top:1px solid var(--rr-line)}
/* SEO-список у 2 колонки як у мокапі */
.rr-seo ul{columns:2; gap:34px; padding-left:20px; margin:14px 0 0}
.rr-seo li{break-inside:avoid}
@media (max-width:700px){ .rr-seo ul{columns:1} }
/* v42: рядок кнопки — «Купити» зліва, зірки+(N) справа; кнопка не стискається */
.box-product .product-item .buttons{display:block !important; padding:6px 14px 14px !important}
.box-product .product-item .buttons .dropup{display:flex !important; flex-direction:row-reverse;
  align-items:center; justify-content:space-between; width:100% !important; gap:10px}
.box-product .product-item .buttons .dropup > .btn-addtocart:first-of-type{
  flex:0 0 auto !important; width:auto !important; min-width:88px; padding:7px 18px !important;
  font-size:13.5px !important; display:inline-block !important; white-space:nowrap}
.rr-stars-btn{flex:0 0 auto}

/* ══ v43: гармонізація карток (головна + каталог) за правилами макета ══ */
/* 1. заголовок → картки: 20px */
.panel-sl .panel-heading{padding:0 0 20px !important; margin:0 !important}
/* 2-3. фото-зона компактніша, текст одразу під нею */
.box-product .product-item .image{height:150px !important; padding:6px !important}
.box-product .product-item .caption{padding:10px 14px 0 !important}
.box-product .product-item .name{margin:0 0 6px !important}
/* 4. ціна → кнопка 10px; рядки вирівняні по центру */
.box-product .product-item .price{display:flex; align-items:center; justify-content:space-between; margin:0 !important}
.box-product .product-item .buttons{padding:10px 14px 13px !important}
/* 5. кнопка: мокапні розміри і скруглення */
.box-product .product-item .buttons .dropup > .btn-addtocart:first-of-type{
  padding:7px 16px !important; border-radius:9px !important; line-height:1.4}
/* 6. відступ до SEO-блоку */
.rr-seo{margin:0 0 36px !important}
.panel-sl{margin-bottom:14px !important}

/* каталог: той самий ритм картки */
.product-thumb .image{padding:6px}
.product-thumb .image img{margin:0 auto}
.product-thumb .caption{padding:10px 14px 0 !important}
.product-thumb .caption .name{margin:0 0 6px !important}
.product-thumb .a-name{display:flex; align-items:center; justify-content:space-between; margin:0 0 4px !important}
.product-thumb .a-name p{margin:0 !important; float:none !important}
.product-thumb .price{font-size:17px !important; font-weight:800; margin:4px 0 0 !important; display:block}
.product-thumb .buttons{display:flex !important; align-items:center; justify-content:space-between; padding:10px 14px 14px !important; gap:10px}
.product-thumb .buttons .dropup{display:flex !important; flex-direction:row-reverse; align-items:center; justify-content:space-between; width:100%; gap:10px}
.product-thumb .btn-addtocart{padding:7px 16px !important; border-radius:9px !important; font-size:13.5px !important; width:auto !important; flex:0 0 auto !important; white-space:nowrap; line-height:1.4}
/* v44: у каталозі кнопка зліва (реверс потрібен лише хітам, де зірки в парі) */
.product-thumb .buttons .dropup{flex-direction:row !important; justify-content:flex-start !important}
/* v45: каталог — ціна по лінії з кнопкою: [ціна ... Купити] */
.product-thumb .buttons{justify-content:space-between !important}
.product-thumb .buttons .price{margin:0 !important; padding:0 !important; flex:0 0 auto; display:flex; align-items:center}
.product-thumb .buttons .dropup{width:auto !important; flex:0 0 auto !important; justify-content:flex-end !important}
/* v46: каталог повернуто (ціна над кнопкою, зліва) */
.product-thumb .caption .price{display:flex; align-items:center; margin:4px 0 0 !important}
.product-thumb .buttons{justify-content:flex-start !important}
/* головна: тверді лінії назви/ціни/кнопки в усіх картках */
.box-product .product-item{display:flex !important; flex-direction:column}
.box-product .product-item .image{flex:0 0 auto}
.box-product .product-item .caption{flex:1 1 auto; display:flex; flex-direction:column}
.box-product .product-item .caption .name{flex:0 0 auto; min-height:40px}
.box-product .product-item .caption .price{margin-top:auto !important}
.box-product .product-item .buttons{flex:0 0 auto; margin-top:0}

/* ══ v47: єдині вертикальні напрямні на головній (контент-край = 20px від контейнера) ══ */
@media (min-width:992px){
  .logo-line{padding-left:5px !important; padding-right:5px !important}
  .menu-background .menu-line .menu-box{padding:0 9px !important}
  #rr-hits{padding-left:20px !important; padding-right:20px !important}
  footer .footer-box{padding-left:5px; padding-right:5px}
  footer .end .container{padding-left:20px; padding-right:20px}
}
/* v48: clearfix-псевдоелементи panel-body були нульовими flex-items і зсували першу картку на gap */
.box-product .panel-body::before, .box-product .panel-body::after{display:none !important; content:none !important}

/* ══ v49: картка товару — єдині вертикальні лінії ══ */
@media (min-width:992px){
  /* лівий край сторінки = 225, як на головній */
  .product-page .breadcrumb{margin-left:10px !important}
  .product-page h1{margin-left:10px !important}
  #photo-wrap{padding-left:25px !important}
  /* права колонка: всі блоки на 810..1340 */
  .rr-shipgrid{margin-left:5px !important; margin-right:5px !important}
  .nav-tabs.product-tabs{margin-left:5px !important; margin-right:5px !important}
  #desc-section .tab-content{margin-left:5px !important; margin-right:5px !important}
  /* вертикальний ритм правої колонки */
  .product-page .price{margin:14px 0 4px !important}
  .addtocart-group{margin:0 0 6px !important}
  .rr-shipgrid{margin-top:20px !important}
}

/* ══ v50: центрування вмісту карток хітів + симетричний футер ══ */
/* картки: все по центральній осі */
.box-product .product-item .caption{align-items:center; text-align:center}
.box-product .product-item .name{width:100%}
.box-product .product-item .name a{text-align:center}
.box-product .product-item .caption .price{justify-content:center !important; gap:14px; width:100%}
.box-product .product-item .buttons .dropup{flex-direction:row-reverse; justify-content:center !important; gap:14px}
/* футер: 3 колонки рівномірно на всю ширину (був пустий хвіст справа) */
@media (min-width:992px){
  footer .footer-box .row.row-flex{display:flex; width:100%}
  footer .footer-box .row.row-flex > div[class*="col-"]{flex:1 1 0; width:auto; float:none}
}

/* ══ v51: картки — контент по внутрішніх лініях картки; футер — по напрямних сайту ══ */
/* картки: назва зліва, ціна зліва + наявність справа, кнопка зліва + зірки справа */
.box-product .product-item .caption{align-items:stretch; text-align:left}
.box-product .product-item .name a{text-align:left}
.box-product .product-item .caption .price{justify-content:space-between !important; gap:8px}
.box-product .product-item .buttons .dropup{justify-content:space-between !important; gap:10px}
/* футер: колонки по сітці сайту — перша на лівій напрямній, остання до правої, середня по центру */
@media (min-width:992px){
  footer .footer-box .row.row-flex{display:flex; justify-content:space-between; width:100%}
  footer .footer-box .row.row-flex > div[class*="col-"]{flex:0 1 auto; width:auto; float:none}
}
/* v52: clearfix-привиди row-flex у футері (з'їдали лівий слот space-between) */
footer .footer-box .row.row-flex::before, footer .footer-box .row.row-flex::after{display:none !important; content:none !important}
/* v53: колонки футера точно в межах ліній сайту (без внутрішніх паддінгів колонок) */
@media (min-width:992px){
  footer .footer-box .row.row-flex{margin:0 !important}
  footer .footer-box .row.row-flex > div[class*="col-"]{padding-left:0 !important; padding-right:0 !important}
}
/* v54: футер — блоки як були (чверті зліва направо, без розтягування вправо):
   Інформація на лівій лінії сайту, Служба і Додатково своїми звичними відступами */
@media (min-width:992px){
  footer .footer-box .row.row-flex{justify-content:flex-start !important; margin:0 -15px !important; width:auto !important}
  footer .footer-box .row.row-flex > div[class*="col-"]{
    flex:0 0 25% !important; width:25% !important;
    padding-left:15px !important; padding-right:15px !important}
}

/* ══ v55: ЄДИНА КАРТКА ТОВАРУ по всьому сайту (головна + каталоги) ══
   фото → назва → [✓ наявність | ★★★★★ (N)] → ціна → «Купити» на всю ширину */
/* фото-зона */
.box-product .product-item .image, .product-thumb .image{height:170px !important; display:flex; align-items:center; justify-content:center; overflow:hidden; padding:8px !important}
.box-product .product-item .image img, .product-thumb .image img{max-height:100% !important; max-width:100% !important; width:auto !important; object-fit:contain; margin:0 auto}
/* назва */
.box-product .product-item .caption, .product-thumb .caption{padding:10px 14px 0 !important}
.box-product .product-item .name a, .product-thumb .caption .name a{font-size:14px !important; font-weight:600 !important; line-height:1.4; color:var(--rr-ink)}
.box-product .product-item .name, .product-thumb .caption .name{min-height:40px; margin:0 0 6px !important}
/* мета-рядок: наявність зліва, зірки справа */
.rr-meta, .product-thumb .a-name{display:flex !important; align-items:center; justify-content:space-between; gap:8px; margin:0 0 6px !important; min-height:19px}
.rr-meta .rr-stock{font-size:12px}
.rr-meta .rr-stars em{font-style:normal; font-size:12px; color:var(--rr-soft); margin-left:4px}
/* ціна зліва */
.box-product .product-item .caption .price, .product-thumb .caption .price{
  display:flex !important; align-items:center; justify-content:flex-start !important;
  font-size:17px !important; font-weight:800 !important; color:var(--rr-ink); margin:0 0 2px !important}
/* кнопка на всю ширину картки — під палець */
.box-product .product-item .buttons, .product-thumb .buttons{display:block !important; padding:10px 14px 14px !important}
.box-product .product-item .buttons .dropup, .product-thumb .buttons .dropup{display:block !important; width:100% !important}
.box-product .product-item .buttons .btn-addtocart, .product-thumb .buttons .btn-addtocart,
.box-product .product-item .buttons .dropup > .btn-addtocart:first-of-type{
  display:block !important; width:100% !important; flex:none !important;
  padding:10px 16px !important; font-size:14px !important; font-weight:700;
  border-radius:9px !important; text-align:center; line-height:1.4; min-width:0}
/* приховані додаткові кнопки не ламають ширину */
.box-product .product-item .buttons .dropdown-toggle, .product-thumb .buttons .dropdown-toggle{display:none !important}
/* v56: каталог — мета-рядок в одну лінію і кількість відгуків у дужках, як на головній */
.product-thumb .a-name p{width:auto !important; flex:0 0 auto !important; text-align:left !important}
.product-thumb .a-name .rating{display:inline-flex !important; align-items:center; gap:1px}
.product-thumb .rating .fa-comment{display:none !important}
.product-thumb .rating #sm-comments a{font-size:12px; color:var(--rr-soft)}
.product-thumb .rating #sm-comments a::before{content:"("}
.product-thumb .rating #sm-comments a::after{content:")"}
.product-thumb .rating #sm-comments{margin-left:4px}
/* v57: мета-рядок каталогу — примусово в один рядок; дужки кількості для всіх випадків */
.product-thumb .a-name{flex-direction:row !important; flex-wrap:nowrap !important; align-items:center !important; text-align:left !important}
.product-thumb .a-name .stock{margin-right:auto !important}
.product-thumb .rating #sm-comments a::before, .product-thumb .rating #sm-comments a::after{content:none !important}
.product-thumb .rating #sm-comments::before{content:"("}
.product-thumb .rating #sm-comments::after{content:")"}
.product-thumb .rating #sm-comments, .product-thumb .rating #sm-comments a{font-size:12px !important; color:var(--rr-soft) !important}

/* ===== v58: меню одним рядком з «Ще ▾», чипи підкатегорій у ряд, тулбар каталогу ===== */
@media (min-width:992px){
  #menu #menu-list > li#rr-more{position:relative}
  #menu #menu-list > li#rr-more > a{cursor:pointer}
  #menu #menu-list > li#rr-more > a::after{content:"▼" !important; margin-left:5px !important; font-size:10px !important;
    opacity:.55 !important; display:inline-block !important; position:static !important; width:auto !important; height:auto !important;
    background:none !important; transform:none; transition:transform .15s}
  #menu #menu-list > li#rr-more:hover > a::after{transform:rotate(180deg)}
  #menu #menu-list #rr-more .rr-more-menu{display:none; position:absolute; top:100%; right:0; z-index:1002; background:#fff;
    border:1px solid var(--rr-line); border-radius:12px; box-shadow:0 16px 38px rgba(38,50,72,.16); min-width:270px; padding:8px; margin:4px 0 0; list-style:none}
  #menu #menu-list #rr-more:hover .rr-more-menu{display:block}
  #menu #menu-list .rr-more-menu > li{display:block; width:100%; min-height:0; height:auto; margin:0; float:none; position:static; padding:0}
  #menu #menu-list .rr-more-menu > li > a{display:block; padding:9px 12px; border-radius:8px; font-weight:600; font-size:13.5px;
    color:var(--rr-ink); white-space:nowrap}
  #menu #menu-list .rr-more-menu > li > a:hover{background:var(--rr-bg); color:var(--rr-blue-deep)}
  #menu #menu-list .rr-more-menu > li > a::after{display:none !important; content:none !important}
  #menu #menu-list .rr-more-menu .toggle-child{display:none !important}
  #menu #menu-list .rr-more-menu .child-box{display:none !important}
  #menu #menu-list .rr-more-menu .arrow{display:none !important}
}
/* чипи підкатегорій — компактний ряд пілюль зліва, як у макеті */
#content > .row:has(> div > .thumbnail.subcategory){display:flex; flex-wrap:wrap; gap:10px; margin:0 0 6px}
#content > .row:has(> div > .thumbnail.subcategory)::before,
#content > .row:has(> div > .thumbnail.subcategory)::after{display:none; content:none}
#content > .row:has(> div > .thumbnail.subcategory) > div[class*=col-]{width:auto; padding:0; float:none; flex:0 0 auto}
#content > .row:has(> div > .thumbnail.subcategory) + hr{display:none}
.thumbnail.subcategory{margin-bottom:0}
.rr-h1-row h1{margin:2px 0 14px}
/* тулбар каталогу — білі кнопки в стилі макета */
.products-filter{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px}
.products-filter::before,.products-filter::after{display:none; content:none}
.products-filter .btn-default{background:#fff !important; border:1px solid var(--rr-line) !important; color:var(--rr-ink) !important;
  border-radius:9px !important; box-shadow:none !important; text-shadow:none !important; padding:8px 12px; font-weight:600}
.products-filter .btn-default:hover,.products-filter .open .btn-default{border-color:var(--rr-blue) !important; color:var(--rr-blue-deep) !important}
.products-filter .btn-group{float:none}
.products-filter .dropdown-menu{border:1px solid var(--rr-line); border-radius:12px; box-shadow:0 16px 38px rgba(38,50,72,.16); padding:8px}
.products-filter .dropdown-menu li a{border-radius:8px; padding:7px 12px}
/* картки хітів не розтягуються, коли товарів < 4 */
@media (min-width:768px){
  .box-product .panel-body > .product-item{min-width:0}
}
/* мітка «Знайдено товарів: N» + розкладка тулбара з трьома елементами */
.products-filter{justify-content:flex-start; gap:12px}
.products-filter .rr-found{font-size:13.5px; color:var(--rr-soft)}
.products-filter .rr-found b{color:var(--rr-ink)}
.products-filter .btn-group.pull-right{margin-left:auto}

/* ═════════ v59: мегаменю «Каталог товарів» + швидкі посилання ═════════ */
@media (min-width:992px){
  .menu-box{display:flex; align-items:center; gap:6px}
  #menu{width:auto; position:relative; margin:0}
  #menu .btn-menu{display:inline-flex !important; align-items:center; gap:9px; width:auto; margin:6px 0; padding:10px 18px;
    background:var(--rr-blue) !important; color:#fff !important; border:0 !important; border-radius:10px !important;
    font-weight:700; font-size:14px; box-shadow:none !important; text-shadow:none}
  #menu .btn-menu:hover{background:var(--rr-blue-deep) !important}
  #menu .btn-menu .fa-bars{font-size:15px}
  #menu .btn-menu .rr-cchev{font-size:13px; opacity:.75; transition:transform .15s}
  #menu:hover .btn-menu .rr-cchev, #menu.open .btn-menu .rr-cchev{transform:rotate(180deg)}
  #menu #menu-list{display:none !important; position:absolute !important; top:100% !important; left:0 !important;
    z-index:1001; width:940px; height:auto !important; min-height:0 !important; background:#fff !important;
    border:1px solid var(--rr-line) !important; border-radius:14px !important;
    box-shadow:0 24px 60px rgba(38,50,72,.22) !important; padding:8px !important; margin:0 !important; float:none}
  #menu.open #menu-list, #menu:hover #menu-list{display:block !important}
  #menu #menu-list > li{display:block !important; position:static !important; float:none !important; width:338px !important;
    min-height:0 !important; height:auto !important; max-height:none !important; margin:0 !important; padding:0 !important;
    border:0 !important; background:transparent !important}
  #menu #menu-list > li > a{display:flex !important; align-items:center; height:auto !important; min-height:0 !important;
    padding:8.5px 12px !important; margin:0 !important; border-radius:9px; border-bottom:0 !important;
    font-size:13.6px; font-weight:600; color:var(--rr-ink); cursor:pointer; line-height:1.3; background:transparent}
  #menu #menu-list > li:hover > a, #menu #menu-list > li.rr-def > a{background:var(--rr-bg) !important; color:var(--rr-blue-deep)}
  #menu #menu-list > li > a.with-child::after{content:none !important; display:none !important}
  #menu #menu-list > li > a .arrow{display:none !important}
  #menu #menu-list .toggle-child{display:none !important}
  #menu #menu-list > li .child-box{display:none; position:absolute !important; top:8px !important; bottom:8px !important;
    left:354px !important; right:8px !important; min-width:0 !important; width:auto !important; overflow-y:auto;
    padding:12px 20px !important; margin:0 !important; background:#fff !important; border:0 !important;
    border-left:1px solid var(--rr-line) !important; border-radius:0 !important; box-shadow:none !important}
  #menu #menu-list > li:hover .child-box, #menu #menu-list > li.rr-def .child-box{display:block !important}
  #menu #menu-list .child-box .row{margin:0 !important; columns:2; column-gap:28px}
  #menu #menu-list .child-box .row > div{width:100% !important; float:none !important; padding:0 !important; break-inside:avoid; display:block}
  #menu #menu-list .child-box .h5{margin:0; padding:0}
  #menu #menu-list .child-box .h5 a{display:block; padding:6px 0 !important; font-size:14px; font-weight:700;
    color:var(--rr-ink); background:transparent !important}
  #menu #menu-list .child-box .h5 a:hover{color:var(--rr-orange-deep); background:transparent !important}
  #menu #menu-list .child2-box{list-style:none; padding:0 0 4px; margin:0}
  #menu #menu-list .child2-box li a{display:block; padding:4px 0 4px 8px !important; font-size:13.2px; color:var(--rr-soft)}
  #menu #menu-list .child2-box li a:hover{color:var(--rr-orange-deep)}
  #menu #menu-list .rr-allcat{display:inline-block; margin-top:8px; font-weight:700; font-size:13px; color:var(--rr-blue-deep); break-inside:avoid}
  #menu #menu-list .rr-allcat:hover{color:var(--rr-orange-deep)}
  #menu #menu-list .see-all-categories{border-top:1px solid var(--rr-line) !important; margin-top:6px !important; width:338px !important}
  #rr-quick{display:flex; align-items:center; gap:2px; list-style:none; margin:0; padding:0; flex-wrap:nowrap; min-width:0; overflow:visible}
  #rr-quick > li{position:relative; list-style:none; display:block}
  #rr-quick > li > a{display:flex; align-items:center; height:44px; padding:0 11px; font-size:13.6px; font-weight:600;
    color:var(--rr-ink); cursor:pointer; white-space:nowrap}
  #rr-quick > li > a::after{content:"▼"; margin-left:5px; font-size:10px; opacity:.55; display:inline-block; transition:transform .15s}
  #rr-quick > li:hover > a{color:var(--rr-orange-deep)}
  #rr-quick > li:hover > a::after{transform:rotate(180deg)}
  #rr-quick .toggle-child, #rr-quick .toggle-child2, #rr-quick .mobilink, #rr-quick .arrow, #rr-quick .rr-allcat{display:none !important}
  #rr-quick .child-box{display:none; position:absolute; top:100%; left:0; z-index:1000; min-width:290px; background:#fff;
    border:1px solid var(--rr-line); border-radius:12px; box-shadow:0 18px 40px rgba(38,50,72,.16); padding:8px 0}
  #rr-quick > li:hover .child-box{display:block}
  #rr-quick .child-box .row{margin:0}
  #rr-quick .child-box .row > div{width:100%; float:none; padding:0}
  #rr-quick .child-box .h5{margin:0; padding:0}
  #rr-quick .child-box .h5 a{display:block; padding:9px 18px; font-size:14px; font-weight:600; color:var(--rr-ink)}
  #rr-quick .child-box .h5 a:hover{color:var(--rr-orange-deep); background:var(--rr-orange-tint)}
  #rr-quick .child2-box{list-style:none; padding:0; margin:0}
  #rr-quick .child2-box li a{display:block; padding:7px 18px 7px 30px; font-size:13.2px; color:var(--rr-soft)}
  #rr-quick .child2-box li a:hover{color:var(--rr-orange-deep)}
  #rr-quick .livel-down{color:var(--rr-orange); margin-right:4px; display:inline}
  #rr-quick .livel-down.hidden-md{display:none !important}
}
@media (max-width:991px){ #rr-quick{display:none} }

/* ═════════ v59: картка товару ═════════ */
@media (min-width:992px){
  #content > .row:has(> #photo-wrap){display:flex; align-items:flex-start}
  #content > .row:has(> #photo-wrap)::before, #content > .row:has(> #photo-wrap)::after{display:none; content:none}
  #content > .row:has(> #photo-wrap) > #product{position:sticky; top:136px}
}
#product h1{font-size:24px; margin:0 0 8px; line-height:1.25; padding:0}
#product .raiting{display:flex; align-items:center; gap:8px; margin:0 0 10px}
.rr-buycard{background:#fff; border:1px solid var(--rr-line); border-radius:14px; padding:16px 18px; margin:6px 0 12px;
  box-shadow:0 2px 10px rgba(38,50,72,.05)}
@media (min-width:768px){
  .rr-buycard{display:grid; grid-template-columns:1fr auto; align-items:center; column-gap:12px}
  .rr-buycard > .product-status{grid-column:2; grid-row:1; margin:0 !important}
  .rr-buycard > .price{grid-column:1; grid-row:1; margin:0 !important}
  .rr-buycard > .options, .rr-buycard > .alert-alt, .rr-buycard > .addcart, .rr-buycard > .rr-bc-note{grid-column:1 / -1}
}
.rr-buycard .priceBig{margin:0}
.rr-buycard .addcart{margin-top:12px; margin-bottom:0}
.rr-bc-note{display:flex; align-items:center; gap:7px; margin-top:11px; font-size:12.8px; color:var(--rr-soft)}
.rr-bc-note svg{color:var(--rr-orange-deep); flex:0 0 auto}
#product .rr-shipgrid{margin:0 0 14px; gap:0; background:#fff; border:1px solid var(--rr-line); border-radius:12px;
  overflow:hidden; display:block}
#product .rr-shiprow{border:0; border-bottom:1px solid var(--rr-line); border-radius:0; padding:11px 14px; box-shadow:none; margin:0}
#product .rr-shiprow:last-child{border-bottom:0}
.rr-specmini{background:#fff; border:1px solid var(--rr-line); border-radius:12px; padding:8px 16px 12px; margin-top:16px}
.rr-sm-title{display:block; font-size:15px; font-weight:800; color:var(--rr-ink); padding:6px 0 4px}
.rr-specmini table{width:100%; border-collapse:collapse; font-size:13.3px; margin:0}
.rr-specmini td{padding:6.5px 0; border-bottom:1px solid var(--rr-line); vertical-align:top}
.rr-specmini td:first-child{color:var(--rr-soft); width:46%; padding-right:10px}
.rr-specmini tr:last-child td{border-bottom:0}
.rr-alllink{display:inline-block; margin-top:6px; font-size:13px; font-weight:700; color:var(--rr-blue-deep)}
.rr-alllink:hover{color:var(--rr-orange-deep)}
.rr-specmini p{font-size:13.5px; color:var(--rr-soft); margin:4px 0 6px}
/* v59.1: фікси — desc-section на всю ширину, панель мега в межах, кнопка Купити wide */
@media (min-width:992px){
  #content > .row:has(> #photo-wrap){flex-wrap:wrap}
  #content > .row:has(> #photo-wrap) > #desc-section{flex:0 0 100%; max-width:100%; width:100%}
  #menu #menu-list{overflow:hidden}
  #menu #menu-list > li .child-box{top:0 !important; bottom:0 !important; right:0 !important; left:346px !important;
    border-radius:0 14px 14px 0 !important}
}
.rr-buycard .addtocart-group{display:block !important; width:100%; margin:0}
.rr-buycard #button-cart{width:100%; display:block}
/* v59.2: каталог — доводка під макет (h1, чипи, крихти) */
.rr-h1-row h1{font-size:26px; font-weight:800; margin:4px 0 10px}
ul.breadcrumb{background:transparent !important; padding:14px 0 2px !important; margin:0 !important; font-size:13px; border:0 !important; box-shadow:none !important}
ul.breadcrumb > li > a{color:var(--rr-soft) !important}
ul.breadcrumb > li > a:hover{color:var(--rr-orange-deep) !important}
ul.breadcrumb > li.active, ul.breadcrumb > li{color:var(--rr-soft)}
ul.breadcrumb > li + li:before{color:var(--rr-line)}
.thumbnail.subcategory{padding:7px 14px}
.thumbnail.subcategory .name-wrapper{font-size:13.2px}
/* v59.3: сео-картка категорії (увага: клас теми з кирилічною «с»!) + пагінація як у макеті */
.сategory-description{background:#fff; border:1px solid var(--rr-line); border-radius:14px; padding:24px 28px; margin:8px 0 30px}
.сategory-description h2{font-size:18px; margin:16px 0 8px}
.сategory-description p, .сategory-description li{color:var(--rr-soft); font-size:14.3px}
.сategory-description img.img-thumbnail{border-radius:10px; border:1px solid var(--rr-line)}
.pagination > li > a, .pagination > li > span{min-width:36px; height:36px; display:inline-grid; place-items:center;
  border:1px solid var(--rr-line) !important; border-radius:9px !important; margin:0 3px; color:var(--rr-ink);
  background:#fff !important; padding:0 9px; line-height:1; font-size:14px}
.pagination > li.active > span{background:var(--rr-blue) !important; border-color:var(--rr-blue) !important; color:#fff !important}
.pagination > li > a:hover{border-color:var(--rr-orange) !important; color:var(--rr-orange-deep) !important}
.pagination-wrapper .text-right{color:var(--rr-soft); font-size:13px; padding-top:9px}
/* v59.4: липка шапка як у макеті (десктоп) + прибрати дубль-банер НП, якщо десь закешований */
@media (min-width:992px){
  header{position:sticky; top:0; z-index:900; background:#fff}
}
.custom-container{display:none !important}
/* v59.5: блок відгуків у картці */
.product-review{background:#fff; border:1px solid var(--rr-line); border-radius:12px; padding:18px 20px}
.product-review .rating-header{margin-top:0}

/* ═════════ v59.6: мета-рядок (зірки+бренд+код) під назвою + відгуки як у макеті ═════════ */
#product .raiting{display:inline-flex; align-items:center; gap:6px; margin:0 16px 10px 0; vertical-align:middle}
#product .raiting .stars .fa-star{color:#D9DFE8; font-size:14px; letter-spacing:1px}
#product .raiting .stars .fa-star.active{color:#FFC000}
#product .raiting a{color:var(--rr-soft); font-size:13px}
#product .raiting a:hover{color:var(--rr-orange-deep)}
#product .info-additional{display:inline-flex; vertical-align:middle; margin:0 0 10px}
#product .info-additional .row{margin:0}
#product .info-additional .col-sm-12{padding:0; float:none; width:auto; display:flex; flex-wrap:wrap; gap:4px 18px}
#product .info-additional .point{font-size:13px; color:var(--rr-soft); margin:0}
#product .info-additional .point b{font-weight:600; color:var(--rr-soft)}
#product .info-additional .point a{color:var(--rr-blue-deep)}
#product .info-additional .point a:hover{color:var(--rr-orange-deep)}
/* блок відгуків */
.product-review .rating-header, .product-review > div:first-child{font-size:18px; font-weight:800; color:var(--rr-ink)}
.item-review{border-bottom:1px solid var(--rr-line); padding:14px 0}
.item-review:last-of-type{border-bottom:0}
.item-review .table, .item-review td{border:0 !important}
.rr-rev-head{display:flex; gap:11px; align-items:center}
.rr-ava{width:38px; height:38px; border-radius:50%; background:#EAF3FC; color:var(--rr-blue-deep);
  display:grid; place-items:center; font-weight:800; font-size:15px; flex:0 0 auto}
.rr-rev-name{font-size:14.5px; color:var(--rr-ink)}
.rr-rev-meta{display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--rr-soft)}
.rr-rev-meta .stars .fa-star{color:#D9DFE8; font-size:12.5px; letter-spacing:1px}
.rr-rev-meta .stars .fa-star.active{color:#FFC000}
.item-review p{margin:9px 0 0; font-size:14px; color:var(--rr-ink); line-height:1.5}
.product-review a[href="#collapseOne"], .product-review a[data-toggle="collapse"]{display:inline-flex; align-items:center; gap:7px;
  border:1.5px solid var(--rr-blue); color:var(--rr-blue-deep); border-radius:9px; padding:8px 16px; font-weight:700; font-size:13.5px; margin-top:6px}
.product-review a[data-toggle="collapse"]:hover{border-color:var(--rr-orange); color:var(--rr-orange-deep)}
.product-review .well{background:var(--rr-bg); border:1px solid var(--rr-line); border-radius:12px; box-shadow:none; margin-top:12px}
/* v59.7: відгуки одним стовпчиком як у макеті (тема давала 2 колонки flex) */
#review{display:block !important}
.product-page .item-review{width:100% !important; background:transparent !important; border-radius:0; padding:14px 0}
/* v59.8: ряди відгуків/схожих випали з .container (борг верстки теми) — вирівнюємо по ширині контейнера */
.content-wrapper > .row:has(.product-review), .content-wrapper > .row:has(.related-products){margin-left:auto; margin-right:auto}
@media (min-width:1200px){ .content-wrapper > .row:has(.product-review), .content-wrapper > .row:has(.related-products){width:1160px} }
@media (min-width:992px) and (max-width:1199px){ .content-wrapper > .row:has(.product-review), .content-wrapper > .row:has(.related-products){width:970px} }
@media (min-width:768px) and (max-width:991px){ .content-wrapper > .row:has(.product-review), .content-wrapper > .row:has(.related-products){width:750px} }
/* крихти: симетричні відступи (було: багато зверху, впритул до фото знизу) */
ul.breadcrumb{padding:12px 0 !important; margin:0 0 6px !important}
/* v59.9: кнопка «Написати відгук» — біла з рамкою, текст видимий */
.product-review #write-review > a.btn{display:inline-flex !important; align-items:center; gap:7px; width:auto !important; height:auto !important;
  background:#fff !important; background-image:none !important; border:1.5px solid var(--rr-blue) !important; color:var(--rr-blue-deep) !important;
  border-radius:9px !important; padding:9px 16px !important; font-weight:700; font-size:13.5px !important; line-height:1.2 !important;
  text-shadow:none !important; box-shadow:none !important; text-indent:0 !important; overflow:visible !important}
.product-review #write-review > a.btn:hover{border-color:var(--rr-orange) !important; color:var(--rr-orange-deep) !important}
.product-review #write-review > a.btn .fa{font-size:13px}

/* ═════════ v60: мета всередині buy-картки + відгуки табом + каталог-доводка ═════════ */
.rr-bc-meta{display:flex; flex-wrap:wrap; align-items:center; gap:6px 16px; margin:0 0 12px; padding:0 0 12px; border-bottom:1px solid var(--rr-line)}
@media (min-width:768px){
  .rr-buycard > .rr-bc-meta{grid-column:1 / -1; grid-row:1}
  .rr-buycard > .price{grid-row:2 !important; grid-column:1}
  .rr-buycard > .product-status{grid-row:2 !important; grid-column:2}
}
.rr-bc-meta .raiting{display:inline-flex; align-items:center; gap:6px; margin:0 !important}
.rr-bc-meta .info-additional{display:inline-flex; margin:0 !important}
/* відгуки в табі — без подвійної картки і дубль-заголовка */
.tab-pane .product-review{border:0 !important; background:transparent !important; padding:0 !important; margin:0 !important; box-shadow:none}
.tab-pane .product-review .panel-heading{display:none}
/* каталог: розділювачі між групами фільтрів як у макеті */
.ocf-filter{border-bottom:1px solid var(--rr-line); padding-bottom:12px; margin-bottom:12px}
.ocf-filter-list > .ocf-filter:last-of-type, .ocf-filter:last-child{border-bottom:0}
/* чипи підкатегорій: компактні, білі, менший відступ знизу */
.thumbnail.subcategory{padding:6px 12px; background:#fff !important; box-shadow:none !important; border-radius:99px}
.thumbnail.subcategory .name-wrapper{font-size:13px; padding:0; height:auto !important; line-height:1.3}
#content > .row:has(> div > .thumbnail.subcategory){gap:8px; margin:0 0 12px}
.rr-h1-row h1{margin:2px 0 10px}
/* тулбар: підписи до сортування/кількості як у макеті */
.products-filter #sort-button, .products-filter #limit-button{display:inline-flex; align-items:center}
#sort-button::before{content:"Сортування:"; font-size:13px; color:var(--rr-soft); margin-right:7px; white-space:nowrap}
#limit-button::before{content:"Показати:"; font-size:13px; color:var(--rr-soft); margin:0 7px 0 12px; white-space:nowrap}
html[lang="ru"] #sort-button::before{content:"Сортировка:"}
html[lang="ru"] #limit-button::before{content:"Показывать:"}
/* v60.1: модалка кошика — рядкова розкладка товару як у макеті */
#modal-cart .product > .row{display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; margin:0}
#modal-cart .product > .row::before, #modal-cart .product > .row::after{display:none; content:none}
#modal-cart .product > .row > .col-sm-6{width:100% !important; float:none; padding:0}
#modal-cart .product > .row > .col-sm-6:first-child{display:flex; align-items:center; gap:10px}
#modal-cart .product .image{float:none !important; margin:0 !important; flex:0 0 auto}
#modal-cart .product .image img{display:block}
#modal-cart .product .name{flex:1 1 auto; min-width:0}
#modal-cart .product .name.cartCell, #modal-cart .product .cartCellContent{display:block; height:auto !important}
#modal-cart .product > .row > .col-sm-6:last-child > .row{display:flex; align-items:center; gap:12px; margin:0; padding-left:62px; width:100%}
#modal-cart .product > .row > .col-sm-6:last-child > .row::before,
#modal-cart .product > .row > .col-sm-6:last-child > .row::after{display:none; content:none}
#modal-cart .product .col-xs-5, #modal-cart .product .col-xs-2{width:auto !important; padding:0 !important; float:none !important}
#modal-cart .product .pprice .cartCellContent{font-weight:800; font-size:15px; white-space:nowrap}
#modal-cart .product .col-xs-2{margin-left:auto}
#modal-cart .popup-quantity{width:112px}
#modal-cart .popup-quantity .btn{background:var(--rr-bg); border:1px solid var(--rr-line); color:var(--rr-ink)}
#modal-cart .popup-quantity .btn:hover{background:var(--rr-orange-tint, #FEF1E4); color:var(--rr-orange-deep)}
#modal-cart .popup-quantity input{border:1px solid var(--rr-line); text-align:center}
#modal-cart .fa-trash-o{color:var(--rr-soft)}
#modal-cart a:hover .fa-trash-o{color:#D9534F}
/* v60.2: buy-картка компактніша + пікер кількості −/1/+ поруч із «Купити» */
.rr-buycard{padding:14px 16px !important}
.rr-bc-meta{margin:0 0 10px !important; padding:0 0 10px !important}
.rr-buycard .addcart{margin-top:10px !important}
.rr-buycard .addcart .row{display:flex; align-items:stretch; gap:10px; margin:0}
.rr-buycard .addcart .row::before, .rr-buycard .addcart .row::after{display:none; content:none}
.rr-buycard .addcart .col-lg-12{padding:0; width:100%; float:none; display:flex; gap:10px; align-items:stretch}
.rr-qtybox{display:inline-flex; border:1px solid var(--rr-line); border-radius:10px; overflow:hidden; flex:0 0 auto; background:#fff}
.rr-qtybox button{width:38px; border:0; background:var(--rr-bg); font-size:17px; cursor:pointer; color:var(--rr-ink); line-height:1}
.rr-qtybox button:hover{background:#FEF1E4; color:var(--rr-orange-deep)}
.rr-qtybox input{width:46px !important; text-align:center; border:0 !important; font:inherit; font-weight:700; background:#fff;
  height:auto !important; box-shadow:none !important; border-radius:0 !important; padding:8px 2px !important}
.rr-buycard .addtocart-group{flex:1 1 auto; width:auto !important; display:block !important}
.rr-buycard #button-cart{height:100%}
.rr-bc-note{margin-top:9px !important; font-size:12.5px}
.rr-buycard .priceBig span{font-size:28px}
/* v60.3: пікер кількості праворуч від ціни, «Купити» на всю ширину */
@media (min-width:768px){
  .rr-buycard{grid-template-columns:auto 1fr auto}
  .rr-buycard > .price{grid-row:2 !important; grid-column:1 !important}
  .rr-buycard > .product-status{grid-row:2 !important; grid-column:2 !important; justify-self:start; align-self:center; margin-left:8px !important}
  .rr-buycard > .rr-qtybox{grid-row:2; grid-column:3; align-self:center; justify-self:end}
}
@media (max-width:767px){
  .rr-buycard > .rr-qtybox{margin-top:8px}
}
.rr-buycard .addcart .col-lg-12{display:block}
.rr-buycard .addtocart-group{width:100% !important}
.rr-buycard #button-cart{height:auto; width:100%}
/* v60.4: кнопка «Купити» гарантовано на всю ширину */
.rr-buycard .addcart, .rr-buycard .addcart .row, .rr-buycard .addcart .col-lg-12,
.rr-buycard .addtocart-group{width:100% !important; max-width:none !important; display:block !important; float:none !important}
.rr-buycard #button-cart{width:100% !important; max-width:none !important; display:block !important; float:none !important; height:auto !important}
/* v60.5: наявність у мета-рядку; ціна+пікер поруч по центру; зірки завжди жовті + «N відгуків»; місце під стару ціну */
@media (min-width:768px){
  .rr-buycard{grid-template-columns:auto auto 1fr}
  .rr-buycard > .price{grid-row:2 !important; grid-column:1 !important}
  .rr-buycard > .rr-qtybox{grid-row:2 !important; grid-column:2 !important; margin-left:16px; justify-self:start; align-self:center}
  .rr-buycard > .raiting{grid-row:2; grid-column:3; margin:0 0 0 16px !important; align-self:center; justify-self:start}
}
.rr-bc-meta .product-status{margin:0 !important; padding:0 !important; font-size:13.5px; font-weight:700; background:none !important; border:0 !important}
.rr-bc-meta .product-status.green{color:#2E9E5B !important}
.rr-bc-meta .product-status.red{color:#D9534F !important}
.rr-buycard .raiting{display:inline-flex; align-items:center; gap:7px}
.rr-buycard .raiting .stars .fa-star{color:#FFC000 !important; font-size:14px}
.rr-buycard .raiting a{font-size:13px; color:var(--rr-soft); white-space:nowrap}
.rr-buycard .raiting a:hover{color:var(--rr-orange-deep)}
.rr-buycard #sm-comments::before, .rr-buycard #sm-comments::after{content:none !important; display:none !important}
.rr-buycard #sm-comments i, .rr-buycard .raiting .fa-comment, .rr-buycard .raiting .fa-comments,
.rr-buycard .raiting .fa-comment-o, .rr-buycard .raiting .fa-commenting{display:none !important}
.rr-buycard .priceBig .price-old{display:block; font-size:14px; color:var(--rr-soft); text-decoration:line-through; font-weight:600; margin:0 0 1px}
.rr-buycard .priceBig .price-new{font-size:28px}

/* ═════════ v61: компакт-шапка, лінії, зазори, мега-доводка, радіуси галереї ═════════ */
@media (min-width:992px){
  .logo-line{padding:8px 0 !important; gap:18px}
  #logo{margin:0 !important; padding:0 !important}
  .menu-background{margin-bottom:0 !important}
  .menu-background .menu-line{margin:0 !important}
  .menu-background .menu-line .menu-box{padding:0 15px !important}
  #menu .btn-menu{margin:4px 0 !important; padding:8px 16px !important; font-size:13.5px}
  .content-wrapper{padding-top:0 !important}
  #menu #menu-list > li > a{padding:6.5px 12px !important; font-size:13.4px}
  #menu #menu-list .child-box .see-all-categories{display:none !important}
  #menu #menu-list .rr-allcat{display:block; column-span:all; margin:0 0 12px !important; padding:0 0 10px; border-bottom:1px solid var(--rr-line)}
}
ul.breadcrumb{margin:0 0 4px !important; padding:14px 0 !important}
ul.breadcrumb > li:first-child{padding-left:0}
#photo-wrap .thumbnails{background:#fff; border:1px solid var(--rr-line); border-radius:14px; padding:14px; margin:0 0 14px}
#photo-wrap .main-image img{border-radius:10px}
#photo-wrap .images-additional{margin-top:10px}
#photo-wrap .images-additional .thumbnail{border-radius:9px; overflow:hidden; border:1.5px solid var(--rr-line); padding:2px; margin:0 6px 6px 0}
#photo-wrap .images-additional .thumbnail:hover{border-color:var(--rr-orange)}
#photo-wrap .images-additional .thumbnail img{border-radius:6px}
/* v61.1: точне зведення ліній + прибрати мобільний блок-прокладку на десктопі */
@media (min-width:992px){
  .logo-line{padding-left:15px !important; padding-right:15px !important}
  #selafomove > .row:first-child{display:none}
}
/* v61.2: примари clearfix у flex-рядку лого (той самий баг утретє!), прокладки, зазори */
@media (min-width:992px){
  .logo-line::before, .logo-line::after{display:none !important; content:none !important}
  .logo-line{padding-left:15px !important; padding-right:15px !important; gap:18px !important}
  .logo-line > .visible-xs, .logo-line > .visible-sm{display:none !important}
  #selafomove{display:none !important}
  .content-wrapper > .container{margin-top:0 !important; padding-top:0 !important}
}
/* v61.3: фінальне зведення ліній і вертикалі */
@media (min-width:992px){
  .logo-line{padding:6px 15px 6px 5px !important}
  .logo-line > div, .logo-line #search, .logo-line .search-box{margin:0 !important}
  .menu-background .menu-line .menu-box{padding:0 9px !important}
  div:has(> ul.breadcrumb){margin-top:0 !important; padding-top:0 !important}
}
ul.breadcrumb{padding:14px 0 !important; margin:0 0 4px !important}
/* v61.4: sticky-колонка під нову висоту шапки */
@media (min-width:992px){
  #content > .row:has(> #photo-wrap) > #product{top:197px !important}
}