@import 'admin-dashboard/main_dependencies';
@import '../_stylesheets/accessibility';
@import './calendar-move-booking-dialog/calendar_move_booking_dialog';


$data-cell-dividers: $gray !default;
$bb-fc-unavailable-timeslot: $white !default;
$bb-fc-available-timeslot: $brand-primary !default;
$bb-fc-available-timeslot-opacity: .3 !default;
$bb-fc-highlight: $bb-primary !default;
$bb-external-booking: #c5892a !default;

bb-calendar {
  display: block;
  padding: 5px;
}

.bb-calendar__toolbar {
  display: block;
  margin-bottom: 50px;
}

.calendar-event {
  cursor: pointer;
}

.resource-calendar {
  .fc-toolbar.fc-header-toolbar {
    padding: 0 0 1.5em;
    margin-bottom: 0;
    h2 {
      font-size: 20px;
      line-height: 1.5;
    }
    .fc-button-group {
      margin-left: 1.3em;
    }
  }
  .fc-view-container {
    .fc-view {
      &>table {
        &>thead.fc-head {
          border-left: 1px solid $bb-border;
          border-right: 1px solid $bb-border;
        }
        &>tbody.fc-body {
          border-left: 1px solid $bb-border;
          border-right: 1px solid $bb-border;
        }
      }
    }
  }
  .fc-time-grid-event,
  .fc-timeline-event {
    .pre,
    .post {
      position: relative;

      &:before {
        display: block;
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-color: $white;
        opacity: 0.6;
      }
    }
  }
  .fc-time-grid-event {
    .pre {
      border-bottom: 1px dotted $white;
    }
    .post {
      border-top: 1px dotted $white;
      width: 100%;
      bottom: 0px;
      position: absolute;
    }
  }
  .fc-timeline-event {
    .fc-title {
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .pre,
    .post {
      height: 100%;
      bottom: 0px;
      position: absolute;
    }

    .post {
      right: 0px;
      z-index: 10;
    }
  }
  .fc-day-grid-event {
    .fc-time {
       &.fc-day {
        float:left;
        margin-right:5px;
       }
    }
  }
}

th.fc-resource-cell {
  overflow: hidden;
  text-overflow: ellipsis;
}

.fc {
  .fc-event {
    border: none;
    padding: 7px 0;
    .fc-content {
      padding: 3px;
    }
    &.fc-timeline-event {
      padding: 2px 0px;
    }

    &.status_blocked {
      background-color: $gray !important;
      .fc-content {
        background-color: $gray !important;
      }
    }
    &.status_no_show {
      background-color: $gray !important;
      .fc-content {
        background-color: $gray !important;
      }
    }
    &.status_completed {
      background-color: $brand-success !important;
      .fc-content {
        background-color: $brand-success !important;
      }
    }
    &.status_external {
      background-color: #DDD !important;
      border-color: #AAA !important;
      .fc-content {
        background-color: #DDD !important;
      }
    }
    .fc-bg {
      background: none;
    }
  }
  .fc-more-popover {
    .fc-event-container {
      max-height: 400px;
      overflow-y: auto;
    }
  }
  .fc-list-table {
    border-width: 1px;
    border-style: solid;
    border-color: #d2d6de;
    border-top: 0;

    td:not(.fc-widget-header) {
      padding: 14px;
      font-size: 16px;
    }

    .fc-widget-header {
      font-weight: normal;
      color: #697180;
      background-color: #f4f5f7;
    }
  }
  .fc-list-heading {
    h2 {
      font-size: 1.5em;
    }
    th {
      font-weight: bold;
      border-width: 1px 0 0;
      padding: 8px 14px;
      background-color: #eee;
    }
  }
  .fc-list-item {
    cursor: pointer;
    &:focus {
      @include outline;
    }
    &.status_blocked span.fc-event-dot {
      background-color: $gray !important;
    }
    &.status_no_show span.fc-event-dot {
      background-color: $gray !important;
    }
    &.status_external {
      background-color: #DDD !important;
    }
  }
}

.fc {
  .fc-button-group {
    .fc-button {
      background: $white;
      border-radius: 0;
      box-shadow: none;
      border-bottom: 1px solid #d2d6de;
      &:focus {
        @include outline;
      }

      .fc-icon {
        top: -1px;
        font-size: .8em;
        height: 12px;

        &:after {
          position: static;
        }
      }
    }
    .fc-today-button {
      padding: 0 15px;
    }
    .fc-button.fc-state-active {
      background-color: $brand-primary;
      color: $btn-primary-color;
      box-shadow: none;
      text-shadow: none;
      border-color: $brand-primary;
    }
  } // Unavailable time slot color.
  .fc-time-area {
    &.fc-widget-content {
      &.fc-unselectable {
        background-color: $bb-fc-unavailable-timeslot;
      }
    }
  } // Available time slot color.
  .fc-bgevent {
    background-color: $bb-fc-available-timeslot;
    opacity: $bb-fc-available-timeslot-opacity;
  } // Time slot highlight color (when user is selecting cells).
  .fc-highlight {
    background-color: $bb-fc-highlight;
    opacity: 0.7;
  }
  .fc-event {
    border: none;
    padding: 0px;
    &.status_blocked {
      color: #697180;
      border: 1px solid #697180;
      background-color: #fff !important;
      .fc-content {
        background-color: #fff !important;
      }
    }
    &.status_other_location {
      color: #fff !important;
      background-color: #666 !important;
    }
    &.status_no_show {
      background-color: $gray !important;
      .fc-content {
        background-color: $gray !important;
      }
    }
    &.status_external {
      background-color: $bb-external-booking !important;
      border-color: $bb-external-booking !important;
      .fc-content {
        background-color: $bb-external-booking !important;
      }
    }
    &:focus {
      @include outline;
    }
    .fc-bg {
      background: none;
    }
  }
  .fc-time-grid-event {
    border: solid 1px white !important;
  }
  .fc-bg {
    .fc-slats {
      td {
        border-color: $data-cell-dividers;
      }
    }
  }
  .fc-rows {
    td.fc-widget-content {
      border-bottom-color: $data-cell-dividers;
    }
  }
  .fc-list-item {
    &.status_blocked span.fc-event-dot {
      background-color: $gray !important;
    }
    &.status_no_show span.fc-event-dot {
      background-color: $gray !important;
    }
    &.status_external {
      background-color: #ddd !important;
    }
  }
}

.fc-unthemed {
  .fc-agendaDay-view {
    td.fc-today {
      background: $bb-fc-unavailable-timeslot;
    }
  }
}

.fc-widget-header {
  .fc-content {
    th.fc-widget-header {
      background-color: $white;
    }
    table {
      height: 40px!important;
    }
    .fc-cell-text {
      padding-left: 12px;
    }
  }
}

.fc-content {
  padding:0;
  .fc-rows {

    .fc-divider,
    .fc-widget-content {

      .fc-expander {
        float: right;
      }

    }

    .fc-divider {
      background-color: #f4f5f7;
    }

    .fc-cell-content {
      padding-top: 12px!important;
      padding-bottom: 12px !important;
    }

  }
}

.fc-event-dot.fc-event-dot--orange {
  background-color: #f3bb00;
}

.fc .uib-datepicker {
  th,
  td {
    border: 0;
  }

  .btn-info {
    border-color: #ccc;
    background-color: #ecf0f5; 
  }
}