/*
Theme Name: Konsola
Theme URI: https://www.otoserwer.com/
Author: otoSerwer.com
Description: Klasyczny, edytowalny motyw dokumentacyjny dla otoserwer.com.
Version: 1.0.0
Text Domain: konsola
Requires at least: 5.4
Requires PHP: 7.4
*/

@font-face{font-family:"Sora";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/sora-600.woff2") format("woff2")}
@font-face{font-family:"Lato";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/lato-400.woff2") format("woff2")}
@font-face{font-family:"Lato";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/lato-700.woff2") format("woff2")}
@font-face{font-family:"Lato";font-style:italic;font-weight:400;font-display:swap;src:url("assets/fonts/lato-400-italic.woff2") format("woff2")}

:root{
	--noc:#252525;
	--noc-glab:#1a1a1a;
	--konsola:#1f2430;
	--na-nocy:#ffffff;
	--na-nocy-2:#d2d2d2;
	--ceglana:#a3261c;
	--ceglana-jasna:#c0392b;
	--ceglana-glab:#8a2017;
	--biel:#ffffff;
	--papier:#f1f1ef;
	--papier-2:#e7e7e4;
	--papier-3:#dcdcd8;
	--atrament:#1d1d1d;
	--atrament-2:#2f2f2f;
	--mgla:#5c5c5c;
	--mgla-ui:#8b8b8b;
	--obwodka-pola:rgba(29,29,29,.45);
	--linia:rgba(29,29,29,.12);
	--linia-mocna:rgba(29,29,29,.28);
	--linia-jasna:rgba(255,255,255,.18);
	--szklo:rgba(255,255,255,.08);
	--obwodka-jasna:rgba(255,255,255,.42);
	--cien-1:0 1px 2px rgba(29,29,29,.05),0 2px 8px rgba(29,29,29,.05);
	--cien-2:0 2px 6px rgba(29,29,29,.07),0 14px 34px rgba(29,29,29,.10);
	--naglowkowy:"Sora",system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
	--groteska:"Lato",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
	--maszyna:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
	--t-meta:.8125rem;
	--t-maly:.9375rem;
	--t-baza:1.0625rem;
	--t-lead:clamp(1.0625rem,1rem + .35vw,1.25rem);
	--t-h3:clamp(1.05rem,1rem + .35vw,1.25rem);
	--t-h2:clamp(1.25rem,1.1rem + .8vw,1.75rem);
	--t-tytul:clamp(1.4rem,1.1rem + 1.5vw,2.2rem);
	--t-marka:clamp(1.2rem,1.05rem + .8vw,1.65rem);
	--interlinia:1.72;
	--lam:35em;
	--brzeg:clamp(1.15rem,4vw,3rem);
	--kontener:1140px;
	--odstep-sekcji:clamp(2rem,4vw,3.25rem);
	--luka:clamp(1.25rem,2.4vw,1.75rem);
	--promien:4px;
	--promien-2:8px;
	--pas:3px;
	--ruch:.2s cubic-bezier(.2,.6,.25,1);
	--belka-h:4rem;
	--druk-biel:#ffffff;
	--druk-czern:#000000;
	--druk-linia:#999999;
	--druk-komenda:#f0f0f0;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html,body{overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}
body{margin:0;background:var(--papier);color:var(--atrament-2);font-family:var(--groteska);font-size:var(--t-baza);line-height:var(--interlinia);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;height:auto;display:block}
h1,h2,h3,p,figure,blockquote,ul,ol,table{margin:0}
ul,ol{padding:0}
a{color:inherit}
button,input,textarea{font:inherit;color:inherit}
:target{scroll-margin-top:calc(var(--belka-h) + 1.5rem)}
a,button,input,textarea,summary,[tabindex]{scroll-margin-top:calc(var(--belka-h) + 1rem)}
h1,h2,h3{font-family:var(--naglowkowy);color:var(--atrament);font-weight:600;line-height:1.24;text-wrap:balance}
h2{font-size:var(--t-h2)}
h3{font-size:var(--t-h3)}
p{text-wrap:pretty}
strong,b{font-weight:700;color:var(--atrament)}
.komenda strong,.komenda b,.stopka strong,.stopka b,.belka strong,.belka b{color:inherit}
.proza a:not(.przycisk),.panel a,.stopka a:not(.do-gory),.karta__meta a{color:var(--ceglana);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;overflow-wrap:break-word;transition:color var(--ruch)}
.proza a:not(.przycisk):hover,.panel a:hover,.karta__meta a:hover{color:var(--ceglana-glab)}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--ceglana-jasna);outline-offset:2px;border-radius:2px;box-shadow:0 0 0 5px var(--biel)}
.belka a:focus-visible,.belka button:focus-visible,.belka input:focus-visible,.stopka a:focus-visible{outline-color:var(--biel);box-shadow:0 0 0 5px var(--noc)}
.pominienie{position:absolute;left:-9999px;top:0;z-index:100;background:var(--noc);color:var(--na-nocy);padding:.85rem 1.25rem;border-radius:0 0 var(--promien) 0;font-weight:700}
.pominienie:focus{left:0}
.kontener{width:100%;max-width:var(--kontener);margin-inline:auto;padding-inline:var(--brzeg)}
.sekcja{padding-block:var(--odstep-sekcji)}
.proza{max-width:var(--lam)}
.proza>*+*{margin-top:1.05em}
.proza ul,.proza ol{padding-left:1.4em}
.proza li+li{margin-top:.5em}
.proza li::marker{color:var(--ceglana);font-weight:700}
.proza blockquote{border-left:var(--pas) solid var(--ceglana-jasna);background:var(--papier);border-radius:0 var(--promien) var(--promien) 0;padding:1rem 1.25rem;font-style:italic}
.uklad{display:grid;gap:clamp(1.5rem,3vw,2.25rem);align-items:start}
.uklad>*{min-width:0}
@media (min-width:1024px){.uklad{grid-template-columns:minmax(0,1fr) 300px}}

.belka{position:sticky;top:0;z-index:50;background:var(--noc);color:var(--na-nocy)}
.admin-bar .belka{top:32px}
.belka__rzad{display:flex;align-items:center;gap:.75rem 1.25rem;flex-wrap:wrap;min-height:var(--belka-h);padding-block:.6rem}
.marka{margin:0;font-family:var(--naglowkowy);font-size:var(--t-marka);line-height:1.1;flex:1 1 auto}
.marka a{color:var(--na-nocy);text-decoration:none;font-weight:600;letter-spacing:-.01em}
.marka a:hover{color:var(--na-nocy-2)}
.custom-logo-link{display:block;max-width:18rem}
.custom-logo-link img{width:auto;max-height:3rem}
.szukajka{display:flex;align-items:stretch;gap:.4rem;flex:0 1 22rem}
.szukajka__pole{flex:1 1 auto;min-width:0;border:1px solid var(--obwodka-jasna);border-radius:var(--promien);padding:.5rem .8rem;font-size:var(--t-maly);min-height:44px;background:var(--szklo);color:var(--na-nocy)}
.szukajka__pole::placeholder{color:var(--na-nocy-2)}
.szukajka__guzik{flex:0 0 auto;min-height:44px;padding:.5rem 1.15rem;border:1px solid var(--obwodka-jasna);background:var(--ceglana-jasna);color:var(--biel);border-radius:var(--promien);font-weight:700;font-size:var(--t-maly);cursor:pointer;transition:background var(--ruch)}
.szukajka__guzik:hover{background:var(--ceglana-glab);border-color:var(--ceglana-glab)}
.panel .szukajka{flex:1 1 auto}
.panel .szukajka__pole,.karta-tresci .szukajka__pole{background:var(--biel);color:var(--atrament);border-color:var(--mgla)}
.panel .szukajka__pole::placeholder,.karta-tresci .szukajka__pole::placeholder{color:var(--mgla)}

.wpisy{display:grid;gap:var(--luka)}
.karta{background:var(--biel);border-radius:var(--promien-2);box-shadow:var(--cien-1);padding:clamp(1.25rem,2.6vw,2rem);position:relative;overflow:hidden;transition:box-shadow var(--ruch),transform var(--ruch)}
.karta::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--pas);background:var(--ceglana-jasna);transform:scaleY(0);transform-origin:top;transition:transform var(--ruch)}
.karta:hover{box-shadow:var(--cien-2);transform:translateY(-2px)}
.karta:hover::before{transform:scaleY(1)}
.karta__tytul{margin:0 0 .5rem;font-size:var(--t-h2)}
.karta__tytul a{text-decoration:none;color:var(--atrament);transition:color var(--ruch)}
.karta__tytul a:hover{color:var(--ceglana)}
.karta__autor{font-size:var(--t-meta);color:var(--mgla);font-style:italic;margin-bottom:1rem}
.karta__autor a{color:var(--ceglana);font-style:normal;font-weight:700;text-decoration:underline;text-underline-offset:.18em}
.karta__foto{display:flex;align-items:center;justify-content:center;margin:0 0 1.15rem;background:var(--papier-2);border-radius:var(--promien);overflow:hidden;border:1px solid var(--linia);max-width:26rem}
.karta__foto img{width:auto;max-width:100%;height:auto}
.wpis__foto{display:flex;align-items:center;justify-content:center;width:fit-content;margin:0 0 1.5rem;background:var(--papier-2);border-radius:var(--promien);overflow:hidden;border:1px solid var(--linia);max-width:100%}
.wpis__foto img{width:auto;max-width:100%;height:auto}
.karta__zajawka{color:var(--atrament-2);margin:0}
.karta__meta{display:flex;flex-direction:column;gap:.35rem;margin-top:1.15rem;padding-top:1rem;border-top:1px solid var(--linia);font-size:var(--t-meta);color:var(--mgla)}
.karta__stopka{margin-top:1rem;display:flex;flex-wrap:wrap;gap:.75rem;justify-content:flex-end}
.wiecej{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;font-family:var(--naglowkowy);font-weight:600;font-size:var(--t-maly);color:var(--ceglana);text-decoration:none}
.wiecej svg{width:15px;height:15px;transition:transform var(--ruch)}
.wiecej:hover{color:var(--ceglana-glab)}
.wiecej:hover svg{transform:translateX(3px)}

.karta-tresci{background:var(--biel);border-radius:var(--promien-2);box-shadow:var(--cien-1);padding:clamp(1.35rem,3vw,2.5rem)}
.karta-tresci .proza{max-width:none}
.karta-tresci .proza>p,.karta-tresci .proza>ul,.karta-tresci .proza>ol,.karta-tresci .proza>blockquote{max-width:var(--lam)}
.tytul-strony{margin-bottom:clamp(1.15rem,2.4vw,1.75rem)}
.tytul-strony h1{font-size:var(--t-tytul)}
.tytul-strony h1::before{content:"› ";color:var(--ceglana-jasna);font-family:var(--maszyna);font-weight:400}
.tytul-strony .karta__autor{margin:.65rem 0 0}
.proza figure{margin-block:1.5em}
.proza figure img{border-radius:var(--promien);border:1px solid var(--linia);background:var(--papier-2);max-width:100%;width:auto}
.zalacznik-pelny img{object-fit:scale-down}
.sciezka,.komenda{font-family:var(--maszyna);font-size:.94em}
.sciezka{display:inline-block;background:var(--papier-2);border-radius:var(--promien);padding:.15em .45em;color:var(--atrament)}
.komenda{display:block;background:var(--konsola);color:var(--biel);border-radius:var(--promien);padding:.85rem 1.1rem;overflow-x:auto;border-left:var(--pas) solid var(--ceglana-jasna)}

.panel{display:grid;gap:clamp(1.25rem,2.4vw,1.75rem)}
.widget{background:var(--biel);border-radius:var(--promien-2);box-shadow:var(--cien-1);overflow:hidden}
.widget__tytul{font-size:var(--t-h3);margin:0;padding:.9rem 1.15rem;color:var(--atrament);border-bottom:var(--pas) solid var(--ceglana-jasna)}
.widget__wnetrze{padding:.5rem 1.15rem 1rem}
.widget ul{list-style:none}
.lista-kreskowana li{border-top:1px solid var(--linia)}
.lista-kreskowana li:first-child{border-top:0}
.lista-kreskowana a{display:flex;align-items:center;gap:.55rem;min-height:44px;padding:.5rem 0;font-size:var(--t-maly);color:var(--atrament-2);text-decoration:none;transition:color var(--ruch)}
.lista-kreskowana a:hover{color:var(--ceglana)}
.lista-kreskowana a::before{content:"›";font-family:var(--maszyna);color:var(--ceglana-jasna);flex:0 0 auto}

.navigation.pagination{background:var(--biel);border-radius:var(--promien-2);box-shadow:var(--cien-1);padding:.75rem}
.nav-links{display:flex;flex-wrap:wrap;gap:.4rem}
.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:.35rem .75rem;border:1px solid var(--linia);border-radius:var(--promien);color:var(--ceglana);font-weight:700;text-decoration:none}
.page-numbers.current{background:var(--ceglana-jasna);border-color:var(--ceglana-jasna);color:var(--biel)}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.stopka{background:var(--noc);color:var(--na-nocy-2);margin-top:var(--odstep-sekcji)}
.stopka__rzad{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;padding-block:clamp(1.5rem,3vw,2.25rem);font-size:var(--t-maly)}
.do-gory{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:0 0 44px;border:1px solid var(--linia-jasna);border-radius:var(--promien);color:var(--na-nocy);transition:background var(--ruch),color var(--ruch)}
.do-gory svg{width:20px;height:20px}
.do-gory:hover{background:var(--biel);color:var(--noc)}

@media (max-width:782px){.admin-bar .belka{top:46px}}
@media (max-width:480px){.belka__rzad{align-items:stretch}.marka{flex-basis:100%}.belka .szukajka{flex-basis:100%;width:100%}.szukajka__guzik{padding-inline:.85rem}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}
@media print{.belka,.stopka,.panel,.do-gory{display:none!important}body{background:var(--druk-biel);color:var(--druk-czern);font-size:11pt}.karta,.karta-tresci{box-shadow:none;border:1px solid var(--druk-linia);break-inside:avoid}.komenda{background:var(--druk-komenda);color:var(--druk-czern);border:1px solid var(--druk-linia)}a{text-decoration:underline}}
