body[data-theme="dark"] {
  --t-color-dark: #FFFFFF;
  --t-color-dark-rgb: 255, 255, 255;
  --t-color-light: #19191C;

  --t-color-light-gray: #363636;
  --t-color-medium-gray: #5C5C5C;
  --t-color-dark-gray: #F2F2F2;
  --t-color-head: #5F6C73;

  --q-color-accent: #008DEC;
  --t-color-accent-rgb: 0, 141, 236;
  --q-color-info: #5c90a9;

  --t-box-shadow:
    0px 4px 4px rgba(220, 204, 196, 0.16),
    0px 2px 2px rgba(220, 204, 196, 0.24);
  --t-box-shadow2:
    0px 1px 0px rgba(220, 204, 196, 0.32);
  --t-image-noitems: url('/statics/logo/dark-ruhavik-noitems.svg');
}

body[data-theme="dark"] .scroll::-webkit-scrollbar,
body[data-theme="dark"] .scroll-y::-webkit-scrollbar {
  -webkit-appearance: none;
  background-color: var(--t-color-medium-gray);
  width: 7.5px;
}

body[data-theme="dark"] .scroll::-webkit-scrollbar-thumb,
body[data-theme="dark"] .scroll-y::-webkit-scrollbar-thumb {
  background-color: var(--t-color-light);
  border: solid 1px var(--t-color-medium-gray);
}

body[data-theme="dark"] #blank-layout .page {
  background-color: var(--t-color-light);
}

body[data-theme="dark"] #blank-layout .page__bg-container {
  filter: brightness(0.35) opacity(0.35) grayscale(1);
}

body[data-theme="dark"] #blank-layout .auth__button {
  background-color: var(--t-color-light-gray);
}

/* TODO: depends on our box-shadow */
body[data-theme="dark"] .shadow-1,
body[data-theme="dark"] .shadow-2 {
  box-shadow: var(--t-box-shadow);
}

body[data-theme="dark"] .shadow-10 {
  box-shadow: var(--t-box-shadow);
}

body[data-theme="dark"] .q-dialog__inner > div {
  box-shadow: var(--t-box-shadow);
}

body[data-theme="dark"] #check-app-version .q-card {
  color: var(--t-color-light);
}

body[data-theme="dark"] .q-btn.disabled {
  opacity: 0.35 !important;
}

@media (min-width: 600px) {
  body[data-theme="dark"] .scroll::-webkit-scrollbar,
  body[data-theme="dark"] .scroll-y::-webkit-scrollbar {
    width: auto;
  }
}
