@mixin header-theme() {
  app-landing-header {
    header {
      padding: 20px 40px;
      width: 100%;
      background: url("../../../assets/images/main-bk.png") no-repeat left
        center;
      background-size: contain;
      background-color: $main-color;
      box-shadow: -2px 6px 9px #2f2c8333;
      border-radius: 18px;
      main {
        gap: 50px;

        ul {
          margin: 0;
          padding: 0;
          list-style: none;
          gap: 30px;
          li {
            color: $white-color;
            font-size: 17px;
            font-weight: 300;
            cursor: pointer;
            transition: all 0.5s;
            &:hover {
              color: $off-white;
            }
          }
        }
      }
      .actions {
        margin: 0;
        padding: 0;
        gap: 20px;
        &__signin {
          background-color: transparent;
          border: none;
          color: $white-color;
          font-size: 15px;
          font-weight: 300;
        }

        &__sign-up {
          background-color: $light-blue;
          color: $white-color;
          border: 1px solid $white-color;
          padding: 10px 20px;
          border-radius: 30px;
          font-size: 15px;
        }
      }
    }
  }
}
