/* Buttons – common style (global) */

.button {
  display: inline-block;
  font-weight: 500;
  font-size: 16px;
  padding: .175rem .75rem;
  border-radius: 50rem;
  text-decoration: none;
  transition: all .2s ease;
  border: 2.5px solid transparent;
  line-height: 30px; /* match body’s 30px line-height for equal height between <a> and <button> */
}
.button--ghost {
  color: var(--color-dark);
  border-color: var(--color-dark);
  background: transparent;
}
.button--ghost:hover {
  background: var(--color-dark);
  color: var(--color-white);
}
.button[disabled],
a.button[aria-disabled="true"]{
  opacity:.55;
  cursor:not-allowed;
  pointer-events: none;
  border-color:#bbb;
  color:#777;
  background:#eee;
}