/* =========================================================
   STRAMA EKO – STYLE
   1) Kalkulator
   2) Kalendarz – widok jednego miesiąca (z „chipami”)
   ========================================================= */


/* =========================== 1) KALKULATOR =========================== */
:root {
    --primary-color: #445915;       /* dominujący kolor: ciemny turkus */
    --secondary-color: #97bc2c;     /* kolor akcentowy: zieleń */
    --accent-color: #e69732;        /* dodatkowy akcent: pomarańcz */
    --background-color: #f9f9f9;    /* tło sekcji */
    --text-color: #1d1d1d;          /* podstawowy kolor tekstu */
    --light-text-color: #fff;    /* jasny tekst na ciemnym tle */
    --font-family: -apple-system, blinkmacsystemfont, 'Segoe UI', roboto, oxygen,
        ubuntu, cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

/* Wrapper */
.seko-calculator{
  font-family: var(--font-family, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif);
  color: var(--text-color, #1d1d1d);
  background: var(--background-color, #f9f9f9);
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 1.5rem;
}

/* Nagłówek formularza */
.seko-calculator .seko-fieldset{
  border: 0; 
  margin: 0;
  padding: 0;
 }

.seko-calculator .seko-fieldset > legend{
  font-weight: 700;
  margin-bottom: .75rem;
  color: var(--primary-color, #006e73);
}

/* Układ pól */
.seko-calculator .seko-row{
  display:flex;
  align-items:center;
  gap:.5rem;
  margin:.5rem 0 1rem;
}

.seko-calculator .seko-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin:.5rem 0 1rem;
}

.seko-calculator .seko-grid label{
  display:flex; flex-direction:column; gap:6px;
  font-weight:600; color:var(--text-color, #1d1d1d);
}

.seko-calculator .seko-grid select,
.seko-calculator .seko-grid input[type="date"],
.seko-calculator .seko-grid input[type="number"]{
  appearance:none;
  background:#fff;
  border:1px solid #ccc;
  border-radius:4px;
  padding:.6rem .75rem;
  font-size:.95rem;
  line-height:1.2;
}

/* Pomoc pod datami */
.seko-calculator .seko-help{
  grid-column:1 / -1;
  font-size:.9rem;
  color:#555;
}

/* Przycisk (korzysta z kolorów motywu) */
.seko-calculator .seko-btn{
  display:inline-block; font-weight:700; border-radius:4px;
  padding:.7rem 1.2rem; border:none; cursor:pointer;
}

/* Wynik */
.seko-calculator .seko-result{
  margin-top:12px; background:#fff; border:1px solid #e0e0e0;
  border-radius:8px; padding:12px;
}

.seko-calculator .seko-result h4{
  margin:.25rem 0 .75rem;
  color:var(--primary-color, #006e73);
  font-size:1.05rem;
}

.seko-calculator .seko-result .row{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:.25rem 0;
}

.seko-calculator .seko-result .sum{
  font-weight:800;
  border-top:1px dashed #e0e0e0;
  margin-top:.5rem;
  padding-top:.5rem;
}

/* Notka */
.seko-calculator .seko-note{
  margin:.5rem 0 0;
  font-size:.95rem;
  color:#334;
}

/* Stan ukryty */
.seko-calculator .hidden{ display:none; }

/* RWD */
@media (width <=680px){ .seko-calculator .seko-grid{ grid-template-columns:1fr; } }

/* Harmonizacja, gdy stoi obok tabeli cennika */
.pricing-section .wp-block-column .seko-calculator{
  background: var(--background-color, #f9f9f9);
  border-color: #e0e0e0;
}



/* =================== 2) KALENDARZ – JEDEN MIESIĄC ==================== */

/* Pasek narzędzi nad kalendarzem */
.seko-cal-one-wrap{ max-width:80%; margin:1rem auto; }
.seko-cal-ui__top{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.seko-chooser{ display:flex; align-items:center; gap:.5rem; }
.seko-chooser input[type="text"]{ min-width:280px; padding:.5rem .6rem; border:1px solid #ddd; border-radius:4px; }
.seko-cal-nav{ display:flex; align-items:center; gap:.75rem; }
.seko-cal-nav button{ padding:.35rem .6rem; border:1px solid #ccc; background:#fff; border-radius:4px; cursor:pointer; }
.seko-cal-nav button[disabled]{ opacity:.5; cursor:not-allowed; }
#seko-cal-current{ font-weight:500; font-size: 16px; min-width:180px; text-align:center; }

/* Tabela miesiąca */
.seko-cal-table.one{ width:100%; border-collapse:collapse; }
.seko-cal-table.one thead th{ background:#fafafa; font-weight:600; padding:.5rem; border:1px solid #e6e6e6; }
.seko-cal-table.one td{ padding:.5rem; border:1px solid #e6e6e6; vertical-align:top; }

/* Komórka dnia */
.seko-cal-one-wrap .seko-day{
  position:relative; min-height:140px; padding:.55rem; overflow-wrap: anywhere;
}

@media (width <=640px){ .seko-cal-one-wrap .seko-day{ min-height:160px; } }
.seko-cal-one-wrap .seko-day__num{ font-weight:700; font-size: 1.5rem; }

/* Lista znaczników w dniu */
.seko-cal-one-wrap .seko-marks{
  list-style:none; margin:.5rem 0 0; padding:0;
  display:flex; flex-direction:column; gap:.35rem;
  position:static;                      /* nie przyklejaj do dołu kafelka */
}
.seko-cal-one-wrap .seko-marks .abbr{ display:none!important; }  /* ukryj literki-ikonki */
.seko-cal-one-wrap .seko-marks .mark{ background:transparent!important; padding:0; }

/* CHIP z pełną nazwą frakcji */
.seko-cal-one-wrap .mark-chip{
  display:block; width:100%; box-sizing:border-box;
  white-space:normal; overflow-wrap:anywhere;
  line-height:1.2; font-size:1.5rem; font-weight:600;
  padding:.35rem .55rem; border-radius:.6rem;
}

.seko-cal-one-wrap .mark-chip .dot{
  width:.55rem; height:.55rem; border-radius:50%;
  display:inline-block; margin-right:.4rem; vertical-align:middle;
}

/* Kolory chipów (tło + kontrast) */
.seko-cal-one-wrap .mark--komunalne .mark-chip{ background:#3a3a3a; color:#fff; }
.seko-cal-one-wrap .mark--tworzywa  .mark-chip{ background:#ffcf33; color:#1a1a1a; }
.seko-cal-one-wrap .mark--papier    .mark-chip{ background:#2e6bd0; color:#fff; }
.seko-cal-one-wrap .mark--szklo     .mark-chip{ background:#2b8a3e; color:#fff; }
.seko-cal-one-wrap .mark--bio       .mark-chip{ background:#8b5e3c; color:#fff; }

/* Legenda pod kalendarzem (kropki kolorów) */
.seko-legend{ display:flex; flex-wrap:wrap; gap:1rem 1.5rem; margin-top:.75rem; margin-bottom: 2rem; font-size:1.9rem; font-weight: 600;}
.seko-legend .dot{ display:inline-block; width:1.5rem; height:1.5rem; border-radius:50%; margin-right:.35rem; vertical-align:middle; }
.dot--komunalne{ background:#3a3a3a; }
.dot--tworzywa { background:#ffcf33; }
.dot--papier   { background:#2e6bd0; }
.dot--szklo    { background:#2b8a3e; }
.dot--bio      { background:#8b5e3c; }

/* === MOBILE: siatka przewijana horyzontalnie (<= 768px) === */
@media (width <= 768px){
  .seko-cal-one-wrap{
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .seko-cal-table.one{
    min-width: 720px;         /* sprawia, że kolumny mają rozsądną szerokość */
    table-layout: fixed;
  }
}

/* === MOBILE: widok „agenda” – jedna karta = jeden dzień (<= 480px) === */
@media (width <= 480px){
  /* chowamy nagłówek dni tygodnia z tabeli */
  .seko-cal-table.one thead{ display:none; }

  /* każdy tydzień (tr) staje się „listą” kart dni */
  .seko-cal-table.one tr{
    display:block;
    border:0;
  }

  /* pojedynczy dzień jako karta */
  .seko-cal-table.one td{
    display:flex;
    align-items:flex-start;
    gap:.75rem;
    border:1px solid #eee;
    border-radius:10px;
    padding:.65rem .7rem;
    margin-bottom:.55rem;
    min-height:auto;          /* nie wymuszamy wysokich kafelków */
  }

  /* numer dnia – zamiast absolutnego pozycjonowania robimy „badge” z lewej */
  .seko-cal-one-wrap .seko-day{
    min-height:auto;
    padding:0;
  }

  .seko-cal-one-wrap .seko-day__num{
    position: static;
    flex: 0 0 auto;
    display:inline-block;
    width:2.25rem;
    text-align:center;
    font-weight:700;
    line-height:1;
    padding:.35rem .4rem;
    border-radius:.5rem;
    background:#f6f7f9;
    color:#333;
    margin-top:.1rem;
  }

  /* lista chipów w karcie dnia */
  .seko-cal-one-wrap .seko-marks{
    margin:0;
    gap:.35rem;
  }

  .seko-cal-one-wrap .mark-chip{
    font-size:.95rem;       /* ciut mniejsze na bardzo wąskich */
    line-height:1.2;
    padding:.35rem .55rem;
  }

  /* podpis dnia tygodnia przed zawartością (PN–ND) – wg kolumny tabeli */
  .seko-cal-table.one tr td{ position:relative; }

  .seko-cal-table.one tr td::before{
    position:absolute;
    top:.55rem; left:calc(2.25rem + .9rem); /* obok badge z numerem */
    font-size:.8rem; font-weight:600; color:#667;
    text-transform:uppercase;
    content:"";
  }
  .seko-cal-table.one tr td:nth-child(1)::before{ content:"Pn"; }
  .seko-cal-table.one tr td:nth-child(2)::before{ content:"Wt"; }
  .seko-cal-table.one tr td:nth-child(3)::before{ content:"Śr"; }
  .seko-cal-table.one tr td:nth-child(4)::before{ content:"Cz"; }
  .seko-cal-table.one tr td:nth-child(5)::before{ content:"Pt"; }
  .seko-cal-table.one tr td:nth-child(6)::before{ content:"So"; }
  .seko-cal-table.one tr td:nth-child(7)::before{ content:"Nd"; }

  /* kosmetyka legendy pod kalendarzem */
  .seko-legend{ font-size:.9rem; gap:.6rem .9rem; }
}

/* ===== Nagłówek kalendarza (top bar) ===== */
.seko-cal-ui__top{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap;
  padding:.75rem 1rem;
  border:1px solid #e6e6e6;
  background:var(--primary-color);
  box-shadow:0 1px 2px rgb(0 0 0 / 4%);
  margin-bottom:.75rem;
  color: var(--light-text-color);

}

/* wybór obszaru */
.seko-chooser{ display:flex; align-items:center; gap:.5rem; }
.seko-chooser label{ font-weight:600; color:#fff; }

.seko-chooser input[type="text"]{
  min-width:280px; padding:.5rem .65rem;
  border:1px solid #d7d7d7; border-radius:8px; background:#fff;
}

/* nawigacja miesięcy */
.seko-cal-nav{ display:flex; align-items:center; gap:.75rem; }
#seko-cal-current{ font-weight:400; font-size:1.80rem; min-width:180px; text-align:center; }

/* przyciski: zielone z hoverem */
.seko-nav-btn{
  appearance:none; border:1px solid var(--primary-color, #006e73);
  color:#212121;
  padding:.45rem .9rem; border-radius:999px; font-weight:700; cursor:pointer;
  transition:filter .15s ease, transform .02s ease;
}
.seko-nav-btn:hover{ filter:brightness(.92); }
.seko-nav-btn:active{ transform:translateY(1px); }
.seko-nav-btn:focus{ outline:2px solid var(--secondary-color, #2a9370); outline-offset:2px; }

/* mobilnie trochę mniejsze przyciski/tytuł */
@media (width <=480px){
  .seko-nav-btn{ padding:.35rem .6rem; font-size:.92rem; }
  #seko-cal-current{ font-size:1rem; min-width:unset; }
  .seko-chooser input[type="text"]{ min-width:220px; }
}

/* === MOBILE COMPACT (<= 480px): mniejsze kafelki + tylko kolorowe kropki === */
@media (width <= 480px){
  /* ciaśniejsze karty dnia */
  .seko-cal-table.one td{
    gap: .5rem;
    padding: .5rem .6rem;
    margin-bottom: .45rem;
  }

  /* numer dnia trochę węższy, żeby zrobić miejsce na znaczniki */
  .seko-cal-one-wrap .seko-day__num{
    width: 2rem;
    padding: .3rem .35rem;
  }

  /* lista znaczników w jednym wierszu (zawija się przy braku miejsca) */
  .seko-cal-one-wrap .seko-marks{
    margin: 0;
    display: flex;
    flex-flow: row wrap;
    gap: .25rem .35rem;
  }

  /* same „kropki” zamiast pełnych nazw frakcji w dniu */
  .seko-cal-one-wrap .mark-chip{
    width: .9rem;
    height: .9rem;
    padding: 0;
    border-radius: 50%;
    display: inline-block;
    overflow: hidden;
    text-indent: -9999px; /* ukrywa tekst etykiety */
    line-height: 0;       /* żadnych wewnętrznych odstępów */
  }

  /* ukryj wewnętrzną kropkę/margines z desktopu */
  .seko-cal-one-wrap .mark-chip .dot{ display:none; }

  /* legenda – większy tekst i kropki */
  .seko-legend{
    font-size: 1.9rem;
    gap: .75rem 1.25rem;
  }

  .seko-legend .dot{
    width: 1rem;
    height: 1rem;
  }
}

/* === FIX: mobile = normalna siatka miesiąca, bez przewijania i bez "agenda" === */

/* 1) Usuń wymuszone przewijanie i sztuczne minimum szerokości */
@media (width <= 768px){
  .seko-cal-one-wrap{
    overflow-x: visible;        /* było: auto */
    max-width: 100%;            /* zamiast 80% na węższych ekranach */
  }

  .seko-cal-table.one{
    min-width: 0;               /* było: 720px */
    width: 100%;
    table-layout: fixed;        /* stabilne kolumny */
  }
}

/* 2) Przywróć "prawdziwą tabelę" na telefonach (<=480px) – wyłącz tryb agenda */
@media (width <= 480px){
  /* nagłówek dni tygodnia ma być widoczny */
  .seko-cal-table.one thead{ display: table-header-group; }

  /* wiersze i komórki jako tabela, nie bloki */
  .seko-cal-table.one tr{ display: table-row; border: 0; }

  .seko-cal-table.one td{
    display: table-cell;
    padding: .45rem .5rem;      /* trochę ciaśniej, ale bez "kart" */
    margin: 0;
    min-height: auto;
    border: 1px solid #e6e6e6;
    vertical-align: top;
  }

  /* wyłącz pseudo-podpisy PN–ND z trybu agenda */
  .seko-cal-table.one tr td::before{ content: none !important; }

  /* numer dnia normalnie na górze */
  .seko-cal-one-wrap .seko-day{
    min-height: 80px;           /* mniejsze kafelki */
    padding: .4rem;
  }

  .seko-cal-one-wrap .seko-day__num{
    position: static;
    display: inline-block;
    width: auto;
    background: transparent;
    padding: 0;
    margin: 0 0 .25rem;
    font-weight: 700;
  }

  /* znaczniki frakcji: kropki (zostawiamy compact), ale w siatce */
  .seko-cal-one-wrap .seko-marks{
    display: flex;
    flex-flow: row wrap;
    gap: .25rem .35rem;
    margin: 0;
  }

  .seko-cal-one-wrap .mark-chip{
    width: .85rem;
    height: .85rem;
    padding: 0;
    border-radius: 50%;
    display: inline-block;
    text-indent: -9999px;  /* ukrywa tekst */
    line-height: 0;
  }
  .seko-cal-one-wrap .mark-chip .dot{ display:none; }

  /* większa, czytelniejsza legenda */
  .seko-legend{
    font-size: 1.9rem;
    gap: .75rem 1.25rem;
  }

  .seko-legend .dot{
    width: 1rem; height: 1rem;
  }
}

/* === FIX: ostatni kafelek usługi na mobile = jak pozostałe === */
@media (width <= 781px){                /* breakpoint Gutenberga */
  /* każdy kafelek = pełna szerokość, bez auto-centrowania */
  .wp-block-columns .service-card{
    flex: 1 1 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* gdy motyw centruje ostatnią kolumnę – wyłącz to tylko na mobile */
  .wp-block-columns .service-card:last-child{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* przyciski i treść w ostatnim kafelku – jak w innych (nie na środek) */
  .wp-block-columns .service-card .wp-block-buttons{
    justify-content: flex-start !important;
  }

  .wp-block-columns .service-card .wp-block-button__link{
    display: inline-block;               /* zapobiega rozciąganiu */
  }
}
.pricing-table-h3{
  display: none;
}
/* === CENNIK – DESKTOP FIX (nadpisanie trybu "tight") === */
@media (min-width: 900px){
  /* kolumny obok siebie, równo */
  .pricing-columns{
    display:flex;
    gap:2rem;
    align-items:flex-start;
  }
  .pricing-columns > *{
    flex:0 0 50%;
    max-width:50%;
  }

  /* LEWA kolumna z tabelą – NIE flex wewnątrz, żeby notka nie podjeżdżała obok */
  .pricing-columns .wp-block-column:first-child{
    display:block;             /* nadpisuje wcześniejsze display:flex */
  }

  /* wrapper i tabela: pełna szerokość kolumny */
  .price-table-wrap{
    display:block;             /* nadpisuje inline-block */
    width:100%;
    overflow-x:visible;        /* bez paska na desktopie */
  }
  .price-table--lease{
    width:100%;                /* nadpisuje width:max-content */
    display:table;             /* nadpisuje inline-table */
    table-layout:fixed;        /* stabilne kolumny */
    font-size:18px;            /* bez „clamp” – czytelny rozmiar */
  }

  /* zawijanie: tylko ceny zostają w jednym wierszu */
  .price-table--lease th,
  .price-table--lease td{ white-space:normal; }
  .price-table--lease td.num{ white-space:nowrap; text-align:right; }

  /* wykorzystaj <colgroup> do proporcji kolumn (dostosuj, jeśli chcesz) */
  .price-table--lease col.col-type{  width:28%; }   /* „KP 3 / KP 40” */
  .price-table--lease col.col-price{ width:24%; }   /* każda z 3 kolumn cen */
}

/* (opcjonalnie) średnie ekrany: pozwól przewijać poziomo, gdy się nie mieści */
@media (min-width: 641px) and (max-width: 899px){
  .price-table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .price-table--lease{ min-width:720px; table-layout:fixed; }
}
/* Tabela cennika – zawężenie 1. kolumny (desktop) */
@media (min-width: 900px){
  :root{
    /* zmienisz w jednym miejscu: 18–26% zwykle wygląda dobrze */
    --type-col-w: 22%;
  }

  /* 1. kolumna: "Rodzaj kontenera" */
  .price-table--lease col.col-type{
    width: var(--type-col-w);
  }

  /* 3 kolumny cen – równo dzielą pozostałą szerokość */
  .price-table--lease col.col-price{
    width: calc((100% - var(--type-col-w)) / 3);
  }
}
/* =========================================================
   STRAMA EKO – FORMULARZ ZGŁOSZENIA ODBIORU
   [strama_zgloszenie webhook="..."]
   ========================================================= */

:root {
    --sz-primary: #445915;
    --sz-secondary: #97bc2c;
    --sz-accent: #e69732;
    --sz-bg: #f9f9f9;
    --sz-text: #1d1d1d;
    --sz-light: #fff;
    --sz-border: #ddd;
    --sz-success: #2e7d32;
    --sz-error: #c62828;
}

/* Wrapper */
.sz-wrap {
    max-width: 700px;
    margin: 0 auto;
    font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    color: var(--sz-text);
}

/* Form */
.sz-form {
    background: var(--sz-bg);
    border: 1px solid var(--sz-border);
    border-radius: 12px;
    padding: 1.5rem;
}

/* Fieldset */
.sz-fieldset {
    border: none;
    margin: 0 0 1.5rem;
    padding: 0;
}

.sz-fieldset legend {
    font-weight: 700;
    font-size: 1.15rem;
    color: var(--sz-primary);
    margin-bottom: 1rem;
    padding: 0;
}

/* Pola formularza */
.sz-field {
    margin-bottom: 1rem;
}

.sz-field label {
    display: block;
    margin-bottom: 0.4rem;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--sz-text);
}

.sz-field input[type="text"],
.sz-field input[type="tel"],
.sz-field input[type="email"],
.sz-field select,
.sz-field textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid var(--sz-border);
    border-radius: 8px;
    font-size: 1rem;
    background: var(--sz-light);
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}

.sz-field input:focus,
.sz-field select:focus,
.sz-field textarea:focus {
    outline: none;
    border-color: var(--sz-primary);
    box-shadow: 0 0 0 3px rgba(68, 89, 21, 0.15);
}

.sz-field select:disabled {
    background: #f0f0f0;
    color: #888;
    cursor: not-allowed;
}

.sz-field textarea {
    resize: vertical;
    min-height: 60px;
}

/* Grupa adresu */
.sz-adres-group {
    background: var(--sz-light);
    border: 1px solid #e0e0e0;
    border-left: 4px solid var(--sz-primary);
    border-radius: 10px;
    padding: 1.25rem;
    margin-bottom: 1rem;
}

.sz-adres-group h4 {
    margin: 0 0 1rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--sz-primary);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Przycisk usuń */
.sz-usun-adres {
    background: var(--sz-error);
    color: var(--sz-light);
    border: none;
    padding: 0.35rem 0.75rem;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 600;
    transition: background 0.2s;
}

.sz-usun-adres:hover {
    background: #a51d1d;
}

/* Przyciski */
.sz-btn-primary {
    display: block;
    width: 100%;
    background: var(--sz-primary);
    color: var(--sz-light);
    padding: 1rem 2rem;
    border: none;
    border-radius: 8px;
    font-size: 1.1rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
}

.sz-btn-primary:hover {
    background: #364712;
}

.sz-btn-primary:active {
    transform: translateY(1px);
}

.sz-btn-secondary {
    display: inline-block;
    background: var(--sz-light);
    color: var(--sz-primary);
    border: 2px solid var(--sz-primary);
    padding: 0.75rem 1.25rem;
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
    margin-bottom: 1rem;
}

.sz-btn-secondary:hover {
    background: var(--sz-primary);
    color: var(--sz-light);
}

/* Submit wrapper */
.sz-submit {
    margin-top: 1.5rem;
}

/* Komunikaty */
.sz-message {
    padding: 1rem 1.25rem;
    border-radius: 8px;
    margin-top: 1rem;
    font-size: 0.95rem;
    line-height: 1.5;
}

.sz-loading {
    background: #e3f2fd;
    color: #1565c0;
    border: 1px solid #90caf9;
}

.sz-success {
    background: #e8f5e9;
    color: var(--sz-success);
    border: 1px solid #a5d6a7;
}

.sz-error {
    background: #ffebee;
    color: var(--sz-error);
    border: 1px solid #ef9a9a;
}

/* RWD */
@media (max-width: 600px) {
    .sz-form {
        padding: 1rem;
    }
    
    .sz-adres-group {
        padding: 1rem;
    }
    
    .sz-adres-group h4 {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .sz-btn-primary {
        padding: 0.85rem 1.5rem;
        font-size: 1rem;
    }
    
    .sz-field input,
    .sz-field select,
    .sz-field textarea {
        padding: 0.65rem 0.85rem;
        font-size: 16px; /* zapobiega zoomowaniu na iOS */
    }
}

/* Animacja ładowania */
.sz-loading::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid #1565c0;
    border-top-color: transparent;
    border-radius: 50%;
    animation: sz-spin 0.8s linear infinite;
    margin-right: 0.5rem;
    vertical-align: middle;
}

@keyframes sz-spin {
    to { transform: rotate(360deg); }
}