@use '../../all_variables' as *;

@mixin nav(
  $subsite-light-theme,
  $subsite-primary,
  $subsite-primary-text,
  $subsite-link-color
) {
  .navbar {
    // navbar mobile
    .navbar-collapsable {
      /*lista menu*/
      .navbar-nav {
        li {
          a.nav-link {
            @if $subsite-light-theme {
              color: $subsite-primary-text;
            } @else {
              color: $subsite-primary;
            }

            &.active {
              @if $subsite-light-theme {
                border-left-color: $subsite-primary-text;
              } @else {
                border-left-color: $subsite-primary;
              }
            }
          }
        }
      }

      .menu-wrapper {
        .it-brand-wrapper {
          @if $subsite-light-theme {
          } @else {
            //background-color: $subsite-primary;
          }
        }
      }
    }

    //Dropdown style tipo collapse
    .dropdown-menu {
      .link-list-wrapper {
        ul li {
          a {
            &.list-item.active {
              color: $subsite-link-color;
            }

            span {
              @if $subsite-light-theme {
                color: darken($subsite-link-color, 10);
              } @else {
                color: $subsite-link-color;
              }
            }

            i {
              color: $subsite-link-color;
            }
          }
        }
      }
    }
  }

  .custom-navbar-toggler {
    span {
      color: $subsite-primary-text;
    }

    svg {
      fill: $subsite-primary-text;
    }
  }

  //Tablet horizontal / small desktop
  @media (min-width: #{map-get($grid-breakpoints, lg)}) {
    .navbar {
      background: $subsite-primary;

      // navbar mobile
      .navbar-collapsable {
        /*menu vrapper
      .menu-wrapper {
        background: $navigation-bg-color-desktop;
      }*/

        /*lista menu*/
        .navbar-nav {
          li {
            a.nav-link {
              color: $subsite-primary-text;

              &.dropdown-toggle {
                svg {
                  fill: $subsite-primary;
                }
              }

              &.active {
                border-color: $subsite-primary-text;
              }
            }
          }
        }
      }

      /* Dropdown style tipo collapse
    .dropdown-menu {
      color: $body-color;
      background-color: $dropdown-bg;

      border: $dropdown-border-width solid $dropdown-border-color;

      .link-list-wrapper {
        ul li {
          a {
            span,
            i,
            h3 {
              color: $link-color;
            }
          }

          h3 {
            color: $body-color;
          }
        }
      }
    }*/
    }

    /*.nav-item.megamenu {
    > a.dropdown-toggle {
      &:before {
        content: '';
        background-color: $dropdown-bg;
      }
    }
  }*/
  }

  // Mobile
  @media (max-width: #{map-get($grid-breakpoints, lg)}) {
    .navbar {
      .navbar-collapsable {
        .navbar-nav {
          li a.nav-link {
            font-size: 16px;
          }
        }

        .link-list-wrapper {
          ul li {
            a {
              font-size: 14px;
            }

            h3 {
              font-size: 0.833em;
            }
          }
        }
      }
    }
  }
}