.scrollable-y-only {
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable
}

/* Responsive form grids for various layouts with minimal markup */
/* Default/Common rules for all grid containers, will be overwritten based on screen size and max class */
.form-container {
    display: grid;
    gap: 0.25rem;
    padding: 0.25rem;
    grid-template-columns: 1fr;
    min-width: 300px;
    align-items: start;
}

    .form-container + .form-container {
        margin-top: -0.75rem; /* Negative margin to reduce spacing between containers */
    }

    /* Small devices (phones, less than 576px), always 1 column */
    /*Dfault Values*/
    .form-container.form-max-one {
        grid-template-columns: 1fr;
    }

/* Medium devices (tablets, less than 992px), never more than 2 columns */
@media (min-width: 576.1px) {
    .form-container {
        gap: 0.5rem;
        padding: 0.5rem;
    }

        .form-container.form-max-two,
        .form-container.form-max-three,
        .form-container.form-max-four,
        .form-container.form-max-five {
            grid-template-columns: repeat(2, 1fr);
        }
}

/* Large devices (laptops, less than 1366px), never more than 3 columns */
@media (min-width: 992.1px) {
    .form-container {
        gap: 0.5rem;
        padding: .75rem;
    }

        .form-container.form-max-three,
        .form-container.form-max-four,
        .form-container.form-max-five {
            grid-template-columns: repeat(3, 1fr);
        }
}

/* Very large monitors, up to 4 columns */
@media (min-width: 1366.1px) {
    .form-container {
        gap: 0.75rem;
        padding: 0.75rem;
    }

        .form-container.form-max-four,
        .form-container.form-max-five {
            grid-template-columns: repeat(4, 1fr);
        }
}

/* High res devices (monitors), up to 5 columns */
@media (min-width: 1920.1px) {
    .form-container {
        gap: 1rem;
    }

        .form-container.form-max-five {
            grid-template-columns: repeat(5, 1fr);
        }
}

@media (min-width: 992.1px) {
    .form-container.form-max-two.form-emphasis-left {
        grid-template-columns: 2fr 1fr;
    }

    .form-container.form-max-two.form-emphasis-right {
        grid-template-columns: 1fr 2fr;
    }
}

/*Used for clamping max row height in grids*/
th.e-headercell.e-max-three-row,
td.e-rowcell.e-max-three-row {
    display: -webkit-box;
    max-height: 60px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis !important;
    white-space: pre-wrap !important;
}

th.e-headercell.e-max-five-row,
td.e-rowcell.e-max-five-row {
    display: -webkit-box;
    max-height: 120px;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis !important;
    white-space: pre-wrap !important;
}