/*! 22-10-filter-v1.css – nový filter Bio-racio-dia (vrstva nad filtrom Shoptetu), 22. 10. 2026
   Všetko platí len s triedou html.brdf-on, ktorú pridá skript po úspešnom spustení.
   Keď skript nebeží, ostane pôvodný filter Shoptetu. */

/* značka pre skript, že sa štýly načítali – bez nej sa nový filter nezapne */
:root{--brdf-css:1}

/* ---------- skrytie pôvodného filtra (ostáva v stránke, Shoptet s ním ďalej pracuje) */
.brdf-on .sidebar .box-filters{visibility:hidden!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;overflow:hidden!important}
.brdf-on #filters-wrapper{display:none!important}
.brdf-busy .overlay.spinner{display:none!important}

/* ---------- spoločné */
.brdf,.brdf-chips,.brdf-empty,.brdf-mbar,.brdf-mres,.brdf-mp,.brdf-sheet,.brdf-cat-t{font-family:Roboto,Arial,sans-serif;color:#1F1F1F;font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}
.brdf *,.brdf-mp *,.brdf-mbar *,.brdf-sheet *,.brdf-chips *,.brdf-empty *{box-sizing:border-box}
.brdf button,.brdf-mp button,.brdf-mbar button,.brdf-sheet button,.brdf-chips button,.brdf-empty button,.brdf-mres button{font-family:inherit;letter-spacing:normal;text-transform:none;box-shadow:none;min-width:0;min-height:0;line-height:1.2}
/* výšky našich tlačidiel musia prebiť reset vyššie (má väčšiu váhu než samotná trieda) – hlavička sekcie 48 px ako v návrhu */
.brdf .brdf-sh,.brdf-sheet .brdf-so{min-height:48px}
.brdf-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.brdf-pill:focus-visible,.brdf-sh:focus-visible,.brdf-more:focus-visible,.brdf-chip:focus-visible,.brdf-clear:focus-visible,.brdf-btn-g:focus-visible,.brdf-btn-o:focus-visible,.brdf-mb:focus-visible,.brdf-qp:focus-visible,.brdf-ib:focus-visible,.brdf-lnk:focus-visible,.brdf-so:focus-visible,.brdf-cat-t:focus-visible{outline:3px solid rgba(0,124,49,.35);outline-offset:2px}

/* ---------- PC: ľavý stĺpec prilepený s vlastným posúvaním */
.brdf-on.brdf-pc .sidebar-inner{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#CFE3D5 transparent}
.brdf-on.brdf-pc .sidebar-inner::-webkit-scrollbar{width:8px}
.brdf-on.brdf-pc .sidebar-inner::-webkit-scrollbar-thumb{background:#CFE3D5;border-radius:4px}

/* ---------- PC panel */
.brdf{background:#fff;border:1px solid #E5E7EB;border-radius:12px;padding:16px 16px 6px;margin:0 0 16px}
.brdf-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:0 0 12px}
.brdf-t{font-family:Nunito,sans-serif!important;font-weight:800!important;font-size:20px!important;line-height:1.2!important;margin:0!important;padding:0!important;color:#1F1F1F!important;text-transform:none!important;letter-spacing:normal!important;border:0!important}
.brdf-n{font-size:13px;color:#6B7280;white-space:nowrap}

.brdf-quick{display:flex;flex-wrap:wrap;gap:8px;padding:0 0 14px;border-bottom:1px solid #E5E7EB}
.brdf-pill{display:inline-flex;align-items:center;gap:6px;height:34px;margin:0;padding:0 12px;border:1px solid #D1D5DB;border-radius:999px;background:#fff;font-size:14px;font-weight:400;color:#1F1F1F;cursor:pointer;white-space:nowrap;transition:background-color .15s,border-color .15s}
.brdf-pill:hover{border-color:#007C31;background:#fff;color:#1F1F1F}
.brdf-pill .brdf-pc{display:inline-flex;align-items:center;min-width:3ch;font-size:12px;color:#6B7280;font-variant-numeric:tabular-nums}
.brdf-pill .brdf-pk{display:none}
.brdf-pill.on{background:#EEF6F0;border-color:#007C31;color:#1D662C}
.brdf-pill.on:hover{background:#E1F0E5;color:#1D662C}
.brdf-pill.on .brdf-pn{display:none}
.brdf-pill.on .brdf-pk{display:inline-flex}
.brdf-pill:disabled{opacity:.45;cursor:default;border-color:#E5E7EB}
.brdf-pill:disabled:hover{border-color:#E5E7EB}

.brdf-pr{padding:14px 0 16px;border-bottom:1px solid #E5E7EB}
.brdf-pr.off{display:none}
.brdf-pr-t{font-weight:500;margin:0 0 8px}
.brdf-rw{position:relative;height:28px}
.brdf-track{position:absolute;left:0;right:0;top:12px;height:4px;border-radius:2px;background:#E5E7EB}
.brdf-fill{position:absolute;top:0;bottom:0;background:#007C31;border-radius:2px}
.brdf-rng{position:absolute!important;left:0;top:0;width:100%!important;height:28px!important;margin:0!important;padding:0!important;border:0!important;background:none!important;pointer-events:none;-webkit-appearance:none;appearance:none;outline:none}
.brdf-rng::-webkit-slider-runnable-track{background:none;height:28px;border:0}
.brdf-rng::-moz-range-track{background:none;border:0}
.brdf-rng::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:22px;height:22px;margin-top:3px;border-radius:50%;background:#fff;border:2px solid #007C31;box-shadow:0 1px 3px rgba(0,0,0,.2);cursor:grab}
.brdf-rng::-moz-range-thumb{pointer-events:auto;width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid #007C31;box-shadow:0 1px 3px rgba(0,0,0,.2);cursor:grab}
.brdf-rng:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px rgba(0,124,49,.25)}
.brdf-rng.top{z-index:2}
.brdf-pin{display:flex;gap:10px;margin:10px 0 0}
.brdf-pin label{flex:1;display:flex;align-items:center;gap:6px;margin:0;font-size:13px;font-weight:400;color:#6B7280}
.brdf-pin input{width:100%;min-width:0;height:36px;margin:0;border:1px solid #D1D5DB;border-radius:8px;padding:0 10px;font:inherit;font-size:14px;color:#1F1F1F;background:#fff;box-shadow:none}
.brdf-pin input:focus,.brdf-fs:focus{outline:none;border-color:#007C31;box-shadow:0 0 0 3px rgba(0,124,49,.15)}
/* cena bez rozpätia po filtrovaní: ostáva na mieste, len zašednutá */
.brdf-pr.dis .brdf-rw,.brdf-pr.dis .brdf-pin{opacity:.5}
.brdf-pr.dis .brdf-fill{background:#9CA3AF}
.brdf-pr.dis .brdf-rng::-webkit-slider-thumb{pointer-events:none;cursor:default;border-color:#9CA3AF;box-shadow:none}
.brdf-pr.dis .brdf-rng::-moz-range-thumb{pointer-events:none;cursor:default;border-color:#9CA3AF;box-shadow:none}
.brdf-pin input:disabled{background:#F3F4F6;color:#6B7280;-webkit-text-fill-color:#6B7280;opacity:1}

.brdf-sec{border-bottom:1px solid #E5E7EB}
.brdf-sec:last-child{border-bottom:0}
.brdf-sh{width:100%;display:flex;align-items:center;gap:8px;min-height:48px;margin:0;padding:0;border:0;border-radius:0;background:none;font-weight:500;font-size:15px;color:#1F1F1F;cursor:pointer;text-align:left}
.brdf-sh:hover{color:#1D662C;background:none}
.brdf-badge{min-width:20px;height:20px;border-radius:999px;background:#007C31;color:#fff;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;line-height:1}
.brdf-badge[hidden]{display:none}
.brdf-chev{margin-left:auto;flex:0 0 auto;transition:transform .2s ease;color:#6B7280}
.brdf-sh[aria-expanded="true"] .brdf-chev,.brdf-cat-t[aria-expanded="true"] .brdf-chev{transform:rotate(180deg)}
.brdf-sb{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease}
.brdf-sb.open{grid-template-rows:1fr}
.brdf-sb-in{overflow:hidden;min-height:0}
.brdf-sb:not(.open) .brdf-sb-in{visibility:hidden;transition:visibility 0s linear .2s}
.brdf-vals{padding:0 0 12px}
.brdf-fs{display:block;width:100%;height:38px;margin:0 0 6px;padding:0 12px;border:1px solid #D1D5DB;border-radius:8px;font:inherit;font-size:14px;background:#fff;color:#1F1F1F;box-shadow:none}
.brdf-fs[hidden]{display:none}
.brdf-v{position:relative;display:flex;align-items:center;gap:10px;min-height:36px;margin:0 -8px;padding:0 8px;border-radius:8px;cursor:pointer;font-size:15px;font-weight:400;color:#1F1F1F;line-height:1.3}
.brdf-v:hover{background:#EEF6F0}
.brdf-cb{position:absolute!important;left:8px;top:50%;width:18px!important;height:18px!important;margin:-9px 0 0!important;opacity:0!important;cursor:pointer}
.brdf-box{flex:0 0 18px;height:18px;border:1.5px solid #9CA3AF;border-radius:4px;background:#fff;display:inline-flex;align-items:center;justify-content:center;transition:background-color .12s,border-color .12s}
.brdf-box svg{opacity:0}
.brdf-cb:checked+.brdf-box{background:#007C31;border-color:#007C31}
.brdf-cb:checked+.brdf-box svg{opacity:1}
.brdf-cb:focus-visible+.brdf-box{box-shadow:0 0 0 3px rgba(0,124,49,.3)}
.brdf-l{flex:1;min-width:0;padding:6px 0}
.brdf-c{font-size:13px;color:#6B7280;font-variant-numeric:tabular-nums}
.brdf-v.on .brdf-l{color:#1D662C;font-weight:500}
.brdf-v.zero{cursor:default}
.brdf-v.zero .brdf-l,.brdf-v.zero .brdf-c{color:#9CA3AF}
.brdf-v.zero .brdf-box{border-color:#D1D5DB;background:#F9FAFB}
.brdf-v.zero:hover{background:none}
.brdf-more{display:inline-block;margin:0;padding:6px 0 0;border:0;background:none;font-size:14px;color:#007C31;font-weight:500;cursor:pointer}
.brdf-more:hover{color:#1D662C;text-decoration:underline;background:none}
.brdf-more[hidden],.brdf-nm[hidden]{display:none}
.brdf-nm{font-size:13px;color:#6B7280;padding:6px 0}

/* ---------- PC: kategórie pod filtrom, zbalené */
.brdf-on.brdf-pc .box-categories:not(.brdf-cat-open) #categories{display:none}
.brdf-cat-t{width:100%;display:flex;align-items:center;gap:8px;min-height:48px;margin:0;padding:0;border:0;background:none;font-weight:500;font-size:15px;color:#1F1F1F;cursor:pointer;text-align:left}
.brdf-cat-t:hover{color:#1D662C;background:none}

/* ---------- nad produktmi: štítky, prúžok načítania, prázdny výsledok */
.brdf-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:2px 0 16px}
.brdf-chips[hidden]{display:none}
.brdf-chip{display:inline-flex;align-items:center;gap:6px;height:32px;margin:0;padding:0 5px 0 12px;border-radius:999px;background:#EEF6F0;color:#1D662C;border:0;font-size:14px;font-weight:400;cursor:pointer;white-space:nowrap}
.brdf-chip:hover{background:#E1F0E5;color:#1D662C}
.brdf-chip b{font-weight:700}
.brdf-chip .brdf-x{width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
.brdf-chip:hover .brdf-x{background:#D7EBDD}
.brdf-clear{margin:0;padding:0 4px;border:0;background:none;font-size:14px;color:#007C31;font-weight:500;text-decoration:underline;cursor:pointer}
.brdf-clear:hover{color:#1D662C;background:none}
.brdf-on #products{transition:opacity .15s ease}
.brdf-loading #products,.brdf-loading .brdf-empty{opacity:.45;pointer-events:none}
.brdf-prog{position:sticky;top:0;z-index:5;display:block;height:3px;margin:0 0 -3px;overflow:hidden;border-radius:2px;opacity:0;transition:opacity .15s;pointer-events:none}
.brdf-loading .brdf-prog{opacity:1}
.brdf-loading .brdf-prog::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:40%;background:#007C31;border-radius:2px;animation:brdf-prg 1s ease-in-out infinite}
@keyframes brdf-prg{0%{left:-40%}100%{left:100%}}
.brdf-empty{background:#fff;border:1px dashed #CFE3D5;border-radius:12px;padding:40px 24px;margin:0 0 24px;text-align:center}
.brdf-empty h2{font-family:Nunito,sans-serif!important;font-weight:800!important;font-size:22px!important;line-height:1.2!important;margin:0 0 8px!important;color:#1F1F1F!important}
.brdf-empty p{margin:0 0 18px;color:#6B7280}
.brdf-empty-b{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.brdf-is-empty .empty-content-category{display:none!important}
.brdf-btn-g{height:44px;margin:0;padding:0 22px;border:0;border-radius:999px;background:#007C31;color:#fff;font-size:15px;font-weight:500;cursor:pointer}
.brdf-btn-g:hover{background:#1D662C;color:#fff}
.brdf-btn-g:disabled{background:#9CA3AF;cursor:default}
.brdf-btn-g.busy{opacity:.8}
.brdf-btn-o{height:44px;margin:0;padding:0 22px;border:1px solid #007C31;border-radius:999px;background:#fff;color:#007C31;font-size:15px;font-weight:500;cursor:pointer}
.brdf-btn-o:hover{background:#EEF6F0;color:#1D662C}
.brdf-btn-o:disabled{border-color:#D1D5DB;color:#9CA3AF;background:#fff;cursor:default}

/* ---------- mobil: prilepený riadok Filtrovať / Radiť + rýchle filtre */
.brdf-on.brdf-m.brdf-sort #category-header{display:none!important}
/* Shoptet posúva cez scrollIntoView so scroll-padding-top = --scroll-offset (výška hlavičky + 10 px);
   --scroll-offset-override je jeho háčik – pripočítame výšku našej lišty, aby nezakryla prvé produkty */
.brdf-on.brdf-m{--scroll-offset-override:calc(var(--scroll-offset-runtime,0px) + var(--brdf-bar-h,0px))}
.brdf-mbar{position:sticky;top:0;z-index:50;margin:0 calc(-1 * var(--brdf-gx,16px));padding:8px var(--brdf-gx,16px) 0;background:#fff;box-shadow:0 1px 0 #E5E7EB}
.brdf-mrow{display:flex;gap:8px}
.brdf-mb{flex:1 1 0;min-width:0;height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;margin:0;padding:0 10px;border:1px solid #D1D5DB;border-radius:12px;background:#fff;font-size:15px;font-weight:500;color:#1F1F1F;cursor:pointer}
.brdf-mb:hover,.brdf-mb:active{background:#fff;color:#1F1F1F}
.brdf-mb span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brdf-mbadge{min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#007C31;color:#fff;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;line-height:1}
.brdf-mbadge[hidden]{display:none}
.brdf-mq{display:flex;gap:8px;overflow-x:auto;margin:0 calc(-1 * var(--brdf-gx,16px));padding:8px var(--brdf-gx,16px) 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.brdf-mq::-webkit-scrollbar{display:none}
.brdf-qp{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;height:44px;margin:0;padding:0 14px;border:1px solid #D1D5DB;border-radius:999px;background:#fff;font-size:14px;font-weight:400;color:#1F1F1F;cursor:pointer;white-space:nowrap}
.brdf-qp:hover{background:#fff;color:#1F1F1F}
.brdf-qp .brdf-pk{display:none}
.brdf-qp.on{background:#EEF6F0;border-color:#007C31;color:#1D662C;font-weight:500}
.brdf-qp.on .brdf-pk{display:inline-flex}
.brdf-qp:disabled{opacity:.45;cursor:default}
.brdf-qp .brdf-pc{font-size:12px;color:#6B7280;font-weight:400}
.brdf-mbar .brdf-prog{position:absolute;left:0;right:0;bottom:0;top:auto;margin:0;border-radius:0}
.brdf-mres{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:4px 0 2px;font-size:14px;color:#6B7280}
.brdf-mres b{color:#1F1F1F}
.brdf-lnk{height:44px;margin:0;padding:0 2px;border:0;background:none;font-size:14px;font-weight:500;color:#007C31;text-decoration:underline;cursor:pointer}
.brdf-lnk:hover{background:none;color:#1D662C}
.brdf-lnk[hidden]{display:none}

/* ---------- mobil: panel filtra cez celú obrazovku */
.brdf-lock,.brdf-lock body{overflow:hidden!important}
/* panel a radenie nad všetkým – aj nad bublinou chatu Smartsupp (z-index 10 000 000), ktorá inak zakrývala tlačidlo „Zobraziť“ */
.brdf-mp{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483000;background:#fff;display:flex;flex-direction:column;transform:translateX(100%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s}
.brdf-mp.open{transform:none;visibility:visible;transition:transform .25s ease}
.brdf-mp-h{flex:0 0 auto;display:flex;align-items:center;gap:8px;height:56px;padding:0 6px 0 16px;border-bottom:1px solid #E5E7EB}
.brdf-mp-t{font-family:Nunito,sans-serif;font-weight:800;font-size:20px}
.brdf-mp-n{font-size:13px;color:#6B7280;margin-right:auto}
.brdf-ib{width:44px;height:44px;margin:0;padding:0;border:0;border-radius:12px;background:none;color:#1F3D29;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.brdf-ib:hover{background:none;color:#1F3D29}
.brdf-mp-chips{flex:0 0 auto;display:flex;gap:8px;overflow-x:auto;padding:10px 16px;border-bottom:1px solid #E5E7EB;scrollbar-width:none}
.brdf-mp-chips::-webkit-scrollbar{display:none}
.brdf-mp-chips[hidden]{display:none}
.brdf-mp-chips .brdf-chip{flex:0 0 auto;height:36px;padding:0 6px 0 12px}
.brdf-mp-chips .brdf-chip .brdf-x{width:24px;height:24px}
.brdf-mp-none{display:inline-flex;align-items:center;height:36px;font-size:14px;color:#6B7280;white-space:nowrap}
.brdf-mp-b{flex:1 1 auto;overflow-y:auto;padding:4px 16px 20px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.brdf-mp-q{display:flex;flex-wrap:wrap;gap:8px;padding:12px 0 14px;border-bottom:1px solid #E5E7EB}
.brdf-mp-q .brdf-qp .brdf-pc{min-width:3ch}
.brdf-mp-f{flex:0 0 auto;display:flex;gap:10px;padding:12px 16px calc(16px + env(safe-area-inset-bottom,0px));border-top:1px solid #E5E7EB;background:#fff;box-shadow:0 -6px 14px rgba(16,44,23,.05)}
.brdf-mp-f .brdf-btn-o{flex:0 0 auto;height:48px;padding:0 18px}
.brdf-mp-f .brdf-btn-g{flex:1 1 auto;height:48px;padding:0 18px}
.brdf-mp .brdf-pr-t{font-size:16px;margin:0 0 6px}
.brdf-mp .brdf-rw{height:44px}
.brdf-mp .brdf-track{top:20px}
.brdf-mp .brdf-rng{height:44px!important}
.brdf-mp .brdf-rng::-webkit-slider-runnable-track{height:44px}
.brdf-mp .brdf-rng::-webkit-slider-thumb{width:28px;height:28px;margin-top:8px}
.brdf-mp .brdf-rng::-moz-range-thumb{width:24px;height:24px}
.brdf-mp .brdf-pin{margin:6px 0 0}
.brdf-mp .brdf-pin label{font-size:14px}
.brdf-mp .brdf-pin input{height:44px;border-radius:10px;padding:0 12px;font-size:16px}
.brdf-mp .brdf-sh{min-height:52px;font-size:16px}
.brdf-mp .brdf-badge{min-width:22px;height:22px}
.brdf-mp .brdf-v{gap:12px;min-height:44px;font-size:16px}
.brdf-mp .brdf-cb{width:22px!important;height:22px!important;margin:-11px 0 0!important}
.brdf-mp .brdf-box{flex:0 0 20px;height:20px}
.brdf-mp .brdf-v:hover{background:none}
.brdf-mp .brdf-more{min-height:44px;padding:0;font-size:15px}
.brdf-mp .brdf-fs{height:44px;border-radius:10px;font-size:16px}

/* ---------- mobil: radenie v spodnom paneli */
.brdf-sbg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483001;margin:0;padding:0;border:0;border-radius:0;background:rgba(17,24,39,.4);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility 0s linear .2s;cursor:default}
.brdf-sbg.open{opacity:1;visibility:visible;transition:opacity .2s ease}
.brdf-sheet{position:fixed;left:0;right:0;bottom:0;z-index:2147483002;background:#fff;border-radius:16px 16px 0 0;padding:8px 8px calc(16px + env(safe-area-inset-bottom,0px));transform:translateY(100%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s}
.brdf-sheet.open{transform:none;visibility:visible;transition:transform .25s ease}
.brdf-sheet-t{font-family:Nunito,sans-serif;font-weight:800;font-size:18px;padding:12px 12px 6px}
.brdf-so{width:100%;display:flex;align-items:center;justify-content:space-between;min-height:48px;margin:0;padding:0 12px;border:0;border-radius:10px;background:none;font-size:16px;font-weight:400;color:#1F1F1F;cursor:pointer;text-align:left}
.brdf-so:hover{background:#F5F7F4;color:#1F1F1F}
.brdf-so.on{color:#1D662C;font-weight:500;background:#EEF6F0}

@media (prefers-reduced-motion:reduce){.brdf-sb,.brdf-chev,.brdf-mp,.brdf-sheet,.brdf-sbg,.brdf-on #products{transition:none!important}.brdf-loading .brdf-prog::after{animation:none;left:0;width:100%}}