.courses-item
  height: 100%

.courses-item__inner
  height: 100%

.courses-item__header
  padding: .75rem 1.25rem 0

.courses-item__title
  +text-block(1.125rem 1.4)

.courses-item__title-icon
  +text-block(.6875rem 1)
  color: var(--semi-muted-text)
  display: inline-flex
  white-space: nowrap
  font-weight: 400
  padding-inline: .5rem
  height: 1.125rem
  margin-right: .5rem
  border-radius: .75rem
  align-items: center
  justify-content: center
  position: relative
  +media-breakpoint-up(md)
    top: -.125rem
  +media-breakpoint-down(sm)
    top: -.1875rem
  &.is-closed
    background-color: var(--background-tint)

.courses-item__title-link
  +block-link

.courses-item__title-label
  color: var(--main-text)
  transition: all .2s ease-out
  font-weight: 700
  .is-closed &
    color: var(--muted-text)
  .is-closed .courses-item__title-link:hover &,
  .courses-item__title-link:hover &
    text-decoration: underline
    color: var(--main-text)

.courses-item__description
  padding: .5rem 1.25rem .75rem
  p
    +text-block(.8125rem 1.6)
