.ast-woo-two-step-modern-checkout { width: 100%; margin: 0 auto; } .ast-woo-two-step-modern-checkout .ast-two-step-wrap { padding-bottom: 2em; } .ast-woo-two-step-modern-checkout .woocommerce { border-top: none; border-left-style: solid; border-right-style: solid; border-bottom-style: solid; border-width: 2px; border-color: var(--ast-border-color); border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; padding: .7em 1.7em 1.7em; overflow: hidden; background-color: var(--ast-global-color-primary, --ast-global-color-5); } .ast-woo-two-step-modern-checkout .woocommerce .ast-embed-checkout-form-nav-btns a.ast-next-button { font-family: inherit; font-weight: inherit; letter-spacing: 0.5px; width: 100%; padding: 1em 1.7em; font-size: 1.1em; line-height: 1.5; border-radius: 3px; text-transform: none; text-align: center; } .ast-woo-two-step-modern-checkout .woocommerce form.woocommerce-checkout #customer_details, .ast-woo-two-step-modern-checkout .woocommerce form.woocommerce-checkout #order_review_heading, .ast-woo-two-step-modern-checkout .woocommerce form.woocommerce-checkout #order_review { width: 100%; float: none; margin-bottom: 0; } .ast-woo-two-step-modern-checkout .woocommerce .ast-checkout-fields-wrapper { display: block; } .ast-woo-two-step-modern-checkout .woocommerce .ast-order-wrap { display: none; } .ast-woo-two-step-modern-checkout .woocommerce.step-two .ast-order-wrap { display: block; } .ast-woo-two-step-modern-checkout .woocommerce.step-two .ast-checkout-fields-wrapper { display: none; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-nav { border-left-style: solid; border-right-style: solid; border-width: 2px; border-color: var(--ast-border-color); border-top-left-radius: 3px; border-top-right-radius: 3px; display: block; width: 100%; margin: 0 auto; padding-bottom: 0; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-note { border: 1px dashed; border-color: var(--ast-global-color-0); margin-bottom: 1.4em; padding: 0.7em 1em; border-radius: 3px; background-color: var(--ast-global-color-0); position: relative; color: #fff; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-note::before { content: ""; border: 10px solid; border-top-color: var(--ast-global-color-0); position: absolute; width: 20px; height: 20px; bottom: -20px; left: auto; top: auto; border-left: 10px transparent solid; border-right: 10px transparent solid; border-bottom: 10px transparent solid; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-note p { margin: 0; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-nav-btns { display: inline-block; width: 100%; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-nav-btns .ast-next-button .ast-button-text { display: inline-block; font-size: 1.15em; font-weight: 700; vertical-align: middle; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-nav-btns .ast-next-button .ast-button-sub-text { display: inline-block; font-size: 0.9em; font-weight: 400; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-nav-btns .ast-next-button .ast-next-button-icon-wrap { display: block; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-nav-btns .ast-next-button .dashicons-arrow-right-alt { margin-right: 0.25em; display: inline-block; font-weight: 700; vertical-align: middle; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-nav-btns .ast-next-button-content { display: block; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-nav-btns .ast-next-button-content .customize-partial-edit-shortcut-button { cursor: pointer !important; } .ast-woo-two-step-modern-checkout ul.ast-embed-checkout-form-steps { background-color: var(--ast-global-color-secondary, --ast-global-color-4); -js-display: flex; display: flex; list-style: none; margin-left: 0; margin-bottom: 0; padding: 0; width: 100%; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps div.steps { flex: 1; width: 100%; text-align: left; vertical-align: middle; position: relative; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps div.steps a { -js-display: flex; display: flex; align-items: center; padding: 1em; width: 100%; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps div.steps .step-heading { display: inline-block; vertical-align: middle; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps div.steps .step-number { display: inline-block; font-weight: 700; font-size: 1.66em; line-height: 1.5; margin-right: 0.4em; vertical-align: middle; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps div.steps .step-name { font-weight: 600; font-size: .94em; line-height: 1.5; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps div.steps .step-sub-name { font-size: .86em; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps div.step-one, .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps div.step-two { opacity: 1; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps .step-one.ast-current::before { content: ""; background-color: var(--ast-global-color-0); border-top-left-radius: 3px; width: calc( 100% + 2px); height: 2px; position: absolute; left: -2px; top: -2px; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps .step-two.ast-current::before { content: ""; background-color: var(--ast-global-color-0); border-top-right-radius: 3px; width: calc( 100% + 2px); height: 2px; position: absolute; right: -2px; top: -2px; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps .steps.ast-current { background-color: var(--ast-global-color-primary, --ast-global-color-5); } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps .ast-current .step-name { color: var(--ast-global-color-0); } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps .ast-current a { text-decoration: none; color: var(--ast-global-color-3); } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps a { text-decoration: none; color: var(--ast-global-color-3); } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps a:visited { color: var(--ast-global-color-3); border: none; outline: none; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps a:focus { color: var(--ast-global-color-3); border: none; outline: none; } .ast-woo-two-step-modern-checkout .ast-embed-checkout-form-steps a:active { color: var(--ast-global-color-3); border: none; outline: none; } .ast-woo-two-step-modern-checkout .ast-border-none .ast-embed-checkout-form-steps .step-one.ast-current::before { left: 0; top: 0; width: 100%; border-top-left-radius: 0; } .ast-woo-two-step-modern-checkout .ast-border-none .ast-embed-checkout-form-steps .step-two.ast-current::before { right: 0; top: 0; width: 100%; border-top-right-radius: 0; } #tve_editor ol { margin: 0; } #tve_editor ul { margin: 0; } /* 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; }