body{

background:#f5f7fb;

font-family:Poppins,sans-serif;

}

.navbar{

background:#fff;

}

.search-card{

background:#fff;

padding:45px;

border-radius:15px;

box-shadow:0 15px 40px rgba(0,0,0,.08);

}

.order-card{

background:#fff;

border-radius:15px;

padding:25px;

margin-bottom:20px;

box-shadow:0 5px 25px rgba(0,0,0,.08);

transition:.3s;

}

.order-card:hover{

transform:translateY(-3px);

}

.badge{

font-size:14px;

padding:8px 15px;

}

.btn-primary{

background:#0066ff;

border:none;

}

.timeline{

position:relative;

padding-left:40px;

}

.timeline::before{

content:"";

position:absolute;

left:15px;

top:0;

bottom:0;

width:3px;

background:#ddd;

}

.timeline-item{

position:relative;

margin-bottom:30px;

}

.timeline-item::before{

content:"";

position:absolute;

left:-31px;

top:5px;

width:18px;

height:18px;

border-radius:50%;

background:#ccc;

}

.timeline-item.active::before{

background:#0d6efd;

}

.footer{

margin-top:80px;

padding:30px;

background:#fff;

}

.table td{

vertical-align:middle;

}

.summary-card{

background:#fff;

border-radius:12px;

padding:25px;

box-shadow:0 5px 20px rgba(0,0,0,.08);

margin-bottom:20px;

}

.order-card h5{

font-weight:700;

}

.order-card .btn{

margin-top:8px;

}

@media(max-width:768px){

.order-card{

text-align:center;

}

.order-card .col-lg-2{

margin-bottom:15px;

}

}

@media(max-width:768px){

.search-card{

padding:25px;

}

.order-card{

padding:18px;

}

.table{

font-size:14px;

}

}


.timeline-item{

padding-left:25px;

position:relative;

margin-bottom:25px;

font-weight:500;

}

.timeline-item:before{

content:'';

position:absolute;

left:-8px;

top:4px;

width:14px;

height:14px;

border-radius:50%;

background:#ccc;

}

.timeline-item.active:before{

background:#28a745;

}

.timeline-item.active{

color:#28a745;

font-weight:700;

}

.card{

border-radius:15px;

}