/* The imported symbol library owns its fills and optical stroke weights. */
svg.fino-icon {
  width: var(--fino-icon-size, 20px);
  height: var(--fino-icon-size, 20px);
  flex-shrink: 0;
  display: inline-block;
  vertical-align: -0.15em;
  color: inherit;
  pointer-events: none;
}

.fino-icon--small { --fino-icon-size: 16px; }
.fino-icon--large { --fino-icon-size: 24px; }

/* Keep the magnifier centered when the phone header switches to block layout. */
body.dashboard-page.admin-mode .admin-command-search > svg.fino-icon {
  top: 50%;
  transform: translateY(-50%);
}

/* CSS-drawn magnifiers used to have a different ring and handle weight. */
.commerce-search-icon:has(.fino-icon),
.commerce-search-empty__icon .commerce-search-icon:has(.fino-icon) {
  width: 20px;
  height: 20px;
  border: 0;
  border-radius: 0;
}
.commerce-search-icon:has(.fino-icon)::after { content: none; }