﻿/* Root variables */
:root {
    --blue: #2c8ef8;
    --indigo: #727cf5;
    --purple: #6b5eae;
    --pink: #ff679b;
    --red: #fa5c7c;
    --orange: #fd7e14;
    --yellow: #ffbc00;
    --green: #0acf97;
    --teal: #02a8b5;
    --cyan: #39afd1;
    --white: #fff;
    --gray: #98a6ad;
    --gray-dark: #343a40;
    --primary: #009c6a;
    --primary-complementary: #9C0032;
    --secondary: #6c757d;
    --secondary-complementary: #7D746C;
    --success: #0acf97;
    --info: #39afd1;
    --warning: #ffbc00;
    --danger: #fa5c7c;
    --light: #eef2f7;
    --dark: #313a46;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1367px;
    --font-family-Oxygen: Oxygen;
    --font-family-sans-serif: sans-serif;
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bg-primary: #1b1e22;
    --backgroundcolor: #1b1e22;
    --modalbackgroundcolor: #30373d;
    --backgroundcolormenu: #141619;
    --backgroundcolortopmenu: #292e33;
    --label-grey: #cedce4; /*#82868e;*/
    --text-grey: #d8dde7;
    --textcolor: #aab8c5;
    --bs-body-color: white; /* comentada */
    --backgroundcontrol: #3a4249;
    --backgroundformcontrol: #404954;
    --backgroundformcontrol_disabled: #37404a;
    --borderformcontrol: #47515d;
    --textformcontrol: #e3eaef;
    --backgroundcard: #292e33;
    --ct-bg-topbar: #141619;
    --ct-primary: #009c6a;
    --ct-secondary: #6c757d;
    --ct-primary-inverse: #cb4e4e;
    --ct-primary-rgb: 0, 156, 106;
    --ct-secondary-rgb: 108, 117, 125;
    --ct-primary-inverse-rgb: 203, 78, 78;
}

body {
    font-family: var(--font-family-Oxygen);
    background-color: var(--backgroundcolor);
    overflow: hidden;
}

.badge {
    font-weight: lighter;
}

.bg-default {
    background-color: var(--backgroundcolor);
}

/* Background */
.background-primary, .card-header {
    background-color: var(--primary) !important;
}

.card-header .version {
    color: white !important;
}

.content-page {
    padding: 70px 0px 0px 0px;
}

.view-content {
    overflow: auto;
    max-height: 85vh;
    min-height: 85vh;
    max-width: 100%;
    padding-bottom: 8rem;
}

.view-content-no-menu {
    overflow: auto;
    max-height: 100vh;
    min-height: 100vh;
    max-width: 100%;
    padding-bottom: 8rem;
}

.container-fluid
{
    padding-top: 1.5rem;
}

.container-fluid-map {
    padding-top: 0px;
}

body[data-leftbar-theme=dark] .side-nav .menuitem-active > a > i {
    color: var(--primary) !important;
}

body[data-leftbar-theme=dark] .side-nav .side-nav-second-level .menuitem-active > a {
    color: var(--white) !important;
}

body[data-leftbar-theme=dark] .side-nav .side-nav-link {
    color: var(--label-grey);
}

body[data-leftbar-theme=dark] .side-nav .side-nav-forth-level li a, body[data-leftbar-theme=dark] .side-nav .side-nav-second-level li a, body[data-leftbar-theme=dark] .side-nav .side-nav-third-level li a {
    color: var(--label-grey);
}

.dropdown-item.active, .dropdown-item:active {
    background-color: var(--primary);
    opacity: 0.8;
}

.dropdown-item:focus, .dropdown-item:hover, .side-nav-link:hover {
    color: var(--white) !important;
    background-color: var(--primary) !important;
    opacity: unset !important;
}

/* Buttons */
button {
    padding: 5px !important;
}

.btn-primary {
    color: #fff;
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn-primary:hover {
    color: #fff;
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn-primary:focus, .btn-primary.focus {
    color: #fff;
    background-color: var(--primary);
    border-color: var(--primary);
    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 156, 106, 0.25);
    box-shadow: 0 0 0 0.2rem rgba(0, 156, 106, 0.25);
}

.btn-primary.disabled, .btn-primary:disabled {
    color: #fff;
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 156, 106, 0.25);
    box-shadow: 0 0 0 0.2rem rgba(0, 156, 106, 0.25);
}

[data-simplebar-primary] .simplebar-scrollbar:before {
    background: var(--primary) !important;
}


/* Bootstrap Custom control */
.form-check-label::before {
    background-color: var(--backgroundcontrol) !important;
    border-color: var(--ligth) !important;
    color: var(--backgroundcontrol) !important;
}

.form-check-input:active, .form-control:active {
    background-color: var(--backgroundcontrol) !important;
    border-color: var(--white) !important;
}

.form-check-input:focus, .form-control:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(58, 66, 73, 0.25);
    box-shadow: 0 0 0 0.2rem rgba(58, 66, 73, 0.25);
}

.form-check-input:indeterminate {
    background-color: var(--backgroundcontrol) !important;
    border-color: var(--primary) !important;
}


/* Top Menu */
.topnav-navbar-dark, .topnav-navbar-dark.logo-lg, .topnav-navbar-dark.logo-sm {
    background-color: var(--backgroundcolortopmenu) !important;
    border: none;
}

.topnav-navbar-dark li a {
    color: var(--white);
    background: var(--backgroundcolortopmenu) !important;
    border: none !important;
}

.topnav-navbar-dark .nav-user {
    box-shadow: none; /* 0 2px 10px 0 rgba(0, 0, 0, 0.25);*/
    background-color: var(--backgroundcolortopmenu);
    color: var(--white);
    border: none;
}

/* Left Menu */
body[data-leftbar-theme=dark] .leftside-menu, body[data-leftbar-theme=dark] .leftside-menu .logo {
    background: var(--backgroundcolormenu) !important;
}

.side-nav-link:hover i {
    color: var(--primary) !important;
    font-weight: bold !important;
}

.side-nav .side-nav-item:hover .side-nav-link {
    background: var(--backgroundcolormenu);
}

.side-nav-item:hover i {
    color: var(--primary) !important;
}

.nav-link:hover {
    color: var(--primary)
}

/* Card */
.card {
    margin: 5px 0 0 0;
    padding: 0;
    border-radius: 12px;
    box-shadow: 0 0 8px 0 rgb(0 0 0 / 20%);
    background-color: var(--backgroundcard);
}

.card-header {
    background-color: var(--backgroundcard);
}

.card-body {
    background-color: var(--backgroundcard);
    padding: 1.5rem 1.25rem !important;
}

.index-card {
    margin: 0;
    padding: 1rem;
    background-color: var(--ct-card-bg);
    box-shadow: 0 0 8px 0 rgb(0 0 0 / 20%);
}

.payment .card-body {
    background-color: transparent;
}


.card .header-title {
    text-transform: none;
    margin: 0 !important;
    padding-top: 0.35rem !important;
    padding-bottom: 0.35rem !important;
}

.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 {
    color: var(--white);
}

.card-pricing .text-primary {
    color: var(--white) !important;
    background-color: var(--primary) !important;
}

.card-pricing .card-pricing-icon {
    font-size: xx-large;
}

.fleet-configurations-card {
    margin: 1rem 0 0 0;
    padding-top: 1rem;
    padding-bottom: 1rem;
    box-shadow: 0 0 8px 0 rgb(0 0 0 / 20%);
    color: var(--ct-input-color);
    background-clip: border-box;
    background-color: var(--ct-card-bg);
    border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
}

/* Label */
label {
    font-size: 12px;
    line-height: normal;
    color: var(--label-grey);
    font-weight: normal;
    padding-bottom: 0.75rem;
}

.form-check-label {
    font-size: inherit;
    line-height: 1.5;
}

/* Value */
.Prime_value
{
    color: var(--ct-input-color);
}

/* Input */
input {
    font-family: Oxygen;
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: var(--text-grey);
}

/* Modal */
.modal-content {
    background-color: var(--modalbackgroundcolor);
}

/* List */
li.previous.disabled {
    display: none;
}

li.next.disabled {
    display: none;
}

li.next.submit {
    display: none;
}

li.next.submit.disabled {
    display: initial;
}

/* Autocomplete */
.ui-autocomplete {
    position: absolute;
    z-index: 1000;
    cursor: default;
    padding: 0;
    margin-top: 1px;
    list-style: none;
    background-color: var(--backgroundformcontrol);
    border: 1px solid var(--borderformcontrol);
    -webkit-border-radius: 2px;
    color: var(--textformcontrol);
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.ui-autocomplete > li {
    padding: 1px 10px;
}

.ui-widget.ui-widget-content {
    border: none !important;
}

.ui-state-hover,
.ui-state-active,
.ui-state-focus {
    color: var(--textformcontrol) !important;
    background-color: var(--primary) !important;
    cursor: pointer !important;
    border: 0px solid var(--borderformcontrol);
    -webkit-border-radius: 2px !important;
    -moz-border-radius: 2px !important;
    border-radius: 2px !important;
}

.ui-helper-hidden-accessible {
    display: none;
}

/* Select2 drop-down selectable */

.select2-container--default .select2-selection--single .select2-selection__clear,
.select2-container--default .select2-selection--multiple .select2-selection__clear {
    padding-right: 15px !important;
    color: var(--bs-body-color);
}

.select2-container .select2-selection--multiple .select2-selection__choice__remove {
    color: #fff;
    margin-right: 7px;
    /* border-color: #8089f6; */
    padding-top: 0px !important;
    padding-right: 8px !important;
    padding-bottom: 0px !important;
    padding-left: 8px !important;
}

.select2-container .select2-selection--multiple .select2-selection__choice__remove:hover {
    background-color: var(--secondary) !important;
}

.select2-container--default.select2-container--disabled .select2-selection--multiple,
.select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: var(--backgroundformcontrol_disabled);
    cursor: default;
}

.select2-container--default.select2-container--disabled .select2-selection__clear {
    visibility: hidden;
}

.select2-dropdown {
    min-width: min-content;
}

/* Others */
.fit-content {
    width: 100%;
}

.custom-control-input:disabled ~ .custom-control-label.text-hide, .custom-control-input[disabled] ~ .custom-control-label.text-hide {
    color: transparent;
}

.cta-box > .card-body {
    background-color: revert;
}

.bootbox-body .form-label {
    font-size: 15px;
    color: #aab8c5;
}

.bootbox-body {
    max-height: 80vh;
    overflow-y: auto;
}


.content-page-p-0px {
    padding-right: 0px !important;
    padding-left: 0px !important;
}


.form-wizard-header {
    margin-left: unset;
    margin-right: unset;
}

.coordinatePopUp .label-data {
    width: 123px;
    height: 19px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font-family: Oxygen;
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: var(--text-grey);
}

.coordinatePopUp .label-data .col-form-label {
    width: 123px;
    height: 15px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font-family: Oxygen;
    font-size: 12px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: var(--label-grey);
}

.coordinatePopUp .label-data i {
    padding-right: 1rem;
}


.daterangepicker .ranges li.active {
    background-color: var(--primary);
}

.daterangepicker td.active, .daterangepicker td.active:hover {
    background-color: var(--primary) !important;
    color: #fff !important;
}

.daterangepicker td.available:hover, .daterangepicker th.available:hover {
    background-color: var(--primary);
    color: #fff;
}

.progress-bar {
    background-color: var(--white);
}

.list-group-item.active {
    z-index: 2;
    color: #fff;
    background-color: var(--primary);
    border-color: var(--light);
}


.form-group {
    margin-bottom: 10px;
}


.notification-list .noti-icon-fa {
    font-size: 22px;
    vertical-align: middle;
}

.notify-item-FCM-message {
    font-size: 1.5rem;
    line-height: 1.5;
}

.text-primary {
    color: var(--primary) !important;
}

body[data-leftbar-theme=dark][data-leftbar-compact-mode=condensed] .side-nav .side-nav-item:hover .side-nav-link {
    background: var(--primary) !important;
    color: var(--white) !important;
}

body[data-leftbar-compact-mode=condensed]:not(.authentication-bg) .side-nav .side-nav-item .side-nav-link i {
    color: var(--white) !important;
}

th.dt-center, td.dt-center {
    text-align: center;
}

.btn-link {
    color: var(--primary) !important;
}

.conversation-date {
    font-size: 10px !important;
}


.theme-prime-duotone {
    --fa-secondary-opacity: 1.0;
    --fa-primary-color: var(--primary);
    --fa-secondary-color: var(--label-grey);
}

.theme-prime-duotone:hover {
    --fa-secondary-opacity: 1.0;
    --fa-primary-color: var(--label-grey);
    --fa-secondary-color: var(--primary);
}

.theme-prime-about {
    --fa-secondary-opacity: 1.0;
    --fa-primary-color: var(--label-grey);
    --fa-secondary-color: var(--primary);
}

.theme-prime-about:hover {
    --fa-secondary-opacity: 1.0;
    --fa-primary-color: var(--primary);
    --fa-secondary-color: var(--label-grey);
}


.theme-prime-shift {
    --fa-secondary-opacity: 1.0;
    --fa-primary-color: var(--label-grey);
    --fa-secondary-color: var(--primary);
}

.theme-prime-shift:hover {
    --fa-secondary-opacity: 1.0;
    --fa-primary-color: var(--label-grey);
    --fa-secondary-color: var(--primary);
}

.menuitem-active > a > .theme-prime-shift,
.side-nav-link[aria-expanded="true"] > .theme-prime-duotone {
    --fa-secondary-opacity: 1.0;
    --fa-primary-color: var(--label-grey);
    --fa-secondary-color: var(--primary);
}

.side-nav-item > a:hover .theme-prime-shift,
.menuitem-active:hover > .theme-prime-shift,
.notify-item:hover > .theme-prime-shift {
    --fa-primary-color: var(--label-grey);
    --fa-secondary-color: var(--label-grey);
}


.menuitem-active > a > .theme-prime-duotone,
.side-nav-link[aria-expanded="true"] > .theme-prime-about {
    --fa-secondary-opacity: 1.0;
    --fa-primary-color: var(--primary);
    --fa-secondary-color: var(--primary);
}

.side-nav-item > a:hover .theme-prime-about,
.menuitem-active:hover > .theme-prime-about,
.notify-item:hover > .theme-prime-about {
    --fa-primary-color: var(--primary);
    --fa-secondary-color: var(--label-grey);
}

.menuitem-active > a > .theme-prime-duotone,
.side-nav-link[aria-expanded="true"] > .theme-prime-duotone {
    --fa-secondary-opacity: 1.0;
    --fa-primary-color: var(--label-grey);
    --fa-secondary-color: var(--primary);
}

.side-nav-item > a:hover .theme-prime-duotone,
.menuitem-active:hover > .theme-prime-duotone,
.notify-item:hover > .theme-prime-duotone {
    --fa-primary-color: var(--label-grey);
    --fa-secondary-color: var(--label-grey);
}

/*.dropdown-item:focus .theme-prime-duotone, 
.dropdown-item:hover .theme-prime-duotone, 
.side-nav-link:focus .theme-prime-duotone,
.side-nav-link:hover .theme-prime-duotone {
    --fa-primary-color: var(--label-grey);
    --fa-secondary-color: var(--label-grey);
}*/

.dropdown-header {
    padding: unset;
    color: var(--primary);
}

.maplibregl-popup {
    color: var(--textcolor);
}

.fa-cosa {
    --fa-primary-color: rgb(225,19,131);
    --fa-secondary-color: rgb(245,130,31);
    --fa-primary-opacity: 1 !important;
    --fa-secondary-opacity: 1 !important;
}

.mapbox-gl-draw_polygon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cdefs%3E%3Cstyle%3E.fa-secondary%7Bopacity:.4%7D .fa-primary%7Bfill:%23009c6a%7D%3C/style%3E%3C/defs%3E%3Cpath class='fa-primary' d='M128 96C128 131.3 99.35 160 64 160C28.65 160 0 131.3 0 96C0 60.65 28.65 32 64 32C99.35 32 128 60.65 128 96zM448 96C448 131.3 419.3 160 384 160C348.7 160 320 131.3 320 96C320 60.65 348.7 32 384 32C419.3 32 448 60.65 448 96zM0 416C0 380.7 28.65 352 64 352C99.35 352 128 380.7 128 416C128 451.3 99.35 480 64 480C28.65 480 0 451.3 0 416zM448 416C448 451.3 419.3 480 384 480C348.7 480 320 451.3 320 416C320 380.7 348.7 352 384 352C419.3 352 448 380.7 448 416zM224 256C224 220.7 252.7 192 288 192C323.3 192 352 220.7 352 256C352 291.3 323.3 320 288 320C252.7 320 224 291.3 224 256z'/%3E%3Cpath class='fa-secondary' d='M119.4 64H328.6C323.1 73.41 320 84.34 320 96C320 107.7 323.1 118.6 328.6 128H119.4C124.9 118.6 128 107.7 128 96C128 84.34 124.9 73.41 119.4 64zM64 352C52.34 352 41.41 355.1 32 360.6V151.4C41.41 156.9 52.34 159.1 64 159.1C75.66 159.1 86.59 156.9 96 151.4V360.6C86.59 355.1 75.66 352 64 352zM119.4 448C124.9 438.6 128 427.7 128 416C128 404.3 124.9 393.4 119.4 384H328.6C323.1 393.4 320 404.3 320 416C320 427.7 323.1 438.6 328.6 448H119.4zM384 352C360.4 352 339.8 364.8 328.7 383.7L292.2 319.9C315.7 318.4 335.7 304.2 345.5 284.1L384.3 352L384 352zM292.2 192.1L328.7 128.3C339.8 147.2 360.4 160 384 160L384.3 159.1L345.5 227.9C335.7 207.8 315.7 193.7 292.2 192.1L292.2 192.1z'/%3E%3C/svg%3E") !important;
}

.mapbox-gl-draw_trash {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cdefs%3E%3Cstyle%3E.fa-secondary%7Bopacity:.4%7D.fa-primary%7Bfill:%23009c6a%7D%3C/style%3E%3C/defs%3E%3Cpath class='fa-primary' d='M284.2 0C296.3 0 307.4 6.848 312.8 17.69L320 32H416C433.7 32 448 46.33 448 64C448 81.67 433.7 96 416 96H32C14.33 96 0 81.67 0 64C0 46.33 14.33 32 32 32H128L135.2 17.69C140.6 6.848 151.7 0 163.8 0H284.2z'/%3E%3Cpath class='fa-secondary' d='M416 448C416 483.3 387.3 512 352 512H96C60.65 512 32 483.3 32 448V96H416V448zM144 176C144 167.2 136.8 160 128 160C119.2 160 112 167.2 112 176V400C112 408.8 119.2 416 128 416C136.8 416 144 408.8 144 400V176zM240 176C240 167.2 232.8 160 224 160C215.2 160 208 167.2 208 176V400C208 408.8 215.2 416 224 416C232.8 416 240 408.8 240 400V176zM336 176C336 167.2 328.8 160 320 160C311.2 160 304 167.2 304 176V400C304 408.8 311.2 416 320 416C328.8 416 336 408.8 336 400V176z'/%3E%3C/svg%3E") !important;
}

.mapbox-gl-draw_select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cdefs%3E%3Cstyle%3E.fa-secondary%7Bopacity:.4%7D.fa-primary%7Bfill:%23009c6a%7D%3C/style%3E%3C/defs%3E%3Cpath class='fa-secondary' d='M432 288v80c0 76.09-59.49 137.9-134.3 143C294.6 511.7 291.3 512 288 512H176c-45.09 0-88.16-21.53-115.2-57.61l-19.19-25.59C35.38 420.5 32 410.4 32 400V352c0-14.58 6.625-28.38 17.1-37.48l29.99-23.99v45.47c0 8.836 7.162 16 16 16c8.836 0 16.01-7.161 16.01-15.1L112 40C112 17.91 129.9 0 152 0S192 17.91 192 40v164.5C200.5 196.8 211.7 192 224 192c23.48 0 42.96 16.88 47.11 39.17C279.5 217.3 294.6 208 312 208c23.47 0 42.94 16.87 47.11 39.14C366.4 242.7 374.9 240 384 240C410.5 240 432 261.5 432 288z'/%3E%3C/svg%3E") !important;
}

.mapbox-gl-draw_static {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cdefs%3E%3Cstyle%3E.fa-secondary%7Bopacity:.4%7D.fa-primary%7Bfill:%23009c6a%7D%3C/style%3E%3C/defs%3E%3Cpath class='fa-primary' d='M304 448c-9.6 0-16-6.4-16-16c0-44.8-35.2-80-80-80C198.4 352 192 345.6 192 336S198.4 320 208 320h160c9.6 0 16 6.4 16 16S377.6 352 368 352h-83.2C307.2 374.4 320 403.2 320 432C320 441.6 313.6 448 304 448z'/%3E%3Cpath class='fa-secondary' d='M448 96c-17.67 0-32 14.33-32 32v112C416 248.8 408.8 256 400 256s-15.93-7.164-15.93-16L384 64c0-17.67-14.33-32-32-32s-32 14.33-32 32l.0498 176c0 8.836-7.219 16-16.05 16S288 248.8 288 240L288 32c0-17.67-14.33-32-32-32S224 14.33 224 32l.0729 208C224.1 248.8 216.8 256 208 256S192.1 248.8 192.1 240L192 64c0-17.67-14.33-32-32-32S128 46.33 128 64v279.4L68.28 283.7C60.47 275.9 50.23 272 40 272C17.15 272 0 290.7 0 312c0 10.23 3.906 20.47 11.72 28.28l113.1 113.1C162.6 491.2 212.9 512 266.3 512H304c97.05 0 176-78.95 176-176V128C480 110.3 465.7 96 448 96zM368 352h-83.2C307.2 374.4 320 403.2 320 432c0 9.6-6.4 16-16 16S288 441.6 288 432c0-44.8-35.2-80-80-80C198.4 352 192 345.6 192 336S198.4 320 208 320h160c9.6 0 16 6.4 16 16S377.6 352 368 352z'/%3E%3C/svg%3E") !important;
}

.mapbox-gl-draw_snap {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cdefs%3E%3Cstyle%3E.fa-secondary%7Bopacity:.4%7D.fa-primary%7Bfill:%23009c6a%7D%3C/style%3E%3C/defs%3E%3Cpath class='fa-primary' d='M128 160V256C128 309 170.1 352 224 352C277 352 320 309 320 256V160H448V256C448 379.7 347.7 480 224 480C100.3 480 0 379.7 0 256V160H128z'/%3E%3Cpath class='fa-secondary' d='M0 64C0 46.33 14.33 32 32 32H96C113.7 32 128 46.33 128 64V160H0V64zM320 64C320 46.33 334.3 32 352 32H416C433.7 32 448 46.33 448 64V160H320V64z'/%3E%3C/svg%3E") !important;
}

.mapbox-gl-draw_ctrl-draw-btn {
    width: 32px !important;
    height: 32px !important;
}

.apexcharts-tooltip-text {
    color: white!important;
}

thead .select2-container .select2-selection--single .select2-selection__rendered {
    font-weight: normal;
    height:auto;
    line-height:unset;
    padding-top:0.4rem;
}

thead .select2-container .select2-selection--single {
    border: 1px solid var(--ct-input-border-color);
    height: auto !important;
    background-color: var(--ct-input-bg);
    outline: 0;
    min-height: calc(1.5em + 0.56rem + 2px);
    padding: none;
    font-size: .875rem;
    border-radius: 0.2rem;
}

i.fa-badge-check-gw, i.fa-circle-xmark-rw {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

i.fa-badge-check-gw:before, i.fa-circle-xmark-rw:before {
    z-index: 1
}

i.fa-badge-check-gw {
    color: var(--primary) !important;
}

i.fa-circle-xmark-rw {
    color: #d63939 !important;
    font-size: 1.1em;
    line-height: .05em;
    vertical-align: -0.075em;
}

i.fa-badge-check-gw span, i.fa-circle-xmark-rw span {
    position: absolute;
    background-color: white; /*Desired background color*/
    height: 0.7rem;
    width: 0.7rem;
    border-radius: 100%;
}

span.select2-selection {
    overflow: hidden;
}

/* Select2 arrow not showing bugfix: https://stackoverflow.com/questions/46363341/select2-is-not-showing-arrow-down-icon (there is a yt video also) */
.select2-selection--multiple:before {
    content: "";
    position: absolute;
    right: 8px;
    top: 42%;
    border-top: 6px solid #8391a2;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
}

/*On hover elements*/
.onHoverGreen:hover {
    color: var(--ct-link-hover-color);
}

.onHoverGlowWhite:hover {
    color: white;
    text-shadow: 0 0 2px white;
}

/*Scrollbar CSS*/
@media (min-width: 575.98px) {
    ::-webkit-scrollbar {
        height: 4px;
        width: 3px;
    }

    ::-webkit-scrollbar-thumb {
        background-color: #5f5e5e;
        border-radius: 100px;
        margin-right: 10px;
    }

    ::-webkit-scrollbar-thumb:hover {
        background-color: #b5b5b5;
    }

    /* Info from: https://stackoverflow.com/questions/44061644/how-can-i-style-the-small-squared-space-between-vertical-scrollbars-and-horizont */
    ::-webkit-scrollbar-corner {
        background: transparent;
    }
}

/*Toggle Switch*/
.toggle-switch {
    position: relative;
    display: inline-block;
    width: 2.8rem;
    height: 1.3rem;
}

.toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #4e5865;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 34px;
}

.toggle-switch .slider:before {
    position: absolute;
    content: "";
    height: 0.9rem;
    width: 0.9rem;
    left: 0.2rem;
    bottom: 0.23rem;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 50%;
}

.toggle-switch input:checked + .slider {
    background-color: #34cf8d;
}

.toggle-switch input:focus + .slider {
    box-shadow: 0 0 1px #34cf8d;
}

.toggle-switch input:checked + .slider:before {
    -webkit-transform: translateX(1.4rem);
    -ms-transform: translateX(1.4rem);
    transform: translateX(1.4rem);
    height: 1rem;
    width: 1rem;
    bottom: 0.15rem;
}

@media (max-width: 767.98px), (max-device-width: 896px) and (orientation: landscape) and (pointer: coarse) {
    .leftside-menu {
        display: none !important;
        position: fixed !important;
        left: -260px !important;
        top: 0;
        height: 100%;
        z-index: 1040 !important;
        transition: all 0.3s ease;
    }

    body.sidebar-enable .leftside-menu {
        display: block !important;
        left: 0 !important;
    }

    .wrapper,
    .content-page {
        margin-left: 0 !important;
    }

    .button-sm-hover,
    .button-toggle-menu {
        display: inline-flex !important;
    }

    .navbar-custom {
        padding-left: 2rem;
        left: 0%;
    }
}
