/*******
 * LISTS
 *******/

dl,
ol,
ul
{
  grid-column: main-start / main-end;
  margin-block: 0;
}


ol {
  display: grid;
  grid-template-columns: min-content 1fr;
  list-style: none;
  padding-inline-start: 0;

  &:not([start]) {
    counter-reset: list-item 1;
  }

  &[start] {
    counter-reset: list-item attr(start integer);
  }

  li {
    display: grid;
    gap: 1ch;
    grid-column: 1 / -1;
    grid-template-columns: subgrid;

    /* TODO: Figure out support for <li value="42"> */

    &:not([value]) {
      counter-increment: list-item;
    }

    &::before {
      content: counter(list-item) ".";
    }
  }
}


ul {
  list-style-type: "*";
  padding-inline-start: 1ch;

  li {
    padding-inline-start: 1ch;
  }
}


li {
  &::marker, &::before {
    color: var(--text-color-secondary);
    font-family: var(--font-family-monospace);
  }
}


dl {
  dd {
    color: var(--text-color-secondary);
    font-size: var(--text-s);
    margin-inline: var(--space-l);

    &:has(+ dt) {
      margin-block-end: var(--space-paragraph);
    }
  }
}