/* Global Responsive Patch */

/* 1. Fix Table Overflow (Horizontal Scroll) */
.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 15px;
    border: 0;
}

/* Force standard tables to be responsive on small screens if not wrapped */
@media screen and (max-width: 767px) {
    .table:not(.table-responsive) {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* 2. DataTables Responsive Wrapper */
div.dataTables_wrapper {
    width: 100%;
    margin: 0 auto;
    overflow-x: auto;
}

/* 3. Modal Fixes for Mobile */
@media (max-width: 768px) {
    .modal-dialog {
        width: 90% !important;
        margin: 10px auto !important;
    }
    .modal-content {
        border-radius: 6px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.5);
    }
}

/* 4. Content Wrapper Padding on Mobile */
@media (max-width: 480px) {
    .content-header > h1 {
        font-size: 20px;
        line-height: 1.2;
    }
    .content {
        padding: 10px;
    }
    .box {
        margin-bottom: 15px;
    }
    .box-header > .fa, .box-header > .glyphicon, .box-header > .ion, .box-header .box-title {
        font-size: 16px;
    }
    
    /* Login Box Mobile */
    .login-box, .register-box {
        width: 90%;
        margin-top: 20px;
    }
}

/* 5. Utility Helpers */
.w-100 { width: 100% !important; }
.mb-10 { margin-bottom: 10px !important; }
.mt-10 { margin-top: 10px !important; }

/* 6. Form Control Improvements on Touch */
input.form-control, select.form-control, textarea.form-control {
    font-size: 16px; /* Prevents auto-zoom on iOS */
}

/* 7. Button Spacing on Mobile */
@media (max-width: 480px) {
    .btn-block-xs {
        display: block;
        width: 100%;
        margin-bottom: 5px;
    }
}