<script setup>
import { ModalsContainer } from 'vue-final-modal'
import { useHead } from '@vueuse/head'
import CToasts from './components/CToasts/CToasts.vue'

useHead({
  link: [
    {
      href: 'https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Round|Material+Icons+Sharp|Material+Icons+Two+Tone',
      rel: 'stylesheet',
    },
  ],
})
</script>

<template>
  <CToasts />
  <slot />

  <ModalsContainer />
</template>

<style>
:root {
  --q-primary: mediumslateblue;
  --q-positive: #7c68ee80;
  --q-warning: #ff6d6d;
  --q-accent: #f2961c;
  --q-negative: #0dee0d;
}

body {
  -webkit-text-size-adjust: 100%;
  font-family: var(--font-family-base);
  color: var(--c-text);
}
</style>
