/* Accessibility fixes — added 2026-10-08 with the accessibility widget rollout.
   Loaded from BaseLayout after the page CSS. Each rule is scoped to the element it fixes. */

/* Visually hidden, still read by screen readers */
.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}

/* Extra <h1>s demoted to <h2> (one h1 per page) — look pinned to the old h1 */
h2.a11y-h1look{font-size:30px!important;line-height:30px!important;font-weight:500!important;color:#000!important;padding-bottom:10px!important;letter-spacing:normal!important;text-transform:none!important}
.et_pb_text_2 h2.a11y-h1look-home{font-weight:600;font-size:42px;color:#0099a8!important;line-height:1.2em;letter-spacing:normal;text-transform:none}
@media (max-width:980px){.et_pb_text_2 h2.a11y-h1look-home{font-size:48px}}
@media (max-width:767px){.et_pb_text_2 h2.a11y-h1look-home{font-size:40px}}

/* Header "Book Now" is now a real link (was a mouse-only clickable box) — same look */
.et_pb_blurb_3_tb_header a.a11y-booknow{color:inherit;text-decoration:none}

/* Visible keyboard focus */
a:focus-visible,button:focus-visible,[role="button"]:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #0C4C91!important;outline-offset:2px!important}
footer.et-l--footer a:focus-visible,.sec_banner a:focus-visible{outline-color:#fff!important}
.a11y-statement a:focus-visible{outline:3px solid #0C4C91;outline-offset:3px}

/* ---- Colour contrast (closest darker/lighter shade of the site's own colour) ---- */
/* Cosmetic dentistry sidebar links: #0c71c3 on #e2e2e2 3.89 -> 4.79 */
.cosmetic_row li a{color:#0b63ab!important}
/* Dentures jump links: #0c71c3 on #eaeaea 4.19 -> 5.15 */
.postid-30033685 .et_pb_text_inner ul li a[href^="#"]{color:#0b63ab!important}
/* FAQs accordion link: #0c71c3 on #e9edf1 4.28 -> 5.27 */
.page-id-158 .et_pb_toggle_content a{color:#0b63ab!important}
/* Emergency page list link on light-blue panel: 3.78 -> 4.6+ */
.postid-26329 .et_pb_blurb_description li a{color:#0a5ea1!important}
/* Emergency hero: red word over a light part of the photo */
.postid-26329 .sec_banner h1 span{color:#ff8a8a!important}
.postid-26329 .sec_banner h1{text-shadow:0 0 3px rgba(0,0,0,.95),0 0 10px rgba(0,0,0,.85)}
/* Financial info: teal heading on navy #0e4c90 2.49 -> 3.11 (large text) */
.page-id-160 .uabb-infobox-title{color:#00acbc!important}
/* New patient offer: fine print 3.73 -> 4.79; teal intro 3.36 -> 4.78 */
.page-id-687 .et_pb_text_0 .et_pb_text_inner{color:#6a7479!important}
.page-id-687 .et_pb_promo_description div{color:#007f88!important}
/* "Request Your Appointment" call-to-action box on a pale photo */
.et_pb_cta_0_tb_body.et_pb_promo h2.et_pb_module_header{color:#007f88!important}
.et_pb_cta_0_tb_body.et_pb_promo .et_pb_promo_description p{color:#4f595e!important}
/* Homepage "Dental Excellence" eyebrow: #21abc6 on #efefef 2.37 -> 3.1 (large text) */
.page-id-4 .uabb-infobox-title-prefix{color:#1d94ac!important}
/* Footer: on phones/tablets the photo shows through the light end of the gradient behind the
   legal links and credit (white text 3.07). Strengthen the existing overlay there. */
@media (max-width:980px){
  html body div.et_pb_section.et_pb_section_0_tb_footer{background-image:linear-gradient(180deg,#222222 0%,rgba(34,34,34,.78) 100%),url(/wp-content/uploads/2025/02/first-class-dental.png)!important}
}
@media only screen and (max-width:767px){
  html body div.et_pb_section.et_pb_section_0_tb_footer{background-image:linear-gradient(180deg,#222222 0%,rgba(34,34,34,.78) 100%),url(/wp-content/uploads/2025/02/first-class-dental.png)!important}
}
/* Sticky appointment bar: pale text #dde6ef on #376aa3 4.43 -> white */
.et_pb_button_2_tb_footer.scheduleButton,.et_pb_text_1_tb_footer .et_pb_text_inner a{color:#fff!important}

/* Homepage service cards: the "Learn more" line is now a real link (cards were mouse-only) — same look */
a.a11y-cardlink{color:inherit!important;text-decoration:none!important}
/* Skip link: show it when it receives keyboard focus */
a.screen-reader-shortcut:focus{position:fixed!important;top:8px!important;left:8px!important;z-index:100000!important;width:auto!important;height:auto!important;clip:auto!important;clip-path:none!important;padding:10px 16px!important;background:#fff!important;color:#0C4C91!important;font-size:16px!important;text-decoration:underline!important;outline:3px solid #0C4C91!important}
/* New patient offer intro (teal on white 3.36): beat the page's own .et_pb_cta_0 rule */
.page-id-687 .et_pb_cta_0.et_pb_promo .et_pb_promo_description div{color:#007f88!important}
/* Contact page hides its title band on phones (form-first layout): keep it hidden but readable by screen readers */
@media (max-width:767px){
  body .et_pb_section.mf-hero{display:block!important;position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;padding:0!important;margin:-1px!important;border:0!important}
}
/* Menu button sits on the dark drawer when open: add a white halo so the focus ring shows on both */
a.tresio-nav__hamburger:focus-visible{outline:3px solid #0C4C91!important;outline-offset:2px!important;box-shadow:0 0 0 5px #fff!important}
/* Divi icon-font glyphs drawn with ::before/::after were read as part of link names
   ("Book Appointment $", "Learn More 5"). Same glyph, empty alternative text. */
.et_pb_button[data-icon]::after{content:attr(data-icon) / "" !important}
.et_pb_button:not([data-icon])::after{content:"5" / "" !important}
.et_pb_promo_button[data-icon]::before{content:attr(data-icon) / "" !important}
/* FAQ / toggle headings: a real button is added inside each title by BaseLayout (keyboard access) */
.et_pb_toggle_title > button.a11y-toggle-btn{all:unset;display:block;width:100%;cursor:pointer;font:inherit;color:inherit;text-transform:inherit;letter-spacing:inherit;line-height:inherit;text-align:inherit}
.et_pb_toggle_title > button.a11y-toggle-btn:focus-visible{outline:3px solid #0C4C91!important;outline-offset:4px!important}
/* Hover states: white text on #6488dd 3.44 -> #436ed6 4.73; on #009ba7 3.36 -> #007f88 4.78 */
body #page-container .et_pb_section .et_pb_button_0_tb_footer:hover,body #page-container .et_pb_section .et_pb_button_1_tb_footer:hover{background-color:#436ed6!important}
body.page-id-4 #page-container .et_pb_section .et_pb_button_1:hover,body.page-id-4 #page-container .et_pb_section .et_pb_button_2:hover{background-color:#436ed6!important}
body #page-container .et_pb_section .et_pb_cta_0_tb_body.et_pb_promo .et_pb_promo_button.et_pb_button:hover{background-color:#007f88!important}
/* Homepage boxed headings were nowrap: with enlarged text they pushed the page sideways on phones */
@media (max-width:767px){.main_box h2{white-space:normal!important;text-align:center}}
/* New patient offer: the old WordPress form under the offer was removed (Leonard 2026-10-09).
   Centre the remaining offer text beside the photo so no empty band is left below it. */
@media (min-width:981px){.page-id-687 #main-content .et_pb_row_0 > .et_pb_column_1{display:flex;flex-direction:column;justify-content:center}}
.page-id-687 #main-content .et_pb_cta_0.et_pb_promo{padding-bottom:0!important}