/* klimatlux.pl — czat w stylu KlimatLux: Manrope, granat i błękit marki, pigułki, miękkie cienie, motyw „strumieni” powietrza. */
.klxc--k {
	--klxc-font: "Manrope", "Segoe UI", system-ui, sans-serif;
	--klxc-ink: #0B1F33;
	--klxc-muted: #4D6378;
	--klxc-line: #DCE4EE;
	--klxc-soft: #F3F6FA;
	--klxc-acc: #0052A3;
	--klxc-acc-hover: #00418A;
	--klxc-head: #0052A3;
	--klxc-bot: #F3F6FA;
	--klxc-user: #0052A3;
	--klxc-r: 18px;
	--klxc-r-sm: 14px;
	--klxc-r-btn: 999px;
	--klxc-shadow: 0 24px 48px rgba(7, 24, 42, .16), 0 2px 6px rgba(7, 24, 42, .08);
	--klxc-ok: #177A3E;
	--klxc-bad: #B42318;
	--klxc-focus: #0068CE;
	--klxc-y: 18px;      /* środek na wysokości „do góry” (dół 20 px) */
	--klxc-px: 16px;
	--klxc-z: 58;        /* nad „do góry” (50) i paskiem zakupu (55), pod nagłówkiem menu (100) i koszykiem (120) */
	--klxc-z-panel: 98;
}
@media (min-width: 900px) { .klxc--k { --klxc-px: 24px; } }
.klxc--k .klxc-launch { padding-left: 16px; letter-spacing: .005em; }
.klxc--k .klxc-launch__ic { color: #fff; }
.klxc--k .klxc-head {
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='64' fill='none' stroke='%23fff' stroke-opacity='.13' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M-10 18c40-14 70 14 110 0s70 14 130 0'/%3E%3Cpath d='M-10 34c40-14 70 14 110 0s70 14 130 0'/%3E%3Cpath d='M-10 50c40-14 70 14 110 0s70 14 130 0'/%3E%3C/svg%3E") right center / 220px 64px no-repeat,
		linear-gradient(120deg, #0052A3 0%, #07386F 100%);
}
.klxc--k .klxc-head__mark { width: 36px; height: 36px; padding: 5px; border-radius: 10px; background: #fff; box-shadow: 0 1px 2px rgba(7, 24, 42, .18); }
.klxc--k .klxc-log { background: linear-gradient(#fff, #FBFCFE); }
.klxc--k .klxc-card { box-shadow: 0 1px 2px rgba(7, 24, 42, .06); border-color: #D9E1E9; }
.klxc--k .klxc-card__img { background: #F3F6FA; }
.klxc--k .klxc-chip { border-color: #BFD3EA; color: #0052A3; background: #fff; }
.klxc--k .klxc-row--a .klxc-bub { background: #F1F5FA; }
.klxc--k .klxc-chip:hover { background: #E6F0FB; color: #00418A; border-color: #0052A3; }
.klxc--k .klxc-comp textarea:focus { box-shadow: 0 0 0 3px #E6F0FB; }

.klxc--k .klxc-sheet { box-shadow: 0 -12px 28px rgba(7, 24, 42, .08); }
.klxc--k .klxc-fld input:focus { box-shadow: 0 0 0 3px #E6F0FB; }

/* Przycisk czatu stoi w prawym dolnym rogu (właściciel 24.10); przycisk motywu .klx-totop (prawa 16 px, dół 20 px, 48 px) idzie nad niego, wyrównany do prawej krawędzi. */
body:has(.klxc--k:not([hidden]):not(.is-away)) .klx-totop { margin-bottom: 62px; }
@media (min-width: 900px) { body:has(.klxc--k:not([hidden]):not(.is-away)) .klx-totop { margin-right: 8px; } }

/* Znak z logo (piktogram klimatyzatora) i podpowiedź przy przycisku. */
.klxc--k .klxc-nudge { border-color: #BFD3EA; color: #07182A; box-shadow: 0 14px 34px rgba(7, 24, 42, .16); }
.klxc--k .klxc-nudge::after { border-color: #BFD3EA; }
body:has(.klxc--k.has-nudge) .klx-totop { visibility: hidden; opacity: 0; }

.klxc--k { --klxc-pulse: rgba(0, 82, 163, .42); }
.klxc--k .klxc-peek { border-color: #BFD3EA; }
.klxc--k .klxc-peek::after { border-color: #BFD3EA; }
.klxc--k .klxc-peek__mark { background: #fff; box-shadow: inset 0 0 0 1px #D9E1E9; }
