@use '../../scss/spacers' as spacers;
@use '../../scss/font-mixins' as fonts;

.list {
  $list: &;

  @include fonts.text-list;

  &--margin {
    margin-top: spacers.getSpacer(s);
    margin-bottom: spacers.getSpacer(s);
  }

  &--bullet {
    list-style-type: disc;

    > #{$list}__item {
      > #{$list}--bullet {
        list-style-type: circle;

        > #{$list}__item {
          > #{$list}--bullet {
            // for å beholde utseende disables warning på whitespace her
            /* stylelint-disable-next-line no-irregular-whitespace */
            list-style-type: '⬥ ';

            > #{$list}__item {
              &::marker {
                font-size: 1rem;
              }

              > #{$list}--bullet {
                // for å beholde utseende disables warning på whitespace her
                /* stylelint-disable-next-line no-irregular-whitespace */
                list-style-type: '– ';
              }
            }
          }
        }
      }
    }
  }

  &--dashed {
    // for å beholde utseende disables warning på whitespace her
    /* stylelint-disable-next-line no-irregular-whitespace */
    list-style-type: '– ';
  }

  &--numbered {
    list-style-type: decimal;
  }

  &--alphabetical {
    list-style-type: lower-alpha;
  }

  &__item {
    > #{$list} {
      margin-top: spacers.getSpacer(2xs);
    }
  }

  &__item:not(:last-child) {
    margin-bottom: spacers.getSpacer(2xs);
  }
}