/* Dodatki platformy do stylu panelu (app/ui/styl.css): nawigacja, logowanie,
   komunikaty, dziennik aktywnosci. Kolory wylacznie z tokenow styl.css. */

.nav{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap;
  padding:.7rem clamp(1rem,3vw,2.5rem);background:var(--surface);
  border-bottom:1px solid var(--rule-strong)}
.nav-marka{font-family:var(--mono);font-weight:600;letter-spacing:.04em;
  color:var(--ink);text-decoration:none}
.nav-marka span,.auth-marka span{color:var(--accent)}
.nav-linki{display:flex;gap:1rem;flex-wrap:wrap}
.nav-linki a{font-family:var(--mono);font-size:.72rem;letter-spacing:.05em;
  color:var(--ink-2);text-decoration:none}
.nav-linki a:hover{color:var(--accent)}
.nav-prawa{margin-left:auto;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.nav-org{display:flex;align-items:center;gap:.3rem}
.nav-org select{font-family:var(--mono);font-size:.72rem;padding:.25em .4em;
  border:1px solid var(--rule-strong);border-radius:2px;background:var(--surface);color:var(--ink)}
.nav-org-nazwa{font-family:var(--mono);font-size:.72rem;color:var(--ink-2)}
.nav-uzytkownik{position:relative}
.nav-uzytkownik summary{cursor:pointer;font-family:var(--mono);font-size:.72rem;
  color:var(--ink-2);list-style:none}
.nav-uzytkownik summary::after{content:" ▾"}
.nav-uzytkownik .menu{position:absolute;right:0;top:1.8rem;z-index:10;min-width:240px;
  display:flex;flex-direction:column;gap:.5rem;padding:.9rem;background:var(--surface);
  border:1px solid var(--rule-strong);box-shadow:0 6px 24px rgba(0,0,0,.08)}
.nav-uzytkownik .menu a,.nav-uzytkownik .menu button{font-family:var(--mono);
  font-size:.72rem;color:var(--ink);text-decoration:none;background:none;border:0;
  padding:0;text-align:left;cursor:pointer}
.nav-uzytkownik .menu a:hover,.nav-uzytkownik .menu button:hover{color:var(--accent)}
.cicho{font-size:.72rem;color:var(--ink-3)}

.komunikat{font-family:var(--mono);font-size:.75rem;padding:.6rem .8rem;
  border:1px solid var(--accent);background:var(--accent-quiet);color:var(--accent)}
.komunikat.error{border-color:var(--signal);background:var(--signal-quiet);color:var(--signal)}

.auth{max-width:400px;width:100%;margin:clamp(1rem,8vh,5rem) auto 0;
  display:flex;flex-direction:column;gap:1.2rem}
.auth-marka{font-family:var(--mono);font-size:1.3rem;font-weight:600;letter-spacing:.04em;
  text-align:center}
.auth-karta{background:var(--surface);border:1px solid var(--rule);padding:1.6rem;
  display:flex;flex-direction:column;gap:1rem}
.auth-karta h1{font-family:var(--mono);font-size:.8rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-2);font-weight:500}
.auth-karta form{display:flex;flex-direction:column;gap:.9rem}
.pole{display:flex;flex-direction:column;gap:.3rem}
.pole label{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3)}
.pole input{font:inherit;font-size:1rem;padding:.55rem .65rem;color:var(--ink);
  background:var(--paper);border:1px solid var(--rule-strong);border-radius:2px}
.pole input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.pomoc{font-size:.78rem;color:var(--ink-3)}
.pomoc ul{padding-left:1.1rem}
.blad,.blad-pola{font-size:.85rem;color:var(--signal)}
.blad{padding:.55rem .7rem;background:var(--signal-quiet);border:1px solid var(--signal)}
.wyjasnienie{font-size:.92rem;color:var(--ink-2)}
.btn.pelny{display:block;width:100%;text-align:center;padding:.7rem;font-size:.75rem;cursor:pointer}
.auth-link{font-family:var(--mono);font-size:.7rem;color:var(--ink-3);text-decoration:none}
.auth-link:hover{color:var(--accent)}
.auth-stopka{font-size:.8rem;color:var(--ink-3);text-align:center}

.aktywnosc{background:var(--surface);border:1px solid var(--rule);padding:.8rem 1rem}
.aktywnosc summary{cursor:pointer;font-family:var(--mono);font-size:.7rem;
  letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.zdarzenie{display:grid;grid-template-columns:9.5rem 14rem 1fr;gap:.8rem;
  padding:.4rem 0;border-bottom:1px solid var(--rule);font-size:.86rem}
.zdarzenie:last-child{border-bottom:0}
@media (max-width:640px){
  .zdarzenie{grid-template-columns:1fr}
  .nav-prawa{margin-left:0}
}

/* panel ustawien */
.ustawienia{display:grid;grid-template-columns:190px 1fr;gap:2rem;align-items:start}
.zakladki{display:flex;flex-direction:column;gap:.15rem;position:sticky;top:1rem}
.zakladki a{font-family:var(--mono);font-size:.74rem;letter-spacing:.03em;color:var(--ink-2);
  text-decoration:none;padding:.45rem .7rem;border-left:2px solid transparent}
.zakladki a:hover{color:var(--accent)}
.zakladki a.akt{color:var(--accent);border-left-color:var(--accent);background:var(--accent-quiet)}
.zakladki-sep{font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);padding:1rem .7rem .3rem}
.ustawienia-tresc{display:flex;flex-direction:column;gap:1.2rem;min-width:0}
.panel-naglowek{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}
.panel-naglowek h1{font-family:var(--mono);font-size:.9rem;letter-spacing:.08em;
  text-transform:uppercase;font-weight:500}
.formularz{display:flex;flex-direction:column;gap:1rem;max-width:560px;background:var(--surface);
  border:1px solid var(--rule);padding:1.4rem}
.formularz.wgrywanie{max-width:none;display:grid;grid-template-columns:2fr 1fr 1fr;align-items:start}
.formularz.wgrywanie .pole-check,.formularz.wgrywanie .akcje{grid-column:1/-1}
.pole select,.pole textarea,.filtry-dziennika select,.filtry-dziennika input{font:inherit;font-size:.95rem;
  padding:.5rem .6rem;color:var(--ink);background:var(--paper);border:1px solid var(--rule-strong);border-radius:2px}
.pole input[type=file]{font-size:.85rem;padding:.4rem}
.pole ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:.3rem}
.pole ul label,.pole-check label{font-family:var(--serif);font-size:.92rem;letter-spacing:0;
  text-transform:none;color:var(--ink);display:flex;gap:.5rem;align-items:center}
.pole-check{flex-direction:row-reverse;justify-content:flex-end;align-items:flex-start;gap:.6rem;flex-wrap:wrap}
.pole-check input{margin-top:.25rem}
.pole-check .pomoc,.pole-check .blad-pola{flex-basis:100%}
.akcje{display:flex;gap:.6rem}
.akcje-wiersza{white-space:nowrap}
.akcje-wiersza form{display:inline}
.btn.maly{cursor:pointer}
.btn.niebezp{color:var(--signal);border-color:var(--signal)}
.btn.niebezp:hover{background:var(--signal-quiet)}
.komunikat.warning{border-color:var(--amber);background:var(--amber-quiet);color:var(--amber);
  word-break:break-all}
.komunikat.info{border-color:var(--rule-strong);background:var(--surface-2);color:var(--ink-2)}
.dzial{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-2);font-weight:500;margin-top:.6rem}
.filtry-dziennika{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.filtry-dziennika select,.filtry-dziennika input{font-size:.8rem;padding:.35rem .45rem}
.szczegoly{font-size:.82rem}
.stronicowanie{display:flex;gap:1rem;align-items:center;justify-content:center}
.tryb-danych{background:var(--surface);border:1px solid var(--rule);padding:1rem 1.2rem;font-size:.92rem}
pre.log{font-family:var(--mono);font-size:.72rem;background:var(--surface);border:1px solid var(--rule);
  padding:1rem;max-height:60vh;overflow:auto;white-space:pre-wrap}
.przewijak{overflow-x:auto}
@media (max-width:820px){
  .ustawienia{grid-template-columns:1fr}
  .zakladki{flex-direction:row;flex-wrap:wrap;position:static}
  .zakladki a{border-left:0;border-bottom:2px solid transparent}
  .zakladki a.akt{border-bottom-color:var(--accent)}
  .formularz.wgrywanie{grid-template-columns:1fr}
}
/* <button class="btn"> dostaje ten sam wyglad co <a class="btn"> */
button.btn{cursor:pointer;background:var(--surface);line-height:1.4}
button.btn.glowny{background:var(--accent)}
.btn.maly{padding:.2rem .5rem;font-size:.64rem}