/* SVG de Lucide: color y tamaño siguen el contexto del control. */
.app-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    font-size: 1.25em;
    vertical-align: -0.15em;
    flex-shrink: 0;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    overflow: visible;
}

.app-icon > use { pointer-events: none; }

.icon-fw { width: 1.25em; text-align: center; }
.icon-filled { fill: currentColor; }
.icon-xs { font-size: .75em; }
.icon-sm { font-size: .875em; }
.icon-lg { font-size: 1.33333em; }
.icon-xl { font-size: 1.5em; }
.icon-2xl, .icon-2x { font-size: 2em; }
.icon-1x { font-size: 1em; }
.icon-3x { font-size: 3em; }
.icon-4x { font-size: 4em; }
.icon-5x { font-size: 5em; }
.icon-6x { font-size: 6em; }
.icon-7x { font-size: 7em; }
.icon-8x { font-size: 8em; }
.icon-9x { font-size: 9em; }
.icon-10x { font-size: 10em; }
.icon-spin { animation: iconos-giro 1s linear infinite; }
.icon-pulse { animation: iconos-giro 1s steps(8) infinite; }
.icon-spin-reverse { animation-direction: reverse; }
.icon-shake { animation: iconos-sacudida 1s ease-in-out infinite; }
.icon-beat { animation: iconos-latido 1s ease-in-out infinite; }
.icon-fade { animation: iconos-fade 1s ease-in-out infinite; }
.icon-beat-fade { animation: iconos-latido 1s ease-in-out infinite; }
.icon-bounce { animation: iconos-rebote 1s ease-in-out infinite; }
.icon-flip { transform: rotateY(180deg); }
.icon-flip-horizontal { transform: scaleX(-1); }
.icon-flip-vertical { transform: scaleY(-1); }
.icon-rotate-90 { transform: rotate(90deg); }
.icon-rotate-180 { transform: rotate(180deg); }
.icon-rotate-270 { transform: rotate(270deg); }

@keyframes iconos-giro { to { transform: rotate(360deg); } }
@keyframes iconos-sacudida {
    0%, 100% { transform: rotate(0); }
    25% { transform: rotate(15deg); }
    75% { transform: rotate(-15deg); }
}
@keyframes iconos-latido { 50% { transform: scale(1.15); } }
@keyframes iconos-fade { 50% { opacity: .4; } }
@keyframes iconos-rebote { 50% { transform: translateY(-.2em); } }

@media (prefers-reduced-motion: reduce) {
    .icon-spin, .icon-pulse, .icon-shake, .icon-beat,
    .icon-fade, .icon-beat-fade, .icon-bounce { animation: none; }
}
