/* =====================================================================
   MSDL XP — skórka panelu w stylu Windows XP, wariant ROYALE NOIR (ciemny).
   Strojenie wg decyzji użytkownika:
     • POŁYSK: subtelnie — płasko, „XP w akcentach", blisko obecnego czystego
       panelu (mniej szkła/cieni; spokojne dla oczu przy długiej pracy).
     • START: ciemny Royale Noir (grafit + teal poświata, mniej zieleni).
     • IKONY: stonowane/pastelowe (te same kolory modułów, przygaszone).

   • Zawężone WYŁĄCZNIE do panelu (.adm / .ash). Strona publiczna i logo — nietknięte.
   • Ładowane PO styles.css → nadpisuje „czysty ciemny motyw" z końca styles.css.
   • Nie zmienia rozmiarów układu (--ash-top / --ash-w / marginesy) — tylko skórę.
   • Wycofanie = nie ładować tego pliku. Zero zmian w logice.
   ===================================================================== */

/* 0) Paleta Royale Noir + „energia" teal z rodziny logo MSDL --------------- */
.adm, .ash{
  --xp-ink:#0a0e16;
  --xp-desk-1:#0b0f18; --xp-desk-2:#0e131e;
  --xp-bar-1:#2c3540;          /* belki / pasek zadań (góra) — płaski, niski kontrast */
  --xp-bar-2:#222a34;
  --xp-bar-3:#1a212b;
  --xp-bar-4:#141a23;          /* dół belek */
  --xp-win:#161d27;            /* korpus „okna" / karty */
  --xp-win-2:#1a212c;
  --xp-edge:#0a0d13;           /* miękka krawędź 3D (ciemna) */
  --xp-sheen:rgba(255,255,255,.06); /* delikatny refleks (subtelnie) */
  --xp-accent:#3bbfcb;
  --xp-accent-2:#67d2dc;
  --xp-accent-deep:#16919c;
  --xp-amber:#d99a3e;          /* „pomarańcz Royale" — stonowany */
  --xp-text:#eef2f4; --xp-soft:#c2ccd2; --xp-muted:#8a96a1;
  font-family:'Tahoma','Segoe UI','Trebuchet MS',system-ui,Arial,sans-serif;
}
.adm h1, .adm .form-sec, .ash-brand, .adm .kpi__l, .adm .adm__head h1, .xpwin__bar b{
  font-family:'Trebuchet MS','Tahoma','Segoe UI',sans-serif;
}

/* ---------------------------------------------------------------------------
   1) PULPIT — obszar roboczy (bardzo delikatny „Bliss noir": ledwie muśnięty teal)
   --------------------------------------------------------------------------- */
.ash-main{
  background:
    radial-gradient(1100px 420px at 50% 124%, rgba(59,191,203,.06), transparent 64%),
    linear-gradient(180deg, var(--xp-desk-1) 0%, #0c111b 60%, var(--xp-desk-2) 100%);
}

/* ---------------------------------------------------------------------------
   2) PASEK ZADAŃ (topbar = .ash-top) — płaski granat, cienka teal kreska
   --------------------------------------------------------------------------- */
.ash-top{
  background:linear-gradient(180deg, var(--xp-bar-1) 0%, var(--xp-bar-2) 50%, var(--xp-bar-3) 100%) !important;
  border-bottom:1px solid var(--xp-edge) !important;
  box-shadow:inset 0 1px 0 var(--xp-sheen);
}
/* teal kreska pod paskiem — subtelna */
.ash-top::after{
  display:block !important; content:"" !important;
  position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background:linear-gradient(90deg, transparent, rgba(59,191,203,.45) 20%, rgba(59,191,203,.45) 80%, transparent);
}

/* Przycisk START — ciemny Royale Noir (grafit + teal poświata), zaokrąglony z prawej */
.ash-brand{
  padding:0 17px 0 11px !important; border-radius:5px 14px 14px 5px !important;
  background:linear-gradient(180deg,#2f3a47 0%, #222b35 55%, #19212b 100%) !important;
  border:1px solid var(--xp-edge) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 0 9px rgba(59,191,203,.16);
  position:relative;
}
.ash-brand::before{ /* teal akcent przy lewej krawędzi Start */
  content:""; position:absolute; left:5px; top:8px; bottom:8px; width:2px; border-radius:2px;
  background:linear-gradient(180deg,var(--xp-accent-2),var(--xp-accent-deep)); opacity:.85;
}
.ash-brand:hover{ border-color:var(--xp-accent-deep) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 0 13px rgba(59,191,203,.30); }
.ash-brand img{ height:18px; }
.ash-brand b{
  color:#dff4f6 !important; font-style:italic; font-weight:700; font-size:.96rem;
  letter-spacing:.2px; text-shadow:0 1px 1px rgba(0,0,0,.5);
}

/* Zasobnik systemowy: przyciski WWW/Wyloguj + zegar + alerty (wcięta nisza) */
.ash-top__www, .ash-top__logout{
  background:linear-gradient(180deg,#2a323d,#1d242e) !important;
  border:1px solid var(--xp-edge) !important; color:var(--xp-soft) !important;
  border-radius:5px !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.ash-top__www:hover, .ash-top__logout:hover{ border-color:var(--xp-accent) !important; color:#fff !important; }
.xp-tray{
  display:flex; align-items:center; gap:12px; height:32px; padding:0 11px; margin-left:6px;
  border-radius:6px; color:var(--xp-soft); font-size:.81rem;
  background:#0c111a; border:1px solid var(--xp-edge);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.45);
}
.xp-tray__alert{ display:inline-flex; align-items:center; gap:6px; color:var(--xp-amber); font-weight:600; }
.xp-tray__alert::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--xp-amber); }
.xp-clock{ color:var(--xp-text); font-variant-numeric:tabular-nums; letter-spacing:.3px; }
.xp-clock small{ display:block; color:var(--xp-muted); font-size:.66rem; line-height:1; margin-top:1px; }

/* ---------------------------------------------------------------------------
   3) MENU START (sidebar = .ash-side) — dwukolorowe menu XP, płasko
   --------------------------------------------------------------------------- */
.ash-side{
  background:linear-gradient(180deg,#121925 0%, #0e131d 100%) !important;
  border-right:1px solid var(--xp-edge) !important;
}
.xp-userhead{
  display:flex; align-items:center; gap:11px; padding:12px 14px; margin-bottom:6px;
  background:linear-gradient(180deg,#232c37 0%, #181f29 100%);
  border-bottom:1px solid var(--xp-accent-deep);
}
.xp-userhead__pic{
  width:36px; height:36px; border-radius:8px; flex:0 0 auto; display:grid; place-items:center;
  background:linear-gradient(180deg,#2f8a93,#1f6f78); color:#eafdff; font-weight:700; font-size:1rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18); border:1px solid #0c5b63;
}
.xp-userhead__t{ line-height:1.2; min-width:0; }
.xp-userhead__t b{ color:#eef6f8; font-size:.88rem; display:block; }
.xp-userhead__t span{ color:var(--xp-muted); font-size:.74rem; }

.ash-nav__group{
  margin:12px 14px 4px !important; padding-top:9px;
  color:var(--xp-amber) !important; font-size:.66rem !important; font-weight:700;
  letter-spacing:.10em; text-transform:uppercase;
  border-top:1px solid rgba(255,255,255,.06);
}

.ash-link{
  margin:1px 8px !important; padding:6px 9px !important; border-radius:5px !important;
  color:#d7dde4 !important; gap:11px !important;
}
.ash-link:hover{ background:rgba(59,191,203,.10) !important; color:#fff !important; }
.ash-link.is-active{
  background:linear-gradient(180deg, rgba(59,191,203,.28), rgba(59,191,203,.14)) !important;
  color:#eafcff !important; box-shadow:inset 3px 0 0 var(--xp-accent);
}
.ash-link.is-active::before{ display:none !important; }
.ash-link.is-active .ash-link__t{ font-weight:700; }

.xp-startfoot{
  margin-top:8px; padding:9px 14px; display:flex; gap:10px; align-items:center; justify-content:space-between;
  background:linear-gradient(180deg,#222b35,#161d27); border-top:1px solid var(--xp-accent-deep);
  color:var(--xp-soft); font-size:.78rem;
}

/* ---------------------------------------------------------------------------
   4) KOLOROWE IKONY-KAFELKI — STONOWANE / PASTELOWE (kolor per moduł po href)
   Reużycie istniejącego sprite: biały glif na przygaszonym kafelku. Zero zmian markupu.
   --------------------------------------------------------------------------- */
/* KPI / karty dashboardu — zostają kafelki z glifem (jak dotąd) */
.kpi__ic svg, .adm-card__ic svg, .xp-ic svg{
  width:25px !important; height:25px !important; padding:5px; border-radius:6px; color:#eaf0f3 !important;
  flex:0 0 auto;
  background:linear-gradient(180deg,#3a444f,#2a323c);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 1px 1px rgba(0,0,0,.25);
}
/* SIDEBAR — AUTENTYCZNE KOLOROWE IKONY XP (PNG) zamiast glifu; kolor po href modułu.
   Glif chowamy (color:transparent → stroke=currentColor znika), PNG jako tło svg. ZERO zmian markupu. */
.ash-link svg{
  width:24px !important; height:24px !important; padding:0 !important; flex:0 0 auto;
  background:none !important; box-shadow:none !important; color:transparent !important;
  background-repeat:no-repeat !important; background-position:center !important; background-size:contain !important;
}
.ash-link[href$='/admin'] svg        { background-image:url(/images/xp/pulpit.png) !important; }
.ash-link[href$='/kalendarz'] svg    { background-image:url(/images/xp/kalendarz.png) !important; }
.ash-link[href$='/zadania'] svg      { background-image:url(/images/xp/zadania.svg) !important; }
.ash-link[href$='/email'] svg        { background-image:url(/images/xp/poczta.svg) !important; }
.ash-link[href$='/pomiary'] svg      { background-image:url(/images/xp/pomiary.png) !important; }
.ash-link[href$='/projekty'] svg     { background-image:url(/images/xp/projekty.png) !important; }
.ash-link[href$='/firmy'] svg        { background-image:url(/images/xp/firmy.png) !important; }
.ash-link[href$='/obiekty'] svg      { background-image:url(/images/xp/obiekty.svg) !important; }
.ash-link[href$='/urzadzenia'] svg   { background-image:url(/images/xp/winda.svg) !important; }
.ash-link[href$='/zlecenia'] svg     { background-image:url(/images/xp/zlecenia.png) !important; }
.ash-link[href$='/zadania-serwisowe'] svg { background-image:url(/images/xp/zadania-serwisowe.svg) !important; }
.ash-link[href$='/dokumentacja'] svg { background-image:url(/images/xp/dokumentacja.png) !important; }
.ash-link[href$='/flota'] svg        { background-image:url(/images/xp/flota.svg) !important; }
.ash-link[href$='/pracownicy'] svg   { background-image:url(/images/xp/pracownicy.svg) !important; }
.ash-link[href$='/resurs'] svg       { background-image:url(/images/xp/resurs.png) !important; }
.ash-link[href$='/faktury'] svg      { background-image:url(/images/xp/faktury.png) !important; }
.ash-link[href$='/zamowienia'] svg   { background-image:url(/images/xp/zamowienia.png) !important; }
.ash-link[href$='/zapytania'] svg    { background-image:url(/images/xp/zapytania.png) !important; }
.ash-link[href$='/realizacje'] svg   { background-image:url(/images/xp/realizacje.png) !important; }
.ash-link[href$='/ustawienia'] svg   { background-image:url(/images/xp/ustawienia.png) !important; }
html.ash-collapsed .ash-link svg{ width:26px !important; height:26px !important; }

/* ---------------------------------------------------------------------------
   5) NAGŁÓWEK STRONY — płaska belka z subtelną teal kreską u dołu
   --------------------------------------------------------------------------- */
.adm .adm__head{
  background:linear-gradient(180deg,#222b35 0%, #161d27 100%);
  border:1px solid var(--xp-edge); border-radius:7px 7px 0 0;
  padding:12px 16px !important; margin-bottom:18px !important;
}
.adm .adm__head h1{ color:#eef6f8; }

/* ---------------------------------------------------------------------------
   6) KPI — kafle płaskie (kolorowa, stonowana ikona; liczba semantyczna)
   --------------------------------------------------------------------------- */
.adm .kpi{
  background:var(--xp-win-2) !important; border:1px solid var(--xp-edge) !important; border-radius:8px !important;
  box-shadow:none !important;
}
.adm .kpi:hover{ border-color:var(--xp-accent-deep) !important; }
.adm .kpi__ic{ width:auto !important; height:auto !important; background:none !important; opacity:1 !important; top:13px !important; right:13px !important; }
.adm .kpi__ic svg{ width:28px !important; height:28px !important; padding:5px; border-radius:7px; }
/* (stare gradientowe kafelki KPI po href USUNIĘTE — kolory zastąpione kolorowymi
   ikonami XP przez :has(use[...]) w sekcji kontrolek niżej) */

/* ---------------------------------------------------------------------------
   7) „OKNA" — karty / panele = miękka ramka 3D (płasko) + opcjonalna belka tytułu
   --------------------------------------------------------------------------- */
.adm .al-card, .adm .dash-panel, .adm .adm-card, .adm .fk-grid-wrap, .adm .fk-totals, .xpwin{
  background:var(--xp-win) !important; border:1px solid var(--xp-edge) !important; border-radius:8px !important;
  box-shadow:0 4px 14px -12px rgba(0,0,0,.7) !important;
}
.xpwin{ overflow:hidden; }
.xpwin__bar{
  display:flex; align-items:center; gap:9px; padding:7px 12px;
  background:linear-gradient(180deg, var(--xp-bar-1) 0%, var(--xp-bar-2) 55%, var(--xp-bar-3) 100%);
  border-bottom:1px solid var(--xp-edge);
}
.xpwin__bar b{ color:#eef6f8; font-size:.9rem; margin-right:auto; }
.xpwin__bar svg{ width:23px !important; height:23px !important; }
.xpwin__btns{ display:flex; gap:5px; }
.xpwin__btn{ width:21px; height:18px; border-radius:4px; display:grid; place-items:center; cursor:pointer;
  border:1px solid var(--xp-edge); color:#cdd6dd; font-size:.7rem; line-height:1;
  background:#262e38; }
.xpwin__btn--x{ background:#9e4640; border-color:#7a312c; color:#fff; }
.xpwin__btn:hover{ filter:brightness(1.14); }
.xpwin__body{ padding:14px 16px; }

/* Sekcje formularza jako „group box" XP — płaski pasek nagłówka (bez podkreślenia) */
.adm .form-sec{
  background:linear-gradient(180deg,#222b35,#171e28); color:#eaf6f8 !important;
  border:1px solid var(--xp-edge); border-radius:6px; padding:7px 12px !important;
  margin:22px 0 12px !important;
}

/* ---------------------------------------------------------------------------
   8) TABELE / GRIDY — gęsto i czytelnie; nagłówek = płaski pasek (bez połysku)
   --------------------------------------------------------------------------- */
.adm .adm-table thead th, .adm .adm-table th,
.adm .fk-grid thead th{
  background:linear-gradient(180deg,#262f3a, #1c232d) !important;
  color:#dfe8ee !important; border-bottom:1px solid var(--xp-edge) !important;
}
.adm .fk-grid tbody tr.fk-sel, .adm .fk-grid tbody tr.zk-sel{
  background:rgba(59,191,203,.16) !important; box-shadow:inset 3px 0 0 var(--xp-accent) !important;
}
.adm .fk-filterbar{
  background:#161d27 !important; border:1px solid var(--xp-edge) !important; border-radius:8px !important;
}

/* ---------------------------------------------------------------------------
   9) PRZYCISKI — płaski „Luna" (matowy, cienki bevel), primary teal, danger czerwony
   --------------------------------------------------------------------------- */
.adm .btn, .ash .btn{
  border:1px solid var(--xp-edge) !important; border-radius:5px !important; color:#e0e7ed !important;
  background:linear-gradient(180deg,#2c343f 0%, #232b34 52%, #1d242d 100%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07) !important;
  transition:filter .12s, border-color .12s !important;
}
.adm .btn:hover, .ash .btn:hover{ filter:brightness(1.1); border-color:var(--xp-accent) !important; color:#fff !important; }
.adm .btn:active, .ash .btn:active{ box-shadow:inset 0 2px 4px rgba(0,0,0,.45) !important; }
.adm .btn--primary, .ash .btn--primary{
  background:linear-gradient(180deg,#34b4c0 0%, #279fab 52%, #1f8e9a 100%) !important;
  border-color:#136b75 !important; color:#04232a !important;
}
.adm .btn--primary:hover, .ash .btn--primary:hover{ color:#04232a !important; filter:brightness(1.06); }
.adm .btn--danger{
  background:linear-gradient(180deg,#b9534c 0%, #a3433c 100%) !important;
  border-color:#7a312c !important; color:#fff !important;
}
.adm .btn--ghost{ background:#1c232c !important; color:var(--xp-soft) !important; }

/* ---------------------------------------------------------------------------
   10) POLA FORMULARZY — lekko wcięte (sunken), bez przesady
   --------------------------------------------------------------------------- */
.adm .field input, .adm .field textarea, .adm .field select,
.adm .adm-input, .adm .of-in, .adm .fk-filterbar__search, .adm .combo input{
  background:#10171f !important; border:1px solid rgba(255,255,255,.24) !important; border-radius:4px !important;
  color:#eef2f4 !important; box-shadow:inset 0 1px 2px rgba(0,0,0,.5) !important;
}
.adm .field input:hover, .adm .field textarea:hover, .adm .field select:hover,
.adm .adm-input:hover, .adm .of-in:hover{ border-color:rgba(255,255,255,.38) !important; }
.adm .field input:focus, .adm .field textarea:focus, .adm .field select:focus,
.adm .adm-input:focus{
  border-color:var(--xp-accent) !important; background:#0c131b !important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.5), 0 0 0 2px rgba(59,191,203,.35) !important; outline:none !important;
}
.adm .field label{ color:var(--xp-soft) !important; }
.adm .picker__btn{ background:#10171f !important; border:1px solid rgba(255,255,255,.24) !important; box-shadow:inset 0 1px 2px rgba(0,0,0,.5) !important; }
/* Podświetlenie pól uzupełnionych przez AI (Dokumentacja → Dane podstawowe).
   Specyficzność (0,3,1) + !important — musi pokonać reguły pól XP wyżej (0,2,1) i :focus (0,2,2). */
.adm .field input.dok-ai-hot, .adm .field textarea.dok-ai-hot, .adm .field select.dok-ai-hot,
.adm .fk-konta input.dok-ai-hot{
  border-color:#d99a3e !important; background:#241d0c !important;
  box-shadow:0 0 0 2px rgba(217,154,62,.55) inset !important;
}

/* ---------------------------------------------------------------------------
   11) OKNO DIALOGOWE (emodal) — okno XP z płaską belką i czerwonym X
   --------------------------------------------------------------------------- */
.emodal__win{ border:1px solid var(--xp-edge) !important; border-radius:8px !important; }
.emodal__head{
  background:linear-gradient(180deg, var(--xp-bar-1) 0%, var(--xp-bar-2) 55%, var(--xp-bar-3) 100%) !important;
  border-bottom:1px solid var(--xp-edge) !important;
}
.emodal__title{ color:#eef6f8 !important; }
.emodal__x{
  background:#9e4640 !important; border:1px solid #7a312c !important; color:#fff !important; border-radius:4px !important;
}
.emodal__x:hover{ filter:brightness(1.14); }

/* ---------------------------------------------------------------------------
   12) PASKI PRZEWIJANIA — czytelne, płaskie (tylko w panelu; WebKit/Blink)
   --------------------------------------------------------------------------- */
.ash-side::-webkit-scrollbar, .ash-main ::-webkit-scrollbar, .emodal ::-webkit-scrollbar{ width:14px; height:14px; }
.ash-side::-webkit-scrollbar-track, .ash-main ::-webkit-scrollbar-track{ background:#0b0f17; }
.ash-side::-webkit-scrollbar-thumb, .ash-main ::-webkit-scrollbar-thumb{
  background:#2a323c; border:1px solid var(--xp-edge); border-radius:3px;
}
.ash-side::-webkit-scrollbar-thumb:hover, .ash-main ::-webkit-scrollbar-thumb:hover{ background:#343d48; }

/* ---------------------------------------------------------------------------
   13) Dostępność: prefers-reduced-motion
   --------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce){
  .adm .btn, .ash .btn{ transition:none !important; }
}

/* ---------------------------------------------------------------------------
   14) BELKI-OKNA na Pulpicie — nagłówki paneli (.dash-panel__t) jako paski tytułu
        (bez zmian markupu: ujemne marginesy do krawędzi panelu padding 18/20)
   --------------------------------------------------------------------------- */
.adm .dash-panel{ overflow:hidden; }
.adm .dash-panel__t{
  margin:-18px -20px 14px !important; padding:8px 14px !important;
  background:linear-gradient(180deg, var(--xp-bar-1) 0%, var(--xp-bar-2) 55%, var(--xp-bar-3) 100%) !important;
  border-bottom:1px solid var(--xp-edge); color:#eef6f8 !important; font-size:.92rem !important;
}
.adm .dash-panel__t svg{
  width:23px !important; height:23px !important; padding:5px; border-radius:6px; color:#eaf0f3 !important;
  background:linear-gradient(180deg,#3a444f,#2a323c);
}
.adm .dash-panel__t .muted{ color:#9fb0ba !important; }

/* Nagłówek użytkownika w ZWINIĘTYM sidebarze — tylko awatar */
html.ash-collapsed .xp-userhead{ justify-content:center; padding:12px 8px; }
html.ash-collapsed .xp-userhead__t{ display:none; }

/* ---------------------------------------------------------------------------
   15) CIEMNY XP — karty grup sidebara + przyciski okna na panelach + kontrolki
   --------------------------------------------------------------------------- */
/* karty grup w menu Start (wrapper .ash-card dodany w MainLayout) */
.ash-card{ background:var(--xp-win); border:1px solid var(--xp-edge); border-radius:7px; margin:0 8px 9px; overflow:hidden;
  box-shadow:0 4px 14px -12px rgba(0,0,0,.7); }
.ash-card .ash-nav__group{ margin:0 !important; border-top:0 !important; padding:6px 10px !important;
  background:linear-gradient(180deg,var(--xp-bar-1),var(--xp-bar-3)); color:#eaf6f8 !important;
  border-bottom:1px solid var(--xp-edge); }
.ash-card .ash-link{ margin:0 !important; border-radius:0 !important; border-bottom:1px solid rgba(255,255,255,.04); }
.ash-card .ash-link:last-child{ border-bottom:0; }
/* zwinięty rail: karty znikają (same ikony) */
html.ash-collapsed .ash-card{ background:none; border:0; margin:0; box-shadow:none; }
html.ash-collapsed .ash-card .ash-nav__group{ display:none; }

/* dekoracyjne przyciski okna (min/maks/zamknij) na pasku tytułu paneli Pulpitu */
.adm .dash-panel__t{ position:relative; padding-right:62px !important; }
.adm .dash-panel__t::after{
  content:""; position:absolute; right:9px; top:50%; transform:translateY(-50%); width:60px; height:18px;
  background-repeat:no-repeat, no-repeat, no-repeat;
  background-position:left center, center, right center;
  background-size:18px 18px, 18px 18px, 18px 18px;
  background-image:url(/assets/vendor/xpcss-icons/minimize.svg), url(/assets/vendor/xpcss-icons/maximize.svg), url(/assets/vendor/xpcss-icons/close.svg);
}
/* ===== AUTENTYCZNE KONTROLKI z XP.css (SVG w /assets/vendor/xpcss-icons) ===== */
/* Przycisk ZAMKNIJ okna (emodal + .xpwin) = czerwony przycisk XP */
.emodal__x, .adm .xpwin__btn--x, .xpwin__btn--x{
  background:url(/assets/vendor/xpcss-icons/close.svg) center / 21px no-repeat !important;
  border:0 !important; box-shadow:none !important; color:transparent !important; font-size:0 !important;
  width:23px !important; height:22px !important;
}
/* Przycisk zamknięcia OKNA-NAKŁADKI = większy/czytelniejszy w wyższej belce (małe przyciski .xpwin__btn--x na panelach bez zmian) */
.emodal__x{ width:34px !important; height:30px !important; background-size:24px !important; }
.emodal__x:hover, .xpwin__btn--x:hover{ filter:brightness(1.06); }
/* Min/Maks (.xpwin__btn, jasne przyciski Luna) */
.xpwin__btns .xpwin__btn:not(.xpwin__btn--x){ color:transparent !important; font-size:0 !important; border:0 !important;
  background:no-repeat center / 21px !important; width:23px !important; height:22px !important; }
.xpwin__btns .xpwin__btn:not(.xpwin__btn--x):first-child{ background-image:url(/assets/vendor/xpcss-icons/minimize.svg) !important; }
.xpwin__btns .xpwin__btn:not(.xpwin__btn--x):nth-child(2){ background-image:url(/assets/vendor/xpcss-icons/maximize.svg) !important; }

/* SELECT — strzałka rozwijania (jasny przycisk Luna z XP.css).
   !important + specyficzność, by pokonać regułę pól `.adm .field input/.adm-input` (też !important). */
.adm select, .adm .field select, .adm select.adm-input{
  -webkit-appearance:none !important; -moz-appearance:none !important; appearance:none !important;
  background:#10171f url(/assets/vendor/xpcss-icons/dropdown.svg) right center / auto 18px no-repeat !important;
  padding-right:22px !important; }

/* CHECKBOX / RADIO — białe pola XP z zielonym checkmarkiem / kropką.
   Wszystko !important + padding:0 — bo checkbox/radio łapią się też na `.adm .field input{…!important}`. */
.adm input[type=checkbox], .adm input[type=radio]{
  -webkit-appearance:none !important; appearance:none !important; width:16px !important; height:16px !important;
  padding:0 !important; flex:0 0 auto; cursor:pointer; vertical-align:-3px;
  background:#fdfefe !important; border:1px solid #45586a !important; box-shadow:inset 0 1px 2px rgba(0,0,0,.25) !important; }
.adm input[type=checkbox]{ border-radius:0 !important; }
.adm input[type=radio]{ border-radius:50% !important; }
.adm input[type=checkbox]:checked{ background:#fdfefe url(/assets/vendor/xpcss-icons/checkmark.svg) center / 12px no-repeat !important; }
.adm input[type=radio]:checked{ background:#fdfefe url(/assets/vendor/xpcss-icons/radio-dot.svg) center / 10px no-repeat !important; }
.adm input[type=checkbox]:focus-visible, .adm input[type=radio]:focus-visible{ outline:2px solid var(--xp-accent); outline-offset:1px; }

/* SCROLLBAR — delikatny, globalny w panelu (8px, bez strzałek) */
.adm ::-webkit-scrollbar, .ash-side::-webkit-scrollbar, .ash-main ::-webkit-scrollbar, .emodal ::-webkit-scrollbar{ width:8px !important; height:8px !important; }
.adm ::-webkit-scrollbar-track, .ash-side::-webkit-scrollbar-track, .ash-main ::-webkit-scrollbar-track, .emodal ::-webkit-scrollbar-track{ background:transparent !important; }
.adm ::-webkit-scrollbar-thumb, .ash-side::-webkit-scrollbar-thumb, .ash-main ::-webkit-scrollbar-thumb, .emodal ::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.2) !important; border:0 !important; border-radius:8px !important; }
.adm ::-webkit-scrollbar-thumb:hover, .ash-side::-webkit-scrollbar-thumb:hover, .ash-main ::-webkit-scrollbar-thumb:hover, .emodal ::-webkit-scrollbar-thumb:hover{ background:rgba(255,255,255,.34) !important; }
.adm ::-webkit-scrollbar-button, .ash-side::-webkit-scrollbar-button, .ash-main ::-webkit-scrollbar-button, .emodal ::-webkit-scrollbar-button{ display:none !important; width:0 !important; height:0 !important; background:none !important; }
.adm ::-webkit-scrollbar-corner, .ash-side::-webkit-scrollbar-corner, .ash-main ::-webkit-scrollbar-corner, .emodal ::-webkit-scrollbar-corner{ background:transparent !important; }

/* group-box <fieldset>/<legend> */
.adm fieldset{ border:1px solid rgba(255,255,255,.16); border-radius:6px; padding:10px 12px; }
.adm fieldset > legend{ color:var(--xp-accent-2); font-weight:700; padding:0 6px; }

/* ===== KPI / nagłówki paneli: glif sprite → KOLOROWA ikona XP (po id w <use>, CSS :has) ===== */
.adm .kpi__ic svg{ width:28px !important; height:28px !important; }
.adm .kpi__ic svg:has(use[href="#i-doc"]),      .adm .dash-panel__t svg:has(use[href="#i-doc"])      { color:transparent !important; background:url(/images/xp/dokumentacja.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-cog"]),      .adm .dash-panel__t svg:has(use[href="#i-cog"])      { color:transparent !important; background:url(/images/xp/ustawienia.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-clock"]),    .adm .dash-panel__t svg:has(use[href="#i-clock"])    { color:transparent !important; background:url(/images/xp/terminy.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-check"]),    .adm .dash-panel__t svg:has(use[href="#i-check"])    { color:transparent !important; background:url(/images/xp/zlecenia.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-building"]), .adm .dash-panel__t svg:has(use[href="#i-building"]) { color:transparent !important; background:url(/images/xp/firmy.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-headset"]),  .adm .dash-panel__t svg:has(use[href="#i-headset"])  { color:transparent !important; background:url(/images/xp/zlecenia.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-layers"]),   .adm .dash-panel__t svg:has(use[href="#i-layers"])   { color:transparent !important; background:url(/images/xp/projekty.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-car"]),      .adm .dash-panel__t svg:has(use[href="#i-car"])      { color:transparent !important; background:url(/images/xp/flota.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-shield"]),   .adm .dash-panel__t svg:has(use[href="#i-shield"])   { color:transparent !important; background:url(/images/xp/resurs.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-award"]),    .adm .dash-panel__t svg:has(use[href="#i-award"])    { color:transparent !important; background:url(/images/xp/realizacje.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-send"]),     .adm .dash-panel__t svg:has(use[href="#i-send"])     { color:transparent !important; background:url(/images/xp/faktury.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-spark"]),    .adm .dash-panel__t svg:has(use[href="#i-spark"])    { color:transparent !important; background:url(/images/xp/generuj.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-calendar"]), .adm .dash-panel__t svg:has(use[href="#i-calendar"]) { color:transparent !important; background:url(/images/xp/kalendarz.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-cpu"]),      .adm .dash-panel__t svg:has(use[href="#i-cpu"])      { color:transparent !important; background:url(/images/xp/urzadzenia.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-mail"]),     .adm .dash-panel__t svg:has(use[href="#i-mail"])     { color:transparent !important; background:url(/images/xp/zapytania.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-grid"]),     .adm .dash-panel__t svg:has(use[href="#i-grid"])     { color:transparent !important; background:url(/images/xp/pulpit.png) center/contain no-repeat !important; }
.adm .kpi__ic svg:has(use[href="#i-users"]),    .adm .dash-panel__t svg:has(use[href="#i-users"])    { color:transparent !important; background:url(/images/xp/firmy.png) center/contain no-repeat !important; }

/* Karty kafelków (Ustawienia / huby) — czyste kolorowe ikony XP (PNG) zamiast glifu w tle-kafelku */
.adm .adm-card__ic svg:has(use[href="#i-users"]),
.adm .adm-card__ic svg:has(use[href="#i-mail"]),
.adm .adm-card__ic svg:has(use[href="#i-cpu"]),
.adm .adm-card__ic svg:has(use[href="#i-layers"]),
.adm .adm-card__ic svg:has(use[href="#i-calendar"]),
.adm .adm-card__ic svg:has(use[href="#i-cog"]),
.adm .adm-card__ic svg:has(use[href="#i-send"]),
.adm .adm-card__ic svg:has(use[href="#i-building"]),
.adm .adm-card__ic svg:has(use[href="#i-doc"]),
.adm .adm-card__ic svg:has(use[href="#i-clock"]){
  color:transparent !important; box-shadow:none !important; padding:0 !important;
  width:36px !important; height:36px !important;
  background-repeat:no-repeat !important; background-position:center !important; background-size:contain !important;
}
.adm .adm-card__ic svg:has(use[href="#i-users"])   { background-image:url(/images/xp/firmy.png) !important; }
.adm .adm-card__ic svg:has(use[href="#i-mail"])    { background-image:url(/images/xp/zapytania.png) !important; }
.adm .adm-card__ic svg:has(use[href="#i-cpu"])     { background-image:url(/images/xp/urzadzenia.png) !important; }
.adm .adm-card__ic svg:has(use[href="#i-layers"])  { background-image:url(/images/xp/projekty.png) !important; }
.adm .adm-card__ic svg:has(use[href="#i-calendar"]){ background-image:url(/images/xp/kalendarz.png) !important; }
.adm .adm-card__ic svg:has(use[href="#i-cog"])     { background-image:url(/images/xp/ustawienia.png) !important; }
.adm .adm-card__ic svg:has(use[href="#i-send"])    { background-image:url(/images/xp/faktury.png) !important; }
.adm .adm-card__ic svg:has(use[href="#i-building"]){ background-image:url(/images/xp/firmy.png) !important; }
.adm .adm-card__ic svg:has(use[href="#i-doc"])     { background-image:url(/images/xp/dokumentacja.png) !important; }
.adm .adm-card__ic svg:has(use[href="#i-clock"])   { background-image:url(/images/xp/terminy.png) !important; }

/* Zakładki modułu Faktury (pasek FakturyTabs) — kolorowe ikony XP zamiast płaskich glifów sprite */
.adm .fk-tab svg{ width:18px !important; height:18px !important; stroke:none !important; fill:none !important; }
.adm .fk-tab svg:has(use[href="#i-layers"]),
.adm .fk-tab svg:has(use[href="#i-award"]),
.adm .fk-tab svg:has(use[href="#i-building"]),
.adm .fk-tab svg:has(use[href="#i-cpu"]),
.adm .fk-tab svg:has(use[href="#i-clock"]),
.adm .fk-tab svg:has(use[href="#i-send"]),
.adm .fk-tab svg:has(use[href="#i-cog"]){
  color:transparent !important;
  background-repeat:no-repeat !important; background-position:center !important; background-size:contain !important;
}
.adm .fk-tab svg:has(use[href="#i-layers"])  { background-image:url(/images/xp/faktury.png) !important; }      /* Sprzedaż */
.adm .fk-tab svg:has(use[href="#i-award"])   { background-image:url(/images/xp/zamowienia.png) !important; }   /* Zamówienia sprzedaży */
.adm .fk-tab svg:has(use[href="#i-building"]){ background-image:url(/images/xp/firmy.png) !important; }         /* Zakupy KSeF */
.adm .fk-tab svg:has(use[href="#i-cpu"])     { background-image:url(/images/xp/dokumentacja.png) !important; }  /* Towary i usługi */
.adm .fk-tab svg:has(use[href="#i-clock"])   { background-image:url(/images/xp/terminy.png) !important; }       /* Cykliczne */
.adm .fk-tab svg:has(use[href="#i-send"])    { background-image:url(/images/xp/generuj.png) !important; }       /* KSeF */
.adm .fk-tab svg:has(use[href="#i-cog"])     { background-image:url(/images/xp/ustawienia.png) !important; }    /* Ustawienia */

/* ---------------------------------------------------------------------------
   16) OKNO POTWIERDZENIA (.cfm) — okno dialogowe XP (belka tytułu + czerwony X).
        Modal jest montowany w <body> (poza .adm), więc tokeny --xp-* tu nie sięgają
        → kolory wpisane wprost. Zakres globalny, ale okna potwierdzenia pojawiają się
        tylko w panelu (strona publiczna nie używa data-confirm/msdlConfirm).
   --------------------------------------------------------------------------- */
.cfm-card{
  background:#161d27 !important; border:1px solid #0a0d13 !important; border-radius:8px !important;
  box-shadow:0 14px 40px -16px rgba(0,0,0,.78) !important;
  font-family:'Tahoma','Segoe UI','Trebuchet MS',system-ui,Arial,sans-serif !important;
}
.cfm-card::before{ display:none !important; }                /* kasacja neonowego paska */
.cfm-card__bar{
  background:linear-gradient(180deg,#2c3540 0%,#222a34 55%,#1a212b 100%) !important;
  border-bottom:1px solid #0a0d13 !important; padding:7px 10px !important;
}
.cfm-card__bartitle{ color:#eef6f8 !important; font-size:.92rem !important; }
.cfm-card__x{
  background:url(/assets/vendor/xpcss-icons/close.svg) center / 21px no-repeat !important;
  border:0 !important; width:23px !important; height:22px !important; color:transparent !important;
}
.cfm-card__x::before{ content:"" !important; }              /* zdejmij fallbackowy ✕ */
.cfm-card__x:hover{ filter:brightness(1.06); }
.cfm-card__body{ padding:18px 18px 8px !important; }
.cfm-card__icon{
  background:linear-gradient(180deg,#23303a,#1a242d) !important; border:1px solid #0a0d13 !important;
  color:#67d2dc !important; border-radius:6px !important;
}
.cfm-card__msg{ color:#c2ccd2 !important; }
.cfm-card__foot{ padding:13px 18px 15px !important; border-top:1px solid rgba(255,255,255,.05); background:#141a23; }
/* przyciski okna dialogowego = płaskie Luna (bez aurory neonowej z .btn--primary) */
.cfm-card__foot .btn{ border-radius:6px !important; box-shadow:none !important; }
.cfm-card__foot .btn::after{ content:none !important; }
.cfm-card__foot .btn--primary{
  background:#e9edf0 !important; background-image:none !important; color:#11161c !important; border:1px solid #b9c2cb !important;
}
.cfm-card__foot .btn--primary:hover{ filter:brightness(1.04); }
.cfm-card__foot .btn--ghost{
  background:#1a212c !important; background-image:none !important; color:#dfe7ec !important; border:1px solid rgba(255,255,255,.18) !important;
}

/* =====================================================================
   17) KWADRATOWE ROGI PANELU — BEZ zaokrągleń (na życzenie użytkownika).
        JEDEN blok na końcu pliku → ładuje się ostatni, więc tymi samymi
        selektorami + !important nadpisuje wcześniejsze promienie. Zawężone do
        .adm/.ash (+ okna .cfm/.emodal/.ctxmenu montowane w body, używane tylko
        w panelu) → STRONA PUBLICZNA I LOGO NIETKNIĘTE. Okrągłe wskaźniki
        (kropki statusu, radio, „dziś", przełączniki, paski postępu)
        celowo POMINIĘTE. Skala: WSZYSTKO 0 (2026-06-10; wcześniej 4px/3px).
        WYCOFANIE = usuń tę sekcję (reszta motywu bez zmian).
   ===================================================================== */
/* skala promieni panelu (komponenty oparte na var(--radius*)) */
.adm, .ash{ --radius:0 !important; --radius-lg:0 !important; }

/* — okna / karty / panele / modale / tabele / akordeony / paski → 0 — */
.adm .adm__head{ border-radius:0 !important; }
.adm .kpi, .adm .al-card, .adm .dash-panel, .adm .adm-card, .adm .fk-grid-wrap,
.adm .fk-totals, .adm .fk-filterbar, .adm .adm-table, .adm .adm-spec, .adm .adm-acc,
.adm .adm-file, .adm .adm-photo, .adm .fk-chart, .adm .fk-preview, .adm .fk-modal__panel,
.adm .of-tpl-card, .adm .of-menu, .adm .combo__list, .adm .rowkebab__menu, .adm .pm-data,
.adm .lockbar, .adm .arf-bar, .adm .upz, .adm .upmodal__card, .adm .kal-grid, .adm .kalt,
.adm .kalw, .adm .kal-modal__card, .adm .kal-sub, .adm .adm-msg, .adm .adm-ok,
.adm .pm-valid, .adm .validation-errors, .adm .xpwin, .adm fieldset,
.ash .ash-card, .ash-card, .emodal__win, .cfm-card{ border-radius:0 !important; }

/* — kontrolki / przyciski / pola / zakładki / chipy / odznaki / ikony-kafelki → 0 — */
.adm .btn, .ash .btn, .adm .btn--sm, .adm .btn--lg,
.adm .field input, .adm .field select, .adm .field textarea, .adm .adm-input, .adm select,
.adm .of-in, .adm .fk-filterbar__search, .adm .combo input, .adm .picker__btn, .adm .picker__clear,
.adm .combo__item, .adm .of-kebab, .adm .of-menu button, .adm .utab, .adm .fk-ptab, .adm .fk-tab,
.adm .fk-kitem, .adm .fk-konta__del, .adm .rowkebab>summary, .adm .rowkebab__del,
.adm .adm-move, .adm .adm-thumb, .adm .adm-file__thumb, .adm .adm-file__ic, .adm .adm-photo__del,
.adm .adm-filter input, .adm .pm-add input, .adm .pm-date, .adm .pm-search input,
.adm .pm-matrix input, .adm .fk-rok, .adm .fk-ico, .adm .fk-ks, .adm .fk-kat-sel,
.adm .pager a, .adm .pager>span, .adm .kal-navbtn, .adm .kal-today, .adm .kal-vbtn,
.adm .kal-views-sw, .adm .kal-sub__url, .adm .kal-cell__add, .adm .kal-chip,
.adm .adm-badge, .adm .fk-kgroup, .adm .tu-grupa, .adm .upz__file, .adm .lockbar__take,
.adm .kalt-sel, .adm .ctxmenu__item, .ctxmenu, .adm .form-sec, .adm fieldset > legend,
.adm .kpi__ic svg, .adm .adm-card__ic svg, .adm .dash-panel__t svg, .adm .xpwin__btn,
.ash-brand, .ash-top__www, .ash-top__logout, .xp-tray, .xp-userhead__pic,
.ash .ash-link, .adm .ash-link, .ash .ash-burger, .adm .ash-burger,
.cfm-card__icon, .cfm-card__foot .btn, .cfm-card__x, .emodal__x{ border-radius:0 !important; }

/* Okna modalne montowane też POZA .adm (Picker/Katalog/szablon oferty/upload/kalendarz)
   — kwadratowo niezależnie od zagnieżdżenia w DOM. */
.fk-modal__panel, .kal-modal__card, .of-tpl-card, .upmodal__card{ border-radius:0 !important; }
.fk-kitem, .fk-modal__filters .adm-input, .fk-modal__q{ border-radius:0 !important; }

/* =====================================================================
   18) WSPÓLNY STYL OKIEN DIALOGOWYCH — fk-modal (zdarzenie/kontakt/picker/
        katalog/towar), kal-modal (kalendarz), of-tpl (szablon oferty PDF),
        upmodal (postęp wgrywania): okno XP = belka tytułu + CZERWONY X
        + płaskie pola i przyciski Luna (bez neonowej aurory).
        Modale bywają montowane POZA .adm (koniec strony/body) → selektory
        BEZ prefiksu .adm; klasy używane WYŁĄCZNIE w panelu, więc strona
        publiczna NIETKNIĘTA. Kolory wpisane wprost (tokeny --xp-* są
        zawężone do .adm/.ash — jak w sekcji 16 dla .cfm).
   ===================================================================== */
.fk-modal__panel, .kal-modal__card, .of-tpl-card, .upmodal__card{
  background:#161d27 !important; border:1px solid #0a0d13 !important;
  box-shadow:0 14px 40px -16px rgba(0,0,0,.78) !important;
  font-family:'Tahoma','Segoe UI','Trebuchet MS',system-ui,Arial,sans-serif !important;
}
.fk-modal__head, .kal-modal__head{
  background:linear-gradient(180deg,#2c3540 0%,#222a34 55%,#1a212b 100%) !important;
  border-bottom:1px solid #0a0d13 !important; padding:8px 12px !important;
}
.fk-modal__title, .kal-modal__title{ color:#eef6f8 !important; font-size:.95rem !important; }
/* CZERWONY przycisk zamknięcia XP — jak .emodal__x / .cfm-card__x */
.fk-modal__close, .kal-modal__close{
  background:url(/assets/vendor/xpcss-icons/close.svg) center / 21px no-repeat !important;
  border:0 !important; width:23px !important; height:22px !important;
  color:transparent !important; font-size:0 !important; padding:0 !important; flex:0 0 auto;
}
.fk-modal__close:hover, .kal-modal__close:hover{ filter:brightness(1.06); }
.fk-modal__foot{ background:#141a23 !important; border-top:1px solid rgba(255,255,255,.05) !important; }
/* pola w oknach: płaskie XP (jak .adm .field input) — działa też poza .adm */
.fk-modal input:not([type=checkbox]):not([type=radio]), .fk-modal textarea, .fk-modal select,
.kal-modal input:not([type=checkbox]):not([type=radio]), .kal-modal textarea, .kal-modal select{
  background:#10171f !important; border:1px solid rgba(255,255,255,.24) !important; border-radius:0 !important;
  color:#eef2f4 !important; box-shadow:inset 0 1px 2px rgba(0,0,0,.5) !important;
}
.fk-modal input:focus, .fk-modal textarea:focus, .fk-modal select:focus,
.kal-modal input:focus, .kal-modal textarea:focus, .kal-modal select:focus{
  border-color:#3bbfcb !important; background:#0c131b !important; outline:none !important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.5), 0 0 0 2px rgba(59,191,203,.35) !important;
}
.fk-modal select, .kal-modal select{
  -webkit-appearance:none !important; -moz-appearance:none !important; appearance:none !important;
  background:#10171f url(/assets/vendor/xpcss-icons/dropdown.svg) right center / auto 18px no-repeat !important;
  padding-right:22px !important; color-scheme:dark;
}
.fk-modal .field label, .kal-modal .field label{ color:#aebbc4 !important; }
/* przyciski okien = płaski Luna (zdejmij neonową aurorę publicznych .btn) */
.fk-modal .btn::after, .kal-modal .btn::after, .of-tpl-card .btn::after{ content:none !important; }
.fk-modal .btn, .kal-modal .btn, .of-tpl-card .btn{
  border:1px solid #0a0d13 !important; border-radius:0 !important; color:#e0e7ed !important;
  background:linear-gradient(180deg,#2c343f 0%,#232b34 52%,#1d242d 100%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07) !important;
}
.fk-modal .btn--primary, .kal-modal .btn--primary, .of-tpl-card .btn--primary{
  background:linear-gradient(180deg,#34b4c0 0%,#279fab 52%,#1f8e9a 100%) !important;
  border-color:#136b75 !important; color:#04232a !important;
}
.fk-modal .btn--danger, .kal-modal .btn--danger{
  background:linear-gradient(180deg,#b9534c 0%,#a3433c 100%) !important;
  border-color:#7a312c !important; color:#fff !important;
}
.fk-modal .btn--ghost, .kal-modal .btn--ghost, .of-tpl-card .btn--ghost{
  background:#1c232c !important; color:#bcc8d2 !important;
}
/* of-tpl: belka tytułu reużywa klas fk-modal__head/__close — karta bez własnego paddingu,
   treść (linki szablonów) w .of-tpl-body */
.of-tpl-card{ padding:0 !important; gap:0 !important; }
.of-tpl-card .of-tpl-body{ padding:16px 18px; }
