:root { --primary: #6c3ce0; --primary-dark: #5429c4; }
body { font-family: 'Segoe UI', system-ui, sans-serif; color: #333; }
.navbar-brand { font-size: 1.5rem; color: var(--primary) !important; }
.btn-primary { background: var(--primary); border-color: var(--primary); }
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); }
.hero-slider .carousel-item { height: 450px; }
.hero-slider .carousel-item img { object-fit: cover; height: 100%; width: 100%; }
.hero-caption { background: rgba(0,0,0,0.4); padding: 30px; border-radius: 12px; }
.section-title { font-weight: 700; margin-bottom: 1.5rem; position: relative; padding-bottom: 10px; }
.section-title::after { content: ''; position: absolute; bottom: 0; left: 0; width: 50px; height: 3px; background: var(--primary); }
.product-card { border: none; border-radius: 12px; overflow: hidden; transition: transform 0.3s, box-shadow 0.3s; }
.product-card:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
.product-card img { height: 280px; object-fit: cover; }
.product-card .card-body { padding: 1rem; }
.price { color: var(--primary); font-weight: 700; font-size: 1.1rem; }
.price-old { text-decoration: line-through; color: #999; font-size: 0.9rem; }
.category-card { border-radius: 12px; overflow: hidden; position: relative; height: 200px; }
.category-card img { width: 100%; height: 100%; object-fit: cover; }
.category-card .overlay { position: absolute; inset: 0; background: linear-gradient(transparent, rgba(0,0,0,0.7)); display: flex; align-items: flex-end; padding: 20px; }
.category-card h5 { color: #fff; margin: 0; }
.colour-swatch { width: 36px; height: 36px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 1px #ddd; cursor: pointer; display: inline-block; transition: transform 0.2s; }
.colour-swatch:hover, .colour-swatch.active { transform: scale(1.15); box-shadow: 0 0 0 2px var(--primary); }
.size-btn { min-width: 50px; }
.size-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.product-gallery-thumb { width: 80px; height: 80px; object-fit: cover; border-radius: 8px; cursor: pointer; border: 2px solid transparent; }
.product-gallery-thumb.active { border-color: var(--primary); }
.filter-sidebar { background: #f8f9fa; border-radius: 12px; padding: 20px; }
.combo-card img { height: 200px; object-fit: cover; }
@media (max-width: 767.98px) {
    .hero-slider .carousel-item { height: 250px; }
    .product-card img { height: 200px; }
}
