.a-image-check
  height: 100%

.a-image-check__inner
  background-color: var(--input-background)
  height: 100%
  min-height: 2.5rem
  +text-block(.8125rem 1.4, flex center)
  gap: .5rem
  flex-direction: column
  align-items: center
  justify-content: center
  border: solid 1px var(--input-border)
  cursor: pointer
  border-radius: .25rem
  transition: all .2s ease-in
  position: relative
  overflow: hidden
  &:hover
    background-color: var(--input-hover-background)
    border-color: var(--input-hover-border)
  input:checked + &
    background-color: var(--input-selected-background)
    border-color: var(--input-selected-border)
    color: var(--input-selected-text)
    img
      opacity: .7
    .a-image-check__start
      background-color: var(--primary)
  .a-image-check &::before
    display: block
    +position(absolute, left .75rem, top .75rem, 2)

  // radio
  .a-image-check.is-radio &::before
    content: ''
    +size(.875rem)
    border: solid 1px var(--input-border)
    border-radius: 50%
    background-color: var(--base)
  .a-image-check.is-radio input:checked + &::before
    border-color: var(--primary)
    background-color: var(--primary)
    box-shadow: inset 0 0 0 2px var(--base)
  // checkbox
  .a-image-check.is-checkbox &::before
    content: ''
    +size(.875rem)
    border: solid 1px var(--input-border)
    border-radius: 3px
    background-color: var(--base)
  .a-image-check.is-checkbox input:checked + &::before
    border-color: var(--primary)
    background-color: var(--primary)
    +fa(fas "\f00c")
    color: var(--reversal-text)

.a-image-check__start
  width: 100%

.a-image-check__end
  padding-bottom: .5rem
  width: 100%

.a-image-check__name
  +text-block(.875rem 1.4, block center)

.a-image-check__image
  +size(2rem)
  .a-image-check__inner.has-icon &
    +size(1.75rem)
    margin-right: .5rem

.a-image-check__upload-image
  display: block
  width: 100%
  background-color: var(--background-shade)
  aspect-ratio: 120 / 63
  position: relative
  i
    +position(absolute, left 50%, top 50%)
    transform: translate(-50%, -50%)
    font-size: 3rem
