// Navigation breakpoints
.mobile-menu,
.site-title-bar {
  @include hide-for(medium);
}

.desktop-menu,
.site-navigation .top-bar-left {
  @include show-for(medium);
}

.site-title-bar .title-bar-left {
  flex-grow:2;
}

// Site title
.site-desktop-title a {
  font-weight: bold;
}

// Mobile menu
.mobile-menu {
  display: none; // prevents repaint caused by JS hiding menu onload
}

.off-canvas {
  > ul.menu {
    height: 100vh;
    padding: 1rem;

    a {
      color: $white;
      font-weight: 600;
      font-size: rem-calc(13);
      line-height: 1.5;
    }
  }

  .menu .active > a { background-color: #ccc; }

}

.title-bar-title {
  a {
    font-size: 1rem;
    color: #B9B9B9;
  }
}

.mobile-menu,
.mobile-off-canvas-menu {

  .menu .is-active > a {
    color: $primary-color;
  }
}

// Tablet and desktop menu
body.domestic-menu-schema-light .top-bar {
  background:$white;
  border-bottom: 1px solid $light-gray;
  .menu a {
    color: $black;
  }
  ul.menu {
    background:$white;
  }
  ul.menu li.current-menu-ancestor > a {
    color:$dark-gray;
  }
}

body.domestic-menu-schema-dark .top-bar {
  background:$black;
  border-bottom:1px solid darken( $topbar-background, 10% );
  .menu a {
    color: $white;
  }
  ul.menu {
    background:$black;
  }
  ul.menu li.current-menu-ancestor > a {
    color:$dark-gray;
  }
}

.top-bar {
  border-bottom:1px solid darken( $topbar-background, 10% );
  padding: $global-padding / 2;
  background:$black;
  @include breakpoint( small only ) {
    display:none;
  }
  .top-bar-title a {
    font-size: 1rem;
    color: #B9B9B9;
    padding-left: 1rem;
    line-height: 1.8;
  }

  .menu {
    margin: 0 auto;
    z-index:500;
    li {
      position:relative;
    }
  }

  .menu a {
    color: $white;
    padding-top: 0;
    padding-bottom: 0;
    font-weight: 500;
    font-size: rem-calc( 15px );
    line-height: 1.5;

  }

  ul.menu li.current-menu-item > a {
    color:$primary-color;
  }

  ul.menu li > a {
    &:hover, &:active {
      color:$primary-color;
    }
  }

  .menu .active > a { background-color: $primary-color; }

  .menu>li:not(.menu-text)>a { padding: 1rem; }

  .dropdown.menu .submenu { border: 0; }
  .dropdown.menu .has-submenu.is-down-arrow a { padding-right: 1rem; }
  .dropdown.menu .has-submenu.is-down-arrow > a::after { border: 0; }
  .dropdown.menu:first-child > li.is-dropdown-submenu-parent > a::after { display: none; }
}

.top-bar > ul.menu > li.menu-item-has-children:after {
  @include arrow-down( $primary-color );
}

.top-bar > ul.menu > li.menu-item-has-children ul.dropdown {
  box-shadow:2px 3px 2px $black;
}

.dropdown.menu.vertical > li.opens-right > a::after {
  right:5px;
  margin-top:-5px;
}

.site-navigation {
  @include breakpoint(small only) {
    padding: 0; // prevents container visibility on small screens
  }
}

// WP post navigation
.post-navigation {
  @include clearfix;
}

.nav-previous {
  float:left;
}

.nav-next {
  float:right;
}

#post-nav, .post-navigation {
  margin-bottom: 2 * $global-margin;
  a {
  }

  .nav-previous a:before {
    content: '← ';
  }
  .nav-next a:after {
    content: ' →';
  }
}

.menu .is-active > a {
  background: transparent;
  color:$primary-color;
}

body.rtl {
  .title-bar-right {
    text-align: left;
  }
}