/**
 * In SPAs variables get generated based on the theme-config and injected into
 * the head-element. In the ssg-context the whole dom is available immediately.
 * To avoid a flicker we define most important variables, helper-classes here.
 */
:root {
  --v-theme-background: 255,255,255;
  --v-theme-background-overlay-multiplier: 1;
  --v-theme-surface: 255,255,255;
  --v-theme-surface-overlay-multiplier: 1;
  --v-theme-surface-bright: 255,255,255;
  --v-theme-surface-bright-overlay-multiplier: 1;
  --v-theme-surface-variant: 66,66,66;
  --v-theme-surface-variant-overlay-multiplier: 2;
  --v-theme-on-surface-variant: 238,238,238;
  --v-theme-primary: 37,64,143;
  --v-theme-primary-overlay-multiplier: 2;
  --v-theme-primary-darken-1: 55,0,179;
  --v-theme-primary-darken-1-overlay-multiplier: 2;
  --v-theme-tonal: 231,234,242;
  --v-theme-tonal-overlay-multiplier: 1;
  --v-theme-white: 255,255,255;
  --v-theme-white-overlay-multiplier: 1;
  --v-theme-on-background: 0,0,0;
  --v-theme-on-surface: 0,0,0;
  --v-theme-on-surface-bright: 0,0,0;
  --v-theme-on-primary: 255,255,255;
  --v-theme-on-primary-darken-1: 255,255,255;
  --v-theme-on-tonal: 0,0,0;
  --v-theme-on-white: 0,0,0;
  --v-border-color: 0, 0, 0;
  --v-border-opacity: 0.12;
  --v-high-emphasis-opacity: 0.87;
  --v-medium-emphasis-opacity: 0.6;
  --v-disabled-opacity: 0.38;
  --v-hover-opacity: 0.04;
  --v-focus-opacity: 0.12;
  --v-selected-opacity: 0.08;
  --v-activated-opacity: 0.12;
  --v-theme-error: 176,0,32;
}

body {
  font-family: 'Open Sans', sans-serif;
}

.bg-primary {
  --v-theme-overlay-multiplier: var(--v-theme-primary-overlay-multiplier);
  background-color: rgb(var(--v-theme-primary)) !important;
  color: rgb(var(--v-theme-on-primary)) !important;
}

.bg-tonal {
  --v-theme-overlay-multiplier: var(--v-theme-tonal-overlay-multiplier);
  background-color: rgb(var(--v-theme-tonal)) !important;
  color: rgb(var(--v-theme-on-tonal)) !important;
}

.bg-white {
  --v-theme-overlay-multiplier: var(--v-theme-white-overlay-multiplier);
  background-color: rgb(var(--v-theme-white)) !important;
  color: rgb(var(--v-theme-on-white)) !important;
}

.bg-transparent {
  background-color: transparent !important;
}

.text-primary {
  color: rgb(var(--v-theme-primary)) !important;
}

.text-white {
  color: rgb(var(--v-theme-white)) !important;
}

.text-default {
  color: #252525 !important;
}
