/* Disable scrolling on the body */
#map-section {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: calc(100vh - 8rem); /* Adjust for header height */
}

@media (min-width: 1024px) {
    #map-section {
        height: calc(100vh - 4rem); /* Height for desktop */
    }
}
:root {
    --map-water-color: #CAE9F5; /* Light blue for white mode */
}

.white-mode :root {
    --map-water-color: #001926; /* Dark blue for dark mode */
}

#chartdiv {
    width: 100%;
    height: 100%;
    transition: background-color 0.3s ease; /* Smooth background transition */
    will-change: transform;
    transform: translate3d(0, 0, 0);
}