/* ===================================
   CART PAGE
=================================== */



.cart-page {

    padding:
    90px 0;

    background:
    #F5F7FA;

}



.cart-page h1 {

    font-size:
    42px;

    margin-bottom:
    40px;

}





.cart-layout {

    display:
    grid;

    grid-template-columns:
    1fr 350px;

    gap:
    40px;

}





.cart-items {

    display:
    flex;

    flex-direction:
    column;

    gap:
    20px;

}





.cart-product {

    background:
    white;

    padding:
    25px;

    border-radius:
    14px;

    display:
    flex;

    align-items:
    center;

    gap:
    25px;

}





.cart-product img {

    width:
    120px;

    height:
    120px;

    object-fit:
    cover;

    border-radius:
    10px;

}





.cart-product-info {

    flex:
    1;

}



.cart-product-info h3 {

    font-size:
    20px;

    margin-bottom:
    10px;

}



.cart-product-info p {

    color:
    var(--text-light);

}






.quantity {

    display:
    flex;

    align-items:
    center;

    gap:
    15px;

    margin-top:
    15px;

}



.quantity button {

    width:
    35px;

    height:
    35px;

    border:
    none;

    background:
    var(--primary);

    color:
    white;

    border-radius:
    5px;

    cursor:
    pointer;

}





.cart-price {

    text-align:
    right;

}



.cart-price strong {

    display:
    block;

    font-size:
    22px;

    margin-bottom:
    15px;

}





.cart-price button {

    border:
    none;

    background:
    transparent;

    color:
    #d33;

    cursor:
    pointer;

}








/* SUMMARY */


.cart-summary {

    background:
    white;

    padding:
    30px;

    border-radius:
    14px;

    height:
    fit-content;

}



.cart-summary h2 {

    margin-bottom:
    30px;

}



.cart-total {

    display:
    flex;

    justify-content:
    space-between;

    font-size:
    20px;

    margin-bottom:
    30px;

}



.cart-total strong {

    color:
    var(--primary);

}



.checkout-btn {

    width:
    100%;

    text-align:
    center;

}



.continue-shopping {

    display:
    block;

    margin-top:
    20px;

    text-align:
    center;

    color:
    var(--primary);

}







.empty-cart {

    background:
    white;

    padding:
    50px;

    text-align:
    center;

    border-radius:
    14px;

}





/* ADD BUTTONS */


.add-cart {

    border:
    none;

    cursor:
    pointer;

    padding:
    12px 20px;

    background:
    var(--primary);

    color:
    white;

    border-radius:
    7px;

    margin-top:
    15px;

}



.add-cart:hover {

    background:
    var(--secondary);

}








@media(max-width:900px){


.cart-layout {

    grid-template-columns:
    1fr;

}



}





@media(max-width:600px){


.cart-product {

    flex-direction:
    column;

    align-items:
    flex-start;

}



.cart-price {

    width:
    100%;

    text-align:
    left;

}



.cart-product img {

    width:
    100%;

    height:
    220px;

}



}