/* Plywajacy pasek "Do koszyka" wg wzoru SkinExpert, w stylu Ze Wsi (bordo #610700, tekst #3a1710, linie #eadfd5).
   Zaakceptowane 22.10.2026. JS: zewsi-pasek-koszyk-7.js (od 26.10 z kluczowymi wariantami w pasku, wzor HOHO) */


body .zw-atc{position:fixed;left:0;right:0;bottom:0;z-index:980;background:#fff;border-top:1px solid #eadfd5;box-shadow:0 -8px 24px -12px rgba(58,23,16,.28);transform:translateY(110%);visibility:hidden;transition:transform .25s ease,visibility .25s}
body .zw-atc--on{transform:none;visibility:visible}
body .zw-atc__in{display:flex;align-items:center;gap:16px;max-width:1200px;margin:0 auto;padding:10px 24px calc(10px + env(safe-area-inset-bottom))}
body .zw-atc__img{flex:none;width:48px;height:48px;object-fit:cover;border-radius:10px}
body .zw-atc__info{flex:1 1 auto;min-width:0}
body .zw-atc__nazwa{font:600 15px/1.3 Inter,system-ui,sans-serif;color:#3a1710;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body .zw-atc__cena{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 8px;font:700 18px/1.2 Inter,system-ui,sans-serif;color:#610700;white-space:nowrap}
body .zw-atc__cena ins{order:1;text-decoration:none;background:none}
body .zw-atc__cena del{order:2;font-size:13px;font-weight:400;color:#8a7a72}
body .zw-atc__cena .jdev-cena-od{order:0;font-size:13px;font-weight:500;color:#6f5d55}
body .zw-atc__btn{flex:none;min-width:220px;height:48px;padding:0 28px;border:0;border-radius:999px;background:#610700;color:#fff;font:700 14px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .15s}
body .zw-atc__btn:hover{background:#4a0500}
body .zw-atc__btn--wybierz{background:#fff;color:#610700;box-shadow:inset 0 0 0 1.5px #610700}
body .zw-atc__btn--wybierz:hover{background:#faf1e8}

/* niewybrana cecha po kliknieciu w pasek: przyciski na chwile swieca bordowa obwodka */
body .zw-warianty.zw-atc-need .zw-wariant{animation:zw-atc-need 1.6s ease}
@keyframes zw-atc-need{0%,60%{border-color:#610700;box-shadow:0 0 0 3px rgba(97,7,0,.22)}100%{box-shadow:0 0 0 0 rgba(97,7,0,0)}}

/* kluczowe warianty w pasku (np. 100 / 250 / 500 ml z cena) */
body .zw-atc__opcje{flex:none;display:flex;flex-wrap:wrap;gap:8px 16px}
body .zw-atc__cecha{display:flex;gap:8px;border-radius:14px}
body .zw-atc__opcja{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:86px;min-height:44px;padding:5px 14px;border:1.5px solid #e2d6cb;border-radius:12px;background:#fff;color:#3a1710;font:600 14px/1.15 Inter,system-ui,sans-serif;cursor:pointer;transition:border-color .15s,background .15s,color .15s}
body .zw-atc__opcja small{font:500 12px/1.1 Inter,system-ui,sans-serif;color:#6f5d55}
body .zw-atc__opcja:hover{border-color:#610700}
body .zw-atc__opcja:focus-visible{outline:2px solid #610700;outline-offset:2px}
body .zw-atc__opcja[aria-pressed="true"]{border-color:#610700;background:#610700;color:#fff}
body .zw-atc__opcja[aria-pressed="true"] small{color:#f3e3d6}
body .zw-atc__opcja:disabled{opacity:.45;text-decoration:line-through;cursor:not-allowed}
body .zw-atc__cecha.zw-atc-need{animation:zw-atc-need 1.6s ease}

@media (max-width:959px){
  body .zw-atc__in{flex-wrap:wrap;row-gap:10px}
  body .zw-atc__opcje{order:-1;flex:1 1 100%;gap:8px}
  body .zw-atc__cecha{flex:1 1 100%}
  body .zw-atc__opcja{flex:1 1 0;min-width:0;padding:5px 6px}
  body .zw-atc__in{gap:12px;padding:10px 15px calc(10px + env(safe-area-inset-bottom))}
  body .zw-atc__img,body .zw-atc__nazwa{display:none}
  body .zw-atc__info{flex:0 0 auto}
  body .zw-atc__cena{flex-direction:column-reverse;align-items:flex-start;gap:0}
  body .zw-atc__cena:not(.zw-atc__cena--promo){flex-direction:row;align-items:baseline;gap:0 6px}
  body .zw-atc__btn{flex:1 1 auto;min-width:0;padding:0 14px;font-size:13px}
  /* tresc i stopka nie chowaja sie pod paskiem */
  body.zw-ma-atc{padding-bottom:var(--zw-atc-h,72px)}
  body.zw-ma-atc .uk-notification-bottom-left,body.zw-ma-atc .uk-notification-bottom-center,body.zw-ma-atc .uk-notification-bottom-right{bottom:calc(var(--zw-atc-h,72px) + 8px)}
}

/* 06.11.2026 (Jarek, komputer): przycisk w pasku tej samej wysokosci co przyciski wariantow,
   warianty o 2 px nizsze (44 -> 42), pasek blizej dolnej krawedzi ekranu (dol 10 -> 6 px) */
@media (min-width:960px){
  body .zw-atc__in{padding-top:8px;padding-bottom:calc(6px + env(safe-area-inset-bottom))}
  body .zw-atc__opcja{min-height:42px;padding:4px 14px}
  body .zw-atc__btn{height:42px}
}
