#subscription-details {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  align-items: stretch;
  line-height: 120%;

  > * {
    flex: 1;

    display: flex;
    gap: .5rem;

    > * {
      flex: 1;

      &:last-child {
        text-align: right;
      }
    }
  }
}

#subscription-cost {
  .field__label {
    margin: 0;
  }

  .plans-indicator {
    font-weight: normal;
    font-style: italic;
  }
}

#subscription-help {
  padding: 1rem;
  background-color: var(--allowance-color-positive-light);
  margin-bottom: 1rem;
}