.olesie-zap{--z-ink:#2f2d28;--z-line:#E8E0D3;--z-milk:#FAF8F4;--z-sage:#9FAA96;--z-gold:#b99a60;
  max-width:1040px;margin:0 auto;padding:24px 16px 60px;color:var(--z-ink);font-family:"Montserrat",Arial,sans-serif}
.olesie-zap__eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--z-gold);margin:0 0 6px}
.olesie-zap h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(28px,5vw,42px);margin:0 0 8px}
.olesie-zap__lead{color:#766f63;font-size:14.5px;line-height:1.6;margin:0 0 26px;max-width:60ch}
.olesie-zap-ok{background:#f2f6ef;border:1px solid #cdd8c6;border-radius:10px;padding:14px 16px;margin-bottom:22px;font-size:14px}
.olesie-zap-blad{background:#fdecea;border:1px solid #f5c6c2;border-radius:10px;padding:14px 16px;margin-bottom:22px;font-size:14px}
.olesie-zap-lock{background:#fbf7ee;border:1px dashed #e0cfa8;border-radius:10px;padding:12px 14px;margin-bottom:16px;font-size:13.5px;color:#6b5a3a}
.olesie-zap-item{border-top:1px solid var(--z-line);padding-top:22px;margin-top:22px}
.olesie-zap-item__tytul{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:24px;margin:0 0 16px}
.olesie-zap-grid{display:grid;grid-template-columns:320px 1fr;gap:28px;align-items:start}
.olesie-zap-preview{position:sticky;top:16px}
.olesie-zap-preview__frame{aspect-ratio:3/4;background:#fff;border:1px solid var(--z-line);border-radius:8px;
  box-shadow:0 10px 26px -18px rgba(47,45,40,.5);overflow:hidden;display:grid;place-items:center}
.olesie-zap-preview__frame img,.olesie-zap-preview__frame svg{width:100%;height:100%;object-fit:contain;display:block}
.olesie-zap-preview__note{font-size:11.5px;line-height:1.5;color:#766f63;margin:8px 0 0}
.olesie-zap-fs{border:1px solid var(--z-line);border-radius:12px;padding:16px;margin:0 0 16px;background:var(--z-milk)}
.olesie-zap-fs legend{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#766f63;padding:0 6px}
.olesie-zap-f{display:block;margin-bottom:12px}
.olesie-zap-f>span{display:block;font-size:12.5px;font-weight:600;margin-bottom:5px}
.olesie-zap-f small{display:block;font-size:11.5px;color:#766f63;margin-top:4px;line-height:1.45}
.olesie-zap-f input,.olesie-zap-f textarea{width:100%;font:inherit;font-size:16px;background:#fff;
  border:1.5px solid var(--z-line);border-radius:9px;padding:11px 12px;color:var(--z-ink)}
.olesie-zap-f input:focus,.olesie-zap-f textarea:focus{outline:none;border-color:var(--z-sage);box-shadow:0 0 0 3px #eef2ea}
.olesie-zap-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.olesie-zap-inline{font-size:13.5px;margin-right:14px;display:inline-flex;align-items:center;gap:6px}
.olesie-zap-tresci{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.olesie-zap-tresc{display:block;border:1.5px solid var(--z-line);border-radius:10px;padding:8px;background:#fff;cursor:pointer;text-align:center}
.olesie-zap-tresc:has(input:checked){border-color:var(--z-sage);box-shadow:0 0 0 2px #eaf0e6}
.olesie-zap-tresc input{position:absolute;opacity:0;pointer-events:none}
.olesie-zap-tresc img{width:100%;aspect-ratio:3/4;object-fit:contain;display:block}
.olesie-zap-tresc span{display:block;font-size:12px;font-weight:600;margin-top:6px}
.olesie-zap-licznik{background:#f2f6ef;border:1px solid #cdd8c6;border-radius:9px;padding:9px 12px;font-size:13px;margin:10px 0}
.olesie-zap-licznik strong{font-family:"Cormorant Garamond",Georgia,serif;font-size:20px;color:#7C8B73}
.olesie-zap-akcept{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.5;margin:16px 0;cursor:pointer}
.olesie-zap-akcept input{margin-top:3px;width:18px;height:18px;accent-color:var(--z-sage);flex:0 0 auto}
.olesie-zap-akcje{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.olesie-zap-btn{background:var(--z-sage);color:#fff;border:0;border-radius:10px;padding:14px 26px;font-weight:700;
  font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.olesie-zap-btn:hover{background:#7C8B73}
.olesie-zap-hint{font-size:12px;color:#766f63}
.olesie-zap-cta{background:#f2f6ef;border:1px solid #cdd8c6;border-radius:12px;padding:20px;margin:0 0 26px}
.olesie-zap-cta h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;margin:0 0 8px}
.olesie-zap-cta__btn{display:inline-block;background:var(--z-sage,#9FAA96);color:#fff;text-decoration:none;
  border-radius:10px;padding:13px 24px;font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.olesie-zap-cta__small{font-size:12px;color:#766f63;margin:10px 0 0}
@media(max-width:820px){.olesie-zap-grid{grid-template-columns:1fr}.olesie-zap-preview{position:static}
  .olesie-zap-row{grid-template-columns:1fr}.olesie-zap-tresci{grid-template-columns:repeat(2,1fr)}}
.olesie-zap-dom{margin-top:22px;padding:18px;border:1px solid var(--z-line);border-radius:12px;background:#fbf9f5}
.olesie-zap-dom h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:21px;margin:0 0 6px}
.olesie-zap-dom__lead{font-size:13.5px;line-height:1.55;color:#5d564c;margin:0 0 12px}
.olesie-zap-dom__stale{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.olesie-zap-dom__stale span{background:#fff;border:1px solid var(--z-line);border-radius:20px;padding:5px 12px;font-size:12px;color:#5d564c}
.olesie-zap-dom__wysylka{background:#fff;border:1px solid var(--z-line);border-radius:9px;padding:11px 13px;font-size:12.5px;line-height:1.5;margin:12px 0}
/* ⛔ PELNOEKRANOWE NAKLADKI FORMULARZA STOJA NA MAKSIMUM (2147483647).
   TrustMate wstrzykuje wlasny arkusz, w ktorym `.tm-productModal`,
   `.tm-productModal-bg`, `.tm-widget-popover` i `.tm-overlay-tooltip` maja
   `z-index: 2147483647` — gorna granice. Przy 9999/10002 widget opinii malowal
   sie PO WIERZCHU powiekszonego podgladu (zgloszenie Mateusza 23.10.2026,
   telefon, zrzut: „5.0 Ocena / 1414 opinii” na zaproszeniu komunijnym).
   ⚠ Widac to TYLKO po zgodzie na ciasteczka — bez niej Cookiebot trzyma
   skrypt TrustMate jako `text/plain` i widget w ogole sie nie laduje.
   Dlatego w mojej przegladarce nie bylo tego widac, a na telefonie Mateusza
   bylo. ⚠ `elementFromPoint` tez tego nie pokaze — elementy TrustMate maja
   `pointer-events: none`: nie lapia klikniec, ale MALUJA.
   Przy rownym z-index wygrywa element pozniejszy w dokumencie, a obie
   nakladki dokladamy do `body` dopiero przy otwarciu. Kafelka `.olesie-zap-fab`
   i podgladu `--sledzi` NIE podnosimy: maja zostac pod oknem. */
.olesie-zap-modal{position:fixed;inset:0;background:rgba(47,45,40,.55);display:grid;place-items:center;z-index:2147483647;padding:18px}
.olesie-zap-modal__box{background:#fff;border-radius:14px;padding:26px;max-width:460px;box-shadow:0 30px 70px -30px rgba(0,0,0,.5)}
.olesie-zap-modal__box h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:23px;margin:0 0 10px}
.olesie-zap-modal__box p{font-size:14px;line-height:1.6;color:#5d564c;margin:0 0 10px}
.olesie-zap-modal__info{background:#f2f6ef;border:1px solid #cdd8c6;border-radius:9px;padding:11px 13px;font-size:13px!important}
.olesie-zap-modal__akcje{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:16px}
.olesie-zap-modal__anuluj{background:none;border:0;color:#766f63;font-size:13px;cursor:pointer;text-decoration:underline}
.olesie-zap-preview__wrap{position:relative}
.olesie-zap-preview__zoom{position:absolute;top:10px;left:10px;z-index:5;width:36px;height:36px;border-radius:50%;
  border:1px solid var(--z-line);background:#fff;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 8px rgba(47,45,40,.16)}
.olesie-zap-preview__zoom svg{width:18px;height:18px;fill:none;stroke:var(--z-ink);stroke-width:2;stroke-linecap:round}
.olesie-zap-modal--zoom{cursor:zoom-out}
.olesie-zap-zoom__box{background:#fff;border-radius:10px;padding:10px;max-width:94vw;max-height:92vh;display:grid;place-items:center}
.olesie-zap-zoom__img{height:min(86vh,900px);width:auto;max-width:92vw;display:block}
.olesie-zap-echo{margin:6px 0 0;font-size:12px;line-height:1.5;color:#5d564c;background:#f7f5f0;
  border-left:3px solid var(--z-sage);border-radius:0 7px 7px 0;padding:7px 10px}
.olesie-zap-echo strong{font-weight:600}
.olesie-zap-echo--uwaga{background:#fdf3e7;border-left-color:#d9a441}
.olesie-zap-echo--uwaga::after{content:" Sprawdź — powinno być „kościele/pałacu/restauracji…”, bo na zaproszeniu jest „w …”.";color:#8a6321}
.olesie-zap-szp{margin:4px 0 0;font-weight:600}
.olesie-zap-szp__echo{margin:6px 0 0;font-size:12px;color:#5d564c;background:#f7f5f0;
  border-left:3px solid var(--z-sage);border-radius:0 7px 7px 0;padding:7px 10px}
.olesie-zap-zatw{background:#f2f6ef;border:1px solid #cdd8c6;border-radius:12px;padding:20px;align-self:start}
.olesie-zap-zatw__tag{margin:0 0 8px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:#7C8B73}
.olesie-zap-zatw__txt{margin:0 0 10px;font-size:14px;line-height:1.6;color:#4a443b}
.olesie-zap-zatw__txt:last-child{margin-bottom:0}
.olesie-zap-modal__box--szer{max-width:520px}
.olesie-zap-podsum{list-style:none;margin:14px 0;padding:12px 14px;background:#faf8f4;border:1px solid var(--z-line);border-radius:9px}
.olesie-zap-podsum li{display:flex;justify-content:space-between;gap:14px;font-size:13px;padding:5px 0;border-bottom:1px dashed var(--z-line)}
.olesie-zap-podsum li:last-child{border-bottom:0}
.olesie-zap-podsum span{color:#766f63;flex:0 0 auto}
.olesie-zap-podsum strong{text-align:right;font-weight:600}
.olesie-zap-btn--sec{background:transparent;color:var(--z-ink);border:1.5px solid var(--z-line)}
.olesie-zap-btn--sec:hover{background:#f2f0eb}
.olesie-zap-btn:disabled{opacity:.45;cursor:not-allowed}
.olesie-zap-modal{transition:opacity .18s ease}
.olesie-zap-modal--znika{opacity:0}
.olesie-zap-modal .olesie-zap-akcept{margin:14px 0 0;font-size:13px}
.olesie-zap-btn--duzy{padding:15px 34px;font-size:15px}
.olesie-zap-akcje{flex-direction:column;align-items:flex-start;gap:9px}
/* Okna doklejamy do <body>, wiec zmienne z .olesie-zap tam nie siegaja — powtarzamy je tutaj */
.olesie-zap-modal{--z-ink:#2f2d28;--z-line:#E8E0D3;--z-milk:#FAF8F4;--z-sage:#9FAA96;--z-gold:#b99a60;
  font-family:"Montserrat",Arial,sans-serif;color:var(--z-ink)}
.olesie-zap-modal .olesie-zap-btn{background:#9FAA96;color:#fff}
.olesie-zap-modal .olesie-zap-btn:hover{background:#7C8B73}
.olesie-zap-akcept--nudz{background:#fdf6e8;border-color:var(--z-gold);animation:zapNudz .4s ease}
@keyframes zapNudz{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.olesie-zap-modal .olesie-zap-akcept{display:flex;gap:9px;align-items:flex-start;padding:11px 13px;
  border:1px solid var(--z-line);border-radius:9px;background:var(--z-milk);cursor:pointer;transition:background .2s,border-color .2s}
/* Po wyslaniu: co klient nam przekazal */
.olesie-zap-wyslane{margin-top:18px}
.olesie-zap-wyslane__tyt{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:19px;
  margin:18px 0 8px;display:flex;align-items:baseline;gap:7px}
.olesie-zap-wyslane__tyt span{font-family:"Montserrat",Arial,sans-serif;font-size:12px;color:#8a8175}
.olesie-zap-wyslane__lista{margin:0;padding:12px 14px;background:var(--z-milk);border:1px solid var(--z-line);border-radius:10px}
.olesie-zap-wyslane__lista>div{display:flex;justify-content:space-between;gap:16px;padding:6px 0;
  border-bottom:1px dashed var(--z-line)}
.olesie-zap-wyslane__lista>div:last-child{border-bottom:0}
.olesie-zap-wyslane__lista dt{font-size:12.5px;color:#8a8175;margin:0;flex:0 0 auto}
.olesie-zap-wyslane__lista dd{font-size:13.5px;margin:0;text-align:right;font-weight:600}
.olesie-zap-goscie{max-height:210px;overflow-y:auto;margin:0;padding:10px 10px 10px 34px;
  background:#fff;border:1px solid var(--z-line);border-radius:10px;font-size:13.5px;line-height:1.75}
.olesie-zap-goscie li{padding:1px 0}
.olesie-zap-goscie::-webkit-scrollbar{width:8px}
.olesie-zap-goscie::-webkit-scrollbar-thumb{background:#d9d2c4;border-radius:8px}
/* Zgloszenie poprawki */
.olesie-zap-kontakt{margin-top:22px;padding:18px;border:1px solid var(--z-line);border-radius:12px;background:var(--z-milk)}
.olesie-zap-kontakt__tyt{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:20px;margin:0 0 6px}
.olesie-zap-kontakt__txt{font-size:13.5px;color:#5d564c;line-height:1.6;margin:0 0 12px}
.olesie-zap-kontakt__form{display:grid;gap:12px;justify-items:start}
.olesie-zap-kontakt__form .olesie-zap-f{width:100%}
.olesie-zap-licznik--zle{color:#a4413a}
.olesie-zap-nadmiar{margin:6px 0 0;padding:10px 12px;background:#fdf1ef;border:1px solid #e8c4bf;
  border-radius:9px;font-size:13px;line-height:1.6;color:#7d3a34}
.olesie-zap-link{background:none;border:0;padding:0;font:inherit;color:#7d3a34;
  text-decoration:underline;cursor:pointer;font-weight:700}
.olesie-zap-dom__czeka{margin:12px 0;padding:11px 13px;background:#fdf6e8;border:1px solid #e6d3a8;
  border-radius:9px;font-size:13px;line-height:1.6;color:#6b5730}
.olesie-zap-preview--stoi{position:static}
.olesie-zap-prawa{min-width:0}
.olesie-zap-prawa .olesie-zap-wyslane{margin-top:20px}
.olesie-zap__lead-link{color:inherit;text-decoration:underline;text-underline-offset:3px}
.olesie-zap__lead-link:hover{color:var(--z-sage)}
.olesie-zap-kontakt{scroll-margin-top:20px}
/* Naglowek strony pochodzi z formularza, nie z motywu */
.olesie-zap-strona .wp-block-post-title,
.olesie-zap-strona .entry-title,
.olesie-zap-strona .page-title{display:none}
.olesie-zap__lead+.olesie-zap__lead{margin-top:10px}
.olesie-zap-modal__uwaga{background:#fdf6e8;border:1px solid #e6d3a8;border-radius:9px;
  padding:11px 13px;font-size:13px!important;line-height:1.7;color:#6b5730;margin:0 0 10px}
.olesie-zap-czeka{transition:background-color .25s ease}
/* Zaproszenie sklada sie z kilku kart — kazda ma wlasny podglad pod spodem */
.olesie-zap-preview__wrap--dodatkowa{margin-top:16px}
.olesie-zap-preview__frame--koperta{aspect-ratio:176/125}
.olesie-zap-podpis{font-size:12.5px;color:#8a8175;margin:12px 0 6px;line-height:1.5}
.olesie-zap-dwa{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.olesie-zap-dwa{grid-template-columns:1fr}}
/* Status zamowienia obok „Napisz do nas" */
.olesie-zap-koniec{display:grid;grid-template-columns:minmax(190px,240px) 1fr;gap:16px;
  align-items:start;margin-top:22px}
.olesie-zap-koniec .olesie-zap-kontakt{margin-top:0}
.olesie-zap-status{padding:16px 18px;border:1px solid var(--z-line);border-radius:12px;background:#fff}
.olesie-zap-status__tag{margin:0 0 7px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--z-sage);font-weight:700}
.olesie-zap-status__txt{margin:0 0 10px;font-size:13.5px;line-height:1.55;color:#5d564c}
.olesie-zap-status__nr{margin:0;font-size:12px;color:#8a8175}
@media(max-width:720px){.olesie-zap-koniec{grid-template-columns:1fr}}
/* Wzor bez renderu — formularz na calej szerokosci, bez pustej kolumny podgladu */
.olesie-zap-grid--bez-podgladu{grid-template-columns:1fr;max-width:760px}
.olesie-zap-grid--bez-podgladu .olesie-zap-dwa{grid-template-columns:1fr 1fr}
/* Komunikat o zatwierdzeniu i status zamowienia stoja obok siebie */
.olesie-zap-glowka{display:grid;grid-template-columns:1fr minmax(190px,240px);gap:16px;align-items:start}
.olesie-zap-glowka .olesie-zap-status{margin:0}
.olesie-zap-koniec{grid-template-columns:1fr}
@media(max-width:720px){.olesie-zap-glowka{grid-template-columns:1fr}}
.olesie-zap-akcept-info{margin:0 0 12px;padding:12px 14px;background:#f2f6ef;border:1px solid #cdd8c6;
  border-radius:10px;font-size:13.5px;line-height:1.6;color:#4a5344}

/* Podglad wiekszy — arkusz A4 w kolumnie 320 px byl nieczytelny */
.olesie-zap-grid{grid-template-columns:minmax(360px,480px) 1fr;gap:32px}
@media(max-width:1100px){.olesie-zap-grid{grid-template-columns:minmax(300px,380px) 1fr;gap:24px}}

/* Kafelki wyboru pokazuja SAMA tresc — prawa polowe arkusza, bez potwierdzenia.
   Plik jest jeden, wiec kadrujemy obrazek zamiast robic drugi podglad. */
/* Kafelek trzyma SVG wstawione do strony (a nie obrazek) — kadr ustawia JS
   na sama karte tresci, wiec nic tu nie przycinamy. */
.olesie-zap-tresc__okno{display:block;position:relative;overflow:hidden;aspect-ratio:12/17;
  border-radius:6px;background:#fff}
.olesie-zap-tresc__okno svg{width:100%;height:100%;display:block}

/* Powiekszenie dotyczy TYLKO arkusza (tresc + potwierdzenie).
   Okladka i koperta zostaja w dawnym rozmiarze — byly czytelne. */
.olesie-zap-preview__wrap--dodatkowa{max-width:320px}
.olesie-zap-preview__wrap--dodatkowa+.olesie-zap-preview__note{max-width:320px}

/* Male kafelki sluza do WYBORU ukladu, nie do wypelniania — kolorowe podswietlenia
   pustych pol tylko robilyby tam szum. Zostaje sam tekst; kolory ma duzy podglad. */
.olesie-zap-tresc__okno svg rect[data-opa-pole]{display:none}

/* Samouczek: powitanie na srodku, potem dymki przy konkretnych miejscach */
.olesie-zap-pomoc{margin:14px 0 0;display:inline-flex;align-items:center;gap:9px;cursor:pointer;
  background:#fff;border:1.5px solid var(--z-line);border-radius:999px;padding:9px 18px;
  font:inherit;font-size:13.5px;color:var(--z-ink);transition:background .2s,border-color .2s}
.olesie-zap-pomoc:hover{background:#f2f6ef;border-color:#cdd8c6}
.olesie-zap-pomoc span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;
  background:var(--z-sage);color:#fff;font-weight:700;font-size:12px;flex:0 0 auto}

.olesie-zap-tur{position:fixed;inset:0;z-index:9998;pointer-events:none;
  --z-ink:#2f2d28;--z-line:#E8E0D3;--z-milk:#FAF8F4;--z-sage:#9FAA96;
  font-family:"Montserrat",Arial,sans-serif}

.olesie-zap-dymek{position:fixed;width:min(330px,calc(100vw - 24px));pointer-events:auto;
  background:#fff;border:1px solid var(--z-line);border-radius:14px;padding:20px 22px;
  box-shadow:0 24px 60px -24px rgba(47,45,40,.45);color:var(--z-ink)}
.olesie-zap-dymek--srodek{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(460px,calc(100vw - 32px))}
.olesie-zap-dymek--srodek .olesie-zap-dymek__strzalka{display:none}

/* strzalka = obrocony kwadrat z ta sama ramka co dymek */
.olesie-zap-dymek__strzalka{position:absolute;width:13px;height:13px;background:#fff;
  border:1px solid var(--z-line);transform:rotate(45deg)}
.olesie-zap-dymek--prawo .olesie-zap-dymek__strzalka{left:-8px;border-right:0;border-top:0}
.olesie-zap-dymek--lewo  .olesie-zap-dymek__strzalka{right:-8px;border-left:0;border-bottom:0}
.olesie-zap-dymek--dol   .olesie-zap-dymek__strzalka{top:-8px;border-right:0;border-bottom:0}
.olesie-zap-dymek--gora  .olesie-zap-dymek__strzalka{bottom:-8px;border-left:0;border-top:0}

.olesie-zap-dymek__licznik{margin:0 0 8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--z-sage);font-weight:700}
.olesie-zap-dymek h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:21px;margin:0 0 8px}
.olesie-zap-dymek__tresc{margin:0;font-size:14px;line-height:1.7;color:#5d564c}
.olesie-zap-dymek__kropki{display:flex;gap:6px;margin:16px 0 0}
.olesie-zap-dymek__kropki i{width:7px;height:7px;border-radius:50%;background:var(--z-line);
  transition:background .2s,transform .2s}
.olesie-zap-dymek__kropki i.jest{background:var(--z-sage);transform:scale(1.35)}
.olesie-zap-dymek__akcje{display:flex;gap:12px;align-items:center;margin-top:14px}
.olesie-zap-dymek__link{background:none;border:0;padding:0;font:inherit;font-size:13px;color:#766f63;
  text-decoration:underline;cursor:pointer}
.olesie-zap-dymek__pomin{margin-left:auto}

/* wskazywane miejsce — pierscien, zeby oko trafilo od razu */
.olesie-zap-cel{position:relative;z-index:9999;border-radius:10px;
  box-shadow:0 0 0 3px #9FAA96, 0 0 0 9px rgba(159,170,150,.22);
  transition:box-shadow .25s ease}

/* ══════════════════════════════════════════════════════════════════
   TELEFON — blok zbiorczy NA KONCU pliku.
   Reguly dokladane wyzej (siatka 360-480px, pary pol) nadpisywaly
   wczesniejsze przelaczenie na jedna kolumne i formularz wychodzil
   poza ekran. Tutaj domykamy to raz, dla wszystkich przypadkow.
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 820px) {
  .olesie-zap{padding:18px 14px 48px}
  .olesie-zap-grid,
  .olesie-zap-grid--bez-podgladu{grid-template-columns:1fr;gap:20px;max-width:none}
  .olesie-zap-preview{position:static}
  .olesie-zap-glowka,
  .olesie-zap-koniec{grid-template-columns:1fr;gap:14px}
  .olesie-zap-dwa,
  .olesie-zap-grid--bez-podgladu .olesie-zap-dwa{grid-template-columns:1fr;gap:10px}

  /* kartki dodatkowe na calej szerokosci — 320px na telefonie to znaczek */
  .olesie-zap-preview__wrap--dodatkowa,
  .olesie-zap-preview__wrap--dodatkowa+.olesie-zap-preview__note{max-width:none}

  /* wysylka i domowienie: przycisk na cala szerokosc, latwiej trafic kciukiem */
  .olesie-zap-btn--duzy{width:100%;text-align:center}
  .olesie-zap-akcje{align-items:stretch}
  .olesie-zap-modal__akcje{flex-direction:column;align-items:stretch}
  .olesie-zap-modal__akcje .olesie-zap-btn{width:100%}
  .olesie-zap-modal__anuluj{text-align:center;padding:6px 0}
  .olesie-zap-dymek__pomin{margin-left:0}

  .olesie-zap__head h1{font-size:30px}
  .olesie-zap-modal{padding:12px}
  .olesie-zap-modal__box{padding:20px}
}

@media (max-width: 430px) {
  .olesie-zap-tresci{grid-template-columns:repeat(2,1fr);gap:8px}
  .olesie-zap-goscie{max-height:180px}
  .olesie-zap-dymek{padding:17px 18px}
  .olesie-zap-dymek h3{font-size:19px}
}

/* ══════════════════════════════════════════════════════════════════
   Poprawki po przegladzie Sylwii (09.2026)
   ══════════════════════════════════════════════════════════════════ */

/* Samouczek: przy prawej krawedzi, od prawej „Dalej", na lewo „Pomiń". */
.olesie-zap-dymek__akcje{justify-content:flex-end}
.olesie-zap-dymek__pomin{margin-left:0}
.olesie-zap-dymek__wstecz{margin-right:auto}

/* X zamykajacy powiekszony podglad — przy prawej krawedzi kadru. */
.olesie-zap-zoom__box{position:relative}
/* Ciemny, nie bialy — na bialym zaproszeniu na pelnym ekranie bialy
   krazek gubil sie zupelnie, a to jedyne wyjscie z podgladu. */
.olesie-zap-zoom__x{position:absolute;top:8px;right:8px;width:38px;height:38px;border-radius:50%;
  border:0;background:rgba(47,45,40,.82);color:#fff;font-size:23px;line-height:1;
  cursor:pointer;display:grid;place-items:center;z-index:3;
  box-shadow:0 2px 10px rgba(47,45,40,.3)}

/* Podglad zaproszenia schodzi z klientka w dol (zamiast plywajacej lupki).
   Kafel zostaje kafelkiem — tylko przykleja sie do gornej krawedzi. */
.olesie-zap-preview__wrap--sledzi{position:fixed;top:10px;left:14px;z-index:9990;
  width:42vw;max-width:220px;box-shadow:0 14px 34px -14px rgba(47,45,40,.55);
  border-radius:9px;background:#fff}
.olesie-zap-preview__luka{flex:none}

@media (max-width: 820px) {
  /* Samouczek stoi tuz pod podswietlona sekcja (ok. 1,5 cm), na cala
     szerokosc ekranu, ze strzalka wskazujaca w gore. */
  /* UWAGA: overflow na samym dymku PRZYCINA strzalke, bo trojkacik wystaje
     8 px ponad jego krawedz. Dlatego dymek zostaje bez przycinania,
     a ewentualne przewijanie dostaje sam tekst. */
  .olesie-zap-dymek--telefon{width:calc(100vw - 24px);max-width:none;
    overflow:visible;z-index:10000}
  .olesie-zap-dymek--telefon .olesie-zap-dymek__tresc{max-height:38vh;overflow-y:auto}

  /* Okladka byla dwa razy wyzsza od reszty podgladow — polowa szerokosci
     daje polowe wysokosci, bo ramka trzyma proporcje. */
  .olesie-zap-preview__wrap--okladka,
  .olesie-zap-preview__wrap--okladka+.olesie-zap-preview__note{max-width:50%}
}

/* Podglad koperty stoi przy sekcji „Lista na koperty", a nie w kolumnie
   podgladow — w dlugiej kolumnie ladowal na samym dole formularza. */
.olesie-zap-preview--przy-sekcji{position:static;max-width:260px;margin:0 0 16px}
.olesie-zap-preview--przy-sekcji .olesie-zap-preview__wrap--dodatkowa,
.olesie-zap-preview--przy-sekcji .olesie-zap-preview__note{max-width:none}
@media (max-width: 820px){
  .olesie-zap-preview--przy-sekcji{max-width:60%}
}

/* ── Powiekszony podglad ─────────────────────────────────────────────
   CALY prostokat naraz, pomniejszony tak, zeby sie zmiescil. Powiekszanie
   zostawiamy palcom (`touch-action: pinch-zoom`) — przewijanie polowami
   przez strzalki bylo oporne i nie dawalo sie przyblizyc. */
/* `touch-action:none` — gesty obsluguje nasz kod, nie przegladarka.
   Przegladarkowy pinch powieksza CALA strone, wiec po zamknieciu podgladu
   formularz zostawal przyblizony. Skalujemy wylacznie obrazek. */
.olesie-zap-modal--zoom{touch-action:none}
.olesie-zap-zoom__box{overflow:hidden}
.olesie-zap-zoom__img{transform-origin:center center;will-change:transform}
.olesie-zap-zoom__img{max-width:100%;max-height:100%;width:auto;height:auto;
  object-fit:contain;display:block}

@media (max-width: 820px) {
  .olesie-zap-modal--zoom{padding:0}
  .olesie-zap-zoom__box{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;
    border-radius:0;padding:8px;display:grid;place-items:center}
  .olesie-zap-zoom__img{max-height:calc(100dvh - 16px)}
  .olesie-zap-zoom__x{top:10px;right:10px}
}

/* Podglad koperty stoi przy sekcji „Lista na koperty", a nie w kolumnie
   podgladow — w dlugiej kolumnie ladowal na samym dole formularza. */
.olesie-zap-preview--przy-sekcji{position:static;max-width:260px;margin:0 0 16px}
.olesie-zap-preview--przy-sekcji .olesie-zap-preview__wrap--dodatkowa,
.olesie-zap-preview--przy-sekcji .olesie-zap-preview__note{max-width:none}
@media (max-width: 820px){
  .olesie-zap-preview--przy-sekcji{max-width:60%}
}



/* „＋ dodaj druga osobe" — dyskretny, bo to wyjatek, nie regula. */
.olesie-zap-dodaj{margin-top:10px;background:none;border:1px dashed var(--z-line);
  border-radius:9px;padding:9px 14px;font:inherit;font-size:13px;color:#5d564c;cursor:pointer}
.olesie-zap-dodaj:hover{border-color:var(--z-sage,#9FAA96);color:var(--z-ink)}
.olesie-zap-dodaj[hidden]{display:none}

/* ⚠️ Kontenery z wlasnym `display` (siatki .olesie-zap-dwa i .olesie-zap-row)
   NADPISYWALY atrybut `hidden` — przegladarka ukrywa go regula
   `[hidden]{display:none}` o nizszej specyficznosci, wiec pola „ukryte"
   caly czas byly widoczne. Ta regula domyka temat dla calego formularza. */
.olesie-zap [hidden],
.olesie-zap-dwa[hidden],
.olesie-zap-row[hidden]{display:none}

/* „Usuń drugą osobę" — dyskretne wyjscie awaryjne pod polami. */
.olesie-zap-usun{margin-top:8px;background:none;border:0;padding:0;font:inherit;
  font-size:12.5px;color:#766f63;text-decoration:underline;cursor:pointer}
.olesie-zap-usun:hover{color:var(--z-ink)}

/* Etykieta z checkboxem jest inline-flexem, wiec kazdy kawalek tekstu
   stawal sie osobnym elementem i lamal sie wlasnym rytmem („Sz. P." ladowalo
   w oddzielnej kolumnie). Tekst siedzi teraz w jednym <span>, ktory ma plynac
   normalnie; checkbox nie moze sie kurczyc. */
.olesie-zap-inline{align-items:flex-start}
.olesie-zap-inline > input[type=checkbox],
.olesie-zap-inline > input[type=radio]{flex:0 0 auto;margin-top:2px}
.olesie-zap-inline > span{flex:1 1 auto;min-width:0}

/* ── Data i godzina wychodzily poza ekran na iPhonie ──────────────────
   Element siatki ma domyslnie `min-width:auto`, wiec nie zweza sie ponizej
   swojej zawartosci — a pola `date` i `time` maja na iOS wlasna szerokosc
   wewnetrzna. Kolumna rozpychala sie wiec poza obszar formularza. */
.olesie-zap-row > *,
.olesie-zap-dwa > *{min-width:0}
.olesie-zap-f input,
.olesie-zap-f textarea{box-sizing:border-box;max-width:100%}
.olesie-zap-f input[type=date],
.olesie-zap-f input[type=time]{min-width:0}

/* Podpowiedz „Na zaproszeniu: …" stoi teraz NAD polem, wiec odstep
   przenosimy pod nia. */
.olesie-zap-echo{margin:0 0 7px}

/* ── iOS: pola daty i godziny dalej rozjezdzaly sie po siatce ─────────
   Sam `min-width:0` nie wystarczyl. Safari na iPhonie rysuje wartosc
   w wewnetrznym elemencie `::-webkit-date-and-time-value`, ktory ma
   wlasne marginesy i wysrodkowanie — to ON dokladal szerokosc i wysokosc,
   przez co kafelki daty i godziny byly wieksze od reszty pol. */
.olesie-zap-f input[type=date],
.olesie-zap-f input[type=time]{
  -webkit-appearance:none;appearance:none;
  width:100%;min-width:0;max-width:100%;box-sizing:border-box;
  text-align:left}
.olesie-zap-f input[type=date]::-webkit-date-and-time-value,
.olesie-zap-f input[type=time]::-webkit-date-and-time-value{
  text-align:left;margin:0}
/* Ikonka kalendarza/zegara nie moze rozpychac pola */
.olesie-zap-f input[type=date]::-webkit-calendar-picker-indicator,
.olesie-zap-f input[type=time]::-webkit-calendar-picker-indicator{margin:0;padding:0}

/* Ta sama wysokosc dla WSZYSTKICH pol — po zresetowaniu wygladu data
   i godzina byly o 3 px nizsze niz pola tekstowe, co tez widac jako rozjazd. */
.olesie-zap-f input,
.olesie-zap-f textarea{line-height:1.4}
.olesie-zap-f input[type=date],
.olesie-zap-f input[type=time]{line-height:1.4}

/* Wysokosc liczona z tego samego wzoru co pola tekstowe: tekst + padding
   + ramka. Bez tego wewnetrzny element wartosci dokladal wlasne piksele
   i data z godzina rozjezdzaly sie o 2 px w druga strone. */
.olesie-zap-f input[type=date],
.olesie-zap-f input[type=time]{height:calc(1.4em + 22px + 3px)}

/* Caly kafelek podgladu otwiera powiekszenie — nie tylko lupka. */
.olesie-zap-preview__wrap{cursor:zoom-in}

/* ── Numery przy liście gości ─────────────────────────────────────────
   Rynna z numerami leży NA polu (nie obok), a pole dostaje wcięcie, żeby
   tekst się o nią nie opierał. Lustro jest niewidoczne — służy wyłącznie
   do zmierzenia, gdzie zaczyna się każda logiczna linia. */
.olesie-zap-numerowane{position:relative}

.olesie-zap-rynna{
  position:absolute;top:0;left:0;bottom:0;width:34px;
  overflow:hidden;pointer-events:none;z-index:1;
  border-radius:9px 0 0 9px;
}
.olesie-zap-rynna span{
  position:absolute;right:8px;
  font-size:12px;line-height:1.4;
  font-variant-numeric:tabular-nums;
  color:#a79d8c;
}
/* pole musi zrobic miejsce na numery */
.olesie-zap-numerowane textarea{padding-left:42px!important}

.olesie-zap-lustro{
  position:absolute;top:0;left:-9999px;
  visibility:hidden;pointer-events:none;
  height:auto;min-height:0;
}
/* Puste miejsce czeka na adresata — numer jest, ale cichszy. */
.olesie-zap-rynna span.pusty{opacity:.45}

/* Odbicie listy gości: licznik tego, ile wierszy odczytaliśmy.
   Numerowany spis tej samej treści był tu do 14.10.2026 — zdjęty, bo
   dublował pole, które klientka ma nad nim („wystarczy ta w ktorej da
   sie wpisywac"). Licznik zostaje: mówi to, czego z pola nie widać. */
.olesie-zap-lista {
  margin: 6px 0 2px;
  padding: 8px 10px;
  background: #f7f4ec;
  border: 1px solid #e3dac4;
  border-radius: 3px;
  font-size: 13px;
}
.olesie-zap-lista__ile { color: #6b6354; }
.olesie-zap-lista__ile strong { color: #2b2b2b; }

/* Przełącznik części podglądu — napisy były za małe, żeby je wygodnie czytać
   i trafiać w nie palcem (zgłoszenie Mateusza 13.10.2026). */
.olesie-zap-preview__czesci button {
  font-size: 15px;
  font-weight: 600;
  padding: 9px 16px;
  line-height: 1.25;
  min-height: 40px;          /* wygodny cel także na telefonie */
  letter-spacing: .01em;
}

/* Kafelki wyboru (rebusy) — zamiast listy rozwijanej. Widać wszystkie naraz. */
.olesie-zap-f--wybor { display: block; }
.olesie-zap-kafelki { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
/* ⛔ KAFELEK MUSI SIE KURCZYC DO TRESCI. Etykieta byla `display:block`, wiec
   rozpychala sie na cala szerokosc kolumny (zmierzone: 226 px przy cyfrze „1")
   i osiem kafelkow stawalo w OSMIU rzedach. Zmniejszenie wysokosci tego nie
   naprawialo — problem byl w szerokosci (Mateusz, 23.10.2026: „ustaw obok
   siebie w lini w ladnym kwadraciku z zaokraglonymi rogami"). */
.olesie-zap-kafelek { position: relative; flex: 0 0 auto; }
.olesie-zap-kafelek input {
  position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer;
}
.olesie-zap-kafelek label {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 36px; padding: 0 8px;
  border: 1px solid #cdbf9a; border-radius: 8px; background: #fff;
  font-size: 14px; font-weight: 600; text-align: center;
  color: #2b2b2b; cursor: pointer; white-space: nowrap;
}
/* ⭐ Kafelek „jak w projekcie" zostaje szerszy — to jedyny z opisem, reszta to
   cyfry (Mateusz, 23.10.2026: „robimy małe kafelki 1 2 3 4 w rzędzie, teraz
   zajmuje to bardzo dużo miejsca"). Osiem kafelków o rozmiarze przycisku
   zawijało się na trzy rzędy i sekcja rosła na całą wysokość ekranu. */
.olesie-zap-kafelek input:checked + label {
  background: #97a98f; border-color: #7d9074; color: #fffdf9;
}
.olesie-zap-kafelek input:focus-visible + label { outline: 2px solid #d4572a; outline-offset: 1px; }
.olesie-zap-kafelek input:disabled + label { opacity: .55; cursor: default; }

/* Uwaga przy pojedynczym polu — dziś tylko inicjał, który nie pasuje do
   imienia. Ma być widoczna, ale nie ma straszyć: to podpowiedź, nie błąd.
   ⚠️ Bez niej litera z poprzedniego zapisu (albo z podpowiedzi „np. M")
   szła na druk niezauważona (zgłoszenie Mateusza 15.10.2026). */
.olesie-zap-uwaga-pola {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  line-height: 1.45;
  color: #8a6d1f;
}
.olesie-zap-uwaga-pola__fix {
  appearance: none;
  border: 1px solid #d8c88f;
  background: #fdf8e8;
  color: #6b5411;
  border-radius: 3px;
  padding: 2px 8px;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
.olesie-zap-uwaga-pola__fix:hover { background: #f7eecf; }

/* Lista dłuższa niż opłacona ilość — widać to od razu, nie po „Wysyłam". */
.olesie-zap-lista--za-duzo { border-color: #d9534f; background: #fdecea; }
.olesie-zap-lista__ostrzezenie { margin-top: 4px; color: #8a1f1a; font-size: 13px; line-height: 1.45; }

/* Opis pod podglądem — mówi o tym, czego dana treść NIE robi. Dyskretnie:
   to informacja, nie ostrzeżenie. */
.olesie-zap-preview__opis {
  margin: 8px 0 0;
  font-size: 13px;
  line-height: 1.5;
  color: #6b6354;
}

/* Przełącznik zwrotu „Sz. P." nad listą nazwisk. */
.olesie-zap-szp {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 6px;
  font-size: 13px;
  color: #4a4336;
  cursor: pointer;
}
.olesie-zap-szp input[type="checkbox"] { width: 16px; height: 16px; margin: 0; flex: none; }

/* ══════════════════════════════════════════════════════════════════════
   Kafelek „Sprawdź podgląd" + okno podglądu (zaproszenia ślubne, telefon)
   ══════════════════════════════════════════════════════════════════════
   Wyglad przepisany z karty produktu (`.opa-karta-fab`) — ten sam kafelek
   ma wygladac wszedzie tak samo, zeby klientka nie uczyla sie go drugi raz.
   ⚠️ Osobna klasa, bo karta produktu i formularz wczytuja INNE arkusze. */
.olesie-zap-fab{position:fixed;top:10px;left:14px;z-index:10001;
  display:inline-flex;align-items:center;gap:9px;margin:0;
  padding:11px 16px 11px 13px;border:1px solid var(--z-line,#E8E0D3);border-radius:999px;
  background:#FFFDF9;color:var(--z-ink,#2f2d28);
  font-family:"Montserrat",Arial,sans-serif;font-size:13px;font-weight:600;line-height:1;
  cursor:pointer;box-shadow:0 14px 30px -12px rgba(47,45,40,.45)}
.olesie-zap-fab svg{width:17px;height:24px;fill:none;stroke:currentColor;
  stroke-width:1.8;stroke-linecap:round}
/* ⚠️ `display:inline-flex` wyzej BIJE przegladarkowe [hidden]{display:none} —
   bez tej linijki atrybut `hidden` nic nie robi i kafelek wisi na ekranie
   takze wtedy, gdy podglad widac. (Ta sama pulapka co przy polach wyzej.) */
.olesie-zap-fab[hidden]{display:none!important}
.olesie-zap-fab:hover{background:#fff}
.olesie-zap-fab:focus-visible{outline:2px solid var(--z-sage,#9FAA96);outline-offset:3px}
@media (max-width:480px){
  .olesie-zap-fab{top:8px;left:12px;padding:10px 14px 10px 11px;font-size:12px}
}
/* Na duzym ekranie podglad stoi w przyklejonej kolumnie obok pol, wiec
   kafelek nie ma czego otwierac. Granica ta sama, co uklad siatki (820 px). */
@media (min-width:821px){ .olesie-zap-fab{display:none!important} }

/* Okno z podgladem. W srodku stoi ZYWA kolumna podgladu — razem
   z zakladkami czesci (Zaproszenie / Potwierdzenie przybycia / Koperta)
   i opisem pod rysunkiem. */
.olesie-zap-pmodal{z-index:2147483647;background:rgba(47,45,40,.72);padding:10px}
.olesie-zap-pmodal .olesie-zap-preview{position:static;width:100%;max-width:560px;
  max-height:100%;overflow-y:auto;background:#fff;border-radius:12px;padding:12px}
/* Rysunek ma sie ZMIESCIC W PIONIE, a nie wyjechac pod zakladki: SVG ma
   z `formularz-slub.js` `width:100%`, wiec sam zabralby cala wysokosc.
   Przy ustalonej szerokosci i `max-height` SVG skaluje tresc do kadru
   (domyslne `preserveAspectRatio`), zamiast ja przycinac. */
.olesie-zap-pmodal .olesie-zap-preview__wrap svg{max-height:calc(100dvh - 210px)}
/* X przy krawedzi EKRANU, nie kafla — kafel sam sie przewija. */
.olesie-zap-pmodal .olesie-zap-zoom__x{position:fixed;top:10px;right:10px}