/* YouthTRACE Site Builder: shop pieces (search, cart button + drawer, shop with filters, product cards, sliders, category cards).
 * Class names "ytb-…" and variables "--ytb-…" are kept from YouthTRACE Branding 1.2 so styled pages keep their look.
 *
 * Weights: Elementor Site Settings style every button, link, heading and field with ".elementor-kit-N button" (0,1,1)
 * and ":hover" (0,2,1). Rules that must beat those are written "html button.x" / "html body .x" (0,1,2) and
 * "html button.x:hover" (0,2,2): stronger than the kit, weaker than a widget's Style controls ("{{WRAPPER}} .x", 0,2,0). */

/* defaults; site settings (Branding → Appearance or Site Builder → Shop) and widgets override them */
:where(.ytb,.ytb-portal){--ytb-acc:#0A75B8;--ytb-acch:#075E94;--ytb-acc2:#38BDF8;--ytb-soft:#E8F6FE;--ytb-ink:#075985;--ytb-bg:#FFFFFF;--ytb-sf2:#F3F5F7;--ytb-ln:#E2E6EA;--ytb-ln2:#C9CFD6;--ytb-mu:#5B6470;--ytb-tx:#111111;--ytb-r:14px;--ytb-font:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;--ytb-head:Archivo,Inter,system-ui,sans-serif;--ytb-warn:#8A4B00;--ytb-warnbg:#FEF3E2}
.ytb{font-family:var(--ytb-font);color:var(--ytb-tx);font-size:15px;line-height:1.5;box-sizing:border-box}
.ytb *,.ytb *::before,.ytb *::after{box-sizing:border-box}
.ytb img{max-width:100%;height:auto}
.ytb-i{flex:none;vertical-align:middle;display:inline-block}
.ytb-muted{color:var(--ytb-mu);font-size:13px}
.ytb-lock,.ytb-lock body{overflow:hidden}
.ytb [hidden],.ytb-portal [hidden]{display:none!important}

/* reset buttons and links in the shop pieces against theme / Elementor Site Settings styles */
html :is(.ytb-search,.ytb-search-layer,.ytb-shop,.ytb-filters,.ytb-drawer,.ytb-modal-head,.ytb-slider,.ytb-pc,.ytb-pager,.ytb-chips) button{background:none;border:0;border-radius:0;box-shadow:none;padding:0;margin:0;min-height:0;width:auto;height:auto;color:inherit;font:inherit;line-height:inherit;letter-spacing:normal;text-transform:none;text-decoration:none;cursor:pointer;-webkit-appearance:none;appearance:none}
html :is(.ytb-search,.ytb-search-layer,.ytb-shop,.ytb-filters,.ytb-drawer,.ytb-modal-head,.ytb-slider,.ytb-pc,.ytb-pager,.ytb-chips) button:is(:hover,:focus){background:none;color:inherit;border-color:transparent;box-shadow:none}
html :is(.ytb-search,.ytb-search-layer,.ytb-shop,.ytb-filters,.ytb-drawer,.ytb-slider) :focus-visible{outline:3px solid var(--ytb-acc2);outline-offset:2px}

/* buttons */
.ytb-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:calc(var(--ytb-r) - 4px);border:1px solid var(--ytb-ln2);background:var(--ytb-bg);color:var(--ytb-tx);font-weight:600;font-size:14px;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}
/* each one-class (0,1,2): beats the kit, loses to the widget's Style tab */
html button.ytb-fbtn,html a.ytb-drawer-view,html .ytb-drawer-empty a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:calc(var(--ytb-r) - 4px);border:1px solid var(--ytb-ln2);background:var(--ytb-bg);color:var(--ytb-tx);font-weight:600;font-size:14px;text-decoration:none;white-space:nowrap}
html button.ytb-fbtn:is(:hover,:focus),html a.ytb-drawer-view:is(:hover,:focus){border-color:var(--ytb-tx);background:var(--ytb-bg);color:var(--ytb-tx)}
html a.ytb-pc-btn,html a.ytb-drawer-go,html .ytb-filters-foot button.ytb-btn--acc,html .ytb-drawer-empty a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:calc(var(--ytb-r) - 4px);border:1px solid var(--ytb-acc);background:var(--ytb-acc);color:#fff;font-weight:600;font-size:14px;text-decoration:none;white-space:nowrap;text-align:center}
html a.ytb-pc-btn:is(:hover,:focus),html a.ytb-drawer-go:is(:hover,:focus),html .ytb-drawer-empty a:is(:hover,:focus){background:var(--ytb-acch);border-color:var(--ytb-acch);color:#fff}
.ytb-btn--block{display:flex!important;width:100%}
html .ytb-filters-head button{display:inline-flex;align-items:center;justify-content:center;padding:0;width:44px;min-width:44px;height:44px;border-radius:10px}
html button.ytb-link{background:none;border:0;padding:4px 2px;color:var(--ytb-acc);font-weight:600;text-decoration:underline;display:inline-flex;align-items:center;gap:4px;min-height:32px}
html button.ytb-link:is(:hover,:focus){background:none;color:var(--ytb-acch)}
.ytb-badges{position:absolute;left:8px;top:8px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;z-index:1}
.ytb-badges--r{left:auto;right:8px;align-items:flex-end}
.ytb-badge{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;border-radius:999px;padding:3px 9px;background:var(--ytb-sf2);color:var(--ytb-tx);line-height:1.4}
.ytb-badge--fast{background:var(--ytb-acc);color:#fff}
.ytb-badge--promo,.ytb-badge--promotion,.ytb-badge--new,.ytb-badge--clearance{background:var(--ytb-tx);color:#fff}
.ytb-badge--sale{background:#B42318;color:#fff}
.ytb-badge--out{background:var(--ytb-bg);color:var(--ytb-mu);border:1px solid var(--ytb-ln)}
.ytb-loading{color:var(--ytb-mu);padding:16px 0}
.ytb-warn{color:var(--ytb-warn);background:var(--ytb-warnbg);border-radius:8px;padding:8px 10px;font-size:13px;margin:8px 0}
.ytb-empty{padding:30px;text-align:center;color:var(--ytb-mu)}

/* ---------- search ---------- */
.ytb-search{position:relative;width:100%;max-width:var(--ytb-s-maxw,520px);margin:0}
.ytb-search-panel{position:relative}
.ytb-search-box{display:flex;align-items:center;gap:var(--ytb-s-gap,8px);min-height:var(--ytb-s-h,44px);border:1px solid var(--ytb-ln2);border-radius:999px;padding:0 6px 0 14px;background:var(--ytb-bg);color:var(--ytb-tx);transition:border-color .15s,box-shadow .15s}
.ytb-search--icon-after .ytb-search-box,.ytb-search--icon-none .ytb-search-box{padding-left:16px}
.ytb-search-box:focus-within{border-color:var(--ytb-acc);box-shadow:0 0 0 3px var(--ytb-soft)}
html .ytb-search-box input[type=search]{flex:1 1 auto;min-width:0;width:auto!important;height:auto!important;min-height:0!important;max-width:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;outline:0!important;background:transparent!important;padding:8px 0!important;margin:0!important;font:inherit;font-size:15px;line-height:1.3;color:var(--ytb-s-tx,var(--ytb-tx))!important;-webkit-appearance:none;appearance:none}
html .ytb-search-box input[type=search]::placeholder{color:var(--ytb-s-ph,var(--ytb-mu));opacity:1}
.ytb-search-box input[type=search]::-webkit-search-cancel-button,.ytb-search-box input[type=search]::-webkit-search-decoration{display:none;-webkit-appearance:none}
.ytb-search-ic{display:flex;flex:none;color:var(--ytb-mu);line-height:0}
html button.ytb-search-go{flex:none;display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;background:var(--ytb-acc);color:#fff;min-height:calc(var(--ytb-s-h,44px) - 10px);padding:0 14px;font-weight:700;font-size:14px;line-height:1}
html button.ytb-search-go:is(:hover,:focus){background:var(--ytb-acch);color:#fff}
html button.ytb-search-close{display:none;align-items:center;justify-content:center;border:0;background:none;color:var(--ytb-mu);padding:8px;line-height:0;border-radius:999px}
html button.ytb-search-close:is(:hover,:focus){background:rgba(127,127,127,.12);color:var(--ytb-tx)}
/* the icon that opens the search: a round button like the cart button, visible on light and dark headers */
html button.ytb-search-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;padding:0;line-height:0;border-radius:999px;border:1px solid var(--ytb-ln2);background:var(--ytb-bg);color:var(--ytb-tx)}
html button.ytb-search-toggle:is(:hover,:focus){background:var(--ytb-sf2);color:var(--ytb-tx);border-color:var(--ytb-ln2)}
.ytb-search-pop{position:absolute;z-index:1000;left:0;right:0;top:calc(100% + 6px);width:var(--ytb-s-popw,auto);min-width:min(320px,90vw);background:var(--ytb-bg);border:1px solid var(--ytb-ln);border-radius:14px;box-shadow:0 14px 40px rgba(0,0,0,.14);padding:6px;max-height:70vh;overflow:auto;text-align:left;color:var(--ytb-tx)}
html a.ytb-sr{display:flex;gap:10px;align-items:center;padding:8px;border-radius:10px;text-decoration:none;color:var(--ytb-tx);background:none}
html a.ytb-sr:is(:hover,:focus),html a.ytb-sr.is-on{background:var(--ytb-sf2);color:var(--ytb-tx)}
.ytb-sr img{width:var(--ytb-s-img,48px);height:var(--ytb-s-img,48px);object-fit:contain;border-radius:8px;background:var(--ytb-sf2);flex:none}
.ytb-sr-t{display:flex;flex-direction:column;flex:1;min-width:0}
.ytb-sr-t strong{font-weight:600;font-size:14px;line-height:1.3}
.ytb-sr small{color:var(--ytb-mu);font-size:12px}
.ytb-sr-p{font-size:14px;white-space:nowrap;font-weight:700}
html button.ytb-sr-all{display:block;width:100%;background:none;padding:10px;color:var(--ytb-acc);font-weight:700;text-align:left;border-radius:10px}
html button.ytb-sr-all:is(:hover,:focus){background:var(--ytb-sf2);color:var(--ytb-acc)}
.ytb-search-none{padding:12px;color:var(--ytb-mu)}
/* icon that opens a box under it */
.ytb-search--toggle,.ytb-search--overlay{width:auto;display:inline-block}
html .ytb-search--toggle button.ytb-search-toggle,html .ytb-search--overlay button.ytb-search-toggle{display:inline-flex}
.ytb-search--toggle .ytb-search-panel{display:none;position:absolute;z-index:1001;top:calc(100% + 8px);right:0;width:var(--ytb-s-dropw,min(420px,90vw))}
.ytb-search--toggle .ytb-search-box{box-shadow:0 12px 32px rgba(0,0,0,.16)}
.ytb-search--toggle.is-open .ytb-search-panel{display:block}
.ytb-search--overlay .ytb-search-panel{display:none}
@media (max-width:767px){
	.ytb-search--m-toggle,.ytb-search--m-overlay{width:auto;display:inline-block}
	.ytb-search--m-box{width:100%;display:block}
	html .ytb-search--m-box button.ytb-search-toggle{display:none}
	.ytb-search--m-box .ytb-search-panel{display:block;position:relative;width:auto;top:0}
	html .ytb-search--m-toggle button.ytb-search-toggle,html .ytb-search--m-overlay button.ytb-search-toggle{display:inline-flex}
	.ytb-search--m-toggle .ytb-search-panel{display:none;position:absolute;z-index:1001;top:calc(100% + 8px);right:0;width:min(92vw,420px)}
	.ytb-search--m-toggle.is-open .ytb-search-panel{display:block}
	.ytb-search--m-overlay .ytb-search-panel{display:none}
}
/* full-screen search */
.ytb-search-layer{position:fixed;inset:0;z-index:100001;display:flex;justify-content:center;align-items:flex-start;padding:max(16px,6vh) 16px 16px}
.ytb-search-layer-bg{position:absolute;inset:0;background:var(--ytbp-overlay,rgba(17,17,17,.6));backdrop-filter:blur(var(--ytbp-blur,4px))}
.ytb-search-layer .ytb-search-panel{display:block!important;position:relative;width:min(var(--ytbp-w,640px),100%)}
.ytb-search-layer .ytb-search-box{background:var(--ytbp-bg,var(--ytb-bg));min-height:56px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
html .ytb-search-layer button.ytb-search-close{display:inline-flex}
.ytb-search-layer .ytb-search-pop{position:relative;top:8px;max-height:calc(100vh - 160px)}

/* ---------- cart button ---------- */
html button.ytb-cartbtn{position:relative;display:inline-flex;align-items:center;gap:var(--ytb-cb-gap,8px);min-height:44px;padding:0 14px;margin:0;border-radius:999px;border:1px solid var(--ytb-ln2);background:var(--ytb-bg);color:var(--ytb-tx);font-family:var(--ytb-font);font-size:15px;font-weight:600;line-height:1.2;letter-spacing:normal;text-transform:none;box-shadow:none;cursor:pointer;width:auto;transition:background .15s,color .15s,border-color .15s}
html button.ytb-cartbtn:is(:hover,:focus){background:var(--ytb-sf2);color:var(--ytb-tx);border-color:var(--ytb-ln2)}
.ytb-cartbtn-ic{display:inline-flex;line-height:0;position:relative}
.ytb-cartbtn-l{white-space:nowrap}
.ytb-cartbtn-t{font-weight:700;white-space:nowrap}
.ytb-cartbtn-n{min-width:20px;height:20px;border-radius:10px;background:var(--ytb-acc);color:#fff;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;line-height:1}
.ytb-cartbtn--badge .ytb-cartbtn-ic .ytb-cartbtn-n{position:absolute;top:var(--ytb-badge-y,-9px);right:var(--ytb-badge-x,-11px);box-shadow:0 0 0 2px var(--ytb-bg)}
.ytb-cartbtn--brackets .ytb-cartbtn-n{background:none;color:inherit;font-size:inherit;padding:0;min-width:0;height:auto;font-weight:inherit}

/* ---------- pop-ups (cart drawer) ---------- */
.ytb-modal{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center}
.ytb-modal-bg{position:absolute;inset:0;background:var(--ytbp-overlay,rgba(17,17,17,.55));backdrop-filter:blur(var(--ytbp-blur,0px))}
.ytb-modal-box{position:relative;background:var(--ytbp-bg,var(--ytb-bg));color:var(--ytbp-tx,var(--ytb-tx));font-family:var(--ytbp-font,var(--ytb-font));font-size:var(--ytbp-fs,inherit);border-radius:var(--ytbp-r,var(--ytb-r));width:min(var(--ytbp-w,560px),calc(100vw - 24px));max-height:calc(100vh - 24px);display:flex;flex-direction:column;box-shadow:var(--ytbp-shadow,0 20px 60px rgba(0,0,0,.25));outline:none}
.ytb-modal--side{justify-content:flex-end;align-items:stretch}
.ytb-modal--side .ytb-modal-box{width:min(var(--ytbp-side-w,440px),100vw);max-height:none;height:100%;border-radius:0;animation:ytb-in-r .22s ease-out}
.ytb-modal--from-left{justify-content:flex-start}
.ytb-modal--from-left .ytb-modal-box{animation-name:ytb-in-l}
@keyframes ytb-in-r{from{transform:translateX(100%)}to{transform:none}}
@keyframes ytb-in-l{from{transform:translateX(-100%)}to{transform:none}}
.ytb-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px var(--ytbp-pad,18px);border-bottom:1px solid var(--ytbp-line,var(--ytb-ln));background:var(--ytbp-head-bg,transparent);color:var(--ytbp-head-tx,inherit)}
html body .ytb-modal-title{font-size:var(--ytbp-title-fs,18px);font-weight:var(--ytbp-title-fw,700);text-transform:var(--ytbp-title-tt,none);margin:0;color:inherit;font-family:var(--ytbp-font,var(--ytb-head));line-height:1.2;letter-spacing:normal}
html .ytb-modal-head button.ytb-x{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:transparent;color:var(--ytbp-close,currentColor)}
html .ytb-modal-head button.ytb-x:is(:hover,:focus){background:rgba(127,127,127,.15);color:var(--ytbp-close,currentColor)}
.ytb-modal-body{padding:16px var(--ytbp-pad,18px);overflow:auto;flex:1}
.ytb-modal-box .ytb-muted{color:var(--ytbp-mu,var(--ytb-mu))}
.ytb-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:100001;background:var(--ytb-tx);color:#fff;padding:12px 18px;border-radius:12px;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.25);transition:opacity .4s}
.ytb-toast--err{background:#B42318}
.ytb-toast.is-out{opacity:0}

/* ---------- drawer ---------- */
.ytb-drawer{display:flex;flex-direction:column;min-height:100%}
.ytb-drawer.is-busy{opacity:.6;pointer-events:none}
.ytb-drawer-list{flex:1}
.ytb-di{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--ytbp-line,var(--ytb-ln))}
.ytb-di img{width:64px;height:64px;object-fit:contain;border-radius:10px;background:var(--ytb-sf2);flex:none}
.ytb-di-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ytb-di-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.ytb-di-top strong{font-weight:700;font-size:14px;line-height:1.3}
html .ytb-di-top strong a{color:inherit;text-decoration:none}
.ytb-di-top>span{font-weight:700;white-space:nowrap;color:var(--ytbp-price,inherit)}
.ytb-di-act{display:flex;gap:14px;align-items:center;margin-top:6px;flex-wrap:wrap}
html .ytb-di-act :is(a,button){display:inline-flex;align-items:center;gap:4px;background:none;border:0;color:var(--ytb-acc);font-weight:600;font-size:13px;padding:0;min-height:32px;text-decoration:none}
html .ytb-di-act :is(a,button):is(:hover,:focus){color:var(--ytb-acch);background:none}
.ytb-qty{display:inline-flex;align-items:center;border:1px solid var(--ytb-ln2);border-radius:999px;overflow:hidden}
html .ytb-qty button{width:32px;height:32px;min-height:32px;justify-content:center;color:var(--ytb-tx)}
html .ytb-qty button:is(:hover,:focus){background:var(--ytb-sf2);color:var(--ytb-tx)}
.ytb-qty span{min-width:28px;text-align:center;font-weight:700;font-size:14px}
.ytb-drawer-foot{position:sticky;bottom:0;background:var(--ytbp-foot-bg,var(--ytbp-bg,var(--ytb-bg)));padding-top:12px;border-top:1px solid var(--ytbp-line,var(--ytb-ln))}
.ytb-drawer-tot{display:grid;grid-template-columns:1fr auto;gap:4px 0;margin:0 0 6px;font-size:14px}
.ytb-drawer-tot dt{color:var(--ytbp-mu,var(--ytb-mu));margin:0}
.ytb-drawer-tot dd{margin:0;padding-left:12px;text-align:right;font-weight:600;color:var(--ytbp-price,inherit)}
.ytb-drawer-tot .ytb-drawer-grand{font-size:var(--ytbp-grand-fs,17px);font-weight:800;color:var(--ytbp-tx,var(--ytb-tx));border-top:1px solid var(--ytbp-line,var(--ytb-ln));padding-top:6px;margin-top:2px}
.ytb-drawer-note{font-size:13px;color:var(--ytbp-mu,var(--ytb-mu));margin:0 0 8px}
.ytb-drawer-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 4px}
.ytb-drawer-btns--one{grid-template-columns:1fr}
html a.ytb-drawer-go{background:var(--ytbp-btn-bg,var(--ytb-acc));border-color:var(--ytbp-btn-bg,var(--ytb-acc));color:var(--ytbp-btn-tx,#fff);border-radius:var(--ytbp-btn-r,calc(var(--ytb-r) - 4px))}
html a.ytb-drawer-view{border-radius:var(--ytbp-btn-r,calc(var(--ytb-r) - 4px))}
.ytb-drawer-empty{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:40px 0;color:var(--ytbp-mu,var(--ytb-mu))}

/* ---------- product cards ---------- */
.ytb-cards{display:grid;grid-template-columns:repeat(var(--ytb-cols,auto-fill),minmax(min(var(--ytb-cmin,220px),100%),1fr));gap:var(--ytb-gap,16px)}
.ytb-cards--fixed{grid-template-columns:repeat(var(--ytb-cols,4),minmax(0,1fr))}
.ytb-pc{border:1px solid var(--ytb-ln);border-radius:var(--ytb-r);overflow:hidden;display:flex;flex-direction:column;background:var(--ytb-bg);color:var(--ytb-tx);transition:box-shadow .2s,transform .2s,border-color .2s;min-width:0}
html a.ytb-pc-img{position:relative;display:block;aspect-ratio:var(--ytb-img-ratio,1/1);background:var(--ytb-img-bg,var(--ytb-sf2));overflow:hidden}
.ytb-pc-img img{width:100%;height:100%;object-fit:var(--ytb-img-fit,contain);transition:transform .3s}
.ytb-pc:hover .ytb-pc-img img{transform:scale(var(--ytb-img-zoom,1))}
.ytb-pc-body{padding:12px;display:flex;flex-direction:column;gap:6px;flex:1}
.ytb-brand{font-size:12px;font-weight:700;color:var(--ytb-mu);text-transform:uppercase;letter-spacing:.06em}
.ytb-pc-code{font-size:12px;color:var(--ytb-mu)}
html body .ytb-pc-name{font-family:var(--ytb-font);font-weight:700;font-size:15px;line-height:1.3;margin:0;padding:0;color:var(--ytb-tx);text-transform:none;letter-spacing:normal}
html .ytb-pc-name a{color:inherit;text-decoration:none}
html .ytb-pc-name a:hover{color:var(--ytb-acc)}
.ytb-pc-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:8px;margin-top:auto}
.ytb-pc-price{font:800 18px var(--ytb-head);color:var(--ytb-tx)}
.ytb-pc-from{font:600 12px var(--ytb-font);color:var(--ytb-mu)}
.ytb-pc-price2{font-size:13px;color:var(--ytb-mu)}
.ytb-dots{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.ytb-dots span{width:14px;height:14px;border-radius:4px;border:1px solid rgba(0,0,0,.18)}
.ytb-dots em{font-size:12px;color:var(--ytb-mu);font-style:normal}
html a.ytb-pc-btn{margin-top:6px}

/* ---------- shop ---------- */
.ytb-shop{max-width:1280px;margin:0 auto;padding:16px 0 40px}
.ytb-shop.is-busy .ytb-cards{opacity:.5;pointer-events:none}
.ytb-shop-head{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;justify-content:space-between;margin-bottom:12px}
html body .ytb-shop .ytb-title{font-family:var(--ytb-head);font-size:28px;font-weight:800;line-height:1.2;margin:0 0 4px;color:var(--ytb-tx)}
.ytb-shop-count{margin:0}
.ytb-shop-desc{margin:4px 0 0;color:var(--ytb-mu)}
.ytb-shop-tools{display:flex;gap:8px;align-items:center}
.ytb-sort{display:inline-flex;align-items:center;gap:6px;font-size:14px;margin:0}
html .ytb-sort select{min-height:44px;height:44px;border:1px solid var(--ytb-ln2);border-radius:10px;padding:0 10px;background:var(--ytb-bg);color:var(--ytb-tx);font:inherit;width:auto;margin:0}
.ytb-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;align-items:center}
.ytb-chips:empty{display:none}
html button.ytb-chip{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;background:var(--ytb-soft);color:var(--ytb-ink);font-weight:600;font-size:13px;padding:0 12px;min-height:34px}
html button.ytb-chip:is(:hover,:focus){background:var(--ytb-soft);color:var(--ytb-ink);filter:brightness(.96)}
.ytb-shop-grid{display:grid;grid-template-columns:var(--ytb-fw,260px) minmax(0,1fr);gap:24px;align-items:start}
.ytb-shop--fs-right .ytb-shop-grid{grid-template-columns:minmax(0,1fr) var(--ytb-fw,260px)}
.ytb-shop--fs-right .ytb-filters{order:2}
.ytb-shop--f-none .ytb-shop-grid,.ytb-shop--f-button .ytb-shop-grid{grid-template-columns:minmax(0,1fr)}
.ytb-filters{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow:auto}
.ytb-shop-grid>.ytb-filters.ytb{padding:var(--ytb-fpad,0)}
.ytb-fg{border-bottom:1px solid var(--ytb-ln);padding:10px 0}
.ytb-fg summary{font-weight:700;cursor:pointer;list-style:none;min-height:32px;display:flex;align-items:center;justify-content:space-between;font-family:var(--ytb-head,inherit)}
.ytb-fg summary::-webkit-details-marker{display:none}
.ytb-fg summary::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin:0 4px 4px;transition:transform .15s;opacity:.6}
.ytb-fg[open] summary::after{transform:rotate(-135deg);margin-bottom:-2px}
.ytb-fg-b{display:flex;flex-direction:column;gap:2px;padding-top:6px}
.ytb-fg-sw{flex-direction:row;flex-wrap:wrap;gap:6px}
html button.ytb-fsw{display:flex;flex-direction:column;align-items:center;gap:3px;border:0;background:none;font-size:11px;width:58px;padding:2px;color:var(--ytb-tx)}
.ytb-fsw span{width:32px;height:32px;border-radius:9px;border:1px solid rgba(0,0,0,.2)}
.ytb-fsw.is-on span{outline:3px solid var(--ytb-acc);outline-offset:2px}
.ytb-fcheck{display:flex;gap:8px;align-items:center;min-height:34px;cursor:pointer;font-size:14px;margin:0;color:var(--ytb-tx)}
html .ytb-fcheck input[type=checkbox]{width:18px!important;height:18px!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;box-shadow:none!important;background:none!important;flex:none;accent-color:var(--ytb-acc);-webkit-appearance:checkbox;appearance:auto}
.ytb-fhex{display:inline-block;width:14px;height:14px;border-radius:4px;border:1px solid rgba(0,0,0,.2);flex:none}
.ytb-fcheck small,.ytb-fcat small{margin-left:auto;color:var(--ytb-mu);font-size:12px}
html button.ytb-fcat{display:flex;align-items:center;gap:8px;border:0;background:none;padding:6px 8px;border-radius:8px;text-align:left;min-height:36px;width:100%;color:var(--ytb-tx);font-size:14px}
html button.ytb-fcat:is(:hover,:focus){background:var(--ytb-sf2);color:var(--ytb-tx)}
html button.ytb-fcat.is-on{background:var(--ytb-soft);color:var(--ytb-ink);font-weight:700}
.ytb-frange{flex-direction:row;align-items:center;gap:6px}
html .ytb-frange input[type=number]{width:100%!important;min-height:40px!important;height:40px!important;border:1px solid var(--ytb-ln2)!important;border-radius:8px!important;padding:0 8px!important;background:var(--ytb-bg)!important;color:var(--ytb-tx)!important;box-shadow:none!important;font:inherit;margin:0!important}
.ytb-pager{display:flex;gap:6px;justify-content:center;margin:20px 0;flex-wrap:wrap}
html .ytb-pager button{min-width:44px;min-height:44px;border:1px solid var(--ytb-ln2);border-radius:10px;background:var(--ytb-bg);font-weight:600;color:var(--ytb-tx)}
html .ytb-pager button:is(:hover,:focus){border-color:var(--ytb-tx);background:var(--ytb-bg);color:var(--ytb-tx)}
html .ytb-pager button.is-on{background:var(--ytb-tx);color:#fff;border-color:var(--ytb-tx)}
/* filters button and pop-up */
html button.ytb-fbtn{display:none}
.ytb-fbtn-n{min-width:20px;height:20px;border-radius:10px;background:var(--ytb-acc);color:#fff;font-size:11px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}
.ytb-filters-head,.ytb-filters-foot{display:none}
html .ytb-shop--f-button button.ytb-fbtn{display:inline-flex}
.ytb-shop--f-button .ytb-shop-grid>.ytb-filters{display:none}
@media (max-width:1024px){
	.ytb-shop--bp-tablet .ytb-shop-grid{grid-template-columns:minmax(0,1fr)}
	.ytb-shop--bp-tablet .ytb-shop-grid>.ytb-filters{display:none}
	html .ytb-shop--bp-tablet.ytb-shop--f-sidebar button.ytb-fbtn{display:inline-flex}
}
@media (max-width:767px){
	.ytb-shop--bp-mobile .ytb-shop-grid{grid-template-columns:minmax(0,1fr)}
	.ytb-shop--bp-mobile .ytb-shop-grid>.ytb-filters{display:none}
	html .ytb-shop--bp-mobile.ytb-shop--f-sidebar button.ytb-fbtn{display:inline-flex}
	.ytb-shop-head{align-items:flex-start}
	.ytb-shop-tools{width:100%}
	.ytb-shop-tools .ytb-sort{margin-left:auto}
	.ytb-sort span{display:none}
	html body .ytb-shop .ytb-title{font-size:23px}
}
.ytb-filters-bg{position:fixed;inset:0;z-index:100000;background:var(--ytbp-overlay,rgba(17,17,17,.55));backdrop-filter:blur(var(--ytbp-blur,0px))}
.ytb-filters.is-pop{position:fixed!important;display:flex!important;flex-direction:column;z-index:100001;background:var(--ytbp-bg,var(--ytb-bg));color:var(--ytbp-tx,var(--ytb-tx));max-height:none;padding:0!important;transition:transform .22s ease-out;top:0;bottom:0;width:min(var(--ytbp-side-w,360px),92vw);overflow:hidden;box-shadow:var(--ytbp-shadow,0 20px 60px rgba(0,0,0,.25));font-family:var(--ytbp-font,var(--ytb-font))}
.ytb-filters.is-pop.ytb-filters--m-left{left:0;transform:translateX(-100%)}
.ytb-filters.is-pop.ytb-filters--m-right{right:0;transform:translateX(100%)}
.ytb-filters.is-pop.ytb-filters--m-bottom{left:0;right:0;top:auto;width:auto;max-height:85vh;border-radius:var(--ytbp-r,16px) var(--ytbp-r,16px) 0 0;transform:translateY(100%)}
.ytb-filters.is-pop.ytb-filters--m-full{left:0;right:0;width:auto;transform:translateY(16px);opacity:0;transition:transform .2s,opacity .2s}
.ytb-filters.is-pop.is-open{transform:none;opacity:1}
.ytb-filters.is-pop .ytb-filters-head{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 12px 12px var(--ytbp-pad,16px);border-bottom:1px solid var(--ytbp-line,var(--ytb-ln));background:var(--ytbp-head-bg,transparent);color:var(--ytbp-head-tx,inherit)}
.ytb-filters.is-pop .ytb-filters-head strong{font-size:var(--ytbp-title-fs,18px);font-weight:var(--ytbp-title-fw,700);text-transform:var(--ytbp-title-tt,none)}
html .ytb-filters-head button{background:transparent;border-color:transparent;color:var(--ytbp-close,currentColor)}
html .ytb-filters-head button:is(:hover,:focus){background:rgba(127,127,127,.15);border-color:transparent;color:var(--ytbp-close,currentColor)}
.ytb-filters.is-pop .ytb-filters-body{flex:1;overflow:auto;padding:0 var(--ytbp-pad,16px)}
.ytb-filters.is-pop .ytb-filters-foot{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:12px var(--ytbp-pad,16px);border-top:1px solid var(--ytbp-line,var(--ytb-ln));background:var(--ytbp-foot-bg,inherit)}
html .ytb-filters-foot button.ytb-btn--acc{flex:1;background:var(--ytbp-btn-bg,var(--ytb-acc));border-color:var(--ytbp-btn-bg,var(--ytb-acc));color:var(--ytbp-btn-tx,#fff);border-radius:var(--ytbp-btn-r,calc(var(--ytb-r) - 4px))}
/* column defaults per screen; :where() keeps them weaker than the widget settings */
@media (max-width:767px){:where(.ytb-shop) .ytb-cards{--ytb-cols:2;--ytb-gap:10px}.ytb-shop .ytb-cards{grid-template-columns:repeat(var(--ytb-cols),minmax(0,1fr))}}

/* ---------- product grid + slider ---------- */
:where(.ytb-pgrid) .ytb-cards{--ytb-cols:4}
@media (max-width:1024px){:where(.ytb-pgrid) .ytb-cards{--ytb-cols:3}}
@media (max-width:767px){:where(.ytb-pgrid) .ytb-cards{--ytb-cols:2;--ytb-gap:10px}}
.ytb-slider{position:relative}
.ytb-slider-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - (var(--ytb-per,4) - 1) * var(--ytb-gap,16px)) / var(--ytb-per,4));gap:var(--ytb-gap,16px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 0 6px;outline:0}
.ytb-slider-track::-webkit-scrollbar{display:none}
.ytb-slider-track>*{scroll-snap-align:start;min-width:0}
@media (max-width:1024px){:where(.ytb-slider){--ytb-per:3}}
@media (max-width:767px){:where(.ytb-slider){--ytb-per:1.3;--ytb-gap:12px}}
html button.ytb-slider-arrow{position:absolute;top:var(--ytb-arrow-top,40%);transform:translateY(-50%);z-index:2;width:var(--ytb-arrow-s,42px);height:var(--ytb-arrow-s,42px);border-radius:50%;border:1px solid var(--ytb-ln);background:var(--ytb-arrow-bg,var(--ytb-bg));color:var(--ytb-arrow-tx,var(--ytb-tx));display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.12);transition:opacity .2s,background .15s,color .15s;padding:0}
html button.ytb-slider-arrow:is(:hover,:focus){background:var(--ytb-arrow-bg,var(--ytb-bg));color:var(--ytb-arrow-tx,var(--ytb-tx));border-color:var(--ytb-ln2)}
.ytb-slider-prev{left:var(--ytb-arrow-x,-10px)}
.ytb-slider-next{right:var(--ytb-arrow-x,-10px)}
html button.ytb-slider-arrow:disabled{opacity:.35;cursor:default}
.ytb-slider.is-static .ytb-slider-arrow,.ytb-slider.is-static .ytb-slider-dots{display:none}
.ytb-slider-dots{display:flex;justify-content:center;gap:8px;margin-top:12px}
html .ytb-slider-dots button{width:var(--ytb-dot-s,8px);height:var(--ytb-dot-s,8px);min-height:0;border-radius:999px;border:0;padding:0;background:var(--ytb-dot,var(--ytb-ln2));transition:width .2s,background .2s}
html .ytb-slider-dots button:is(:hover,:focus){background:var(--ytb-dot-on,var(--ytb-acc))}
html .ytb-slider-dots button.is-on{background:var(--ytb-dot-on,var(--ytb-acc));width:calc(var(--ytb-dot-s,8px) * 3)}
@media (max-width:767px){html button.ytb-slider-arrow{display:var(--ytb-arrows-m,none)}}

/* ---------- category cards ---------- */
.ytb-cats-grid{display:grid;grid-template-columns:repeat(var(--ytb-cols),minmax(0,1fr));gap:var(--ytb-gap,16px)}
:where(.ytb-cats) .ytb-cats-grid{--ytb-cols:4}
@media (max-width:1024px){:where(.ytb-cats) .ytb-cats-grid{--ytb-cols:3}}
@media (max-width:767px){:where(.ytb-cats) .ytb-cats-grid{--ytb-cols:2;--ytb-gap:10px}}
html a.ytb-cc{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:var(--ytb-tx);background:var(--ytb-cc-bg,transparent);border-radius:var(--ytb-r);overflow:hidden;position:relative;transition:transform .2s,box-shadow .2s;text-align:var(--ytb-cc-align,left)}
.ytb-cc-media{position:relative;display:block;aspect-ratio:var(--ytb-cc-ratio,4/3);background:var(--ytb-sf2);border-radius:var(--ytb-cc-r,var(--ytb-r));overflow:hidden}
.ytb-cc-media img{width:100%;height:100%;object-fit:var(--ytb-cc-fit,cover);transition:transform .35s}
.ytb-cc:hover .ytb-cc-media img{transform:scale(var(--ytb-cc-zoom,1.05))}
.ytb-cc-overlay{position:absolute;inset:0;background:var(--ytb-cc-ov,transparent);transition:background .2s}
.ytb-cc:hover .ytb-cc-overlay{background:var(--ytb-cc-ov-h,var(--ytb-cc-ov,transparent))}
.ytb-cc--t-over .ytb-cc-overlay{background:var(--ytb-cc-ov,linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.6)))}
.ytb-cc-text{display:flex;flex-direction:column;gap:2px;padding:var(--ytb-cc-pad,0)}
.ytb-cc--t-over .ytb-cc-text{position:absolute;left:0;right:0;bottom:0;padding:var(--ytb-cc-pad,14px);color:var(--ytb-cc-over-tx,#fff);z-index:1}
.ytb-cc-name{font-weight:700;font-size:16px;font-family:var(--ytb-head)}
.ytb-cc-count,.ytb-cc-desc{font-size:13px;color:var(--ytb-mu)}
.ytb-cc--t-over .ytb-cc-count,.ytb-cc--t-over .ytb-cc-desc{color:inherit;opacity:.85}
.ytb-cc-btn{display:inline-block;margin-top:6px;font-weight:700;color:var(--ytb-acc)}
.ytb-cc-icon{display:inline-flex;align-items:center;justify-content:center;line-height:0;color:var(--ytb-cc-ic,var(--ytb-acc))}
.ytb-cc-icon svg,.ytb-cc-icon img{width:var(--ytb-cc-ic-s,40px);height:var(--ytb-cc-ic-s,40px)}
.ytb-cc--image_icon .ytb-cc-icon{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);background:var(--ytb-cc-ic-bg,rgba(255,255,255,.92));border-radius:var(--ytb-cc-ic-r,50%);padding:var(--ytb-cc-ic-pad,16px)}
.ytb-cc--t-over.ytb-cc--image_icon .ytb-cc-icon{top:42%}
html a.ytb-cc--icon,html a.ytb-cc--icon_title{align-items:var(--ytb-cc-items,center);text-align:var(--ytb-cc-align,center);padding:var(--ytb-cc-pad,18px 12px);border:1px solid var(--ytb-ln);background:var(--ytb-cc-bg,var(--ytb-bg))}
.ytb-cc--icon .ytb-cc-icon,.ytb-cc--icon_title .ytb-cc-icon{background:var(--ytb-cc-ic-bg,var(--ytb-soft));border-radius:var(--ytb-cc-ic-r,50%);padding:var(--ytb-cc-ic-pad,14px)}
.ytb-cc--icon_title .ytb-cc-count,.ytb-cc--icon_title .ytb-cc-desc{display:none}
html a.ytb-cc:hover{box-shadow:var(--ytb-cc-shadow-h,none);transform:translateY(var(--ytb-cc-lift,0));color:var(--ytb-tx)}
@media (prefers-reduced-motion:reduce){.ytb *{transition:none!important;animation:none!important}}
