@import 'tailwindcss';

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.{js,ts,vue}';

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

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

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

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

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

    body {
        min-height: 100vh;
    }
}

@layer utilities {
    .grid-overlay {
        background-image:
            linear-gradient(
                to right,
                color-mix(in srgb, var(--color-neutral-800) 50%, transparent)
                    1px,
                transparent 1px
            ),
            linear-gradient(
                to bottom,
                color-mix(in srgb, 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';
}