.cart{

    width:90%;

    margin:80px auto;

}

.cart h1{

    font-size:42px;

    color:#6F4E37;

    text-align:center;

}

.cart p{

    text-align:center;

    color:#777;

    margin:15px 0 50px;

}

.cart-container{

    display:grid;

    grid-template-columns:2fr 1fr;

    gap:40px;

}

.cart-item{

    display:flex;

    align-items:center;

    gap:20px;

    background:#fff;

    padding:20px;

    border-radius:15px;

    box-shadow:0 5px 15px rgba(0,0,0,.1);

    margin-bottom:25px;

}

.cart-item img{

    width:150px;

    border-radius:10px;

}

.item-details{

    flex:1;

}

.item-details h3{

    color:#6F4E37;

    margin-bottom:10px;

}

.item-details p{

    color:#D4AF37;

    font-size:20px;

    text-align:left;

}

.quantity{

    display:flex;

    align-items:center;

    gap:10px;

    margin-top:15px;

}

.quantity button{

    width:35px;

    height:35px;

    border:none;

    background:#6F4E37;

    color:#fff;

    border-radius:50%;

    cursor:pointer;

}

.quantity input{

    width:60px;

    text-align:center;

    padding:8px;

}

.remove-btn{

    border:none;

    background:none;

    color:red;

    font-size:20px;

    cursor:pointer;

}

.cart-summary{

    background:#fff;

    padding:30px;

    border-radius:15px;

    box-shadow:0 5px 15px rgba(0,0,0,.1);

    height:fit-content;

}

.cart-summary h2{

    color:#6F4E37;

    margin-bottom:25px;

}

.summary-row{

    display:flex;

    justify-content:space-between;

    margin:20px 0;

}

.total{

    font-weight:bold;

    font-size:22px;

    border-top:1px solid #ddd;

    padding-top:20px;

}

.checkout-btn{

    display:block;

    text-align:center;

    background:#6F4E37;

    color:#fff;

    text-decoration:none;

    padding:15px;

    border-radius:30px;

    margin-top:30px;

    transition:.3s;

}

.checkout-btn:hover{

    background:#D4AF37;

}

.continue-btn{

    display:block;

    text-align:center;

    margin-top:20px;

    color:#6F4E37;

    text-decoration:none;

}



@media(max-width:768px){

.cart-container{

grid-template-columns:1fr;

}

.cart-item{

flex-direction:column;

text-align:center;

}

.item-details p{

text-align:center;

}

}