@import url('https://fonts.googleapis.com/css2?family=Noto+Emoji:wght@300..700&display=swap');

:root {
  /* Light colors */
  --primary-light: #fda800;
  --text-light: #364149;
  --accent-light: #0077fd;
  --background-light: #f8f8fb;
  --surface-light: #fefefe;
  --border-light: 1px solid #bbbcbd4d;
  --shadow-light: 0px 1px 2.2px #67676a05, 0px 2.4px 5.3px -5px #67676a07,
    0px 4.5px 10px -5px #67676a09, 0px 8px 17.9px -5px #67676a0b,
    0px 15px 33.4px -5px #67676a0d, 0px 36px 80px -5px #67676a12;

  /* Dark colors */
  --primary-dark: #d78a00;
  --text-dark: #d2d9df;
  --accent-dark: #0069d7;
  --background-dark: #0f2437;
  --surface-dark: #242729;
  --border-dark: 1px solid #bbbcbc26;
  --shadow-dark: 0px 1px 2.2px #00000024, 0px 2.4px 5.3px -5px #00000034,
    0px 4.5px 10px -5px #00000040, 0px 8px 17.9px -5px #0000004c,
    0px 15px 33.4px -5px #0000005c, 0px 36px 80px -5px #00000080;

  /* default theme color */
  /* can be overrided by uses `themeConfig` option */
  --slidev-theme-primary: var(--primary-light);
  --slidev-code-background: var(--surface-light);
  --border: var(--border-light);
  --shadow: var(--shadow-light);
}

html.dark {
  --slidev-theme-primary: var(--primary-dark);
  --slidev-code-background: var(--surface-dark);
  --border: var(--border-dark);
  --shadow: var(--shadow-dark);
}

#slide-container #slide-content {
  background-color: var(--background-light);
}

.dark #slide-container #slide-content {
  background-color: var(--background-dark);
}