//  ================================================================================================
//  File Name: variables-dark.scss
//  Description: Custom dark theme variables
//  ----------------------------------------------------------------------------------------------
//  Item Name: CXWebAdmin - Cloudxin Web Admin  Template
//  Author: Cloudxin
//  URL: http://www.cloudxin.cn
//  ================================================================================================

//  ================================================================================================
//  WARNING: PLEASE DO NOT CHANGE THIS VARIABLE FILE.
//  THIS FILE WILL GET OVERWRITTEN WITH EACH VUEXY HTML TEMPLATE RELEASE.
//  TIP:
//  We suggest you to use this (assets/scss/variables/_variables-components.scss) file for overriding components variables.
//  ================================================================================================

//Body
$theme-dark-body-bg: #151521 !default;
$theme-dark-body-color: #fff !default;
$theme-dark-border-color: #2B2B40 !default;
$theme-dark-custom-control-border-color: #44405e !default;

//Typography
$theme-dark-headings-color: #f9fafb !default;
$theme-dark-label-color: #f9fafb !default;
$theme-dark-text-muted-color: #676d7d !default;

//Card
$theme-dark-card-bg: #1E1E2D !default;
//$theme-dark-box-shadow: 0 4px 24px 0 rgba($black, 0.24);
$theme-dark-box-shadow: 0 3px 6px -4px rgb(0 0 0 / 48%), 0 6px 16px 0 rgb(0 0 0 / 32%), 0 9px 28px 8px rgb(0 0 0 / 20%);

//Input
$theme-dark-input-bg: #1b1b29 !default;
$theme-dark-input-placeholder-color: #565674 !default;
$theme-dark-input-bg-focus: darken($theme-dark-input-bg, 2%) !default; // Custom variable
$theme-dark-input-border-color: transparent !default;
$theme-dark-input-disabled-bg: #24233a !default;
$theme-dark-input-disabled-border-color: #24233a !default;
$theme-dark-input-disabled-color: $gray-600 !default;

// Switch
$theme-dark-switch-bg: #545a6a;
$theme-dark-switch-bg-disabled: #1b2337;

//Table
$theme-dark-table-bg: $theme-dark-card-bg !default;
$theme-dark-table-header-bg: $theme-dark-card-bg !default;
$theme-dark-table-row-bg: $theme-dark-card-bg !default;
$theme-dark-table-hover-bg: #223 !default;
$theme-dark-table-striped-bg: #1b1b29 !default;
$theme-dark-table-dashed-line: 1px dashed #2b2b40 !important;

$theme-dark-modal-header-bg: #161d31 !default;
$theme-dark-pagination-bg: $theme-dark-input-bg !default;
$theme-dark-chart-bg: #384056 !default;
$theme-dark-widget-bg: #384056 !default;

$theme-dark-gray-100: #1b1b29 !default; // $gray-lightest
$theme-dark-gray-200: #2B2B40 !default; // $gray-lighter
$theme-dark-gray-300: #323248 !default; // $gray-light
$theme-dark-gray-400: #474761 !default;
$theme-dark-gray-500: #565674 !default;
$theme-dark-gray-600: #6D6D80 !default; // $gray
$theme-dark-gray-700: #92929F !default;
$theme-dark-gray-800: #CDCDDE !default; // $gray-dark
$theme-dark-gray-900: #FFFFFF !default;