/* ==========================================================================
   components/buttons.css
   No gradients, no pills, no transform hovers — shade shifts only.
   ========================================================================== */

.btn {
    font-size: 0.8438rem;
    font-weight: 500;
    border-radius: var(--crm-radius-sm);
    padding: 0.4688rem 0.875rem;
    line-height: 1.4;
    box-shadow: var(--crm-shadow-xs);
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    transform: none !important;             /* kill legacy hover lifts */
}
.btn:focus-visible { box-shadow: 0 0 0 3px rgba(74, 90, 194, 0.16); }

.btn-sm { font-size: 0.7813rem; padding: 0.3125rem 0.625rem; }
.btn-lg { font-size: 0.9375rem; padding: 0.625rem 1.25rem; }

/* Primary */
.btn-primary {
    background: var(--crm-primary) !important;   /* wins over legacy gradients */
    border: 1px solid var(--crm-primary) !important;
    color: #fff;
}
.btn-primary:hover, .btn-primary:focus {
    background: var(--crm-primary-hover) !important;
    border-color: var(--crm-primary-hover) !important;
    box-shadow: var(--crm-shadow-xs);
}
.btn-primary:active { background: var(--crm-primary-active) !important; }

/* Secondary / neutral solid */
.btn-secondary {
    background: #475467;
    border: 1px solid #475467;
}
.btn-secondary:hover { background: #4a4842; border-color: #4a4842; }

/* Outline variants → quiet gray-bordered buttons (Linear/Stripe style).
   Color identity is kept via text color so semantics stay readable. */
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-info,
.btn-outline-danger,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-dark {
    background: var(--crm-surface);
    border: 1px solid var(--crm-border-strong);
    box-shadow: var(--crm-shadow-xs);
}

.btn-outline-primary   { color: var(--crm-primary); }
.btn-outline-secondary { color: var(--crm-text-secondary); }
.btn-outline-info      { color: var(--crm-info); }
.btn-outline-danger    { color: var(--crm-danger); }
.btn-outline-success   { color: var(--crm-success); }
.btn-outline-warning   { color: var(--crm-warning); }
.btn-outline-dark      { color: var(--crm-ink); }

.btn-outline-primary:hover   { background: var(--crm-primary-soft); border-color: var(--crm-primary-border); color: var(--crm-primary-hover); }
.btn-outline-secondary:hover { background: var(--crm-surface-alt); border-color: var(--crm-border-strong); color: var(--crm-ink); }
.btn-outline-info:hover      { background: var(--crm-info-bg); border-color: var(--crm-info-border); color: var(--crm-info); }
.btn-outline-danger:hover    { background: var(--crm-danger-bg); border-color: var(--crm-danger-border); color: var(--crm-danger); }
.btn-outline-success:hover   { background: var(--crm-success-bg); border-color: var(--crm-success-border); color: var(--crm-success); }
.btn-outline-warning:hover   { background: var(--crm-warning-bg); border-color: var(--crm-warning-border); color: var(--crm-warning); }
.btn-outline-dark:hover      { background: var(--crm-surface-alt); color: var(--crm-ink); }

/* Solid state buttons */
.btn-danger  { background: #d92d20; border-color: #d92d20; }
.btn-danger:hover { background: var(--crm-danger); border-color: var(--crm-danger); }
.btn-success { background: #079455; border-color: #079455; }
.btn-success:hover { background: var(--crm-success); border-color: var(--crm-success); }
.btn-warning { background: #f79009; border-color: #f79009; color: #fff; }
.btn-warning:hover { background: #dc6803; border-color: #dc6803; color: #fff; }
.btn-info    { background: var(--crm-info); border-color: var(--crm-info); color: #fff; }
.btn-info:hover { background: #1550b8; border-color: #1550b8; color: #fff; }

.btn-light {
    background: var(--crm-surface);
    border: 1px solid var(--crm-border-strong);
    color: var(--crm-text);
}
.btn-light:hover { background: var(--crm-surface-alt); }

.btn-link { box-shadow: none; font-weight: 500; }

.btn:disabled, .btn.disabled {
    opacity: 0.55;
    box-shadow: none;
}

/* Icon-only buttons keep a consistent hit area */
.btn > i:only-child { margin: 0; }
