/* enw-glass.css v20261106b (b: otwarte menu nad dymkiem czatu). Szklo na menu strony enowork.com (Etap 7, czesc 0, 06.11.2026).
   Dolaczany w <head> stron z naglowkiem header.navbar (index.html = /, /da/, /en/; workplace.php; employees.php;
   kalkulator/render_v2.php; demo; szablony; strony prawne). Panel /main/ go NIE laduje.
   Zasada: wszystkie selektory zaczynaja sie od header.navbar, wiec nic poza paskiem menu sie nie zmienia.
   Szklo rysuje pseudo-element ::before, a nie sam <header>: backdrop-filter na <header> robilby z niego
   blok zawierajacy dla position:fixed (panel menu na telefonie) i "korzen tla" dla szkla panelu. */

/* 1. Pasek: od poczatku fixed (dzis absolute do 100 px, potem sticky-navbar). Naglowek i tak jest poza
      przeplywem dokumentu, wiec tresc sie nie przesuwa. Jedna wysokosc w obu stanach. */
header.navbar{
  position:fixed!important;top:0;left:0;width:100%;
  background:transparent!important;background-color:transparent!important;
  border-bottom:0!important;box-shadow:none!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  /* .sticky-navbar w style.css siedzi w @layer utilities, a !important z warstwy wygrywa z !important spoza
     warstw. Dlatego jego ramke i rozmycie gasze zmiennymi (zwykle deklaracje spoza warstwy wygrywaja):
     bez ramki pasek nie rosnie o 1 px, a bez rozmycia na <header> dziala szklo ::before i panelu menu. */
  --tw-border-style:none;--tw-backdrop-blur:initial;
}
/* kotwice (#features itd.): pasek ma stale 80 px zamiast 66 px po przewinieciu, wiec 16 px zapasu */
html{scroll-padding-top:16px}
header.navbar::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:rgba(255,255,255,.58);
  -webkit-backdrop-filter:blur(18px) saturate(170%);backdrop-filter:blur(18px) saturate(170%);
  border-bottom:1px solid rgba(255,255,255,.75);
  box-shadow:0 12px 32px -14px rgba(38,33,92,.22),inset 0 -1px 0 rgba(122,90,248,.10);
  opacity:0;transition:opacity .35s ease;
}
header.navbar.is-glass::before{opacity:1}
/* style.css: .sticky-navbar zmniejsza linki z 28 do 21 px; trzymamy 28 px, zeby pasek nie skakal */
@media (min-width:992px){
  header.navbar.sticky-navbar ul > .menu-item > a{padding-block:28px!important}
}

/* 2. Pastylki: jezyk, Zaloguj sie, Rejestracja */
header.navbar .lang-btn{
  border-radius:999px!important;padding:9px 15px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.5))!important;
  border:1px solid rgba(255,255,255,.95)!important;
  box-shadow:inset 0 1px 0 #fff,0 8px 20px -10px rgba(122,90,248,.45)!important;
  color:#26215C!important;font-weight:500;
  transition:box-shadow .2s ease,border-color .2s ease!important;
}
header.navbar .lang-btn:hover,header.navbar .lang-dropdown.open .lang-btn{
  border-color:rgba(122,90,248,.35)!important;
  box-shadow:inset 0 1px 0 #fff,0 10px 22px -10px rgba(122,90,248,.6)!important;
}
header.navbar .lang-menu{border-radius:14px!important;box-shadow:0 18px 40px -16px rgba(38,33,92,.35)!important}
header.navbar a.sm\:inline-block[href*="signin"]{
  border-radius:999px!important;padding:9px 20px!important;margin-right:10px;line-height:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.5))!important;
  border:1px solid rgba(255,255,255,.95)!important;
  box-shadow:inset 0 1px 0 #fff,0 8px 20px -10px rgba(122,90,248,.45)!important;
  color:#26215C!important;
  transition:box-shadow .2s ease,border-color .2s ease,color .2s ease!important;
}
header.navbar a.sm\:inline-block[href*="signin"]:hover{
  color:#7A5AF8!important;border-color:rgba(122,90,248,.35)!important;
  box-shadow:inset 0 1px 0 #fff,0 10px 22px -10px rgba(122,90,248,.6)!important;
}
header.navbar a.sm\:inline-block[href*="signup"]{
  border-radius:999px!important;padding:10px 24px!important;line-height:24px;
  background:linear-gradient(180deg,#8D70FF 0%,#7A5AF8 52%,#6C4CF0 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 22px -10px rgba(122,90,248,.85)!important;
  color:#fff!important;border:0!important;
  transition:box-shadow .2s ease,background-position .2s ease!important;
}
header.navbar a.sm\:inline-block[href*="signup"]:hover{
  background:linear-gradient(180deg,#9479FF 0%,#7F60FA 52%,#6A49EC 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 12px 26px -10px rgba(122,90,248,.95)!important;
}

/* 3. Komputer: linki menu, po najechaniu delikatna pastylka (pseudo-element, wiec uklad bez zmian) */
@media (min-width:992px){
  header.navbar .menu-wrapper nav > ul > li > a{position:relative;z-index:0}
  header.navbar .menu-wrapper nav > ul > li > a::before{
    content:"";position:absolute;left:-12px;right:-12px;top:50%;height:38px;margin-top:-19px;
    border-radius:999px;background:rgba(122,90,248,0);z-index:-1;pointer-events:none;
    transition:background-color .2s ease;
  }
  header.navbar .menu-wrapper nav > ul > li > a:hover::before,
  header.navbar .menu-wrapper nav > ul > li > a:focus-visible::before,
  header.navbar .menu-wrapper nav > ul > li.group:hover > a::before{background:rgba(122,90,248,.08)}
  header.navbar .enw-mnav-logo,header.navbar .enw-ml-new,header.navbar .enw-ml-list{display:none!important}
}

/* 4. Telefon i tablet (< 992 px): burger jako okragla pastylka, panel menu ze szkla */
@media (max-width:991.98px){
  /* otwarte menu nad dymkiem czatu (z-index 9996-9998), ale pod banerem zgod cookies (2147483000) */
  header.navbar.enw-menu-open{z-index:10000!important}
  header.navbar .navbarOpen{
    width:44px!important;height:44px!important;border-radius:999px;
    background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.5));
    border:1px solid rgba(255,255,255,.95);
    box-shadow:inset 0 1px 0 #fff,0 8px 20px -10px rgba(122,90,248,.45);
  }
  header.navbar .navbarOpen > span{width:20px!important;border-radius:2px;background:#26215C!important}
  header.navbar .navbarClose{
    top:var(--enw-x-top,19px)!important;right:var(--enw-x-right,16px)!important;
    width:44px!important;height:44px!important;border-radius:999px;
    background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.62));
    border:1px solid rgba(255,255,255,.95);
    box-shadow:inset 0 1px 0 #fff,0 8px 20px -10px rgba(122,90,248,.45);
  }
  header.navbar .navbarClose > span{width:20px!important;border-radius:2px;background:#26215C!important}
  /* przy otwartym menu chowam elementy paska pod panelem (panel ma wlasne logo i X w tym samym miejscu) */
  header.navbar.enw-menu-open .navbarOpen,
  header.navbar.enw-menu-open .lang-dropdown,
  header.navbar.enw-menu-open a.sm\:inline-block,
  header.navbar.enw-menu-open > .container > div > div:first-child{visibility:hidden}

  header.navbar .menu-wrapper nav{
    display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:12px;row-gap:0;
    align-content:start!important;align-items:stretch!important;justify-content:stretch!important;
    text-align:left!important;height:100vh!important;height:100dvh!important;
    padding:calc(var(--enw-bar-h,82px) + 10px) 20px 28px!important;
    overflow-y:auto!important;overscroll-behavior:contain;
    background:radial-gradient(130% 60% at 100% 0%,rgba(122,90,248,.12),rgba(122,90,248,0) 60%),rgba(255,255,255,.72)!important;
    -webkit-backdrop-filter:blur(18px) saturate(170%)!important;backdrop-filter:blur(18px) saturate(170%)!important;
  }
  header.navbar .menu-wrapper nav .mnav-logo{
    display:block!important;position:absolute!important;z-index:2;
    top:var(--enw-logo-top,16px)!important;left:var(--enw-logo-left,16px)!important;
  }
  header.navbar .menu-wrapper nav .mnav-logo img{height:var(--enw-logo-h,50px)!important;width:auto!important;max-width:none}
  /* lista: wszystkie linki to elementy jednej siatki (ul/li bez wlasnego pudelka) */
  header.navbar .menu-wrapper nav > ul{display:contents!important}
  header.navbar .menu-wrapper nav > ul > li{grid-column:1 / -1;margin:0!important;width:auto!important;order:1}
  header.navbar .menu-wrapper nav > ul > li.submenu-item{display:contents!important}
  header.navbar .menu-wrapper nav > ul > li.submenu-item > a.submenu-taggler{display:none!important}
  header.navbar .menu-wrapper nav .submenu{display:contents!important}
  header.navbar .menu-wrapper nav .submenu > li{display:contents!important}
  header.navbar .menu-wrapper nav > ul > li.menu-item > a,
  header.navbar .menu-wrapper nav .submenu > li > a{
    grid-column:1 / -1;order:2;
    display:flex!important;justify-content:flex-start!important;align-items:center;width:100%;
    font-size:20px!important;font-weight:600!important;line-height:1.25!important;color:#26215C!important;
    padding:15px 4px!important;margin:0!important;text-align:left!important;
    background:transparent!important;border:0!important;border-bottom:1px solid rgba(38,33,92,.10)!important;
    border-radius:0!important;box-shadow:none!important;
  }
  header.navbar .menu-wrapper nav > ul > li.menu-item > a{order:1}
  header.navbar .menu-wrapper nav > ul > li.menu-item > a:hover,
  header.navbar .menu-wrapper nav .submenu > li > a:hover,
  header.navbar .menu-wrapper nav > ul > li.menu-item > a.wpg-nav-on{color:#7A5AF8!important}
  /* dol panelu: [jezyk] [Zaloguj sie], pod spodem Rejestracja na cala szerokosc */
  header.navbar .menu-wrapper nav .submenu > li:nth-child(1) > a,
  header.navbar .menu-wrapper nav > .mnav-lang{
    grid-column:auto;order:30;margin-top:22px!important;
  }
  header.navbar .menu-wrapper nav .submenu > li:nth-child(1) > a,
  header.navbar .menu-wrapper nav .enw-ml-cur{
    display:flex!important;align-items:center;justify-content:center!important;gap:8px;
    min-height:52px;padding:12px 14px!important;border-radius:999px!important;
    font-size:16px!important;font-weight:600!important;color:#26215C!important;text-align:center!important;
    background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.6))!important;
    border:1px solid rgba(255,255,255,.95)!important;
    box-shadow:inset 0 1px 0 #fff,0 8px 20px -10px rgba(122,90,248,.45)!important;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  header.navbar .menu-wrapper nav .submenu > li:nth-child(1) > a{order:31}
  header.navbar .menu-wrapper nav .submenu > li:nth-child(2) > a{
    grid-column:1 / -1;order:33;margin-top:12px!important;
    display:flex!important;align-items:center;justify-content:center!important;
    min-height:54px;padding:14px 20px!important;border-radius:999px!important;border:0!important;
    font-size:17px!important;font-weight:700!important;color:#fff!important;text-align:center!important;
    background:linear-gradient(180deg,#8D70FF 0%,#7A5AF8 52%,#6C4CF0 100%)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 22px -10px rgba(122,90,248,.85)!important;
  }
  header.navbar .menu-wrapper nav .submenu > li:nth-child(2) > a:hover{
    color:#fff!important;background:linear-gradient(180deg,#9479FF 0%,#7F60FA 52%,#6A49EC 100%)!important;
  }
  /* wybor jezyka w panelu: jedna pastylka z aktualnym jezykiem; po kliknieciu lista jak w przycisku na pasku */
  header.navbar .menu-wrapper nav > .mnav-lang{
    display:flex!important;align-items:stretch;gap:8px;padding:0!important;border:0!important;min-width:0;
  }
  header.navbar .menu-wrapper nav > .mnav-lang > *{flex:1 1 0;min-width:0}
  header.navbar.enw-ml-ready .menu-wrapper nav > .mnav-lang > :not(.enw-ml-cur){display:none!important}
  header.navbar .menu-wrapper nav .enw-ml-cur{width:100%;cursor:pointer}
  header.navbar .menu-wrapper nav .enw-ml-cur .fi{font-size:17px;border-radius:3px;flex:0 0 auto}
  header.navbar .menu-wrapper nav .enw-ml-cur svg{flex:0 0 auto;transition:transform .2s ease}
  header.navbar .menu-wrapper nav .mnav-lang.is-open .enw-ml-cur svg{transform:rotate(180deg)}
  header.navbar .menu-wrapper nav .enw-ml-list{
    grid-column:1 / -1;order:32;display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;
    padding:10px;border-radius:22px;
    background:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.9);
    box-shadow:0 12px 28px -16px rgba(38,33,92,.3);
  }
  header.navbar .menu-wrapper nav .enw-ml-list[hidden]{display:none!important}
  header.navbar .menu-wrapper nav .enw-ml-opt{
    display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:999px;
    font-size:15px;font-weight:500;color:#26215C;background:rgba(255,255,255,.85);
    border:1px solid rgba(38,33,92,.08);cursor:pointer;text-decoration:none;line-height:1.2;
  }
  header.navbar .menu-wrapper nav .enw-ml-opt.is-on{background:#EDE9FE;border-color:rgba(122,90,248,.35);font-weight:600}
  header.navbar .menu-wrapper nav .enw-ml-opt .fi{font-size:16px;border-radius:2px}
}

/* 5. Tryb ciemny (wlaczany klasa .dark z bundle-lite) */
.dark header.navbar::before{background:rgba(17,19,34,.62);border-bottom-color:rgba(255,255,255,.08);box-shadow:0 12px 32px -14px rgba(0,0,0,.5)}
.dark header.navbar .lang-btn,.dark header.navbar a.sm\:inline-block[href*="signin"]{
  background:linear-gradient(180deg,rgba(42,46,68,.92),rgba(42,46,68,.6))!important;
  border-color:rgba(255,255,255,.12)!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
}
@media (max-width:991.98px){
  .dark header.navbar .navbarOpen,.dark header.navbar .navbarClose{background:rgba(42,46,68,.9);border-color:rgba(255,255,255,.12);box-shadow:none}
  .dark header.navbar .navbarOpen > span,.dark header.navbar .navbarClose > span{background:#fff!important}
  .dark header.navbar .menu-wrapper nav{background:rgba(17,19,34,.82)!important}
  .dark header.navbar .menu-wrapper nav > ul > li.menu-item > a,
  .dark header.navbar .menu-wrapper nav .submenu > li > a{color:#e8e8f2!important;border-bottom-color:rgba(255,255,255,.12)!important}
  .dark header.navbar .menu-wrapper nav .submenu > li:nth-child(1) > a,
  .dark header.navbar .menu-wrapper nav .enw-ml-cur,
  .dark header.navbar .menu-wrapper nav .enw-ml-opt{background:rgba(42,46,68,.9)!important;border-color:rgba(255,255,255,.12)!important;color:#fff!important;box-shadow:none!important}
  .dark header.navbar .menu-wrapper nav .enw-ml-list{background:rgba(42,46,68,.6);border-color:rgba(255,255,255,.1)}
}

/* 6. Zapasy */
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  header.navbar::before{background:rgba(255,255,255,.95)}
  header.navbar .menu-wrapper nav{background:rgba(255,255,255,.97)!important}
  .dark header.navbar::before{background:rgba(17,19,34,.96)}
  .dark header.navbar .menu-wrapper nav{background:rgba(17,19,34,.98)!important}
}
@media (prefers-reduced-transparency:reduce){
  header.navbar::before{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;opacity:1;border-bottom-color:transparent;box-shadow:none}
  header.navbar.is-glass::before{border-bottom-color:rgba(38,33,92,.08);box-shadow:0 12px 32px -14px rgba(38,33,92,.22)}
  header.navbar .menu-wrapper nav{background:#fff!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  .dark header.navbar::before{background:#111322}
  .dark header.navbar .menu-wrapper nav{background:#111322!important}
}
@media (prefers-reduced-motion:reduce){
  header.navbar::before,header.navbar .lang-btn,header.navbar a.sm\:inline-block,
  header.navbar .menu-wrapper nav > ul > li > a::before,header.navbar .enw-ml-cur svg{transition:none!important}
}
