/* OIB V52 — finalny przycisk Moje OIB i czerwone menu.
   Ten plik jest ładowany jako ostatni, aby starsze style nie mogły go nadpisać. */

#publicSite .nav-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
}

#publicSite .portal-nav-link,
#publicSite .portal-nav-link.portal-tone-red,
#publicSite .portal-nav-link.portal-tone-black,
#publicSite .portal-nav-link.portal-tone-light {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  min-height: 52px !important;
  height: 52px !important;
  padding: 0 17px !important;
  gap: 10px !important;
  border: 1px solid #98172b !important;
  border-radius: 14px !important;
  background: #98172b !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(152, 23, 43, .18) !important;
  text-decoration: none !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  overflow: hidden !important;
}

#publicSite .portal-nav-link:hover,
#publicSite .portal-nav-link:focus-visible {
  background: #861326 !important;
  border-color: #861326 !important;
  color: #fff !important;
}

#publicSite .portal-nav-link .portal-nav-icon,
#publicSite .portal-nav-link.portal-tone-red .portal-nav-icon,
#publicSite .portal-nav-link.portal-tone-black .portal-nav-icon,
#publicSite .portal-nav-link.portal-tone-light .portal-nav-icon {
  display: block !important;
  flex: 0 0 29px !important;
  width: 29px !important;
  min-width: 29px !important;
  height: 29px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  object-fit: contain !important;
}

#publicSite .portal-nav-link span:not(.sr-only) {
  display: inline-block !important;
  color: #fff !important;
  white-space: nowrap !important;
}

/* Czerwony przycisk menu z trzema krótkimi liniami. */
#publicSite button.menu-button,
#publicSite #menuButton {
  -webkit-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
  position: relative !important;
  display: none !important;
  flex: 0 0 52px !important;
  width: 52px !important;
  min-width: 52px !important;
  max-width: 52px !important;
  height: 52px !important;
  min-height: 52px !important;
  max-height: 52px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid #98172b !important;
  border-radius: 14px !important;
  background: #98172b !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(152, 23, 43, .18) !important;
  overflow: hidden !important;
  font-size: 0 !important;
}

#publicSite #menuButton::before,
#publicSite #menuButton > span,
#publicSite #menuButton::after {
  content: "" !important;
  box-sizing: border-box !important;
  display: block !important;
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  width: 19px !important;
  min-width: 19px !important;
  max-width: 19px !important;
  height: 2px !important;
  min-height: 2px !important;
  max-height: 2px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 99px !important;
  background: #fff !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
  transform-origin: center !important;
  transition: top .18s ease, transform .18s ease, opacity .18s ease !important;
}

#publicSite #menuButton::before { top: 17px !important; }
#publicSite #menuButton > span { top: 25px !important; }
#publicSite #menuButton::after { top: 33px !important; }

#publicSite .site-header.menu-open #menuButton::before {
  top: 25px !important;
  transform: translateX(-50%) rotate(45deg) !important;
}
#publicSite .site-header.menu-open #menuButton > span {
  top: 25px !important;
  opacity: 0 !important;
}
#publicSite .site-header.menu-open #menuButton::after {
  top: 25px !important;
  transform: translateX(-50%) rotate(-45deg) !important;
}

@media (max-width: 1180px) {
  #publicSite button.menu-button,
  #publicSite #menuButton {
    display: block !important;
  }
}

@media (max-width: 760px) {
  #publicSite .portal-nav-link,
  #publicSite .portal-nav-link.portal-tone-red,
  #publicSite .portal-nav-link.portal-tone-black,
  #publicSite .portal-nav-link.portal-tone-light {
    flex: 0 0 52px !important;
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    padding: 0 !important;
    gap: 0 !important;
  }

  #publicSite .portal-nav-link .portal-nav-icon {
    flex-basis: 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
  }

  #publicSite .portal-nav-link span:not(.sr-only) {
    display: none !important;
  }
}