@mixin header-nav($clr-link, $size-link:12pt, $bg:transparent){
  $clr-link1: rgba($clr-link,1);

  display: flex;
  align-items: center;
  list-style-type: none;
  margin: 0;
  padding: 0;
  font-size: $size-link;
  background: $bg;
  li{
    &:not(:last-child) {
      margin: 0 10px 0 0;
    }
  }
  a,[title],button{
    display: inline-block;
    color: $clr-link1;
    text-decoration: unset;
    background: transparent;
    padding: 5px 10px;
    border-radius: 9999px;
    transition: all .2s ease-in-out;
    cursor: pointer;
    border: none;
    font-size: unset;
    &:hover{
      color: invert($clr-link1);
      background: white;
      //padding: 5px 10px;
    }
    &:active{
      color: $clr-link1;
      background: black;
      //padding: 5px 10px;
    }
  }

  transition: all .2s ease-in-out;
}

Error: $color: rgba(var(--palette-secondary), 1) is not a color.