:root {
  --white_100: #ffffff;
  --white_075: #ffffffbf;
  --white_025: hsla(0, 0%, 100%, 0.25);

  --black_100: hsla(0, 0, 0, 1);
  --black_075: hsla(0, 0, 0, 0.75);
  --black_025: hsla(0, 0%, 0%, 0.25);

  --light-color: #e8eef2;
  --dark-color: #121212;

  --theme-color: #000000;
  --accent-color: #273e47;
  --caution-color: #fc9e4f;
  --danger-color: #bf0603;
}

[data-color-scheme="dark"] {
  color-scheme: dark;
}

[data-color-scheme="light"] {
  color-scheme: light;
}

.dark_color_theme {
  --background_color: var(--dark-color);
  --font_color: var(--light-color);

  --item_background_color: var(--dark1_100);
  --item_background_color_hover: var(--dark3_075);

  --accent-color-theme-based: rgba(39, 62, 71, 0.25);

  --dev-background-color:  #c95c03;

  --dim-font: var(--white_075);

  --top-read-color: var(--dark1_075);
  --bottom-read-color: var(--dark1_025);
  --bottom-read-color-hover: var(--dark1_075);
}

.dark_color_theme ::-moz-selection {
  color: rgb(0, 0, 0);
  background: #cccccc;
  -webkit-backdrop-filter: blur(13px);
  backdrop-filter: blur(13px);
}

.dark_color_theme ::selection {
  color: rgb(0, 0, 0);
  background: #cccccc;
  -webkit-backdrop-filter: blur(13px);
  backdrop-filter: blur(13px);
}

.dark_color_theme *,
.dark_color_theme *:before,
.dark_color_theme *:after {
  color-scheme: dark;
}

.light_color_theme {
  --background_color: var(--light-background);

  --font_color: var(--dark1_100);

  --item_background_color: var(--light1_100);
  --item_background_color_hover: var(--light3_100);

  --accent-color-theme-based: hsla(204, 28%, 93%, 0.50);


  --dev-background-color: var(--caution-color);

  --dim-font: var(--black_075);

  --top-read-color: var(--light1_075);
  --bottom-read-color: var(--light1_025);
  --bottom-read-color-hover: var(--light1_075);

  --bottom_bar_correction: var(--light-color);
}

.light_color_theme ::-moz-selection {
  color: rgb(0, 0, 0);
  background: rgb(190, 190, 190);
  -webkit-backdrop-filter: blur(13px);
  backdrop-filter: blur(13px);
}

.light_color_theme ::selection {
  color: rgb(0, 0, 0);
  background: rgb(190, 190, 190);
  -webkit-backdrop-filter: blur(13px);
  backdrop-filter: blur(13px);
}

.light_color_theme *,
.light_color_theme *:before,
.light_color_theme *:after {
  color-scheme: light;
}