@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&family=Raleway:wght@600;700;800&display=swap');

:root {
  --primary: #556270;
  --primary-foreground: #ffffff;
  --secondary: #d9232d;
  --secondary-foreground: #ffffff;
  --background: #ffffff;
  --surface: #ffffff;
  --surface-subtle: #f7f8f9;
  --surface-control: #fafafa;
  --foreground: #26313b;
  --muted-foreground: #66727d;
  --border: #e2e5e8;
  --focus-ring: color-mix(in srgb, #d9232d 28%, white);
  --map-marker-color: #d9232d;
  --map-marker-selected: #556270;
  --map-cluster: #556270;
  --font-family: 'Open Sans', 'Segoe UI', sans-serif;
}

:where(h1, h2, h3, h4, h5, h6, .title, ion-title) {
  font-family: 'Raleway', 'Segoe UI', sans-serif;
}

ion-app {
  --background: #ffffff;
  --surface: #ffffff;
  --mobile-tabs-active: #d9232d;
}