/**
 * The base file that should be imported by every file.
 * There should be no CSS generation in this or from imported scss files at all!
 */
/**
 * Library
 */
/**
 * Variables and functions
 */
.magazine-header__toggle {
  background-color: transparent;
  color: var(--wp--preset--color--tertiary);
  padding: 0;
  border: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-left: 1rem;
  margin-right: auto; }
  @media (min-width: 782px) {
    .magazine-header__toggle {
      margin-left: auto;
      display: block; } }
  .magazine-header__toggle-in {
    border: 1px solid var(--wp--preset--color--gray);
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem; }
    .magazine-header__toggle-in .toggle-close {
      display: none; }
    .magazine-open .magazine-header__toggle-in .toggle-close {
      display: block; }
    .magazine-open .magazine-header__toggle-in .toggle-open {
      display: none; }

.magazine-header__menu {
  display: flex;
  flex-direction: column;
  gap: 0.5rem; }
  @media (min-width: 782px) {
    .magazine-header__menu {
      margin-top: auto; } }
  .magazine-header__menu-item {
    position: relative; }
    .magazine-header__menu-item.is-active::before {
      background-color: var(--wp--preset--color--tertiary); }
    .magazine-header__menu-item.is-active a {
      color: var(--wp--preset--color--tertiary);
      font-weight: 500; }
    .magazine-header__menu-item a {
      display: block;
      width: 18rem; }
      .magazine-header__menu-item a::before {
        content: '';
        display: block;
        position: absolute;
        left: -3.5rem;
        top: 50%;
        transform: translateY(-50%);
        height: 1.25rem;
        width: 4px;
        border-radius: 0.5rem;
        background-color: var(--wp--preset--color--gray);
        transition: ease-in-out background-color 200ms; }
      .magazine-header__menu-item a:hover {
        color: var(--wp--preset--color--tertiary);
        font-weight: 500; }
        .magazine-header__menu-item a:hover::before {
          background-color: var(--wp--preset--color--tertiary); }

/*# sourceMappingURL=menu.css.map */