body { 
    background-color: #F9FAFB; 
}

/* Styles responsive pour les graphes Plotly KPIs */
.kpis-plot {
    width: 100% !important;
    max-width: 100% !important;
    height: 500px !important;
    margin-bottom: 30px;
}

.kpis-plot .js-plotly-plot,
.kpis-plot .plotly,
.kpis-plot .plot-container {
    width: 100% !important;
    height: 500px !important;
}

.kpis-plot .main-svg {
    width: 100% !important;
    height: 500px !important;
}

/* Responsive pour différentes tailles d'écran */
@media (max-width: 768px) {
    .kpis-plot {
        height: 400px !important;
    }
    
    .kpis-plot .js-plotly-plot,
    .kpis-plot .plotly,
    .kpis-plot .plot-container {
        height: 400px !important;
    }
    
    .kpis-plot .main-svg {
        height: 400px !important;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .kpis-plot {
        height: 450px !important;
    }
    
    .kpis-plot .js-plotly-plot,
    .kpis-plot .plotly,
    .kpis-plot .plot-container {
        height: 450px !important;
    }
    
    .kpis-plot .main-svg {
        height: 450px !important;
    }
}

@media (min-width: 1025px) {
    .kpis-plot {
        height: 500px !important;
    }
    
    .kpis-plot .js-plotly-plot,
    .kpis-plot .plotly,
    .kpis-plot .plot-container {
        height: 500px !important;
    }
    
    .kpis-plot .main-svg {
        height: 500px !important;
    }
}