/* a11y rollout 2026-10-09 (bricedentalgroup.com) - generated by _a11y/06-css-and-js.py.
   Site-level accessibility fixes. Scoped rules only; brand tokens untouched. */

/* screen-reader-only text (sr-only h1 on archive pages, link context) */
.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}

/* visible keyboard focus everywhere: navy ring + white halo so it shows on light AND dark bands */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
[role="button"]:focus-visible,[tabindex]:focus-visible{outline:3px solid #014365!important;outline-offset:2px!important;box-shadow:0 0 0 5px #fff!important}
.screen-reader-shortcut:focus{outline:3px solid #014365!important}

/* heading levels corrected for a sensible outline; the look is pinned to the original level */
#main-content h2.a11y-h1look{font-size:30px;line-height:1em;padding-bottom:10px;font-weight:500}
#main-content h2.a11y-h3look,#main-content h3.a11y-h3look{font-size:22px;line-height:1em;padding-bottom:3px;font-weight:500}
#main-content h2.a11y-h4look,#main-content h3.a11y-h4look{font-size:18px;line-height:1em;padding-bottom:10px;font-weight:500}
#main-content .a11y-was-h2{margin:0 0 10px}

/* footer landmark wrapper must not change layout */
footer.a11y-site-footer{display:contents}

/* homepage: the hero (with the page's only h1) is display:none on phones - keep it hidden
   visually but exposed to screen readers so the phone page still has its h1 */
@media (max-width:767px){
  body.home .et_pb_section_0,body.home .et_pb_text_0{display:block!important;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;border:0!important}
  /* Content Views blog teaser grid used bootstrap -15px row margins -> 6px sideways scroll */
  /* hero title/subtitle on the full-width + select-services templates sits on an office photo; on
     phones parts of the photo behind the text are mid-grey. A soft white halo keeps it readable. */
  body.page-template-full-wdth .et_pb_section_0 .et_pb_text_0 .et_pb_text_inner,
  body.single-select-services .et_pb_section_0 .et_pb_text_0 .et_pb_text_inner{text-shadow:0 0 3px #fff,0 0 6px #fff,0 0 10px #fff}
  /* room under the footer legal row so the bottom-left widget launcher never covers a link */
  .et_pb_section.columnbottom{padding-bottom:64px!important}
  .pt-cv-view.pt-cv-colsys{margin-left:0!important;margin-right:0!important}
}

/* links inside running text are underlined so they don't rely on colour alone (WCAG 1.4.1) */
#main-content p a:not(.et_pb_button):not(.button),#main-content li a:not(.et_pb_button):not(.button){text-decoration:underline;text-underline-offset:2px}

/* homepage service tiles: dark text sat directly on busy photos (faces/hair) - add a light backing
   behind the text block only. box-shadow spread, so the layout does not move. Desktop/tablet only:
   on phones the text already sits on a plain band. */
@media (min-width:768px){
  .implant-square .square-content,.apnea-square .square-content,.sedation-square .square-content{background:rgba(255,255,255,.85);box-shadow:0 0 0 14px rgba(255,255,255,.85)}
}

/* legal/statement contents rail: give the in-list links a 24px-high target (WCAG 2.5.8) */
.lg-toc a{display:inline-block;padding:3px 0}
.lg-toc li{margin-bottom:6px}

/* native forms (appointment, contact): visible labels instead of placeholder-only */
.et_pb_contact_form .et_pb_contact_form_label{display:block!important;margin:0 0 4px;font-size:14px;font-weight:600;color:#222;line-height:1.4}
.et_pb_contact_form input.input,.et_pb_contact_form select.input,.et_pb_contact_form textarea.input{border:1px solid #767676!important}
.et_pb_contact_form .input.et_contact_error{border:2px solid #B00020!important}
.et_pb_contact_form .et-pb-contact-message ul{color:#B00020}