// scss-lint:disable SelectorDepth
// scss-lint:disable NestingDepth

#protocol-preview-modal .modal-dialog {
  .modal-body {
    max-height: 75vh;
    overflow-y: auto;
    width: 100%;

    .ql-editor {
      min-height: initial;
    }

    .form-group.has-error {
      color: $brand-danger;

      .sci-input-field {
        border: 1px solid $brand-danger;
      }
    }
  }

  .general-error {
    text-align: center;
  }

  .modal-footer {
    .footer {
      align-items: center;
      display: flex;
      justify-content: space-between;

      .left-section {
        align-items: center;
        column-gap: 32px;
        display: flex;
        justify-content: space-between;

        .default-role-container {
          align-items: center;
          column-gap: 8px;
          display: flex;
        }

        .sci-input-container {
          display: flex;
          align-items: center;
          column-gap: 12px;
          flex-grow: 1;

          label {
            margin-bottom: 0;
            white-space: nowrap;
          }

          .dropdown-selector-container {
            width: 170px;

            .search-field {
              padding-left: 7px;
            }
          }
        }
      }

      .right-section {
        column-gap: 8px;
        display: flex;
        flex-basis: 0;
        justify-content: flex-end;
      }
    }
  }
}
