/** * HVAC Accessibility Fixes * Addresses accessibility issues identified by PowerMapper audit */ /* Improve color contrast for menu items */ .menu-text { /* Ensure better contrast ratios for text visibility */ color: #2c3e50 !important; /* Dark blue-gray for better contrast */ } /* Active/hover states for menu items */ .menu-item:hover .menu-text, .menu-item:focus .menu-text { color: #1a252f !important; /* Even darker for active states */ } /* Ensure ARIA buttons in third-party plugins have better accessibility */ [role="button"] { /* Add minimum touch target size */ min-width: 44px; min-height: 44px; } /* Improve focus indicators */ [role="button"]:focus, button:focus, .hvac-trainer-card:focus, a:focus { outline: 2px solid #0073aa; outline-offset: 2px; } /* Ensure trainer badges don't cause layout shift */ .hvac-mq-badge { width: 35px; height: 35px; display: block; } /* Screen reader improvements */ .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } /* Improve MapGeo button accessibility where possible */ .imapsSprite-group[role="button"] { /* Add screen reader text for map buttons */ position: relative; } .imapsSprite-group[role="button"]::before { content: "Map marker"; position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; } /* High contrast mode support */ @media (prefers-contrast: high) { .menu-text { color: #000000 !important; } .hvac-trainer-card { border: 2px solid #000000; } } /* Reduced motion support */ @media (prefers-reduced-motion: reduce) { * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } } /* Focus management for trainer cards */ .hvac-trainer-card { cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; } .hvac-trainer-card:hover, .hvac-trainer-card:focus { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); } /* Ensure proper color contrast for certification badges */ .hvac-trainer-card .certification-type { background-color: #2c3e50; color: #ffffff; padding: 4px 8px; border-radius: 4px; font-weight: 500; }