/* ===========================
   RESET
=========================== */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
background:#0a0a0a;
color:#fff;
font-family:'Poppins',sans-serif;
overflow-x:hidden;
}

a{
text-decoration:none;
color:#fff;
}

img{
max-width:100%;
display:block;
}

/* ===========================
   HEADER
=========================== */

header{
display:flex;
justify-content:space-between;
align-items:center;
padding:22px 70px;
border-bottom:1px solid #222;
background:#0a0a0a;
position:sticky;
top:0;
z-index:999;
}

.logo img{
width:60px;
}

nav{
display:flex;
gap:35px;
}

nav a{
font-size:12px;
letter-spacing:2px;
transition:.3s;
}

nav a:hover,
nav .active{
color:#d8c4a4;
}

/* ===========================
   CART
=========================== */

.cart-page{
padding:80px 70px;
}

.cart-page h1{
font-family:'Cinzel',serif;
font-size:52px;
margin-bottom:50px;
}

.cart-container{
display:grid;
grid-template-columns:2fr 1fr;
gap:40px;
}

.cart-items{
display:flex;
flex-direction:column;
gap:25px;
}

.cart-item{
display:flex;
align-items:center;
justify-content:space-between;
background:#111;
border:1px solid #222;
padding:20px;
border-radius:18px;
}

.item-image{
width:130px;
height:160px;
background:#1c1c1c;
border-radius:12px;
}

.item-info{
flex:1;
padding:0 25px;
}

.item-info h2{
margin-bottom:10px;
}

.item-info p{
color:#999;
margin-bottom:10px;
}

.item-info span{
font-size:20px;
}

.quantity{
display:flex;
align-items:center;
gap:15px;
}

.quantity button{
width:42px;
height:42px;
background:transparent;
border:1px solid #444;
color:#fff;
cursor:pointer;
transition:.3s;
}

.quantity button:hover{
background:#fff;
color:#000;
}

.summary{
background:#111;
border:1px solid #222;
border-radius:18px;
padding:30px;
height:fit-content;
}

.summary h2{
margin-bottom:30px;
font-family:'Cinzel',serif;
}

.row{
display:flex;
justify-content:space-between;
margin-bottom:18px;
color:#cfcfcf;
}

.total{
font-size:22px;
font-weight:600;
margin-top:25px;
padding-top:25px;
border-top:1px solid #333;
}

.checkout-btn{
display:block;
margin-top:35px;
text-align:center;
padding:18px;
border:1px solid #555;
transition:.3s;
letter-spacing:2px;
}

.checkout-btn:hover{
background:#fff;
color:#000;
}

/* ===========================
   FOOTER
=========================== */

footer{
padding:40px;
border-top:1px solid #222;
text-align:center;
margin-top:70px;
color:#888;
}

/* ===========================
   RESPONSIVE
=========================== */

@media(max-width:1000px){

header{
padding:20px;
}

nav{
display:none;
}

.cart-page{
padding:40px 20px;
}

.cart-container{
grid-template-columns:1fr;
}

.cart-item{
flex-direction:column;
text-align:center;
gap:20px;
}

.item-info{
padding:0;
}

}

@media(max-width:600px){

.cart-page h1{
font-size:34px;
}

.quantity{
justify-content:center;
}

}
.delete-btn{

width:45px;
height:45px;

background:#b00020;

border:none;

color:#fff;

border-radius:50%;

cursor:pointer;

font-size:18px;

transition:.3s;

}

.delete-btn:hover{

background:#ff2b4f;

}

.item-image img{

width:100%;

height:100%;

object-fit:cover;

border-radius:12px;

}