import { createVuetify } from 'vuetify'
import * as components from 'vuetify/components'
import * as directives from 'vuetify/directives'
import { aliases, mdi } from 'vuetify/iconsets/mdi'

export default defineNuxtPlugin((app) => {
  const vuetify = createVuetify({
    components,
    directives,
    icons: {
      defaultSet: 'mdi',
      aliases,
      sets: { mdi },
    },
    theme: {
      defaultTheme: 'light',
      themes: {
        light: {
          colors: {
            primary: '#29A4A7',
            secondary: '#EC9A1E',
            info: '#607D8B',
            warning: '#B00020',
            error: '#F44336',
            success: '#4CAF50',
          },
        },
      },
    },
    defaults: {
      VBtn: {
        style: 'text-transform: none; letter-spacing: 0;',
      },
      VTextField: {
        variant: 'outlined',
        density: 'comfortable',
      },
      VSelect: {
        variant: 'outlined',
        density: 'comfortable',
      },
      VTextarea: {
        variant: 'outlined',
        density: 'comfortable',
      },
    },
  })

  app.vueApp.use(vuetify)
})