/* =============================================================================
   Kingdom of Valor — SVG Icon System
   All icons are inline SVG via CSS mask-image or used as <svg> elements.
   Gold-themed, consistent stroke style.
   ============================================================================= */

/* Base icon style — used with .icon class */
.icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  vertical-align: middle;
}
.icon svg {
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Size variants */
.icon-sm  svg { width: 14px; height: 14px; }
.icon-md  svg { width: 18px; height: 18px; }
.icon-lg  svg { width: 22px; height: 22px; }
.icon-xl  svg { width: 28px; height: 28px; }
.icon-2xl svg { width: 36px; height: 36px; }

/* Status dot replacements */
.status-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.status-dot--online  { background: var(--green); box-shadow: 0 0 6px var(--green); }
.status-dot--offline { background: var(--text-muted); }
.status-dot--shielded { background: var(--blue); }