@import url('http://fonts.googleapis.com/css?family=Roboto')
.hidden
  visibility hidden

.popup-feed-container
  flex 1
  overflow auto
  padding 15px 25px 0

  &.fixed
    overflow hidden

    .activity-feed
      overflow auto

.feed-header
  color #FFFFFF
  font-weight bold
  margin 0 30px
  font-family 'Proxima Nova', 'Roboto', Helvetica, sans-serif

h3
  &.feed-header
    margin 0
    margin-bottom 5px
    font-size 41px

h4
  &.feed-header
    margin 0
    font-size 21px
    color #FFFFFF
    opacity 0.5
    text-transform uppercase

.popup-feed
  display flex
  align-items flex-start
  flex-direction column
  width 100%

  .activity-feed
    width 100%
    background-color #FFFFFF
    height 100%
    overflow hidden
    min-height 450px
    border-top-left-radius 15px
    border-top-right-radius 15px

  a
    color #157AFA
    text-decoration none
    cursor pointer

  .end-user-email-header
    display flex
    justify-content space-between
    align-items flex-start
    padding-bottom 14px

  .popup-button
    padding 5px 7px
    border 1px solid #B5D2E1
    border-radius 5px
    color #394F5A
    background-color white
    display inline-block
    text-decoration none
    font-weight 500
    font-size 12px
    line-height 14px

    svg
      display inline-block
      vertical-align middle
      width 12px
      height 12px

  .respond-button
    margin-top 5px
    margin-bottom 5px

  .mute-button
    margin-top -10px

.popup-feed a:hover
.popup a:active
  color #157AFA
  text-decoration underline
  cursor pointer

.popup-feed .popup-button:hover
.popup-feed .popup-button:hover
  color #394F5A
  text-decoration none

.popup-feed-activity-group
  width 100%
  display flex
  align-items flex-start
  padding 24px 16px
  border-bottom 1px solid #eeeeee
  box-sizing border-box

  &.unseen
    background-color #FFFCD9

.popup-feed-activity
  padding-bottom 6px
  font-size 14px

  time
    color #7695A5
    flex-shrink 0
    margin-left 10px
    font-size 12px

.popup-feed-activity-description
  overflow hidden
  white-space nowrap
  text-overflow ellipsis
  max-width 310px

.popup-feed-activity-group-avatar
  width 36px
  height 36px
  border-radius 50%
  border 1px solid #EEEEEE

.popup-feed-activity-group-default-avatar
  width 40px
  height 40px
  line-height 40px
  font-size 21px
  text-align center
  border-radius 50%
  background-color #F2F6F8
  border 1px solid #E1EEF4
  color #7695A5

.popup-feed-day-divider
  line-height 32px
  background-color rgba(1, 118, 255, 0.1)
  color #394F5A
  text-align center
  font-size 12px
  font-weight 500

.end-user-email
  font-size 14px
  font-weight 500

.activity-message
  color #394F5A
  font-weight 400

.activity-page-view
  color #394F5A
  font-weight 400
