@mixin dark_properties {
  // fonts
  --app-font-body: 'Arial', sans-serif;
  --app-font-head: 'Arial', sans-serif;
  --app-font-quote: 'Times New Roman', cursive;
  --app-font-code: 'Consolas', monospace;
  // sizes
  --app-size-font: 16px;
  --app-size-spacing: 16px;
  --app-size-radius: 3px;
  --app-size-border: 1px;
  --app-size-shadow: 0 0 0 0 var(--app-color-background-contrast);
  // colors -> https://ionicframework.com/docs/theming/color-generator
  --app-color-primary: #3880ff;
  --app-color-primary-rgb: 56,128,255;
  --app-color-primary-contrast: #ffffff;
  --app-color-primary-contrast-rgb: 255,255,255;
  --app-color-primary-shade: #3171e0;
  --app-color-primary-tint: #4c8dff;
  --app-color-secondary: #3dc2ff;
  --app-color-secondary-rgb: 61,194,255;
  --app-color-secondary-contrast: #ffffff;
  --app-color-secondary-contrast-rgb: 255,255,255;
  --app-color-secondary-shade: #36abe0;
  --app-color-secondary-tint: #50c8ff;
  --app-color-tertiary: #5260ff;
  --app-color-tertiary-rgb: 82,96,255;
  --app-color-tertiary-contrast: #ffffff;
  --app-color-tertiary-contrast-rgb: 255,255,255;
  --app-color-tertiary-shade: #4854e0;
  --app-color-tertiary-tint: #6370ff;
  --app-color-success: #2dd36f;
  --app-color-success-rgb: 45,211,111;
  --app-color-success-contrast: #ffffff;
  --app-color-success-contrast-rgb: 255,255,255;
  --app-color-success-shade: #28ba62;
  --app-color-success-tint: #42d77d;
  --app-color-warning: #ffc409;
  --app-color-warning-rgb: 255,196,9;
  --app-color-warning-contrast: #000000;
  --app-color-warning-contrast-rgb: 0,0,0;
  --app-color-warning-shade: #e0ac08;
  --app-color-warning-tint: #ffca22;
  --app-color-danger: #eb445a;
  --app-color-danger-rgb: 235,68,90;
  --app-color-danger-contrast: #ffffff;
  --app-color-danger-contrast-rgb: 255,255,255;
  --app-color-danger-shade: #cf3c4f;
  --app-color-danger-tint: #ed576b;
  --app-color-dark: #222428;
  --app-color-dark-rgb: 34,36,40;
  --app-color-dark-contrast: #ffffff;
  --app-color-dark-contrast-rgb: 255,255,255;
  --app-color-dark-shade: #1e2023;
  --app-color-dark-tint: #383a3e;
  --app-color-medium: #92949c;
  --app-color-medium-rgb: 146,148,156;
  --app-color-medium-contrast: #ffffff;
  --app-color-medium-contrast-rgb: 255,255,255;
  --app-color-medium-shade: #808289;
  --app-color-medium-tint: #9d9fa6;
  --app-color-light: #f4f5f8;
  --app-color-light-rgb: 244,245,248;
  --app-color-light-contrast: #000000;
  --app-color-light-contrast-rgb: 0,0,0;
  --app-color-light-shade: #d7d8da;
  --app-color-light-tint: #ffffff;  
  --app-color-background: var(--app-color-dark);
  --app-color-background-rgb: var(--app-color-dark-rgb);
  --app-color-background-contrast: var(--app-color-dark-contrast);
  --app-color-background-contrast-rgb: var(--app-color-dark-contrast-rgb);
  --app-color-background-shade: var(--app-color-dark-shade);
  --app-color-background-tint: var(--app-color-dark-tint);
  --app-color-foreground: var(--app-color-light);
  --app-color-foreground-rgb: var(--app-color-light-rgb);
  --app-color-foreground-contrast: var(--app-color-light-contrast);
  --app-color-foreground-contrast-rgb: var(--app-color-light-contrast-rgb);
  --app-color-foreground-shade: var(--app-color-light-shade);
  --app-color-foreground-tint: var(--app-color-light-tint);
  // recolors
  --app-recolor-primary: brightness(0) saturate(100%) invert(37%) sepia(73%) saturate(1013%) hue-rotate(193deg) brightness(106%) contrast(104%);
  --app-recolor-secondary: brightness(0) saturate(100%) invert(74%) sepia(18%) saturate(6644%) hue-rotate(169deg) brightness(100%) contrast(102%);
  --app-recolor-tertiary: brightness(0) saturate(100%) invert(47%) sepia(57%) saturate(6714%) hue-rotate(225deg) brightness(99%) contrast(106%);
  --app-recolor-success: brightness(0) saturate(100%) invert(90%) sepia(90%) saturate(2470%) hue-rotate(65deg) brightness(90%) contrast(82%);
  --app-recolor-warning: brightness(0) saturate(100%) invert(67%) sepia(91%) saturate(443%) hue-rotate(357deg) brightness(99%) contrast(106%);
  --app-recolor-danger: brightness(0) saturate(100%) invert(45%) sepia(84%) saturate(2892%) hue-rotate(324deg) brightness(91%) contrast(102%);
  --app-recolor-dark: brightness(0) saturate(100%) invert(10%) sepia(6%) saturate(1068%) hue-rotate(182deg) brightness(102%) contrast(91%);
  --app-recolor-medium: brightness(0) saturate(100%) invert(68%) sepia(9%) saturate(244%) hue-rotate(191deg) brightness(86%) contrast(85%);
  --app-recolor-light: brightness(0) saturate(100%) invert(91%) sepia(2%) saturate(192%) hue-rotate(188deg) brightness(108%) contrast(96%);
  --app-recolor-background: var(--app-recolor-dark);
  --app-recolor-foreground: var(--app-recolor-light);
  // gradients
  --app-gradient-primary: linear-gradient(135deg, var(--app-color-primary-tint) 0%, var(--app-color-primary-shade) 100%);
  --app-gradient-secondary: linear-gradient(135deg, var(--app-color-secondary-tint) 0%, var(--app-color-secondary-shade) 100%);
  --app-gradient-tertiary: linear-gradient(135deg, var(--app-color-tertiary-tint) 0%, var(--app-color-tertiary-shade) 100%);
  --app-gradient-success: linear-gradient(135deg, var(--app-color-success-tint) 0%, var(--app-color-success-shade) 100%);
  --app-gradient-warning: linear-gradient(135deg, var(--app-color-warning-tint) 0%, var(--app-color-warning-shade) 100%);
  --app-gradient-danger: linear-gradient(135deg, var(--app-color-danger-tint) 0%, var(--app-color-danger-shade) 100%);
  --app-gradient-dark: linear-gradient(135deg, var(--app-color-dark-tint) 0%, var(--app-color-dark-shade) 100%);
  --app-gradient-medium: linear-gradient(135deg, var(--app-color-medium-tint) 0%, var(--app-color-medium-shade) 100%);
  --app-gradient-light: linear-gradient(135deg, var(--app-color-light-tint) 0%, var(--app-color-light-shade) 100%);
  // images
  --app-image-primary: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=');
  --app-image-secondary: var(--app-image-primary);
  --app-image-tertiary: var(--app-image-primary);
  --app-image-success: var(--app-image-primary);
  --app-image-warning: var(--app-image-primary);
  --app-image-danger: var(--app-image-primary);
  --app-image-dark: var(--app-image-primary);
  --app-image-medium: var(--app-image-primary);
  --app-image-light: var(--app-image-primary);
  --app-image-background: var(--app-image-primary);
  --app-image-foreground: var(--app-image-primary);
  --app-image-header: var(--app-image-primary);
  --app-image-footer: var(--app-image-primary);
  --app-image-sidebar: var(--app-image-primary);
  --app-image-tabs: var(--app-image-primary);
  --app-image-featured: var(--app-image-primary);
  --app-image-1st: var(--app-image-primary);
  --app-image-2nd: var(--app-image-primary);
  --app-image-3rd: var(--app-image-primary);
}