/* Standalone calendar: keep the detail pane usable on short landscape screens. */
@media (orientation: landscape) and (max-height: 700px) {
  body.shared-calendar-side-panel .shared-event-dialog[open] {
    box-sizing: border-box;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-bottom: max(24px, env(safe-area-inset-bottom));
  }

  body.shared-calendar-header-hidden.shared-calendar-side-panel .shared-event-dialog[open] {
    height: auto !important;
  }

  body.shared-calendar-side-panel .shared-event-dialog .reservation-details {
    padding-bottom: max(42px, calc(24px + env(safe-area-inset-bottom)));
  }
}

/* Month cards use white event text regardless of the source calendar colour. */
#shared-fullcalendar .fc-daygrid-event.fc-event,
#shared-fullcalendar .fc-daygrid-event.fc-event .fc-event-main,
#shared-fullcalendar .fc-daygrid-event.fc-event .fc-event-main * {
  color: #fff !important;
}

/* A month must always start at Monday and fit all seven days in the viewport. */
.calendar-app,
.calendar-app-main,
.calendar-app #shared-fullcalendar {
  box-sizing: border-box;
  max-width: 100%;
}

.calendar-app-main,
.calendar-app #shared-fullcalendar {
  overflow-x: clip;
}

.calendar-app #shared-fullcalendar .fc-scrollgrid,
.calendar-app #shared-fullcalendar .fc-daygrid-body,
.calendar-app #shared-fullcalendar .fc-daygrid-body table,
.calendar-app #shared-fullcalendar .fc-scrollgrid-sync-table {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  table-layout: fixed !important;
}

.calendar-mini-nav {
  box-sizing: border-box;
  width: 248px;
  flex: 0 0 248px;
  padding: 12px;
  border: 1px solid #e1e5eb;
  border-radius: 14px;
  background: #fff;
  color: #202124;
}

.calendar-mini-heading { display: grid; grid-template-columns: 38px 1fr 38px; align-items: center; margin-bottom: 8px; }
.calendar-mini-nav h2 { margin: 0; font-size: 1rem; text-align: center; }
.calendar-mini-heading button { width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #344563; font: inherit; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.calendar-mini-heading button:active { background: #e8f0fe; }
.calendar-mini-weekdays,
.calendar-mini-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; }
.calendar-mini-weekdays { margin-bottom: 4px; color: #5f6368; font-size: .7rem; text-align: center; }
.calendar-mini-day { min-width: 0; aspect-ratio: 1; padding: 0; border: 0; border-radius: 50%; color: #202124; background: transparent; font: inherit; font-size: .78rem; cursor: pointer; }
.calendar-mini-day.is-outside { color: #b7bdc7; }
.calendar-mini-weekdays span:last-child,
.calendar-mini-day.is-sunday,
.calendar-mini-day.is-holiday { color: #c5221f; }
.calendar-mini-day.is-outside:is(.is-sunday, .is-holiday) { color: #c58a8a; }
.calendar-mini-day.is-today { outline: 1px solid #1a73e8; }
.calendar-mini-day.is-selected { color: #fff; background: #1a73e8; }
.calendar-mini-day.is-selected:is(.is-sunday, .is-holiday) { color: #fff; }
.calendar-mini-day:active { background: #dce9ff; }
.calendar-app .calendar-mini-trigger { position: relative; cursor: pointer; user-select: none; }
.calendar-app .calendar-mini-trigger::after { margin-left: 7px; color: #5f6368; font-size: .72em; vertical-align: middle; content: "▾"; }

@media (orientation: landscape) {
  .calendar-app.calendar-mini-open .calendar-app-main { display: flex; align-items: flex-start; gap: 8px; }
  .calendar-app.calendar-mini-open .calendar-app-main #shared-fullcalendar { width: auto !important; flex: 1 1 0; min-width: 0; }
  .calendar-app.shared-calendar-side-panel .calendar-mini-nav { display: none !important; }
}

@media (orientation: portrait) {
  .calendar-app-main { display: block; }
  .calendar-mini-nav { display: none !important; width: min(360px, calc(100% - 16px)); margin: 0 auto 8px; padding: 10px 14px 12px; box-shadow: 0 8px 24px #17233b2e; }
  .calendar-app.calendar-mini-open .calendar-mini-nav:not([hidden]) { display: block !important; }
}

/* Never let month entries escape into the next day on narrow iPhone screens. */
.calendar-app #shared-fullcalendar .fc-daygrid-event,
.calendar-app #shared-fullcalendar .fc-daygrid-event .fc-event-main,
.calendar-app #shared-fullcalendar .fc-daygrid-event .fc-v2-event-content,
.calendar-app #shared-fullcalendar .fc-daygrid-event .fc-v2-event-primary,
.calendar-app #shared-fullcalendar .fc-daygrid-event .fc-v2-event-meta {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
}

.calendar-app #shared-fullcalendar .fc-daygrid-event {
  overflow: hidden;
}

.calendar-app .calendar-app-actions .calendar-editor-login {
  padding: 6px 9px;
  border-radius: 6px;
  color: #1a73e8;
  font: inherit;
  font-weight: 600;
  text-decoration: none;
}

/* iPhone landscape is wide in CSS pixels but very short. Treat it as compact mobile. */
@media (orientation: landscape) and (max-height: 500px) {
  .calendar-app .calendar-app-header { min-height: 42px; padding: 4px 8px; }
  .calendar-app .calendar-app-header h1 { font-size: 14px; }
  .calendar-app .calendar-app-actions { gap: 3px; }
  .calendar-app .calendar-app-actions > span { display: none; }
  .calendar-app .calendar-app-actions button { padding: 4px 6px; font-size: 11px; }
  .calendar-app .calendar-app-actions .calendar-editor-login { padding: 4px 6px; font-size: 11px; }
  .calendar-app #shared-fullcalendar .fc-daygrid-day-number,
  .calendar-app #shared-fullcalendar .fc-col-header-cell-cushion { padding: 2px; font-size: .68rem; }
  .calendar-app #shared-fullcalendar .fc-daygrid-event { margin: 1px; padding: 1px 2px; font-size: 9px; line-height: 1.15; }
  .calendar-app #shared-fullcalendar .fc-daygrid-event .fc-v2-event-meta { display: none; }
  .calendar-app #shared-fullcalendar .fc-daygrid-more-link { font-size: 9px; }
}

/* FullCalendar 7 uses generated flex rows, so the all-day row is marked by JS. */
.calendar-app #shared-fullcalendar .gh-calendar-all-day-row {
  min-height: 0 !important;
  height: auto !important;
}

.calendar-app #shared-fullcalendar.gh-calendar-all-day-expanded .gh-calendar-all-day-row {
  height: auto !important;
}

.calendar-app #shared-fullcalendar .gh-calendar-all-day-toggle {
  cursor: pointer;
  user-select: none;
}

.calendar-app #shared-fullcalendar .gh-calendar-all-day-toggle:focus-visible {
  outline: 2px solid #2563d9;
  outline-offset: -2px;
}

/* Availability is an at-a-glance strip, distinct from staff all-day events. */
.calendar-app #shared-fullcalendar .fc-broker-availability {
  min-height: 30px !important;
  height: 30px !important;
  margin: 1px 0 !important;
  padding: 3px 5px !important;
  font-size: 12px !important;
  line-height: 22px !important;
}

.calendar-app #shared-fullcalendar .fc-broker-availability .fc-event-main,
.calendar-app #shared-fullcalendar .fc-broker-availability .fc-v2-event-content,
.calendar-app #shared-fullcalendar .fc-broker-availability .fc-v2-event-primary {
  min-height: 0 !important;
  line-height: 22px !important;
  white-space: nowrap;
}

/* Staff all-day entries use the same single-line strip as area availability. */
.calendar-app #shared-fullcalendar .fc-timegrid-allday .fc-event {
  min-height: 30px !important;
  height: 30px !important;
  margin: 1px 0 !important;
  padding: 3px 5px !important;
}

.calendar-app #shared-fullcalendar .fc-timegrid-allday .fc-v2-event-content,
.calendar-app #shared-fullcalendar .fc-timegrid-allday .fc-v2-event-primary {
  min-height: 0 !important;
  line-height: 22px !important;
  white-space: nowrap;
}

.calendar-app #shared-fullcalendar .fc-timegrid-allday .fc-v2-event-meta {
  display: none !important;
}

.calendar-app #shared-fullcalendar .fc-google-calendar-event:not(.fc-broker-availability),
.calendar-app #shared-fullcalendar .fc-v2-unavailability:not(.fc-broker-availability) {
  min-height: 30px !important;
}

.calendar-app #shared-fullcalendar .gh-calendar-slot-header,
.calendar-app #shared-fullcalendar .gh-calendar-slot-header-inner {
  min-height: 0 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 8px !important;
}

.calendar-app #shared-fullcalendar .gh-calendar-slot-header-inner {
  box-sizing: border-box;
  justify-content: flex-end;
  min-width: 52px;
  padding-right: 6px;
}

.calendar-app #shared-fullcalendar .fc-timegrid-axis-cushion {
  box-sizing: border-box;
  min-width: 52px;
}

@media (max-width: 700px) {
  .calendar-app #shared-fullcalendar .gh-calendar-all-day-row {
    min-height: 0 !important;
    height: auto !important;
  }
}