@charset "UTF-8";
/**
 * List Component Styles
 *
 * Provides default styling for ul, ol, and dl list elements with CSS custom
 * properties for theming. Uses rem units exclusively for accessibility.
 *
 * @base-rem: 16px = 1rem
 */
ul,
ol,
dl {
  --list-margin-top: 0;
  --list-margin-bottom: 1rem;
  --list-margin-inline: 0;
  --list-padding-inline: 0.5rem;
  --list-gap: 0.5rem;
  --list-marker-color: currentColor;
  --list-marker-size: 1em;
  --list-marker-offset: 0.5rem;
  --list-font-size: 1rem;
  --list-line-height: 1.5;
  --list-font-family: inherit;
  --list-color: inherit;
  --list-item-margin-bottom: 0.5rem;
  --list-item-padding-inline: 0;
  --list-item-padding-block: 0;
  --dt-font-weight: 600;
  --dt-margin-bottom: 0.25rem;
  --dd-margin-inline-start: 2rem;
  --dd-margin-bottom: 1rem;
}

ul,
ol,
dl {
  margin-block-start: var(--list-margin-top);
  margin-block-end: var(--list-margin-bottom);
  margin-inline: var(--list-margin-inline);
  padding-inline-start: var(--list-padding-inline);
  font-size: var(--list-font-size);
  line-height: var(--list-line-height);
  font-family: var(--list-font-family);
  color: var(--list-color);
}
ul ul,
ul ol,
ul dl,
ol ul,
ol ol,
ol dl,
dl ul,
dl ol,
dl dl {
  margin-block-start: var(--list-gap);
  margin-block-end: var(--list-gap);
}

ul {
  list-style-type: disc;
}
ul::marker {
  color: var(--list-marker-color);
  font-size: var(--list-marker-size);
}
ul ul {
  list-style-type: circle;
}
ul ul ul {
  list-style-type: square;
}

ol {
  list-style-type: decimal;
}
ol::marker {
  color: var(--list-marker-color);
  font-size: var(--list-marker-size);
}
ol ol {
  list-style-type: lower-alpha;
}
ol ol ol {
  list-style-type: lower-roman;
}

li {
  margin-block-end: var(--list-item-margin-bottom);
  padding-inline: var(--list-item-padding-inline);
  padding-block: var(--list-item-padding-block);
  padding-inline-start: var(--list-marker-offset);
}
li:last-child {
  margin-block-end: 0;
}

dl {
  padding-inline-start: 0;
}

dt {
  font-weight: var(--dt-font-weight);
  margin-block-end: var(--dt-margin-bottom);
  padding-inline: var(--list-item-padding-inline);
  padding-block: var(--list-item-padding-block);
}

dd {
  margin-inline-start: var(--dd-margin-inline-start);
  margin-block-end: var(--dd-margin-bottom);
  padding-inline: var(--list-item-padding-inline);
  padding-block: var(--list-item-padding-block);
}
dd:last-child {
  margin-block-end: 0;
}

ul[data-variant=none],
ol[data-variant=none],
dl[data-variant=none] {
  list-style-type: none;
  padding-inline-start: 0;
}
ul[data-variant=none] li,
ol[data-variant=none] li,
dl[data-variant=none] li {
  padding-inline-start: 0;
}
ul[data-variant=inline],
ol[data-variant=inline],
dl[data-variant=inline] {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--list-gap);
  padding-inline-start: 0;
  list-style-type: none;
}
ul[data-variant=inline] li,
ol[data-variant=inline] li,
dl[data-variant=inline] li {
  padding-inline-start: 0;
  margin-block-end: 0;
}
ul[data-variant=custom],
ol[data-variant=custom],
dl[data-variant=custom] {
  list-style-type: none;
  padding-inline-start: 0;
}
ul[data-variant=custom] li,
ol[data-variant=custom] li,
dl[data-variant=custom] li {
  position: relative;
  padding-inline-start: calc(var(--list-marker-size) + var(--list-marker-offset));
}
ul[data-variant=custom] li::before,
ol[data-variant=custom] li::before,
dl[data-variant=custom] li::before {
  content: var(--list-marker-content, "•");
  color: var(--list-marker-color);
  font-size: var(--list-marker-size);
  position: absolute;
  left: 0;
}
ul[data-variant=compact],
ol[data-variant=compact],
dl[data-variant=compact] {
  --list-gap: 0.25rem;
  --list-item-margin-bottom: 0.25rem;
  --list-margin-bottom: 0.5rem;
}
ul[data-variant=spaced],
ol[data-variant=spaced],
dl[data-variant=spaced] {
  --list-gap: 1rem;
  --list-item-margin-bottom: 1rem;
}

li:has(a:focus-visible),
li:has(button:focus-visible) {
  outline: 0.0625rem solid transparent;
}

li:has(> a),
li:has(> button) {
  margin-block-end: 0;
}

@media print {
  ul,
  ol,
  dl {
    --list-margin-bottom: 0.5rem;
    --list-item-margin-bottom: 0.25rem;
  }
  ul,
  ol {
    list-style-position: inside;
  }
}
@media (prefers-reduced-motion: reduce) {
  ul,
  ol,
  dl,
  li,
  dt,
  dd {
    animation: none;
    transition: none;
  }
}

/*# sourceMappingURL=list.css.map */