@use "sass:color";

$primary-color: #4285f4 !default;
$base-bg: #2a2a2e !default;

$item-color: #fff !default;

$item-active-color: null !default;
$item-active-bg: null !default;
$item-active-line-color: $primary-color !default;

$item-open-color: #fff !default;
$item-open-bg: $primary-color !default;

$item-hover-color: null !default;
$item-hover-bg: rgba(color.adjust($base-bg, $lightness: -5%), 0.5) !default;

$icon-color: $item-color !default;
$icon-bg: color.adjust($base-bg, $lightness: -5%) !default;

$icon-active-color: null !default;
$icon-active-bg: null !default;

$icon-open-color: null !default;
$icon-open-bg: null !default;

$mobile-item-color: #fff !default;
$mobile-item-bg: $primary-color !default;
$mobile-icon-color: $mobile-item-color !default;
$mobile-icon-bg: transparent !default;

$dropdown-color: null !default;
$dropdown-bg: color.adjust($base-bg, $lightness: 5%) !default;

$header-item-color: rgba($item-color, 0.7) !default;

$toggle-btn-color: #fff !default;
$toggle-btn-bg: color.adjust($base-bg, $lightness: -5%) !default;

$badge-color: #fff !default;
$badge-bg: color.adjust($base-bg, $lightness: -5%) !default;

$item-font-size: 16px !default;
$item-line-height: 35px !default;
$item-padding: 10px 15px !default;
$icon-height: 35px !default;
$icon-width: 35px !default;