/*!
 * Sistema de botones: variantes primario, secundario, outline, ghost, tamaños y estados.
 *
 * @package AlexiaSoft
 * @since   1.0.0
 */
.ast-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.65rem 1.5rem;
    border-radius: var(--border-radius);
    font-family: var(--font-body);
    font-weight: 600;
    font-size: var(--font-size-sm);
    cursor: pointer;
    transition: all var(--transition);
    border: 2px solid transparent;
    line-height: 1.4;
    text-decoration: none;
}

.ast-btn:focus-visible {
    outline: 3px solid var(--color-primary);
    outline-offset: 2px;
}

/* Variantes */
.ast-btn-primary  { background: var(--color-primary);     color: #fff; border-color: var(--color-primary); }
.ast-btn-primary:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: #fff; }

.ast-btn-secondary { background: var(--color-secondary);  color: #fff; border-color: var(--color-secondary); }
.ast-btn-secondary:hover { filter: brightness(0.9); color: #fff; }

.ast-btn-outline  { background: transparent; border-color: var(--color-primary); color: var(--color-primary); }
.ast-btn-outline:hover { background: var(--color-primary); color: #fff; }

.ast-btn-ghost    { background: transparent; border-color: transparent; color: var(--color-primary); }
.ast-btn-ghost:hover { background: var(--color-bg-alt); }

.ast-btn-white    { background: #fff; color: var(--color-primary); border-color: #fff; }
.ast-btn-white:hover { background: var(--color-bg-alt); color: var(--color-primary-dark); }

.ast-btn-danger   { background: #ef4444; color: #fff; border-color: #ef4444; }
.ast-btn-danger:hover { background: #dc2626; border-color: #dc2626; color: #fff; }

/* Tamaños */
.ast-btn-sm { padding: 0.4rem 1rem; font-size: 0.8rem; }
.ast-btn-lg { padding: 0.85rem 2rem; font-size: 1rem; }
.ast-btn-xl { padding: 1rem 2.5rem; font-size: 1.1rem; border-radius: var(--border-radius-lg); }

/* Estado */
.ast-btn:disabled,
.ast-btn[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; pointer-events: none; }

.ast-btn-loading { position: relative; color: transparent !important; }
.ast-btn-loading::after {
    content: '';
    position: absolute;
    width: 1em;
    height: 1em;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: ast-spin 0.6s linear infinite;
}

@keyframes ast-spin { to { transform: rotate(360deg); } }