.flex-center {
  display: flex;
  width: 100%;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}

.flex-col-center {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
}

.generic-input {
  background-color: var(--color--white);
  color: var(--color--dark-grey);
  border: var(--border-width--normal) solid #d1d5db;
  border-radius: var(--border-radius--strong);
  padding: var(--spacing--sm);
  text-align: center;
  font-weight: bold;

  &:focus {
    border-color: var(--color--green);
    outline: none;
  }
}

a {
  color: var(--color--green);
  font-weight: var(--font-weight--medium);
  text-decoration: inherit;

  &:hover {
    color: #535bf2;
  }
}

h1 {
  font-size: 3.2em;
  line-height: 1.1;
}

.card__title{
  margin-block: 0 var(--spacing--sm);
  font-weight: bold;
  font-size: var(--font-size--xl);
  text-align: center;
  color: var(--color--green);
}

.hide--url .table--url {
  max-width: 24ch;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}