/* =============================================================================
   rhq_buttons.css — the four button roles (guideline §4.1, created verbatim)
   -----------------------------------------------------------------------------
   Four roles. ONE primary per view. All labels Title Case. Replaces every
   legacy treatment (purple/green/black fills, lowercase outline buttons,
   Bootstrap `btn-*` on product surfaces) as each template migrates — additive
   until then; nothing renders differently while no template uses the classes.
   Tokens come from rhq_tokens.css (loaded first in both layouts).
   ============================================================================= */

.rhq-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; height:40px;
  padding:0 18px; border-radius:10px; border:1px solid transparent; font-family:var(--rhq-font);
  font-size:14px; font-weight:600; line-height:1; cursor:pointer; white-space:nowrap; }
.rhq-btn:focus-visible { outline:2px solid var(--rhq-focus-ring); outline-offset:2px; }
.rhq-btn:disabled { opacity:.45; cursor:not-allowed; }
.rhq-btn:not(:disabled):active { filter:brightness(.93); }
.rhq-btn--primary   { background:var(--rhq-web-action-primary); color:#fff; }
.rhq-btn--primary:hover:not(:disabled) { background:var(--rhq-web-action-pressed); }
.rhq-btn--secondary { background:#fff; border-color:var(--rhq-border); color:var(--rhq-text-strong); }
.rhq-btn--secondary:hover:not(:disabled) { background:var(--rhq-surface-sunken); border-color:#cbd5e1; }
.rhq-btn--ghost     { background:transparent; color:var(--rhq-web-action-primary); }
.rhq-btn--ghost:hover:not(:disabled) { background:var(--rhq-status-info-soft); }
.rhq-btn--danger    { background:var(--rhq-status-critical); color:#fff; }
.rhq-btn--sm   { height:32px; padding:0 12px; font-size:13px; border-radius:8px; }
.rhq-btn--icon { width:40px; padding:0; }   /* aria-label REQUIRED */