﻿.nh-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 16px;
    font-size: var(--nh-font-size-sm);
    font-family: inherit;
    font-weight: 500;
    border-radius: 6px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
    white-space: nowrap;
    outline: none;
    line-height: 1;
    text-decoration: none;
}

    .nh-btn:focus-visible {
        box-shadow: 0 0 0 3px rgba(191, 160, 224, 0.25);
    }

    .nh-btn:disabled {
        opacity: 0.35;
        cursor: not-allowed;
        pointer-events: none;
    }

    .nh-btn i {
        font-size: 15px;
    }

/* --- Variants --- */

.nh-btn--primary {
    background: var(--nh-color-accent);
    color: #1a1020;
    border-color: var(--nh-color-accent);
}

    .nh-btn--primary:hover:not(:disabled) {
        background: var(--nh-color-accent-light);
        border-color: var(--nh-color-accent-light);
    }

.nh-btn--secondary {
    background: var(--nh-color-accent-darkest);
    color: var(--nh-color-accent-light);
    border-color: var(--nh-color-accent-dark);
}

    .nh-btn--secondary:hover:not(:disabled) {
        background: var(--nh-color-accent-darker);
        border-color: var(--nh-color-accent);
    }

.nh-btn--ghost {
    background: transparent;
    color: var(--nh-color-text);
    border-color: var(--nh-color-border);
}

    .nh-btn--ghost:hover:not(:disabled) {
        background: rgba(255, 255, 255, 0.06);
        border-color: var(--nh-color-border-strong);
    }

.nh-btn--subtle {
    background: transparent;
    color: var(--nh-color-text-muted);
    border-color: transparent;
}

    .nh-btn--subtle:hover:not(:disabled) {
        background: rgba(255, 255, 255, 0.06);
        color: var(--nh-color-text);
    }

.nh-btn--danger {
    background: var(--nh-color-error-bg);
    color: var(--nh-color-error-icon-fg);
    border-color: var(--nh-color-error-border);
}

    .nh-btn--danger:hover:not(:disabled) {
        background: rgba(239, 112, 112, 0.18);
        border-color: rgba(239, 112, 112, 0.4);
    }
