@font-face {
    font-family: 'Rubik';
    src: url('fonts/Rubik-VariableFont_wght.woff2') format('woff2');
}


#loadingscreen {
    width: 100%;
    height: 100vh;
    color: whitesmoke;
    font-family: Rubik, Roboto, 'Segoe UI', Montserrat, Helvetica, Arial, sans-serif;
    font-weight: 100;
    padding-top: 24vh;
    padding-left: 24vw;
    margin-top: 0;
    font-size: 4vh;
    background: #252525;
    text-shadow: 3px 3px 5px #00000059;
}

#loadingprogress {
    color: #808080;
    margin-top: 2vh;
    font-size: 4vh;
}

#loadinginfo {
    font-size: 2vh;
    margin-left: 40vw;
    padding-top: 4vh;
}

/* https://loading.io/css/ */
.lds-dual-ring {
    display: inline-block;
    width: 4vh;
    height: 4vh;
}

    .lds-dual-ring:after {
        content: " ";
        display: block;
        width: 4vh;
        height: 4vh;
        margin: 0;
        border-radius: 50%;
        border: 0.3vh solid #fff;
        border-color: #27ee58 transparent #fff transparent;
        animation: lds-dual-ring 1.2s linear infinite;
    }

@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/*
* {
    user-select: none;
}
*/

/* mud blazor customisations*/

.mud-appbar .mud-button {
    color: var(--mud-text-color);
}

.tab-left {
    justify-content: normal;
    padding-left: 2em;
}


/* fix clipped hovering input labels*/
.mud-input-control > .mud-input-control-input-container > .mud-input-label-inputcontrol {
    line-height: inherit;
}

h1.mud-typography-h1, h2.mud-typography-h2, h3.mud-typography-h3, h3.mud-typography-h3, h4.mud-typography-h4, h5.mud-typography-h5, h6.mud-typography-h6 {
    margin-bottom: 0.6rem;
}

.mud-button, .mud-tab, .mud-chip, .mud-breadcrumb-item, .mud-nav-link {
    font-weight: 300;
}

.mud-tab, .mud-button {
    text-transform: initial;
}

.mud-button-filled {
    box-shadow: none;
}

pre.code {
    /*exception and log results*/
    max-width: 70vw;
    overflow: overlay;
    font-size: smaller;
    padding: 1em;
    border: 1px solid #c0c0c066;
}

.disable-select {
    user-select: none;
}
/*effects*/
.dark-mode .mud-paper {
    background-image: url(/images/gradient4.png);
}

/*
.mud-paper {
    background: linear-gradient(60deg, rgb(255 255 255 / 6%) 0%, rgb(93 105 95 / 1%) 40%, rgb(126 126 126 / 6%) 100%);
}

.mud-button {
    border: 1px solid #c5c5c532;
}
    */
.constrained-view {
    overflow-y: auto; 
    max-height: 50vh;
}