/*New Load Design CSS*/

.new-load-container .upper-area {
    padding-top: 0.5rem;
    margin-bottom: -0.5rem;
}

.new-load-container .upper-area .left-side h5 {
    color: #ffb627;
    margin-bottom:0
}

.search-field-container input {
    background-color: #fff;
    border: 1px solid #D9D9D9;
    padding: 0.5rem 1rem 0.5rem 2rem;
    width: 8rem;
    background-image: url(/assets/images/search_2.png);
    background-repeat: no-repeat;
    background-position: 0.5rem 0.6rem;
    border-radius: 8px;
}
    .search-field-container input::placeholder {
        font-size: 1rem;
        color: #959595;
      
    }

.search-field-container button {
    background-color: transparent;
    border: none;
    font-weight: 600;
    color: #595959;
    font-size:1rem;
}

.load-filters-area .load-filters-container {
    border: 1px solid #D9D9D9;
    width: fit-content;
    padding: 0.2rem 1rem;
}

 .load-filters-area .load-filters-container span {
     font-size: 0.9rem;
     color: #464646;
 }

  .load-filters-area .load-filters-container h5 {
      font-size: 0.9rem;
      color: #464646;
      font-weight:600
   }


.load-id-container .load-id-container-upper-area .switch {
    width: 38px;
    height: 23px;
}



.load-id-container .load-id-container-upper-area .slider:before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 5px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}
.load-id-container .load-id-container-upper-area input:checked + .slider:before {
    transform: translateX(11px);
}

.load-id-container .formgroup input{
    width:25rem
}

.load-rate-dropdown {
    width: 16rem !important
}

@media screen and (max-width:1669px){ 
    .loads-table tbody .select-dropdown {
        width: 16rem;
    }
    .loads-table tbody .tax-dropdown .select2-container{
        width:16rem !important
    }
}

.new-load-detail-status-container h5 {
    font-size: 0.9rem;
    font-weight: 500;
    color: #1C2826;
}

.new-load-detail-status-container span {
    font-weight: 600;
    font-size: 1rem;
    color: #1C2826;
}

.load-detail-progress {
    border: 1px solid #D9D9D9;
    padding: 1rem;
    border-radius: 8px;
}

.location-container {
    border: 1px solid #D9D9D9;
    padding: 1rem;
    border-radius: 8px;
}



.schedule-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    margin: 1rem
}

.load-details-container, .parties-container {
    margin: 1rem;
}

    .load-details-container .load-details-upper-area {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

    .load-details-container .load-details-lower-area {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        margin-top: 1rem;
    }


    .parties-container .parties-upper-container {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

    .parties-container .parties-lower-container {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        margin-top: 1rem;
    }

        .new-load-detail-commerical-card-container .new-load-detail-commerical-card{
            border:1px solid #cccccc;
            padding:1rem;
            border-radius:8px;
            width:100%
        }

        .new-load-detail-commerical-card-container .new-load-detail-commerical-card span {
            font-size: 1rem;
            color: #1C2826;
            font-weight: 400;
        }
        .new-load-detail-commerical-card-container .new-load-detail-commerical-card h5 {
             font-weight: 600;
        }





.timeline-body .timeline-journey img {
    position: relative;
    z-index: 1000;
    left: 0.1rem;
}


.timeline-body .journey-area {
    gap: 10rem;
    top:0;
}

.timeline-body .timeline-journey:after {
    height: 10.2rem;
    left: 11px;
}

/*.timeline-body .timeline-journey:last-child::after {
    display: none;
}*/

.right-side-modal-body .timeline-section{
    position:relative
}

    .right-side-modal-body .timeline-section::after {
        content: '';
        position: absolute;
        top: 17px;
        left: 17px;
        width: 0.01rem;
        height: 94%;
        background-color: #D9D9D9;
    }



.right-side-modal-body .timeline-section:last-child::after {
    display: none
}

        .right-side-modal-body .timeline-section:not(:first-child){
            margin-bottom:0.5rem
        }

    .timeline-journey {
        position: relative
    }

    .timeline-journey::after {
        content: '';
        position: absolute;
        top: 17px;
        left: 9px;
        width: 6%;
        height: 6rem;
        background-color: #D9D9D9;
    }
    .timeline-journey::after {
        height: 11.5rem;
    }

    
  
    .timeline-body .right-side-modal-body .invoice-history-details .invoice-history-lower-area {
        width: auto;
        padding-bottom: 0rem;
    }

.timeline-body .right-side-modal-body .invoice-history-details{
    width:100%
}

.timeline-body .left-side-modal-body{
    width:3rem
}

.timeline-body .right-side-modal-body{
    width:100%
}

    .timeline-body .right-side-modal-body .invoice-history-details .invoice-history-uppper-area h5.invoice-history-user-type {
        left:0
    }


.location-section-pod-card {
    border-left: 4px solid #ffb627;
    padding-left: 1rem;
}

.load-charges-tbody td{
    padding:0.5rem
}

    /*New Load Design CSS*/