/* MapaCen — wspólna warstwa komponentów. Układ desktop/mobile pozostaje w istniejących modułach. */
body{font-family:var(--font-tekst)}
.logo{display:flex;flex-direction:column;align-items:flex-start;gap:1px;flex-shrink:0;line-height:1.2}
.marka-logo{display:block;line-height:0;max-width:100%}
.marka-logo img{display:block;width:150px;max-width:100%;height:auto}
.marka-logo .marka-noc{display:none}
:root[data-styl=nocny] .marka-logo .marka-dzien{display:none}
:root[data-styl=nocny] .marka-logo .marka-noc{display:block}
.logo small{font-family:var(--font-tekst);font-size:11px;color:var(--szary);margin:3px 0 0;letter-spacing:.02em}
.przycisk{transition:background-color .15s,border-color .15s,color .15s}
.przycisk.glowny{color:var(--na-akcencie)}
.przycisk:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
input[type=checkbox],input[type=radio],input[type=range]{accent-color:var(--akcent)}
.przycisk:hover:not(:disabled){border-color:var(--akcent)}
.przycisk.cichy:hover:not(:disabled){background:var(--akcent-tlo)}
.boczny button[aria-current=page]{box-shadow:inset 3px 0 var(--akcent)}
.boczny .sekcja{font-weight:650;letter-spacing:.08em}
.blad,[role=alert].blad{color:var(--zly)}
.plak.ok,.zapis-karty.zapisana{color:var(--ok);background:var(--ok-tlo)}
.zapis-karty:not(.zapisana){color:var(--szary)}
#komunikat{background:var(--pow);color:var(--tusz);border:1px solid var(--linia);box-shadow:var(--cien)}
#komunikat.blad{border-color:var(--zly);background:var(--zly-tlo)}
.start-symbol{background:var(--miedz-tlo);color:var(--miedz)}
.start-nadtytul{color:var(--miedz-tekst)}
.start-hero h1{color:var(--tusz);font-weight:750;letter-spacing:-.035em}
.start-szukanie{box-shadow:0 8px 28px color-mix(in srgb,var(--miedz) 10%,transparent)}
.start-szukanie .nav-wejscie{border-color:var(--linia)}
.start-szukanie:focus-within{box-shadow:0 0 0 3px var(--akcent-tlo),0 8px 28px color-mix(in srgb,var(--miedz) 12%,transparent)}
#logowanie{background:var(--tlo)}
#logowanie .ramka{background:var(--pow);border:1px solid var(--linia2);box-shadow:var(--cien)}
#logowanie .logo{margin-bottom:20px}
#logowanie .marka-logo img{width:230px}
#logowanie h1{font-size:25px;line-height:1.2;font-weight:750;letter-spacing:-.025em;margin:0 0 12px}
#logowanie .pole input{min-height:44px;background:var(--pow);border-color:var(--linia)}
#logowanie .przycisk{min-height:44px}
#l-publiczny{margin-top:20px!important;align-self:stretch;color:var(--akcent);border-color:var(--linia)}
#obciazenie-panel fieldset{padding:14px;background:var(--pow);border:1px solid var(--linia);border-radius:var(--r)}
#obciazenie-panel legend{font-weight:650;padding:0 5px}
#obciazenie-panel .o-metryki>div{border:1px solid var(--linia2);border-radius:var(--r);background:var(--pow);padding:12px}
#obciazenie-panel select,#obciazenie-panel input{min-height:40px;border:1px solid var(--linia);border-radius:8px;background:var(--pow);padding:6px 10px;color:var(--tusz)}
.akt-mapa{background:var(--scena)}
.akt-licznik-mapy span{background:var(--pow);color:var(--tusz)}
:root[data-styl=nocny] .leaflet-control-attribution,:root[data-styl=nocny] .leaflet-control-scale-line{background:var(--pow);color:var(--tusz2)}
:root[data-styl=nocny] .leaflet-control-attribution a{color:var(--nieb)}
@media(max-width:760px){
 .telefon #logowanie .ramka{border:0;border-radius:0;box-shadow:none;background:var(--tlo);padding-top:calc(36px + env(safe-area-inset-top))}
 .telefon #logowanie .logo{margin-bottom:28px}
 .telefon #logowanie h1{font-size:28px;margin-top:0;max-width:14ch}
 .telefon #logowanie .pole input{font-size:16px;background:var(--pow)}
 .telefon #l-publiczny{margin-top:auto!important;padding-top:12px;padding-bottom:12px}
 .telefon #l-formularz{padding-bottom:24px}
 .telefon #logowanie [data-styl-otworz]{margin-top:10px}
 .telefon #obciazenie-panel input,.telefon #obciazenie-panel select{min-height:44px}
}
@media(max-height:540px) and (max-width:980px){
 .telefon #logowanie .ramka{padding-top:calc(14px + env(safe-area-inset-top))}
 .telefon #logowanie .logo{margin-bottom:12px}
 .telefon #logowanie .marka-logo img{width:150px}
 .telefon #logowanie h1{font-size:22px;max-width:none}
 .telefon #l-publiczny{margin-top:16px!important}
}
@media(prefers-reduced-motion:reduce){.przycisk{transition:none}}

input,select,textarea{color:var(--tusz)}
input::placeholder,textarea::placeholder{color:var(--szary);opacity:1}

/* Hierarchia działań: główne, dokumenty, pomocnicze i usuwanie. */
.przycisk{background:var(--pow2);color:var(--tusz);border-color:var(--linia)}
.przycisk:hover:not(:disabled):not([aria-disabled=true]){background:var(--pow);border-color:var(--szary)}
.przycisk.glowny{background:var(--akcent);border-color:var(--akcent);color:var(--na-akcencie);box-shadow:0 2px 3px #0001}
.przycisk.glowny:hover:not(:disabled):not([aria-disabled=true]){background:var(--akcent2);border-color:var(--akcent2)}
.przycisk.dokument{background:var(--miedz-tlo);border-color:var(--miedz);color:var(--miedz-tekst);font-weight:600}
.przycisk.dokument:hover:not(:disabled):not([aria-disabled=true]){background:var(--pow);border-color:var(--miedz);color:var(--miedz-tekst)}
.przycisk.cichy{background:transparent;border-color:transparent;box-shadow:none}
.przycisk.cichy:hover:not(:disabled):not([aria-disabled=true]){background:var(--pow2);border-color:var(--linia)}
.przycisk.niebezpieczny{background:var(--zly-tlo);border-color:var(--zly);color:var(--zly)}
.przycisk.niebezpieczny:hover:not(:disabled):not([aria-disabled=true]){background:var(--pow);border-color:var(--zly);color:var(--zly)}
.przycisk.glowny.niebezpieczny{background:var(--zly);color:var(--na-akcencie)}
.przycisk[aria-pressed=true]:not(.zapis-karty):not(.przenies-kolekcje){background:var(--akcent-tlo);border-color:var(--akcent);color:var(--akcent);box-shadow:inset 0 -3px var(--akcent);font-weight:600}
.przycisk:disabled,.przycisk.glowny:disabled,.przycisk.dokument:disabled{opacity:1;background:var(--linia2);border-color:var(--linia);color:var(--szary);box-shadow:none;cursor:not-allowed}
.przycisk:active:not(:disabled):not([aria-disabled=true]){box-shadow:inset 0 2px 3px #0002}
/* Stan kolekcji zachowuje uzgodnione, niezależne oznaczenia. */
.przycisk.zapis-karty.zapisana{background:var(--ok-tlo);color:var(--ok)}
.przycisk.zapis-karty:not(.zapisana){color:var(--szary)}

/* Wybór powiatu jest samodzielnym ekranem, bez menu aplikacji i konta. */
#app.wybor-obszaru{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
#app.wybor-obszaru>.gora,#app.wybor-obszaru>#nawigacja{display:none!important}
#app.wybor-obszaru>#widoki{grid-column:1/-1;grid-row:1}

/* Na PC zmiana powiatu jest oknem nad bieżącą stroną. */
.okno .ramka:has(.wybor-powiatow){width:min(1000px,100%);max-height:calc(100dvh - 32px)}
.okno .ramka:has(.wybor-powiatow) .okno-zamknij{width:44px;height:44px;flex:none}
/* Także po zwężeniu już otwartego okna telefon wykorzystuje całą powierzchnię. */
.telefon .okno:has(.wybor-powiatow){padding:0}
.telefon .okno .ramka:has(.wybor-powiatow){width:100%;height:100dvh;max-height:100dvh;border:0;border-radius:0;touch-action:pan-y pinch-zoom;padding-bottom:calc(22px + env(safe-area-inset-bottom))}
