:root {
    --jsc-mobile-touch: 44px;
}

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

img,
svg,
video,
canvas {
    max-width: 100%;
    height: auto;
}

.container-fluid,
.row,
main,
.card,
.card-body,
.table-responsive,
form,
fieldset {
    min-width: 0;
}

.row > * {
    min-width: 0;
}

input,
select,
textarea,
button {
    max-width: 100%;
}

.form-control,
.form-select {
    min-height: 42px;
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table {
    margin-bottom: 0;
}

.jsc-card {
    overflow: hidden;
}

.btn {
    min-height: 40px;
}

@media (max-width: 991.98px) {
    main.col-lg-10,
    .dashboard-main.col-lg-10 {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .container-fluid > .row {
        margin-left: 0;
        margin-right: 0;
    }

    main.col-lg-10 {
        padding: 1.1rem !important;
    }

    .section-title {
        font-size: clamp(1.45rem, 5vw, 2rem);
    }

    .footer-jsc {
        font-size: .72rem;
    }

    .footer-jsc .d-flex,
    .footer-jsc {
        flex-wrap: wrap;
        gap: .35rem .8rem;
    }
}

@media (max-width: 767.98px) {
    .card-body {
        padding: 1rem !important;
    }

    .d-flex.justify-content-between,
    .d-flex.justify-content-end {
        flex-wrap: wrap;
    }

    .d-flex.justify-content-end > .btn,
    .d-flex.justify-content-end > a.btn {
        flex: 1 1 180px;
    }

    .input-group {
        flex-wrap: nowrap;
    }

    .table {
        font-size: .78rem;
    }

    .table th,
    .table td {
        white-space: nowrap;
    }

    .modal-dialog {
        margin: .75rem;
    }
}

@media (max-width: 575.98px) {
    main.col-lg-10 {
        padding: .85rem !important;
    }

    .btn,
    .form-control,
    .form-select,
    .form-check-input {
        touch-action: manipulation;
    }

    .btn {
        min-height: var(--jsc-mobile-touch);
    }

    .form-control,
    .form-select {
        min-height: var(--jsc-mobile-touch);
        font-size: 16px;
    }

    textarea.form-control {
        min-height: 110px;
    }

    .dropdown-menu {
        max-width: calc(100vw - 1.5rem);
    }

    .alert {
        font-size: .82rem;
    }

    .footer-jsc {
        margin-left: -.85rem !important;
        margin-right: -.85rem !important;
    }
}