/* Bouton principal et variantes. */

.itf-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--itf-space-2);
    padding: var(--itf-space-2) var(--itf-space-4);
    font-family: var(--itf-font);
    font-size: var(--itf-font-size);
    font-weight: 600;
    color: var(--itf-text-strong);
    background: var(--itf-card-2);
    border: 1px solid var(--itf-border);
    border-radius: var(--itf-radius-sm);
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.itf-btn:hover {
    background: var(--itf-border);
    border-color: var(--itf-border-strong);
    color: var(--itf-text-strong);
    text-decoration: none;
}

.itf-btn:disabled,
.itf-btn[aria-disabled="true"] {
    opacity: 0.6;
    cursor: not-allowed;
}

.itf-btn--success {
    background: var(--itf-success);
    border-color: var(--itf-success);
    color: var(--itf-text-on-primary);
}

.itf-btn--success:hover {
    background: var(--itf-success-hover);
    border-color: var(--itf-success-hover);
}

.itf-btn--info {
    background: var(--itf-info);
    border-color: var(--itf-info);
    color: var(--itf-text-on-primary);
}

.itf-btn--info:hover {
    background: var(--itf-primary);
    border-color: var(--itf-primary);
}

.itf-btn--danger {
    background: var(--itf-danger);
    border-color: var(--itf-danger);
    color: var(--itf-text-on-primary);
}

.itf-btn--danger:hover {
    background: var(--itf-danger-hover);
    border-color: var(--itf-danger-hover);
}

.itf-btn--sm {
    padding: var(--itf-space-1) var(--itf-space-3);
    font-size: var(--itf-font-size-sm);
}