:root{
--primary:black;
--secondary:#b8292f;
--border:#e6e6e6;
}


.checkout-title{
font-size:34px;
font-weight:600;
text-align:center;
margin:40px 0;
}

.checkout-card{
background:white;
border-radius:10px;
padding:25px;
margin-bottom:25px;
border:1px solid var(--border);
}

.section-title{
font-weight:600;
font-size:20px;
margin-bottom:20px;
}
.form-check{
    color: black;
}
.form-control{
border-radius:6px;
padding:8px 10px;
height:auto;
}

.address-box{
border:1px solid var(--border);
border-radius:8px;
color: black;
padding:18px;
cursor:pointer;
transition:.2s;
}

.address-box:hover{
border-color:var(--secondary);
}

.address-box.active{
border:2px solid var(--secondary);
background:#fafafa;
}

.btn-theme{
background:black;
color:white;
border:none;
padding:10px 18px;
font-weight:500;
}

.btn-theme:hover{
background:var(--secondary);
color:white;
}

.summary-item{
    color: black;
display:flex;
justify-content:space-between;
margin-bottom:10px;
}

.summary-total{
font-weight:600;
font-size:18px;
}

.payment-box{
border:1px solid var(--border);
padding:18px;
border-radius:8px;
}

.coupon-box{
display:flex;
}

.coupon-box input{
flex:1;
margin-right:10px;
}

.checkout-right{
margin-top:0;
}

@media(max-width:991px){

.checkout-right{
margin-top:30px;
}

}
.custom-flex{
    display: flex;
    padding-bottom: 30px;
}
.custom-row{
    row-gap: 20px;
}
#newAddressForm{
display:none;
animation:fadeSlide .3s ease;
}
.custom-button{
    margin-top: 20px;
}
select,
[class ~=form-control]:focus{
    border: 1px solid #b8292f;
}
.form-check-input:checked {
    accent-color: #b8292f; /* your theme color */
}
.discount-text{
    color: #b8292f;
}
@keyframes fadeSlide{

from{
opacity:0;
transform:translateY(-10px);
}

to{
opacity:1;
transform:translateY(0);
}

}