@use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-dropList';

$sizes: 's', 'm', 'l';

.pinTopItem {
  @each $size in $sizes {
    &[data-size='#{$size}'] {
      @include styles-tokens-dropList.composite-var(styles-tokens-dropList.$drop-list, 'item', $size, 'content-pin-top');
    }
  }

  display: flex;
  flex-direction: column;
  border: none;

  li,
  ul {
    list-style-type: none;
  }
}

.pinBottomItem {
  @each $size in $sizes {
    &[data-size='#{$size}'] {
      @include styles-tokens-dropList.composite-var(styles-tokens-dropList.$drop-list, 'item', $size, 'content-pin-bottom');
    }
  }

  display: flex;
  flex-direction: column;
  border: none;

  li,
  ul {
    list-style-type: none;
  }
}