:root {
    --color-font: #000;
    --color-btn-primary: #0284FE;
    --color-btn-success: #36AB80;
    --color-btn-danger: #FE3E3E;
    --color-btn-warning: #FFAB00;
    --color-btn-primary-a29: #0284FE4A;
    --color-btn-secondary-a29: #6C757D4A;
    --color-btn-success-a29: #36AB804A;
    --color-btn-danger-a29: #FE3E3E4A;
    --color-btn-warning-a29: #FFAB004A;
    --color-text-yellow: #6E6603;
    --color-text-green: #298361;
    --color-text-red: #7A0C0C;
    --color-text-blue: #0E6691;
    --color-text-grey: #524E4E;
    --color-btn-primary-disabled: #5AAAFF;
    --color-btn-secondary-disabled: #A0A6AB;
    --color-btn-success-disabled: #E9F9F0;
    --color-btn-danger-disabled: #FFF3F1;
    --color-btn-warning-disabled: #FFFAF1;
    --color-components: #0284FE;
    --color-ignition-on: #54AF6E;
    --color-ignition-off: #FF0934;
    --color-ignition-idle: #FFB517;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    background: var(--color-font);
    cursor: pointer;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f3f3f3;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: var(--color-btn-secondary-disabled);
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
}


/* -------------------------------------------------------------------------------- */
/* ----------------------------------- Patterns ----------------------------------- */
/* -------------------------------------------------------------------------------- */

/* roboto-300 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300.eot'); /* IE9 Compat Modes */
    src: local('Roboto Light'), local('Roboto-Light'),
            url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
            url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
            url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300.woff') format('woff'), /* Modern Browsers */
            url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
            url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-300italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 300;
    src: url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300italic.woff') format('woff'), /* Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-regular - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Roboto'), local('Roboto-Regular'),
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Italic'), local('Roboto-Italic'),
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-italic.woff') format('woff'), /* Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-500 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500.eot'); /* IE9 Compat Modes */
    src: local('Roboto Medium'), local('Roboto-Medium'),
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500.woff') format('woff'), /* Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-500italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 500;
    src: url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'),
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500italic.woff') format('woff'), /* Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-500italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-700 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700.eot'); /* IE9 Compat Modes */
    src: local('Roboto Bold'), local('Roboto-Bold'),
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700.woff') format('woff'), /* Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-700italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 700;
    src: url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'),
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700italic.woff') format('woff'), /* Modern Browsers */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('https://ux.cdn.gesfrota.pt/fonts/roboto-v20-latin-700italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

body {
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
}

a {
    color: #0061E0;
}

    a:hover {
        color: #6C757D;
    }

p {
    color: var(--color-font);
}

.h1, h1 {
    font-size: 55px;
}

.h2, h2 {
    font-size: 45px;
}

h3, h3 {
    font-size: 35px;
}

h4, h4 {
    font-size: 25px;
}

h5, h5 {
    font-size: 20px;
}

h6, h6 {
    font-size: 15px;
}

div.large,
span.large,
p.large,
a.large,
label.large {
    font-size: 15px;
}

div.small,
span.small,
p.small,
a.small,
label.small {
    font-size: 11px;
}

.roboto-light {
    font-weight: 300;
}

.roboto-regular {
    font-weight: 400;
}

.roboto-medium {
    font-weight: 500;
}

.roboto-bold {
    font-weight: 700;
}

/* -------------------------------------------------------------------------------- */
/* ---------------------------------- Utilities ----------------------------------- */
/* -------------------------------------------------------------------------------- */

.gf-bg-1 {
    background-color: #fff;
}

.gf-bg-2 {
    background-color: #f9f9f9;
}

.gf-bg-3 {
    background-color: #f5f5f5;
}

.gf-bg-4 {
    background-color: #f1f1f1;
}

.gf-bg-top-bar {
    background-color: #017BFF;
}

.gf-bg-side-bar {
    background-color: #373E46;
}

.gf-bg-vehicle-on {
    background-color: var(--color-ignition-on);
}

.gf-bg-vehicle-idle {
    background-color: var(--color-ignition-idle);
}

.gf-bg-vehicle-off {
    background-color: var(--color-ignition-off);
}

.gf-color-vehicle-on {
    color: var(--color-ignition-on) !important;
}

.gf-color-vehicle-idle {
    color: var(--color-ignition-idle) !important;
}

.gf-color-vehicle-off {
    color: var(--color-ignition-off) !important;
}

/* -------------------------------------------------------------------------------- */
/* ---------------------------------- Components ---------------------------------- */
/* -------------------------------------------------------------------------------- */

/* Avatars */
.gf-avatar {
    border-radius: 50%;
    border-style: solid;
    border-width: thin;
    border-color: #f9e3e3ab;
}

    .gf-avatar.x-large {
        height: 96px;
        width: 96px;
    }

    .gf-avatar.large {
        height: 40px;
        width: 40px;
    }

    .gf-avatar.medium {
        height: 32px;
        width: 32px;
    }

    .gf-avatar.small {
        height: 24px;
        height: 24px;
    }

.gf-avatar-file-upload input[type="file"] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0;
    margin: 0;
    opacity: 0;
}

.gf-avatar-file-upload .btn {
    position: relative;
    border-radius: 50%;
    bottom: 30px;
    left: 66px;
    width: 30px;
}

/* Buttons */
.btn {
    font-size: 15px;
    height: 38px;
    letter-spacing: 0px;
}

.btn-lg {
    height: 48px;
}

.btn-sm {
    height: 30px;
}

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

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

.btn-secondary:disabled {
    background-color: var(--color-btn-secondary-disabled);
    border-color: var(--color-btn-secondary-disabled);
}

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

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

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

.btn-danger:disabled {
    background-color: var(--color-btn-danger-disabled);
    border-color: var(--color-btn-danger-disabled);
    color: var(--color-btn-danger);
}

.btn-warning {
    background-color: var(--color-btn-warning);
    border-color: var(--color-btn-warning);
    color: white;
}

.btn-warning:disabled {
    background-color: var(--color-btn-warning-disabled);
    border-color: var(--color-btn-warning-disabled);
    color: var(--color-btn-warning);
}

.btn-warning:hover:not(:disabled):not(.disabled) {
    color: white;
}

.btn-link:hover:disabled {
    text-decoration: none;
}

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

.btn-outline-primary:hover {
    background-color: var(--color-btn-primary);
    border-color: var(--color-btn-primary);
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
    color: var(--color-btn-primary);
    background-color: transparent;
}

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

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

.btn-outline-success.disabled,
.btn-outline-success:disabled {
    color: var(--color-btn-success);
    background-color: transparent;
}

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

.btn-outline-warning:hover {
    background-color: var(--color-btn-warning);
    border-color: var(--color-btn-warning);
    color: white;
}

.btn-outline-warning.disabled,
.btn-outline-warning:disabled {
    color: var(--color-btn-warning);
    background-color: transparent;
}

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

.btn-outline-danger:hover {
    background-color: var(--color-btn-danger);
    border-color: var(--color-btn-danger);
}

.btn-outline-danger.disabled,
.btn-outline-danger:disabled {
    color: var(--color-btn-danger);
    background-color: transparent;
}

.btn.circle {
    border-radius: 50%;
    width: 38px;
    vertical-align: middle;
    justify-content: center;
    align-content: center;
    display: inline-grid;
}

.btn-sm.circle {
    width: 30px;
}

.btn-lg.circle {
    width: 48px;
}

.dropdown > .btn {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Navs */
.gf-nav-tabs {
    margin-bottom: 1rem;
}

.gf-nav-tabs .nav-link {
    color: #373E46;
    font-size: 15px;
}

.gf-nav-tabs .nav-link:hover {
    border-color: transparent;
    border-bottom: 3px solid #dee2e6;
    color: #373E46;
    text-shadow: 0 0 0.01px #373E46;
}

.gf-nav-tabs .nav-link.active {
    border-color: transparent;
    border-bottom: 3px solid #075EC3;
    color: #075EC3;
    text-shadow: 0 0 0.01px #075EC3;
    background-color: transparent;
}

/* Forms */
.form-control,
.form-control:focus,
.form-control + div span {
    color: var(--color-font);
    font-size: 13px;
}

.form-label-group label {
    font-size: 13px;
}

.form-label-group input, 
.form-label-group label {
    height: 38px;
    padding: .55rem;
}

.form-label-group textarea {
    padding: .55rem;
}

.chosen-container {
    font-size: 13px;
}

.chosen-container .chosen-drop {
    border: unset;
    margin-top: 2px;
    -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
}

.chosen-container .chosen-results li.highlighted {
    background-color: var(--color-components);
}

.chosen-container .chosen-results li.result-selected:before {
    height: 14px;
    top: .1rem;
}

.chosen-container-active .chosen-choices {
    box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
}

.chosen-container-active .chosen-choices .search-field input[type=text] {
    color: var(--color-font) !important;
}

.chosen-container-single .chosen-single,
.chosen-container-multi .chosen-choices .search-field input[type=text],
.chosen-unsupported {
    height: 38px;
    padding-top: 1.05rem;
    padding-bottom: .2rem;
    padding-left: .25rem;
    padding-right: 1rem;
}

.chosen-container-single .chosen-single {
    line-height: normal;
}

.chosen-container-single .chosen-single span {
    padding-left: .25rem;
}

.chosen-container-single .chosen-single abbr {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23524E4E' d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E")
}

.chosen-container-single .chosen-search input[type=text] {
    height: 30px;
    background-color: #fff;
}

.chosen-container-active.chosen-with-drop .chosen-single {
    color: #495057;
    background-color: #fff;
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
}

.chosen-container-single .chosen-search:after {
    top: .3rem;
}

.chosen-container-multi .chosen-choices {
    padding: unset;
}

.chosen-container-multi .chosen-choices .search-field input[type=text] {
    padding-left: .5rem;
}

.chosen-container-multi .chosen-choices .search-choice,
.chosen-container-multi .chosen-choices .search-field {
    height: 24px;
    margin: .375rem .25rem;
}

.chosen-container-multi .chosen-choices .search-choice {
    border: none;
    background-color: var(--color-btn-secondary-a29);
    border-radius: 1rem;
    padding: .35rem 1.8rem .25rem .8rem;
}

.chosen-container-multi .chosen-choices .search-choice > span {
    color: var(--color-text-grey);
}

.chosen-container-multi .chosen-choices .search-choice ~ li.search-field input[type=text] {
    padding-top: unset;
    padding-bottom: unset;
    padding-right: unset;
    height: 24px;
}

.chosen-container-multi .chosen-choices .search-choice .search-choice-close {
    top: .25rem;
    right: .4rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23524E4E' d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E")
}

.chosen-container-multi .chosen-choices .search-choice .search-choice-close:hover,
.chosen-container-single .chosen-single abbr:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%236c757d' d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E")
}

.chosen-container-multi ~ label {
    width: unset;
}

.form-control-chosen-optgroup ~ .chosen-container .chosen-results li.group-result{
    cursor: pointer;
}

.dropdown-menu {
    font-size: 13px;
}

.dropdown-menu > .dropdown-item {
    font-size: 13px;
}

/* Forms - checkbox & radio */
.form-check {
    padding-left: 0;
}

.form-check label {
    height: 24px;
    line-height: 24px;
    font-size: 13px;
}

.gf-checkbox,
.gf-radio {
    display: inline-block;
    position: relative;
    padding-left: 35px;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 1;
}

.gf-checkbox:focus,
.gf-radio:focus {
    outline: 0;
}

.gf-checkbox input:not(:disabled):focus ~ span,
.gf-radio input:not(:disabled):focus ~ span {
    color: #495057;
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
}

.gf-checkbox > span,
.gf-radio > span {
    position: absolute;
    top: 3px;
    left: 3px;
    height: 18px;
    width: 18px;
    background-color: #fff;
    border: 1px solid #ced4da;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.gf-checkbox > span {
    border-radius: 3px;
}

.gf-radio > span {
    border-radius: 50%;
}

.gf-checkbox input:checked ~ span,
.gf-checkbox input:indeterminate ~ span,
.gf-radio input:checked ~ span,
.gf-radio input:indeterminate ~ span {
    background-color: var(--color-components);
}

.gf-checkbox > span:after,
.gf-radio > span:after {
    content: "";
    position: absolute;
    display: none;
}

.gf-checkbox input:checked ~ span:after,
.gf-checkbox input:indeterminate ~ span:after,
.gf-radio input:checked ~ span:after,
.gf-radio input:indeterminate ~ span:after {
    display: block;
}

.gf-checkbox input:checked ~ span:after {
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.gf-checkbox input:indeterminate ~ span:after {
    left: 6px;
    top: 2px;
    width: 4px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 0px 0;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.gf-radio input:checked ~ span:after {
    left: 5px;
    top: 5px;
    border: solid 3px white;
    border-radius: 50%;
}

.gf-checkbox.disabled,
.gf-radio.disabled {
    cursor: unset;
    opacity: .5;
}

.gf-checkbox input:disabled ~ span,
.gf-radio input:disabled ~ span {
    opacity: .5;
}

input[type="checkbox"],
input[type="radio"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.custom-switch {
    padding-left: 3.25rem;
    line-height: 28px;
}

.custom-control-label {
    font-size: 13px;
}

.custom-control-label::before {
    height: 20px;
}

.custom-switch .custom-control-label::before {
    left: -3.25rem;
    width: 2.4rem;
    border-radius: 10px;
}

.custom-switch .custom-control-label::after {
    top: calc(.3rem + 2px);
    left: calc(-3.2rem + 2px);
    width: calc(18px - 4px);
    height: calc(18px - 4px);
}

.custom-switch .custom-control-input:checked~.custom-control-label::after {
    -webkit-transform: translateX(1.2rem);
    transform: translateX(1.2rem);
}

.custom-control-input:checked~.custom-control-label::before {
    border-color: var(--color-components);
    background-color: var(--color-components);
}

.custom-control-input:focus:not(:checked)~.custom-control-label::before {
    border-color: #ccc;
}

/* TreeView */
.gf-treeview {
    padding-inline-start: 0;
}

.gf-treeview,
.gf-treeview * {
    font-size: 13px;
    list-style: none;
    white-space: nowrap;
}

.gf-treeview .gf-checkbox {
    height: 24px;
    line-height: 24px;
}

/* Vehicle ignition states */
.gf-btn-group-vehicle-ignition-state {
    margin-bottom: 1rem;
    border-bottom: 0;
}

.gf-btn-group-vehicle-ignition-state .btn {
    border-radius: 0;
    color: #373E46;
    font-size: 13px;
}

.gf-btn-group-vehicle-ignition-state .btn.focus,
.gf-btn-group-vehicle-ignition-state .btn:focus {
    -webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

.gf-btn-group-vehicle-ignition-state .gf-btn-vehicle-ignition-on {
    border-bottom: 2px solid var(--color-ignition-on);
}

.gf-btn-group-vehicle-ignition-state .gf-btn-vehicle-ignition-on:hover {
    border-color: transparent;
    border-bottom: 2px solid var(--color-ignition-on);
    text-shadow: 0 0 0.01px #373e46;
}

.gf-btn-group-vehicle-ignition-state .gf-btn-vehicle-ignition-on.active {
    border-color: transparent;
    border-bottom: 3px solid var(--color-ignition-on);
    color: var(--color-ignition-on);
    text-shadow: 0 0 0.01px var(--color-ignition-on);
}

.gf-btn-group-vehicle-ignition-state .gf-btn-vehicle-ignition-idle {
    border-bottom: 2px solid var(--color-ignition-idle);
}

.gf-btn-group-vehicle-ignition-state .gf-btn-vehicle-ignition-idle:hover {
    border-color: transparent;
    border-bottom: 2px solid var(--color-ignition-idle);
    text-shadow: 0 0 0.01px #373e46;
}

.gf-btn-group-vehicle-ignition-state .gf-btn-vehicle-ignition-idle.active {
    border-color: transparent;
    border-bottom: 3px solid var(--color-ignition-idle);
    color: var(--color-ignition-idle);
    text-shadow: 0 0 0.01px var(--color-ignition-idle);
}

.gf-btn-group-vehicle-ignition-state .gf-btn-vehicle-ignition-off {
    border-bottom: 2px solid var(--color-ignition-off);
}

.gf-btn-group-vehicle-ignition-state .gf-btn-vehicle-ignition-off:hover {
    border-color: transparent;
    border-bottom: 2px solid var(--color-ignition-off);
    text-shadow: 0 0 0.01px #373e46;
}

.gf-btn-group-vehicle-ignition-state .gf-btn-vehicle-ignition-off.active {
    border-color: transparent;
    border-bottom: 3px solid var(--color-ignition-off);
    color: var(--color-ignition-off);
    text-shadow: 0 0 0.01px var(--color-ignition-off);
}


/* Alerts */
.swal2-container.swal2-backdrop-show, .swal2-container.swal2-noanimation, .gesfrota-loader-container {
    background: #545b628f;
    backdrop-filter: blur(4px);
}

.swal2-title {
    font-size: 25px !important;
    font-weight: 500 !important;
}

/* Badges */
.badge-pill {
    padding: 0.6em 1.2em;
}

.badge {
    font-size: 120%;
    font-weight: 400;
}

.badge-primary {
    background-color: var(--color-btn-primary-a29);
    color: var(--color-text-blue);
}

.badge-secondary {
    background-color: var(--color-btn-secondary-a29);
    color: var(--color-text-grey);
}

.badge-success {
    background-color: var(--color-btn-success-a29);
    color: var(--color-text-green);
}

.badge-warning {
    background-color: var(--color-btn-warning-a29);
    color: var(--color-text-yellow);
}

.badge-danger {
    background-color: var(--color-btn-danger-a29);
    color: var(--color-text-red);
}


/* Toasts */


.gesfrota-swal-toast.swal2-icon-success {
    background-color: var(--success) !important;
}

.gesfrota-swal-toast.swal2-icon-error {
    background-color: var(--danger) !important;
}

.gesfrota-swal-toast.swal2-icon-warning {
    background-color: var(--warning) !important;
}

.gesfrota-swal-toast.swal2-icon-info {
    background-color: #3fc3ee !important;
}

.gesfrota-swal-toast .swal2-title {
    color: white;
}

.gesfrota-swal-toast .swal2-close {
    color: white;
}

.gesfrota-swal-toast .swal2-html-container {
    color: white;
}

.swal2-container.swal2-toast-gesfrota {
           backdrop-filter: none;
           position: absolute;
}

/* loaders */

/*comportamento loader quando o body é pai*/
body > .gesfrota-loader-container {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: inline-flex;
	vertical-align: top;
	justify-content: center;
	align-items: center;
	z-index: 1050;
}

/*comportamento genérico do loader em secções*/
/*tem que se garantir que a div anterior tenha position:relative*/
.gesfrota-loader-container {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: inline-flex;
	vertical-align: top;
	justify-content: center;
	align-items: center;
	z-index: 1050;
}

.gesfrota-loader-container #loader-text {
    display: inline-flex;
    position: absolute;
    margin-top:150px;
    font-size: 1.1rem;
    color:white;
    font-weight: 400;
    text-shadow:0px 1px 4px #000000e8;
}



/*loader circulo final*/

.gesfrota-loader-container .loader-circle-light {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	display: inline-block;
	border-top: 3px solid #fff;
	border-right: 3px solid transparent;
	box-sizing: border-box;
	animation: rotation2 1s linear infinite;
}

@keyframes rotation2 {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}
/*loader velocimetro*/

.gesfrota-loader-container .loader-velo {
	width: 96px;
	height: 48px;
	display: inline-block;
	position: relative;
	background: #fff;
	border-radius: 48px 48px 0 0;
	box-sizing: border-box;
	overflow: hidden;
}
.gesfrota-loader-container .loader-velo::after {
	content: '';
	box-sizing: border-box;
	position: absolute;
	width: 24px;
	height: 12px;
	border-radius: 24px 24px 0 0;
	background: #ff3d00;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0;
}
.gesfrota-loader-container .loader-velo::before {
	content: '';
	position: absolute;
	width: 4px;
	height: 32px;
	left: 0;
	right: 0;
	margin: auto;
	bottom: 0;
	background: #ff3d00;
	transform-origin: 50% 100%;
	box-sizing: border-box;
	animation: animloader 2s linear infinite alternate;
}

@keyframes animloader {
	0% {
		transform: rotate(-70deg);
	}
	10% {
		transform: rotate(-40deg);
	}
	20%,
	45%,
	35% {
		transform: rotate(-10deg);
	}
	40%,
	30% {
		transform: rotate(-30deg);
	}
	50%,
	60% {
		transform: rotate(20deg);
	}
	55%,
	65%,
	75% {
		transform: rotate(40deg);
	}
	70% {
		transform: rotate(45deg);
	}
	85%,
	90% {
		transform: rotate(50deg);
	}
	95% {
		transform: rotate(75deg);
	}
	100%,
	93% {
		transform: rotate(70deg);
	}
}

/*loader mapa*/

.gesfrota-loader-container .loader-map {
	width: 48px;
	height: 48px;
	display: block;
	margin: 20px auto;
	box-sizing: border-box;
	position: relative;
}
.gesfrota-loader-container .loader-map::after {
	content: '';
	box-sizing: border-box;
	width: 48px;
	height: 48px;
	left: 0;
	bottom: 0;
	position: absolute;
	border-radius: 50% 50% 0;
	border: 15px solid #fff;
	transform: rotate(45deg) translate(0, 0);
	box-sizing: border-box;
	animation: animMarker 0.4s ease-in-out infinite alternate;
}
.gesfrota-loader-container .loader-map::before {
	content: '';
	box-sizing: border-box;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	top: 150%;
	width: 24px;
	height: 4px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.2);
	animation: animShadow 0.4s ease-in-out infinite alternate;
}

@keyframes animMarker {
	0% {
		transform: rotate(45deg) translate(5px, 5px);
	}
	100% {
		transform: rotate(45deg) translate(-5px, -5px);
	}
}

@keyframes animShadow {
	0% {
		transform: scale(0.5);
	}
	100% {
		transform: scale(1);
	}
}

/* loader vehicle*/
.gesfrota-loader-container .loader-vehicle {
	position: relative;
	display: block;
	margin: 20px auto;
	width: 130px;
	height: 100px;
	background-repeat: no-repeat;
	background-image: linear-gradient(#0277bd, #0277bd),
		linear-gradient(#29b6f6, #4fc3f7), linear-gradient(#29b6f6, #4fc3f7);
	background-size: 80px 70px, 30px 50px, 30px 30px;
	background-position: 0 0, 80px 20px, 100px 40px;
}
.gesfrota-loader-container .loader-vehicle:after {
	content: '';
	position: absolute;
	bottom: 10px;
	left: 12px;
	width: 10px;
	height: 10px;
	background: #fff;
	border-radius: 50%;
	box-sizing: content-box;
	border: 10px solid #000;
	box-shadow: 78px 0 0 -10px #fff, 78px 0 #000;
	animation: wheelSk 0.75s ease-in infinite alternate;
}

.gesfrota-loader-container .loader-vehicle:before {
	content: '';
	position: absolute;
	right: 100%;
	top: 0px;
	height: 70px;
	width: 70px;
	background-image: linear-gradient(#fff 45px, transparent 0),
		linear-gradient(#fff 45px, transparent 0),
		linear-gradient(#fff 45px, transparent 0);
	background-repeat: no-repeat;
	background-size: 30px 4px;
	background-position: 0px 11px, 8px 35px, 0px 60px;
	animation: lineDropping 0.75s linear infinite;
}

@keyframes wheelSk {
	0%,
	50%,
	100% {
		transform: translatey(0);
	}
	30%,
	90% {
		transform: translatey(-3px);
	}
}

@keyframes lineDropping {
	0% {
		background-position: 100px 11px, 115px 35px, 105px 60px;
		opacity: 1;
	}
	50% {
		background-position: 0px 11px, 20px 35px, 5px 60px;
	}
	60% {
		background-position: -30px 11px, 0px 35px, -10px 60px;
	}
	75%,
	100% {
		background-position: -30px 11px, -30px 35px, -30px 60px;
		opacity: 0;
	}
}

/* loader opções */

.gesfrota-loader-container .loader-options {
	width: 60px;
	height: 40px;
	position: relative;
	display: inline-block;
	--base-color: #545b628f; /*use your base color*/
}
.gesfrota-loader-container .loader-options::before {
	content: '';
	left: 0;
	top: 0;
	position: absolute;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background-color: #fff;
	background-image: radial-gradient(
			circle 8px at 18px 18px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 4px at 18px 0px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 4px at 0px 18px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 4px at 36px 18px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 4px at 18px 36px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 4px at 30px 5px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 4px at 30px 5px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 4px at 30px 30px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 4px at 5px 30px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 4px at 5px 5px,
			var(--base-color) 100%,
			transparent 0
		);
	background-repeat: no-repeat;
	box-sizing: border-box;
	animation: rotationBack 3s linear infinite;
}
.gesfrota-loader-container .loader-options::after {
	content: '';
	left: 35px;
	top: 15px;
	position: absolute;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background-color: #fff;
	background-image: radial-gradient(
			circle 5px at 12px 12px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 2.5px at 12px 0px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 2.5px at 0px 12px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 2.5px at 24px 12px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 2.5px at 12px 24px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 2.5px at 20px 3px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 2.5px at 20px 3px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 2.5px at 20px 20px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 2.5px at 3px 20px,
			var(--base-color) 100%,
			transparent 0
		),
		radial-gradient(
			circle 2.5px at 3px 3px,
			var(--base-color) 100%,
			transparent 0
		);
	background-repeat: no-repeat;
	box-sizing: border-box;
	animation: rotationBack 4s linear infinite reverse;
}
@keyframes rotationBack {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(-360deg);
	}
}

/* loader pesquisa */

.gesfrota-loader-container .loader-search {
	width: 48px;
	height: 48px;
	display: block;
	margin: 20px auto;
	position: relative;
	border: 3px solid #fff;
	border-radius: 50%;
	box-sizing: border-box;
	animation: animloadersearch 2s linear infinite;
}
.gesfrota-loader-container .loader-search::after {
	content: '';
	box-sizing: border-box;
	width: 6px;
	height: 24px;
	background: #fff;
	transform: rotate(-45deg);
	position: absolute;
	bottom: -20px;
	left: 46px;
}

@keyframes animloadersearch {
	0% {
		transform: translate(-10px, -10px);
	}
	25% {
		transform: translate(-10px, 10px);
	}
	50% {
		transform: translate(10px, 10px);
	}
	75% {
		transform: translate(10px, -10px);
	}
	100% {
		transform: translate(-10px, -10px);
	}
}

.loader-overflow-hidden {
    overflow: hidden;
}