// template and bootstrap override variables
@import "../variables";
@import "../bootstrap/variables";

// template and bootstrap mixins
@import "../mixins";
@import "../bootstrap/mixins";

// bootstrap
@import "../../node_modules/bootstrap/scss/functions";
@import "../../node_modules/bootstrap/scss/variables";
@import "../../node_modules/bootstrap/scss/mixins";

// local vars
$skin-ui-01:    desaturate($blue, 20%);

body {
  background-color: rgba($skin-ui-01, .03);
}

.navbar-header {
  border-bottom-color: lighten($skin-ui-01, 45%);
  box-shadow: 0 0 25px rgba($skin-ui-01, .1);

  .navbar-right {
    .dropdown-menu {
      border-color: lighten($skin-ui-01, 45%);
      border-top-color: transparent;
      box-shadow: 0 15px 15px rgba($skin-ui-01, .1);
    }

    .dropdown-notification,
    .dropdown-message {
      .dropdown-menu {
        margin-top: 18.5px;

        &::before { opacity: 0; }
      }
    }
  }
}

.dropdown-profile .dropdown-menu {
  margin-top: 13.5px;
  &::before { opacity: 0; }
}

.navbar-menu-sub {
  @include media-breakpoint-up(lg) {
    padding-top: 10px;
    border-color: lighten($skin-ui-01, 45%);
    border-top-color: transparent;
    box-shadow: 0 15px 15px rgba($skin-ui-01, .1);
  }

  &::before { opacity: 0; }

  @include media-breakpoint-up(lg) {
    margin-top: 0;
  }
}

.card {
  border-color: transparent;
  box-shadow: 0 0 25px rgba($skin-ui-01, .1);
}

.card-header,
.card-footer,
.list-group-item,
.table tr th,
.table tr td,
.bd { border-color: lighten($skin-ui-01, 46%); }

.footer {
  border-top-color: transparent;
  box-shadow: 0 0 25px rgba($skin-ui-01, .1);
}