:root {
    --mcase-login-bg-color: rgb(255, 255, 255);
    --mcase-login-bg-img: none;
    --mcase-login-panel-bg-color: rgb(255, 255, 255);
    --mcase-login-btn-bg-color: rgb(0, 0, 0);
    --mcase-login-btn-text-color: rgb(255, 255, 255);
    --mcase-login-text-bg-color: inherit;
    --mcase-login-side-img-border-color: inherit;
    --mcase-login-side-img: url(/Unauthenticated/OrganizationDisplayImage.aspx?type=image/png&id=51);
    --mcase-login-top-img-border-color: inherit;
    --mcase-login-top-img: url(/Unauthenticated/OrganizationDisplayImage.aspx?type=image/png&id=36);
    --mcase-banner-img: url(/Unauthenticated/OrganizationDisplayImage.aspx?type=image/png&id=38);
    --mcase-app-panel-text-color: inherit;
    --mcase-app-panel-bg-color: inherit;
}

/* Uses @import, which must be included before other rules */

/* End of site style sheet import */
div.ResponsiveContentHolder,
div.ErrorBannerHolder {
    max-height: 140px;
    min-height: 10px;
    margin: 0 !important;
    width: 100%;
}

div.ResponsiveContentHolder img,
div.ErrorBannerHolder img {
    max-height: 140px;
    min-height: 10px;
}

.site-banner[id="app-site-banner"] {
    min-height: 10px;
    max-height: 140px;
    --bs-bg-opacity: 0.25;
    width: 100%;
}

.site-banner[id="app-site-banner"] img {
    max-height: 140px;
    min-height: 10px;
}

body.public-login-view {
    background-color: var(--mcase-login-bg-color);
    background-image: var(--mcase-login-bg-img);
}

.public-login-view .login-submit-btn {
    background-color: var(--mcase-login-btn-bg-color);
    border-color: var(--mcase-login-btn-bg-color);
    color: var(--mcase-login-btn-text-color);
}

.public-login-view .custom-text-container {
    background-color: var(--mcase-login-text-bg-color);
}

.public-login-view .login-content-container {
    background-color: var(--mcase-login-panel-bg-color);
}

.public-login-view img.login-top-image,
.public-login-view img.login-side-image {
    border-radius: 0.3rem;
}

.public-login-view img.login-top-image {
    max-height: 200px;
    content: var(--mcase-login-top-img);
    border: 1px solid var(--mcase-login-top-img-border-color);
}

.public-login-view img.login-side-image {
    content: var(--mcase-login-side-img);
    border: 1px solid var(--mcase-login-side-img-border-color);
    max-width: 300px;
}

body.MainBody {
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

/* This style might be deprecated based on the bootstrap rework. 
    TODO: Find the style and replace, remove configuration once change is confirmed
*/
ul[id*="LinkList"] * span,
ul[id*="MyDataGrid"] * span {
    color: var(--mcase-app-panel-text-color);
    display: inline-block;
    background-color: var(--mcase-app-panel-bg-color);
    border-radius: 2px;
    padding: 2px 2px;
    width: 100%;
    margin-top: 3px;
}