@larva.io/webcomponents/dist/collection/components/internal/list-item/list-item.css

Fentrica SmartUnits WebComponents package

slot-fb[hidden], slot[hidden] {
  display: initial !important;
}

/**
* @prop --lar-list-item-padding-top: Top padding of the toolbar
* @prop --lar-list-item-padding-right: End padding of the toolbar
* @prop --lar-list-item-padding-bottom: Bottom padding of the toolbar
* @prop --lar-list-item-padding-left: Start padding of the toolbar
*/
:host {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  padding: var(--lar-list-item-padding-top, 0.5rem) var(--lar-list-item-padding-right, 0.5rem) var(--lar-list-item-padding-bottom, 0.5rem) var(--lar-list-item-padding-left, 0.5rem);
  display: flex;
  justify-content: space-between;
  flex-direction: row;
}

.item-inner {
  flex: 2;
  flex-direction: inherit;
  align-items: inherit;
  align-self: stretch;
  overflow: hidden;
  box-sizing: border-box;
  max-width: 100%;
  width: 100%;
}

:host(:empty) {
  display: none !important;
}

:host(.lar-item-disabled) {
  opacity: 0.2;
}

:host(.lar-color-primary) {
  background: var(--lar-color-primary-shade, rgb(105.6, 9.68, 161.04)) !important;
  color: var(--lar-color-primary-contrast, #fff) !important;
  fill: var(--lar-color-primary-contrast, #fff) !important;
  stroke: var(--lar-color-primary-contrast, #fff) !important;
}

:host(.lar-color-secondary) {
  background: var(--lar-color-secondary-shade, rgb(111.76, 161.92, 0)) !important;
  color: var(--lar-color-secondary-contrast, #fff) !important;
  fill: var(--lar-color-secondary-contrast, #fff) !important;
  stroke: var(--lar-color-secondary-contrast, #fff) !important;
}

:host(.lar-color-tertiary) {
  background: var(--lar-color-tertiary-shade, rgb(0, 146.08, 208.56)) !important;
  color: var(--lar-color-tertiary-contrast, #fff) !important;
  fill: var(--lar-color-tertiary-contrast, #fff) !important;
  stroke: var(--lar-color-tertiary-contrast, #fff) !important;
}

:host(.lar-color-success) {
  background: var(--lar-color-success-shade, rgb(111.76, 161.92, 0)) !important;
  color: var(--lar-color-success-contrast, #fff) !important;
  fill: var(--lar-color-success-contrast, #fff) !important;
  stroke: var(--lar-color-success-contrast, #fff) !important;
}

:host(.lar-color-warning) {
  background: var(--lar-color-warning-shade, rgb(224.4, 158.4, 0)) !important;
  color: var(--lar-color-warning-contrast, #fff) !important;
  fill: var(--lar-color-warning-contrast, #fff) !important;
  stroke: var(--lar-color-warning-contrast, #fff) !important;
}

:host(.lar-color-danger) {
  background: var(--lar-color-danger-shade, rgb(216.48, 71.28, 25.52)) !important;
  color: var(--lar-color-danger-contrast, #fff) !important;
  fill: var(--lar-color-danger-contrast, #fff) !important;
  stroke: var(--lar-color-danger-contrast, #fff) !important;
}

:host(.lar-color-light) {
  background: var(--lar-color-light-shade, rgb(214.72, 215.6, 218.24)) !important;
  color: var(--lar-color-light-contrast, #000) !important;
  fill: var(--lar-color-light-contrast, #000) !important;
  stroke: var(--lar-color-light-contrast, #000) !important;
}

:host(.lar-color-medium) {
  background: var(--lar-color-medium-shade, rgb(188.32, 188.32, 188.32)) !important;
  color: var(--lar-color-medium-contrast, #000) !important;
  fill: var(--lar-color-medium-contrast, #000) !important;
  stroke: var(--lar-color-medium-contrast, #000) !important;
}

:host(.lar-color-dark) {
  background: var(--lar-color-dark-shade, rgb(29.92, 31.68, 35.2)) !important;
  color: var(--lar-color-dark-contrast, #fff) !important;
  fill: var(--lar-color-dark-contrast, #fff) !important;
  stroke: var(--lar-color-dark-contrast, #fff) !important;
}