/* Header
======================== */
.pc-simple-header {
  padding: 20px 0;
}

.pc-simple-header .pc-container {
  max-width: var(--header-layout);
}

/* Logo */
.pc-simple-header .pc-simple-header-logo .custom-logo {
  max-width: var(--logo-max-width);
}

.pc-simple-header-menu__mobile {
  -webkit-box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 0%);
  box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 0%);
  top: 0;
  left: -330px;
  width: 330px;
  bottom: 0;
  background: white;
  z-index: 100;
  transition: all 500ms;
  padding: 30px;
}

body.admin-bar .pc-simple-header-menu__mobile {
  top: 32px;
}

.pc-simple-header-menu__mobile.pc-open {
  left: 0;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.3);
}

.pc-simple-header-menu__close {
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s;
  position: absolute;
  right: -50px;
  top: 40px;
}

.pc-simple-header-menu__mobile.pc-open .pc-simple-header-menu__close {
  opacity: 1;
  visibility: visible;
}

.pc-simple-header-menu__close svg line {
  stroke: #ffffff;
}

@media (max-width: 980px) {
  #pc-mainmenu-mobile {
    margin-top: 20px;
  }

  #pc-mainmenu-mobile .pc-header-main-menu-mobile {
    padding: 0;
    margin: 0;
    list-style-type: none;
  }

  #pc-mainmenu-mobile .pc-header-main-menu-mobile li {
    padding: 10px 0;
    border-top: solid 1px #f4f4f4;
    font-size: 20px;
  }
}

@media (max-width: 767px) {
  .pc-simple-header-menu__mobile {
    width: 300px;
    left: -300px;
    padding: 20px;
  }

  body.admin-bar .pc-simple-header-menu__mobile {
    top: 0px;
  }
}

/* Menu */
.pc-simple-header {
  background-color: var(--header-bg-color);
}

.pc-simple-header .pc-simple-header-menu {
  flex-basis: 70%;
}

.pc-simple-header .pc-simple-header-menu-desktop ul {
  justify-content: var(--header-menu-alignment);
  gap: var(--header-menu-gap);
}

.pc-simple-header .pc-simple-header-menu-desktop ul li a {
  color: var(--header-menu-color);
}

.pc-simple-header .pc-simple-header-menu-desktop ul li a:hover {
  color: var(--header-menu-color-hover);
}