/* based on https://github.com/remix-run/remix/blob/4a23e6e3a861238ea5ad285c7d436102bdd43564/templates/remix-tutorial/app/app.css#L32 */

.client-btn {
  background-color: rgb(255, 230, 230);
  cursor: pointer;
  font-size: 1rem;
  font-family: inherit;
  border: none;
  border-radius: 8px;
  padding: 0.5rem 0.75rem;
  box-shadow: 0 0px 1px hsla(0, 0%, 0%, 0.2), 0 1px 2px hsla(0, 0%, 0%, 0.2);
  line-height: 1.5;
  margin: 0.4rem;
  font-weight: 500;
}

.client-btn:hover {
  box-shadow: 0 0px 1px hsla(0, 0%, 0%, 0.6), 0 1px 2px hsla(0, 0%, 0%, 0.2);
}

.client-btn:active {
  box-shadow: 0 0px 1px hsla(0, 0%, 0%, 0.4);
  transform: translateY(1px);
}