import { css } from 'lit';
import componentStyles from '../../styles/component.styles.mjs';

const styles = css`
  ${componentStyles}

  :host {
    display: block;

    --divider-color: var(--flow-ui-list-item-divider-color);
  }

  .list {
    display: flex;
    flex-direction: column;
    gap: max(var(--flow-ui-divider-width), 2px);
    background-color: var(--divider-color);
  }
`;

export { styles as default };
