@import '../../main_dependencies';

bb-calendar-page {

  .calendar-page__body {
    // Fixed height for week calendar.
    min-height: 277px;
  }

  bb-calendar-people, bb-calendar-resources {
    @include make-xs-column(6);

    @include make-md-column(4);
    margin-bottom: 20px;
  }

  .calendar-page__timezone {
    margin-top: 20px;
  }

  bb-time-zone-select {
    .ui-select-container {
      &:after {
        pointer-events: none;
        position: absolute;
        transform: translateY(-50%);
        top: 50%;
        right: 15px;
        color: inherit;
        font-family: "FontAwesome", sans-serif;
        content: "\f107";
      }
    }

    .caret {
      display: none;
    }

    label {
      display: none;
    }

    .ui-select-toggle {
      border-color: #e1e1e1;
      box-shadow: none;
      height: 46px;
      border-radius: 2px;
      -webkit-appearance: none;

      &:hover {
        background-color: white;
      }
    }

    .ui-select-match-text {
      // 46 is the select height, 12 is the padding => 32
      line-height: 32px;
      overflow-x: initial !important;
    }
  }

}