:root{
    --white: #ffffff;
    --green: #34B735; 
    --black: black;
    --grey: rgba(140, 140, 140);
    --transparent: rgba(102, 102, 102, 0.01);
    --blue: #00aeff;
    --light-blue: #83b5cd;
    --red: #DD2D33 ;
    --yellow: #FFE94D;
    --orange: #FA8144;

}

.container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 10px;
    gap: 20px;
}

.quadro {
    width: 900px;
    background-color: #FFFFFF;
    margin-top: 80px;
    margin-bottom: 80px;
    padding: 1.75em 1.5em 1.2em;
    text-align: left;
}

.textoModulo {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    font-weight: bold;
    padding-bottom: 5px;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #666;
}
.tituloAzul{
    font-size: 14px;
    padding-bottom: 3px;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #666;
}
.text-antt{
    padding-top: 5px;
    border-top-width: 1px;
    border-top-style: dotted;
    border-top-color: #666;
}
.text-grey{
    color: var(--grey);
}
.table{
    border-collapse: collapse;
}
.table tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.table thead tr{
    border: 1px solid #000000;
}
.table-default{
    border: 1px solid #eaeaea !important;
}
.table-default thead tr{
    border: 1px solid #eaeaea !important ;
}
.grid{
    display: grid;
}
.grid-cols-2{
    grid-template-columns: repeat(2, 1fr);
}
.grid-cols-3{
    grid-template-columns: repeat(3, 1fr);
}
.grid-cols-5{
    grid-template-columns: repeat(5, 1fr);
}
.grid-cols-6{
    grid-template-columns: repeat(6, 1fr);
}
.grid-rows-2{
    grid-template-rows: repeat(2, 1fr);
}
.gap-x-50{
    grid-column-gap: 50px;

}
.gap-x-10{
    grid-column-gap: 10px;

}
.gap-y-5{
    grid-row-gap: 5px;
}
.gap-y-10{
    grid-row-gap: 10px;
}

/* .table-default tbody{
    max-height: none !important;
    overflow: none;
} */
/* setting scroll (overflow) based on max-height */
.tbody{
    display: block;
    max-height: 275px;
    overflow: auto;
}
.hidden{
    display: none;
}
.tbody-motorista > tr > td:first-child{
    width: 27.5%;
}
.tbody > tr > td{
    background-color: white;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #999;
    padding: 8px 6px 5px;
}
.tbody-default > tr > td{
    border-bottom-width: 0px !important;
   
}
.th{
    background-color: #F3F1E5;
    /* border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #999999; */
    padding: 5px;
}
.th-default {
    background-color: #f9f9f9 !important;
    border-bottom-width: 0px !important;
    font-weight: normal;
    padding: 5px 10px 5px !important;
}
.row {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: left;
}

.position{
    position:absolute;
    width: 110px;
    z-index:1;
    overflow: hidden;
    pointer-events:none;
}
.custom-select{
    max-height: 200px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding: 0px;
    width: -webkit-fill-available;
    background: #FFFFFF;
    position: absolute;
    z-index: 100;
    top: 60px;
    width: 248px;
    border: 1px solid #C3D1EC;
}
.option-custom-select:hover{
    cursor: pointer;
    background-color: #009EFF;
    color: #fff
}
.search-custom-select input{
    background-color: transparent;
    padding: 5px;
    height: 15px;
    width: 88%;
    margin-bottom: 5px;
    border-radius: 0;
    margin: 4px;
    border: 1px solid #C3D1EC;
}
.search-custom-select input:focus{
    outline: none;
}
.border-dark{
    border:1px solid black;
}
.border-blue{
    border: 1px solid #007bb6;
}

.border-grey{
    border: 1px solid var(--grey);
}

.justify-start{
    justify-content: flex-start !important;
}
.justify-center{
    justify-content: center !important;
}

.justify-between{
    justify-content: space-between !important;
}
.justify-end{
    justify-content: flex-end !important;
}

.items-center{
    align-items: center !important;
}
.items-end{
    align-items: end !important;
}
#ordena{
    border: 1px solid black;
}
.btn-confirm{
    border: 1px solid #1c721c !important;
    background: linear-gradient(#e6ffe6, #bbd6bb) !important;
    color: #145214 !important;
}
.cursor-default{
    cursor:default;
}
.fa-times-circle{
    cursor: pointer;
}
.col {
    display: flex;
    flex-direction: column;
    text-align: left;
}

.col span {
    white-space: nowrap;
}

.btn-taxa{
    width: 90px;
    height: 25px;
}

.btn-qtd{
    width: 45px;
    height: 25px;
}
.d-block{
    display: block;
}

.text-area{
    width: 99%;
}

.text-bold{
    font-weight: bold;
}


.showModulo{
    color: #06C !important;
}
.showModulo:hover{
    color: #5ea0e2 !important;
}

#prefix{
    display: block;
    position: relative;
    margin: 0;
    left: 35px
}


.my-5{
    margin-top: 5px;
    margin-bottom: 5px;
}

/* padding */
.px-5{
    padding-left: 5px !important;
    padding-right: 5px !important; 
}
.px-20{
    padding-left: 20px !important;
    padding-right: 20px !important;
}
.py-5{
    padding-top: 5px;
    padding-bottom: 5px;
}
.py-10{
    padding-top: 10px;
    padding-bottom: 10px;
}
.p-5{
    padding: 5px;
}
.p-10{
    padding: 10px;
}
.pt-5{
    padding-top: 5px;
}
.pb-5{
    padding-bottom: 5px;
}

.overflow-hidden{
    overflow-x: hidden;
}


/* width */

.w-16{
    width: 16px;
}

.w-100{
    width: 100px;
}
.w-120{
    width: 120px;
}
.w-124{
    width: 124px;
}

.w-140{
    width: 140px;
}

.w-150{
    width: 150px;
}

.w-155{
    width: 155px;
}
.w-230{
    width: 230px;
}
.w-250{
    width: 250px;
}
.w-255{
    width: 255px;
}
.w-280{
    width: 250px;
}
.w-300{
    width: 300px;
}
.w-325{
    width: 325px;
}
.w-790{
    width: 790px;
}
.vw-10{
    width: 10vw;
}
.mw-100{
    min-width: 100%;
}
.mw-27{
    width: 27%;
}
.mh-70{
    min-height: 70px;
}
.h-mx{
    height: max-content;
}
.h-full{
    height: 100%;
}
.w-full{
    width: 100%;
}
.h-25{
    height: 25px;
}
.h-35{
    height: 35px;
}
.h-150{
    height: 150px;
}
.h-650{
    height: 650px;
}
.vh-100{
    height: 100vh;
}
/* gap */
.gap-1{
    gap: 1px;
}
.gap-2{
    gap: 2px;
}
.gap-5{
    gap: 5px;
}
.gap-10{
    gap: 10px;
}
.gap-15{
    gap: 15px;
}
.gap-20{
    gap: 20px;
}
.gap-40{
    gap: 40px;
}
.gap-45{
    gap: 45px;
}
.gap-50{
    gap: 50px;
}
.gap-70{
    gap: 70px;
}

/* margin */
.mt-3{
    margin-top: 3px;
}
.mt-5{
    margin-top: 5px;
}
.mt-10{
    margin-top: 10px;
}

.mt-20{
    margin-top: 20px;
}
.mt-30{
    margin-top: 30px;
}
.mt-40{
    margin-top: 40px;
}

.mb-5{
    margin-bottom: 5px;
}

.mb-20{
    margin-bottom: 20px;
}

.ml-5{
    margin-left: 5px;
}

.ml-20{
    margin-left: 20px;
}
.ml-50{
    margin-left: 50px;
}
/* font-size */
.fs-12{
    font-size: 12px !important;
}
.fs-14{
    font-size: 14px !important;
}
.fs-15{
    font-size: 15px !important;
}
.fs-16{
    font-size: 16px;
}
.fs-18{
    font-size: 18px;
}
.fs-22{
    font-size: 22px;
}
.fs-32{
    font-size: 32px;
}


/* incluir token ciot */
.table-default > thead > tr > td{
    padding-left:10px;
    background-color: #f9f9f9;
    font-weight: bold;
}
.table-default > tbody > tr > td{
    padding-left:10px;
    font-weight: bold;
    border-bottom-width: 0px !important;
    /* white-space: nowrap; */
}
.tr-unidade:hover{
    cursor: pointer;
    background-color: #009EFF;
    color: #fff;
    
}
h2{
    font-size: 22px;
}
.text-center{
    text-align: center;
}
.d-none{
    display: none !important;
}
.d-table{
    display: table !important;
}
.dialog-scroll{
    height: auto; 
    max-height: 465px;
    overflow-y: auto;
    overflow-x: none;
    padding-right: 5px;
}

.header {
    width: 100%;
    margin: 10px 0;
}

.logo {
    margin: 10px;
    float: left;
}

.info {
    font-size: 13px;
    float: left;
}

.info>strong {
    font-size: 13px;
}

#loading {
    padding: 20px;
}

#rastreamento {
    padding-top: 30px;
}
.btn-awb{
    height: 25px;
    border: 1px solid black;
    font-size: 12px;
    color: black;

}
i {
    color: var(--green);
    font-size: 12px;
}

input{
    padding-left: 37px !important;
}

#status-message {
    background-color: #bb1600;
    color: #FFFFFF;
    border: 2px solid #a10300;
    font-size: 14px;
    font-weight: bolder;
    text-align: center;
    padding: 10px 0px;
    display: none;
}

.quadroCORPO {
    background-repeat: repeat-x;
    background-color: #EFEFEF;
    border: 1px dotted #666;
}

.txt_filtro {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: #333;
}

.awbs th {
    font: bold 16px "Tahoma";
    background-color: #ededed;
}

.awbs td {
    font: normal 16px "Tahoma";
    background-color: #fefefe;
}

.conteiner {
    border: solid 2px black;
    padding: 4px;
    background-color: #FFF;
}

.erro {
    font: bold 18px "Tahoma";
    color: #ff3333;
}

.timeline {
    width: 0px;
    position: relative;
    z-index: 1;
    padding-top: 20px;
    border-left: 20px solid #DDD;
    border-right: 20px solid #DDD;
    border-bottom: 20px solid #DDD;
    border-top: 25px solid transparent;
}

.timeline:before {
    content: "";
    display: inline-block;
    border-right: 20px solid transparent;
    border-bottom: 0px;
    border-left: 20px solid transparent;
    border-top: 30px solid #DDD;
    position: absolute;
    top: -50px;
    left: -20px;
}

.timeline:after {
    content: "";
    display: inline-block;
    border-right: 20px solid transparent;
    border-bottom: 0px;
    border-left: 20px solid transparent;
    border-top: 30px solid #DDD;
    position: absolute;
    bottom: -50px;
    left: -20px;
}

.leftline {
    width: 0px;
    float: left;
}

.rightline {
    width: 0px;
    float: right;
}

.rightline>.event-holder:first-child {
    padding-top: 65px;
}


.leftline>.event-holder {
    padding-bottom: 30px;
}

.rightline>.event-holder {
    padding-top: 30px;
}

.event-holder {
    min-height: 100px;
    color: #FFF;
}

.event-holder .fa {
    margin: 11px 10px;
    float: left;
}

.event-holder .text {
    text-align: left;
    font-size: 1em;
    vertical-align: middle;
    margin: 5px;
}

.event-holder .text-date {
    font-weight: bolder;
    font-size: 1.2em;
    margin-bottom: 5px;
}

.event-holder .text-description {
    font-size: 1em;
    font-weight: normal;
}
.first{
   border-right: 1px dashed black;
   padding-right: 10px;
}
.leftline>.event-holder>.event {
    float: right;
    width: 380px;
    height: 90px;
    background-color: #1377B4;
    margin-right: 10px;
    padding: 5px;
    transition: 0.2s;
    cursor: pointer;
    border-radius: 5px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    display: flex;
    align-items: center;
}

.rightline>.event-holder>.event {
    float: left;
    width: 380px;
    height: 90px;
    background-color: #1377B4;
    margin-left: 10px;
    padding: 5px;
    transition: 0.2s;
    cursor: pointer;
    border-radius: 5px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    display: flex;
    align-items: center;
}

.rightline>.event-holder>.event:hover,
.leftline>.event-holder>.event:hover {
    transition: 0.2s;
    background-color: #1a8edb;
}
body{
    background-color: white !important;
}
/* .event>h1, */
.event>p {
    color: #FFF;
    font-size: 14px;
}

.events {
    padding-bottom: 70px;
}