/* Document Level Styles */

/* Colors can be accessible in HTML by property color="--ion-color-myColor"  */
/* and in CSS by var function var(--ion-color-myColor) */

body {
  background: var(--ion-color-primary-shade);
}

@font-face {
  font-family: 'BlissPro';
  src: url('../resources/fonts/BlissPro-Regular.otf') format('opentype');
}
@font-face {
  font-family: 'BlissPro';
  src: url('../resources/fonts/BlissPro-Bold.otf') format('opentype');
  font-weight: bold;
}
@font-face {
  font-family: 'BlissPro';
  src: url('../resources/fonts/BlissPro-MediumItalic.otf') format('opentype');
  font-style: italic;
}

.loader {
  --spinner-color: var(--ion-color-tertiary);
}

.alert-button-color {
  --ion-color-primary: var(--ion-text-color);
}

.slides-ios {
  --bullet-background: var(--ion-color-secondary) !important;
  --bullet-background-active: var(--ion-color-secondary) !important;
}

.slides-md {
  --bullet-background: var(--ion-color-secondary) !important;
  --bullet-background-active: var(--ion-color-secondary) !important;
}

/** Ionic CSS Variables **/
:root {
  /* main properties */
  --ion-font-family: 'BlissPro';
  font-family: 'BlissPro';
  color: var(--ion-color-primary-contrast);
  --ion-padding: 8px;
  --ion-margin: 8px;

  /* MAIN CHARACTERISTICS OF THE APP */
  --ion-color-unselected-tab: #989898;
  --ion-color-base: var(--ion-color-dark);
  --ion-color-base-rgb: 0, 0, 0;
  --ion-background-color-rgb: 228, 228, 228;
  --font-size-small: 14px;
  --font-size-xmedium: 16px;
  --font-size-medium: 18px;
  --font-size-big: 20px;
  --font-weight-small: 500;
  --font-weight-medium: 600;
  --font-family-title: 'BlissPro';
  --ion-text-color: var(--ion-color-dark);
  --ion-text-color-rgb: 0, 0, 0;
  --spotlight-po-line-height: calc(3*var(--ion-margin));

  /* COLORS */
  --ion-color-primary: #F8CF00;
	--ion-color-primary-rgb: 248,207,0;
	--ion-color-primary-contrast: #000000;
	--ion-color-primary-contrast-rgb: 0,0,0;
	--ion-color-primary-shade: #dab600;
	--ion-color-primary-tint: #f9d41a;

  --ion-color-secondary: #F4CE00;
	--ion-color-secondary-rgb: 244,206,0;
	--ion-color-secondary-contrast: #000000;
	--ion-color-secondary-contrast-rgb: 0,0,0;
	--ion-color-secondary-shade: #d7b500;
	--ion-color-secondary-tint: #f5d31a;

  --ion-color-tertiary: #D7ECFD;
	--ion-color-tertiary-rgb: 215,236,253;
	--ion-color-tertiary-contrast: #000000;
	--ion-color-tertiary-contrast-rgb: 0,0,0;
	--ion-color-tertiary-shade: #bdd0df;
	--ion-color-tertiary-tint: #dbeefd;

  --ion-color-success: #9dcb07;
  --ion-color-success-rgb: 157, 203, 7;
  --ion-color-success-contrast: #ffffff;
  --ion-color-success-contrast-rgb: 255, 255, 255;
  --ion-color-success-shade: #8ab306;
  --ion-color-success-tint: #a7d020;

  --ion-color-warning: #ff9200;
  --ion-color-warning-rgb: 255, 146, 0;
  --ion-color-warning-contrast: #ffffff;
  --ion-color-warning-contrast-rgb: 255, 255, 255;
  --ion-color-warning-shade: #e08000;
  --ion-color-warning-tint: #ff9d1a;

  --ion-color-danger: #970032;
  --ion-color-danger-rgb: 151, 0, 50;
  --ion-color-danger-contrast: #ffffff;
  --ion-color-danger-contrast-rgb: 255, 255, 255;
  --ion-color-danger-shade: #85002c;
  --ion-color-danger-tint: #a11a47;

  --ion-color-dark: #000000;
	--ion-color-dark-rgb: 0,0,0;
	--ion-color-dark-contrast: #ffffff;
	--ion-color-dark-contrast-rgb: 255,255,255;
	--ion-color-dark-shade: #000000;
	--ion-color-dark-tint: #1a1a1a;

  --ion-color-medium: #73829a;
  --ion-color-medium-rgb: 115, 130, 154;
  --ion-color-medium-contrast: #ffffff;
  --ion-color-medium-contrast-rgb: 255, 255, 255;
  --ion-color-medium-shade: #657288;
  --ion-color-medium-tint: #818fa4;

  --ion-color-light: #ffffff;
  --ion-color-light-rgb: 255, 255, 255;
  --ion-color-light-contrast: #000000;
  --ion-color-light-contrast-rgb: 0, 0, 0;
  --ion-color-light-shade: #e0e0e0;
  --ion-color-light-tint: #ffffff;
}