Mailspring/app/internal_packages/main-calendar/styles/main-calendar.less

// The ui-variables file is provided by base themes provided by N1.
@import 'ui-variables';
@import 'ui-mixins';

.fixed-popover .calendar-event-popover {
  color: fadeout(@text-color, 20%);
  background-color: @background-primary;
  display: flex;
  flex-direction: column;
  font-size: @font-size-small;
  max-height: 95vh;
  width: 300px;

  .location {
    color: @text-color-very-subtle;
    padding: @padding-base-vertical @padding-base-horizontal;
    word-wrap: break-word;
    flex-shrink: 0;
  }
  .title-wrapper {
    color: @text-color-inverse;
    display: flex;
    font-size: @font-size-larger;
    background-color: @accent-primary;
    border-top-left-radius: @border-radius-base;
    border-top-right-radius: @border-radius-base;
    padding: @padding-base-vertical @padding-base-horizontal;
    align-items: center;
    flex-shrink: 0;
    .title {
      padding-right: @padding-base-vertical;
    }
  }
  .edit-icon {
    background-color: @text-color-inverse;
    cursor: pointer;
  }

  .invitees .scroll-region-content {
    max-height: 160px;
    word-wrap: break-word;
    position: relative;
  }
  .description {
    white-space: pre-line;
    word-wrap: break-word;
  }
  .description .scroll-region-content {
    max-height: 250px;
    position: relative;
  }
  .label {
    color: @text-color-very-subtle;
  }
  .section {
    border-top: 1px solid @border-color-divider;
    padding: @padding-base-vertical @padding-base-horizontal;
  }
  .row.time {
    .time-picker {
      text-align: center;
    }
    .time-picker-wrap {
      margin-right: 5px;

      .time-options {
        z-index: 10; // So the time pickers show over
      }
    }
  }
}

.quick-event-popover {
  width: 250px;
}

.preview-notice {
  display: block;
  box-sizing: border-box;
  -webkit-print-color-adjust: exact;
  padding: 8px 12px;
  border-bottom: 1px solid rgb(235, 224, 204);
  color: rgb(169, 136, 66);
  background-color: rgb(242, 235, 222);
  white-space: nowrap;
  overflow: hidden;
}