/* ==========================================================================
   Buttons — single source of truth
   Bootstrap 5 variant: uses --bs-btn-* CSS variables.
   No per-state selector blocks needed — Bootstrap 5 reads the variables.
   Requires tokens.css to be loaded first.
   ========================================================================== */

/*
 * HIERARCHY GUIDE — at most ONE filled action per group
 * ─────────────────────────────────────────────────────
 *  1. btn-primary          Filled blue. The main "do it" call to action.
 *  2. btn-secondary        Outline neutral. Supporting action alongside primary.
 *  3. btn-outline-primary  Outlined tinted. Emphatic but not the primary slot.
 *  4. btn-link / ghost     Tertiary: navigate, view, cancel, undo.
 *  5. btn-danger           Destructive only (delete, remove, revoke).
 *  6. btn-warning          Caution/intermediate. NOT a second primary.
 *
 *  Rule: when primary + secondary sit together, primary is filled, secondary
 *  is outline. Never have two filled buttons in the same action group.
 */

/* ==========================================================================
   Base — geometry, font, and focus ring
   ========================================================================== */

.btn {
    --bs-btn-font-family: var(--c-font-family);
    --bs-btn-font-weight: var(--c-font-weight-medium);
    --bs-btn-border-radius: var(--c-radius-md);
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: 0.5rem;
    --bs-btn-focus-box-shadow: var(--c-shadow-focus);
}

/* ==========================================================================
   Primary
   ========================================================================== */

.btn-primary {
    --bs-btn-bg: var(--c-color-primary);
    --bs-btn-border-color: var(--c-color-primary);
    --bs-btn-color: var(--c-color-text-inverse);
    --bs-btn-hover-bg: var(--c-color-primary-hover);
    --bs-btn-hover-border-color: var(--c-color-primary-hover);
    --bs-btn-hover-color: var(--c-color-text-inverse);
    --bs-btn-active-bg: var(--c-color-primary-active);
    --bs-btn-active-border-color: var(--c-color-primary-active);
    --bs-btn-active-color: var(--c-color-text-inverse);
    --bs-btn-disabled-bg: var(--c-color-primary);
    --bs-btn-disabled-border-color: var(--c-color-primary);
    --bs-btn-disabled-color: var(--c-color-text-inverse);
    --bs-btn-focus-shadow-rgb: 52, 104, 173;
}

/* ==========================================================================
   Secondary (outline neutral)
   ========================================================================== */

.btn-secondary {
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--c-color-border);
    --bs-btn-color: var(--c-color-text);
    --bs-btn-hover-bg: var(--c-color-input-bg);
    --bs-btn-hover-border-color: var(--c-color-border-hover);
    --bs-btn-hover-color: var(--c-color-text);
    --bs-btn-active-bg: var(--c-color-input-bg);
    --bs-btn-active-border-color: var(--c-color-border-hover);
    --bs-btn-active-color: var(--c-color-text);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--c-color-border);
    --bs-btn-disabled-color: var(--c-color-text);
    --bs-btn-focus-shadow-rgb: 52, 104, 173;
}

/* Bootstrap 3 alias */
.btn-default {
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--c-color-border);
    --bs-btn-color: var(--c-color-text);
    --bs-btn-hover-bg: var(--c-color-input-bg);
    --bs-btn-hover-border-color: var(--c-color-border-hover);
    --bs-btn-hover-color: var(--c-color-text);
}

/* ==========================================================================
   Danger
   ========================================================================== */

.btn-danger {
    --bs-btn-bg: var(--c-color-error);
    --bs-btn-border-color: var(--c-color-error);
    --bs-btn-color: var(--c-color-text-inverse);
    --bs-btn-hover-bg: var(--c-color-error-hover);
    --bs-btn-hover-border-color: var(--c-color-error-hover);
    --bs-btn-hover-color: var(--c-color-text-inverse);
    --bs-btn-active-bg: var(--c-color-error-hover);
    --bs-btn-active-border-color: var(--c-color-error-hover);
    --bs-btn-active-color: var(--c-color-text-inverse);
    --bs-btn-disabled-bg: var(--c-color-error);
    --bs-btn-disabled-border-color: var(--c-color-error);
    --bs-btn-focus-shadow-rgb: 206, 33, 15;
}

/* ==========================================================================
   Warning — dark text on amber (WCAG AA: ≈ 4.8:1)
   ========================================================================== */

.btn-warning {
    --bs-btn-bg: var(--c-color-warning);
    --bs-btn-border-color: var(--c-color-warning);
    --bs-btn-color: var(--c-color-text);
    --bs-btn-hover-bg: var(--c-color-warning-hover);
    --bs-btn-hover-border-color: var(--c-color-warning-hover);
    --bs-btn-hover-color: var(--c-color-text);
    --bs-btn-active-bg: var(--c-color-warning-hover);
    --bs-btn-active-color: var(--c-color-text);
    --bs-btn-disabled-bg: var(--c-color-warning);
    --bs-btn-disabled-color: var(--c-color-text);
    --bs-btn-focus-shadow-rgb: 217, 119, 6;
}

/* ==========================================================================
   Success
   ========================================================================== */

.btn-success {
    --bs-btn-bg: var(--c-color-success);
    --bs-btn-border-color: var(--c-color-success);
    --bs-btn-color: var(--c-color-text-inverse);
    --bs-btn-hover-bg: var(--c-color-success-hover);
    --bs-btn-hover-border-color: var(--c-color-success-hover);
    --bs-btn-hover-color: var(--c-color-text-inverse);
    --bs-btn-active-bg: var(--c-color-success-hover);
    --bs-btn-active-color: var(--c-color-text-inverse);
    --bs-btn-disabled-bg: var(--c-color-success);
    --bs-btn-focus-shadow-rgb: 0, 128, 88;
}

/* ==========================================================================
   Dark
   ========================================================================== */

.btn-dark {
    --bs-btn-bg: var(--c-color-text);
    --bs-btn-border-color: var(--c-color-text);
    --bs-btn-color: var(--c-color-text-inverse);
    --bs-btn-hover-bg: var(--c-color-dark-hover);
    --bs-btn-hover-border-color: var(--c-color-dark-hover);
    --bs-btn-hover-color: var(--c-color-text-inverse);
    --bs-btn-disabled-bg: var(--c-color-text);
}

/* ==========================================================================
   Light
   ========================================================================== */

.btn-light {
    --bs-btn-bg: var(--c-color-input-bg);
    --bs-btn-border-color: var(--c-color-border);
    --bs-btn-color: var(--c-color-text-muted);
    --bs-btn-hover-bg: var(--c-color-surface);
    --bs-btn-hover-border-color: var(--c-color-primary);
    --bs-btn-hover-color: var(--c-color-primary);
}

/* ==========================================================================
   Aliases (keep template class names, normalise look)
   ========================================================================== */

/* btn-info → primary blue */
.btn-info {
    --bs-btn-bg: var(--c-color-primary);
    --bs-btn-border-color: var(--c-color-primary);
    --bs-btn-color: var(--c-color-text-inverse);
    --bs-btn-hover-bg: var(--c-color-primary-hover);
    --bs-btn-hover-border-color: var(--c-color-primary-hover);
    --bs-btn-hover-color: var(--c-color-text-inverse);
    --bs-btn-active-bg: var(--c-color-primary-active);
    --bs-btn-focus-shadow-rgb: 52, 104, 173;
}

/* btn-ok → primary (modal confirms) */
.btn-ok {
    --bs-btn-bg: var(--c-color-primary);
    --bs-btn-border-color: var(--c-color-primary);
    --bs-btn-color: var(--c-color-text-inverse);
    --bs-btn-hover-bg: var(--c-color-primary-hover);
    --bs-btn-hover-color: var(--c-color-text-inverse);
}

/* Destructive confirm variant */
.btn-ok[data-action="archive"],
.btn-ok[data-action="delete"] {
    --bs-btn-bg: var(--c-color-error);
    --bs-btn-border-color: var(--c-color-error);
    --bs-btn-hover-bg: var(--c-color-error-hover);
    --bs-btn-hover-border-color: var(--c-color-error-hover);
}

/* ==========================================================================
   Outlined variants
   ========================================================================== */

.btn-outline-primary {
    --bs-btn-color: var(--c-color-primary);
    --bs-btn-border-color: var(--c-color-primary);
    --bs-btn-hover-bg: var(--c-color-primary);
    --bs-btn-hover-color: var(--c-color-text-inverse);
    --bs-btn-active-bg: var(--c-color-primary-active);
    --bs-btn-focus-shadow-rgb: 52, 104, 173;
}

.btn-outline-secondary {
    --bs-btn-color: var(--c-color-text-muted);
    --bs-btn-border-color: var(--c-color-border);
    --bs-btn-hover-bg: var(--c-color-input-bg);
    --bs-btn-hover-border-color: var(--c-color-border-hover);
    --bs-btn-hover-color: var(--c-color-text);
}

.btn-outline-info {
    --bs-btn-color: var(--c-color-primary);
    --bs-btn-border-color: var(--c-color-primary);
    --bs-btn-hover-bg: var(--c-color-primary);
    --bs-btn-hover-color: var(--c-color-text-inverse);
}

.btn-outline-warning {
    --bs-btn-color: var(--c-color-warning);
    --bs-btn-border-color: var(--c-color-warning);
    --bs-btn-hover-bg: var(--c-color-warning);
    --bs-btn-hover-color: var(--c-color-text); /* dark text on amber */
}

.btn-outline-danger {
    --bs-btn-color: var(--c-color-error);
    --bs-btn-border-color: var(--c-color-error);
    --bs-btn-hover-bg: var(--c-color-error);
    --bs-btn-hover-color: var(--c-color-text-inverse);
    --bs-btn-focus-shadow-rgb: 206, 33, 15;
}

.btn-outline-success {
    --bs-btn-color: var(--c-color-success);
    --bs-btn-border-color: var(--c-color-success);
    --bs-btn-hover-bg: var(--c-color-success);
    --bs-btn-hover-color: var(--c-color-text-inverse);
    --bs-btn-focus-shadow-rgb: 0, 128, 88;
}

/* ==========================================================================
   Sizes
   ========================================================================== */

.btn-sm {
    --bs-btn-font-size: var(--c-font-size-sm);
    --bs-btn-padding-x: 0.65rem;
    --bs-btn-padding-y: 0.3rem;
    --bs-btn-border-radius: var(--c-radius-sm);
}

.btn-lg {
    --bs-btn-font-size: var(--c-font-size-lg);
    --bs-btn-padding-x: 1.5rem;
    --bs-btn-padding-y: 0.6rem;
    --bs-btn-border-radius: var(--c-radius-md);
}

/* ==========================================================================
   Reduced motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    .btn {
        transition: none;
    }
}