/* ============================================================
   VIT-106 — Iconography csomag (Lucide)
   2px stroke, rounded line-cap, charcoal default, terracotta accent
   ============================================================ */

/* Lucide alap stílus — `data-lucide` markupos elem és az általa renderelt SVG */
[data-lucide],
.vitano-icon,
.vitano-icon svg,
[data-lucide] svg {
    display: inline-block;
    flex-shrink: 0;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
    vertical-align: middle;
}

/* Default méret 24px, ha az inline style nem ad meg méretet */
.vitano-icon[style*="width"] svg,
.vitano-icon[style*="width"] {
    width: 100%;
    height: 100%;
}

/* Kontextus-szintű méret defaultok */
.vitano-icon--body      { width: 24px; height: 24px; }
.vitano-icon--inline    { width: 20px; height: 20px; }
.vitano-icon--chip      { width: 16px; height: 16px; }
.vitano-icon--bottomnav { width: 32px; height: 32px; }

/* Színváltozatok */
.vitano-icon--terracotta { color: var(--vitano-terracotta); }
.vitano-icon--coral      { color: var(--vitano-coral); }
.vitano-icon--sage       { color: var(--vitano-sage); }
.vitano-icon--rose       { color: var(--vitano-rose); }
.vitano-icon--stone      { color: var(--vitano-stone); }
.vitano-icon--white      { color: var(--vitano-white); }
.vitano-icon--cream      { color: var(--vitano-cream); }
.vitano-icon--disabled   { color: var(--vitano-charcoal-3); }

/* Aktív állapot — például menüben, aktív tabon */
.is-active .vitano-icon,
[aria-current="page"] .vitano-icon {
    color: var(--vitano-terracotta);
    stroke-width: 2.5;
}

/* Disabled gomb */
button[disabled] .vitano-icon,
.vitano-disabled .vitano-icon {
    color: var(--vitano-charcoal-3);
}

/* Lucide rendering közbeni placeholder — a `<i>` magassága még nem állítható,
   ezért adunk neki minimum méretet, hogy ne ugráljon a layout */
i[data-lucide] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* Reduced motion — ne legyen átmenet az ikon swap-on */
@media (prefers-reduced-motion: reduce) {
    .vitano-icon, .vitano-icon svg, [data-lucide] {
        transition: none;
    }
}