/* ===== czat.css · v92 (21.09.2026) · /ecomelevator-czat: cała strona jako rozmowa z Mateuszem (widget Skanu w trybie data-mode="czat"). Ładowany tylko przez ecomelevator-czat.html, po style.css. ===== */
.czat{position:relative;isolation:isolate;padding:74px 0 16px;min-height:100svh;display:flex;background:
  radial-gradient(58% 46% at 22% 8%,rgba(15,35,133,.12),transparent 62%),
  radial-gradient(52% 44% at 82% 4%,rgba(39,66,201,.08),transparent 60%),#fff}
.czat::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(rgba(29,29,31,.05) 1px,transparent 1px);background-size:26px 26px;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 70%);mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 70%)}
.czat__wrap{max-width:900px;width:100%;display:flex;flex-direction:column;gap:10px;flex:1;min-height:0}
.czat [data-skan]{position:relative;height:calc(100svh - 112px);min-height:520px;display:flex}
.czat [data-skan]::before{content:"";position:absolute;left:-6%;right:-6%;top:-6%;height:70%;border-radius:48px;z-index:-1;pointer-events:none;background:radial-gradient(55% 60% at 50% 42%,rgba(74,99,232,.45),transparent 70%),radial-gradient(38% 46% at 88% 18%,rgba(143,160,255,.35),transparent 70%);filter:blur(36px)}
.czat .sk{width:100%;height:100%;max-width:none;margin:0}
.czat .sk .sk-log,.czat .sk.sk--grown .sk-log{max-height:none;min-height:0;flex:1}
.czat .sk.sk--term .sk-msg{font-size:15.5px;line-height:1.6}
.czat .sk.sk--term .sk-opts{min-width:min(100%,360px)}
.czat__alt{margin:0;text-align:center;font-size:13px;line-height:1.5;color:var(--muted)}
.czat__alt a{white-space:nowrap}
@media(min-width:1000px){
  .czat{padding:96px 0 24px}
  .czat [data-skan]{height:min(calc(100svh - 150px),780px);min-height:600px}
  .czat .sk.sk--term .sk-msg{font-size:16px}
  .czat .sk.sk--term .sk-log{padding:22px 24px 16px}
}
@media(max-width:520px){
  .czat{padding-top:68px}
  .czat [data-skan]{height:calc(100svh - 100px);min-height:480px}
  .czat .sk.sk--term .sk-log{padding:14px 14px 10px}
  .czat .sk.sk--term .sk-msg{font-size:15px}
}
/* --- karty w rozmowie (dowód, cena): białe na granacie, bez znaku „›” --- */
.sk.sk--term .sk-msg.sk-card{padding:0 0 0 22px}
.sk.sk--term .sk-msg.sk-card::before{display:none}
.ck{background:#fff;color:#1D1D1F;border-radius:14px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.12),0 12px 32px rgba(0,0,0,.28);font-family:var(--sans);max-width:560px}
.ck--proof{display:grid;grid-template-columns:132px 1fr}
.ck--proof>img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block}
.ck__b{padding:14px 16px 12px}
.ck__k{margin:0 0 8px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#2742C9}
.ck__kpi{margin:0;display:grid;grid-template-columns:repeat(3,auto);gap:0 16px;justify-content:start}
.ck__kpi dt{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.03em;line-height:1.05;color:#15207A;font-variant-numeric:tabular-nums;white-space:nowrap}
.ck__kpi div:first-child dt{color:#1D1D1F}
.ck__kpi dd{margin:3px 0 0;font-size:11.5px;line-height:1.35;color:#6E6E73;max-width:11ch}
.ck__s{margin:10px 0 0;font-size:12px;line-height:1.45;color:#6E6E73}
.ck__logos{list-style:none;margin:10px 0 0;padding:10px 0 0;border-top:1px solid rgba(0,0,0,.08);display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.ck__logos img{height:20px;width:auto;display:block;opacity:.85}
.ck--price{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(15,26,92,.10)}
.ck--price>div{background:#fff;padding:14px 14px 12px}
.ck--price b{display:block;font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:-.03em;line-height:1;color:#15207A;font-variant-numeric:tabular-nums;margin-bottom:6px}
.ck--price span{display:block;font-size:12px;line-height:1.4;color:#6E6E73}
.ck--price>div.is-hot{background:linear-gradient(160deg,#131C6E 0%,#0B1142 55%,#1B2A96 100%)}
.ck--price>div.is-hot b{color:#fff}.ck--price>div.is-hot span{color:rgba(255,255,255,.8)}
.ck__link{grid-column:1/-1;background:#F5F5F7;display:block;padding:10px 14px;font-size:13px;font-weight:600;color:#15207A;text-decoration:none}
.ck__link:hover{background:#EEF0FF}
@media(max-width:520px){
  .ck--proof{grid-template-columns:1fr}
  .ck--proof>img{aspect-ratio:16/9;height:auto}
  .ck__kpi{grid-template-columns:1fr 1fr;gap:10px 14px}
  .ck__kpi dd{max-width:none}
  .ck--price{grid-template-columns:1fr}
  .ck--price>div{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center;padding:12px 14px}
  .ck--price b{margin:0;font-size:20px}
}
/* --- v92b: telefon = wszystko (2 wiadomości + 5 opcji) w pierwszym ekranie: ciaśniejsze wiersze, krótsza stopka, bez podpowiedzi klawiszy --- */
.czat .sk.sk--term .sk-head b{white-space:nowrap}
@media(min-width:1000px){.czat [data-skan]{height:min(calc(100svh - 150px),700px)}}
@media(max-width:900px){.czat .sk.sk--term .sk-opts-hint{display:none}}
@media(max-width:520px){
  .czat .sk.sk--term .sk-head{padding:9px 14px}
  .czat .sk.sk--term .sk-head b{font-size:13px}
  .czat .sk.sk--term .sk-st{display:none}
  .czat .sk.sk--term .sk-log{gap:9px;padding:12px 12px 8px}
  .czat .sk.sk--term .sk-msg{font-size:14.5px;line-height:1.5;padding-left:18px}
  .czat .sk.sk--term .sk-opts{margin-left:0;width:100%}
  .czat .sk.sk--term .sk-opts :is(button,a){padding:9px 12px 9px 32px;font-size:13px;line-height:1.35}
  .czat .sk.sk--term .sk-opts :is(button,a)::after{top:8px}
  .czat .sk.sk--term .sk-bar{padding:10px 12px}
  .czat .sk.sk--term .sk-foot{font-family:var(--sans);font-size:11px;line-height:1.4;padding:6px 12px 9px}
  .czat .sk.sk--term .sk-foot .czat__foot-x{display:none}
  .czat__alt{font-size:12.5px}
}
@media(max-width:520px){
  .czat{padding-top:62px}
  .czat [data-skan]{height:calc(100svh - 74px);min-height:460px}
  .czat .sk.sk--term .sk-opts :is(button,a){padding:8px 12px 8px 32px}
  .czat .sk.sk--term .sk-opts :is(button,a)::after{top:7px}
}
/* --- v92b: CAŁA strona = terminal (bez menu, stopki, linii pod spodem). Paski na całą szerokość, treść w kolumnie do 920 px. --- */
html.czat-page,html.czat-page body{background:#0B1142;height:100%;overflow:hidden;overscroll-behavior:none}
.czat--full{padding:0;min-height:0;height:100svh;background:none}
.czat--full::before{display:none}
.czat--full .czat__wrap{max-width:none;width:100%;padding:0;gap:0}
.czat--full [data-skan]{height:100svh;min-height:0}
.czat--full [data-skan]::before{display:none}
.czat--full .sk.sk--term{border-radius:0;border:0;box-shadow:none;height:100%;padding-top:env(safe-area-inset-top)}
.czat--full .sk.sk--term::before{display:none}
.czat--full .sk.sk--term :is(.sk-head,.sk-log,.sk-bar,.sk-foot){padding-left:max(16px,calc((100% - 920px)/2 + 16px));padding-right:max(16px,calc((100% - 920px)/2 + 16px))}
.czat--full .sk.sk--term .sk-head{padding-top:12px;padding-bottom:11px}
.czat--full .sk.sk--term .sk-log{padding-top:20px;padding-bottom:14px}
.czat--full .sk.sk--term .sk-foot{padding-bottom:calc(10px + env(safe-area-inset-bottom))}
.czat--full .sk.sk--term .sk-foot a{white-space:nowrap}
@media(min-width:1000px){
  .czat--full [data-skan]{height:100svh}
  .czat--full .sk.sk--term .sk-log{padding-top:28px}
  .czat--full .sk.sk--term .sk-msg{max-width:72ch}
  .czat--full .sk.sk--term .sk-foot{font-size:12px}
}
@media(max-width:520px){
  .czat--full{padding-top:0}
  .czat--full [data-skan]{height:100svh;min-height:0}
  .czat--full .sk.sk--term .sk-head{padding-top:calc(10px + env(safe-area-inset-top))}
  .czat--full .sk.sk--term .sk-opts :is(button,a){padding:7px 12px 7px 32px}
  .czat--full .sk.sk--term .sk-opts :is(button,a)::after{top:6px}
}
/* --- v94: nagłówek z logo i nazwą programu, podpowiedź pod opcjami --- */
.czat .sk.sk--term .sk-head b{display:inline-flex;align-items:center;gap:9px}
.czat__logo{flex:none;display:block}
.czat__h-short{display:none}
.czat .sk.sk--term .sk-opts-hint{white-space:normal;line-height:1.45;font-size:12px;color:rgba(214,220,255,.8);padding:9px 14px 10px}
.czat .sk.sk--term .sk-opts-hint .sk-opts-keys{color:rgba(214,220,255,.55)}
@media(max-width:900px){.czat .sk.sk--term .sk-opts-hint{display:block}.czat .sk.sk--term .sk-opts-hint .sk-opts-keys{display:none}}
@media(max-width:520px){
  .czat__h-long{display:none}.czat__h-short{display:inline}
  .czat .sk.sk--term .sk-opts-hint{font-size:11.5px;padding:8px 12px 9px}
}
/* v94b: spany w nagłówku dziedziczą po <b> (widget daje .sk-head span display:block, 12.5px, szary) */
.czat .sk.sk--term .sk-head b span{display:inline;font-size:inherit;color:inherit;margin:0}
.czat .sk.sk--term .sk-head b .czat__h-short{display:none}
@media(max-width:520px){
  .czat .sk.sk--term .sk-head b .czat__h-long{display:none}
  .czat .sk.sk--term .sk-head b .czat__h-short{display:inline}
  .czat .sk.sk--term .sk-head b{font-size:13.5px}
}
/* v94c: iPhone 13 = 2 wiadomości + 6 opcji + podpowiedź w jednym ekranie */
@media(max-width:520px){
  .czat--full .sk.sk--term .sk-head{padding-top:calc(8px + env(safe-area-inset-top));padding-bottom:8px}
  .czat--full .sk.sk--term .sk-log{padding-top:10px;gap:8px}
  .czat--full .sk.sk--term .sk-msg{line-height:1.45}
  .czat--full .sk.sk--term .sk-opts :is(button,a){padding:6px 12px 6px 30px}
  .czat--full .sk.sk--term .sk-opts :is(button,a)::after{top:5px}
  .czat--full .sk.sk--term .sk-opts-hint{padding:6px 12px 7px}
}
/* --- v95 (21.09.2026): bez trzech kropek „Apple” (nagłówek ma logo), stopka w dwóch wierszach: kto przygotował + dane spółki i linki --- */
.czat .sk.sk--term .sk-dots{display:none}
.czat .sk.sk--term .sk-foot{font-family:var(--sans);font-size:12px;line-height:1.5;padding-top:9px;color:rgba(214,220,255,.62)}
.czat .sk.sk--term .sk-foot .czat__foot-l1{display:block;margin-bottom:4px;color:rgba(214,220,255,.78)}
.czat .sk.sk--term .sk-foot a{color:rgba(214,220,255,.78);text-decoration:underline;text-underline-offset:2px}
.czat .sk.sk--term .sk-foot a:hover{color:#fff}
@media(max-width:520px){
  .czat .sk.sk--term .sk-foot{font-size:10.5px;line-height:1.4;padding-top:6px}
  .czat .sk.sk--term .sk-foot .czat__foot-l1{margin-bottom:2px}
}

/* v99: zachęta do wpisania adresu sklepu pod opcjami; na telefonie ukryta (budżet miejsca w pierwszym ekranie) */
@media(max-width:520px){.czat .czat__m-x{display:none}}
/* v100: iPhone 13 = całe otwarcie w jednym ekranie także ze stopką v96 (dwa wiersze) */
@media(max-width:520px){
  .czat--full .sk.sk--term .sk-foot{font-size:10.5px;line-height:1.35;padding-top:5px;padding-bottom:calc(7px + env(safe-area-inset-bottom))}
  .czat--full .sk.sk--term .sk-log{gap:7px}
  .czat--full .sk.sk--term .sk-opts-hint{padding:5px 12px 6px;font-size:11px}
}