@use 'sass:math';
@use 'sass:map';

@forward 'element-plus/theme-chalk/src/dark/var';
@use 'element-plus/theme-chalk/src/common/var' as common;
@use 'element-plus/theme-chalk/src/dark/var' as *;
@use 'element-plus/theme-chalk/src/mixins/function' as *;
@use '../mixins/function' as pdFn;
@use 'element-plus/theme-chalk/src/mixins/function' as elFn;

// Background
$pd-bg-color: () !default;
$pd-bg-color: map.merge(
  (
    'mute': #2c2c2c,
  ),
  $pd-bg-color
);

// dark-mode
@each $type in common.$types {
  @for $i from 1 through 9 {
    @include set-color-mix-level($type, $i, 'light', map.get($bg-color, ''));
  }
}

@each $type in common.$types {
  @for $i from 1 through 9 {
    @include set-color-mix-level($type, $i, 'dark', common.$color-white);
  }
}

// Components
// Layout
$layout: () !default;
$layout: map.merge(
  (
    'top-menu-bg-color': elFn.getCssVar('bg-color'),
    'side-menu-bg-color': elFn.getCssVar('bg-color'),
    'sub-menu-bg-color': elFn.getCssVar('bg-color'),
    'main-bg-color': #000,
    'content-bg-color': elFn.getCssVar('bg-color'),
    'tabs-bg-color': elFn.getCssVar('bg-color'),
    'tabs-border-bottom-color': transparent,
  ),
  $layout
);