/* fh-barvy-v15.css — T-085: = v14 (Barva = kolečka, návrh 1b; Tvar = panel dlaždic 2×2 nad pohovkou, Petr návrh 2). Pravidlo nul platí i bez JS. */
.filter-section-parametric-id-630 div:has(>:disabled){display:none}
.fhb-on>h4,.fhb-on .advanced-filters-wrapper{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap;margin:0!important;padding:0!important}
.fhb-btn{display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;height:52px;padding:0 14px;border:1px solid #e4e4e4;border-radius:0;background:#fff;color:#24242e;font:700 14px/18.2px NunitoFH,Nunito,sans-serif;cursor:pointer;white-space:nowrap}
.fhb-btn[aria-expanded=true]{color:#25878C;border-color:#25878C}
.fhb-btn:focus-visible,.fhb-c:focus-visible,.fhb-q:focus-visible,.fhb-go:focus-visible,.fhb-x:focus-visible{outline:2px solid #25878C;outline-offset:2px}
.fhb-dots{display:inline-flex}.fhb-dots i{width:10px;height:10px;border-radius:50%;margin-left:-3px;border:1px solid #fff;background:var(--c);background-size:cover}
.fhb-car{order:-1;display:inline-block;margin-right:2px;transition:transform .15s}.fhb-car::before{content:"\e904";font-family:ikony;font-size:9px;line-height:1}.fhb-btn[aria-expanded=true] .fhb-car{transform:rotate(180deg)}
.fhb-bd{display:none}
.fhb-p{position:absolute;z-index:1000;width:min(760px,calc(100vw - 32px));box-sizing:border-box;background:#fff;border:1px solid #e6e5e1;border-radius:16px;box-shadow:0 16px 40px rgba(19,44,60,.16);padding:20px 22px 18px;color:#132C3C;font-family:NunitoFH,Nunito,sans-serif;text-align:left}
.fhb-p[hidden],.fhb-bd[hidden]{display:none!important}
.fhb-hd{display:flex;justify-content:space-between;align-items:center;margin:0 0 12px}
.fhb-t{font-size:18px;font-weight:800;margin:0}
.fhb-hint{font-size:13px;color:#25878C;font-weight:700}
.fhb-hr{display:flex;align-items:center;gap:6px}
.fhb-cl{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;margin:-6px -10px -6px 0;padding:0;border:0;border-radius:50%;background:none;color:#132C3C;font:400 18px/1 sans-serif;cursor:pointer}
.fhb-cl:hover{background:#FAF8F4}
.fhb-cl:focus-visible{outline:2px solid #25878C;outline-offset:2px}
.fhb-g{display:grid;grid-template-columns:repeat(8,1fr);gap:12px 6px;margin:0;padding:0;list-style:none}
.fhb-it{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.fhb-c{position:relative;width:48px;height:48px;padding:0;border-radius:50%;border:1px solid rgba(19,44,60,.14);background:var(--c);background-size:cover;background-position:center;cursor:pointer;box-shadow:0 0 0 0 #25878C;transition:box-shadow .12s}
.fhb-c:hover{box-shadow:0 0 0 3px #fff,0 0 0 5px #e6e5e1}
.fhb-c[aria-pressed=true]{box-shadow:0 0 0 3px #fff,0 0 0 5px #25878C}
.fhb-c[aria-pressed=true]::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:7px;border:solid #fff;border-width:0 0 2.5px 2.5px;transform:translate(-50%,-65%) rotate(-45deg);filter:drop-shadow(0 0 1.5px rgba(0,0,0,.55))}
.fhb-l{display:flex;align-items:center;justify-content:center;gap:3px;margin-top:6px;font-size:13px;font-weight:700;line-height:1.2;white-space:nowrap}
.fhb-n{display:block;font-size:11px;color:#6b7378;font-weight:600;line-height:1.3}
.fhb-q{flex:0 0 auto;width:16px;height:16px;padding:0;border:1px solid #25878C;border-radius:50%;background:#fff;color:#25878C;font:700 10px/14px Nunito,inherit;cursor:pointer}
.fhb-q[aria-expanded=true]{background:#25878C;color:#fff}
.fhb-tip{position:absolute;z-index:3;top:100%;left:50%;margin-top:6px;width:210px;box-sizing:border-box;transform:translateX(calc(-50% + var(--dx,0px)));background:#132C3C;color:#fff;border-radius:10px;padding:10px 12px;font-size:13px;line-height:1.45;text-align:left;box-shadow:0 8px 20px rgba(19,44,60,.25);white-space:normal}
.fhb-tip b{display:block;margin-bottom:4px}
.fhb-sh{display:inline-flex;align-items:center;gap:5px;margin:0 10px 2px 0;white-space:nowrap}
.fhb-sh i{width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 0 1px rgba(255,255,255,.5)}
.fhb-st{margin:16px 0 0;padding:12px 14px;background:#FAF8F4;border-radius:12px;font-size:13px;color:#4a5a63}
.fhb-st[hidden]{display:none}
.fhb-st p{margin:0 0 4px}.fhb-st p:last-child{margin:0}
.fhb-st b{color:#132C3C;margin-right:6px}
.fhb-st .fhb-sh i{box-shadow:0 0 0 1px rgba(19,44,60,.15)}
.fhb-ft{display:flex;justify-content:space-between;align-items:center;margin-top:16px;padding-top:14px;border-top:1px solid #e6e5e1}
.fhb-x{border:0;background:none;padding:6px 4px;color:#4a5a63;font:700 14px Nunito,inherit;text-decoration:underline;cursor:pointer}
.fhb-x[disabled]{opacity:.4;cursor:default}
.fhb-go{min-height:46px;padding:0 26px;border:0;border-radius:999px;background:#D1B26B;color:#fff;font:800 15px Nunito,inherit;cursor:pointer}
.fhb-go:hover{background:#B78D49;color:#fff}
.fhb-busy .fhb-g{opacity:.55;pointer-events:none}
.fhb-hand{display:none}
@media (max-width:767px){
.fhb-btn{width:calc(100% + 48px);margin:0 -24px;height:auto;padding:17px 24px;border:0;background:transparent;justify-content:flex-start}
.fhb-btn[aria-expanded=true]{border:0}
.fhb-bd{display:block;position:fixed;inset:0;z-index:2147483000;background:rgba(19,44,60,.45)}
.fhb-p{position:fixed;left:0!important;right:0;top:auto!important;bottom:0;z-index:2147483001;width:100%;max-height:88vh;overflow:auto;border-radius:20px 20px 0 0;padding:10px 18px calc(16px + env(safe-area-inset-bottom));border:0}
.fhb-cl{width:44px;height:44px;margin-right:-12px}
.fhb-hand{display:block;width:44px;height:5px;margin:0 auto 12px;border-radius:3px;background:#dcd9d2}
.fhb-g{grid-template-columns:repeat(4,1fr);gap:14px 4px}
.fhb-c{width:56px;height:56px}
.fhb-ft{position:sticky;bottom:calc(-16px - env(safe-area-inset-bottom));background:#fff;margin:14px -18px 0;padding:12px 18px 0}
.fhb-go{flex:1 1 auto;margin-left:16px}
}
/* v6 (Petr 1a1f7c98): jen Shoptet mobilní stránka (body.mobile) — filtry bez „Filtrovat“, jen Barva + Tvar jako pilulky, nic z DOM nemazat */
body.mobile #filters div.filtrovat{display:none!important}
body.mobile #filters .filter-sections{display:block!important}
body.mobile #filters .filter-sections>:not(#category-filter-hover){display:none!important}
body.mobile #category-filter-hover{display:flex!important;flex-wrap:wrap;align-items:flex-start;gap:10px;position:relative;padding:12px 0 4px;margin:0}
body.mobile #category-filter-hover>*:not(.filter-section-parametric-id-630):not(.filter-section-parametric-id-570){display:none!important}
body.mobile #category-filter-hover>.filter-section{flex:0 0 auto;padding:0!important;margin:0!important;border:0!important;width:auto;position:static}
body.mobile #category-filter-hover>.filter-section-parametric-id-630{order:1;min-width:118px}
body.mobile #category-filter-hover>.filter-section-parametric-id-570{order:2;min-width:104px}
body.mobile .filter-section-parametric-id-630>h4,body.mobile .filter-section-parametric-id-570>h4,body.mobile .fhb-btn{box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;height:44px;margin:0;padding:0 18px;border:1px solid #e4e4e4;border-radius:999px;background:#fff;color:#24242e;font:700 14px/18px NunitoFH,Nunito,sans-serif;cursor:pointer}
body.mobile .filter-section-parametric-id-570.otevreny>h4,body.mobile .fhb-btn[aria-expanded=true]{border-color:#25878C;color:#25878C}
body.mobile .filter-section-parametric-id-570>form{position:absolute!important;left:0;right:0;top:100%;z-index:60;box-sizing:border-box;margin-top:-2px;padding:12px 14px;background:#fff;border:1px solid #e6e5e1;border-radius:14px;box-shadow:0 10px 24px rgba(19,44,60,.14)}
/* v6 PC (Petr 58d89445): i na PC jen Barva + Tvar jako oválné pilulky */
body:not(.mobile) #category-filter-hover>*:not(.filter-section-parametric-id-630):not(.filter-section-parametric-id-570){display:none!important}
body:not(.mobile) #category-filter-hover>.filter-section-parametric-id-630{order:1}
body:not(.mobile) #category-filter-hover>.filter-section-parametric-id-570{order:2}
body:not(.mobile) .filter-section-parametric-id-630>h4,body:not(.mobile) .filter-section-parametric-id-570>h4,body:not(.mobile) .fhb-btn{box-sizing:border-box;height:44px;display:flex;align-items:center;padding:0 18px;border:1px solid #e4e4e4;border-radius:999px;background:#fff}
body:not(.mobile) .filter-section-parametric-id-570.otevreny>h4{border-color:#25878C;color:#25878C}
body:not(.mobile) .filter-section-parametric-id-570>form{border-radius:14px;margin-top:6px}
body.mobile #filters,body.mobile #filters .filter-sections,body.mobile #category-filter-hover{background:transparent!important;border:0!important}
body.mobile .filter-section-parametric-id-570>h4,body.mobile .filter-section-parametric-id-630>h4{margin:0!important;padding:0 18px!important;background:#fff!important}
body:not(.mobile) .filter-section-parametric-id-570>h4,body:not(.mobile) .filter-section-parametric-id-630>h4{padding:0 18px!important;background:#fff!important}
/* v7: na mobilu rozbalený Tvar v toku pod pilulkami (Shoptet ho po výběru nechá otevřený; absolutní by překryl řazení) */
body.mobile #category-filter-hover>.filter-section-parametric-id-570{display:contents!important}
body.mobile .filter-section-parametric-id-570>h4{order:2;flex:0 0 auto;width:auto!important;min-width:104px}
body.mobile .filter-section-parametric-id-570>form{position:static!important;order:3;flex:1 0 100%;margin-top:0}
/* v8 (Petr upload-335b6e6b): PC >= 992 px — jeden řádek: vlevo pilulky Barva + Tvar, vpravo počet + pilulka řazení; jen CSS grid (DOM beze změny) */
@media (min-width:992px){
body:not(.mobile) .category-content-wrapper{display:grid;grid-template-columns:auto 1fr;column-gap:24px;align-items:start}
body:not(.mobile) .category-content-wrapper>*{grid-column:1/-1}
body:not(.mobile) .category-content-wrapper>#filters-wrapper{grid-column:1;grid-row:1;min-width:0}
body:not(.mobile) .category-content-wrapper>#category-header{grid-column:2;grid-row:1;display:flex;align-items:center;justify-content:flex-end;gap:16px;min-width:0}
body:not(.mobile) #category-header .listSorting__controls{margin:0!important}
body:not(.mobile) #category-header .listItemsTotal{order:-1;padding:0!important;margin:0!important;font-size:13px;color:#6b7378;white-space:nowrap}
body:not(.mobile) #filters{margin-bottom:24px}
body:not(.mobile) #category-filter-hover{flex-wrap:wrap;row-gap:12px}
body:not(.mobile) #category-filter-hover>.filter-section-parametric-id-570{display:contents!important}
body:not(.mobile) .filter-section-parametric-id-570>h4{order:2;margin-left:8px}
body:not(.mobile) .filter-section-parametric-id-570>form{position:static!important;order:3;flex:1 0 100%;margin-top:0;box-shadow:none;border:1px solid #e6e5e1}
}
/* v8 (Petr 0749808c): Shoptet po AJAXu vloží řazení na 1 snímek bez FH stylu (41 px místo 56 px) → výpis poskočí o 15 px a zpět; rezerva výšky */
#category-header .listSorting{min-height:44px}
/* v9 (Petr upload-16ddb4a2): PC vše zleva [Barva][Tvar][řazení] a „N položek celkem“ až za řazením */
@media (min-width:992px){
body:not(.mobile) .category-content-wrapper{column-gap:8px}
body:not(.mobile) .category-content-wrapper>#category-header{justify-content:flex-start;gap:14px}
body:not(.mobile) #category-header .listItemsTotal{order:1}
}
/* v9 (Petr ce4198e4): řazení stejně vysoké jako pilulky Barva/Tvar — 44 px, poloměr 999px, písmo 14px/700; platí i pro řazení vložené Shoptetem bez FH stylu (žádné poskočení) */
#category-header .listSorting__controls{box-sizing:border-box;height:44px;min-height:44px;padding:3px!important;border-radius:999px;align-items:center}
#category-header .listSorting__controls li{height:38px}
#category-header .listSorting__controls a{box-sizing:border-box;height:38px;min-height:38px!important;padding:0 18px!important;line-height:34px!important;font-size:14px!important;font-weight:700;border-radius:999px}
/* v10 (Petr upload-59933b3b): PC — rozbalený Tvar mimo tok řádku (absolutně pod pilulkou), řádek se při otevření nepohne */
@media (min-width:992px){
body:not(.mobile) #category-filter-hover>.filter-section-parametric-id-570{display:block!important;position:relative}
body:not(.mobile) .filter-section-parametric-id-570>h4{margin-left:0}
body:not(.mobile) .filter-section-parametric-id-570>form{position:absolute!important;top:calc(100% + 6px);left:0;z-index:70;flex:none;width:max-content;min-width:220px;max-width:360px;box-sizing:border-box;margin:0;padding:10px 14px;background:#fff;border:1px solid #e6e5e1;border-radius:14px;box-shadow:0 12px 28px rgba(19,44,60,.16)}
}
/* v14 (T-085, Petr návrh 2): Tvar = panel dlaždic. Původní seznam (form) zůstává v DOM skrytý — Shoptet přes něj filtruje; bez JS platí v13 */
body .filter-section-parametric-id-570.fht-on>form{position:absolute!important;width:1px!important;height:1px!important;min-width:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap;margin:0!important;padding:0!important;border:0!important;box-shadow:none!important}
body .filter-section-parametric-id-570.fht-on>h4{cursor:pointer}
body .filter-section-parametric-id-570.fht-open>h4{color:#25878C!important;border-color:#25878C!important}
body .filter-section-parametric-id-570.fht-open>h4::before{transform:rotate(180deg)}
.fht-on>h4:focus-visible,.fht-c:focus-visible,.fht-cl:focus-visible,.fht-go:focus-visible,.fht-x:focus-visible{outline:2px solid #25878C;outline-offset:2px}
.fht-dot{flex:0 0 auto;width:9px;height:9px;margin-left:8px;border-radius:50%;background:#25878C}
.fht-bd{display:none}
.fht-p{position:absolute;z-index:1000;width:min(540px,calc(100vw - 32px));box-sizing:border-box;background:#fff;border:1px solid #e6e5e1;border-radius:16px;box-shadow:0 16px 40px rgba(19,44,60,.16);padding:20px 22px 18px;color:#132C3C;font-family:NunitoFH,Nunito,sans-serif;text-align:left}
.fht-p[hidden],.fht-bd[hidden]{display:none!important}
.fht-hd{display:flex;justify-content:space-between;align-items:center;margin:0 0 16px}
.fht-t{font-size:18px;font-weight:800;margin:0;color:#132C3C}
.fht-cl{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;margin:-6px -10px -6px 0;padding:0;border:0;border-radius:50%;background:none;color:#132C3C;font:400 18px/1 sans-serif;cursor:pointer}
.fht-cl:hover{background:#FAF8F4}
.fht-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.fht-it{min-width:0;margin:0;padding:0}
.fht-c{display:block;width:100%;height:100%;box-sizing:border-box;margin:0;padding:0;border:1px solid #e6e5e1;border-radius:14px;overflow:hidden;background:#fff;color:#132C3C;text-align:left;font-family:inherit;cursor:pointer;transition:border-color .12s,box-shadow .12s}
@media (hover:hover){.fht-c:hover{border-color:#c5d9d9}}
.fht-c[aria-pressed=true]{border-color:#25878C;box-shadow:inset 0 0 0 1px #25878C,0 0 0 3px #d7eeee}
.fht-w{position:relative;display:block;background:#FAF8F4}
.fht-w svg{display:block;width:100%;height:auto;aspect-ratio:210/150}
@media (min-width:768px){.fht-w svg{aspect-ratio:auto;height:clamp(90px,calc(50vh - 280px),172px)}}
.fht-ck{display:none;position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;background:#25878C}
.fht-ck::after{content:"";position:absolute;left:50%;top:50%;width:9px;height:5px;border:solid #fff;border-width:0 0 2px 2px;transform:translate(-50%,-70%) rotate(-45deg)}
.fht-c[aria-pressed=true] .fht-ck{display:block}
.fht-tx{display:block;padding:10px 12px 12px}
.fht-nm{display:block;font-size:16px;font-weight:800;line-height:1.25}
.fht-r{display:block;margin:2px 0 3px;font-size:13.5px;font-weight:600;line-height:1.3;color:#6b7378}
.fht-n{display:block;font-size:13px;font-weight:600;line-height:1.3;color:#6b7378}
.fht-ft{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid #e6e5e1}
.fht-x{border:0;background:none;padding:6px 4px;color:#4a5a63;font:700 14px/1.3 NunitoFH,Nunito,sans-serif;text-decoration:underline;cursor:pointer}
.fht-x[disabled]{opacity:.4;cursor:default}
.fht-go{min-height:46px;padding:0 26px;border:0;border-radius:999px;background:#D1B26B;color:#fff;font:800 15px/1.2 NunitoFH,Nunito,sans-serif;cursor:pointer;white-space:nowrap}
.fht-go:hover{background:#B78D49;color:#fff}
.fht-busy .fht-g{opacity:.55;pointer-events:none}
.fht-hand{display:none}
@media (max-width:767px){
.fht-bd{display:block;position:fixed;inset:0;z-index:2147483000;background:rgba(19,44,60,.45)}
.fht-p{position:fixed;left:0!important;right:0;top:auto!important;bottom:0;z-index:2147483001;width:100%;max-height:88vh;overflow:auto;border-radius:20px 20px 0 0;padding:10px 16px calc(16px + env(safe-area-inset-bottom));border:0}
.fht-cl{width:44px;height:44px;margin-right:-12px}
.fht-hd{margin-bottom:12px}
.fht-hand{display:block;width:44px;height:5px;margin:0 auto 12px;border-radius:3px;background:#dcd9d2}
.fht-g{gap:10px}
.fht-c{border-radius:12px}
.fht-ck{top:6px;right:6px;width:22px;height:22px}
.fht-tx{padding:8px 10px 10px}
.fht-nm{font-size:15px}
.fht-r{font-size:12px}
.fht-n{font-size:12px}
.fht-ft{position:sticky;bottom:calc(-16px - env(safe-area-inset-bottom));background:#fff;margin:14px -16px 0;padding:12px 16px 0}
.fht-go{flex:1 1 auto;margin-left:16px;padding:0 18px}
}