/* 
    CSS Strategy: Only put styles in this file that overwrite Bootstrap's 
    styles.

    Global CSS styles that are not Bootstrap overwrites should be in 
    Site.css
*/
:root {
    --bs-blue: var(--midmeticcs-blue-darker);
}

html, body {
    height: 100%;
    font-family: 'Lato',arial,sans-serif;
    font-weight: 400;
}

.accordion-flush .accordion-item {
    border-bottom: 0;
}

.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}

/* 
    Eric's great clean new pattern. 
    Let's move these into site.css so this file only contains
    true bootstrap overwrites
*/
.page-content {
    background-color: var(--seasalt-white);
    position: absolute;
    left: 220px;
    top: var(--main-header-height);
    width: calc(100% - 220px);
    max-width: calc(100% - 220px);
    height: calc(100% - 78px);
    overflow-y: auto;
}

.page-header {
    /* Use the smae header background color as analytics and manage headers */
    background-color: var(--pale-gray);

    border-bottom: solid 1px;
    border-top: solid 1px;
    border-bottom-color: var(--timberwolf-white);
    border-top-color: var(--timberwolf-white);
    padding-top: 10px;
    padding-bottom: 10px;
    align-items: center;
    /* give breathing room so header is visually distinct */
    padding-left: calc(var(--padding-for-content) - ((0.5 * var(--bs-gutter-x))) );
    padding-right: calc(var(--padding-for-content) - ((0.5 * var(--bs-gutter-x))) );
    
    /* make page-header consistent with height of analytics and manage headers */
    height: 60px;
}

.page-header-label {
    font-size: 18px;
    text-transform: uppercase;
    display: inline;
}

/* 
    Have the bootstrap btn-primary class
    use the same styles buttons in 
    page-header for consistency
*/
.page-header .btn, .btn-primary {
    background-color: var(--midmeticcs-blue-darker);
    border-color: var(--midmetrics-blue);
    color: var(--white) !important;
    text-transform: uppercase;
    /* Make these buttons look more consistent with Kendo buttons */
    --bs-btn-padding-y: 0.3rem;
    --bs-btn-padding-x: 0.55rem;
    --bs-btn-font-size: 0.875rem;
    --bs-btn-border-radius: 4px;
}

.page-header .btn:hover, .btn:active {
    /* Match buttons in new bootstram theme */
    background-color: #3276b1 !important;
    border-color: #285e8e !important
}


.page-header .button-group{
    float: right;
}

.page-grid-row {
    height: calc( 100% - var(--main-header-height));
    /* give breathing room so grid is visually distinct */
    padding-left: calc(var(--padding-for-content) - ((0.5 * var(--bs-gutter-x))) );
    padding-right: calc(var(--padding-for-content) - ((0.5 * var(--bs-gutter-x))) );
}



.page-grid-col {
    height: 100%;
}

.mm-grid{
    height:99%;
}