:root{
  --primary: #0b5ed7; /* tweak to logo colors */
}
.btn-primary, .bg-primary { background-color: var(--primary) !important; border-color: var(--primary) !important; }
.navbar-dark.bg-primary { background-color: var(--primary) !important; }
.price { font-weight:700; }
.price .was { text-decoration: line-through; color:#888; font-weight:400; margin-right: .25rem; }
.price .save { color:#198754; font-weight:600; }
.product-card img { object-fit: cover; height: 180px; width: 100%; }
.category-hero { height: 220px; object-fit: cover; width:100%; border-radius: .5rem; }
.btn-toggle{ display:inline-flex; align-items:center; padding:.25rem .5rem; font-weight:600; }
.btn-toggle::after{ content:'▸'; margin-left:.5rem; transition: transform .2s; }
.btn-toggle[aria-expanded="true"]::after{ transform: rotate(90deg); }
.thumb { width: 64px; height: 64px; object-fit: cover; border:1px solid #ddd; border-radius: .25rem; cursor:pointer; }
.thumb.active{ outline: 2px solid var(--primary); }