/* 
 * Find-a-Staff Global Responsive Safety Rules
 * Helps prevent horizontal scrolling and layout breaking on small screens
 */

/* 1. Global Overflow Protection */
html, body {
    overflow-x: hidden;
    width: 100%;
}

/* 2. Responsive Table Wrappers */
.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 8px; /* Depending on the admin design */
}

.table-responsive > .table {
    margin-bottom: 0;
    min-width: 600px; /* Adjust based on data density */
}

/* 3. Image Safety */
img {
    max-width: 100%;
    height: auto;
}

/* 4. Form Safety */
input, textarea, select {
    max-width: 100%;
}

/* 5. Flex container wrapping fix (preventing flex children from exploding out of containers) */
.flex-min-0 > * {
    min-width: 0;
}

/* 6. Modal Safety */
@media (max-width: 576px) {
    .modal-dialog {
        margin: 10px;
    }
    .modal-body {
        padding: 16px;
    }
    .modal-header, .modal-footer {
        padding: 16px;
    }
}