@mixin schedule-inline-appointment-styles {
  background: transparent;
  border: 0;
  color: $schedule-appointment-font-color;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  padding-top: 4px;
  width: 100%;
}

@include export-module('schedule-bigger') {
  .e-bigger .e-schedule,
  .e-bigger.e-schedule {
    .e-schedule-toolbar {
      height: $schedule-tbar-bgr-size;
      min-height: $schedule-tbar-bgr-size;

      .e-tbar-btn .e-tbar-btn-text {
        font-size: $schedule-content-bgr-font-size;
      }

      .e-toolbar-item.e-date-range .e-tbar-btn-text {
        font-size: $schedule-header-bgr-font-size;
      }

      .e-icon-down-arrow {
        font-size: $schedule-tbar-down-arrow-font-size;
      }

      .e-schedule .e-toolbar .e-hor-nav {
        min-height: $schedule-tbar-bgr-items-size;
        min-width: $schedule-tbar-nav-bgr-width;
        z-index: 0;
      }

      .e-toolbar-item {

        .e-btn.e-tbar-btn .e-icons.e-btn-icon {
          font-size: $schedule-bigger-tbar-btn-font-size;
        }

        .e-tbar-btn-text {
          line-height: inherit;
        }
      }

      .e-toolbar-items {
        min-height: $schedule-tbar-bgr-items-size;

        .e-toolbar-item {
          min-height: $schedule-tbar-bgr-items-size;

          &:not(.e-separator):not(.e-spacer) {
            min-width: $schedule-tbar-bgr-item-size;
          }

          &.e-separator {
            height: $schedule-tbar-separator-bgr-height;
            margin: $schedule-tbar-separator-bgr-mrgn;
            min-height: $schedule-tbar-separator-bgr-minheight;
          }

          .e-icons {
            min-width: $schedule-tbar-btn-icon-bgr-width;
          }

          button.e-btn,
          .e-tbar-btn.e-btn.e-control {
            height: auto;
            line-height: $schedule-tbar-btn-bgr-line-height;
            margin: $schedule-tbar-btn-bgr-mrgn;
            min-width: $schedule-tbar-btn-bgr-minwidth;
            padding: $schedule-tbar-btn-bgr-padding;

            &.e-tbtn-txt {
              .e-icons.e-icon-right {
                padding: $schedule-tbar-btn-icn-right-bgr-padding;
                font-size: $schedule-bigger-tbar-btn-font-size;
              }
            }

            .e-btn-icon {
              padding-top: $schedule-tbar-btn-icn-right-bgr-padding-top;
            }
          }

          .e-tbar-btn .e-tbar-btn-text {
            font-size: $schedule-bgr-tbar-btn-text-font-size;
          }
        }
      }
    }

    .e-more-popup-wrapper {
      .e-header-day {
        font-size: $schedule-header-day-bgr-font-size;
      }
    }

    .e-vertical-view {
      .e-header-cells {
        .e-header-day {
          font-size: $schedule-header-day-bgr-font-size;
        }

        .e-header-date {
          font-size: $schedule-header-date-bgr-font-size;
        }
      }

      .e-resource-cells {
        font-size: $schedule-header-day-bgr-font-size;
      }

      .e-time-cells-wrap table td {
        font-size: $schedule-time-scale-bgr-font-size;
      }

      .e-clone-time-indicator,
      .e-current-time {
        font-size: $schedule-current-time-bgr-font-size;
      }
    }

    &.e-device {
      .e-vertical-view {
        .e-time-cells-wrap table td {
          font-size: $schedule-time-scale-device-font-size;
        }

        .e-clone-time-indicator,
        .e-current-time {
          font-size: $schedule-current-time-bgr-device-font-size;
        }
      }
    }

    .e-month-view {
      .e-header-cells {
        height: $schedule-month-header-cells-bgr-height;
      }

      .e-resource-cells,
      .e-date-header-wrap table td {
        font-size: $schedule-date-month-header-wrap-bgr-font-size;
      }

      .e-content-wrap {
        font-size: $schedule-date-month-header-wrap-bgr-font-size;
      }

      .e-m-date {
        font-size: $schedule-header-date-bgr-font-size;
      }

      .e-resource-name,
      .e-m-day {
        font-size: $schedule-header-day-bgr-font-size;
      }
    }

    .e-year-view .e-calendar-wrapper .e-month-calendar.e-calendar {
      min-width: 306px;
    }
  }

  /*! schedule event tooltip */
  
  .e-bigger .e-schedule-event-tooltip,
  .e-schedule-event-tooltip.e-bigger {
    .e-subject {
      font-size: 14px;
      font-weight: 500;
    }
  }

  .e-bigger .e-dialog.e-quick-dialog.e-following-events-dialog {
    width: 502px;
  }

  .e-bigger .e-dialog.e-quick-dialog {
    min-width: 370px;
  }

  .e-bigger {
    .e-ddl.e-popup .e-resource-template {
      padding: 0 15px;

      .e-resource-color {
        height: $schedule-bigger-resource-color-size;
        margin-top: $schedule-bigger-resource-color-margin-top;
        width: $schedule-bigger-resource-color-size;
      }
    }

    .e-schedule-dialog {
      .e-disable {
        display: none;
      }

      .e-dlg-header-content {
        padding-bottom: 8px;
      }

      .e-dlg-content {
        padding-bottom: 12px;
        position: relative;
      }

      .e-event-cancel,
      .e-event-delete {
        border: $schedule-popup-btn-border;
        box-shadow: none;
      }

      .e-footer-content .e-btn.e-event-delete {
        float: left;
        margin-left: 0;
      }

      .e-subject-container,
      .e-start-container,
      .e-start-time-zone-container,
      .e-description-label {
        padding-right: 12px;
      }

      .e-location-container,
      .e-end-container,
      .e-end-time-zone-container {
        padding-left: 12px;
      }

      .e-all-day-container {
        padding-right: 16px;
      }

      .e-time-zone-row {
        display: none;

        &.e-enable {
          display: flex;
          height: $schedule-timezone-enable-bgr-height;
        }
      }

      .e-title-location-row,
      .e-start-end-row,
      .e-start-input-container,
      .e-end-input-container,
      .e-time-zone-row {
        display: flex;
        padding-bottom: $schedule-bigger-dialog-row-container-padding-bottom;
        width: 100%;
      }

      .e-resources {
        padding-bottom: 12px;
        width: 100%;
      }

      .e-all-day-time-zone-row {
        display: flex;
        padding-bottom: 20px;
        padding-top: 0;
        width: 100%;
      }

      .e-subject-container,
      .e-location-container,
      .e-start-container,
      .e-end-container,
      .e-start-time-zone-container,
      .e-end-time-zone-container {
        width: 50%;
      }

      .e-location-container,
      .e-end-container,
      .e-end-time-zone-container,
      .e-start-container,
      .e-start-time-zone-container,
      .e-subject-container,
      .e-description-row,
      .e-repeat-container {
        padding-top: 0;
      }

      .e-all-day-time-zone-row {
        padding-bottom: 16px;
        padding-top: $schedule-bigger-dialog-all-day-row-padding-top;
      }

      .e-description,
      .e-float-input .e-description {
        height: 50px;
        resize: vertical;
      }

      .e-time-zone-row,
      .e-repeat-container,
      .e-input-group .e-input-group-icon.e-icon-disable {
        display: none;
      }

      &.e-rtl {
        .e-all-day-container {
          margin-left: 20px;
          margin-right: 0;
        }

        .e-subject-container,
        .e-start-container,
        .e-start-time-zone-container,
        .e-description-label {
          padding-left: 12px;
          padding-right: 0;
        }

        .e-location-container,
        .e-end-container,
        .e-end-time-zone-container {
          padding-left: 0;
          padding-right: 12px;
        }

        .e-event-delete {
          float: right;
        }
      }
    }
  }

  /*! schedule quick popup */
  
  .e-bigger .e-quick-popup-wrapper {
    .e-cell-popup .e-popup-content .e-popup-table .e-subject {
      font-size: 24px;
    }

    .e-cell-popup .e-popup-content {
      padding: $schedule-bgr-cell-popup-content-padding;
    }

    .e-popup-footer {
      padding: $schedule-bgr-cell-popup-footer-padding;
    }

    .e-cell-popup .e-date-time-icon,
    .e-event-popup .e-date-time-icon {
      padding-right: $schedule-bgr-date-time-icon-padding-right;
    }

    .e-cell-popup .e-popup-header .e-header-icon-wrapper .e-close .e-close-icon {
      font-size: 16px;
    }

    &.e-rtl {
      .e-cell-popup .e-date-time-icon {
        padding-right: 0;
      }

      .e-event-popup .e-date-time-icon {
        padding-right: $schedule-bgr-rtl-event-popup-date-time-icon-padding-right;
      }
    }

    .e-cell-popup .e-close.e-btn.e-small.e-round {
      height: $schedule-bgr-event-popup-header-icon-size;
      width: $schedule-bgr-event-popup-header-icon-size;
    }

    .e-event-popup {
      .e-edit.e-btn.e-small.e-round,
      .e-delete.e-btn.e-small.e-round,
      .e-close.e-btn.e-small.e-round {
        height: $schedule-bgr-event-popup-header-icon-size;
        width: $schedule-bgr-event-popup-header-icon-size;
      }
    }

    .e-event-popup .e-popup-header .e-header-icon-wrapper {
      .e-close-icon,
      .e-edit-icon,
      .e-delete-icon {
        font-size: $schedule-bigger-tbar-btn-font-size;
      }
    }

    &.e-device {
      .e-event-popup .e-popup-header .e-header-icon-wrapper {
        .e-close-icon,
        .e-edit-icon,
        .e-delete-icon {
          font-size: 14px;
        }
      }

      .e-multiple-event-popup .e-popup-header {
        .e-edit.e-btn.e-small.e-round,
        .e-delete.e-btn.e-small.e-round,
        .e-close.e-btn.e-small.e-round {
          height: $schedule-bgr-multiple-event-popup-icon-height;
        }

        .e-subject {
          padding: $schedule-bgr-multiple-event-popup-subject-padding;
        }
      }
    }
  }

  .e-bigger .e-agenda-view {
    .e-appointment {
      padding: $schedule-agenda-big-appointment-padding;
    }
    .e-subject,
    .e-inline-subject  {
      font-size: 16px;
    }

    .e-date-time {
      font-size: 14px;
    }

    .e-day-date-header {
      .e-m-date {
        font-size: 20px;
      }

      .e-m-day {
        font-size: 14px;
      }
    }
  }

  .e-bigger .e-timeline-view {
    .e-resource-text {
      font-size: 14px;
      padding-left: 12px;
    }

    .e-navigate {
      font-size: $schedule-date-header-wrap-bgr-font-size;
      padding: 8px 0 8px 8px;
    }

    .e-date-header-wrap table tbody td > span {
      font-size: $schedule-date-header-wrap-bgr-font-size;
      padding: 8px 0 8px 8px;
    }
  }

  .e-bigger .e-schedule .e-month-view .e-current-date .e-date-header {
    width: 26px;
  }
}

.e-bigger .e-schedule-dialog.e-device {
  .e-dlg-header,
  .e-dlg-header * {
    width: 100%;
  }

  .e-dlg-header-content {
    background: $schedule-content-bg-color;
    box-shadow: $schedule-tbar-box-shadow;
    @if ($theme-name == 'fluent2') {
      box-shadow: none;
    }
    margin-bottom: $schedule-tbar-box-shadow-bottom-margin;
  }

  .e-title-location-row,
  .e-start-end-row,
  .e-time-zone-row,
  .e-start-input-container,
  .e-end-input-container {
    display: inline;
  }

  .e-time-zone-row {
    &.e-enable {
      display: inline;
    }
  }

  .e-subject-container,
  .e-location-container,
  .e-start-container,
  .e-end-container,
  .e-start-time-zone-container,
  .e-end-time-zone-container {
    padding-left: 0;
    width: 100%;
  }

  .e-subject-container,
  .e-start-container,
  .e-start-time-zone-container,
  .e-description-label {
    padding-right: 0;
  }

  .e-location-container,
  .e-end-container,
  .e-end-time-zone-container,
  .e-start-container,
  .e-start-time-zone-container,
  .e-subject-container,
  .e-description-row,
  .e-repeat-container {
    padding-top: 20px;
  }

  .e-all-day-time-zone-row {
    padding-top: $schedule-device-dialog-all-day-row-padding-top;
  }

  .e-resources {
    padding-bottom: 0;
    padding-top: 20px;
  }

  .e-description,
  .e-float-input .e-description {
    height: 60px;
    resize: vertical;
  }

  .e-all-day-time-zone-row {
    margin-top: 0;
    padding-bottom: 0;
  }

  .e-repeat-parent-row {
    padding-top: 8px;
  }

  .e-all-day-container {
    margin-right: 20px;
  }

  .e-title-header {
    display: flex;
    width: 100%;
  }

  .e-save-icon,
  .e-back-icon,
  .e-forward-icon {
    cursor: pointer;
    line-height: normal;
  }

  .e-title-text {
    text-align: center;
  }

  .e-save-icon,
  .e-back-icon,
  .e-delete-icon {
    width: 2.5em;
  }

  .e-save-icon,
  .e-delete-icon {
    text-align: right;
  }

  .e-time-zone-row,
  .e-input-group .e-input-group-icon.e-icon-disable {
    display: none;
  }

  .e-repeat-container {
    display: block;
    padding-right: 35px;
    padding-left: 0;
  }

  .e-icon-down-arrow {
    font-size: $schedule-tbar-down-arrow-font-size;
  }

  &.e-rtl {
    .e-save-icon {
      text-align: left;
    }

    .e-all-day-container {
      margin-left: 20px;
      margin-right: 0;
    }

    .e-subject-container,
    .e-start-container,
    .e-start-time-zone-container,
    .e-description-label {
      padding-left: 0;
    }

    .e-location-container,
    .e-end-container,
    .e-end-time-zone-container,
    .e-all-day-container {
      padding-right: 0;
    }

    .e-repeat-container {
      padding-left: 35px;
      padding-right: 0;
    }
  }

  .e-recurrence-container {
    position: relative;

    &.e-hide {
      display: none;
    }

    .e-recurrence-edit-button {
      border: 0;
      box-shadow: none;
      margin: -3px 5px;
      position: absolute;

      .e-recurrence-edit.e-icons {
        font-size: 12px;
        position: relative;
        top: 1px;
      }
    }
  }
}

.e-bigger .e-more-popup-wrapper {
  background: $schedule-popup-bg-color;
  border: 1px solid $schedule-popup-border-color;
  border-radius: $schedule-more-popup-wrapper-border-radius;
  box-shadow: $schedule-more-indicator-shadow-color-more-popup;
  opacity: 1;
  padding: $schedule-more-popup-padding;
  width: 225px;

  .e-more-appointment-wrapper {
    margin: 0 4px;
  }

  .e-more-event-popup {
    height: 100%;
    position: relative;
    width: 100%;
  }

  .e-more-event-header {
    height: 35px;
    margin: 0 8px 4px 14px;
  }

  .e-more-event-content {
    color: $schedule-primary-content-font-color;
    height: calc(100% - 35px);
    max-height: 150px;
    overflow-y: auto;
    padding: 10px 10px 0;

    .e-appointment-border {
      border: 0;
      box-shadow: $schedule-event-box-shadow-1, $schedule-event-box-shadow-2, $schedule-event-box-shadow-3;
    }
  }

  .e-more-event-date-header {
    height: 100%;
    width: calc(100% - 25px);

    .e-current-date {
      color: $schedule-active-font-color;
    }
  }

  .e-header-day {
    color: $schedule-primary-content-font-color;
    font-size: $schedule-date-header-wrap-nrml-font-size;
    line-height: 1;
    padding-bottom: $schedule-more-appointment-margin-bottom;
  }

  .e-header-date {
    color: $schedule-primary-content-font-color;
    font-size: $schedule-header-date-nrml-font-size;
    line-height: 1;
    max-width: 15%;

    &:hover {
      cursor: pointer;
      text-decoration: underline;
    }

    &:focus {
      text-decoration: underline;
    }
  }

  .e-more-event-close {
    background: transparent;
    border: 0;
    box-shadow: none;
    color: $schedule-popup-icon-color;
    cursor: pointer;
    height: 25px;
    padding: $schedule-bgr-more-event-close-icon-padding;
    position: absolute;
    right: 6px;
    width: 25px;

    .e-close-icon {
      font-size: $schedule-more-event-close-icon-font-size;
    }

    .e-btn-icon {
      margin-top: $schedule-more-popup-close-margin-top;
    }

    &:focus,
    &:hover {
      background: $schedule-popup-header-icon-focus-bg-color;
      border-radius: 50%;
      color: $schedule-popup-header-icon-focus-color;
    }
  }

  .e-appointment {
    background: $schedule-appointment-bg-color;
    border-radius: $schedule-appointment-border-radius;
    color: $schedule-appointment-font-color;
    display: flex;
    height: $schedule-month-appointment-height;
    line-height: $schedule-appointment-text-line-height;
    margin-bottom: $schedule-more-appointment-margin-bottom;
    padding: 2px 0;
    width: 100%;

    .e-subject {
      color: $schedule-appointment-font-color;
      flex: auto;
      font-size: 13px;
      font-weight: 500;
      overflow: hidden;
      padding: 0 2px;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .e-subject.e-disable {
      display: none;
    }

    .e-inline-subject {
      @include schedule-inline-appointment-styles;
    }

    .e-recurrence-icon,
    .e-recurrence-edit-icon {
      line-height: $schedule-month-appointment-height;
      padding: 0 2px;
    }

    &.e-appointment-border,
    &:focus {
      border: 0;
      box-shadow: $schedule-event-box-shadow-1, $schedule-event-box-shadow-2, $schedule-event-box-shadow-3;
    }
  }

  &.e-device {
    bottom: 0;
    height: 100%;
    left: 0;
    margin: 0;
    max-width: 100%;
    overflow: hidden;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1002;

    .e-more-event-content {
      max-height: unset;
    }
  }

  &.e-rtl {
    .e-header-date {
      padding-right: 10px;
    }

    .e-header-day {
      padding-right: 10px;
    }

    .e-more-event-close {
      left: 6px;
      right: auto;
    }
  }
}
