/* Add this to your CSS file */
@media (max-width: 576px) { /* Adjust the breakpoint as needed */
    .table-responsive {
        overflow-x: auto; /* Ensures horizontal scrolling on smaller screens */
    }
    .table thead {
        display: block; /* Allows header to stay fixed while scrolling */
    }
    .table tbody {
        display: block; /* Allows body to scroll horizontally */
    }
    .table th, .table td {
        min-width: 150px; /* Adjust as needed for readability */
        word-wrap: break-word; /* Ensures long text wraps to the next line */
    }
}
label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700
}
input[type=search] {
    box-sizing: border-box
}
input[type=checkbox],
input[type=radio] {
    margin: 4px 0 0;
    line-height: normal
}
input[type=file] {
    display: block
}
input[type=range] {
    display: block;
    width: 100%
}
select[multiple],
select[size] {
    height: auto
}
input[type=file]:focus,
input[type=checkbox]:focus,
input[type=radio]:focus {
    outline: -webkit-focus-ring-color auto 5px;
    outline-offset: -2px
}
output {
    display: block;
    padding-top: 7px;
    font-size: 13px;
    line-height: 1.52857;
    color: #fff
}
text