:root{
  --brand:#28a745;
  --brand2:#5cd65c;
  --card:#fff;
  --bg:#eaffea;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Poppins',Arial,sans-serif;background:var(--bg);color:#111;}
header{background:linear-gradient(90deg,var(--brand),var(--brand2));padding:12px 16px;color:white;text-align:center;}
.logo{font-weight:700;font-size:22px;}
.search-bar{display:flex;justify-content:center;align-items:center;padding:10px;background:#fff;gap:8px;}
.search-bar input{width:65%;padding:8px;border:2px solid var(--brand);border-radius:8px;outline:none;}
.search-bar button{background:var(--brand);color:white;border:none;border-radius:8px;padding:8px 14px;font-weight:700;cursor:pointer;}
.cart-icon{display:flex;align-items:center;gap:5px;background:white;color:var(--brand);border-radius:8px;padding:6px 10px;font-weight:700;cursor:pointer;}
.cart-icon img{width:22px;height:22px}
.banner-container{position:relative;width:100%;overflow:hidden;height:200px;}
.slides{display:flex;width:300%;transition:transform 1s ease-in-out;}
.slide{width:100%;flex-shrink:0;}
.slide img{width:100%;height:200px;object-fit:cover;}
.collection-section{text-align:center;padding:25px 10px;background:#fff;}
.collection-section h2{font-size:22px;font-weight:800;color:#333;margin-bottom:20px;}
.collections{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:15px;justify-items:center;}
.collection-item{width:100px;background:linear-gradient(180deg,#fff,#d9ffd9);border-radius:20px;padding:10px;box-shadow:0 3px 8px rgba(0,0,0,0.08);cursor:pointer;}
.collection-item img{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid var(--brand);}
.collection-item p{margin-top:8px;font-weight:700;color:#333;font-size:14px;}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;padding:8px;}
.card{background:var(--card);border-radius:12px;padding:10px;box-shadow:0 1px 3px rgba(0,0,0,0.06);display:flex;flex-direction:column;}
.img{height:110px;border-radius:10px;background:#d9ffd9;display:flex;align-items:center;justify-content:center;color:#888;font-weight:600;}
.name{font-weight:700;margin-top:8px}
.price{color:var(--brand);font-weight:700;margin-top:4px}
.old-price{text-decoration:line-through;color:gray;font-size:13px;margin-left:6px}
.btn-primary{padding:8px;border-radius:8px;border:none;background:var(--brand);color:white;font-weight:700;cursor:pointer;margin-top:6px}
footer{text-align:center;padding:20px;background:#fff;}
.social-links{margin-top:10px;display:flex;justify-content:center;gap:15px;}
.social-links img{width:30px;height:30px;cursor:pointer;transition:0.3s;}
.social-links img:hover{transform:scale(1.2);}
.footer-links{margin-top:15px;display:flex;flex-wrap:wrap;justify-content:center;gap:12px;}
.footer-links a{text-decoration:none;color:var(--brand);font-weight:600;cursor:pointer;}
#cartPopup{position:fixed;bottom:10px;right:10px;background:#fff;border:2px solid var(--brand);border-radius:12px;box-shadow:0 5px 15px rgba(0,0,0,0.2);padding:16px;width:260px;display:none;z-index:1000;}
#cartPopup h3{margin-bottom:10px;color:var(--brand);}
#cartItems{max-height:150px;overflow-y:auto;margin-bottom:8px;}
#totalPrice{font-weight:bold;color:var(--brand);margin-top:6px;}
#cartPopup button{background:var(--brand);color:white;border:none;padding:8px 10px;border-radius:8px;cursor:pointer;width:100%;margin-top:8px;}
.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,0.6);}
.modal-content{background:#fff;margin:10% auto;padding:20px;border-radius:10px;max-width:700px;}
.close{color:#333;float:right;font-size:20px;font-weight:bold;cursor:pointer;}
#addressForm input, #addressForm textarea{
  width:100%;padding:8px;margin-top:6px;border:1px solid #ccc;border-radius:6px;
}
#addressForm button{margin-top:12px;background:var(--brand);color:white;border:none;padding:8px 10px;border-radius:8px;cursor:pointer;}
