/* Dark Mode Styles for Dashboard */
#financialData.dark-mode {
    background-color: #000000; /* Dark background */
    color: #ffffff; /* Light text */
}

    #financialData.dark-mode h3,
    #financialData.dark-mode label,
    #financialData.dark-mode .rz-legend-item-text {
        color: #ffffff; /* Light text for headings and labels */
    }

    /* Card Styling */
    #financialData.dark-mode .card {
        background-color: #424549; /* Dark card background */
        box-shadow: 0 0 10px rgba(255, 255, 255, 0.1); /* Light shadow */
    }

    /* Revenue, Expenses, Receivable, Payable Boxes */
    #financialData.dark-mode div[style*='background-color: #d0e9f7'],
    #financialData.dark-mode div[style*='background-color: #ffebee'],
    #financialData.dark-mode div[style*='background-color: #e8f5e9'],
    #financialData.dark-mode div[style*='background-color: #f1e5d0'] {
        background-color: #424549; /* Uniform dark background for all boxes */
    }

    /* Chart Elements */
    #financialData.dark-mode .rz-chart {
        background-color: #000000; /* Dark chart background */
    }

    #financialData.dark-mode .rz-line,
    #financialData.dark-mode .rz-tick-line,
    #financialData.dark-mode .rz-marker path,
    #financialData.dark-mode .rz-series-data-label {
        stroke: #ffffff; /* White lines and markers */
    }

    #financialData.dark-mode .rz-legend-items .rz-legend-item {
        border-color: #ffffff; /* White border for legend items */
    }

    #financialData.dark-mode .rz-column-series path,
    #financialData.dark-mode .rz-bar-series path {
        fill: #ffffff; /* White fill for bar and column series */
    }

    #financialData.dark-mode .rz-donut-content div {
        color: #ffffff; /* Donut chart text */
    }

    /* Buttons */
    #financialData.dark-mode button {
        background-color: #7289da; /* Dark button background */
        color: #ffffff; /* Light text */
    }