@import "@vuepress/plugin-palette/palette";
@import "_color";
$MQMobile: 719px;
$contentClass: ".theme-default-content";

html[theme="dark"] {
  --accentColor: #{$accentDarkColor};
  --textColor: #{$textDarkColor};
  --borderColor: #{$borderDarkColor};
  --codeBgColor: #{$codeBgDarkColor};
  --arrowBgColor: #{$arrowBgDarkColor};
  --tipColor: #{$tipDarkColor};
  --tipBackgroundColor: #{$tipBackgroundDarkColor};
  --warningColor: #{$warningDarkColor};
  --dangerColor: #{$dangerDarkColor};
  --badgeTipColor: #{$badgeTipDarkColor};
  --badgeWarningColor: #{$badgeWarningDarkColor};
  --badgeDangerColor: #{$badgeDangerDarkColor};
  --backgroundColor: #{$backgroundDarkColor};
  --kbdBackgroundColor: #{$kbdBackgroundDarkColor};
  --kbdBorderColor: #{$kbdBorderDarkColor};
  --tableBorderColor: #{$tableBorderDarkColor};
  --tableBackgroundColor: #{$tableBackgroundDarkColor};
  --metaItemColor: #{$metaItemDarkColor};
  --dangerBgDarkColor: #{$dangerBgDarkColor};
  --warningBgDarkColor: #{$warningBgDarkColor};
  --miniCodeBgColor: #{$miniCodeBgDarkColor};
  --search-border-color: #{$miniCodeBgDarkColor};
  --search-item-focus-bg-color: #{$kbdBackgroundDarkColor};
  --search-accent-color: #{$accentDarkColor};
  --search-text-color: #{$textDarkColor};

  --textColorLighten10: #{lighten($textDarkColor, 7%)};
  --textColorLighten25: #{lighten($textDarkColor, 10%)};
  --textColorLighten40: #{lighten($textDarkColor, 15%)};
  --accentColorLighten8: #{lighten($accentDarkColor, 8%)};
  --accentColorLighten10: #{lighten($accentDarkColor, 10%)};
  --accentColorLighten30: #{lighten($accentDarkColor, 30%)};
}

html[theme="light"] {
  --accentColor: #{$accentLightColor};
  --textColor: #{$textLightColor};
  --borderColor: #{$borderLightColor};
  --codeBgColor: #{$codeBgLightColor};
  --arrowBgColor: #{$arrowBgLightColor};
  --tipColor: #{$tipLightColor};
  --tipBackgroundColor: #{$tipBackgroundLightColor};
  --warningColor: #{$warningLightColor};
  --dangerColor: #{$dangerLightColor};
  --badgeTipColor: #{$badgeTipLightColor};
  --badgeWarningColor: #{$badgeWarningLightColor};
  --badgeDangerColor: #{$badgeDangerLightColor};
  --backgroundColor: #{$backgroundLightColor};
  --kbdBackgroundColor: #{$kbdBackgroundLightColor};
  --kbdBorderColor: #{$kbdBorderLightColor};
  --tableBorderColor: #{$tableBorderLightColor};
  --tableBackgroundColor: #{$tableBackgroundLightColor};
  --metaItemColor: #{$metaItemLightColor};
  --dangerBgDarkColor: #{$dangerBgLightColor};
  --warningBgDarkColor: #{$warningBgLightColor};
  --miniCodeBgColor: #{$miniCodeBgLightColor};
  --search-accent-color: #{$accentLightColor};

  --textColorLighten10: #{lighten($textLightColor, 10%)};
  --textColorLighten25: #{lighten($textLightColor, 20%)};
  --textColorLighten40: #{lighten($textLightColor, 30%)};
  --accentColorLighten8: #{lighten($accentLightColor, 8%)};
  --accentColorLighten10: #{lighten($accentLightColor, 12%)};
  --accentColorLighten30: #{lighten($accentLightColor, 30%)};
}