/* mtsinaidental.com — accessibility fixes (a11y rollout 2026-10-09). Source of truth:
   /opt/site-builder/_in-progress/mtsinaidental.com/_a11y/assets/a11y-fixes.css → copied to public/ by apply-02. */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* skip link: hidden until it receives keyboard focus */
a.a11y-skip{position:absolute;left:8px;top:-100px;z-index:100000;background:#fff;color:#3f7093;padding:8px 14px;font-size:15px;font-weight:600;border-radius:3px;text-decoration:underline}
a.a11y-skip:focus{top:8px;outline:3px solid #3f7093;outline-offset:2px}
#main-content:focus{outline:none}

/* visible keyboard focus (brand blue ring; white on the blue nav bar / black footer bar) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible,[role="button"]:focus-visible{outline:3px solid #3f7093!important;outline-offset:2px}
#main-header .et_menu_container a:focus-visible,#main-header .mobile_menu_bar:focus-visible,.columnbottom a:focus-visible,#top-header a:focus-visible{outline-color:#fff!important}
body #page-container .et_pb_section .et_pb_button:focus-visible{outline:3px solid #3f7093!important;outline-offset:3px}

/* link colour: Divi's default #2ea3f2 is 2.7:1 on white -> closest darker shade of the same blue that also clears
   4.5:1 over the pale map behind the footer contact details (#0a6aab: 5.8:1 on white, >=4.6:1 on the map).
   :where() keeps this at the specificity of Divi's own `a` rule + 1 class, so links the site styled itself
   (footer headings, the hero phone number, white-on-dark links) keep their colours. */
:where(#main-content,[role="contentinfo"] .et_pb_section:not(.columnbottom)) a:not(.et_pb_button,:is(h1,h2,h3,h4,h5,h6) a){color:#0a6aab}

/* links inside running text: not distinguishable by colour alone (axe link-in-text-block) */
#main-content .et_pb_text_inner :is(p,li) a:not(.et_pb_button),#main-content .entry-content :is(p,li) a:not(.et_pb_button){text-decoration:underline;text-underline-offset:2px}

/* header phone number: #0099cc on the pale header was 2.8:1 (40px text needs 3:1) */
#header-et-info a{color:#008bba!important}

/* main nav: current page was Divi blue on the blue bar (1.9:1) -> white + underline;
   hover faded the link to opacity .7 (3.5:1) -> keep it solid, underline instead */
#top-menu li.current-menu-item > a,#top-menu li.current_page_item > a{color:#fff!important;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}
#top-menu-nav > ul > li > a:hover{opacity:1!important;text-decoration:underline;text-underline-offset:5px}

/* homepage welcome band: #e5e5e5 text on #5c7c95 was 3.5:1 -> white text on the closest darker shade (4.5:1) */
body.home .et_pb_row_3{background-color:#5b7a93!important}
body.home .et_pb_text_2.et_pb_text,body.home .et_pb_text_2 h5{color:#fff!important}

/* homepage hero title: teal #33a7a2 script on the pale hero was 2.5:1 (large text needs 3:1) -> closest darker teal */
body.home .et_pb_text_0 h1{color:#2d938f!important}
/* homepage "Schedule your consultation today" button over the waiting-room photo: its 61%-opaque blue let the photo
   through (white text 3.3:1 at 375px) -> same blue, more opaque (strengthen the existing backing, photo unchanged) */
body.home #page-container .et_pb_section .et_pb_button_1{background-color:rgba(11,114,193,.92)!important}

/* footer credit (CLAUDE.md standard): the monitor SVG is the icon — drop the legacy device-strip background */
.et_pb_blurb:has(.ft-credit){background-image:none!important;padding-left:0!important}
.ft-credit{display:inline-flex;flex-wrap:wrap;align-items:center;gap:5px}
.ft-credit svg{flex:none}

/* footer legal row: keep each link's own words together; the row still wraps between links */
.columnbottom .et_pb_text_inner a{white-space:nowrap}

/* Divi contact/appointment forms: visible labels, visible field borders, readable placeholders, clearer error state */
.et_pb_contact_form_container .et_pb_contact_form_label{display:block!important;font-size:14px;font-weight:600;color:#222;margin:0 0 6px;line-height:1.3}
.et_pb_contact_form_container .et_pb_contact p input,.et_pb_contact_form_container .et_pb_contact p textarea,.et_pb_contact_form_container .et_pb_contact_select{border:1px solid #767676!important}
.et_pb_contact_form_container .et_pb_contact p input::placeholder,.et_pb_contact_form_container .et_pb_contact p textarea::placeholder{color:#595959!important;opacity:1}
.et_pb_contact_form_container .et_pb_contact p .et_contact_error{border:2px solid #c00!important}
.et_pb_contact_form_container .et-pb-contact-message{color:#900}

/* legal pages: contents-rail links reach the 24px target size (WCAG 2.5.8) */
.lg-page .lg-toc li a{display:inline-block;min-height:24px;padding:2px 0}

/* legal pages (body.et_full_width_page, sidebar removed): use the full container width */
body.et_full_width_page #main-content .container #left-area{width:100%!important;margin-right:0!important;float:none}
body.et_full_width_page #main-content .container:before{display:none}

/* Divi button arrow icon is generated content "5" in the ETmodules icon font: keep the icon, give it empty alt text
   so screen readers stop announcing "Schedule an Appointment 5" */
.et_pb_button:after,.et_pb_button:before{content:"\35" / ""}
/* custom Divi button icons come from the data-icon attribute ("E" = arrow glyph): same icon, empty alt text */
body #page-container .et_pb_section .et_pb_button[data-icon]:after{content:attr(data-icon) / ""}
/* hamburger glyph is the letter "a" in the ETmodules icon font: same glyph, empty alt text (the button is named "Menu") */
#et_mobile_nav_menu .mobile_menu_bar:before{content:"\61" / ""}
