/* Вітрина ізольована від звичайних категорій і F20. */
.category-showcase{--cs-orange:#f47b20;--cs-header:100px;padding-bottom:40px}
.category-showcase [hidden]{display:none!important}
.cs-layout{display:grid;grid-template-columns:270px minmax(0,1fr);gap:30px;width:1250px;max-width:100%;margin:0 auto;padding:0}
.category-showcase a:focus-visible,.category-showcase button:focus-visible{outline:2px solid var(--cs-orange);outline-offset:3px}
.cs-main{min-width:0}
.cs-sidebar{position:sticky;top:var(--cs-header);align-self:start;border:1px solid #e4e5e6;border-radius:8px;background:#fff;max-height:calc(100vh - var(--cs-header) - 20px);display:flex;flex-direction:column;min-width:0}
.cs-sidebar-heading{display:flex;align-items:center;justify-content:space-between;padding:18px 16px;border-bottom:1px solid #eee}
.cs-sidebar-heading h2{font-size:18px;margin:0}
.cs-tree{overflow-y:auto;overscroll-behavior:contain;padding:8px;min-height:0}
.cs-tree-list{list-style:none;margin:0;padding:0}
.cs-tree-list .cs-tree-list{padding-left:12px}
.cs-tree-row{display:flex;align-items:center;border-radius:5px}
.cs-tree-row a{flex:1;padding:10px 8px;min-width:0;font-size:14px;line-height:1.35;color:#323d46;overflow-wrap:anywhere}
.cs-tree-row.is-current{background:#fff4ec}
.cs-tree-row.is-current a{color:#d9610b;font-weight:600}
.cs-tree-toggle{flex:none;width:32px;height:36px;border:0;background:none;font-size:24px;cursor:pointer}
.cs-tree-toggle[aria-expanded=true]{transform:rotate(90deg)}
.cs-close,.cs-open{display:none}
.cs-title-row{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.cs-title-row .category__title{margin:0;font-size:28px}
.category-showcase .category__title::before{display:none}
.cs-back{font-size:32px;color:#59656e;line-height:1}
.cs-tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.cs-tile{min-width:0;text-align:center;color:#323d46;border:1px solid #e8eaec;border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:8px}
.cs-tile:hover{border-color:var(--cs-orange)}
.cs-tile-image{position:relative;aspect-ratio:1;display:flex;align-items:center;justify-content:center}
.cs-tile-image img{display:block;width:100%;height:100%;object-fit:contain;max-width:180px}
.cs-stock{position:absolute;right:0;top:0;width:9px;height:9px;border-radius:50%;background:#36a957;box-shadow:0 0 0 3px #fff}
.cs-tile-name{font-size:13px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cs-tiles-toggle{display:block;width:100%;padding:12px;margin:16px 0 0;background:#f6f7f8;border:1px solid #e2e5e7;border-radius:6px;cursor:pointer;color:#323d46}
.cs-chip-hold{position:relative;margin:28px 0 20px;scroll-margin-top:calc(var(--cs-header) + 12px)}
.cs-chips{display:grid;grid-auto-flow:column;grid-template-rows:1fr;grid-auto-columns:max-content;justify-content:start;gap:8px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:thin;overscroll-behavior-x:contain}
.cs-chip{border:1px solid #ddd;border-radius:6px;white-space:nowrap;background:#fff;padding:10px 14px;font-size:14px;cursor:pointer;color:#323d46}
.cs-chip.is-active{border-color:var(--cs-orange);background:#fff4ec}
.cs-chip.is-pending{opacity:.6}
.cs-chip-edge{position:absolute;top:0;height:calc(var(--cs-chip-height,44px) + 8px);z-index:1;width:52px;display:flex;justify-content:center;align-items:center;border:0;padding:0;font-size:0;color:#f47b20;cursor:pointer;touch-action:manipulation}
.cs-chip-edge::before{content:'';width:11px;height:11px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.cs-chip-edge--left::before{transform:rotate(225deg)}
.cs-chip-edge--right{right:0;background:linear-gradient(90deg,transparent,#fff 65%)}
.cs-chip-edge--left{left:0;background:linear-gradient(90deg,#fff 65%,transparent)}
.cs-section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 18px}
.cs-section-heading h2{border-left:4px solid var(--cs-orange);padding-left:12px;font-size:22px;margin:0;overflow-wrap:anywhere}
.cs-section-heading>a{color:#e96e16;white-space:nowrap;font-size:14px}
.cs-count{font-size:14px;color:#777;margin-left:10px}
.cs-products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:start}
.category-showcase .cs-products>.product{min-width:0;width:100%;margin:0}
.category-showcase .product__wrapper{min-width:0;width:100%}
.category-showcase .product__additional-button{display:flex;align-items:center;justify-content:center;width:100%;max-width:100%}
.category-showcase .product__additional-attribute{gap:8px}
.category-showcase .product__additional-attribute_parameter,.category-showcase .product__additional-attribute_value{min-width:0;overflow-wrap:anywhere;word-break:break-word}
.category-showcase .product__title{overflow-wrap:anywhere}
.category-showcase .product__image{min-width:0;width:100%}
.category-showcase .product__image-item{max-width:100%;object-fit:contain}
.category-showcase .product__variants{max-width:100%;overflow:hidden}
.cs-feedback{padding:10px 12px;margin-bottom:16px;background:#fff4ec;border-radius:6px;font-size:14px}
.cs-feedback button,.cs-feedback a{margin-left:12px;color:#d9610b}
.cs-retry{background:none;border:0;text-decoration:underline;cursor:pointer}
.cs-empty{padding:20px;background:#f6f7f8}
.cs-description{margin-top:40px;overflow-wrap:anywhere}
.cs-description img,.cs-video img{max-width:100%;height:auto}
.cs-video{margin-top:30px}
@media(min-width:1025px) and (max-width:1134px){.category-showcase .cs-products{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1024px){
 .cs-layout{display:block;padding:0 15px}
 .cs-title-row .category__title{font-size:20px}
 .cs-open{display:block;background:#f6f7f8;border:1px solid #ddd;border-radius:6px;padding:10px 14px;margin:0 0 18px;font-size:14px;cursor:pointer}
 .cs-sidebar{position:fixed;left:0;top:0;bottom:0;width:86vw;max-width:340px;max-height:none;border-radius:0;z-index:20002;transform:translateX(-105%);visibility:hidden;transition:transform .2s}
 .cs-sidebar.is-open{transform:translateX(0);visibility:visible}
 .cs-close{display:block;background:none;border:0;font-size:30px;width:36px;height:36px;cursor:pointer}
 .cs-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);border:0;z-index:20001}
 .cs-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
 .cs-tile-name{font-size:12px;-webkit-line-clamp:3}
 .cs-chips{grid-template-rows:repeat(2,auto)}
 .category-showcase .cs-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .cs-section-heading h2{font-size:18px}
 .cs-section-heading>a{font-size:12px}
 .category-showcase .product__additional{display:block;position:static;width:auto;min-width:0;box-shadow:none}
 .category-showcase .product__additional-attributes{display:none}
 .category-showcase .product__price-row{flex-wrap:wrap;gap:4px}
 .category-showcase .product__price{font-size:18px}
 .category-showcase .product__price-old{font-size:12px}
}
@media(max-width:576px){
 .cs-tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 .cs-tile{padding:8px;gap:6px}
 .cs-products{gap:8px}
 .category-showcase .product__wrapper{padding:62px 8px 8px}
 .category-showcase .product__title{font-size:12px;line-height:1.35}
 .category-showcase .product__rating-total{font-size:10px}
 .cs-section-heading{flex-wrap:wrap}
 .cs-chip{font-size:12px;padding:9px 12px}
}
@media(prefers-reduced-motion:reduce){.cs-sidebar{transition:none}}
