/* FD Nagłówek – układ wzorowany na nagłówku Wodociągów Miasta Krakowa.
   Wartości (kolory, rozmiary) przychodzą ze zmiennych CSS ustawianych w panelu. */

.fdn-wrap{position:relative;z-index:var(--fdn-z,999)}
.fdn-wrap.fdn-sticky{position:sticky;top:calc(var(--fdn-adminbar,0px) - var(--fdn-top-h,0px))}
body.admin-bar .fdn-wrap.fdn-sticky{--fdn-adminbar:32px}
@media (max-width:782px){body.admin-bar .fdn-wrap.fdn-sticky{--fdn-adminbar:46px}}
@media (max-width:600px){body.admin-bar .fdn-wrap.fdn-sticky{--fdn-adminbar:0px}}

.fdn,.fdn *,.fdn *::before,.fdn *::after{box-sizing:border-box}
.fdn{font-family:var(--fdn-font);color:var(--fdn-link);line-height:1.4;-webkit-font-smoothing:antialiased;text-align:left}
.fdn.fdn :is(a,button,input,span,strong,li,ul,nav,form,label){font-family:inherit;letter-spacing:normal}
.fdn.fdn ul{list-style:none;margin:0;padding:0}
.fdn.fdn li{margin:0;padding:0}
.fdn.fdn li::before,.fdn.fdn li::marker{content:none}
.fdn.fdn a{text-decoration:none;box-shadow:none;background-image:none}
.fdn.fdn button{-webkit-appearance:none;appearance:none;background:none;border:0;margin:0;padding:0;color:inherit;font:inherit;line-height:inherit;text-transform:none;box-shadow:none;min-height:0;min-width:0;width:auto;height:auto;border-radius:0;cursor:pointer;text-shadow:none}
.fdn.fdn img{max-width:none;border:0;box-shadow:none;margin:0;padding:0}
.fdn .fdn-i{width:1em;height:1em;fill:currentColor;flex:none;display:block}
.fdn .fdn-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.fdn :is(a,button,input):focus-visible{outline:3px solid var(--fdn-focus);outline-offset:2px}
.fdn .fdn-in{display:flex;align-items:center;gap:16px;padding-inline:var(--fdn-side);margin-inline:auto;max-width:var(--fdn-max,none);width:100%}

/* ---------- Górny pasek ---------- */
.fdn-top{background:var(--fdn-top-bg);color:var(--fdn-top-text);font-size:var(--fdn-top-size);line-height:16px;padding-block:var(--fdn-top-pad)}
.fdn-top .fdn-in{justify-content:space-between;flex-wrap:wrap;row-gap:8px}
.fdn-top ul{display:flex;align-items:center;flex-wrap:wrap;row-gap:8px}
.fdn-top-r{margin-left:auto}
.fdn.fdn .fdn-top li{display:flex;align-items:center;gap:7px;margin-right:16px;padding-right:16px;border-right:1px solid var(--fdn-top-sep);min-height:32px}
.fdn.fdn .fdn-top li:last-child{margin-right:0;padding-right:0;border-right:0}
.fdn-top .fdn-i{font-size:15px;opacity:.85}
.fdn-top strong{color:var(--fdn-top-link);font-weight:700}
.fdn.fdn .fdn-top a{color:var(--fdn-top-link);display:inline-flex;align-items:center;gap:7px}
.fdn.fdn .fdn-top a:hover{text-decoration:underline;text-underline-offset:3px}
.fdn.fdn .fdn-top a.fdn-pill{background:var(--fdn-top-pill-bg);color:var(--fdn-top-pill-text);border-radius:18px;padding:8px 16px;font-weight:600;line-height:16px}
.fdn.fdn .fdn-top a.fdn-pill:hover{text-decoration:none;filter:brightness(1.12)}
.fdn-top .fdn-pill .fdn-i{opacity:1}
.fdn-soc{gap:8px}
.fdn-soc-l{white-space:nowrap}
.fdn.fdn .fdn-soc a.fdn-soc-a{width:32px;height:32px;border-radius:50%;background:var(--fdn-social-bg);color:var(--fdn-social-icon);display:inline-flex;align-items:center;justify-content:center;transition:background .2s,color .2s}
.fdn.fdn .fdn-soc a.fdn-soc-a:hover{background:var(--fdn-social-hover);color:var(--fdn-social-bg);text-decoration:none}
.fdn-soc-a .fdn-i{font-size:17px;opacity:1}

/* ---------- Główny pasek ---------- */
.fdn-main{background:var(--fdn-main-bg);border-bottom:1px solid var(--fdn-main-line);padding-block:var(--fdn-main-pad);position:relative}
.fdn--shadow .fdn-main{box-shadow:0 4px 16px rgba(20,30,40,.08)}
.fdn-main .fdn-in{gap:12px}
.fdn.fdn a.fdn-logo{display:block;flex:none;line-height:0;margin-right:auto}
.fdn--align-left a.fdn-logo{margin-right:16px!important}
.fdn.fdn .fdn-logo img{height:var(--fdn-logo-h);width:auto;display:block}
.fdn-logo-t{font-size:22px;font-weight:700;color:var(--fdn-link);line-height:1.2}
.fdn-nav{display:flex;align-items:center}
.fdn--align-center .fdn-nav{margin-inline:auto}
.fdn--align-left .fdn-nav{margin-right:auto}
.fdn-menu{display:flex;align-items:center;flex-wrap:nowrap}
.fdn-li{position:relative}
.fdn-row{display:flex;align-items:center;border-radius:var(--fdn-radius);transition:background .2s,color .2s;color:var(--fdn-link)}
.fdn.fdn a.fdn-a,.fdn.fdn button.fdn-a{display:block;padding:0 var(--fdn-lpad);line-height:var(--fdn-lh);font-size:var(--fdn-menu-size);font-weight:var(--fdn-menu-weight);text-transform:var(--fdn-upper);color:inherit;white-space:nowrap;border-radius:var(--fdn-radius)}
.fdn-li.has-sub .fdn-a{padding-right:2px!important}
.fdn.fdn .fdn-sub-t{display:flex;align-items:center;justify-content:center;height:var(--fdn-lh);padding:0 calc(var(--fdn-lpad) - 4px) 0 2px;color:var(--fdn-arrow);border-radius:var(--fdn-radius)}
.fdn-sub-t .fdn-i{font-size:20px;transition:transform .2s}
.fdn-li:hover>.fdn-row,.fdn-li:focus-within>.fdn-row,.fdn-li.is-open>.fdn-row,.fdn-li.is-active>.fdn-row{background:var(--fdn-link-hover-bg);color:var(--fdn-link-hover)}
.fdn-li:hover>.fdn-row .fdn-sub-t,.fdn-li.is-open>.fdn-row .fdn-sub-t,.fdn-li.is-active>.fdn-row .fdn-sub-t{color:var(--fdn-link-hover)}
.fdn-li.is-open>.fdn-row .fdn-sub-t .fdn-i{transform:rotate(180deg)}

/* Rozwijane listy */
.fdn.fdn .fdn-sub{position:absolute;top:100%;left:0;width:var(--fdn-sub-w);background:var(--fdn-sub-bg);border:1px solid var(--fdn-sub-border);border-radius:8px;box-shadow:0 4px 16px rgba(20,30,40,.1);opacity:0;visibility:hidden;transform:translateY(18px);transition:opacity .2s,transform .2s,visibility 0s .2s;z-index:5}
.fdn-sub::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.fdn .fdn-sub.fdn-sub--right{left:auto;right:0}
.fdn-sub-in{max-height:600px;overflow:auto;border-radius:8px}
.fdn-li:hover>.fdn-sub,.fdn-li.is-open>.fdn-sub{opacity:1;visibility:visible;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility 0s}
.fdn-li.no-hover:not(.is-open)>.fdn-sub{opacity:0;visibility:hidden}
.fdn.fdn .fdn-sub li+li{border-top:1px solid var(--fdn-sub-border)}
.fdn.fdn .fdn-sub a{display:block;padding:13px 16px;font-size:var(--fdn-sub-size);line-height:22px;color:var(--fdn-sub-text);font-weight:400;transition:background .15s,color .15s}
.fdn.fdn .fdn-sub a:hover,.fdn.fdn .fdn-sub a:focus-visible{background:var(--fdn-sub-hover-bg);color:var(--fdn-sub-hover-text)}
.fdn.fdn .fdn-sub li.is-active>a{font-weight:700}

/* Przycisk i okrągłe przyciski */
.fdn-actions{display:flex;align-items:center;gap:12px;flex:none}
.fdn.fdn a.fdn-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 32px;background:var(--fdn-btn-bg);color:var(--fdn-btn-text);border-radius:var(--fdn-radius);font-size:var(--fdn-btn-size);font-weight:600;line-height:22px;white-space:nowrap;transition:background .2s}
.fdn.fdn a.fdn-btn:hover{background:var(--fdn-btn-hover-bg);color:var(--fdn-btn-text)}
.fdn-btn .fdn-i{font-size:19px}
.fdn.fdn .fdn-circle{width:var(--fdn-circle-size);height:var(--fdn-circle-size);border-radius:50%;border:2px solid var(--fdn-circle);background:var(--fdn-circle-bg);color:var(--fdn-circle);display:inline-flex;align-items:center;justify-content:center;flex:none;transition:background .2s,color .2s}
.fdn.fdn .fdn-circle:hover,.fdn.fdn .fdn-circle[aria-expanded="true"]{background:var(--fdn-circle);color:var(--fdn-circle-bg)}
.fdn-circle .fdn-i{font-size:22px}
.fdn .fdn-circle .fdn-x{display:none}
.fdn .fdn-circle[aria-expanded="true"] .fdn-x{display:block}
.fdn .fdn-circle[aria-expanded="true"] .fdn-o{display:none}
.fdn-bars{display:block;width:20px;height:14px;position:relative}
.fdn-bars span{position:absolute;left:0;right:0;height:2px;background:currentColor;border-radius:2px}
.fdn-bars span:nth-child(1){top:0}.fdn-bars span:nth-child(2){top:6px}.fdn-bars span:nth-child(3){top:12px}
.fdn .fdn-burger{display:none!important}
.fdn-mob-extra{display:none}

/* Pasek wyszukiwania */
.fdn-search{background:var(--fdn-search-bar-bg);padding-block:16px;border-bottom:1px solid var(--fdn-main-line)}
.fdn-search[hidden]{display:none}
.fdn-search form{display:flex;gap:10px;width:100%;max-width:900px;margin-inline:auto}
.fdn.fdn .fdn-search input[type=search]{flex:1;min-width:0;height:52px;margin:0;border:1px solid var(--fdn-sub-border);border-radius:26px;padding:0 22px;font-size:17px;background:#fff;color:#1f2933;box-shadow:none;outline-offset:2px}
.fdn.fdn .fdn-search button{height:52px;padding:0 28px;border-radius:26px;background:var(--fdn-btn-bg);color:var(--fdn-btn-text);font-weight:600;font-size:16px}
.fdn.fdn .fdn-search button:hover{background:var(--fdn-btn-hover-bg)}

/* Podgląd w panelu */
.fdn-demo{font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;padding:40px var(--fdn-side);color:#5c6670}
.fdn-demo h1{font-size:34px;color:#1f2933;margin:0 0 12px}
.fdn-demo p{max-width:720px;line-height:1.6;margin:0 0 10px}