/* Stili specifici per il modulo Mix Pagamenti */
.dashboard-payment-mix {
    display: flex;
    flex-direction: column;
    height: 100%; /* Forza il pannello a riempire la colonna Bootstrap */
    margin-bottom: 0;
}
.dashboard-payment-mix .panel-heading-custom {
    display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap;
    background-color: #ffffff; border-bottom: 1px solid #eeeeee; padding: 15px;
}
.dashboard-payment-mix .title-custom { margin-top: 0; color: #333333; }
.dashboard-payment-mix .panel-body-custom {
    flex-grow: 1; /* Fa espandere il corpo per occupare lo spazio residuo */
    padding: 20px;
}
.payment-mix-doughnut-container { display: flex; align-items: center; margin-bottom: 15px; }
.doughnut-wrapper { position: relative; width: 200px; height: 200px; flex-shrink: 0; }
.doughnut-center {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    display: flex; flex-direction: column; justify-content: center; align-items: center; pointer-events: none;
}
.doughnut-center-perc { font-size: 32px; font-weight: bold; color: #333; line-height: 1; }
.doughnut-center-label { font-size: 11px; color: #777; text-transform: uppercase; font-weight: bold; margin-top: 4px; }
.payment-mix-legend { flex-grow: 1; padding-left: 20px; }
.legend-item { display: flex; align-items: center; margin-bottom: 8px; font-size: 13px; }
.legend-dot { width: 12px; height: 12px; border-radius: 3px; margin-right: 10px; flex-shrink: 0; }
.legend-label { flex-grow: 1; color: #555; font-weight: 500; }
.legend-value { font-weight: bold; color: #333; margin-right: 15px; }
.legend-perc { color: #777; width: 30px; text-align: right; }
.payment-mix-stacked-container { margin: 20px 0; }
.stacked-bar { display: flex; height: 16px; border-radius: 8px; overflow: hidden; margin-bottom: 15px; }
.stacked-segment { height: 100%; transition: width 0.5s ease; }
.stacked-legend { display: flex; flex-wrap: wrap; align-items: center; font-size: 13px; color: #555; }
.stacked-legend-item { display: flex; align-items: center; margin-right: 15px; margin-bottom: 5px; }
.payment-mix-footer-note { font-size: 12px; color: #888; font-style: italic; border-top: 1px solid #eee; padding-top: 15px; margin-top: 10px; }
.payment-right-panel {
    border-left: 1px solid #e5e5e5;
    padding-left: 30px;
}

.payment-left-panel {
    padding-right: 30px;
}

.payment-mix-doughnut-container {
    display: flex;
    align-items: center;
    justify-content: center;
}

.payment-mix-legend {
    margin-left: 30px;
}

.legend-item {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.legend-dot {
    width: 12px;
    height: 12px;
    border-radius: 2px;
    margin-right: 10px;
}

.legend-label {
    min-width: 140px;
    margin-right: 20px;
}

.legend-perc {
    font-weight: bold;
}

.dashboard-payment-mix .btn-group .btn {
    font-weight: bold;
}