/* The academy's buttons, in one file both the app (academy/_shell.html) and
   the CPD page's try-it load, so the exercise on the landing page has the
   very button the exercise in the app has. Colours are tokens.css. */

.app-button {
  display: inline-block;
  padding: 9px 18px;
  border: 0;
  border-radius: var(--oa-radius-md);
  background: var(--oa-accent);
  color: #fff;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}

.app-button:hover { background: var(--oa-accent-hover); color: #fff; }

.app-button--quiet {
  background: transparent;
  border: 1px solid var(--oa-line);
  color: var(--oa-ink-soft);
}

.app-button--quiet:hover { background: var(--oa-surface); color: var(--oa-ink); }
.app-button:disabled { opacity: 0.45; cursor: not-allowed; }