/*
  Stały znak serwisu PEREKO.
  Ten komponent jest wspólny dla strony logowania i wszystkich podstron.
  Nie należy nadpisywać jego wymiarów, kolorów ani odstępów lokalnie.
*/
/* Pasek przewijania przeglądarki jest ukryty wizualnie na wszystkich
   podstronach korzystających ze wspólnej belki. Przewijanie pozostaje aktywne. */
html,body{
  scrollbar-width:none;
  -ms-overflow-style:none;
}
html::-webkit-scrollbar,
body::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}

.login-brand{
  width:min(1120px,100%);
  display:flex;
  align-items:center;
  gap:15px;
  flex:0 0 auto;
  margin:0 auto;
  color:#fff;
  font-family:Inter,"Segoe UI",Arial,sans-serif;
}

/* Stała belka aplikacji, nadrzędna wobec lokalnych stylów stron. */
.topbar,
.pcat-topbar{
  width:100%!important;
  height:104px!important;
  min-height:104px!important;
  max-height:104px!important;
  padding:0!important;
  margin:0!important;
  border-bottom:1px solid rgba(255,255,255,.09)!important;
  background:radial-gradient(circle at 82% 14%,rgba(255,200,0,.11) 0,transparent 28%),linear-gradient(135deg,#151b1e,#263035 58%,#303b40)!important;
  overflow-x:hidden!important;
}

.topbar>.topbar-inner,
.pcat-topbar>.pcat-topbar-inner{
  width:min(1120px,calc(100% - 48px))!important;
  height:104px!important;
  min-height:104px!important;
  margin-left:max(24px,calc((100% - 1120px)/2))!important;
  margin-right:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  position:relative!important;
}

.login-brand__mark{
  width:42px!important;
  height:42px!important;
  display:grid;
  place-items:center;
  flex:0 0 42px!important;
  padding:0;
  border:0;
  border-radius:12px!important;
  color:#141a1d!important;
  background:#ffc800!important;
  box-shadow:0 12px 30px rgba(0,0,0,.22);
  font-size:22px!important;
  font-weight:900!important;
  line-height:1!important;
  letter-spacing:-.055em!important;
}

.login-brand__copy{
  min-height:34px!important;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-left:15px!important;
  border-left:1px solid rgba(255,255,255,.2)!important;
}

.login-brand__copy b{
  color:#fff!important;
  font-size:14px!important;
  font-weight:700!important;
  line-height:normal!important;
  letter-spacing:-.01em!important;
}

.login-brand__copy small{
  display:block!important;
  margin-top:3px!important;
  color:#b9c2c6!important;
  font-size:10px!important;
  font-weight:400!important;
  line-height:normal!important;
}

/* Wspólna prawa część każdej belki aplikacji. */
.top-actions,
.pcat-actions{
  position:absolute!important;
  top:50%!important;
  right:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:9px!important;
  transform:translateY(-50%)!important;
  margin:0!important;
}

.header-pill,.page-label,.pcat-pill,.offer-topbar-pill,.calc-topbar-pill,.contact-topbar-pill,.order-topbar-pill,
.logout,.back-link,.pcat-back,.offer-topbar-back,.calc-topbar-back,.contact-topbar-back,.order-topbar-back{
  height:40px!important;
  min-height:40px!important;
  box-sizing:border-box!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  margin:0!important;
  padding:0 13px!important;
  border-radius:11px!important;
  font-family:Inter,"Segoe UI",Arial,sans-serif!important;
  font-size:11px!important;
  font-weight:800!important;
  line-height:1!important;
  letter-spacing:.025em!important;
  white-space:nowrap!important;
  text-decoration:none!important;
}

/* Spójne zachowanie wspólnej belki na tabletach i telefonach. */
@media(max-width:860px){
  .topbar,.pcat-topbar{
    height:88px!important;
    min-height:88px!important;
    max-height:88px!important;
  }
  .topbar>.topbar-inner,.pcat-topbar>.pcat-topbar-inner{
    width:auto!important;
    height:88px!important;
    min-height:88px!important;
    margin-left:16px!important;
    margin-right:16px!important;
  }
  .login-brand{width:auto;min-width:0;margin:0!important;gap:12px}
  .top-actions,.pcat-actions{gap:6px!important}
  .header-pill,.page-label,.pcat-pill,.offer-topbar-pill,.calc-topbar-pill,.contact-topbar-pill,.order-topbar-pill{display:none!important}
}

@media(max-width:560px){
  .topbar,.pcat-topbar{
    height:78px!important;
    min-height:78px!important;
    max-height:78px!important;
  }
  .topbar>.topbar-inner,.pcat-topbar>.pcat-topbar-inner{
    width:auto!important;
    height:78px!important;
    min-height:78px!important;
    margin-left:12px!important;
    margin-right:12px!important;
  }
  .login-brand{gap:9px}
  .login-brand__mark{width:38px!important;height:38px!important;flex-basis:38px!important;border-radius:11px!important;font-size:20px!important}
  .login-brand__copy{min-height:30px!important;padding-left:10px!important}
  .login-brand__copy b{font-size:12px!important}
  .login-brand__copy small{display:none!important}
  .top-actions .logout span,.top-actions .back-link span,.top-actions .pcat-back span,.top-actions .offer-topbar-back span,.top-actions .calc-topbar-back span,.top-actions .contact-topbar-back span,.top-actions .order-topbar-back span,
  .pcat-actions .logout span,.pcat-actions .back-link span,.pcat-actions .pcat-back span{display:none!important}
  .top-actions .logout,.top-actions .back-link,.top-actions .pcat-back,.top-actions .offer-topbar-back,.top-actions .calc-topbar-back,.top-actions .contact-topbar-back,.top-actions .order-topbar-back,
  .pcat-actions .logout,.pcat-actions .back-link,.pcat-actions .pcat-back{width:40px!important;min-width:40px!important;padding:0!important}
}

/* Szeroki ekran komputerowy — ta sama oś 1400 px co dashboard i jego stopka. */
@media(min-width:1450px) and (min-height:800px){
  .topbar,.pcat-topbar{height:130px!important;min-height:130px!important;max-height:130px!important}
  .topbar>.topbar-inner,.pcat-topbar>.pcat-topbar-inner{
    width:min(1400px,calc(100% - 60px))!important;height:130px!important;min-height:130px!important;
    margin-left:auto!important;margin-right:auto!important
  }
  .login-brand{width:auto!important;margin:0!important;gap:18px!important}
  .login-brand__mark{width:52px!important;height:52px!important;flex-basis:52px!important;border-radius:14px!important;font-size:27px!important}
  .login-brand__copy{min-height:42px!important;padding-left:18px!important}
  .login-brand__copy b{font-size:17px!important}.login-brand__copy small{margin-top:4px!important;font-size:11.5px!important}
  .top-actions,.pcat-actions{gap:11px!important}
  .header-pill,.page-label,.pcat-pill,.offer-topbar-pill,.calc-topbar-pill,.contact-topbar-pill,.order-topbar-pill,
  .logout,.back-link,.pcat-back,.offer-topbar-back,.calc-topbar-back,.contact-topbar-back,.order-topbar-back{
    height:48px!important;min-height:48px!important;padding:0 16px!important;border-radius:13px!important;font-size:11px!important
  }
}