:root {
  --hamburger-icon-width: 28px;
  --menu-item-padding: 0;
}

.has-modal-open .wp-block-cover .wp-block-cover__inner-container,
.has-modal-open .wp-block-cover-image .wp-block-cover__inner-container {
  z-index: 1;
}

header.site-header-wrapper {
  height: var(--header-height);
  display: flex;
  width: 100%;

  align-items: center;
  z-index: 5000;

  /* background: #fff; */
}

.merge-header header.site-header-wrapper {
  position: absolute;
  left: 0;
  right: 0;
}

.site-header {
  position: relative;
  z-index: 100;
  width: 100%;
  background: var(--header-bg-color) !important;
  color: var(--header-text-color);
  padding: 0 var(--wp--style--root--padding-right) 0 var(--wp--style--root--padding-left);
}

.merge-header .site-header {
  background: var(--header-merged-bg) !important;
  transition: background 0.5s ease-in-out;
}

.merge-header.scrolled .site-header-wrapper {
  background: var(--scrolled-header-bg, rgba(0, 0, 0, 0.5)) !important;
  transition: background 0.5s ease-in-out;
}

.site-header .wp-block-site-logo {
  line-height: unset;
}

.site-header .wp-block-site-logo a {
  display: block;
}

.site-header .wp-block-site-logo img {
  width: var(--logo-width);
  height: auto;
  max-width: auto !important;
}

.site-header .wp-block-navigation__responsive-container-open svg {
  position: relative;
  width: var(--hamburger-icon-width);
  height: auto;
  fill: var(--menu-text-color);
  display: block;
  right: -2px;
}

.site-header .wp-block-columns {
  position: relative;
  padding-top: var(--header-padding-top);
  padding-bottom: var(--header-padding-bottom);
  gap: var(--header-column-gap);
  border-bottom: var(--header-border-bottom);
  margin-top: 0;
}

.site-header .header-top-bar .wp-block-columns {
  padding-top: var(--topbar-padding-top);
  padding-bottom: var(--topbar-padding-bottom);
}

/* change border to transparent to avoid layout shifting */
body.scrolled .site-header .wp-block-columns {
  border-color: transparent;
}

/* change border to transparent to avoid layout shifting */
.merge-header .site-header .wp-block-columns {
  border-color: transparent;
}

/* visible main nav links */
nav > ul > li > a {
  padding: var(--menu-item-padding);
  gap: var(--menu-item-gap);
  letter-spacing: var(--menu-letter-spacing);
  font-size: var(--menu-font-size);
  font-weight: var(--menu-font-weight);
}

.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
  color: var(--menu-text-color);
}

.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
  color: var(--menu-text-color-hover);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content.wp-block-navigation-item__content {
  color: var(--popup-menu-text-color);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
  color: var(--popup-menu-text-color-hover);
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
  background-color: var(--dropdown-bg);
  border: 0;
  font-size: var(--dropdown-font-size);
  padding: var(--dropdown-padding);
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container a {
  background: transparent;
  color: var(--dropdown-text-color);
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container a:hover {
  color: var(--dropdown-text-color-hover);
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container .current-menu-item a {
  color: var(--dropdown-active-color);
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
  background-color: var(--popup-menu-bg);
  width: var(--popup-menu-width);
  height: 100vh;
  left: auto;
  right: 0;
  max-width: 100%;
  z-index: 555555555 !important;
  text-transform: var(--popup-menu-text-transform);
}

.wp-block-navigation:not(.has-text-color) .wp-block-navigation__responsive-container.is-menu-open {
  color: var(--popup-menu-text-color);
  font-size: var(--popup-menu-font-size);
  letter-spacing: var(--popup-menu-letter-spacing);
}

.wp-block-navigation__responsive-container-close {
  right: -2.5px;
  color: var(--popup-submenu-text-color);
}

.wp-block-navigation:not(.has-text-color) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation {
  width: 100%;
  gap: var(--popup-menu-item-gap);
}

.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation {
  width: 100%;
  gap: var(--popup-menu-item-gap);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation li.wp-block-navigation-submenu {
  display: grid;
  width: 100%;
  grid-template-columns: 100% 1fr;
  text-transform: var(--popup-submenu-text-transform);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation li.wp-block-navigation-submenu:hover button {
  color: var(--popup-menu-text-color-hover);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
  color: var(--popup-menu-text-color-hover);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  color: var(--popup-submenu-text-color);
}

.wp-block-navigation__responsive-container.is-menu-open .has-child .wp-block-navigation-submenu__toggle {
  font-size: var(--popup-menu-font-size);
}

.wp-block-navigation__responsive-container.is-menu-open .has-child .opened {
  color: var(--popup-menu-text-color-hover);
}

.wp-block-navigation__responsive-container.is-menu-open .has-child .wp-block-navigation-item__content:hover {
  color: var(--popup-submenu-text-color-hover);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
  padding-left: var(--popup-submenu-left-right-padding);
  padding-right: var(--popup-submenu-left-right-padding);
  font-size: var(--popup-submenu-font-size);
  display: none;
  grid-column: span 2;
  padding-top: calc(var(--popup-submenu-item-gap) - (var(--popup-submenu-item-gap) * 0.25));
  gap: var(--popup-submenu-item-gap);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-icon {
  position: relative;
  display: block;
  font-size: 30px;
  top: -3px;
  transition: transform 0.1s;

  color: var(--popup-menu-text-color);
  fill: var(--popup-menu-text-color);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation li.wp-block-navigation-submenu:hover .wp-block-navigation__submenu-icon {
  color: var(--popup-menu-text-color-hover);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation .opened + .wp-block-navigation__submenu-icon {
  color: var(--popup-menu-text-color-hover);
}

button.wp-block-navigation-item__content {
  text-transform: uppercase;
  font-family: var(--wp--preset--font-family--sans-serif-text);
  letter-spacing: var(--menu-letter-spacing);
  font-size: var(--menu-font-size);
}

button.wp-block-navigation-item__content.opened ~ ul {
  display: flex !important;
}

button.wp-block-navigation-item__content.opened ~ .wp-block-navigation__submenu-icon {
  transform: rotate(-180deg);
  transition: transform 0.1s;
}

button.wp-block-navigation-item__content.current-menu-ancestor {
  color: var(--menu-current-item-color) !important;
}

.wp-block-navigation-submenu li {
  background-color: transparent !important;
}

.wp-block-navigation-submenu li:last-child {
  margin-bottom: 0;
}

nav li.my-account {
  display: none !important;
}

body.logged-in nav li.login {
  display: none;
}

body.logged-in nav li.my-account {
  display: flex !important;
}

/* ---------------------------------- */
/* HEADER - logo centered - menus on both sides */

/* desktop menu left */
.site-header.logo-center .wp-block-column:nth-child(1) {
  flex-basis: 400px;
  text-transform: uppercase;
  padding-right: calc(var(--menu-item-gap) * 2);
}

.site-header.logo-center .wp-block-column:nth-child(1) > * {
  height: 100%;
}

/* logo */
.site-header.logo-center .wp-block-column:nth-child(2) {
  flex-basis: auto;
  flex-grow: 0;
  min-width: var(--logo-width);
}

/* desktop menu right */
.site-header.logo-center .wp-block-column:nth-child(3) {
  flex-basis: 400px;
  text-transform: uppercase;
  padding-right: calc(var(--menu-item-gap) * 2);
}

.site-header.logo-center .wp-block-column:nth-child(3) nav .wp-block-navigation__container {
  justify-content: flex-end;
}

/* hamburger */
.site-header.logo-center .wp-block-column:nth-child(4) {
  flex-basis: auto;
  flex-grow: 0;
  position: absolute;
  right: 0;
  height: var(--hamburger-icon-height);
  z-index: 1;
}

.site-header.logo-center nav {
  position: relative;
  height: 100%;
  align-items: center;
}

/* rules for mobile thru tablet  */
@media only screen and (min-width: 320px) and (max-width: 1023px) {
}

/* stuff for mobile only */
@media only screen and (max-width: 767px) {
  .site-header.logo-center .wp-block-column:nth-child(1) {
    flex-basis: 50px;
  }

  .site-header.logo-center .wp-block-column:nth-child(2) {
    flex-grow: 1;
    flex-basis: 100%;
  }

  .site-header.logo-center .wp-block-column:nth-child(3) {
    flex-basis: 50px;
    padding-right: 0;
  }
}
/* ---------------------------------- */
/* ---------------END---------------- */

/* ---------------------------------- */
/* HEADER - logo left - menu on right */
/* logo */
.site-header.logo-left .wp-block-column:nth-child(1) {
  flex-basis: auto;
  min-width: var(--logo-width);
}

/* desktop menu right */
.site-header.logo-left .wp-block-column:nth-child(2) {
  flex-grow: 1;
  flex-basis: 100%;
}

.site-header.logo-left .wp-block-column:nth-child(2) nav .wp-block-navigation__container {
  justify-content: flex-end;
  padding-right: var(--menu-item-gap);
  gap: var(--menu-item-gap);
  text-transform: uppercase;
}

/* hamburger */
.site-header.logo-left .wp-block-column:nth-child(3) {
  flex-basis: var(--hamburger-icon-width);
  flex-shrink: 0;
  z-index: 1;
}

.site-header.logo-left nav {
  height: 100%;
  align-items: center;
  gap: var(--menu-item-gap);
}

/* rules for mobile thru tablet  */
@media only screen and (min-width: 320px) and (max-width: 1023px) {
  .site-header.logo-left .desktop-nav {
    display: none;
  }
}

/* stuff for mobile only */
@media only screen and (max-width: 767px) {
  .site-header.logo-left .wp-block-column:nth-child(2) {
    flex-grow: 1;
    flex-basis: auto;
    flex-shrink: 1;
  }

  .site-header.logo-left .wp-block-column:nth-child(3) {
    flex-grow: 0;
    flex-basis: auto;
  }
}
/* ---------------------------------- */
/* ---------------END---------------- */

/* ---------------------------------- */
/* HEADER - logo right - menu on left */

/* hamburger */
.site-header.logo-right .wp-block-column:nth-child(1) {
  flex-basis: auto;
  flex-grow: 0;
  position: absolute;
  left: 0;
  height: 100%;

  z-index: 1;
}

/* desktop menu right */
.site-header.logo-right .wp-block-column:nth-child(2) {
  flex-grow: 1;
  flex-basis: 100%;
}

/* logo */
.site-header.logo-right .wp-block-column:nth-child(3) {
  text-align: right;
  flex-basis: var(--logo-width);
  max-width: var(--logo-width);
}

/* desktop menu right */
.site-header.logo-right .wp-block-column:nth-child(2) nav .wp-block-navigation__container {
  padding-left: calc(var(--menu-item-gap) * 2);
  text-transform: uppercase;
}

.site-header.logo-right nav {
  height: 100%;
  align-items: center;
  gap: var(--menu-item-gap);
}

/* ---------------------------------- */
/* ---------------END---------------- */

/* rules for mobile thru tablet  */
@media only screen and (min-width: 320px) and (max-width: 1023px) {
  #wpadminbar {
    position: fixed;
  }

  .site-header-wrapper {
    position: fixed;
    top: 0;
    transition: top 0.05s ease-in;
  }

  .merge-header header.site-header-wrapper {
    position: fixed;
  }

  .admin-bar.merge-header header.site-header-wrapper {
    top: var(--adminbar-height);
  }

  .admin-bar .site-header-wrapper {
    top: var(--adminbar-height);
  }
}