upskill-event-manager/assets/css/chat-element.css
Ben Reed cdc5ea85f4 feat: Add comprehensive CSS, JavaScript and theme asset infrastructure
Add massive collection of CSS, JavaScript and theme assets that were previously excluded:

**CSS Files (681 total):**
- HVAC plugin-specific styles (hvac-*.css): 34 files including dashboard, certificates, registration, mobile nav, accessibility fixes, animations, and welcome popup
- Theme framework files (Astra, builder systems, layouts): 200+ files
- Plugin compatibility styles (WooCommerce, WPForms, Elementor, Contact Form 7): 150+ files
- WordPress core and editor styles: 50+ files
- Responsive and RTL language support: 200+ files

**JavaScript Files (400+ total):**
- HVAC plugin functionality (hvac-*.js): 27 files including menu systems, dashboard enhancements, profile sharing, mobile responsive features, accessibility, and animations
- Framework and library files: jQuery plugins, GSAP, AOS, Swiper, Chart.js, Lottie, Isotope
- Plugin compatibility scripts: WPForms, WooCommerce, Elementor, Contact Form 7, LifterLMS
- WordPress core functionality: customizer, admin, block editor compatibility
- Third-party integrations: Stripe, SMTP, analytics, search functionality

**Assets:**
- Certificate background images and logos
- Comprehensive theme styling infrastructure
- Mobile-responsive design systems
- Cross-browser compatibility assets
- Performance-optimized minified versions

**Updated .gitignore:**
- Fixed asset directory whitelisting patterns to properly include CSS/JS/images
- Added proper directory structure recognition (!/assets/css/, !/assets/js/, etc.)
- Maintains security by excluding sensitive files while including essential assets

This commit provides the complete frontend infrastructure needed for:
- Full theme functionality and styling
- Plugin feature implementations
- Mobile responsiveness and accessibility
- Cross-browser compatibility
- Performance optimization
- Developer workflow support
2025-08-11 16:20:31 -03:00

659 lines
19 KiB
CSS

wpforms-ai-chat[mode="choices"] .wpforms-ai-chat-answer-buttons .wpforms-btn-orange {
background-color: #e27730;
border-color: #e27730;
color: #ffffff;
}
wpforms-ai-chat[mode="choices"] .wpforms-ai-chat-answer-buttons .wpforms-btn-orange:hover {
background-color: #cd6622;
border-color: #cd6622;
color: #ffffff;
}
wpforms-ai-chat[mode="choices"] .wpforms-ai-chat-answer-buttons .wpforms-btn-sm {
font-size: 14px;
font-weight: 500;
padding: 0 10px;
height: 32px;
line-height: 30px;
}
wpforms-ai-chat[mode="choices"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-flag {
background-image: url("../../../images/integrations/ai/flag-usa.svg");
}
wpforms-ai-chat[mode="choices"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-clover {
background-image: url("../../../images/integrations/ai/leaf-maple.svg");
}
wpforms-ai-chat[mode="choices"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-thumbs-up {
background-image: url("../../../images/integrations/ai/thumbs-up.svg");
}
wpforms-ai-chat[mode="choices"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-globe {
background-image: url("../../../images/integrations/ai/globe-americas.svg");
}
wpforms-ai-chat[mode="choices"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-palm {
background-image: url("../../../images/integrations/ai/tree-palm.svg");
}
wpforms-ai-chat[mode="choices"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-shop {
background-image: url("../../../images/integrations/ai/store.svg");
}
wpforms-ai-chat {
display: block;
max-height: 100%;
height: 100%;
overflow: hidden;
}
wpforms-ai-chat .wpforms-ai-chat {
display: block;
max-height: 100%;
height: 100%;
overflow: hidden;
}
wpforms-ai-chat .wpforms-ai-chat-message-list {
margin: 0;
padding: 40px 40px 0 40px;
display: flex;
flex-direction: column;
overflow: auto;
height: calc( 100% - 134px);
max-height: calc( 100% - 134px);
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-chat-item-answer:last-child {
margin-bottom: 40px;
}
wpforms-ai-chat .wpforms-ai-chat-message-list.wpforms-scrollbar-compact {
padding-right: 26px;
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-chat-item-question {
width: 410px;
margin-bottom: 20px;
margin-inline-start: auto;
display: flex;
height: fit-content;
padding: 15px 20px 15px 20px;
color: #ffffff;
gap: 10px;
border-radius: 24px;
border-start-end-radius: 0;
font-weight: 500;
font-size: 15px;
line-height: 22px;
overflow-wrap: anywhere;
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-chat-item-question div > h4:first-child {
margin-block-start: 0;
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item.wpforms-chat-item-text {
white-space: pre-line;
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header h3.wpforms-ai-chat-header-title {
font-weight: 600;
font-size: 24px;
line-height: 30px;
margin: 0 0 10px;
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header h3.wpforms-ai-chat-header-title:after {
content: '';
display: inline-block;
vertical-align: top;
width: 16px;
height: 16px;
background-image: url("../../../images/integrations/ai/ai-feature.svg");
background-size: 16px 16px;
opacity: .85;
margin-left: 2px;
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header .wpforms-ai-chat-header-description {
color: #777777;
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header .wpforms-ai-chat-header-description a {
color: #999999;
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header .wpforms-ai-chat-header-description a:hover, wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header .wpforms-ai-chat-header-description a:focus {
color: #444444;
}
wpforms-ai-chat .wpforms-ai-chat-message-list .wpforms-ai-chat-divider {
border-top: 1px solid #dddddd;
margin: 40px 0;
}
wpforms-ai-chat .wpforms-ai-chat-message-input {
display: flex;
height: 134px;
position: relative;
padding: 40px;
background-color: #f8f8f8;
}
wpforms-ai-chat .wpforms-ai-chat-message-input input[type="text"],
wpforms-ai-chat .wpforms-ai-chat-message-input textarea {
padding: 10px 15px;
padding-inline-end: 54px;
width: 100%;
height: 54px;
min-height: 54px;
font-size: 16px;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.07);
border-radius: 6px;
}
wpforms-ai-chat .wpforms-ai-chat-message-input input[type="text"]::placeholder,
wpforms-ai-chat .wpforms-ai-chat-message-input textarea::placeholder {
color: #999999;
}
wpforms-ai-chat .wpforms-ai-chat-message-input input[type="text"]:disabled,
wpforms-ai-chat .wpforms-ai-chat-message-input textarea:disabled {
background-color: #ffffff;
opacity: 1;
}
wpforms-ai-chat .wpforms-ai-chat-message-input input[type="text"]:focus,
wpforms-ai-chat .wpforms-ai-chat-message-input textarea:focus {
border: 1px solid #777777;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.07), 0 0 0 1px #777777;
}
wpforms-ai-chat .wpforms-ai-chat-message-input textarea {
line-height: 22px;
padding: 15px 40px 15px 15px;
overflow-x: hidden;
}
wpforms-ai-chat .wpforms-ai-chat-message-input textarea::-webkit-scrollbar {
background: transparent;
width: 10px;
height: 10px;
}
wpforms-ai-chat .wpforms-ai-chat-message-input textarea::-webkit-scrollbar-track {
background: transparent;
}
wpforms-ai-chat .wpforms-ai-chat-message-input textarea::-webkit-scrollbar-thumb {
box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0);
background: transparent;
border-radius: 10px;
border: solid 3px transparent;
}
wpforms-ai-chat .wpforms-ai-chat-message-input textarea::-webkit-resizer, wpforms-ai-chat .wpforms-ai-chat-message-input textarea::-webkit-scrollbar-button, wpforms-ai-chat .wpforms-ai-chat-message-input textarea::-webkit-scrollbar-corner {
display: none;
}
@-moz-document url-prefix() {
wpforms-ai-chat .wpforms-ai-chat-message-input textarea {
scrollbar-color: rgba(0, 0, 0, 0) transparent;
scrollbar-gutter: initial !important;
scrollbar-width: thin;
}
}
wpforms-ai-chat .wpforms-ai-chat-message-input textarea:hover::-webkit-scrollbar {
background: transparent;
width: 10px;
height: 10px;
}
wpforms-ai-chat .wpforms-ai-chat-message-input textarea:hover::-webkit-scrollbar-track {
background: transparent;
}
wpforms-ai-chat .wpforms-ai-chat-message-input textarea:hover::-webkit-scrollbar-thumb {
box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.5);
background: transparent;
border-radius: 10px;
border: solid 3px transparent;
}
wpforms-ai-chat .wpforms-ai-chat-message-input textarea:hover::-webkit-resizer, wpforms-ai-chat .wpforms-ai-chat-message-input textarea:hover::-webkit-scrollbar-button, wpforms-ai-chat .wpforms-ai-chat-message-input textarea:hover::-webkit-scrollbar-corner {
display: none;
}
@-moz-document url-prefix() {
wpforms-ai-chat .wpforms-ai-chat-message-input textarea:hover {
scrollbar-color: rgba(0, 0, 0, 0.5) transparent;
scrollbar-gutter: initial !important;
scrollbar-width: thin;
}
}
wpforms-ai-chat .wpforms-ai-chat-message-input .wpforms-ai-chat-send {
background-image: url("../../../images/integrations/ai/icon-send.svg");
background-size: 16px;
}
wpforms-ai-chat .wpforms-ai-chat-message-input .wpforms-ai-chat-stop {
background-image: url("../../../images/integrations/ai/icon-stop.svg");
background-size: 14px;
}
wpforms-ai-chat .wpforms-ai-chat-message-input .wpforms-ai-chat-send,
wpforms-ai-chat .wpforms-ai-chat-message-input .wpforms-ai-chat-stop {
position: absolute;
inset-inline-end: 40px;
bottom: 40px;
height: 32px;
width: 32px;
border: none;
border-radius: 4px;
cursor: pointer;
padding: 0;
margin: 11px;
background-repeat: no-repeat;
background-position: center;
}
wpforms-ai-chat .wpforms-ai-chat-message-input .wpforms-ai-chat-send.wpforms-hidden,
wpforms-ai-chat .wpforms-ai-chat-message-input .wpforms-ai-chat-stop.wpforms-hidden {
display: none;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons {
border-top: 1px solid rgba(221, 221, 221, 0.5);
padding-top: 20px;
display: flex;
gap: 15px;
justify-content: space-between;
align-items: center;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons button.wpforms-ai-chat-answer-action, wpforms-ai-chat .wpforms-ai-chat-answer-buttons a.wpforms-ai-chat-answer-learn-more {
border-radius: 4px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 6px 10px;
border: none;
text-decoration: none;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons button.wpforms-ai-chat-answer-action span, wpforms-ai-chat .wpforms-ai-chat-answer-buttons a.wpforms-ai-chat-answer-learn-more span {
font-size: 14px;
font-weight: 500;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons button.wpforms-ai-chat-answer-action::before {
content: '';
display: inline-block;
width: 12px;
height: 14px;
background-image: url("../../../images/integrations/ai/insert.svg");
background-size: 12px 14px;
opacity: .65;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-buttons-response {
display: flex;
gap: 12px;
align-items: center;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-button {
background-color: transparent;
border: none;
padding: 0;
margin: 0;
line-height: 16px;
cursor: pointer;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-button.dislike {
width: 18px;
height: 16px;
background-image: url("../../../images/integrations/ai/thumbs-down.svg");
background-size: 18px 16px;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-button.dislike:hover, wpforms-ai-chat .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-button.dislike:focus {
background-image: url("../../../images/integrations/ai/thumbs-down-hover.svg");
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-button.dislike.clicked {
background-image: url("../../../images/integrations/ai/thumbs-down-solid.svg");
cursor: default;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-button.refresh {
color: #999999;
font-size: 16px;
}
wpforms-ai-chat .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-button.refresh:hover, wpforms-ai-chat .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-button.refresh:focus {
color: #d63638;
}
wpforms-ai-chat .wpforms-chat-item-answer-waiting {
display: flex;
gap: 5px;
margin: 0 0 20px 0;
}
wpforms-ai-chat .wpforms-chat-item-answer-waiting:before {
content: '';
display: inline-block;
vertical-align: middle;
width: 32px;
height: 32px;
background-image: url("../../../images/integrations/ai/ai-answer-icon.svg");
background-size: 32px 32px;
}
wpforms-ai-chat .wpforms-chat-item-answer-waiting .wpforms-chat-item-spinner {
height: 50px;
width: 82px;
display: flex;
justify-content: center;
align-items: center;
color: #999999;
background-color: #f8f8f8;
border-radius: 0 24px 24px 24px;
}
wpforms-ai-chat .wpforms-chat-item-answer,
wpforms-ai-chat .wpforms-chat-item-notice,
wpforms-ai-chat .wpforms-chat-item-warning,
wpforms-ai-chat .wpforms-chat-item-error {
gap: 8px;
display: flex;
font-size: 15px;
line-height: 15px;
text-align: left;
margin: 0 0 20px 0;
height: fit-content;
}
wpforms-ai-chat .wpforms-chat-item-answer:before,
wpforms-ai-chat .wpforms-chat-item-notice:before,
wpforms-ai-chat .wpforms-chat-item-warning:before,
wpforms-ai-chat .wpforms-chat-item-error:before {
content: '';
display: inline-block;
vertical-align: middle;
max-width: 32px;
width: 100%;
height: 32px;
background-image: url("../../../images/integrations/ai/ai-answer-icon.svg");
background-size: 32px 32px;
background-repeat: no-repeat;
}
wpforms-ai-chat .wpforms-chat-item-answer > div,
wpforms-ai-chat .wpforms-chat-item-notice > div,
wpforms-ai-chat .wpforms-chat-item-warning > div,
wpforms-ai-chat .wpforms-chat-item-error > div {
flex-grow: 1;
padding: 20px;
display: flex;
flex-direction: column;
color: #444444;
background-color: #f8f8f8;
gap: 10px;
border-radius: 24px;
border-start-start-radius: 0;
}
wpforms-ai-chat .wpforms-chat-item-answer > div h4,
wpforms-ai-chat .wpforms-chat-item-notice > div h4,
wpforms-ai-chat .wpforms-chat-item-warning > div h4,
wpforms-ai-chat .wpforms-chat-item-error > div h4 {
font-size: 15px;
font-weight: 500;
margin: 5px 0;
text-align: start;
}
wpforms-ai-chat .wpforms-chat-item-answer > div ol,
wpforms-ai-chat .wpforms-chat-item-notice > div ol,
wpforms-ai-chat .wpforms-chat-item-warning > div ol,
wpforms-ai-chat .wpforms-chat-item-error > div ol {
display: flex;
flex-direction: column;
list-style: decimal;
align-items: flex-start;
gap: 15px;
padding-inline-start: 20px;
margin: 10px 0;
line-height: 22px;
}
wpforms-ai-chat .wpforms-chat-item-answer > div ol li,
wpforms-ai-chat .wpforms-chat-item-notice > div ol li,
wpforms-ai-chat .wpforms-chat-item-warning > div ol li,
wpforms-ai-chat .wpforms-chat-item-error > div ol li {
margin: 0;
word-break: break-all;
}
wpforms-ai-chat .wpforms-chat-item-answer > div > span,
wpforms-ai-chat .wpforms-chat-item-notice > div > span,
wpforms-ai-chat .wpforms-chat-item-warning > div > span,
wpforms-ai-chat .wpforms-chat-item-error > div > span {
line-height: 22px;
text-align: start;
}
wpforms-ai-chat .wpforms-chat-item-answer > div > span.wpforms-ai-chat-answer-footer-learn-more,
wpforms-ai-chat .wpforms-chat-item-notice > div > span.wpforms-ai-chat-answer-footer-learn-more,
wpforms-ai-chat .wpforms-chat-item-warning > div > span.wpforms-ai-chat-answer-footer-learn-more,
wpforms-ai-chat .wpforms-chat-item-error > div > span.wpforms-ai-chat-answer-footer-learn-more {
font-weight: 500;
}
wpforms-ai-chat .wpforms-chat-item-answer > div a.wpforms-chat-element-learn-more,
wpforms-ai-chat .wpforms-chat-item-notice > div a.wpforms-chat-element-learn-more,
wpforms-ai-chat .wpforms-chat-item-warning > div a.wpforms-chat-element-learn-more,
wpforms-ai-chat .wpforms-chat-item-error > div a.wpforms-chat-element-learn-more {
color: #7a30e2;
}
wpforms-ai-chat .wpforms-chat-item-answer > div a.wpforms-chat-element-learn-more:hover, wpforms-ai-chat .wpforms-chat-item-answer > div a.wpforms-chat-element-learn-more:focus,
wpforms-ai-chat .wpforms-chat-item-notice > div a.wpforms-chat-element-learn-more:hover,
wpforms-ai-chat .wpforms-chat-item-notice > div a.wpforms-chat-element-learn-more:focus,
wpforms-ai-chat .wpforms-chat-item-warning > div a.wpforms-chat-element-learn-more:hover,
wpforms-ai-chat .wpforms-chat-item-warning > div a.wpforms-chat-element-learn-more:focus,
wpforms-ai-chat .wpforms-chat-item-error > div a.wpforms-chat-element-learn-more:hover,
wpforms-ai-chat .wpforms-chat-item-error > div a.wpforms-chat-element-learn-more:focus {
color: #5c24a9;
}
wpforms-ai-chat .wpforms-chat-item-answer > div pre,
wpforms-ai-chat .wpforms-chat-item-notice > div pre,
wpforms-ai-chat .wpforms-chat-item-warning > div pre,
wpforms-ai-chat .wpforms-chat-item-error > div pre {
line-height: 2em;
max-width: 489px;
overflow-x: auto;
overflow-y: hidden;
width: fit-content;
}
wpforms-ai-chat .wpforms-chat-item-error:before {
background-image: url("../../../images/integrations/ai/ai-error-icon.svg");
}
wpforms-ai-chat .wpforms-chat-item-error > div {
background-color: #fcf0f1;
}
wpforms-ai-chat .wpforms-chat-item-error > div h4 {
color: #d63638;
margin: 0;
}
wpforms-ai-chat .wpforms-chat-item-warning:before {
background-image: url("../../../images/integrations/ai/ai-warning-icon.svg");
}
wpforms-ai-chat .wpforms-chat-item-warning > div {
background-color: #fcf6e5;
}
wpforms-ai-chat .wpforms-chat-item-warning > div h4 {
color: #444444;
margin: 0;
}
wpforms-ai-chat .wpforms-chat-item-notice {
margin-top: 0;
}
wpforms-ai-chat .wpforms-ai-chat-welcome-screen-sample-prompts {
display: flex;
flex-direction: column;
gap: 10px;
margin: 40px 0;
}
wpforms-ai-chat .wpforms-ai-chat-welcome-screen-sample-prompts li {
display: flex;
align-items: center;
gap: 15px;
margin-bottom: 0;
padding-bottom: 10px;
border-bottom: 1px solid rgba(221, 221, 221, 0.5);
}
wpforms-ai-chat .wpforms-ai-chat-welcome-screen-sample-prompts li:last-child {
padding-bottom: 0;
border-bottom: none;
}
wpforms-ai-chat .wpforms-ai-chat-welcome-screen-sample-prompts li::after {
content: '';
width: 16px;
height: 16px;
margin-inline-start: auto;
opacity: 0;
}
wpforms-ai-chat .wpforms-ai-chat-welcome-screen-sample-prompts li:hover {
cursor: pointer;
}
wpforms-ai-chat .wpforms-ai-chat-welcome-screen-sample-prompts li:hover a {
text-decoration: underline;
}
wpforms-ai-chat .wpforms-ai-chat-welcome-screen-sample-prompts li:hover::after {
opacity: 1;
}
wpforms-ai-chat .wpforms-ai-chat-welcome-screen-sample-prompts li a {
font-size: 15px;
line-height: 22px;
color: #444444;
text-decoration: none;
}
wpforms-ai-chat .wpforms-ai-chat-welcome-screen-sample-prompts i {
width: 20px;
height: 20px;
background-size: 20px 20px;
display: inline-block;
}
/* 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;
box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.2);
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);
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;
box-shadow: none;
}
/* Ensure focus is visible for keyboard users */
.js-focus-visible .focus-visible {
outline: 2px solid #005fcc;
outline-offset: 2px;
}