@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
    @font-face {
        font-family: 'classico-urw';
        font-style: normal;
        font-weight: 400;
        font-display: swap;
        src: url("/fonts/classico-urw.woff2") format('woff2'), url("/fonts/classico-urw.woff") format('woff')
    }

    @font-face {
        font-family: 'justlovely';
        font-style: normal;
        font-weight: 400;
        font-display: swap;
        src: url("/fonts/JustLovely.woff2") format('woff2'), url("/fonts/JustLovely.woff") format('woff')
    }
}

.h-screen-fixed {
    height: calc(100svh - 66px);
}

.no-scroll {
    overflow: hidden;
    height: 100%;
}

.full-width-image {
    @apply object-cover w-full h-full;
}

.container {
    @apply max-w-7xl w-full mx-auto z-10 px-6;
}

.hover-scoot:hover svg {
    transform: translateX(1rem);
}

input, textarea, select, button {
    @apply rounded-none shadow-none appearance-none;
}

@layer utilities {
    .auto-rows-3 {
        grid-auto-rows: 3fr;
    }

    input:-webkit-autofill {
        @apply bg-white text-black;
    }

    input:-moz-autofill {
        @apply bg-white text-black;
    }
}