/* ──────────────────────────────────────────────────────────────
   6. FIX BOOTSTRAP .row NEGATIVE MARGINS (major overflow cause)
   Bootstrap rows use margin-left/right: -12px or -var(--bs-gutter-x)
   which pushes content outside viewport on mobile.
   ────────────────────────────────────────────────────────────── */
/* @media screen and (max-width: 991px) {
    .row {
        --bs-gutter-x: 0px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .row>* {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
} */

/* Force single column on everything below 1024px */
@media screen and (max-width: 1023px) {
    .content-grid {
        display: block !important;
        /* fallback if grid breaks */
        grid-template-columns: 1fr !important;
    }
}

@media screen and (max-width: 1023px) {
    .art-sidebar {
        width: 100% !important;
        position: static !important;
        top: auto !important;
        float: none !important;
    }

    /* All sidebar widgets: full width */
    .art-sidebar .sw,
    .art-sidebar>* {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
}


/* ──────────────────────────────────────────────────────────────
   19. DISCLOSURE BOX — often has margin-left on desktop
   ────────────────────────────────────────────────────────────── */
@media screen and (max-width: 767px) {
    .disclosure-box {
        margin-left: 0 !important;
        padding-left: 12px !important;
        width: 100% !important;
    }
}

/* ──────────────────────────────────────────────────────────────
   20. BOOTSTRAP .ms-5 / MARGIN UTILITIES — override on mobile
   ────────────────────────────────────────────────────────────── */
@media screen and (max-width: 767px) {
    .ms-5 {
        margin-left: 0 !important;
        margin-top: 12px !important;
    }

    .ms-4 {
        margin-left: 0 !important;
    }

    .ms-3 {
        margin-left: 0 !important;
    }

    .ps-5 {
        padding-left: 0 !important;
    }

    .ps-4 {
        padding-left: 0 !important;
    }

    .pe-5 {
        padding-right: 0 !important;
    }

    .me-5 {
        margin-right: 0 !important;
    }
}


@media screen and (max-width: 400px) {

    .breadcrumb-item a,
    .breadcrumb-item.active {
        max-width: 100px;
    }
}