@charset "UTF-8";

//
// @copyright        2017 opencart.cn - All Rights Reserved
// @link             http://www.guangdawangluo.com
// @author           Pu shuo <pushuo@opencart.cn>
// @created          2017-10-09 10:30:41
//

#menu {
  background-color: $main_menu_wrapper_bg_color;
  min-height: $main_menu_height;
  border-top: $main_menu_border;
  border-bottom: $main_menu_border;
  margin-bottom: $main_menu_margin_bottom;

  @media (max-width: 992px) {
    min-height: 40px;
    .container {
      width: 100%;
    }
  }

  .nav {
    float: none;
    @media (max-width: 992px) {
      margin: 0;
    }

    a {
      color: $menu_item_color;
    }

    > li {
      position: relative;

      .dropdown-menu {
        @include transition(all .2s ease-out);

        @media (min-width: 992px) {
          top: 140%;
          visibility: hidden;
          display: block;
        }

        > li {
          border-bottom: 1px dashed #e8e8e8;
          &:last-of-type {
            border-bottom: none;
          }
          > a {
            padding: 7px 20px;
          }
        }
      }

      @media (min-width: 992px) {
        >.toggle-button {
          position: absolute;
          top: 50%;
          margin-top: -9px;
          right: 0px;
        }

        &:hover {
          > a {
            color: $menu_item_color_hover;
          }

          .dropdown-menu {
            display: block;
            visibility: visible;
            top: 100%;
          }
        }

        > a {
          font-weight: bold;
          height: $main_menu_height;
          line-height: $main_menu_height;
          padding: $menu_item_padding_left_right;
          color: $menu_item_color;
        }
      }

      @media (max-width: 992px) {
        &.active {
          > a, .toggle-button {
            color: $brand-primary;
            i {
              @include default-transform(rotate(-180deg));
            }
          }
        }
        >.toggle-button {
          position: absolute;
          top: 0;
          padding: 10px;
          cursor: pointer;
          right: 0px;
        }

        float: none;
        border-bottom: 1px solid #e5e5e5;

        >a {
          width: 84%;
          color: #666;
        }

        .dropdown-menu {
          position: relative;
          float: none;
          box-shadow: none;
          border: none;
          padding-left: 12px;
          transition: none;
        }
      }
    }
  }

  .navbar-header {
    height: 40px;
    width: 100%;
    margin: 0;

    .mobile-search {
      float: left;
      padding: 0 10px;
      height: 40px;
      width: 40px;
    }

    .mobile-nav-icon {
      height: 40px;
      width: 40px;
      float: right;
    }
  }
}
