:root {
  --zhuuzh-oxford-blue: #002147;
  --zhuuzh-oxford-gold: #FFB125;
  --zhuuzh-logo-blue: #0D4273;
}

.z-icon {
  width: 1.5rem;
  height: 1.5rem;
  display: inline-block;
  flex: none;
  color: var(--zhuuzh-oxford-blue);
  vertical-align: middle;
}

.z-icon--gold { color: var(--zhuuzh-oxford-gold); }
.z-icon--logo-blue { color: var(--zhuuzh-logo-blue); }
.z-icon--sm { width: 1.125rem; height: 1.125rem; }
.z-icon--lg { width: 2rem; height: 2rem; }
.z-icon--xl { width: 3rem; height: 3rem; }

.z-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--zhuuzh-oxford-blue);
  transition: color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.z-icon-button:hover {
  color: var(--zhuuzh-oxford-gold);
  transform: translateY(-1px);
}

@media (prefers-color-scheme: dark) {
  .z-icon { color: #F4F7FA; }
  .z-icon-button:hover { color: var(--zhuuzh-oxford-gold); }
}
/* Bagisto icon classes → ZHUUZH SVG icons */
.icon-search::before,
.icon-users::before,
.icon-cart::before,
.icon-heart::before,
.icon-heart-fill::before,
.icon-filter::before,
.icon-filter-1::before,
.icon-calendar::before,
.icon-edit::before,
.icon-trash::before {
    content: "" !important;
    display: inline-block !important;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    background-color: currentColor;

    -webkit-mask-image: var(--zhuuzh-icon);
    mask-image: var(--zhuuzh-icon);

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    -webkit-mask-position: center;
    mask-position: center;

    -webkit-mask-size: contain;
    mask-size: contain;
}

.icon-search::before {
    --zhuuzh-icon: url("./icons/ui-search.svg");
}

.icon-users::before {
    --zhuuzh-icon: url("./icons/ui-user.svg");
}

.icon-cart::before {
    --zhuuzh-icon: url("./icons/ui-cart.svg");
}

.icon-heart::before,
.icon-heart-fill::before {
    --zhuuzh-icon: url("./icons/ui-heart.svg");
}

.icon-filter::before,
.icon-filter-1::before {
    --zhuuzh-icon: url("./icons/ui-filter.svg");
}

.icon-calendar::before {
    --zhuuzh-icon: url("./icons/ui-calendar.svg");
}

.icon-edit::before {
    --zhuuzh-icon: url("./icons/ui-edit.svg");
}

.icon-trash::before {
    --zhuuzh-icon: url("./icons/ui-trash.svg");
}
