/* ═══════════════════════════════════════════════
   Ákotí Icons — Monochrome SVG Icon System
   Uses currentColor. No external dependencies.

   Usage:
     <span class="aki aki-home"></span>
     <span class="aki aki-search aki-lg"></span>

   Sizing: .aki-xs (12px) .aki-sm (16px) default (20px) .aki-lg (24px) .aki-xl (32px)
   Color: inherits from parent — use text color classes
   ═══════════════════════════════════════════════ */

.aki {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  vertical-align: middle;
}

.aki svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Sizes */
.aki-xs { width: 12px; height: 12px; }
.aki-sm { width: 16px; height: 16px; }
.aki-lg { width: 24px; height: 24px; }
.aki-xl { width: 32px; height: 32px; }
.aki-2xl { width: 40px; height: 40px; }

/* Filled variant — for solid icons */
.aki-filled svg { fill: currentColor; stroke: none; }

/* Spin animation for loaders */
.aki-spin { animation: aki-rotate 1s linear infinite; }
@keyframes aki-rotate { to { transform: rotate(360deg); } }

/* Pulse */
.aki-pulse { animation: aki-pulse 1.5s ease-in-out infinite; }
@keyframes aki-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }