@import "../variables";

$Hard: #fff;
$Soft: #333;
$Detail: #0a121b;
$Unfocused: #999;
$White: #eee;

// Links
$Link: #9CD7F7;
$LinkHover: #d4eff7;

@import "_base";

body {
  background-color: #061F2F;
  color: #d3d4d4;
}
.main-sidebar {
  background: none !important;
}

.btn {
  //background-color: $Unfocused !important;
  color: white !important;
  //border: none !important;

  &:hover {
    //color: $Detail !important;
    //background-color: $Hard !important;
    //border: none !important;
  }
}
.btn-danger {
  &:hover {
    background-color: #992329 !important;
    color: white !important;
  }
}
.btn-default, .btn-app {
  color: #444 !important;
}

.box, .panel  {
  background-color: $Detail !important;

  .box-header, .panel-heading {
    background-color: rgba(0, 0, 0, 0.1) !important;
  }
  .with-border {
    border-bottom: none !important;
  }
}

a {
  color: $Link !important;
  &:hover {
    color: $LinkHover !important;
    text-decoration: none;
  }
}

.nav-tabs-custom {
  border: none;
  background-color: $Detail;

  .nav-tabs {
    border-bottom: 0;
    background-color: rgba(0, 0, 0, 0.2);
    width: 100% !important;

    li {
      background-color: $Detail !important;
    }
    .active {
      a {
        background-color: $Detail !important;
        color: $Hard !important;
      }
    }
  }
  .tab-content {
    background: none;
  }
}
.nav-stacked {
  li {
    border-bottom: 1px solid $Soft !important;

    a {
      &:hover {
        background-color: $Soft !important;
      }
    }
  }
}
.nav-tabs {
  li {
    border: none;
    &:hover {
      background: $Detail;
      border: none;
      border-bottom: none;
      a {
        background: none;
      }
    }
  }
  li.active {
    border-top: 3px solid transparent !important;

    a {
      color: $Soft !important;
      background-color: $Hard !important;
      border: none !important;
    }
  }
}

.product-list-in-box > .item {
  border-bottom: 1px solid $Soft;
}

/**
 * Menu
 */
.main-header, .navbar {
  background: $Detail !important;

  a {
    color: $Hard !important;

    &:hover {
      background: $Soft !important;
    }
  }

  .btn {
    color: $Unfocused !important;
    background: $Soft !important;
  }

  .typeahead {
    border-color: $Unfocused !important;
  }

  li.header {
    border: 0 !important;
  }
}

/**
 * Calendar
 */
.calendar {
  td.today {
    background-color: #515142;
  }
}

/**
 * Conversations
 */
.box-comments, .box-comment {
 background-color: $Detail;
}

@media (max-width: 991px) {
  .content-header > .breadcrumb {
    background: none !important;
  }

  .navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
    background-color: $Detail;
  }
}

.panel-body {
  .preview {
    background: none;
    &:before {
      background: linear-gradient(transparent 0px, $Detail) !important;
    }
  }
}