/* FanZone.pl — strona produktu: kafelki wariantów + przyklejony pasek zakupu (telefon). Ładowane po tema.css.
   Zależy od klas dodawanych przez produkt.js; bez JS strona produktu wygląda jak dotąd (lista rozwijana). */

/* ---------- kafelki wariantów (progressive enhancement) ---------- */
/* oryginalny <label><select> zostaje w DOM (wysyła wariant), tylko niewidoczny */
body .fz2-sel-hidden{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
body .fz2-opt{display:grid;gap:10px;min-width:0}
body .fz2-opt__cap{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--fz-mute)}
body .fz2-opt__cap b{color:var(--fz-ink);font-weight:700}
body .fz2-opt__row{display:flex;flex-wrap:wrap;gap:8px}
body.sklep-theme .fz2-sz{appearance:none;-webkit-appearance:none;display:inline-grid;place-items:center;box-sizing:border-box;min-width:54px;min-height:48px;max-width:100%;padding:0 16px;
  border:1px solid var(--fz-line2);border-radius:999px!important;background:transparent;color:var(--fz-ink);
  font:500 14px/1.15 var(--fz-mono);letter-spacing:0;text-transform:none;text-align:center;cursor:pointer;overflow-wrap:anywhere;
  transition:border-color .2s,background .2s,box-shadow .2s,color .2s}
body.sklep-theme .fz2-sz:hover:not(:disabled):not([aria-checked=true]){border-color:var(--fz-g);background:rgba(110,180,64,.1);color:var(--fz-ink);box-shadow:none}
body.sklep-theme .fz2-sz[aria-checked=true]{background:var(--fz-g);color:var(--fz-on-g);border-color:var(--fz-g-hi);font-weight:700;box-shadow:0 0 22px -4px var(--fz-glow)}
body.sklep-theme .fz2-sz:disabled{opacity:.38;cursor:not-allowed;text-decoration:line-through;background:transparent;border-style:dashed}
body.sklep-theme .fz2-sz[aria-checked=true]:disabled{opacity:.6}
body .fz2-opt__msg{margin:0;font-size:13px;color:var(--fz-err)}
body .fz2-opt__msg[hidden]{display:none}
body .fz2-opt.is-need .fz2-opt__row{animation:fz2-need .4s}
@keyframes fz2-need{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}

/* ---------- przyklejony pasek zakupu (tylko telefon) ---------- */
body .fz2-sbar{display:none}
@media (max-width:768px){
  body .fz2-sbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:70;align-items:center;justify-content:space-between;gap:12px;
    padding:10px var(--fz-pad,16px) calc(10px + env(safe-area-inset-bottom,0px));box-sizing:border-box;
    background:rgba(4,7,5,.95);border-top:1px solid var(--fz-line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
    transform:translateY(110%);visibility:hidden;transition:transform .35s var(--fz-ease),visibility 0s .35s}
  body .fz2-sbar.is-on{transform:none;visibility:visible;transition:transform .35s var(--fz-ease),visibility 0s}
  body .fz2-sbar__p{display:flex;flex-direction:column;line-height:1.2;min-width:0}
  body .fz2-sbar__p ins{text-decoration:none;font-family:var(--fz-serif);font-weight:600;font-size:24px;color:var(--fz-g-hi);white-space:nowrap}
  body .fz2-sbar__p del{color:var(--fz-mute);font-size:12px;white-space:nowrap}
  body.sklep-theme .fz2-sbar__btn{flex:1 1 auto;max-width:62%;min-height:50px;padding:0 20px;border:1px solid var(--fz-g);border-radius:999px;background:var(--fz-g);color:var(--fz-on-g);
    font:700 13px/1.1 var(--fz-mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;cursor:pointer}
  body.sklep-theme .fz2-sbar__btn:hover:not(:disabled){background:var(--fz-g-hi);border-color:var(--fz-g-hi)}
  body.sklep-theme .fz2-sbar__btn:disabled{opacity:.5;cursor:not-allowed}
  body .fz2-sbar__msg{position:absolute;left:var(--fz-pad,16px);right:var(--fz-pad,16px);bottom:100%;margin:0 0 8px;padding:9px 14px;border:1px solid var(--fz-line2);border-radius:12px;
    background:#0a140c;color:var(--fz-err);font-size:13px;line-height:1.3}
  body .fz2-sbar__msg[hidden]{display:none}
}
@media (prefers-reduced-motion:reduce){
  body .fz2-sbar,body .fz2-sbar.is-on{transition:none}
  body .fz2-opt.is-need .fz2-opt__row{animation:none}
}
/* odznaczanie ponownym kliknięciem kafelka zastępuje przycisk „Wyczyść wybór” */
form.dodaj-koszyk [data-variant-clear],form.dodaj-koszyk .wariant-wyczysc{display:none!important}