﻿
:root{
    --MjTechGreenDark: #4d8019;
    --MjTechGreen: #6AB023;
    --MjTechGreenLight:#cceeaa;
    --MjTechBlue: #26358c;
    --error: red;
    --offline: grey;
    --noDeviceConnected:black;
}

.mjtechGreen{
    color: var(--MjTechGreen) !important;
}

.mjtechError {
    color: var(--error) !important;
}

.navbar-brand {
    color: var(--MjTechBlue);
}

.btn.btn-primary{
    background-color: var(--MjTechBlue);
}

.btn.btn-success{
    background-color: var(--MjTechGreen);
    border-color: var(--MjTechGreen);
}

.btn.btn-outline-success{
    color: var(--MjTechGreen);
    border-color: var(--MjTechGreen);
}

.btn.btn-outline-success:hover{
    color: #fff;
    background-color: var(--MjTechGreen);
    border-color: var(--MjTechGreen);
}

.badge.badge-pill.badge-soft-success{
    color: var(--MjTechGreenDark);
    background-color: var(--MjTechGreenLight);
}

.text-primary, .active {
    color: var(--MjTechBlue) !important;
}
.td-align-text-right{
    text-align: right;
}

.placeholder {
    -webkit-clip-path: polygon(100% 22%, 0% 100%, 100% 100%);
    clip-path: polygon(100% 22%, 0% 100%, 100% 100%);
    opacity: 0.9;
    position: fixed;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.alert-btn {
    position: absolute;
    right: 0;
    top: 0;
    box-shadow: none;
}

#dropwdownUserName:hover{
    background-color: rgba(0,0,0,0);
}

#myMap {
    height: 100%;
    width: 100%;
    box-shadow: 0 7px 14px 0 rgb(65 69 88 / 10%), 0 3px 6px 0 rgb(0 0 0 / 7%);
    border-radius: 0.375rem;
}

div.map-copyright.light {
    display: none !important;
}

#editMap {
    height: 30vh;
    width: 100%;
    box-shadow: 0 7px 14px 0 rgb(65 69 88 / 10%), 0 3px 6px 0 rgb(0 0 0 / 7%);
    border-radius: 0.375rem;
}

.edit-toggle {
    position: absolute;
    z-index: 1000;
    display: inline-block;
    right: 24px;
    margin-top: 16px;
}

.unit-url:hover {
    text-decoration: none;
}

p {
    color: #344050;
}

.treeview-row-even, .treeview-row-odd {
    margin: 4px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.treeview [data-bs-toggle=collapse][aria-expanded=true] .treeview-text::before, .treeview [data-bs-toggle=collapse] .treeview-text::before {
    content: initial !important;
}

.treeview [data-bs-toggle=collapse]:after {
    left: 12px !important;
}

.navbar-vertical.navbar-expand-xl .navbar-vertical-content {
    width: 10rem;
}

@media (min-width: 1200px)
{
    .navbar-vertical.navbar-expand-xl
    {
        max-width : 10rem;
    }
}
@media (min-width: 1200px) {
    .navbar-vertical.navbar-expand-xl+.content
    {
        margin-left : 10rem;
    }
}
.navbar-vertical .toggle-icon-wrapper {
    margin-left: -0.75rem;
    padding-left: 0.125rem;
    margin-right: 0.75rem;
}

@media (min-width: 1200px) {
    .navbar-vertical.navbar-expand-xl .navbar-collapse {
        width: 10rem;
    }
}

.toggle-view {
    height: 100%;
    margin: 10px 4px;
    display: flex;
}

.text-overflow-full {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#searchResultsShortList {
    z-index: 2;
    display: block;
    position: fixed;
}

.row-start::before
{
    content: " ";
    width: 10px;
    height: 100%;
    display: block;
    position: absolute;
    left: 0px;
    top: 0;
}

.row-start.red::before {
    background: var(--error);
}

.row-start.green::before {
    background: var(--MjTechGreen);
}

.row-start.grey::before {
    background: var(--offline);
}

.row-start.black::before{
    background: var(--noDeviceConnected);
}

.row-start {
    position: relative;
}

#units-dropdown-1 {
    position: relative;
    top: 30px;
    z-index: 1;
    margin-left: auto;
    display: flex;
    justify-content: flex-end;
}


#update-nav {
    width: 100%;
    height: 30px;
}
#range-selector {
    width: 50%;
    float: left;
    font-family: var(--falcon-font-sans-serif) !important;
}
#date-selector {
    width: 50%;
    float: right;
    font-family: var(--falcon-font-sans-serif) !important;
}

.daterangepicker{
    font-family: var(--falcon-font-sans-serif) !important;
}

.hamburgerButton{
    display:none !important;
    background-color: #0A3B79;
}
.center-td{
    text-align: center !important;
}
@media only screen and (max-width: 768px)
{
    /* For mobile phones: */
    [class*="col-"]
    { display: initial;
        
    }
}

.dropdown-toggle:after, .dropdown-toggle:before {
    display: none;
}

/* =============== Unit lamp styles =============== */

.lamp{
    height: 14px;
    width:  14px;
    background-color: grey;
    border: 1px solid grey;
    border-radius: 50%;
    margin-top: 3px;
}
.lamp-0{
    background-color: var(--MjTechGreen);
    border-color: var(--MjTechGreen);
}
.lamp-1{
    background-color: var(--MjTechBlue);
    border-color: var(--MjTechBlue);
}
.lamp-4{
    background-color: orange;
    border-color: orange;
}
.lamp-16{
    background-color: red;
    border-color: red;
}
.lamp-64{
    background-color: black;
    border-color: black;
}
.lamp-info {
    background-color: #fff;   
}