/* 1. Import font (Configured as 'Inter' in your HTML) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* 2. Basic CSS configuration for smooth behavior */
html {
    scroll-behavior: smooth;
}

body {
    /* Ensure the imported Inter font is applied */
    font-family: 'Inter', sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* 3. Custom Scrollbar for Dark Mode */
/* Default white scrollbars look bad on a dark theme, so we customize them */
::-webkit-scrollbar {
    width: 8px; /* Vertical scrollbar width */
    height: 8px; /* Horizontal scrollbar height */
}

::-webkit-scrollbar-track {
    background: #0f0f0f; /* Scrollbar track background color (Matches bg-dark) */
}

::-webkit-scrollbar-thumb {
    background: #374151; /* Scrollbar thumb color (Gray) */
    border-radius: 10px; /* Rounded corners for the scrollbar thumb */
}

::-webkit-scrollbar-thumb:hover {
    background: #ff6b00; /* Change to brand orange color on hover */
}

/* 4. Fix for tap highlight borders on Mobile */
* {
    -webkit-tap-highlight-color: transparent; /* Remove the default blue tap highlight on mobile devices */
}