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

.orderForm {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  :global(.cds--css-grid) {
    max-width: unset;
  }

  :global(.cds--css-grid-column) {
    margin: 0 layout.$spacing-03 !important;
  }

  :global(.cds--subgrid) {
    margin: 0 calc(layout.$spacing-03 * -1) !important;
  }

  :global(.cds--number--nosteppers.cds--number input[type='number']) {
    padding-right: layout.$spacing-05;
  }

  :global(.cds--number__control-btn) {
    border: 0;
  }
}

.form {
  margin: layout.$spacing-05;
}

.gridRow {
  padding: 0px;

  :global(.cds--number) {
    display: inline-block;
  }
}

.field {
  margin-bottom: layout.$spacing-05;
}

.buttonSet {
  :global(.cds--btn) {
    width: 50%;
    max-width: unset;
  }
}

.errorContainer {
  margin: 1rem;
}

.errorNotification {
  margin: 0.5rem 0;
}

/* Tablet */
:global(.omrs-breakpoint-lt-desktop) {
  .orderForm {
    height: calc(100vh - 6rem - var(--workspace-header-height));
    background-color: #ededed;
  }

  .buttonSet {
    padding: layout.$spacing-06 layout.$spacing-05;
    background-color:colors.$gray-10;
  }

  .errorContainer {
    margin: 1rem;
    margin-bottom: calc(var(--bottom-nav-height) + 1rem);
  }
}