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

/* Custom scrollbar styles */
@layer utilities {
    /* Firefox */
    .scrollbar-thin {
        scrollbar-width: thin;
        scrollbar-color: rgb(209 213 219) rgb(243 244 246);
    }

    /* Webkit browsers (Chrome, Safari, Edge) */
    .scrollbar-thin::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }

    .scrollbar-thin::-webkit-scrollbar-track {
        background: rgb(243 244 246);
        border-radius: 3px;
    }

    .scrollbar-thin::-webkit-scrollbar-thumb {
        background: rgb(209 213 219);
        border-radius: 3px;
    }

    .scrollbar-thin::-webkit-scrollbar-thumb:hover {
        background: rgb(156 163 175);
    }

    /* Mobile touch scrolling improvements */
    .scrollbar-thin {
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }
}

@font-face {
    font-family: 'GothamPro';
    src: url('./Gotham Cyrillic/GothaProReg.otf') format('opentype');
    font-display: swap;
    font-weight: 300;
    font-style: normal;
}

html, body {
    font-size: 20px;
    line-height: 1.5;
    font-family: GothamPro, sans-serif;
    font-weight: 300;
}