@use '@carbon/layout';
@use '@carbon/type';
@use '@openmrs/esm-styleguide/src/vars' as *;

.heading {
  @include type.type-style('heading-compact-01');
  margin: layout.$spacing-05 0 layout.$spacing-05;
}

.warningContainer {
  background-color: $carbon--red-50;
  padding: layout.$spacing-04;
  margin: layout.$spacing-03 0 layout.$spacing-03;
  display: flex;
  justify-content: space-between;
  .warning {
    @include type.type-style('heading-compact-01');
    color: $ui-05;
  }
}

.form {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.grid {
  margin: 0 layout.$spacing-05;
  padding: 0;
}

.input {
  margin-top: layout.$spacing-04;
}

.button {
  height: layout.$spacing-10;
  display: flex;
  align-content: flex-start;
  align-items: baseline;
  min-width: 50%;
}

.buttonSet {
  padding: 0;
  margin-top: layout.$spacing-05;
}

/* Tablet */
:global(.omrs-breakpoint-lt-desktop) {
  .form {
    height: 100%;
  }

  .buttonSet {
    padding: layout.$spacing-06 layout.$spacing-05;
    background-color: $ui-02;
  }
}