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

@layer base {
    @font-face {
        font-family: 'Inter';
        src: url('/static/fonts/Inter-Regular.ttf') format('truetype');
        font-weight: 400;
        font-style: normal;
    }

    @font-face {
        font-family: 'Inter';
        src: url('/static/fonts/Inter-Medium.ttf') format('truetype');
        font-weight: 500;
        font-style: normal;
    }

    @font-face {
        font-family: 'Inter';
        src: url('/static/fonts/Inter-SemiBold.ttf') format('truetype');
        font-weight: 600;
        font-style: normal;
    }

    @font-face {
        font-family: 'Inter';
        src: url('/static/fonts/Inter-Bold.ttf') format('truetype');
        font-weight: 700;
        font-style: normal;
    }
}

:root {
    --bg-color: #f6f5fa;
}

body {
    background-color: var(--bg-color);
}

.delete-file {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 1rem;
    width: 1rem;
    border-radius: 50%;
    background-color: #a0a0a0;
    color: #ffffff;
}

.delete-file:hover {
    background-color: #ff6666;
}