@use '@carbon/colors';
@use '@carbon/layout';
@use '@carbon/type';

.container {
  padding: layout.$spacing-05 layout.$spacing-07;
  display: flex;
  flex-direction: column;
}

.grid {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  max-width: 100%;

  :global(.cds--tabs__nav-item--selected) {
    border-bottom: layout.$spacing-01 solid var(--cds-border-interactive, colors.$teal-70);
    outline: none !important;
  }
}

.column {
  margin-left: 0;
  margin-right: 0;
}

.maximized .column:last-child {
  display: none;
}

.errorNotification {
  min-width: 100%;
  margin: 0;
  padding: 0;
}

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

  button {
    margin-left: layout.$spacing-05;
  }
}

.formName {
  @include type.type-style('heading-03');
}

.editorContainer {
  padding: 1rem;

  :global(.ace_editor .ace_content .ace_layer .error) {
    position: absolute;
    background-color: colors.$red-60;
    border-radius: 0;
  }
}

.heading {
  display: flex;
  margin-right: 1rem;
  align-items: center;
}

.tabHeading {
  display: flex;
  align-items: center;
  @include type.type-style('heading-compact-01');
  min-height: layout.$spacing-08;
  width: 100%;
  padding: layout.$spacing-04;
}

.backButton {
  margin-left: layout.$spacing-05;
  padding: layout.$spacing-03 0;
  max-width: fit-content;

  a {
    text-decoration: none;
  }

  button {
    display: flex;
    padding-left: 0 !important;

    svg {
      order: 1;
      margin: 0 layout.$spacing-03;
    }

    span {
      order: 2;
    }
  }
}

button {
  padding-block-start: layout.$spacing-03;
}

.topBtns {
  display: flex;
  align-items: center;
}

.dropdown {
  grid-gap: 0 !important;

  :global(.cds--label) {
    white-space: nowrap;
  }
}
