/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Aug 29 2026 | 09:53:20 */
/* =========================================================
   SABRIVERSE - SEKCJA 32
   Poprawki mobilne, sierpien 2026

   Ten plik laduje sie PRZED 142.css i 27.css, wiec regule,
   ktore nadpisuja design system, maja !important. Bez tego
   wygrywalby arkusz zaladowany pozniej.
   ========================================================= */

/* --- 32.1 Naglowek na telefonie ------------------------------------
   Logo + konto + koszyk + CTA + hamburger nie miescily sie w 390 px.
   Hamburger wypadal poza ekran, wiec menu mobilne bylo niedostepne.
   Na telefonie CTA z naglowka znika, bo to samo dziala w pasku .sv-dock. */
@media (max-width: 860px){
  .sv-header__in{ gap: 14px !important; }
  .sv-tools{ gap: 6px !important; }
}
@media (max-width: 767px){
  .sv-header__in{ gap: 10px !important; padding: 0 18px !important; }
  .sv-tools{ gap: 2px !important; }
  .sv-header .sv-nav-cta{ display: none !important; }
  .sv-burger{ width: 42px !important; height: 42px !important; margin-right: -8px !important; }
}
@media (max-width: 400px){
  .sv-logo__a{ font-size: 19px !important; letter-spacing: .12em !important; }
  .sv-logo__b{ letter-spacing: .3em !important; }
}

/* --- 32.2 Liczby w hero --------------------------------------------
   Trzy pozycje przy flex: 1 1 40% lamaly sie na 2 + 1, a trzecia
   rozciagala sie na cala szerokosc. Liczba centrowala sie wzgledem
   calego wiersza, a podpis z max-width zostawal przy lewej krawedzi. */
@media (max-width: 980px){
  .sv-stats{ justify-content: center !important; }
  .sv-stat__l{ margin-left: auto !important; margin-right: auto !important; }
}
@media (max-width: 767px){
  .sv-stat{ flex: 0 1 calc(50% - 14px) !important; text-align: center !important; }
  .sv-stat__n{ text-align: center !important; }
  .sv-stat__l{ max-width: 18ch !important; }
}

/* --- 32.3 Sklep, poziome przewijanie -------------------------------
   .sv-sklep-uklad dostawal na mobile grid-template-columns: 1fr,
   czyli minmax(auto, 1fr). Pasek filtrow z flex-wrap: nowrap podnosil
   min-content kolumny do okolo 710 px i rozpychal cala strone. */
@media (max-width: 1180px){
  .sv-sklep-uklad{ grid-template-columns: minmax(0, 1fr) !important; }
}
.sv-sklep-uklad > *{ min-width: 0 !important; }
.sv-sklep__panel,
.sv-filtry,
.sv-filtry__grupa{ min-width: 0 !important; max-width: 100% !important; }

/* --- 32.4 Tabele w dokumentach prawnych ----------------------------
   .sv-doc__tabela ma min-width: 520 px, wiec na telefonie ostatnia
   kolumna wychodzila poza ekran i byla obcinana. Na malym ekranie
   tabela zwija sie do szerokosci strony i lamie tekst w komorkach. */
@media (max-width: 767px){
  .sv-doc__tabela{
    min-width: 0 !important;
    width: 100% !important;
    table-layout: fixed !important;
    font-size: 13.5px !important;
  }
  .sv-doc__tabela th,
  .sv-doc__tabela td{
    padding: 10px !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    hyphens: auto;
  }
}

/* --- 32.5 Bezpiecznik na przyszla tresc ----------------------------
   overflow-x: clip zamiast hidden, zeby nie zepsuc position: sticky. */
@supports (overflow-x: clip){
  @media (max-width: 767px){
    body{ overflow-x: clip; }
  }
}
@media (max-width: 767px){
  .sv-doc img,
  .sv-doc pre,
  .sv-doc iframe{ max-width: 100% !important; }
}

/* --- 32.6 Pasek filtrow w sklepie ----------------------------------
   .sv-filtry__grupa ma align-items: flex-start, wiec pasek chipow
   dostawal szerokosc tresci (665 px) zamiast szerokosci panelu.
   overflow-x: auto nie mial czego przewijac i strona jechala w bok. */
@media (max-width: 900px){
  .sv-filtry__grupa > .sv-chipy{
    align-self: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* --- 32.7 Wybor wysylki w koszyku i kasie ---------------------------
   Lista metod wysylki siedzi w prawej, waskiej kolumnie tabeli
   podsumowania i dziedziczy text-align: right, przez co na telefonie
   nazwa i cena lamaly sie na osobne linie obok radia. */
#shipping_method{
  list-style: none !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  text-align: left !important;
}
#shipping_method li{
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 10px !important;
  text-align: left !important;
}
#shipping_method li:last-child{ margin-bottom: 0 !important; }
#shipping_method label{ margin: 0 !important; display: inline !important; }
#shipping_method input[type="radio"]{ margin: 0 !important; flex: 0 0 auto !important; }
.woocommerce-shipping-destination{ text-align: left !important; }
@media (max-width: 767px){
  .woocommerce-shipping-totals th,
  .woocommerce-shipping-totals td{
    display: block !important;
    width: 100% !important;
    text-align: left !important;
  }
}

/* --- 32.8 Pasek .sv-dock nie zaslania kasy -------------------------
   Staly pasek "Zarezerwuj sesje" przykrywal przycisk platnosci
   i przycisk aktualizacji koszyka na telefonie. */
body.woocommerce-cart .sv-dock,
body.woocommerce-checkout .sv-dock,
body.woocommerce-account .sv-dock,
body.woocommerce-order-received .sv-dock{ display: none !important; }

/* --- 32.9 Informacja o obowiazkowym adresie w kasie -----------------
   Wstrzykiwana przez snippet "Adres wymagany przy produktach fizycznych",
   gdy w koszyku jest cokolwiek do wysylki. */
.sv-adres-info{
  margin: 0 0 20px;
  padding: 13px 16px;
  border: 1px solid var(--sv-line-soft);
  border-left: 2px solid var(--sv-gold);
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  font-size: 14px;
  line-height: 1.7;
  color: var(--sv-txt-dim);
}
.sv-adres-info strong{ color: var(--sv-txt); }
