﻿body {
    min-height: 100vh;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex: 1;
    flex: 1;
}

.main-content, #layout-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.page-content {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex: 1;
    flex: 1;
    overflow: auto;
}

.container-fluid {
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.dx-widget {
    font-family: Poppins,sans-serif !important;
    font-size: .8125rem !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    -webkit-font-smoothing: antialiased
}

.dx-datagrid-pager {
    border-top: unset;
}

.dx-layout-manager .dx-label-h-align.dx-flex-layout .dx-field-item-label {
    margin-right: 10px;
}

.dx-datagrid-headers .dx-datagrid-table .dx-row > td {
    color: #495057 !important;
    background-color: #f8f9fa !important;
    border-color: #eff2f7 !important;
    font-weight: 600 !important;
    border-top: 1px solid #eff2f7 !important;
    border-bottom: 2px solid #eff2f7;
}

.dx-gridbase-container > .dx-datagrid-rowsview {
    border-top: unset;
}

.dx-datagrid .dx-row-lines > td {
    border-bottom: 1px solid #eff2f7 !important;
}

.dx-field-label {
    font-weight: 600;
}

.dx-row > td, .dx-row > tr > td {
    padding: .75rem;
    !important;
}

.dx-texteditor-container >

#dx_dx-1c4f97d5-6c3e-5e4f-39e3-ac1269cdb2d4_Email {
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    --blue: #556ee6;
    --indigo: #564ab1;
    --purple: #6f42c1;
    --red: #f46a6a;
    --orange: #f1734f;
    --yellow: #f1b44c;
    --green: #34c38f;
    --teal: #050505;
    --cyan: #50a5f1;
    --white: #fff;
    --gray: #74788d;
    --gray-dark: #343a40;
    --primary: #556ee6;
    --secondary: #74788d;
    --success: #34c38f;
    --info: #50a5f1;
    --warning: #f1b44c;
    --danger: #f46a6a;
    --light: #eff2f7;
    --dark: #343a40;
    --pink: #e83e8c;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: "Poppins",sans-serif;
    --font-family-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
    -webkit-box-direction: normal !important;
    box-sizing: border-box;
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    overflow: visible;
    -webkit-transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}

#btn-fleets {
    background-color: #17a2b8;
    color: white;
}

#footer {
    position: absolute;
    left: 15px;
    bottom: 15px;
    font-size: 16px;
}

.app-search span {
    position: absolute;
    z-index: 10;
    font-size: 20px;
    line-height: 38px;
    left: 3px;
    top: -2px;
    color: #069944;
}

.dx-fileuploader-wrapper {
    margin: 10px 0px 0px 0px;
    padding: 0px;
}

#btnTransferModalShow {
    background-color: white;
    color: royalblue;
    position: absolute;
    z-index: 9999;
}

#divWare {
    left: 1%;
}

.widget-container > span {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 16px;
}

.flex-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.dx-badge {
    padding: 0px 6px 0px;
    border-radius: 14px;
    background-color: #337ab7;
    color: #fff;
    font-size: 12px;
    margin-left: 10px;
}

.dx-datagrid .dx-link {
    text-decoration: underline !important;
    cursor: pointer;
    color: #069944 !important;
}

.dx-datagrid .dx-no-link {
    text-decoration: none !important;
    cursor: pointer;
    color: #069944 !important;
}


.badge {
    padding: 0.4em .8em 0.35em;
    font-size: 90%;
}

.badge-green {
    color: #fff;
    background-color: #4f8867;
}

.badge-brown {
    color: #fff;
    background-color: #783c00;
}

.mm-active .active i {
    color: #069944 !important;
}

a {
    color: #069944;
}

.mm-active .active {
    color: #069944 !important;
}

.fa, .fal, .far, .fas {
    color: #069944 !important;
}

.dx-button-mode-contained .dx-icon {
    color: #069944 !important;
}

.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row .dx-command-edit-with-icons .dx-link {
    font-size: 15px;
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li > a i {
    font-size: 1.25rem;
}

.card {
    border-top-width: 2px;
    border-color: #069944 !important;
}

.card-border-no {
    border-top-width: 0px !important;
}

.card.border-left {
    border-top-width: 0px !important;
    border-left-width: 2px !important;
    border-color: #069944 !important;
}

.card-border-default {
    border: 2px solid #f6f6f6 !important;
}


@media (min-width: 576px) {
    .container, .container-sm {
        max-width: none;
    }
}

@media (min-width: 768px) {
    .container, .container-sm, .container-md {
        max-width: none;
    }
}

@media (min-width: 992px) {
    .container, .container-sm, .container-md, .container-lg {
        max-width: none;
    }
}

@media (min-width: 1200px) {
    .container, .container-sm, .container-md, .container-lg, .container-xl {
        max-width: 1400px;
    }
}

/*@media screen and (max-width:900px) {*/
@media screen and (max-width:2540px) {
    #vehicle-km-history {
        max-width: 500px;
    }

    #vehicle-type-config {
        max-width: 400px;
    }

    #vehicle-on-tires {
        margin-top: 35px;
        max-width: 1300px;
    }
}


/*@media screen and (max-width:900px) {*/
@media screen and (max-width:2500px) {
    #vehicle-km-history {
        max-width: 500px;
    }

    #vehicle-type-config {
        max-width: 400px;
    }

    #vehicle-on-tires {
        margin-top: 35px;
        max-width: 1230px;
    }
}

@media screen and (max-width:2360px) {
    #vehicle-on-tires {
        margin-top: 35px;
        max-width: 1100px;
    }
}

@media screen and (max-width:2235px) {
    #vehicle-on-tires {
        margin-top: 35px;
        max-width: 1050px;
    }
}

@media screen and (max-width:2190px) {
    #vehicle-on-tires {
        margin-top: 35px;
        max-width: 950px;
    }
}

@media screen and (max-width:2100px) {
    #vehicle-on-tires {
        margin-top: 35px;
        max-width: 850px;
    }
}

@media screen and (max-width:1990px) {
    #vehicle-on-tires {
        margin-top: 35px;
        max-width: 750px;
    }
}

@media screen and (max-width:1860px) {
    #vehicle-km-history {
        max-width: 450px;
    }

    #vehicle-type-config {
        max-width: 400px;
        margin-left: 20px;
    }

    #vehicle-on-tires {
        max-width: 650px;
    }
}

@media screen and (max-width:1764px) {
    #vehicle-km-history {
        max-width: 425px;
    }

    #vehicle-type-config {
        max-width: 300px;
        margin-left: 20px;
    }

    #vehicle-on-tires {
        max-width: 600px;
    }
}

@media screen and (max-width:1640px) {
    #vehicle-km-history {
        max-width: 375px;
    }

    #vehicle-type-config {
        max-width: 350px;
        margin-left: 20px;
    }

    #vehicle-on-tires {
        max-width: 500px;
    }
}


@media screen and (max-width:1530px) {
    #vehicle-km-history {
        max-width: 375px;
    }

    #vehicle-type-config {
        max-width: 350px;
        margin-left: 20px;
    }

    #vehicle-on-tires {
        max-width: 450px;
    }
}

@media screen and (max-width:1494px) {
    #vehicle-km-history {
        max-width: 375px;
    }

    #vehicle-type-config {
        max-width: 280px;
        margin-left: 20px;
    }

    #vehicle-on-tires {
        max-width: 450px;
    }
}

@media screen and (max-width:1420px) {
    #vehicle-km-history {
        max-width: 340px;
    }

    #vehicle-type-config {
        max-width: 250px;
        margin-left: 20px;
    }

    #vehicle-on-tires {
        max-width: 400px;
    }
}

@media screen and (max-width:1320px) {
    #vehicle-on-tires {
        min-width: 900px;
    }
}

@media screen and (max-width:1165px) {
    #vehicle-km-history {
        max-width: 350px;
    }

    #vehicle-type-config {
        max-width: 250px;
    }
}

@media screen and (max-width:1160px) {
    #vehicle-type-config {
        margin-top: 30px;
    }

    #vehicle-on-tires {
        margin-top: 35px;
        max-width: 1400px;
    }
}

.card-tire {
    box-shadow: none;
    border: 1px solid #f1f1f1 !important;
    margin-bottom: 0;
}

    .card-tire table th {
        font-weight: normal;
        padding-left: 0;
        padding-right: 2rem;
    }

    .card-tire table th,
    .card-tire table td {
        padding: 5px;
    }
/*Cutom Dropzone*/
.dx-custom-dropzone {
    width: 100%;
    min-height: 7rem;
    background-color: rgb(183 183 183 / 2%);
    border-width: 2px;
    border-style: dashed;
    padding: 10px;
    text-align: center;
    display: inline-block;
}

    .dx-custom-dropzone .dropzone-active {
        border-style: solid;
    }

    .dx-custom-dropzone .dropzone-text {
        min-height: 7rem;
        display: inline-flex;
        margin: auto;
        align-self: center;
    }

        .dx-custom-dropzone .dropzone-text > span {
            font-weight: 100;
            opacity: 0.5;
            margin: auto;
        }

    .dx-custom-dropzone .selected-item {
        width: 5rem;
        height: 5rem;
        overflow: hidden;
        border: 1px solid #ccc;
        float: left;
        margin: 5px;
        display: inline-flex;
        position: relative;
        align-items: center;
    }

        .dx-custom-dropzone .selected-item img {
            width: 100%;
            z-index: 7;
        }

        .dx-custom-dropzone .selected-item .selected-item-bg {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-direction: column;
            flex-direction: column;
            -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
            position: absolute;
            top: 0;
            left: 0;
            background-color: rgb(224 224 224 / 67%);
            padding: .5rem;
            color: #ef5350;
            opacity: 0;
            width: 100%;
            height: 100%;
            border-radius: .25rem;
            transition: opacity ease-in-out .15s;
            z-index: 8;
        }

        .dx-custom-dropzone .selected-item:hover .selected-item-bg {
            opacity: 1;
        }

        .dx-custom-dropzone .selected-item:hover i {
            display: inline-block;
        }

        .dx-custom-dropzone .selected-item i {
            display: none;
            content: "\f00d";
            font-family: 'Font Awesome 5 Pro';
            color: #f46a6a !important;
            position: absolute;
            z-index: 9;
            top: -5px;
            right: 0;
            padding: .2rem;
            font-size: 25px;
            cursor: pointer;
        }


.dx-datagrid-headers .dx-datagrid-table .dx-row > td {
    background-color: transparent !important
}
/*Devexpress Dashboard*/
.dx-dashboard-panel-extension {
    display: none !important
}

.dx-overlay-content dx-toast-custom dx-toast-content dx-resizable {
    transform: translate(711px,100px) !important;
    margin: 0px;
    padding: 0px;
}

.dx-dashboard-control {
    background-color: transparent !important;
}

#ReportViewer .dx-dashboard-surface {
    left: 0 !important;
    right: 0;
    top: 0;
}
/*End Devexpress Dashboard*/
.text-system {
    color: #009640 !important;
}

.bg-system {
    background: #009640 !important;
}

.mdi-36px {
    font-size: 39px;
    margin-right: 10px
}

#sidebar-menu ul li a i {
    font-size: 1.01rem !important
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li > a i {
    font-size: 1.05rem !important
}

#sidebar-menu ul li ul.sub-menu li a {
    padding: .4rem 1.5rem .4rem 3.5rem;
}

.mm-active > a {
    color: #069944 !important;
}

.mm-active {
    color: #069944 !important;
}

    .mm-active > a i {
        color: #069944 !important;
    }

    .mm-active > i {
        color: #069944 !important;
    }

#side-menu > li:nth-child(1) > a {
    color: #069944 !important;
}

    #side-menu > li:nth-child(1) > a > i {
        color: #069944 !important;
    }

#side-menu > li:nth-child(3) > a > i {
    color: #069944 !important;
}

#side-menu > li:nth-child(3) > a > span {
    color: #069944 !important;
}

#side-menu > li:nth-child(2) > a > i {
    color: #069944 !important;
}

#side-menu > li:nth-child(2) > a > span {
    color: #069944 !important;
}

/*#grdVehicleKm {
    max-width: 475px;
    height: 870px;
}*/


.badge-using-tire {
    color: white;
    background-color: #007bff;
}

.badge-on-axle {
    color: white;
    background-color: #28a745;
}

.badge-repair {
    color: white;
    background-color: #343a40;
}

.badge-retread {
    color: white;
    background-color: #6c757d;
}

.badge-guarantee {
    color: white;
    background-color: #ffc107;
}

.badge-on-scrap {
    color: white;
    background-color: #dc3545;
}

.badge-on-repair {
    color: white;
    background-color: #6c757d;
}

.badge-on-retread {
    color: white;
    background-color: #adaeaf;
}

.badge-on-guarantee {
    color: white;
    background-color: #9b6aa7;
}

.badge-on-recycling {
    color: white;
    background-color: #28a8ba;
}

.badge-new-tire {
    color: white;
    background-color: #5ba300;
}

.badge-retread-tire {
    color: white;
    background-color: #89ce00;
}

.badge-original-equipment-tire {
    color: white;
    background-color: #0073e6;
}

.badge-used-tire {
    color: white;
    background-color: #e6308a;
}

.badge-used-retread-tire {
    color: white;
    background-color: #b51963;
}



.badge-tire-type-1 {
    color: white;
    background-color: #5ba300;
}

.badge-tire-type-2 {
    color: white;
    background-color: #89ce00;
}

.badge-tire-type-3 {
    color: white;
    background-color: #0073e6;
}

.badge-tire-type-4 {
    color: white;
    background-color: #e6308a;
}

.badge-tire-type-5 {
    color: white;
    background-color: #b51963;
}

/*@media only screen and (min-width: 2000px) {
    .vehicle-type-config {
        padding-left: 60px;
    }
}*/

.media-list-bordered .media {
    margin-top: 0;
    padding: 1rem 1.25rem;
    border-top: 1px solid #ddd;
}

.button-footer {
    width: 96%;
    position: absolute;
    left: 2%;
    bottom: 2%;
}

.media-list-linked {
    padding-left: 0px;
}

    .media-list-linked .media {
        padding: 0.5rem 0.5rem;
        height: 35px;
    }

    .media-list-linked li.media {
        margin-top: 0;
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
    }

    .media-list-linked.media-list-bordered li.media {
        border-bottom: 0;
    }

    .media-list-linked a.media {
        color: inherit;
        transition: all ease-in-out 0.15s;
    }


.standart-font-css {
    color: black;
    font: 16px Poppins,sans serif;
}


.hr-theme-slash-2 {
    display: flex;
    color: gray;
}

.hr-line {
    width: 100%;
    position: relative;
    margin: 15px;
    border-bottom: 1px solid rgba(0,0,0,.1)
}

.min-width {
    min-width: 120px;
}

#save-button {
    position: absolute;
    right: 130px;
}

#tire-popup-save-button {
    width: 16% !important;
    position: absolute;
    right: 148px;
}

#cancel-button {
    position: absolute;
    right: 20px;
    margin-bottom:15px;
}

.hr-icon {
    position: relative;
    top: 3px;
    color: #ff0000;
}
}
