﻿.no-screen, .no-screen * {
    display: none !important;
}

.detection-display {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 53px;
}


#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }


.scroll-locked {
    padding-right: 9px;
}

.table-row-header {
    background-color: rgba(130, 130, 130, 0.1) !important;
}
.table-row-header:hover {
    background-color: rgba(130, 130, 130, 0.4) !important;
}

.table-row-selected {
    background-color: rgba(130, 130, 130, 0.25) !important;
}
.table-row-selected:hover {
    background-color: rgba(130, 130, 130, 0.4) !important;
}


.drawer-background {
    background-color: var(--mud-palette-background);
}

.iframe {
    height: 400px;
    width: 100%;
    margin: 0 !important;
}

.setup-floating-buttons {
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 1100;
}

.dialog-popover {
    z-index: 1502;
}

.one-column-component {
    height: calc(100vh - 200px);
    width: 800px;
    overflow-x: hidden;
    overflow-y: auto;
}

.two-column-component {
    height: calc(100vh - 200px);
    width: 1200px;
    overflow-x: hidden;
    overflow-y: auto;
}

.three-column-component {
    height: calc(100vh - 200px);
    width: 1600px;
    overflow-x: hidden;
    overflow-y: auto;
}

.overlay-w1 {
    width: 800px;
    overflow-x: hidden;
}

.overlay-w2 {
    width: 1000px;
    overflow-x: hidden;
}

.overlay-w3 {
    width: 1200px;
    overflow-x: hidden;
}

.overlay-w4 {
    width: 1400px;
    overflow-x: hidden;
}

.overlay-w5 {
    width: 1600px;
    overflow-x: hidden;
}

.overlay-h1 {
    height: calc(100vh - 500px);
    overflow-y: auto;
}

.overlay-h2 {
    height: calc(100vh - 400px);
    overflow-y: auto;
}

.overlay-h3 {
    height: calc(100vh - 300px);
    overflow-y: auto;
}

.overlay-h4 {
    height: calc(100vh - 200px);
    overflow-y: auto;
}

.overlay-h5 {
    height: calc(100vh - 100px);
    overflow-y: auto;
}

.detections-page {
    height: calc(100vh - var(--mud-appbar-height));
    overflow-x: hidden;
    position: relative;
    padding-right: 12px;
    padding-left: 12px;
}

.scrollable-container
{
    /* Margin/padding values below set the scrollbar flush with the right edge of the container */
    height: calc(100vh - var(--container-height));
    margin-right: -12px;
    padding-right: 12px;
    overflow-y: auto;
}

.page {
    height: calc(100vh - var(--mud-appbar-height));
    overflow-x: hidden;
    position: relative;
    padding: 12px;
}

.navmenu {
    overflow-y: scroll;
    scrollbar-width: none;
    overflow-x: hidden;
}

.navmenu::-webkit-scrollbar {
    display: none;
}

.page-content {
    overflow-x: hidden;
    overflow-y: auto;
}

.index-page {
    height: calc(100vh - 112px);
    overflow-x: hidden;
    position: relative;
    padding: 12px;
}

.help-page {
    height: calc(100vh - 24px);
    overflow-x: hidden;
    position: relative;
    padding: 12px;
}

.help-page-content {
    height: calc(100vh - 119px);
    overflow-y: auto;
}

.table {
    margin-top: 12px;
    margin-left: 12px;
    margin-right: 12px;
    margin-bottom: 8px;
}

.drawer {
    background-color: transparent;
    max-width: 100vw;
    padding-bottom: 12px;
    padding-left: 12px;
    padding-right: 4px;
    max-height: calc(100vh - var(--mud-appbar-height) - 12px);
}

.search-drawer {
    height: calc(100vh - 100px);
    overflow-x: hidden;
    overflow-y: auto;
    margin-top: -12px;
    margin-bottom: -12px;
    margin-right: -4px;
    margin-left: -12px;
    padding-top: 12px;
    padding-bottom: 8px;
    padding-left: 12px;
    padding-right: 10px;
}

.search-drawer-buttons {
    margin-top: 19px;
    margin-right: 6px;
    margin-left: -2px;
}

.watch-list-red {
    background-color: #d98880;
}

.watch-list-orange {
    background-color: #f0b27a;
}

.watch-list-yellow {
    background-color: #f7dc6f;
}

.watch-list-light-green {
    background-color: #82e0aa;
}

.watch-list-green {
    background-color: #7dcea0;
}

.watch-list-blue-green {
    background-color: #73c6b6;
}

.watch-list-blue {
    background-color: #85c1e9;
}

.watch-list-light-blue {
    background-color: #d4e6f1;
}

.watch-list-lavender {
    background-color: #e8daef;
}

.watch-list-purple {
    background-color: #bb8fce;
}

.watch-list-pink {
    background-color: #fadbd8;
}

.watch-list-white {
    background-color: #FFFFFF;
}

.dialog-background {
    backdrop-filter: blur(10px);
}

#components-reconnect-modal {
    color: black !important;
}

.truncate-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 240px;
}

[data-md-render] ul {
    list-style-position: inside;
}

[data-md-render] p {
    margin-bottom: .25em;
}

[data-md-render] h3 {
    font-size: var(--mud-typography-h3-size);
    font-family: var(--mud-typography-h3-family);
    font-weight: var(--mud-typography-h3-weight);
    line-height: var(--mud-typography-h3-lineheight);
    letter-spacing: var(--mud-typography-h3-letterspacing);
    text-transform: var(--mud-typography-h3-text-transform);
    margin-top: 1rem;
    margin-bottom: .8rem;
}

[data-md-render] h4 {
    font-size: var(--mud-typography-h4-size);
    font-family: var(--mud-typography-h4-family);
    font-weight: var(--mud-typography-h4-weight);
    line-height: var(--mud-typography-h4-lineheight);
    letter-spacing: var(--mud-typography-h4-letterspacing);
    text-transform: var(--mud-typography-h4-text-transform);
    margin-top: 1rem;
    margin-bottom: .75rem;
}

[data-md-render] h5 {
    font-size: var(--mud-typography-h5-size);
    font-family: var(--mud-typography-h5-family);
    font-weight: var(--mud-typography-h5-weight);
    line-height: var(--mud-typography-h5-lineheight);
    letter-spacing: var(--mud-typography-h5-letterspacing);
    text-transform: var(--mud-typography-h5-text-transform);
    margin-top: 1rem;
    margin-bottom: .5rem;
}

[data-md-render] h6 {
    font-size: var(--mud-typography-h6-size);
    font-family: var(--mud-typography-h6-family);
    font-weight: var(--mud-typography-h6-weight);
    line-height: var(--mud-typography-h6-lineheight);
    letter-spacing: var(--mud-typography-h6-letterspacing);
    text-transform: var(--mud-typography-h6-text-transform);
    margin-top: 1rem;
    margin-bottom: .25rem;
}