.p-metergroup {
  @apply flex gap-4;
}

.p-metergroup-meters {
  @apply flex rounded-md bg-surface-200 dark:bg-surface-700;
}

.p-metergroup-label-list {
  @apply m-0 flex list-none flex-wrap p-0;
}

.p-metergroup-label {
  @apply inline-flex items-center gap-2;
}

.p-metergroup-label-marker {
  @apply inline-flex h-2 w-2 rounded-full;
}

.p-metergroup-label-icon {
  @apply h-4 w-4 text-base;
}

.p-metergroup-horizontal {
  @apply flex-col;
}

.p-metergroup-label-list-horizontal {
  @apply gap-4;
}

.p-metergroup-horizontal .p-metergroup-meters {
  @apply h-2;
}

.p-metergroup-horizontal .p-metergroup-meter:first-of-type {
  @apply rounded-s-md;
}

.p-metergroup-horizontal .p-metergroup-meter:last-of-type {
  @apply rounded-e-md;
}

.p-metergroup-vertical {
  @apply flex-row;
}

.p-metergroup-label-list-vertical {
  @apply flex-col gap-2;
}

.p-metergroup-vertical .p-metergroup-meters {
  @apply h-full w-2 flex-col;
}

.p-metergroup-vertical .p-metergroup-label-list {
  @apply items-start;
}

.p-metergroup-vertical .p-metergroup-meter:first-of-type {
  @apply rounded-se-md rounded-ss-md;
}

.p-metergroup-vertical .p-metergroup-meter:last-of-type {
  @apply rounded-ee-md rounded-es-md;
}
