/* Tylko panel demo (wdroz.mjs dokleja do klient.html, 26.10.2026): podpowiedź przy przełączniku motywu.
   Demo startuje w jasnym motywie, strzałka pokazuje, gdzie zmienić na ciemny – klient wybiera, jak woli. */
.demo-motyw { position: fixed; z-index: 29; display: flex; align-items: center; gap: 10px; max-width: min(320px, calc(100vw - 20px));
  background: #fff; color: #0E1A2E; border: 2px solid var(--zloto, #B98F48); border-radius: 16px; padding: 10px 12px 10px 14px;
  box-shadow: 0 10px 28px rgba(2, 55, 122, .22); font: 500 14px/1.35 var(--sans, Inter, system-ui, sans-serif);
  opacity: 0; transform: translateY(-6px); transition: opacity .28s ease-out, transform .28s ease-out }
.demo-motyw.widac { opacity: 1; transform: none }
.demo-motyw b { display: block; font-weight: 700; font-size: 15px }
.demo-motyw-txt { min-width: 0 }
.demo-motyw-strz { position: absolute; top: -40px; width: 24px; height: 34px; color: var(--zloto, #B98F48); animation: demo-strz 1s ease-in-out infinite }
.demo-motyw-strz path { fill: none; stroke: currentColor; stroke-width: 3.4; stroke-linecap: round; stroke-linejoin: round }
.demo-motyw-x { flex: none; border: 0; background: #EEF2F8; color: #02377A; width: 28px; height: 28px; border-radius: 50%; font: 700 16px/1 var(--sans, system-ui); cursor: pointer }
.demo-motyw-x:focus-visible { outline: 2px solid var(--zloto, #B98F48); outline-offset: 2px }
#motyw-k.demo-puls { animation: demo-puls 1.6s ease-in-out infinite }
@keyframes demo-strz { 0%, 100% { transform: translateY(0) } 50% { transform: translateY(-7px) } }
@keyframes demo-puls { 0%, 100% { box-shadow: 0 0 0 0 rgba(217, 181, 122, .7) } 50% { box-shadow: 0 0 0 8px rgba(217, 181, 122, 0) } }
[data-motyw="ciemny"] .demo-motyw { background: #13223D; color: #EEF2F8 }
[data-motyw="ciemny"] .demo-motyw-x { background: #22355A; color: #fff }
@media (prefers-reduced-motion: reduce) { .demo-motyw { transition: none } .demo-motyw-strz, #motyw-k.demo-puls { animation: none } }

/* 26.10.2026: hasło demo nie jest już publiczne (strona www.dkte.be daje je po kodzie z maila) – ukryj podpowiedź „demo/demo” i „Wpisz za mnie” z klient.html */
#demo-podp { display: none !important; }
