/*
 * ============================================================================
 * Button Styles
 * ============================================================================
 * Styles for all button types: primary, secondary, destructive, and active states.
 * ============================================================================
 */

/* Primary buttons (Add Node, Link Nodes, Save) */
button {
    padding: 8px 16px;
    background: var(--btn-primary-bg);
    color: var(--btn-primary-text);
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.15s ease;
}

button:hover {
    background: var(--btn-primary-bg-hover);
}

button:active {
    background: var(--btn-primary-bg-active);
}

/* Disabled button state */
button:disabled {
    background: var(--btn-disabled-bg);
    color: var(--btn-disabled-text);
    cursor: not-allowed;
    opacity: var(--btn-disabled-opacity);
    border: 1px solid var(--btn-disabled-text);
}

/* Active/toggle state (Link Mode active) */
button.active {
    background: var(--btn-active-bg);
    color: var(--btn-active-text);
    font-weight: bold;
    box-shadow: 0 0 0 2px var(--color-accent-blue-glow);
}

/* Secondary buttons (Load) */
button.secondary {
    background: var(--btn-secondary-bg);
    border: 1px solid var(--btn-secondary-border);
    color: var(--btn-secondary-text);
}

button.secondary:hover {
    background: var(--color-accent-blue);
    color: var(--color-ui-white);
}

/* Destructive buttons (Delete Node, Clear All, Remove Link) */
button.destructive {
    background: var(--btn-destructive-bg);
    border: 1px solid var(--btn-destructive-border);
    color: var(--btn-destructive-text);
}

button.destructive:hover {
    border-color: #ef4444;
    color: #ef4444;
}

/* Destructive button active state - maintain dimensions, keep red indicator */
button.destructive.active {
    background: var(--btn-destructive-bg);
    border-color: #ef4444;
    color: #ef4444;
    font-weight: normal;
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.3);
}