/* Thanh navbar */
nav{
background:#0f8b6d;
padding:15px;
display:flex;
gap:30px;
align-items:center;
}

nav a{
color:white;
text-decoration:none;
font-weight:bold;
}

.booking{
margin-left:auto;
background:red;
color:white;
padding:10px 20px;
border:none;
border-radius:20px;
}

body{
font-family: Arial, sans-serif;
margin:0;
background:#f5f5f5;
}

/* ===== TITLE ===== */

.title{
font-size:26px;
font-weight:bold;
color:#2c63d6;
margin:30px 40px;
}

.search-box{
    margin:20px 0;
    text-align:center;
}

.search-box input{
    width:300px;
    padding:10px;
    border:1px solid #ccc;
    border-radius:5px;
}

.search-box button{
    padding:10px 15px;
    background:#ff6600;
    color:white;
    border:none;
    border-radius:5px;
    cursor:pointer;
}

.search-box button:hover{
    background:#e65c00;
}

/* ===== LAYOUT ===== */

.shop-container{
display:flex;
gap:30px;
padding:20px 40px;
}


/* ===== SIDEBAR ===== */

.sidebar{
width:230px;
}

.sidebar h3{
color:#2c63d6;
margin-bottom:10px;
}

.sidebar select{
width:100%;
padding:8px;
border:1px solid #ccc;
border-radius:5px;
margin-bottom:20px;
}

.cart-box{
background:white;
padding:10px;
border-radius:5px;
border:1px solid #ddd;
}


/* ===== PRODUCT GRID ===== */

.product-list{
flex:1;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:25px;
}


/* ===== PRODUCT CARD ===== */

.product{
background:white;
border-radius:8px;
padding:15px;
text-align:center;
transition:0.3s;
}

.product:hover{
box-shadow:0 5px 15px rgba(0,0,0,0.15);
transform:translateY(-3px);
}

.product img{
width:100%;
border-radius:5px;
}

.product h3{
font-size:14px;
margin:10px 0;
height:40px;
}

.price{
color:red;
font-weight:bold;
}

.category{
width:100%;
padding:10px;
border-radius:6px;
border:1px solid #ccc;
}
/* ===== RESPONSIVE ===== */

@media(max-width:1000px){

.product-list{
grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:600px){

.shop-container{
flex-direction:column;
}

.product-list{
grid-template-columns:1fr;
}

}