/*! Themestr.app `Darkster` Bootstrap 4.3.1 theme */

@use 'sass:map';


///==========================================
///   Theme variable overrides
///==========================================

@import "./abstract";

// Fonts
@import url(https://fonts.googleapis.com/css?family=Comfortaa:200,300,400,700);
$headings-font-family: "Comfortaa";

// Colors
$primary    :#FF550B;
$secondary  :#303030;
$success    :#015668;
$danger     :#FF304F;
$info       :#0F81C7;
$warning    :#0DE2EA;
$light      :#e8e8e8;
$dark       :#000000;

$gray-50 : #121212; // (+)
$gray-100: #212529;
$gray-150: #2E2E2E; // (+)
$gray-175: #333333; // (+)
$gray-200: #343A40;
$gray-300: #495057;
$gray-400: #6C757D;
$gray-500: #ADB5BD;
$gray-600: #CED4DA;
$gray-700: #DEE2E6;
$gray-800: #E9ECEF;
$gray-900: #F8F9FA;

// Palettes
$theme-colors: map.merge(
  $theme-colors,
  (
    'primary':    $primary,
    'secondary':  $secondary,
    'success':    $success,
    'danger':     $danger,
    'info':       $info,
    'warning':    $warning,
    'light':      $light,
    'dark':       $dark,
  )
);
$palette-semantic: $theme-colors;

$palette-gray: (
  '0':    $white,
  '50':   $gray-50,
  '100':  $gray-100,
  '150':  $gray-150,
  '175':  $gray-175,
  '200':  $gray-200,
  '300':  $gray-300,
  '400':  $gray-400,
  '500':  $gray-500,
  '600':  $gray-600,
  '700':  $gray-700,
  '800':  $gray-800,
  '900':  $gray-900,
  '1000': $black
);

$palette-pastel: (
  'green':  $pastel-green,
  'blue':   $pastel-blue,
  'yellow': $pastel-yellow,
  'red':    $pastel-red,
  'orange': $pastel-orange,
  'purple': $pastel-purple
);

// Components
$annotation-text-color: $gray-600;
$annotation-field-base-alpha: 15%;


// (overriding bootstrap "_variable.scss")
$enable-shadows:true;
$body-bg:$black;
$body-color:#cccccc;
$link-color:#f0f0f0;
$font-size-base:1.1rem;
$list-group-bg:lighten($body-bg,5%);
$card-border-color:rgba($black, 0.6);
$card-cap-bg:lighten($gray-800, 10%);
$card-bg:lighten($body-bg, 5%);
$input-bg:$gray-300;
$input-disabled-bg: $gray-100;

// Misc...
// $enable-shadows:true;
// $body-bg:$black;
// $body-color:#cccccc;
// $link-color:#f0f0f0;
// $link-hover-color:darken($link-color,20%);
// $font-size-base:1.1rem;
// $table-accent-bg: rgba($white,.05);
// $table-hover-bg:rgba($white,.075);
// $table-border-color:rgba($white, 0.3);
// $table-dark-border-color: $table-border-color;
// $table-dark-color:$white;
// $input-bg:$gray-300;
// $input-disabled-bg: #ccc;
// $dropdown-bg:$gray-800;
// $dropdown-divider-bg:rgba($black,.15);
// $dropdown-link-color:$body-color;
// $dropdown-link-hover-color:$white;
// $dropdown-link-hover-bg:$body-bg;
// $nav-tabs-border-color:rgba($white, 0.3);
// $nav-tabs-link-hover-border-color:$nav-tabs-border-color;
// $nav-tabs-link-active-bg:transparent;
// $nav-tabs-link-active-border-color:$nav-tabs-border-color;
// $navbar-dark-hover-color:$white;
// $navbar-light-hover-color:$gray-800;
// $navbar-light-active-color:$gray-800;
// $pagination-color:$white;
// $pagination-bg:transparent;
// $pagination-border-color:rgba($black, 0.6);
// $pagination-hover-color:$white;
// $pagination-hover-bg:transparent;
// $pagination-hover-border-color:rgba($black, 0.6);
// $pagination-active-bg:transparent;
// $pagination-active-border-color:rgba($black, 0.6);
// $pagination-disabled-bg:transparent;
// $pagination-disabled-border-color:rgba($black, 0.6);
// $jumbotron-bg:darken($gray-900, 5%);
// $card-border-color:rgba($black, 0.6);
// $card-cap-bg:lighten($gray-800, 10%);
// $card-bg:lighten($body-bg, 5%);
// $modal-content-bg:lighten($body-bg,5%);
// $modal-header-border-color:rgba(0,0,0,.2);
// $progress-bg:darken($gray-900,5%);
// $progress-bar-color:$gray-600;
// $list-group-bg:lighten($body-bg,5%);
// $list-group-border-color:rgba($black,0.6);
// $list-group-hover-bg:lighten($body-bg,10%);
// $list-group-active-color:$white;
// $list-group-active-bg:$list-group-hover-bg;
// $list-group-active-border-color:$list-group-border-color;
// $list-group-disabled-color:$gray-800;
// $list-group-disabled-bg:$black;
// $list-group-action-color:$white;
// $breadcrumb-active-color:$gray-500;


///==========================================
///   Custom styles specific to the theme
///==========================================

@import './_base';


.navbar-dark.bg-primary {background-color:#111111 !important;}
.table.able {color:#ccccc5}

.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
  background-color: $gray-300;
  color: $gray-700
}
.nav.nav-tabs li a.nav-link.active:hover {
  color: $gray-900;
}
.form-control,
.form-control:focus{
  background-color: $gray-300;
  color: $gray-700;
}
.card-header {
  background-color: $gray-400;
}
