page, body {
    width: 100%;
    margin: 0px !important;
    font-family: Segoe UI, Tahoma, Verdana, Geneva;
    box-sizing: border-box;
}

/* Responsive Dashboard Layout */
.dashboard-chart {
    width: 400px;
    float: left;
    margin-bottom: 20px;
}

.dashboard-grid {
    width: calc(100% - 420px);
    max-width: calc(100% - 420px); /* Previene l'espansione oltre il limite */
    float: left;
    margin-bottom: 20px;
    box-sizing: border-box; /* Include padding nel calcolo della larghezza */
}

/* Mobile-first responsive breakpoints */
@media (max-width: 768px) {
    .dashboard-chart,
    .dashboard-grid {
        width: 100%;
        float: none;
        padding: 10px;
    }
    
    .dashboard-chart {
        text-align: center;
    }
    
    .dashboard-chart .ej-circulargauge {
        width: 100% !important;
        max-width: 350px;
        margin: 0 auto;
    }
    
    .responsive-grid {
        overflow-x: auto;
    }
    
    .divlogin {
        width: 90%;
        min-width: 300px;
        height: auto;
    }
}

@media (max-width: 1024px) and (min-width: 769px) {
    .dashboard-chart {
        width: 45%;
    }
    
}

/* Tablet optimization */
@media (max-width: 1200px) and (min-width: 1025px) {
    .dashboard-chart {
        width: 35%;
    }

}

/* Statistiche page responsive styles */
.statistiche-legenda {
    width: 100%;
    float: left;
    margin-bottom: 20px;
}

.statistiche-chart {
    width: 400px;
    float: left;
    margin-bottom: 20px;
    text-align: center !important;
}

.statistiche-chart div,
.statistiche-chart p,
.statistiche-chart span {
    text-align: center !important;
}

.statistiche-chart .ej-circulargauge div {
    text-align: center !important;
}

.statistiche-grafico-articoli {
    width: 100%;
    float: none;
    clear: both;
    margin: 20px 0;
    padding: 10px;
}

/* Responsive layout for statistiche */
@media (max-width: 768px) {
    .statistiche-chart,
    .statistiche-grafico-articoli {
        width: 100%;
        float: none;
        padding: 10px;
        box-sizing: border-box;
    }

    .statistiche-chart {
        text-align: center !important;
    }

        .statistiche-chart .ej-circulargauge {
            width: 100% !important;
            max-width: 350px;
            margin: 0;
        }

    /* Fix per ChartVenditeArticoli */
    .statistiche-grafico-articoli {
        display: block !important;
        visibility: visible !important;
        overflow: visible !important;
        min-height: 400px;
    }

        .statistiche-grafico-articoli .ej-chart,
        #ChartVenditeArticoli {
            width: 100% !important;
            height: 400px !important;
            min-height: 300px !important;
            display: block !important;
            visibility: visible !important;
            opacity: 1 !important;
        }

    .statistiche-legenda {
        text-align: center;
        padding: 10px;
    }

        .statistiche-legenda .legend {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 10px;
            text-align: left;
        }

            .statistiche-legenda .legend li {
                float: none;
                margin: 5px 0;
            }
}

@media (max-width: 1024px) and (min-width: 771px) {
    .statistiche-chart {
        width: 45%;
    }

    .statistiche-grafico-articoli {
        width: 100%;
        margin-top: 20px;
    }
}

/* Grid responsive improvements */
@media (max-width: 768px) {
    .dxgvControl,
    .dxgvTable {
        font-size: 14px;
    }
    
    .dxgvHeader {
        white-space: nowrap;
    }
    
    .dxgvCommandColumn {
        min-width: 80px;
    }
}

.headerMaster {
    height: 0px;
    margin-top: 0px;
    border-bottom-style:solid;
    border-bottom-color: #ba5d5f;
    border-bottom-width: 5px;
}

.footerPane {
    /*position: absolute;*/
    height: 30px;
    background-color: #8b0205; 
    border-top-style: solid;
    border-top-color: #ba5d5f;
    border-top-width: 4px;   
}

.footerPane .contattaci {
    display: inline-block;
    width: 100%;
    height: 100%;
    font-size: 10px;
    padding: 0px 0px 0px 0px;
}

.footerPane .copyright {   
    float: left !important;
    /*width: auto;
    margin: 1px 1px;*/
    color: white;
}

.footerPane .social {
    float: right !important;
    /*width: 350px;
    margin: 1px 1px;*/
    text-align: right;
}

.btnContattaci {
    float: right !important;
}

.login {
    width: auto;
    height: auto;
    float: right !important;
    /*margin: top right bottom left */
    margin: 10px 10px;
}

.divlogin {
    border-radius: 15px 50px;
    background-color: white;
    padding: 20px;
    position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 20%;
    height: 50%;
    min-width: 345px;
    min-height: 395px;
    border:2px solid #93173B;
}

.divcontenuto {
    height: 100%;
    width: 100%;
    position: absolute;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#971539+0,8f193c+0,8c7078+0,93173b+56 */
    background: rgb(151,21,57); /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  rgba(151,21,57,1) 0%, rgba(143,25,60,1) 0%, rgba(140,112,120,1) 0%, rgba(147,23,59,1) 56%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover,  rgba(151,21,57,1) 0%,rgba(143,25,60,1) 0%,rgba(140,112,120,1) 0%,rgba(147,23,59,1) 56%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center,  rgba(151,21,57,1) 0%,rgba(143,25,60,1) 0%,rgba(140,112,120,1) 0%,rgba(147,23,59,1) 56%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#971539', endColorstr='#93173b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}

.divlogo {
    text-align: center;
}

.logo {
    padding-left: 0;    
}  

.btnprz_gridordinitpl {
    margin-left: 12px;
}

/* basic positioning */
.legend { list-style: none; }
.legend li { float: left; margin-right: 10px; }
.legend span { border: 1px solid #ccc; float: left; width: 12px; height: 12px; margin: 2px; }
/* your colors */
.legend .amprecedente { background-color: #99ccff; }
.legend .amincorso { background-color: #66ffd9; } /*[#3Ab54B = Verde]*/
  

/* Sorrentino */
.dxpnlControl_Sorrentino.dxpnl-edge.footerPane
{
    background: #8b0205; 
    border-top-style:solid;
    border-top-color: #ba5d5f;
    border-top-width: 4px;
}

/* Mulberry */
.dxpnlControl_Mulberry .footerMenu li
{
    background-color: White;
    color: Black;
}
.dxpnlControl_Mulberry .accountHeader h2
{
    color: #3B3B3B;
}
.dxpnlControl_Mulberry .loginControl a,
.dxpnlControl_Mulberry .templateTitle a
{
    color: #BF4E6A;
    border-color: #BF4E6A;
    font-size: 14px;
}
.dxpnlControl_Mulberry .templateTitle a 
{
    font-size: 28px;
}
.dxpnlControl_Mulberry.dxpnl-edge.t.headerPane,
.dxpnlControl_Mulberry.dxpnl-edge.b.footerPane
{
    background: #F1F2F5;
}
.dxpnlControl_Mulberry .contentPane .dxgvControl_Mulberry .dxgvTable_Mulberry
{
    border: 0!important;
}
.dxpnlControl_Mulberry .contentPane .dxgvControl_Mulberry .dxgvHeader_Mulberry
{
    border-top: 0!important;
}