/* css/button.css — buttons and the .actions row.
   One of the files src/index.html links in order; see tokens.css for why. */

/* ==========================================================================
   Buttons — no hover lift on interface controls, per the spec
   ==========================================================================
   Buttons say what happens, and the action keeps its name through the flow.
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  font-family:inherit;font-size:.9375rem;font-weight:700;line-height:1.2;
  padding:.65rem 1.2rem;border-radius:var(--r-sm);cursor:pointer;
  border:1.5px solid var(--ink);background:var(--field);color:var(--ink);
  box-shadow:var(--sh-sm);
  transform:none;               /* explicit: no lift, ever */
  /* A BUTTON LABEL IS A PHRASE AND MUST NOT BREAK. In the roster's actions
     column at 1280px "Remove access" wrapped onto two lines and the button grew
     a second row of height, which read as a different and larger control than
     the History button beside it. A label short enough to be a button is short
     enough to stay on one line; if one ever is not, the label is the thing to
     fix. */
  white-space:nowrap;
}
.btn:hover{box-shadow:var(--sh)}
.btn:disabled{
  cursor:not-allowed;opacity:1;                 /* opacity alone is not a state */
  color:var(--ink-soft);border-color:var(--rule-strong);background:var(--paper);
  box-shadow:none;
}
.btn--primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn--primary:disabled{background:var(--rule-strong);border-color:var(--rule-strong);color:var(--field)}
.btn--approve{border-color:var(--approved);color:var(--approved);background:var(--approved-wash)}
.btn--return{border-color:var(--rejected);color:var(--rejected);background:var(--rejected-wash)}
.btn--quiet{border-color:var(--rule-strong);font-weight:600}
.btn--small{font-size:.875rem;padding:.4rem .65rem}
.btn--link{border:0;background:none;box-shadow:none;padding:.2rem;text-decoration:underline;font-weight:600}

.actions{display:flex;gap:15px;flex-wrap:wrap;align-items:center;margin-top:30px}