/* Adaptado de Licencias.Shared/Components/CustomComponents/Button. */
.neron-button {
    --neron-button-color: var(--ui-primary-action);
    --neron-button-foreground: var(--ui-primary-action-foreground);
}
.neron-button-outline { --neron-button-color: var(--ui-accent); }
.neron-button.secondary {
    --neron-button-color: var(--ui-border-strong);
    color: var(--ui-text-secondary);
}
.neron-button.danger {
    --neron-button-color: var(--ui-destructive-action);
    --neron-button-foreground: var(--ui-destructive-action-foreground);
}
.neron-button.success {
    --neron-button-color: var(--ui-positive-action);
    --neron-button-foreground: var(--ui-positive-action-foreground);
}
.neron-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-width: max-content;
    min-height: var(--ui-button-height);
    padding: 0.55rem 1.15rem;
    border: 1px solid var(--neron-button-color);
    border-radius: var(--ui-control-radius);
    font: inherit;
    font-size: 0.75rem;
    font-weight: 850;
    letter-spacing: 0.015em;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
    transition: color 150ms ease, border-color 150ms ease, background-color 150ms ease, box-shadow 150ms ease, transform 120ms ease;
}

.neron-button-filled {
    color: var(--neron-button-foreground);
    background: var(--neron-button-color);
    box-shadow: 0 5px 12px color-mix(in srgb, var(--neron-button-color) 20%, transparent);
}

.neron-button-filled:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--neron-button-color) 88%, var(--neron-button-foreground));
    background: color-mix(in srgb, var(--neron-button-color) 88%, var(--neron-button-foreground));
    box-shadow: 0 7px 16px color-mix(in srgb, var(--neron-button-color) 26%, transparent);
    transform: translateY(-1px);
}

.neron-button-outline {
    color: var(--neron-button-color);
    background: transparent;
    box-shadow: none;
}

.neron-button-outline:hover:not(:disabled) {
    color: var(--neron-button-color);
    border-color: var(--neron-button-color);
    background: color-mix(in srgb, var(--neron-button-color) 12%, transparent);
    transform: translateY(-1px);
}

.neron-button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--neron-button-color) 24%, transparent);
}

.neron-button:active:not(:disabled) {
    transform: translateY(0);
}

.neron-button:disabled {
    cursor: not-allowed;
    opacity: 0.5;
    transform: none;
    box-shadow: none;
}

.neron-button:disabled:not(.is-loading) {
    color: var(--ui-text-muted);
    border-color: var(--ui-border-strong);
    background: var(--ui-surface-muted);
    opacity: 1;
}

.neron-button-content {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: inherit;
}

.neron-button-spinner {
    width: 0.85rem;
    height: 0.85rem;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: neron-button-spin 650ms linear infinite;
}

@keyframes neron-button-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .neron-button {
        transition: none;
    }

    .neron-button-spinner {
        animation-duration: 1.2s;
    }
}

.neron-button.compact { min-height: 32px; padding: 8px 11px; }
.neron-button.is-loading::before {
    content: "";
    width: 0.85rem;
    height: 0.85rem;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: neron-button-spin 650ms linear infinite;
}
@media (prefers-reduced-motion: reduce) { .neron-button.is-loading::before { animation: none; border-style: dotted; } }
