:host {
  display: flex;
  border-bottom: 1px solid var(--color-border);
  background: var(--color-elevated-item-background);
  border-top-right-radius: var(--corner-radius);
  border-top-left-radius: var(--corner-radius);
}

/* Scale */
:host.small {
  --row-padding: calc(1 * var(--spacing-unit)) calc(1 * var(--spacing-unit));
}

:host.medium {
  --row-padding: calc(1 * var(--spacing-unit)) calc(2 * var(--spacing-unit));
}

:host.large {
  --row-padding: calc(3 * var(--spacing-unit)) calc(3 * var(--spacing-unit));
}

:host.no-spacing {
  --row-padding: 0;
}

:host.separated-0 {

}

:host.separated-1, :host.separated-2, :host.separated-3 {
  border-radius: var(--corner-radius);
  border-bottom: none;
  background: none;
}

:host.separated-1 {

}

:host.separated-2 {

}

:host.separated-3 {

}

:host.elevated-0 {

}

:host.elevated-1 {
  margin: 0 calc(1 * var(--spacing-unit));
}

:host.elevated-2 {
  margin: 0 calc(2 * var(--spacing-unit));
}

:host.elevated-3 {
  margin: 0 calc(3 * var(--spacing-unit));
}
