/* ════════════════════════════════════════════════════════════════════════════
   Arkusz „Dobierz produkt” (inc/dobierz.php + moduł w js/main.js).
   0.16.1 (21.09.2026): WYDZIELONE z product.css. Powód: od 0.16.0 arkusz wyskakuje
   także po dodaniu z LISTY (strona główna, kategoria, wyniki szukania) — markup
   przychodzi wtedy z endpointu wc-ajax i JS wstrzykuje go do DOM. product.css
   ładuje się wyłącznie przy is_product(), więc na listach arkusz renderował się
   BEZ JEDNEJ REGUŁY STYLU (zgłoszenie usera 21.09.2026, widoczne też w incognito).
   Ten plik ładuje się wszędzie, gdzie działa WooCommerce — bo przycisk „Do koszyka”
   może stać na dowolnej stronie, nie tylko w archiwum produktów.
   ⚠️ Nie wnoś tych reguł z powrotem do product.css.
   ════════════════════════════════════════════════════════════════════════════ */

.wf-dobierz { position: fixed; inset: 0; z-index: 90; display: none; }
.wf-dobierz.is-on { display: block; }
.wf-dobierz-scrim { position: absolute; inset: 0; background: rgba(20, 36, 58, .45); }
.wf-dobierz-arkusz { position: absolute; left: 0; right: 0; bottom: 0; max-height: 88%; background: var(--bg, #F6F4EF); border-radius: 18px 18px 0 0; display: flex; flex-direction: column; box-shadow: 0 -12px 32px rgba(0, 0, 0, .18); transform: translateY(100%); transition: transform .3s ease; }
.wf-dobierz.is-on .wf-dobierz-arkusz { transform: none; }
.wf-dobierz-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px 10px; border-bottom: 1px solid var(--line); }
.wf-dobierz-tt { min-width: 0; }
.wf-dobierz-tt b { display: block; font-size: 17px; color: var(--ink); line-height: 1.2; }
.wf-dobierz-tt small { display: block; font-size: 12px; color: var(--ink-mute); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wf-dobierz-tt small .woocommerce-Price-amount { display: inline; }
.wf-dobierz-x { flex: none; min-width: 44px; min-height: 44px; border-radius: 50%; background: var(--paper); border: 1px solid var(--line); display: inline-flex; align-items: center; justify-content: center; color: var(--ink); cursor: pointer; }
.wf-dobierz-body { flex: 1; overflow: auto; padding: 12px 16px; }
.wf-dobierz-h { font-size: 14px; font-weight: 800; margin: 0 0 2px; color: var(--ink); }
.wf-dobierz-sub { font-size: 12px; color: var(--ink-mute); margin: 0 0 10px; }
.wf-dobierz-row { display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
.wf-dobierz-row::-webkit-scrollbar { display: none; }
.wf-dobierz-kafel { flex: 0 0 112px; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: 8px; display: grid; gap: 6px; align-content: start; }
.wf-dobierz-kafel.is-dodane { border-color: var(--blue); }
.wf-dobierz-okladka { display: block; border-radius: 6px; overflow: hidden; aspect-ratio: .7; background: var(--bg-soft); }
.wf-dobierz-okladka img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wf-dobierz-n { display: block; font-size: 12px; font-weight: 600; line-height: 1.3; height: 31px; overflow: hidden; color: var(--ink); text-decoration: none; }
.wf-dobierz-p { display: block; font-size: 13px; font-weight: 700; color: var(--ink); }
.wf-dobierz-p .woocommerce-Price-amount, .wf-dobierz-p ins { display: inline; text-decoration: none; }
.wf-dobierz-p del { color: var(--ink-mute); font-weight: 400; font-size: 12px; margin-right: 4px; }
.wf-dobierz-dodaj { width: 100%; min-height: 44px; border-radius: 999px; border: 1.5px solid var(--blue); background: var(--paper); color: var(--blue); font: inherit; font-weight: 800; font-size: 13px; cursor: pointer; }
.wf-dobierz-dodaj.is-dodane { background: var(--blue); color: #fff; }
.wf-dobierz-dodaj.is-loading { opacity: .6; }
.wf-dobierz-dodaj[disabled] { cursor: default; }
.wf-dobierz-foot { padding: 10px 16px calc(12px + env(safe-area-inset-bottom)); background: var(--paper); border-top: 1px solid var(--line); display: grid; gap: 8px; }
.wf-dobierz-sum { display: flex; justify-content: space-between; font-size: 13px; color: var(--ink-mute); }
.wf-dobierz-sum b { color: var(--ink); font-size: 15px; }
.wf-dobierz-kasa { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; border-radius: 10px; background: var(--accent); color: #fff !important; font-weight: 800; font-size: 15px; text-decoration: none !important; }
.wf-dobierz-kasa:hover { filter: brightness(.94); }
.wf-dobierz-pomin { min-height: 44px; border-radius: 10px; background: var(--paper); border: 1px solid var(--line); color: var(--ink); font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; }
@media (min-width: 901px) {
  .wf-dobierz-arkusz { left: 50%; right: auto; width: 560px; max-height: 80%; border-radius: 18px 18px 0 0; transform: translate(-50%, 100%); }
  .wf-dobierz.is-on .wf-dobierz-arkusz { transform: translate(-50%, 0); }
  .wf-dobierz-kafel { flex-basis: 150px; }
}