/** Fix overlapping summary stats on admin dashboard.
 *  Wagtail 4.x uses .w-summary / .w-summary__list instead of .summary ul.stats.
 *  Without flex-basis the items size by content, so short labels like "76 Media
 *  files" get squeezed while long labels take all the space.
 *  The !important's are necessary to override wagtail's inline/compiled css. **/

/* Force 3-per-row with equal sizing and proper wrap */
.w-summary__list {
    flex-wrap: wrap !important;
    gap: 0 !important;
}

.w-summary__list li {
    flex: 0 0 33.33% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* At medium widths, switch to 2-per-row */
@media only screen and (max-width: 992px) {
    .w-summary__list li {
        flex: 0 0 50% !important;
    }

    .w-summary__list li svg.icon {
        width: 4rem !important;
        height: 4rem !important;
    }

    .w-summary__list li span {
        font-size: 2rem !important;
    }
}

/* At small widths, stack single column */
@media only screen and (max-width: 768px) {
    .w-summary__list li {
        flex: 0 0 100% !important;
    }

    .w-summary__list li svg.icon {
        width: 3.5rem !important;
        height: 3.5rem !important;
    }

    .w-summary__list li span {
        font-size: 1.75rem !important;
    }
}