/* Responsive Modal Footer Buttons */

.float-start {
    float: left !important;
}

.float-end {
    float: right !important;
}

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

/*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;
}

/* Responsive form grids for various layouts with minimal markup */
/* Common rules for all grid containers */
.form-container {
    display: grid;
    gap: 1.25rem;
    padding: .5rem;
    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 */
}

@media (min-width: 576px)
{
    .form-container {
        padding: 1rem;
    }

    .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);
    }
}

@media (min-width: 992px)
{
    .form-container {
        padding: 1.25rem;
    }

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

    .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;
    }
}

@media (min-width: 1200px)
{
    .form-container.form-max-four,
    .form-container.form-max-five {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (min-width: 1920px)
{
    .form-container.form-max-five {
        grid-template-columns: repeat(5, 1fr);
    }
}