@use "s360-scss-toolkit";

figure {
  display: var(--figure--display, block);
  height: var(--figure--height, auto);
  width: var(--figure--width, auto);

  &:has(figcaption) {
    --figure--display: table;
    --figure--width: 100%;
  }

  figcaption {
    --p--font-family: inherit;
    --p--font-size: #{ s360-scss-toolkit.font-size-ms(0) };
    --p--margin: 0.5em 0 0 0;

    display: var(--figcaption--display, table-caption);
    caption-side: var(--figcaption--caption-side, bottom);
    line-height: var(--figcaption--line-height);
  }
}
