.pluginDetailsPanel {
  height: 100%;
  border-top: 1px solid var(--grey-100);
}

.pluginIcon {
  background: var(--teal-200) !important;
  border-radius: 5px;
}

.plugin {
  border: 1px solid var(--grey-100);
  &:hover {
    cursor: pointer;
  }
}

.form {
  height: calc(100% - var(--spacing-large) - var(--spacing-xxlarge));
  width: 100%;
  :global {
    .FormikForm--main {
      height: 100%;
      & > div {
        height: 100%;
      }
    }
  }
}

.arrow {
  &:hover {
    cursor: pointer;
  }
}

.plugins {
  max-height: calc(100vh - var(--header-height) - var(--generate-pipeline-header));
  overflow-y: scroll;
}

.pluginDesc {
  text-overflow: ellipsis;
  width: calc(30vw - 2 * var(--spacing-huge));
}

.formFields {
  height: calc(100% - var(--spacing-xlarge));
  overflow-y: scroll;
}

.search {
  width: 50%;
  height: 35px;
}

.indent {
  background: var(--grey-100) !important;
  padding: var(--spacing-medium) var(--spacing-medium) var(--spacing-small) var(--spacing-large) !important;
  border-radius: 8px;
}

.configForm {
  height: calc(100% - var(--spacing-large) - var(--spacing-xxlarge));
  margin: var(--spacing-large) var(--spacing-xxlarge) var(--spacing-xxlarge) var(--spacing-xxlarge) !important;
}