/* ==========================================================================
   Variables & Base Settings
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

body {
    font-family: 'Inter', sans-serif;
    background-color: #F8FAFC; /* Slate 50 - Warm Neutral */
    color: #0F172A; /* Slate 900 */
}

/* ==========================================================================
   Layout & Charts
   ========================================================================== */
.chart-container {
    position: relative;
    width: 100%;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
    height: 300px;
    max-height: 350px;
}

/* ==========================================================================
   Custom Scrollbar
   ========================================================================== */
.custom-scroll::-webkit-scrollbar {
    width: 6px;
}
.custom-scroll::-webkit-scrollbar-track {
    background: #F1F5F9; 
}
.custom-scroll::-webkit-scrollbar-thumb {
    background: #CBD5E1; 
    border-radius: 4px;
}
.custom-scroll::-webkit-scrollbar-thumb:hover {
    background: #94A3B8; 
}

/* ==========================================================================
   Calendar Grid
   ========================================================================== */
.calendar-day.active {
    border-color: #0F172A;
    background-color: #F1F5F9;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
}