/* Contacts
 * -------------------------------------------------------------------------- */

.contact__bio {
  display: flex;
  flex-direction: column;
  text-align: center;

  .avatar { margin: auto; }
}

.contact__info {
  position: relative;
  padding: 0 0 1rem;
}

.contact__edit {
  position: absolute;
  top: 0;
  right: 0;
}

.contact__domain {
  position: absolute;
  top: 0;
  left: 0;
  right: auto;
  max-width: 36%;
}

.for-contact__options { display: none; }

.contact__options {
  display: inline-flex;
  flex-flow: wrap;
  align-items: center;
  text-align: center;
  font-size: var(--font-size-small);
  justify-content: center;
  border-radius: 3rem;
  margin: 0 auto 1rem;

  @media (max-width: 39.95em) {
    .btn { margin: 0.3rem 0.5rem; }
  }

  @media (min-width: 40em) {
    margin: 0 0 1rem;
    font-size: var(--font-size-x-small);
  }

  .btn--outlined-tertiary { background: var(--color-bg--main); }

  .btn--icon-recycling {
    border: none;
    font-size: var(--font-size-small);

    @media (min-width: 40em) {
      font-size: var(--font-size-x-small);
    }

    &::before {
      filter: none;
    }

    &.btn--outlined-positive {
      background: var(--color-bg--main);

      &::before {
        filter: var(--colorize-green);
      }
    }
  }

  .for-contact__options { display: revert; }
}

.contact__compose {
  display: flex;
  align-items: center;
}

.contact__headline {
  padding-right: 1rem;
}

.contact__note__editor {
  height: auto;
}

.contact__note--typing {
  display: inline;
}