/**
 * Requisites form.
 */
.bg-style-form {
  background: #f7f8f9;
  border-radius: 6px;
  padding: 12px 16px;
  margin-bottom: 1.5em;

  fieldset,
  details,
  .fieldgroup,
  .claro-details {
    box-shadow: none !important;
  }
}

/**
 * Submits.
 */
.inline-style-form {
  h2,
  h3 {
    font-weight: normal;
    font-size: 18px;
    margin: 0 0 0.5em 0;
  }

  p {
    font-size: 14px;
    color: #676767;
  }

  p.error-no-be-account-id {
    padding-left: 1em;
    border-left: 5px solid red;
  }

  form {
    .form__actions {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.5em;

      .form-item,
      .js-form-item {
        margin: 0;
        width: auto;
      }

      .form-submit,
      .button,
      select {
        font-size: 14px;
        min-height: auto;
        height: auto;
        font-weight: normal;
        margin: 0;
      }

      select {
        padding: 5px 16px;
        padding-right: 42px;
        box-shadow: none;
      }

      .form-submit,
      .button {
        padding: 10px 16px;
        font-weight: 700;
        background: #4a5568;
        color: #ffffff;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        transition: background-color 0.2s ease, color 0.2s ease;

        &:hover:not(:disabled) {
          background: #3a4454;
        }

        &:disabled {
          background: #e2e8f0;
          color: #94a3b8;
          cursor: not-allowed;
          pointer-events: none;
        }
      }
    }
  }

  .button--success {
    background: #d4edda !important;
    color: #155724 !important;
  }

  .button.button--submit {
    font-weight: normal;
  }

  .button.button--cancel {
    background: #d5dee9;
    color: #4a5568;
  }
}

.requisites-form {
  form {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.5em;

    legend {
      span {
        padding: 0;
        margin-bottom: 2em;
        font-weight: normal;
        text-transform: uppercase;
      }
    }

    .form-item {
      .form-item__label {
        text-transform: uppercase;
        font-size: 14px;
        font-weight: normal;
      }

      .form-element {
        padding: 5px 10px;
        min-height: auto;
        font-size: 14px;
        width: 100%;
      }
    }

    .form-item,
    .js-form-item {
      margin: 0;
      width: auto;
    }

    fieldset {
      flex-basis: 100%;
      border: none;
      background: #f7f8f9;
      border-radius: 6px;
      padding: 16px;
      margin: 0;

      .fieldset__wrapper {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px 32px;
        max-width: 550px;
        margin: 0;
      }
    }

    @media (max-width: 742px) {
      fieldset .fieldset__wrapper {
        grid-template-columns: 1fr;
        max-width: none;

        .form-item {
          .form-item__label {
            font-size: 12px;
          }

          .form-element {
            font-size: 12px;
          }
        }
      }
    }
  }
}

.quick-inline-form {
  .form__users_list,
  .form__users_actions {
    margin-bottom: 1em;
  }

  .form__users_actions {
    margin-top: 1em;
    padding-bottom: 1em;
    border-bottom: 1px solid #e5e7eb;
  }
}
