/* -------------------------------------------------------------------------- */
/*                               LAYOUT: GLOBAL WRAPS                         */
/* -------------------------------------------------------------------------- */

:root {
    --container-max-width: 1200px;
    --container-padding: 1rem;
}

/* Universal custom container */
.c-container {
  width: 100%;
  max-width: var(--container-max-width);
  margin-inline: auto;
  padding-inline: var(--container-padding);
}

/* Variants */
.c-container--wide {
  max-width: 1440px;
}

.c-container--narrow {
  max-width: 960px;
}


/* -------------------------------------------------------------------------- */
/*                                LAYOUT: HEADER                              */
/* -------------------------------------------------------------------------- */

.c-header {
  background-color: var(--color-white);

  ul.menu {
    li.menu-item {
        .menu-item-text, a {
            transition: var(--transition);
        }
    }
    
    /* Last item turned into a button, not visible in responsive */
    @media (min-width: 993px) {
      li.menu-item:last-child {
        border: var(--white) solid 1.5px;
        border-radius: var(--border-radius-button);
        padding: 0.5rem 1rem;
        transition: var(--transition);
        color: var(--on-primary);
  
        &:hover {
          background-color: var(--primary);
          border-color: var(--primary);
          rotate: -5deg;
  
          .menu-item-text {
            color: var(--on-white);
          }
  
        }
      }
    }
  }
}

.site#page {
  .ast-main-header-wrap {
    .site-header-section {
      &>div {
        padding: 0;
      }

      .ast-header-account .ast-header-account-link, .ast-header-woo-cart .ast-addon-cart-wrap {
        background: #FCF9F299;
        padding: 15px;
        border-radius: 99px;
        transition: var(--transition);

        svg {
          height: 18px;
          width: 18px;
        }

        &:hover {
          background: var(--white);
        }
      }
    }
  }
}

body.menu-oscuro {
  .ast-builder-menu-1 {
    .menu-item {
      &.current-menu-item {
        color: var(--secondary);
        text-decoration: underline;
        text-underline-offset: 5px;
      }
      .menu-link {
        color: var(--secondary);
        &:hover {
          color: var(--black);
        }
      }
    }
  }

  .ast-header-button-1 {
    .ast-builder-button-wrap {
      .ast-custom-button-link {
        .ast-custom-button {
          color: var(--secondary);
          border-color: var(--secondary);
          &:hover {
            color: var(--white);
            border-color: var(--secondary);
            background: var(--secondary);
          }
        }
      }
    }
  }
}

body:not(.menu-oscuro) {
  header img {
    filter: none!important;
  }
}


/* -------------------------------------------------------------------------- */
/*                                LAYOUT: FOOTER                              */
/* -------------------------------------------------------------------------- */

.c-footer {
  width: 100%;
  padding-block: 2rem;
  background-color: var(--primary, #222);
  color: var(--white, #fff);
}

.c-footer__inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
  font-size: var(--xs-font-size, 0.875rem);
}