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

.container {
  flex-grow: 1;
}

/* Tablet viewport */
:global(.omrs-breakpoint-lt-desktop) {
  // The card containing the dropdown element should be the first to overflow on tablet
  .cardWithChildren {
    order: 3;
  }
}

.tileContainerWithoutBorder {
  padding: layout.$spacing-04;
}

.tileHeader {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.headerLabel {
  @include type.type-style('heading-compact-01');
  color: $text-02;
}

.valueLabel {
  font-size: x-large;
}

.headerLabelContainer {
  display: flex;
  height: layout.$spacing-07;

  :global(.cds--dropdown__wrapper--inline) {
    gap: 0;
    margin-top: -(layout.$spacing-04);
  }

  :global(.cds--list-box__menu-icon) {
    height: layout.$spacing-05;
  }
}