@layer components {
    .modal:has(> .modal-dialog) {
        pointer-events: auto;
        visibility: visible;
        opacity: 1;
        display: none;
        padding: 0;
    }

        .modal:has(> .modal-dialog).show {
            display: block;
        }

        .modal:has(> .modal-dialog) .modal-header,
        .modal:has(> .modal-dialog) .modal-body,
        .modal:has(> .modal-dialog) .modal-footer {
            all: revert-layer;
        }
}
@layer utilities {
    .collapse {
        visibility: revert-layer;
    }
}