/* ym-icons — outline SVG icon system
   Version 1.0 · 2026-04-23
   Self-hosted sprite at /public/icons/sprite.svg (96 outline icons).
   Icons inherit text color via `currentColor` fill/stroke.
*/

.ym-icon {
  display: inline-block;
  width: 1.15em;
  height: 1.15em;
  vertical-align: -0.18em;
  color: inherit;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
  overflow: visible;
}

/* Duotone variant — backdrop shapes use fill-opacity 0.18 + stroke:none;
   outline shapes use stroke. Both inherit color via currentColor. */
.ym-icon.ym-icon-duo { fill: currentColor; }

.ym-icon.ym-icon-sm { width: 1em; height: 1em; vertical-align: -0.14em; }
.ym-icon.ym-icon-lg { width: 1.5em; height: 1.5em; vertical-align: -0.3em; }
.ym-icon.ym-icon-xl { width: 2em;  height: 2em;  vertical-align: -0.4em;  }
.ym-icon.ym-icon-2x { width: 2em;  height: 2em;  vertical-align: -0.4em;  }
.ym-icon.ym-icon-3x { width: 3em;  height: 3em;  vertical-align: -0.5em;  }

/* Pill / badge variants for status icons */
.ym-icon.ym-icon-success { color: #065f46; }
.ym-icon.ym-icon-warning { color: #92400e; }
.ym-icon.ym-icon-danger  { color: #991b1b; }
.ym-icon.ym-icon-primary { color: #0071e3; }
.ym-icon.ym-icon-muted   { color: #6b7280; }

/* Fixed-pixel sizes for dashboard badges + chips */
.ym-icon.ym-icon-14 { width: 14px; height: 14px; }
.ym-icon.ym-icon-16 { width: 16px; height: 16px; }
.ym-icon.ym-icon-18 { width: 18px; height: 18px; }
.ym-icon.ym-icon-20 { width: 20px; height: 20px; }
.ym-icon.ym-icon-24 { width: 24px; height: 24px; }
.ym-icon.ym-icon-28 { width: 28px; height: 28px; }
.ym-icon.ym-icon-32 { width: 32px; height: 32px; }
.ym-icon.ym-icon-40 { width: 40px; height: 40px; }
.ym-icon.ym-icon-48 { width: 48px; height: 48px; }

/* Compatibility shim: <i class="fas fa-bell"> auto-upgrades to an
   inline SVG when the FA-to-sprite map has an entry. Rendered via
   a tiny boot script in ym-icons.js. */
i.fas, i.far, i.fab, i.fal {
  display: inline-flex;
  align-items: center;
}
i.fas.ym-icon-swapped,
i.far.ym-icon-swapped,
i.fab.ym-icon-swapped,
i.fal.ym-icon-swapped {
  /* After swap these hold just the inline SVG, no FA glyph */
  font-family: inherit;
}