/* Listing Detail Page - Two Column Layout */

/* Flexbox container for the two-column layout */
#listing_content {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    width: 100%;
}

/* Left column - Main content (65% width) */
.listing-column-left {
    flex: 0 0 calc(65% - 10px);
    max-width: calc(65% - 10px);
}

/* Right column - Sidebar (35% width) */
.listing-column-right {
    flex: 0 0 calc(35% - 10px);
    max-width: calc(35% - 10px);
}

/* Responsive layout for tablets and smaller screens */
@media (max-width: 992px) {
    #listing_content {
        flex-direction: column;
    }

    .listing-column-left,
    .listing-column-right {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* Mobile optimization */
@media (max-width: 768px) {
    #listing_content {
        gap: 15px;
    }
}
/*Display progressbar on sell my vehicle Gravity Form*/
#vehicle-api-progress{
    width:100%;
    margin-top:10px;
    display:none;
}

.vehicle-progress-wrapper{
    width:100%;
}

.vehicle-progress-bar{
    width:100%;
    height:5px;
    background:#e5e5e5;
    position:relative;
    overflow:hidden;
    border-radius:4px;
}

.vehicle-progress-bar::after{
    content:'';
    position:absolute;
    left:-40%;
    width:40%;
    height:100%;
    background:#ec6c26;
    animation:progressMove 1.2s linear infinite;
}

@keyframes progressMove{
    0%{ left:-40%; }
    100%{ left:100%; }
}

.vehicle-progress-text{
    font-size:13px;
    margin-top:6px;
    color:#666;
}
#gform_1 .button{
    background-color:#ec6c26;
    color:#fff;
    border:none;
    padding:12px 25px;
    border-radius:4px;
    cursor:pointer;
}

#gform_1 .button:hover{
    background-color:#ec6c26;
}