/* NextUI Universal Icon Styles */

/* 1. Animation System */
.sx-ani-spin {
    animation: sx-spin 2s linear infinite;
}

.sx-ani-pulse {
    animation: sx-spin 1s steps(8) infinite;
}

.sx-ani-beat {
    animation: sx-beat 0.8s ease-in-out infinite;
}

@keyframes sx-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes sx-beat {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.2); }
}

/* 2. Stacking System */
.sx-icon-stack {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    width: 1em;
    height: 1em;
}

.sx-icon-stack i, .sx-icon-stack svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0 !important;
}

/* 3. Base Sizes (Optional overrides) */
.sx-icon-size-xs { font-size: 0.75rem; }
.sx-icon-size-sm { font-size: 0.875rem; }
.sx-icon-size-md { font-size: 1rem; }
.sx-icon-size-lg { font-size: 1.25rem; }
.sx-icon-size-xl { font-size: 1.5rem; }