.Account.Dialog {
  display: flex;
  flex-direction: column;
  gap: $unit * 2;
  width: $unit * 64;

  form {
    display: flex;
    flex-direction: column;
    gap: $unit * 2;

    .Switch {
      $height: 34px;
      background: $grey-70;
      border-radius: calc($height / 2);
      border: none;
      position: relative;
      width: 58px;
      height: $height;

      &:focus {
        box-shadow: 0 0 0 2px $grey-15;
      }

      &[data-state='checked'] {
        background: $grey-15;
      }
    }

    .Thumb {
      background: $grey-100;
      border-radius: 13px;
      display: block;
      height: 26px;
      width: 26px;
      transition: transform 100ms;
      transform: translateX(-1px);

      &:hover {
        cursor: pointer;
      }

      &[data-state='checked'] {
        background: $grey-100;
        transform: translateX(21px);
      }
    }
  }

  .DialogDescription {
    font-size: $font-regular;
    line-height: 1.24;
    margin-bottom: $unit;

    &:last-of-type {
      margin-bottom: 0;
    }
  }
}