/*
 * Skin: Blue
 * ----------
 */

.skin-blue-light {
  //Navbar
  .main-header {
    .navbar {
      @include navbar-variant($brand-primary, #fff);
      .sidebar-toggle {
        color: #fff;
        &:hover {
          background-color: darken($brand-primary, 5%);
        }
      }
      @media (max-width: $screen-header-collapse) {
        .dropdown-menu {
          li {
            &.divider {
              background-color: rgba(255, 255, 255, 0.1);
            }
            a {
              color: #fff;
              &:hover {
                background: darken($brand-primary, 5%);
              }
            }
          }
        }
      }
    }
    //Logo
    .logo {
      @include logo-variant($brand-primary);
    }

    li.user-header {
      background-color: $brand-primary;
    }
  }

  //Create the sidebar skin
  @include skin-light-sidebar($brand-primary);
  .main-footer {
    border-top-color: $gray;
  }
}

.skin-blue.layout-top-nav .main-header > .logo {
  @include logo-variant($brand-primary);
}