/* ============================================================
   FULLCALENDAR — BASE
   ============================================================ */
.fc {
  margin: 0;
  display: flex;
  flex-direction: column;
}

/* Grid renders last, below the single toolbar (order:0 on .fc-footer-toolbar
   below) -- headerToolbar is disabled entirely, everything lives in one bar. */
.fc-view-harness {
  order: 2;
}

/* Today cell highlight */
.fc-day-today {
  background: #f9eae5 !important;
  border: 2px solid;
  position: relative;
}


/* ============================================================
   FULLCALENDAR — TOOLBAR (single dark-blue bar)
   Today / prev / next / title cluster on the left; the
   Month/Week/Day view switcher sits on the right -- the
   Outlook calendar header layout. headerToolbar is disabled
   (see main.js) so this is the only toolbar FullCalendar renders.
   ============================================================ */
.fc-footer-toolbar {
  order: 0;
  background: #003c71;
  padding: 12px 20px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.fc-footer-toolbar .fc-toolbar-chunk:empty {
  display: none;
}

/* margin-left: auto (rather than justify-content: space-between on the
   container) keeps the view switcher pinned to the right edge of its own
   line even when it wraps onto a line by itself -- e.g. on mobile, or when
   the left cluster is hidden-but-still-occupying-space in list mode. */
.fc-footer-toolbar .fc-toolbar-chunk:last-child {
  margin-left: auto;
}

/* The left chunk holds today/prev/next/title as separate siblings --
   without an explicit row display they stack vertically instead of
   clustering next to each other. */
.fc-footer-toolbar .fc-toolbar-chunk {
  display: flex;
  align-items: center;
  gap: 8px;
}

.fc-footer-toolbar .fc-button-group {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}

.fc-footer-toolbar .fc-button {
  background: #e75d2a;
  color: #ffffff;
  border: none;
  border-radius: 4px;
  padding: 6px 14px;
  font-weight: 500;
  transition: background 0.2s ease;
  box-shadow: none;
  outline: none;
}

/* Hover/focus/click on a non-active button is background-color only -
   FullCalendar's own stylesheet puts a border-color on these states by
   default, so it's explicitly zeroed out here rather than left to inherit. */
.fc-footer-toolbar .fc-button:hover,
.fc-footer-toolbar .fc-button:focus,
.fc-footer-toolbar .fc-button:active {
  background: #c1441d;
  color: #ffffff;
  border: none;
  box-shadow: none;
}

.fc-footer-toolbar .fc-button:focus-visible {
  outline: none;
  box-shadow: none;
}

.fc-footer-toolbar .fc-button.fc-button-active {
  background: #e75d2a;
  box-shadow: none;
}

/* Override FullCalendar's own active/focus styles. :active/:focus is listed
   first so the .fc-button-active rule below wins the specificity tie on a
   button that is both the current view AND freshly clicked/focused -- source
   order is the tiebreaker when two !important rules match equally. */
.fc-button-primary:not(:disabled):active,
.fc-button-primary:not(:disabled):focus {
  background: #c1441d !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
}

.fc-button-primary:not(:disabled).fc-button-active {
  background: #e75d2a !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

/* Today doesn't switch views like the buttons on the right -- give it a
   neutral grey instead of the view-switcher's orange/active-ring treatment.
   Same selector weight as the overrides above, placed after them, so it
   wins the cascade in every state. */
.fc-footer-toolbar .fc-today-button,
.fc-footer-toolbar .fc-today-button:hover,
.fc-footer-toolbar .fc-today-button:focus,
.fc-footer-toolbar .fc-today-button:active {
  background: #d0d3d4 !important;
  color: #003c71 !important;
  border: none !important;
  box-shadow: none !important;
}

/* Outlook shows prev/next as plain arrow glyphs, not filled buttons -- drop
   the shared .fc-button background/border in every state (!important to
   beat the generic active/focus override above, matched in specificity and
   placed after it so source order wins the tie). */
.fc-footer-toolbar .fc-prev-button,
.fc-footer-toolbar .fc-next-button,
.fc-footer-toolbar .fc-prev-button:hover,
.fc-footer-toolbar .fc-next-button:hover,
.fc-footer-toolbar .fc-prev-button:focus,
.fc-footer-toolbar .fc-next-button:focus,
.fc-footer-toolbar .fc-prev-button:active,
.fc-footer-toolbar .fc-next-button:active {
  background: transparent !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
  font-size: 18px;
  padding: 6px 8px;
}

.fc-footer-toolbar .fc-toolbar-title {
  color: #ffffff;
  font-weight: 600;
  font-size: 22px;
  margin: 0 8px;
}


/* ============================================================
   FULLCALENDAR — GRID AND EVENT CHIPS
   ============================================================ */
.fc-col-header-cell {
  background: #d0d3d4;
  color: #003c71;
  font-weight: bold;
  padding: 8px 0;
  border: 1px solid #ffffff;
}

.fc-daygrid-day {
  background: #f2f3f4;
  border: 1px solid #ffffff;
}

.fc-daygrid-day-number {
  color: #003c71;
  font-weight: 600;
  padding-right: 6px;
  font-size: 14px;
}

/* Month view event chips: truncate to a single line with an ellipsis (like
   Outlook) instead of wrapping to 2+ lines -- with the calendar's fixed
   full-viewport row height (see base.css), a wrapped title could grow a
   chip tall enough to push the "+more" link out of the cell entirely. */
.fc-daygrid-event .fc-event-custom {
  display: flex;
  width: 100%;
}

.fc-daygrid-event .fc-event-custom span:last-child {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* "+N more" right-aligned (rather than left, immediately after the last
   event) and styled as an obvious link -- light blue, underlined -- so it
   reads as clickable the way it does in Outlook. Note: stretching
   .fc-daygrid-day-events (FullCalendar's own position:absolute, content-
   sized wrapper) to pin this to the cell's literal bottom edge was tried
   and reverted -- it fed back into FullCalendar's own dayMaxEvents fit
   calculation and made every cell collapse to "+more" with zero events
   shown. Right-alignment in its natural (post-events) position is the safe
   version of the same idea. */
.fc-daygrid-day-bottom {
  text-align: right;
}

/* Reserve room for one chip + the "+N more" line in every cell, whether
   or not the day has them. The month table's height is fixed, and the
   browser splits it between weeks in proportion to their content --
   without this, weeks with events grab a bigger share and every row
   resizes as filters add/remove events. dayMaxEvents is 1 (main.js), so
   one chip + the link is the most a cell can hold:
   - "+more" line 17px = the link's 12px font at line-height 1, plus
     FullCalendar's 2px top/bottom padding and 1px top margin
   - events area 46px = one 29px chip (incl. its 1px top margin) + 17px */
.fc .fc-daygrid-day-bottom {
  min-height: 17px;
}

.fc .fc-daygrid-day-frame .fc-daygrid-day-events {
  min-height: 46px;
}

.fc-daygrid-more-link {
  color: #003c71;
  text-decoration: underline;
  font-size: 12px;
  font-weight: 700;
}

.fc-daygrid-more-link:hover {
  color: #e75d2a;
}

/* Hide default FullCalendar dots */
.fc-daygrid-event-dot,
.fc-list-event-dot {
  display: none;
}

/* Event chip */
.fc-daygrid-event,
.fc-h-event {
  background-color: var(--fc-event-bg-color);
  border-color: var(--fc-event-border-color);
  color: var(--fc-event-text-color);
  border-radius: 4px;
}

/* Popover chips stand alone — don't show multi-day "continuation" edges */
.fc .fc-popover .fc-daygrid-event.fc-h-event {
  border-radius: 4px;
  border-width: 1px;
  margin-left: 2px;
  margin-right: 2px;
}

.fc-daygrid-event {
  padding: 4px 6px;
  font-size: 14px;
  font-weight: 500;
}

.fc-daygrid-event:hover,
.fc-timegrid-event:hover,
.fc-list-event:hover {
  filter: brightness(0.85);
  cursor: pointer;
}

.fc-event-time {
  font-weight: 700;
}

.fc-event-title-container {
  white-space: normal;
  line-height: 1.2;
}

.fc-timegrid-event {
  min-height: 35px;
}

.fc-h-event .fc-event-main {
  color: #ffffff;
}

/* Prevent long strings from overflowing list view cells */
.fc .fc-list-event-title,
.fc .fc-list-event-time {
  white-space: normal;
}


/* ============================================================
   MOBILE (max-width: 1000px)
   Cleaner toolbar; truncate event chip text on small screens.
   ============================================================ */
@media (max-width: 1000px) {
  .fc-footer-toolbar {
    padding: 8px 12px;
  }

  .fc-event-main,
  .fc-event-main-frame,
  .fc-event-title-container {
    min-width: 0;
  }

  .fc-event-title,
  .fc-event-time {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}