body { font-family: Arial, sans-serif; margin: 0; padding: 0; }
header { background: #2c3e50; color: white; padding: 20px; }
.breadcrumb { background: #ecf0f1; padding: 10px 20px; font-size: 14px; }
.breadcrumb a { color: #2980b9; text-decoration: none; }

.cart-container { position: relative; float: right; border: 1px solid #fff; padding: 5px 10px; }
.cart-detail { 
    display: none; 
    position: absolute; right: 0; top: 100%; width: 220px; 
    background: white; color: black; border: 2px solid #333; 
    padding: 10px; z-index: 1000; 
}
.cart-container:hover .cart-detail { display: block; }

main { display: flex; padding: 20px; }
.category-list { width: 200px; border-right: 1px solid #ddd; }
.product-grid { display: flex; flex-wrap: wrap; gap: 20px; flex: 1; padding-left: 20px; }

.product-card { 
    width: 200px; border: 1px solid #eee; padding: 10px; 
    text-align: center; background: #fff; transition: 0.3s;
}
.product-card:hover { box-shadow: 0 4px 8px rgba(0,0,0,0.1); }
.product-card img { width: 100%; height: 150px; object-fit: cover; }

.detail-container { display: flex; gap: 40px; margin-top: 20px; }
.full-img { width: 400px; border: 1px solid #ccc; }
.product-info { flex: 1; }
.price { font-size: 24px; color: #e74c3c; font-weight: bold; }

.product-card img { 
    width: 200px; 
    height: 200px; 
    object-fit: cover;
    display: block;
    margin: 0 auto;
}

.full-img { 
    width: 100%;
    max-width: 600px; 
    height: auto; 
}