/**
 * Blue Ridge Core Theme — Icons
 * See docs/design-system/14-icons.md for full rationale.
 *
 * Icons are inline SVG (or <use> from a sprite), never an icon font. Every
 * icon SVG should use stroke="currentColor" / fill="currentColor" internally
 * so it inherits color from context — these classes handle sizing/alignment
 * only, never color.
 */

.icon {
  display: inline-block;
  flex-shrink: 0;
  width: var(--icon-size-md);
  height: var(--icon-size-md);
  vertical-align: middle;
}

.icon--sm { width: var(--icon-size-sm); height: var(--icon-size-sm); }
.icon--lg { width: var(--icon-size-lg); height: var(--icon-size-lg); }
.icon--xl { width: var(--icon-size-xl); height: var(--icon-size-xl); }

/* Wrapper for an icon-only interactive control — guarantees the 44px tap
   target even when the visible icon itself is smaller. See buttons.css
   .btn--icon for the button-specific version of this rule. */
.icon-target {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
}