
bb-events-facet {


  .events-facet {
    @include facet-spacing;
    @include column-flex-container;

    &__header {
      @include facet-header;
    }

    &__container {
      @media (min-width: $screen-sm-min) {
        min-width: 368px;
        max-width: 919px;
      }

      overflow-y: auto;
      display: flex;

      padding-bottom: 20px;
    }


    &__date_picker {
      margin:5px;
    }
    &__event_picker {
      margin:5px;
      flex-grow:1;
      h5 {
        font-weight: bold;
      }
    }

    &__list li{
      background-color:#F2F3F6;
      margin:5px;
      padding:5px;
      display: flex;
    }
    &__icon {
      width: 40px;
      height: 40px;
    }
    &__circle {
      margin:5px 2px;
      background-color: #1768B1;
      width: 30px;
      height: 30px;
      border-radius: 50%;
      display: block;
      color:#FFF;
      &_full {
        background-color: #5D6676;
      }
      i {
        font-weight:normal;
        font-size:1.5em;
        line-height: 30px;
        width:100%;
        text-align: center;
      }
    }
    &__description {
      flex-grow:1;
      &_title {
        font-weight: bold;
      }
    }
    &__links {
      margin: 6px;
      a {
        cursor: pointer;
        padding: 0px 6px;
      }
    }


  }


  .uib-daypicker {
    .btn-default {
      border-color: transparent;
      color: #000;
      font-weight: normal;
      &:hover {
        border-color: transparent;
      }
    }
    th {
      color: #ADB3C1;
      font-weight: normal;
    }
    &:focus {outline:0 !important;}

    .uib-day {
      padding:2px;
      button {
        border-color: transparent;
        border-radius: 50%;
        .text-info {
          font-weight: bold;
        }
        &.active {
          border-color:$bb-secondary;
          color:$bb-secondary;
          span, .text-info {
            color:$bb-secondary;
          }
          background-color: #FFF;
        }
      }
      &.highlight-valid-date {
        button {
          font-weight:bold;
          background-color:#E9F2FB;
          color:#000;
          .text-muted {
            color:#CCC;
          }
          .text-info {
            color:#EEE;
            font-weight: bold;
          }
          &.active {
            background-color:#FFF;
            border-color:$bb-secondary;
            color:$bb-secondary;
          }
        }
      }
    }
  }
}
