#order-details .switcher.active {
    background-color: var(--primary);
    border-color: var(--primary);
}

.box-shadow {
    box-shadow: 0px 0px 7px var(--shadow);
}

#order-details .grid-template {
    grid-template-columns: 1fr 4fr;
}

#order-details .grid-2-3{
    grid-template-columns: 2fr 3fr;
}

#order-details .icon-box{
    background-color: rgba(255,0,0,.1);
}

#order-details .lines{
    background-color: var(--primary);
    height: 2px;
    border-radius: 1000px;
    width: 88%;
}

#order-details .steps-box{
    transform: translateY(-22%);
}

@media screen and (width < 1400px) {}

@media screen and (width < 1200px) {
    #order-details .grid-template {
        grid-template-columns: 1fr 3fr;
    }
    #order-details .grid-xl-1{
        grid-template-columns: 1fr;
    }
}

@media screen and (width < 992px) {}

@media screen and (width < 768px) {
    #order-details .grid-template {
        grid-template-columns: 1fr 2fr;
    }
}

@media screen and (width < 576px) {
    #order-details .grid-template {
        grid-template-columns: 1fr;
    }
}