/* Calendar viewport constraints. Scoped to avoid changing other app views. */
.calendar-grid-container, .day-hour-line, [data-calendar-item] {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}
.calendar-touch-pending { outline: 1px solid rgba(59, 130, 246, 0.35); outline-offset: -1px; }
.calendar-touch-active { outline: 2px solid #60a5fa !important; outline-offset: -2px; }
.calendar-touch-target { background: rgba(59, 130, 246, 0.3) !important; }
.calendar-touch-feedback {
    position: fixed; z-index: 100050; pointer-events: none;
    max-width: 250px; padding: 8px 12px; border-radius: 8px;
    background: #1e3a5f; border: 1px solid #60a5fa; color: white;
    font: 600 12px/1.4 sans-serif; box-shadow: 0 6px 24px #0006;
}
.main-content.calendar-layout { min-width: 0; min-height: 0; overflow: hidden; }
.calendar-layout .view-content {
    display: flex; flex-direction: column; min-height: 0; min-width: 0;
    overflow: hidden !important;
}
.calendar-layout .calendar-view {
    flex: 1; width: 100%; height: 100% !important; min-height: 0; min-width: 0;
    overflow: hidden; gap: clamp(8px, 1.5vh, 20px) !important;
}
.calendar-layout .calendar-header {
    flex: 0 0 auto; min-width: 0; padding: clamp(8px, 1.2vw, 18px);
    flex-wrap: wrap; gap: 8px;
}
.calendar-layout .calendar-title-nav { min-width: 0; flex-wrap: wrap; gap: 10px; }
.calendar-layout .calendar-current-month { min-width: 0; font-size: clamp(14px, 1.3vw, 22px); }
.calendar-layout button.view-mode-btn { border: 0; background: transparent; color: var(--text-dim); font-family: inherit; cursor: pointer; }
.calendar-layout button.view-mode-btn.active { background: var(--primary); color: white; }
.calendar-layout .calendar-main-grid {
    flex: 1; min-width: 0; min-height: 0; overflow: hidden;
    grid-template-columns: minmax(0, 1fr) minmax(0, 280px);
    grid-template-rows: minmax(0, 1fr); gap: 12px;
}
.calendar-layout .calendar-grid-container {
    min-width: 0; min-height: 0 !important; height: 100% !important;
    width: 100%; padding: clamp(4px, 0.8vw, 12px); overflow: hidden;
}
.calendar-layout .calendar-sidebar { min-height: 0; min-width: 0; overflow-y: auto; }
.calendar-layout .calendar-weekdays {
    flex: 0 0 auto; grid-template-columns: repeat(7, minmax(0, 1fr));
    padding: 6px 0; font-size: clamp(9px, 0.8vw, 12px);
}
.calendar-layout .calendar-days {
    position: relative; overflow-anchor: none; overscroll-behavior-y: contain;
    width: 100%; height: 0; min-height: 0; flex: 1 1 0;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    grid-auto-rows: var(--calendar-row-height, 1px) !important;
    align-content: start; scrollbar-width: none;
}
.calendar-layout .calendar-days::-webkit-scrollbar { display: none; }
.calendar-layout .calendar-day {
    min-width: 0; min-height: 0 !important; max-width: 100%; height: 100%;
    overflow: hidden; padding: clamp(2px, 0.4vw, 7px); gap: 2px;
}
.calendar-layout .day-number { flex: 0 0 auto; margin: 0; font-size: clamp(10px, 0.85vw, 14px); }
.calendar-layout .day-events-list { min-width: 0; min-height: 0; overflow: hidden; }
.calendar-layout .calendar-event,
.calendar-layout .day-events-list > * {
    min-width: 0; max-width: 100%; overflow: hidden; white-space: nowrap;
    text-overflow: ellipsis; flex-shrink: 0;
}
.calendar-layout .calendar-event > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.calendar-layout .calendar-week-grid,
.calendar-layout .week-grid-layout { flex: 1; min-width: 0; min-height: 0; height: 100%; }
.calendar-layout .week-hours-column { width: clamp(28px, 3vw, 46px); min-width: 0; }
.calendar-layout .week-days-scrollable {
    position: relative; flex: 1 1 0; min-width: 0; overflow-anchor: none;
    scrollbar-width: none;
}
.calendar-layout .week-days-scrollable::-webkit-scrollbar { display: none; }
.calendar-layout .week-day-col {
    flex: 0 0 calc(100% / 7); width: calc(100% / 7); min-width: 0 !important;
    max-width: calc(100% / 7); min-height: 0; overflow: hidden;
}
.calendar-layout .week-col-header,
.calendar-layout .week-header-spacer { height: 48px; flex: 0 0 48px; min-width: 0; overflow: hidden; }
.calendar-layout .untimed-day-box,
.calendar-layout .week-allday-label {
    height: 38px; flex: 0 0 38px; min-width: 0; min-height: 0;
    overflow-y: auto; overflow-x: hidden; scrollbar-width: none;
}
.calendar-layout .hourly-slots-container { min-width: 0; overflow: hidden; }
.calendar-layout .hour-cell,
.calendar-layout .week-hour-label { flex: 1 1 0; min-height: 0; padding-block: 0; overflow: hidden; }
.calendar-layout .week-col-daynum { font-size: clamp(11px, 1vw, 16px); }
@media (max-width: 1200px) {
    .calendar-layout .calendar-main-grid { grid-template-columns: minmax(0, 1fr) !important; }
    .calendar-layout .calendar-sidebar { display: none; }
}
@media (max-width: 768px) {
    .calendar-layout .view-content { padding: 6px !important; }
    .calendar-layout .calendar-header { padding: 6px; }
    .calendar-layout .calendar-header .btn { padding: 5px 7px !important; }
    .calendar-layout .calendar-event { font-size: 9px; padding: 1px 2px; }
}