/* dddstart 0.2.202 · Płynne dopasowanie do każdego ekranu.
   Czcionki, odstępy między wierszami, polami i kartami rosną i maleją razem
   z szerokością ekranu (clamp), zamiast skakać na kilku progach. Dotyczy strony
   publicznej, panelu klienta i panelu SuperAdmina. Plik ładuje się jako ostatni.
   Napisy, które prawie mieszczą się w jednej linii, dopasowuje fit-text.js. */
:root{
  --fl-gutter:clamp(16px,calc(10.5px + 1.4vw),32px);
  --fl-gap:clamp(14px,calc(10px + 1vw),26px);
  --fl-gap-s:clamp(10px,calc(7.5px + .55vw),16px);
  --fl-card:clamp(16px,calc(12px + .85vw),26px);
  --fl-field-y:clamp(12px,calc(9.5px + .5vw),18px);
  --fl-field-x:clamp(12px,calc(8px + 1vw),22px);
  --fl-section:clamp(40px,calc(22px + 4.2vw),80px);
  --fl-body:clamp(15px,calc(14.4px + .14vw),16px);
}
/* Podstawa: 100% ustawień przeglądarki na telefonie, do 104% na dużym monitorze.
   Wszystkie wielkości w rem skalują się razem z nią. */
html{font-size:clamp(100%,calc(93.75% + .12vw),104%);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-size:var(--fl-body);line-height:1.55}
p,li,dd,blockquote,figcaption{text-wrap:pretty}
h1,h2,h3,h4{text-wrap:balance;overflow-wrap:break-word}
h2{font-size:clamp(1.22rem,calc(1.1rem + .4vw),1.5rem)}
h3{font-size:clamp(1.02rem,calc(.98rem + .18vw),1.15rem)}
/* Długie adresy e-mail, numery i nazwy plików nie rozpychają kart na wąskich ekranach. */
.panel,.card,.kpi,.admin-kpi,td,dd,.authcard{overflow-wrap:break-word}

/* Odstępy strony publicznej. */
.wrap{padding-inline:var(--fl-gutter)}
.section{padding-block:var(--fl-section)}
.pagehead{padding-block:clamp(18px,calc(10px + 1.8vw),28px) 6px}

/* Panel klienta i SuperAdmina. */
html[data-ddd-theme] .shell .content{padding:clamp(18px,calc(12px + 1.2vw),30px) var(--fl-gutter);gap:var(--fl-gap)}
html[data-ddd-theme] .shell .panel{padding:var(--fl-card)}
html[data-ddd-theme] .shell .topbar{padding-inline:var(--fl-gutter)}

/* Formularze: równe, płynne odstępy między wierszami i polami. */
.form,.formgrid{gap:var(--fl-field-y) var(--fl-field-x)}
.form label,.report-filters label{gap:clamp(4px,calc(2.5px + .35vw),7px)}
/* iOS powiększa stronę po dotknięciu pola z czcionką mniejszą niż 16 px. */
@media (pointer:coarse){
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),select,textarea{font-size:max(16px,1rem)}
}

/* Zakładki sekcji: na telefonie mieści się więcej, bez ucinania tekstu w pół słowa. */
.section-tabs{gap:4px clamp(14px,calc(6px + 2.2vw),28px)}
.section-tabs a{font-size:clamp(.86rem,calc(.82rem + .15vw),.92rem)}
nav.tabs button,nav.tabs a.tabl{font-size:clamp(.86rem,calc(.81rem + .2vw),.95rem);padding-inline:clamp(10px,calc(7px + .8vw),14px)}

/* Przyciski: wygodne pole dotyku i czytelny tekst w każdej szerokości. */
.btn{padding-inline:clamp(14px,calc(10px + 1vw),18px)}
.btn,button{text-wrap:balance}

/* Tabele w widoku kart (telefon) i na komputerze: oddech między wierszami. */
th,td{line-height:1.4}

@media (max-width:380px){
  /* Najmniejsze telefony (320–380 px): mniej pustego miejsca, więcej treści w linii. */
  .btn{gap:7px}
  .section-tabs a{gap:6px}
}

