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

/* Chart.js Global Dark Config */
.chartjs-defaults {
    color: #9ca3af;
}

.chart-container {
    position: relative;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    height: 300px;
}

@media (min-width: 768px) {
    .chart-container {
        height: 350px;
    }
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #1a1a1a;
}

::-webkit-scrollbar-thumb {
    background: #4b5563;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #6b7280;
}