table.object-list

  & > tbody > tr > td

    & > div
      min-width: 100%
      max-width: 14rem
      text-overflow: ellipsis
      white-space: nowrap
      overflow: hidden

      & + div
        font-size: .9rem
        white-space: normal
        margin-top: .2rem
        opacity: .3

      & + div[data-id="extended_description"]
        opacity: 1

      &[data-role="hover_tip_container"]
        overflow: visible

      &[data-id="name"],
      &[data-id="extended_description"]
        display: inline-block
        max-width: 20rem
        white-space: normal
        vertical-align: bottom

      &[data-id="extended_description"]

        & > span
          opacity: .35

        & > span.badge
          opacity: 1

        & > span:first-child
          margin-left: 0

        [data-id="description"]:after
          content: "\a0"

  tbody[data-removed="true"]
    color: #c03626

    [data-id="extended_description"]
      color: #000

  &[data-subcontainer="true"]

    & > thead > tr > td
      border-bottom: 1px solid rgba(#000, .03)

    & > tbody[data-pinned="true"] > tr > td,
    & > tbody[data-pinned="true"]:hover > tr > td
      background: #f8f8f8
      border-bottom: 1px solid rgba(#000, .1)

  [data-id="contents"]
    font-size: .9rem
    background: url("/res/common/people.svg") 0 50%/1em no-repeat
    padding-left: 1.4em
    margin-right: .2em

  [data-id]:not(.badge) + [data-id="description"]:not(:empty):before
    content: "•"
    margin-right: .5em

  [data-id="hidden"]
    display: inline-block
    width: 1rem
    height: .6rem
    background: url("/res/common/crossed_eye.svg") 50% 50%/cover no-repeat
    text-indent: -1000rem
    margin: 0 .15em
    overflow: hidden

  .badge
    display: inline-block
    font-size: .65rem
    text-transform: uppercase
    color: #666
    background: #eee
    padding: .15rem .35rem .1rem
    margin-right: .5em
    transform: translateY(-.05rem)

    &[data-id="removed"]
      color: #fff
      background: #ef7c6e

    &[data-id="blocked"]
      color: #000
      background: #ffbc00

  [data-id="avatar"]
    width: 36px
    font-size: 0
    padding: .55rem .5rem

    img
      height: 36px
      border-radius: 50%

  [data-id="navigation"]
    text-align: center

    .parent
      display: inline-block
      width: 1em
      height: .8em
      text-indent: -1000em
      background: url("/res/common/double_upward_arrow.svg") 50% 50%/cover no-repeat
      overflow: hidden
      opacity: .65
