.a-meta
  +text-block(1em 1.4, flex)
  color: var(--muted-text)
  align-items: center
  flex-wrap: wrap
  +media-breakpoint-up(md)
    font-size: .75rem
  +media-breakpoint-down(sm)
    font-size: .75rem
  .is-important,
  &.is-important
    color: var(--danger)
    font-weight: 600
  .is-muted
    color: var(--muted-text)
  .is-emphasized
    color: var(--default-text)
    font-weight: 600
  +media-breakpoint-up(md)
    .a-meta + &
      margin-left: .25em
      &::before
        content: "（"
      &::after
        content: "）"

a.a-meta
  +hover-link
  color: var(--muted-text)
  transition: all .2s ease-out
  &:hover
    color: var(--main-text)
  &.is-disabled
    pointer-events: none

.a-meta__label
  &::after
    content: ":"
    display: inline-flex
    margin-inline: .125em

.a-meta__icon
  margin-right: .125em

.a-meta__value
  display: flex
  align-items: center
  .a-user-icon + &
    margin-left: .25rem
  &.is-danger
    font-weight: 600
    color: var(--danger)

.a-meta__list
  display: inline-flex

.a-meta__list-item
  &:not(:first-child)
    &::before
      content: '、'
