/**
 * LX-TOOLS icon base styles.
 *
 * Lucide replaces `<i data-lucide="X"></i>` with an inline <svg> at
 * runtime. Style both the pre-replacement placeholder (so pages don't
 * flash a bare `<i>` before lucide.createIcons() runs) and the final
 * `.lucide` SVG that ships back.
 *
 * Icons inherit font-size by default (1em box) so they scale with the
 * text they sit next to. A slight negative baseline offset keeps stroke
 * icons visually aligned with capital letters.
 */

[data-lucide],
.lucide {
    width: 1em;
    height: 1em;
    display: inline-block;
    vertical-align: -0.15em;
    stroke-width: 2;
    flex-shrink: 0;
}

/* Hide the placeholder <i>'s text-content flash if any consumer left
 * fallback text between the tags. */
i[data-lucide]:not(:empty) { color: transparent; }

/* Buttons / chips carry icons next to text — small margin so they don't
 * touch the label. Applied when the icon is a direct child of a common
 * text-bearing element. */
.btn > .lucide + span,
.btn > svg.lucide + span,
.btn > .lucide,
button > .lucide { margin-right: 0; }
.btn .lucide,
button .lucide { margin-right: 0.35em; }
.btn .lucide:last-child,
button .lucide:last-child { margin-right: 0; margin-left: 0.35em; }