:root {
    --skin-primary: #03a9f4;
    --skin-secondary: #3a3939;
    --skin-thead-background: #3a3939;
    --skin-thead-color: #ffffff;
    --skin-footer-background: #3a3939;
    --mud-palette-primary: #03a9f4 !important;
    --mud-palette-secondary: #3a3939 !important;
    --mud-palette-secondary-darken: #3a3939 !important;
    --mud-palette-secondary-hover: #3a3939 !important;
    --mud-palette-divider: #3a3939 !important;
    --skin-loginbox: #03a9f4c2;
    --skin-loginbox-light_primary: #b8e8ff;
}

/* #region Global Styles */
a, .btn-link {
    color: white;
}

#blazor-error-ui {
    background: lightyellow;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
}

.vl {
    border-left: 4px solid white;
    height: 50px;
    margin-right: 5px;
    margin-left: 5px;
}

/* #endregion */

/* #region MudTables Styles */
thead {
    background-color: var(--skin-thead-background);
    color: var(--skin-thead-color) !important;
}

    thead tr,
    thead tr th,
    thead span {
        color: var(--skin-thead-color) !important;
    }

/* #endregion */

/* #region Login Page Styles */

.loginLayout {
    background: url("background.jpg");
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

.loginContainer {
    background-color: var(--skin-loginbox);
    padding: 30px;
}

.loginButton {
    width: 100%;
    color: #03a9f4;
    background-color: white;
}

    .loginButton:hover {
        background-color: #b8e8ff;
        color: #03a9f4;
    }

.loginTextbox {
    background-color: var(--skin-loginbox-light_primary) !important;
}

.loginText {
    color: white;
}

.loginLink {
    color: white;
}

    .loginLink:hover {
        color: var(--skin-secondary);
    }


.textSiteColor {
    color: var(--skin-primary);
}

.top-row {
    background-color: var(--skin-primary) !important;
}

.nav-item .nav-text {
    display: block;
    padding: .5rem 1rem;
    color: white;
}

.nav-text {
    color: white;
}

.navbar-brand {
    display: inline-flex;
}

/* #endregion */

/* #region SiteHeader Styles */
.siteHeader {
    background-color: var(--skin-primary) !important;
}

.site-color-secondary {
    color: var(--skin-secondary);
}

.headerName::before {
    content: "";
}

/* #endregion */

/* #region Sidebar Styles */
.mud-navmenu.mud-navmenu-default .mud-nav-link-expand-icon.mud-transform,
.mud-nav-link .mud-nav-link-expand-icon {
    color: var(--skin-primary) !important;
    fill: var(--skin-primary) !important;
}
/* #endregion */

/* #region Footer Styles */

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    height: 80px;
    background-color: var(--skin-footer-background);
    color: white;
    font-size: 12px;
    padding-top: 8px;
}

    .footer a {
        color: var(--skin-primary);
    }

        .footer a:hover {
            color: white;
        }

.footer-content {
    position: absolute;
    display: inline;
    padding-top: 10px;
    left: 5%;
    font-size: 14px;
}

    .footer-content a {
        color: white;
    }

.footer-content-bottom {
    position: absolute;
    left: 5%;
    font-size: 12px;
    padding-top: 20px;
    color: white;
    display: inline;
}

    .footer-content-bottom a {
        color: white;
    }

        .footer-content-bottom a:hover {
            color: var(--skin-primary);
        }
/* #endregion */

/* #region File upload */

.btnCustom {
    background-color: var(--skin-primary);
    color: white;
}


.siteStatus_Ok {
    color: forestgreen;
}

.siteStatus_Error {
    color: red;
}

/* #endregion */