@import 'tailwindcss';
@import "@vue-flow/core/dist/style.css";
@import "@vue-flow/core/dist/theme-default.css";

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';

@layer base {
    @font-face {
        font-family: "v-sans";
        font-weight: 400;
        src: url("/fonts/Golos-Text_Regular.woff2");
    }

    @font-face {
        font-family: "v-sans";
        font-weight: 500;
        src: url("/fonts/Golos-Text_Medium.woff2");
    }

    @font-face {
        font-family: "v-sans";
        font-weight: 600;
        src: url("/fonts/Golos-Text_DemiBold.woff2");
    }

    @font-face {
        font-family: "v-sans";
        font-weight: 700;
        src: url("/fonts/Golos-Text_Bold.woff2");
    }

    @font-face {
        font-family: "v-sans";
        font-weight: 800;
        src: url("/fonts/Golos-Text_Black.woff2");
    }

    body {
        background-image:
        radial-gradient(
            circle at top center,
            color-mix(in oklch, var(--primary) 10%, transparent) 0,
            transparent 34rem
        ),
        radial-gradient(
            circle at bottom left,
            color-mix(in oklch, var(--chart-2) 12%, transparent) 0,
            transparent 26rem
        );
        min-height: 100vh;
  }
}

@layer utilities {
  .grid-overlay {
    background-image:
      linear-gradient(
        to right,
        color-mix(in oklch, var(--color-neutral-800) 50%, transparent) 1px,
        transparent 1px
      ),
      linear-gradient(
        to bottom,
        color-mix(in oklch, var(--color-neutral-800) 45%, transparent) 1px,
        transparent 1px
      );
    background-size: 40px 40px;
  }
}

@theme {
    --font-sans: 'v-sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
        'Segoe UI Symbol', 'Noto Color Emoji';
}