@import url(./moduls/variables.css);
@import url(./moduls/reset.css);
@import url(./moduls/defaults.css);
@import url(./moduls/grid.css);
@import url(./moduls/helper-classes.css);
@import url(./moduls/nav-bar.css);
@import url(./moduls/footer.css);

.nav{
    border-bottom: .5rem solid var(--secondry-color);
    padding-bottom: 5rem;
}

.main{
    padding: 5rem 0 35rem 0;
    color: var(--text-color);
}
.row__checkout__main{
    width:100%;
    display:flex;
}
.row__checkout{
    width:100%;
    display:flex;
}
.coupon__exist{

}
.coupon__write{
    color:var(--secondry-color);
    cursor:pointer;
}
.show__coupon__box{
    width:100%;
    border:1px solid lightgray;
    border-radius:10px;
    padding:3rem;
    margin-top:2rem;
    display:none;
    color:var(--text-color);
}
.form-control ,.form-select{
    display: block;
    width: 100%;
    padding: 0.6rem 0.75rem;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 2px solid var(--secondry-color);
    border-radius:1rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /*border-radius: 0.25rem;*/
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;

    /*border-radius: 4rem;*/
    /*outline: none;*/
    /*border: 0.3rem solid var(--secondry-color);*/
    /*font-size: 1.8rem;*/
    /*padding: 1.5rem;*/
    /*font-family: var(--primary-font);*/
    /*width: 60%;*/
}
.input-text1{
    padding:10px 15px;
    height:40px;
    border:1px solid #e2e2e2;
    width:250px;
    font-size:1.5rem;
    display:inline;
    border-radius:5px;
}
.btn__coupon{
    width:100px;
    height:40px;
    background-color:var(--primary-color);
    color:var(--white-color);
    border:none;
    border-radius:5px;
    font-size:1.5rem;
    margin-right:3rem;
    padding:1rem;
}
.checkout__right{
    width:60%;
}
#order_review_heading{
    font-weight:600;
    font-size:2.5rem;
}
.checkout__left{
    width:35%;
    margin-right:9rem;
}
.row{
    width:100%;
}
.col-3{
    width: 25%;
}
.mt-2{
    margin-top:2rem;
}
.mt-4{
    margin-top:4rem;
}
.ml-2{
    margin-left:2rem
}
.col-6{
    width:48%;
}
.product-total,#tot,#total-price,.product-quantity-cart,#costshipping{
    font-family:Vazir;
}
.cart-subtotal{
    font-weight:600;
}
.wd-table-wrapper{
border: 2px solid var(--secondry-color);
border-radius: 1rem;
padding: 1rem;
margin-top: 2rem;
}

table {
    margin:auto;

}
.cart_item{
    border-bottom: 1px solid lightgray;
    padding-bottom: 60px;
}
.product-total{
    padding:20px 40px 20px 0;
}
tfoot{
    border-top:1px solid black;
}
#total-price{
    font-weight:bold;
    font-size:2rem;
    margin-right: 3rem;
}
#place_order{
    background-color: var(--primary-color);
    color:white;
    height:40px;
    width:100%;
    margin-top:3rem;
    border:none;
    border-radius:5px;
    font-size:2rem;
    line-height:40px;
    cursor:pointer;
}
.email1{
    text-align:left;
}
.form-control:focus{
    border:2px solid #8ac3f3!important;
}
@media screen and (max-width: 996px) {
    #total-price {
        margin: unset!important;
    }
}
@media screen and (max-width: 768px){
    .row__checkout__main{
        flex-direction:column;
        align-items:center;
    }
    #total-price{
        margin-right: 3rem!important;
    }
    .checkout__right {
        width: 100%;
    }
    .checkout__left{
        width: 100%;
         margin-right: unset;
         margin-top: 3rem;
    }
}
@media screen and (max-width: 576px){
    .btn__coupon {
        width:90px;
    }
    .input-text1 {
        width:150px;
    }
    .row__checkout {
        width: 90%;
        margin: auto;
    }

    .checkout__right {
        width: 90%;
    }
    .checkout__left{
        width: 90%;
        margin-right: unset;
        margin-top: 3rem;
    }
    .condition{
        margin-top:3rem;
    }
}
@media screen and (max-width: 440px){
    .btn__coupon {
        width:50%;
        margin:3rem auto 1rem;
        display:block;
    }
    .input-text1 {
        width:90%;
        display:block;
        margin:auto;
    }
    .row__checkout {
        width: 90%;
        margin: auto;
        flex-wrap: wrap;
    }
    .col-3,.col-6{
        width:100%;
        margin-top:2rem;
    }
    .postal,.phone{
        margin-left:2rem;
    }
    .address{
        margin-left:2rem;
        margin-right:2rem;
    }
    .address1{
        width:95%;
    }
    .email{
        margin-left:2rem;
        padding-right:2rem;
    }
    .email1 {
        width: 95%;
    }
    .condition{
        margin-top:3rem;
    }
    .condition .ml-2{
        margin-left:0.5rem;
    }
    .cond{
        font-size:1.3rem;
    }
    td{
        padding:20px 10px!important;
    }
}
@media screen and (max-width: 340px){
    .cond{
        font-size:1.1rem;
    }
    #total-price{
        margin-right: unset!important;
    }
}