/* ============================================================================
   CALENDAR OUTPUT STYLES - PRINT (2-UP LAYOUT)
   ============================================================================ */

@media print {
    /* ========================================================================
       PAGE SETUP
       ======================================================================== */
    @page {
        size: 8.5in 11in;
        margin: 0.25in;
    }
    
    * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    
    html, body {
        width: 8in;
        height: 10.5in;
        margin: 0;
        padding: 0;
        overflow: hidden;
    }
    
    /* ========================================================================
       HIDE UI ELEMENTS
       ======================================================================== */
    .hamburger-btn,
    .menu-panel {
        display: none !important;
    }
    
    /* ========================================================================
       BODY LAYOUT - 2 COLUMNS
       ======================================================================== */
    body {
        display: flex;
        flex-direction: row;
        gap: 0.5in;
        justify-content: center;
        align-items: flex-start;
    }
    
    /* ========================================================================
       PREVENT PAGE BREAKS
       ======================================================================== */
    .calendar-content,
    .day-section,
    .event-item {
        page-break-inside: avoid;
    }
    
    /* ========================================================================
       CALENDAR CONTENT CONTAINERS
       ======================================================================== */
    .calendar-content {
        display: flex !important;
        flex-direction: column;
        width: 3.75in !important;
        height: 10.5in !important;
        min-width: 3.75in !important;
        max-width: 3.75in !important;
        min-height: 10.5in !important;
        max-height: 10.5in !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box;
        overflow: hidden;
        flex-shrink: 0;
    }
    
    .calendar-content.empty {
        display: flex !important;
    }
    
    /* ========================================================================
       TYPOGRAPHY FOR PRINT
       Using actual point sizes appropriate for 3.75" wide column at 300 DPI
       ======================================================================== */
    :root {
        --lr-margin: 0.15in;           /* ~11pt margin */
        --header-size: 24pt;           /* Organization name */
        --header-spacing: 0pt;         /* Space below header */
        --day-size: 12pt;              /* Day names */
        --day-to-event-spacing: 1pt;   /* Day to first event */
        --event-size: 11pt;            /* Event names */
        --event-indent: 0.08in;        /* Event text indent */
        --event-to-event-spacing: 0pt; /* Between events (no detail) */
        --event-to-detail-spacing: -.5pt; /* Event to its detail */
        --event-to-day-spacing: -1pt;  /* Event (no detail) to next day */
        --detail-size: 9pt;            /* Event details */
        --detail-indent: 0.12in;       /* Detail text indent */
        --detail-line-height: 1.1;     /* Detail line spacing */
        --detail-to-event-spacing: 0pt; /* Detail to next event */
        --detail-to-day-spacing: -1pt; /* Detail to next day */
        --time-size: 10pt;             /* Time display */
        --footer-size: 11pt;           /* Footer text */
    }
    
    /* ========================================================================
       HEADER
       ======================================================================== */
    .calendar-header {
        position: static !important;
        background: transparent !important;
        padding: var(--lr-margin) var(--lr-margin) 0 var(--lr-margin) !important;
        margin: 0 !important;
        margin-bottom: var(--header-spacing) !important;
        text-align: right;
        z-index: auto !important;
        flex-shrink: 0;
    }
    
    .header-line1 {
        font-size: var(--header-size) !important;
        line-height: 1 !important;
        margin-bottom: 2pt !important;
    }
    
    .date-range {
        font-size: calc(var(--header-size) / 2) !important;
        line-height: 1 !important;
    }
    
    /* ========================================================================
       SCHEDULE CONTENT
       ======================================================================== */
    #schedule-days,
    #schedule-days-2 {
        padding: 0 var(--lr-margin) !important;
        margin: 0 !important;
        flex: 1 1 auto;
        overflow: hidden;
    }
    
    .day-section {
        margin-bottom: 0;
    }
    
    .day-name {
        font-size: var(--day-size) !important;
        margin-bottom: var(--day-to-event-spacing) !important;
    }
    
    /* ========================================================================
       EVENTS
       ======================================================================== */
    .event-main {
        margin-bottom: var(--event-to-detail-spacing) !important;
    }
    
    .event-name {
        font-size: var(--event-size) !important;
        padding-left: var(--event-indent) !important;
    }
    
    .event-time {
        font-size: var(--time-size) !important;
    }
    
    .event-detail {
        font-size: var(--detail-size) !important;
        padding-left: var(--detail-indent) !important;
        max-width: none !important;
    }
    
    /* ========================================================================
       FOOTER
       ======================================================================== */
    .calendar-footer {
        font-size: var(--footer-size) !important;
        text-align: center;
        padding: 0 var(--lr-margin) var(--lr-margin) var(--lr-margin) !important;
        margin: 0 !important;
        margin-top: auto !important;
        flex-shrink: 0;
    }
}