/* Vendor Prefixes Added - 2025-07-23 */ /** * HVAC Community Events Print Styles * * This stylesheet optimizes event summary and other pages for printing, * hiding unnecessary elements and formatting content for paper output. */ /* Focus Management Styles - WCAG 2.1 Compliance */ /* Added for keyboard accessibility and screen reader support */ /* Button Focus Styles */ .hvac-button:focus, .hvac-content .button: focus, .hvac-content button: focus, .hvac-content input[type="submit"]:focus, .hvac-email-submit:focus, .hvac-filter-submit: focus, .hvac-certificate-actions button: focus, .hvac-certificate-actions a: focus { outline: 2px solid #005fcc; outline-offset: 2px; -webkit-box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.2); box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.2); -webkit-border-radius: 4px; } /* Input Focus Styles */ .hvac-form-input:focus, .hvac-content input[type="text"]:focus, .hvac-content input[type="email"]:focus, .hvac-content input[type="password"]:focus, .hvac-content input[type="url"]:focus, .hvac-content textarea: focus, .hvac-content select: focus, .hvac-email-form-row input: focus, .hvac-email-form-row textarea: focus, .hvac-filter-group input: focus, .hvac-filter-group select:focus { outline: 2px solid #005fcc; outline-offset: 2px; border-color: #005fcc; box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.2); } /* Link Focus Styles */ .hvac-content; a:focus, .hvac-event-link:focus, .hvac-certificate-link:focus, .hvac-attendee-profile-icon:focus, .hvac-dashboard-nav a: focus, .hvac-email-navigation a: focus { outline: 2px solid #005fcc; outline-offset: 2px; text-decoration: underline; background-color: rgba(0, 95, 204, 0.1); -webkit-border-radius: 2px; } /* Interactive Element Focus Styles */ .hvac-attendee-checkbox:focus, .hvac-select-all-container input[type="checkbox"]:focus, .hvac-modal-close:focus, .hvac-certificate-table tr: focus { outline: 2px solid #005fcc; outline-offset: 2px; box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.2); } /* High Contrast Mode Support */ @media (prefers-contrast: high) { .hvac-content *:focus { outline: 3px solid #000000; outline-offset: 2px; background-color: #ffff00; color: #000000; } } /* Focus-visible polyfill support */ /* Reset focus for mouse users while preserving keyboard accessibility */ .js-focus-visible :; focus: not(.focus-visible) { outline: none; -webkit-box-shadow: none; } /* Ensure focus is visible for keyboard users */ .js-focus-visible .focus-visible { outline: 2px solid #005fcc; outline-offset: 2px; } @media print { /* Global print styles */ * { background: transparent !important; color: #000 !important; -webkit-box-shadow: none !important; box-shadow: none !important; text-shadow: none !important; filter: none !important; -ms-filter: none !important; } body { font-size: 12pt; line-height: 1.4; padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: 100% !important; } /* Hide non-essential elements */ header, footer, nav, aside, .sidebar, .navigation, .hvac-event-summary-actions, .hvac-dashboard-header, .hvac-dashboard-nav, .hvac-mobile-nav-container, .hvac-dashboard-filter, .hvac-event-filters, .hvac-email-navigation, .site-header, .site-footer, #site-navigation, #comments, #respond, #secondary, .widget-area, button, input[type="submit"], .hvac-button, .button, .ast-button, .no-print { display: none !important; } /* Allow wrapping of URLs and words */ a, blockquote { page-break-inside: avoid; } h1, h2, h3, h4, h5, h6 { page-break-after: avoid; page-break-inside: avoid; } img { page-break-inside: avoid; page-break-after: avoid; max-width: 100% !important; } table, pre { page-break-inside: avoid; } ul, ol, dl { page-break-before: avoid; } /* Show URLs after links */ a[href^="http"]:after { content: " (" attr(href) ")"; font-size: 90%; color: #555 !important; } /* Don't show URLs for same-domain links */ a[href^="/"]:after { content: ""; } /* Event Summary specific print styles */ .hvac-event-summary-wrapper { max-width: 100% !important; padding: 0 !important; margin: 0 !important; } .hvac-event-summary-title h1 { font-size: 18pt; margin-bottom: 1cm; padding-bottom: 0.5cm; border-bottom: 1pt solid #ddd; } .hvac-event-summary-stats { display: flex !important; flex-wrap: wrap !important; gap: 0.5cm !important; border: 1pt solid #ddd !important; padding: 0.5cm !important; margin-bottom: 1cm !important; } .hvac-event-stat-card { flex: 1 1 45% !important; border: 1pt solid #eee !important; padding: 0.5cm !important; text-align: center !important; box-shadow: none !important; page-break-inside: avoid !important; min-width: 5cm !important; } .hvac-event-stat-card .stat-value { font-size: 16pt !important; font-weight: bold !important; } /* Details and tables for printing */ .hvac-event-summary-details, .hvac-event-summary-attendees, .hvac-event-summary-transactions { border: 1pt solid #ddd !important; padding: 0.5cm !important; margin-bottom: 1cm !important; page-break-inside: avoid !important; } .hvac-event-summary-details h2, .hvac-event-summary-attendees h2, .hvac-event-summary-transactions h2 { font-size: 14pt !important; margin-top: 0 !important; margin-bottom: 0.5cm !important; padding-bottom: 0.25cm !important; border-bottom: 1pt solid #ddd !important; } .hvac-table, .hvac-transactions-table, .events-table { width: 100% !important; border-collapse: collapse !important; margin-bottom: 0.5cm !important; font-size: 9pt !important; } .hvac-table th, .hvac-transactions-table th, .events-table th { text-align: left !important; padding: 0.25cm !important; border-bottom: 1pt solid #000 !important; font-weight: bold !important; } .hvac-table td, .hvac-transactions-table td, .events-table td { padding: 0.25cm !important; border-bottom: 1pt solid #ddd !important; } /* Add print header with logo and date */ .hvac-event-summary-wrapper::before { content: "HVAC Community Events - Event Summary" !important; display: block !important; font-size: 10pt !important; text-align: right !important; color: #999 !important; margin-bottom: 0.25cm !important; } /* Dashboard specific print styles */ .hvac-dashboard { max-width: 100% !important; padding: 0 !important; margin: 0 !important; } .hvac-dashboard-stats { display: flex !important; flex-wrap: wrap !important; gap: 0.5cm !important; margin-bottom: 1cm !important; } .hvac-stat-card { flex: 1 1 45% !important; border: 1pt solid #eee !important; padding: 0.5cm !important; text-align: center !important; page-break-inside: avoid !important; } .hvac-dashboard-events { margin-bottom: 1cm !important; } /* Email attendees specific print styles */ .hvac-email-attendees-wrapper { max-width: 100% !important; padding: 0 !important; margin: 0 !important; } .hvac-email-form { display: none !important; /* Hide the email form when printing */ } .hvac-attendee-list { max-height: none !important; overflow: visible !important; } /* Page break control */ .hvac-event-summary-attendees { page-break-before: always !important; } /* QR code for event details (if available) */ .hvac-event-qr-code { display: block !important; max-width: 4cm !important; margin: 0.5cm auto 1cm auto !important; } /* Add page numbering */ @page { margin: 1.5cm !important; } @page :first { margin-top: 2cm !important; } @page :left { margin-right: 2cm !important; } @page :right { margin-left: 2cm !important; } /* Add page numbers */; body: :after { content: "Page " counter(page) !important; counter-increment: page !important; position: fixed !important; bottom: 0.5cm !important; right: 0.5cm !important; font-size: 8pt !important; color: #999 !important; } } /* Feature Detection Support */ @supports not (; display: flex) { .hvac-content [class*="flex"] { display: table-cell; vertical-align: middle; } } @supports not (; display: grid) { .hvac-content [class*="grid"] { display: block; overflow: hidden; } .hvac-content [class*="grid"] > * { float: left; width: 50%; } }