:root {
  --brand-primary: #000000;
  --brand-primary-hover: #1a1a1a;
  --brand-accent: #FF5C00;
  --brand-accent-hover: color-mix(in srgb, #FF5C00 88%, #000000);
  --brand-accent-text: #000000;
}

:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--brand-accent) 70%, white);
  outline-offset: 2px;
}

:where(
  .mn-btn,
  .mz-buy,
  .add,
  .search button,
  .mn-search button,
  .mz-search button,
  .submit,
  .yq-cart-review,
  .yuchen-members-link,
  .yuchen-mobile-members,
  .mz-fav-add,
  .mimoza-upsell-card button,
  .mz-cart-go,
  .mz-dept,
  .quote button,
  .quote-upsell-card button,
  .card button
) {
  background: var(--brand-accent) !important;
  color: var(--brand-accent-text) !important;
}

:where(
  .mn-btn,
  .mz-buy,
  .add,
  .search button,
  .mn-search button,
  .mz-search button,
  .submit,
  .yq-cart-review,
  .yuchen-members-link,
  .yuchen-mobile-members,
  .mz-fav-add,
  .mimoza-upsell-card button,
  .mz-cart-go,
  .mz-dept,
  .quote button,
  .quote-upsell-card button,
  .card button
):not(:disabled):hover {
  background: var(--brand-accent-hover) !important;
}

:where(.mz-count, .mz-badge, .mn-badge, .badge, .mark) {
  color: var(--brand-accent-text) !important;
}

:where(button, .button):disabled {
  cursor: not-allowed;
  opacity: .48;
}
