/* 06-components/_button.css — .c-button. One filled (accent) button per view. */
.c-button {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs);
  min-height: var(--height-control); padding: 0 var(--space-md);
  font-weight: var(--weight-medium); font-size: var(--text-md); line-height: 1; white-space: nowrap;
  color: var(--ink); background: var(--surface); border: var(--stroke) solid var(--rule-strong); border-radius: var(--radius-sm); text-decoration: none; cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.c-button:hover { background: var(--surface-sunken); border-color: var(--ink-faint); color: var(--ink); }
.c-button:disabled { opacity: 0.5; cursor: not-allowed; }
.c-button--primary { color: var(--ink-on-accent); background: var(--accent); border-color: var(--accent); font-weight: var(--weight-semibold); }
.c-button--primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: var(--ink-on-accent); }
.c-button--ghost { border-color: transparent; background: transparent; color: var(--ink-muted); }
.c-button--ghost:hover { background: var(--surface-sunken); color: var(--ink); }
.c-button--danger { color: var(--band-danger-ink); border-color: var(--band-danger-line); }
.c-button--danger:hover { background: var(--band-danger-fill); }
.c-button--ok { color: var(--ink-on-band); background: var(--band-ok-ink); border-color: var(--band-ok-ink); }
.c-button--ok:hover { filter: brightness(0.92); }
.c-button--sm { min-height: 1.75rem; padding-inline: var(--space-sm); font-size: var(--text-sm); }
.c-button--block { width: 100%; }
.c-button--icon { width: var(--height-control); padding: 0; color: var(--ink-muted); }
.c-button--icon:hover { color: var(--ink); }
.c-button svg { width: 1rem; height: 1rem; flex: none; }
@media (pointer: coarse) { .c-button--sm { min-height: var(--height-control); } }