@import '_variables';

:root {
  // Light theme colors
  --theme-color: #{$themeColor};
  --bg-color: #{$bgColor};
  --deep-bg-color: #{$deepBgColor};
  --inline-code-bg-color: #{$inlineCodeBgColor};
  --block-code-bg-color: #{$blockCodeBgColor};
  --highlight-line-bg-color: #{$highlightLineBgColor};
  --tip-bg-color: #{$tipBgColor};
  --warning-bg-color: #{$warningBgColor};
  --danger-bg-color: #{$dangerBgColor};
  --reference-bg-color: #{$referenceBgColor};
  --text-color: #{$textPrimaryColor};
  --text-secondary-color: #{$textSecondaryColor};
  --text-tertiary-color: #{$textTertiaryColor};
  --code-color: #{$codeColor};
  --tip-color: #{$tipColor};
  --warning-color: #{$warningColor};
  --danger-color: #{$dangerColor};
  --border-color: #{$borderColor};
  --tip-border-color: #{$tipBorderColor};
  --warning-border-color: #{$warningBorderColor};
  --danger-border-color: #{$dangerBorderColor};
  --reference-border-color: #{$referenceBorderColor};
  --link-color: #{$linkColor};
  --scrollbar-color: rgba(0, 0, 0, 0.25);
  --scrollbar-color-hover: rgba(0, 0, 0, 0.4);

  // Fonts definition
  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial,
    sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  --code-font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
}

html[data-theme='dark'] {
  // Dark theme colors
  --theme-color: #{$themeDarkColor};
  --bg-color: #{$bgDarkColor};
  --deep-bg-color: #{$deepBgDarkColor};
  --inline-code-bg-color: #{$inlineCodeBgDarkColor};
  --block-code-bg-color: #{$blockCodeBgDarkColor};
  --highlight-line-bg-color: #{$highlightLineBgDarkColor};
  --tip-bg-color: #{$tipBgDarkColor};
  --warning-bg-color: #{$warningBgDarkColor};
  --danger-bg-color: #{$dangerBgDarkColor};
  --reference-bg-color: #{$referenceBgDarkColor};
  --text-color: #{$textPrimaryDarkColor};
  --text-secondary-color: #{$textSecondaryDarkColor};
  --text-tertiary-color: #{$textTertiaryDarkColor};
  --code-color: #{$codeDarkColor};
  --tip-color: #{$tipDarkColor};
  --warning-color: #{$warningDarkColor};
  --danger-color: #{$dangerDarkColor};
  --border-color: #{$borderDarkColor};
  --tip-border-color: #{$tipBorderDarkColor};
  --warning-border-color: #{$warningBorderDarkColor};
  --danger-border-color: #{$dangerBorderDarkColor};
  --reference-border-color: #{$referenceBorderDarkColor};
  --link-color: #{$linkDarkColor};
  --scrollbar-color: rgba(192, 183, 183, 0.25);
  --scrollbar-color-hover: rgba(116, 109, 109, 0.4);
}