:root {
    --nt-threattype-colour-friend: greenyellow;
    --nt-threattype-colour-warning: orange;
    --nt-threattype-colour-threat: red;
    --nt-threattype-colour-unknown: white;
    --rz-dropdown-item-padding: 0.25rem 0.5rem;
    --rz-tree-node-padding: 0.25rem 0.25rem;
    --rz-tree-node-selected-border-radius: calc(var(--rz-border-radius) * 4);
    --rz-menu-border-radius: calc(var(--rz-border-radius)* 4);
    --rz-tree-node-toggle-width: 1.5rem;
    --rz-dialog-content-padding: 1rem;
}

.rz-progressbar-label {
    display: block !important;
}

.rz-data-grid-data {
    user-select: none;
}

.rz-splitter-horizontal > .rz-splitter-bar {
    position: relative;
    z-index: 900;
}
    .rz-splitter-horizontal > .rz-splitter-bar > .rz-collapse {
        position: absolute;
        font-size: 64pt;
        left: -56px;
    }
    .rz-splitter-horizontal > .rz-splitter-bar > .rz-expand {
        position: absolute;
        font-size: 64pt;
        left: -56px;
        color : white;
    }
    .rz-splitter-horizontal > .rz-splitter-bar > .rz-resize {
        position: absolute;
        width: 100%;
        background: var(--rz-splitter-bar-color);
        height: 32px;
    }
.rz-splitter-bar-collapsed:hover {
    background-color: var(--rz-splitter-bar-background-color);
    opacity: var(--rz-splitter-bar-hover-opacity);
}
.rz-body {
    padding: 0;
}
.rz-dialog-wrapper {
    top:0;
    left:0;
    right:0;
    bottom:0;
}

.nt-dialog-fixedsize .rz-dialog {
    width: 60vw !important;
    min-height: 50vh;
}

.nt-sidebar {
    right: 0 !important;
    left: unset !important;
    width: 500px;
    height: 100%;
    padding: 0.5rem !important;
    position: absolute;
    z-index: var(--rz-dialog-zindex);
}
    .nt-sidebar .rz-dialog-titlebar {
        background: var(--rz-sidebar-background-color);
    }
    .nt-sidebar .rz-dialog {
        display: flex;
        flex-direction: column;
        overflow: hidden;
        border-radius: 0;
        height: 100%;
        background: var(--rz-sidebar-background-color);
        position: relative;
        z-index: var(--rz-dialog-zindex);
    }
        .nt-sidebar .nt-fieldlist {
            display: block !important;
        }

    .nt-sidebar .rz-dialog-titlebar-close {
        border-radius: var(--rz-button-border-radius);
        background-color: var(--rz-danger);
        color: var(--rz-on-danger);
        height: 2rem;
        width: 2rem;
        vertical-align: middle;
        display: flex;
        justify-content: center;
        align-items: center;
        text-decoration: none;
    }

        .nt-sidebar .rz-dialog-titlebar-close span {
            line-height: 1rem;
            gap: 0.25rem;
            font-size: 1rem;
            height: 1rem;
            line-height: 1rem;
            width: 1rem;
        }

    .nt-sidebar .rz-dialog-content {
        display: flex;
        flex-direction: column;
        overflow: hidden;
        background: var(--rz-sidebar-background-color);
    }

        .nt-sidebar .rz-dialog-content > form {
            overflow-y: auto;
        }

    .nt-sidebar::-webkit-scrollbar { width: 0.75em; }

    .nt-sidebar::-webkit-scrollbar-thumb {
        background-color: darkgrey;
        outline: 1px solid slategrey;
    }

.nt-sitemenu.rz-menu:not(.rz-profile-menu) > .rz-navigation-item > .rz-navigation-item-wrapper-active:before { content: unset !important; }

.nt-sitemap-tree {
    width: 100%;
    height: 100%;
    position: relative;
    left: calc(var(--rz-layout-body-border-radius)*-0.5);
}
    .nt-sitemap-tree .rz-tree-toggler {
        min-width: var(--rz-tree-node-toggle-width);
    }

    /*.rz-popup {
    min-width: max-content !important;
}*/
    .main-display {
        padding: 0.5rem !important;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

ul[role=tablist] {
    flex-wrap: wrap;
}

.content {
    height: 100%;
    width: 100%;
    display: flex;
    align-self: center;
    flex-direction: column;
    align-items: center;
}

.configuration-cards {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: space-between !important;
    align-items: center;
    gap: 0.25em 1em;
    height: 100%;
}

    .configuration-cards > div {
        cursor: pointer;
        flex: 1 0 26%;
        display: flex !important;
        flex-direction: column !important;
        /*padding: 0.25rem !important;*/
        /*background-color: var(--rz-info-dark) !important;*/
        /*color: var(--rz-white) !important;*/
        text-align: center;
        /*padding: var(--rz-card-padding);*/
        /*border-radius: var(--rz-card-border-radius);*/
        /*box-shadow: var(--rz-card-shadow);*/
        /*background-color: var(--rz-card-background-color);*/
    }

        .configuration-cards > div:hover {
            color: var(--rz-white) !important;
        }

    .configuration-cards .rzi {
        font-size: 10vw;
    }

.new-entity-cards {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: space-between !important;
    align-items: center;
    gap: 0.25em 1em;
    height: 100%;
}

    .new-entity-cards > div {
        cursor: pointer;
        flex: 1 0 26%;
        display: flex !important;
        flex-direction: column !important;
        /*padding: 0.25rem !important;*/
        /*background-color: var(--rz-info-dark) !important;*/
        /*color: var(--rz-white) !important;*/
        text-align: center;
        /*padding: var(--rz-card-padding);*/
        /*border-radius: var(--rz-card-border-radius);*/
        /*box-shadow: var(--rz-card-shadow);*/
        /*background-color: var(--rz-card-background-color);*/
    }

        .new-entity-cards > div > div {
            position: relative;
            opacity: 0.8;
        }

        .new-entity-cards > div:hover div {
            opacity: 1;
        }

    .new-entity-cards .rzi {
        font-size: 1rem;
        position: absolute;
        bottom: 0;
    }

.editform-buttons {
    flex: 1 0 0;
    display: flex;
    justify-content: right;
    gap: 0.25em;
    padding-bottom: 5px;
}

.map-site-marker {
    border: none;
    cursor: pointer;
    height: 56px;
    width: 56px;
    /* Note replace any # with %23 in the svg data*/
    background-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="%23000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M20.94 11c-.46-4.17-3.77-7.48-7.94-7.94V1h-2v2.06C6.83 3.52 3.52 6.83 3.06 11H1v2h2.06c.46 4.17 3.77 7.48 7.94 7.94V23h2v-2.06c4.17-.46 7.48-3.77 7.94-7.94H23v-2h-2.06zM12 19c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z"/></svg>');
    background-repeat: no-repeat;
    background-size: contain;
}

/* Marker tweaks */
.mapboxgl-popup-close-button {
    /*display: none;*/
    border: none !important;
    color: var(--rz-text-color, inherit);
}

    .mapboxgl-popup-close-button:focus-visible {
        outline: none !important;
    }

.mapboxgl-popup-anchor-top .mapboxgl-popup-tip {
    border-bottom-color: var(--rz-base-400);
}

.mapboxgl-popup-anchor-top-left .mapboxgl-popup-tip {
    border-bottom-color: var(--rz-base-400);
}

.mapboxgl-popup-anchor-top-right .mapboxgl-popup-tip {
    border-bottom-color: var(--rz-base-400);
}

.mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip {
    border-top-color: var(--rz-base-400);
}

.mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-tip {
    border-top-color: var(--rz-base-400);
}

.mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-tip {
    border-top-color: var(--rz-base-400);
}

.mapboxgl-popup-anchor-left .mapboxgl-popup-tip {
    border-right-color: var(--rz-base-400);
}

.mapboxgl-popup-anchor-right .mapboxgl-popup-tip {
    border-left-color: var(--rz-base-400);
}

.mapboxgl-popup-content {
    font: 400 15px/22px 'Source Sans Pro', 'Helvetica Neue', sans-serif;
    padding: 0;
    width: 180px;
    background: var(--rz-base-400);
}

    .mapboxgl-popup-content h3 {
        /*    background: #91c949;
        color: #fff;*/
        padding: 10px;
        border-radius: 3px 3px 0 0;
        font-weight: 700;
        margin: -15px 0 0;
    }

    .mapboxgl-popup-content h4 {
        margin: 0;
        padding: 10px;
        font-weight: 400;
    }

    .mapboxgl-popup-content div {
        /*padding: 10px;*/
    }

.mapboxgl-popup-anchor-top > .mapboxgl-popup-content {
    /*margin-top: 15px;*/
}

.mapboxgl-popup-anchor-top > .mapboxgl-popup-tip {
    /*border-bottom-color: #91c949;*/
}

#mapStyle {
    margin-left: -5px;
    margin-top: -5px;
    border-radius: 5px;
    position: absolute;
    top: 30px;
    left: 30px;
    padding: 5px;
}

.nt-button-bar {
    display: flex;
    width: 100%;
    gap: 4px;
}

.miniControl-Container {
    margin-left: -5px;
    margin-top: -5px;
    border-radius: 5px;
    position: absolute;
    top: 10px;
    right: 5px;
}
    .miniControl-Container .rz-card {
        background-color: var(--rz-base-900);
        margin-bottom: 5px;
    }


.nt-minicontrol {
    display: flex;
    flex-direction: column;
    min-width: 15rem;
}
    .nt-minicontrol .rz-splitbutton{
        width:100%;
    }
        .nt-minicontrol .rz-splitbutton > .rz-button:first-of-type {
            width: 100%;
        }

.nt-minicontrol-title {
    display: flex;
    border-bottom: 2px solid var(--bs-body-color);
    padding-bottom: 0.25rem;
    margin-bottom: 0.5rem;
}

    .nt-minicontrol-title > p {
        flex-grow: 1;
    }

    .nt-minicontrol-title > button {
        margin-left: 4px;
    }

.nt-dropdownitem {
    display: flex;
    align-items: center;
}

    .nt-dropdownitem i {
        font-size: 1.25rem;
        padding-right: 0.25rem;
    }

.nt-treenode {
    white-space: nowrap;
    margin-left: 4px;
    margin-right: 8px;
    user-select: none;
}
    .nt-treenode > svg {
        padding-right: 3px;
        display: inline-block;
        width: 24px;
    }
    .nt-treenode > div {
        display: inline-block;
    }

#app:has(.nt-sidebar) .miniControl-Container {
    right: 505px;
}

#app:has(.nt-sidebar) .rz-notification {
    right: 505px !important;
}

.icon-small {
    max-width: 1.25rem;
    max-height: 1.25rem;
    height: 1.25rem;
}

.icon-medium {
    max-width: 1.875rem;
    max-height: 1.875rem;
    height: 1.875rem;
}

.icon-large {
    max-width: 4rem;
    max-height: 4rem;
    height: 4rem;
}

.nt-map-select {
    position: absolute;
    left: 5px;
    top: 5px;
    color: white;
    cursor: pointer;
    z-index: 2;
    text-shadow: 0 0 20px #A19D8D;
    background-color: transparent !important;
}

    .nt-map-select i {
        opacity: 0.7;
    }

        .nt-map-select i:hover {
            color: white;
            opacity: 1;
        }

    .nt-map-select .rz-form-field-content:after {
        border: 0 !important;
    }

    .nt-map-select .rz-slider {
        opacity: 0.7;
    }

        .nt-map-select .rz-slider:hover {
            opacity: 1;
        }

    .nt-map-select .rz-slider-handle {
        background-color: #FFFFFF !important;
        height: 10px;
        width: 10px;
    }

    .nt-map-select .rz-slider-range {
        background-color: #FFFFFF !important;
    }


.nt-map-position {
    position: absolute;
    left: 5px;
    bottom: 5px;
    min-width: 9rem;
    padding: 0.25rem 0.75rem 0.25rem 0.75rem;
    margin-bottom: 0 !important;
}

    .nt-map-position span {
        margin-bottom: 0 !important;
    }

.map-container .map div div a div img {
    display: none;
}


.form-close-button {
    justify-content: flex-end;
    display: flex
}

.editform-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.main-display .rz-heading {
    align-self: start;
}

.titlebar-container {
    gap: 0 0.5em;
    display: flex;
    align-items: center;
    flex-direction: row;
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-end;
}

    .titlebar-container .titletext {
        flex: 1 0 auto;
    }

.nt-input {
    min-width: 50%;
    padding: 5px;
    flex: 1;
}
    .nt-input > div {
        width: 100%;
    }

    .nt-input label {
        color: #ccc !important;
    }

    .nt-input .rz-fieldset {
        height: 100%;
    }

    .nt-input .rz-state-disabled {
        background: none !important;
        border: 0 !important;
    }

        .nt-input .rz-state-disabled .rz-dropdown-label {
            background: none !important;
        }

.nt-grid {
    height: 100%;
}
.nt-grid-fixed {
    height: 400px;
}

.nt-break {
    width: 100%;
}

.nt-fieldlist {
    width: 100%;
    justify-content: left;
}

    .nt-fieldlist .rzi { user-select: none; }

    .nt-fieldlist .rz-accordion { width: 100%; }

form:has(.nt-inlineform) {
    width: 100%;
}

.nt-inlineform .nt-fieldlist, .nt-inlineform .rz-tabview-panel, .rz-dialog .nt-fieldlist, .rz-dialog .rz-tabview-panel {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}

.nt-multicolumn .nt-break {
    flex-basis: 100%;
}

.text-right {
    text-align: right;
}

.nt-validation-errors {
    color: red;
    width: 100%;
}

.nt-copy-button {
    cursor: pointer;
    font-size: 1rem;
}

    .nt-copy-button:active {
        font-size: 1.25rem;
    }

.nt-rulesform {
    /*min-height: 60rem;*/
}

.nt-dataanlysis-container {
    position: relative;
    height: 100%;
    width: 100%;
}
    .nt-dataanlysis-container .map-container {
        position: relative;
        height: 80%;
    }

.nt-radardatadistribution-selector[distributionsource="Raw"] button:first-child .rzi {
    color: #00FF00;
}
.nt-radardatadistribution-selector[distributionsource="Processed"] button:first-child .rzi {
    color: #FF0000;
}
.nt-radardatadistribution-selector[distributionsource="ClutterFloor"] button:first-child .rzi {
    color: #00BFFF;
}
.nt-radardatadistribution-selector[distributionsource="ClutterMap"] button:first-child .rzi {
    color: #FFA500;
}

.nt-processing {
    pointer-events: none;
    background: #191919;
    background: rgba(25, 25, 25, .5);
    filter: blur(2px);
    user-select: none;
}
    .nt-processing:after {
        content: " ";
        display: block;
        height: 20%;
        aspect-ratio: 1;
        margin-top: 15%;
        margin-left: 45%;
        border-radius: 50%;
        border: 16px solid #fff;
        border-color: #fff transparent #fff transparent;
        animation: nt-processing 1.2s linear infinite;
        position: absolute;
        z-index: 10000;
    }

a:not([href]):not([class]), a:not([href]):not([class]):hover {
    user-select: none;
}


@keyframes nt-processing {
    0% {
        transform: rotate(0deg);
    }

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

.rz-menuitem[distributionsource="Raw"] .rz-menuitem-icon {
    color: #00FF00;
}
.rz-menuitem[distributionsource="Processed"] .rz-menuitem-icon {
    color: #FF0000;
}
.rz-menuitem[distributionsource="ClutterFloor"] .rz-menuitem-icon {
    color: #00BFFF;
}
.rz-menuitem[distributionsource="ClutterMap"] .rz-menuitem-icon {
    color: #FFA500;
}

.nt-input input:autofill,
.nt-input input:autofill:hover,
.nt-input input:autofill:focus {
    box-shadow: inset 0 0 0 100px transparent !important;
    color: var(--rz-input-value-color) !important;
    -webkit-text-fill-color: var(--rz-input-value-color) !important;
    background: transparent !important;
    transition: background 5000s, color 5000s !important;
    appearance: auto !important;
}

.search-dialog {
    overflow: hidden;
    height: 100%;
    width: 100%
}

.search-input {
    display: block;
    padding: 5px;
    vertical-align: middle;
    text-align: center;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 40px;
}

.search-input input {
    color: black;
    background: white;
}

.searchtype-input {
    display: block;
    padding: 5px;
    vertical-align: middle;
    text-align: center;
    margin: 5px;
}

.search-dialog .rz-datatable {
    height: auto;
    max-height: 400px;
}

.colour-picker-input .rz-form-field-label {
    top: -1rem;
}

.separator {
    display: flex;
    align-items: center;
    text-align: center;
}

.separator::before,
.separator::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid var(--rz-base-300);
}

.separator:not(:empty)::before {
    margin-right: .25em;
}

.separator:not(:empty)::after {
    margin-left: .25em;
}

@media screen and (min-width: 1400px) {
    .configuration-cards > div {
        width: 50%;
    }

    .new-entity-cards > div {
        width: 50%;
    }
}

@media (max-width: 768px) {
    .nt-sidebar {
        width: 100% !important;
    }
    .nt-flex {
        display: block;
    }
    .rz-dialog-wrapper .rz-dialog {
        width: 100% !important;
    }
    .rz-dialog .nt-fieldlist, .rz-tabview-panel {
        display: block;
    }
    .nt-inlineform .nt-fieldlist, .rz-tabview-panel {
        display: block;
    }
}