:root {
  --acc-blue: #007bff;
  --acc-green: #2bc48a;
  --acc-text-main: #1a1a1a;
  --acc-text-muted: #6b7280;
  --acc-card-bg: #ffffff;
  --acc-panel-bg: #f3f6f9;
  --acc-z-index: 1000000;
}

/* Floating Trigger Button */
#acc-widget-btn {
  position: fixed;
  bottom: 30px;
  left: 30px;
  width: 60px;
  height: 60px;
  background: var(--acc-blue);
  color: #fff;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 8px 25px rgba(0, 123, 255, 0.35);
  z-index: var(--acc-z-index);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

#acc-widget-btn:hover {
  transform: scale(1.1) rotate(5deg);
  box-shadow: 0 12px 30px rgba(0, 123, 255, 0.45);
}

/* Accessibility Menu Floating Panel */
#acc-menu {
  position: fixed;
  bottom: 105px;
  left: 30px;
  width: 400px;
  max-width: calc(100vw - 60px);
  max-height: calc(100vh - 150px);
  background: var(--acc-panel-bg);
  border-radius: 32px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
  z-index: calc(var(--acc-z-index) + 1);
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(30px) scale(0.95);
  transform-origin: bottom left;
}

#acc-menu[aria-hidden="false"] {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

/* Overlay Backdrop */
#acc-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: var(--acc-z-index);
  display: none;
}

#acc-overlay.active {
  display: block;
}

/* Premium Header */
.acc-menu-header {
  padding: 30px 25px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: transparent;
}

.acc-header-left {
  display: flex;
  align-items: center;
  gap: 15px;
}

.acc-header-icon {
  width: 44px;
  height: 44px;
  background: var(--acc-blue);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  box-shadow: 0 4px 12px rgba(0, 123, 255, 0.2);
}

.acc-menu-header h2 {
  margin: 0;
  font-size: 1.35rem;
  font-family: inherit;
  font-weight: 800;
  color: #111 !important;
  letter-spacing: -0.02em;
}

#acc-close-btn {
  background: #e5eef7;
  border: none;
  color: #444;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  transition: background 0.2s, transform 0.2s;
}

#acc-close-btn:hover {
  background: #dbeafe;
  transform: rotate(90deg);
}

/* Scrollable Container */
.acc-menu-container {
  padding: 0 20px 25px;
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}

/* White Card for List */
.acc-main-list-card {
  background: #fff;
  border-radius: 28px;
  padding: 8px 0;
  box-shadow: 0 4px 20px rgba(0,0,0,0.02);
  margin-bottom: 25px;
}

/* Individual List Items */
.acc-feature-item {
  width: 100%;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 16px 25px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  transition: background 0.2s;
  position: relative;
  text-align: left;
}

.acc-feature-item:hover {
  background: #f8fafc;
}

.acc-item-left {
  display: flex;
  align-items: center;
  gap: 20px;
}

.acc-item-left i {
  font-size: 20px;
  color: var(--acc-blue);
  width: 24px;
  text-align: center;
  transition: transform 0.2s;
}

.acc-feature-item:hover .acc-item-left i {
  transform: scale(1.1);
}

.acc-item-label {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--acc-text-main);
  letter-spacing: -0.01em;
}

.acc-item-right {
  display: flex;
  align-items: center;
  color: #cbd5e1; /* Default toggle off color */
  font-size: 26px;
  transition: color 0.2s;
}

.acc-feature-item.active .acc-item-right {
  color: var(--acc-blue);
}

.acc-level-status {
  font-size: 1rem;
  font-weight: 800;
  color: var(--acc-blue);
}

/* Progress bar inside the list item */
.acc-feature-item .acc-progress-track {
  position: absolute;
  bottom: 0;
  left: 69px;
  right: 25px;
  width: auto;
  height: 4px;
  margin: 0;
  background: #f1f5f9;
  border-radius: 2px;
  overflow: hidden;
}

.acc-feature-item .acc-progress-bar {
  height: 100%;
  background: var(--acc-blue);
  transition: width 0.3s ease;
}

/* Divider & More Settings */
.acc-list-divider {
  height: 1px;
  background: #f1f5f9;
  margin: 4px 25px;
}

.acc-more-settings {
  padding: 20px 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  transition: background 0.2s;
  border-radius: 0 0 28px 28px;
}

.acc-more-settings:hover {
  background: #f8fafc;
}

.acc-more-left {
  display: flex;
  align-items: center;
  gap: 20px;
  font-weight: 800;
  color: var(--acc-text-main);
  font-size: 1.1rem;
}

.acc-more-left i {
  color: var(--acc-blue);
  font-size: 20px;
}

.acc-more-settings > i {
  color: #94a3b8;
  font-size: 14px;
}

/* Score Card */
.acc-score-card {
  background: #fff;
  border-radius: 28px;
  padding: 20px 25px;
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 25px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.02);
}

.acc-score-visual {
  flex-shrink: 0;
}

.acc-score-circle {
  position: relative;
  width: 75px;
  height: 75px;
}

.acc-score-svg {
  transform: rotate(-90deg);
  width: 75px;
  height: 75px;
}

.acc-score-bg {
  fill: none;
  stroke: #f1f5f9;
  stroke-width: 3.5;
}

.acc-score-fill {
  fill: none;
  stroke: var(--acc-green);
  stroke-width: 3.5;
  stroke-linecap: round;
}

.acc-score-num {
  position: absolute;
  top: 51%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-weight: 800;
  color: var(--acc-green);
  font-size: 1.45rem;
  letter-spacing: -0.02em;
}

.acc-score-text-block h3 {
  margin: 0 0 4px;
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--acc-text-main);
  letter-spacing: -0.01em;
}

.acc-score-text-block p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--acc-text-muted);
}

/* Reset Button (Professional Subtle Style) */
#acc-reset-btn {
  background: transparent;
  color: #ef4444;
  border: 2px dashed #fee2e2;
  border-radius: 20px;
  padding: 14px;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  width: 100%;
  margin-top: 5px;
}

#acc-reset-btn:hover {
  background: #fef2f2;
  border-color: #ef4444;
  border-style: solid;
}

/* Custom Overrides for Utility Classes */

/* =========================================
   PROTECT WIDGET FROM CONTRAST MODES
   (Ensures the menu stays default white/blue)
   ========================================= */

/* 1. Fix for Invert Mode (Double-Inversion) */
html[data-contrast="invert"] #acc-menu,
html[data-contrast="invert"] #acc-widget-btn {
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* Background overlay exclusion to prevent background neutralization */
html[data-contrast="invert"] #acc-overlay {
  filter: none !important;
}

/* 2. Fix for Dark/Light Contrast Modes (Forced Resets) */
html[data-contrast="dark"] #acc-menu,
html[data-contrast="light"] #acc-menu {
  background-color: var(--acc-panel-bg) !important;
  color: var(--acc-text-main) !important;
}

html[data-contrast="dark"] .acc-main-list-card,
html[data-contrast="light"] .acc-main-list-card,
html[data-contrast="dark"] .acc-score-card,
html[data-contrast="light"] .acc-score-card {
  background-color: #ffffff !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.02) !important;
}

html[data-contrast="dark"] #acc-menu h2,
html[data-contrast="light"] #acc-menu h2,
html[data-contrast="dark"] #acc-menu h3,
html[data-contrast="light"] #acc-menu h3,
html[data-contrast="dark"] .acc-item-label,
html[data-contrast="light"] .acc-item-label,
html[data-contrast="dark"] .acc-more-left span,
html[data-contrast="light"] .acc-more-left span {
  color: var(--acc-text-main) !important;
}

html[data-contrast="dark"] #acc-menu p,
html[data-contrast="light"] #acc-menu p {
  color: var(--acc-text-muted) !important;
}

html[data-contrast="dark"] #acc-menu i,
html[data-contrast="light"] #acc-menu i {
  color: var(--acc-blue) !important;
}

html[data-contrast="dark"] #acc-close-btn i,
html[data-contrast="light"] #acc-close-btn i {
  color: #444 !important;
}

html[data-contrast="dark"] .acc-score-num,
html[data-contrast="light"] .acc-score-num {
  color: var(--acc-green) !important;
}

html[data-contrast="dark"] .acc-score-fill,
html[data-contrast="light"] .acc-score-fill {
  stroke: var(--acc-green) !important;
}

html[data-contrast="dark"] .acc-level-status,
html[data-contrast="light"] .acc-level-status {
  color: var(--acc-blue) !important;
}

html[data-contrast="dark"] .acc-feature-item:hover,
html[data-contrast="light"] .acc-feature-item:hover,
html[data-contrast="dark"] .acc-more-settings:hover,
html[data-contrast="light"] .acc-more-settings:hover {
  background-color: #f8fafc !important;
}

html[data-contrast="dark"] #acc-reset-btn,
html[data-contrast="light"] #acc-reset-btn {
  background-color: transparent !important;
  color: #ef4444 !important;
}

/* =========================================
   ACCESSIBILITY FEATURES IMPLEMENTATION
   ========================================= */

/* 1. CONTRAST SYSTEM (Invert, Dark, Light) */

/* MODE 1: Invert Colors */
html[data-contrast="invert"] {
  filter: invert(100%) hue-rotate(180deg);
}

html[data-contrast="invert"] img,
html[data-contrast="invert"] video,
html[data-contrast="invert"] svg,
html[data-contrast="invert"] iframe,
html[data-contrast="invert"] .fa,
html[data-contrast="invert"] .fab,
html[data-contrast="invert"] .fas,
html[data-contrast="invert"] .far,
html[data-contrast="invert"] .fa-solid,
html[data-contrast="invert"] #acc-menu,
html[data-contrast="invert"] #acc-widget-btn,
html[data-contrast="invert"] .acc-feature-btn i {
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* Ensure background is present for inversion to work on text */
html[data-contrast="invert"] body {
  background-color: #fff;
  color: #000;
}

/* NAVBAR INVERT MODE FIX - Make navbar all black with black text */
/* In invert mode, we set WHITE which inverts to BLACK for the navbar background */
html[data-contrast="invert"] .topbar,
html[data-contrast="invert"] .main-header,
html[data-contrast="invert"] .header-sticky,
html[data-contrast="invert"] .navbar {
  background-color: #ffffff !important;
  background: #ffffff !important;
}

/* Remove all background colors from navigation elements to prevent boxing */
html[data-contrast="invert"] .main-menu ul li a,
html[data-contrast="invert"] .nav-link,
html[data-contrast="invert"] .navbar-brand .logo-text {
  background-color: transparent !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}

/* Navigation text - WHITE so it appears BLACK after inversion */
html[data-contrast="invert"] .main-menu ul li a,
html[data-contrast="invert"] .nav-link,
html[data-contrast="invert"] .navbar-brand .logo-text {
  color: #ffffff !important;
}

/* Force black icons for specifically marked items in invert mode */
html[data-contrast="invert"] .invert-icon-black,
html[data-contrast="invert"] .dark-icon-forced,
html[data-contrast="invert"] .location-btn:hover .invert-icon-cyan {
  color: #000000 !important;
}

/* Patient Fit Ticks - Make Bright Yellow in Invert Mode */
html[data-contrast="invert"] .patient-fit-bar i {
  color: #ffff00 !important;
  /* Filter normally applies to .fa-solid, keeping this "Yellow" relative to the inverted page */
}

/* Service Icons in Invert Mode - Force Black (Render White -> Global Invert -> Black) */
html[data-contrast="invert"] .icon-badge img {
  filter: brightness(0) invert(1) !important;
}

/* Arrow Buttons in Invert Mode - Force Black (Render White -> Global Invert -> Black) */
html[data-contrast="invert"] .service-btn img,
html[data-contrast="invert"] .treatment-cta-icon svg {
  filter: brightness(0) invert(1) !important;
  color: #ffffff !important;
  /* For inline SVGs using currentColor, this renders white -> global invert -> black if no double filter. 
                                BUT wait, svg has its own filter rule. Double filter? 
                                Let's treat them separately to be safe. */
}

/* Specific fix for Treatment SVGs if they use currentColor and generic svg filter applies */
html[data-contrast="invert"] .treatment-cta-icon svg {
  filter: none !important;
  /* Disable double inversion */
  color: #ffffff !important;
  /* White -> Global Invert -> Black */
  /* Or if I want Black: 
     Render White. Global Invert -> Black. 
     So just color: #fff and NO element filter.
  */
}

/* Location Icons - Bright Yellow in Invert Mode */
html[data-contrast="invert"] .loc-icon i {
  color: #ffff00 !important;
}

/* Location Icons Hover - Force Black (on Light Hover Background) - Broadest Selectors */
html[data-contrast="invert"] .location-card-pro:hover .loc-icon i,
html[data-contrast="invert"] .location-card-body:hover .loc-icon i,
html[data-contrast="invert"] .loc-item:hover .loc-icon i,
html[data-contrast="invert"] .address-block:hover .loc-icon i,
html[data-contrast="invert"] .availability-block:hover .loc-icon i {
  color: #000000 !important;
  /* Visual Black */
}

/* Custom Cursor Text Fix for Invert Mode (WAVE compliance) */
html[data-contrast="invert"] .cb-cursor-text {
  color: #000000 !important;
  /* Inverts to White */
  background-color: #ffffff !important;
  /* Inverts to Black */
  opacity: 1 !important;
}

/* Topbar text - BLACK so it appears WHITE after inversion (visible on black background) */
html[data-contrast="invert"] .topbar-contact-info ul li a,
html[data-contrast="invert"] .topbar-social-links ul li a,
html[data-contrast="invert"] .topbar-contact-info ul li a i,
html[data-contrast="invert"] .topbar-social-links ul li a i {
  color: #000000 !important;
}

/* Hover and focus states - BLACK text (appears WHITE after inversion for visibility) */
html[data-contrast="invert"] .main-menu ul li a:hover,
html[data-contrast="invert"] .main-menu ul li a:focus,
html[data-contrast="invert"] .nav-link:hover,
html[data-contrast="invert"] .nav-link:focus {
  background-color: rgba(0, 0, 0, 0.1) !important;
  /* Slight gray background (light after inversion) */
  color: #000000 !important;
  /* Black text inverts to WHITE */
  text-decoration: underline !important;
}

/* Topbar hover states - maintain black (white after inversion) */
html[data-contrast="invert"] .topbar-contact-info ul li a:hover,
html[data-contrast="invert"] .topbar-contact-info ul li a:focus,
html[data-contrast="invert"] .topbar-social-links ul li a:hover,
html[data-contrast="invert"] .topbar-social-links ul li a:focus {
  color: #000000 !important;
  text-decoration: underline !important;
}

/* Ensure topbar background is also white (black after inversion) */
html[data-contrast="invert"] .topbar,
html[data-contrast="invert"] .topbar .container {
  background-color: #ffffff !important;
}

/* FOCUS OUTLINE FIX FOR INVERT MODE */
/* Black outlines invert to WHITE for visibility against dark backgrounds */
html[data-contrast="invert"] *:focus-visible,
html[data-contrast="invert"] a:focus-visible,
html[data-contrast="invert"] button:focus-visible,
html[data-contrast="invert"] [role="button"]:focus-visible,
html[data-contrast="invert"] input:focus-visible,
html[data-contrast="invert"] select:focus-visible,
html[data-contrast="invert"] textarea:focus-visible,
html[data-contrast="invert"] [tabindex]:focus-visible {
  outline: 3px solid #000000 !important;
  /* BLACK outline inverts to WHITE */
  outline-offset: 2px !important;
  box-shadow: 0 0 0 2px #000000 !important;
  /* BLACK ring inverts to WHITE */
  z-index: 10000;
}

/* Specific fix for testimonial navigation buttons */
html[data-contrast="invert"] .testimonial-button-prev:focus-visible,
html[data-contrast="invert"] .testimonial-button-next:focus-visible {
  outline: 4px solid #000000 !important;
  /* Thicker black outline inverts to WHITE */
  outline-offset: 3px !important;
  box-shadow: 0 0 0 3px #000000 !important;
  /* BLACK spacer inverts to WHITE */
}

/* Specific fix for buttons with light backgrounds after inversion */
/* WHITE outline inverts to BLACK for visibility against light button backgrounds */
html[data-contrast="invert"] .btn-default:focus-visible,
html[data-contrast="invert"] .btn-highlighted:focus-visible,
html[data-contrast="invert"] .final-cta-btn a:focus-visible {
  outline: 4px solid #ffffff !important;
  /* WHITE outline inverts to BLACK */
  outline-offset: 4px !important;
  box-shadow: 0 0 0 4px #ffffff !important;
  /* WHITE ring inverts to BLACK */
  z-index: 10000;
}

/* Specific fix for Skip to Main Content link */
html[data-contrast="invert"] .visually-hidden-focusable:focus,
html[data-contrast="invert"] .visually-hidden-focusable:focus-visible {
  outline: 4px solid #ffffff !important;
  /* WHITE outline inverts to BLACK */
  outline-offset: 2px !important;
  box-shadow: 0 0 0 4px #ffffff !important;
  /* WHITE ring inverts to BLACK */
  background-color: #000000 !important;
  /* BLACK bg inverts to WHITE */
  color: #ffffff !important;
  /* WHITE text inverts to BLACK */
  border: 2px solid #ffffff !important;
  /* WHITE border inverts to BLACK */
  z-index: 100000 !important;
}

/* Specific fix for Topbar items - contact info and social links */
html[data-contrast="invert"] .topbar-contact-info ul li a:focus-visible,
html[data-contrast="invert"] .topbar-social-links ul li a:focus-visible {
  outline: 3px solid #ffffff !important;
  /* WHITE outline inverts to BLACK */
  outline-offset: 3px !important;
  box-shadow: 0 0 0 3px #ffffff !important;
  /* WHITE ring inverts to BLACK */
  background-color: rgba(0, 0, 0, 0.2) !important;
  /* Slight dark bg for extra visibility */
  z-index: 10000 !important;
}

/* =========================================
   DROPDOWN VIEW MORE VISIBILITY FIX (INVERT MODE)
   ========================================= */

/* Dropdown background - WHITE inverts to BLACK */
html[data-contrast="invert"] .mega-dropdown-list,
html[data-contrast="invert"] .main-menu ul ul,
html[data-contrast="invert"] .main-menu ul ul.mega-dropdown-list {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

/* View More container */
html[data-contrast="invert"] li.view-more-li,
html[data-contrast="invert"] .view-more-li,
html[data-contrast="invert"] .mega-dropdown-list .view-more-li {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  border-top: 2px solid #000000 !important;
}

/* View More link and text - BLACK inverts to WHITE */
html[data-contrast="invert"] .view-more-li a,
html[data-contrast="invert"] .view-more-li a span,
html[data-contrast="invert"] li.view-more-li a,
html[data-contrast="invert"] li.view-more-li a span {
  color: #000000 !important;
  visibility: visible !important;
  opacity: 1 !important;
  display: flex !important;
  font-weight: 700 !important;
}

/* View More arrow icon - BLACK inverts to WHITE */
html[data-contrast="invert"] .view-more-li a i,
html[data-contrast="invert"] .view-more-li a .fa-arrow-right,
html[data-contrast="invert"] .view-more-li a .fa-solid {
  color: #000000 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* View More FOCUS state - WHITE text inverts to BLACK for visibility against focus bg */
html[data-contrast="invert"] .view-more-li a:focus-visible,
html[data-contrast="invert"] .view-more-li a:focus-visible span,
html[data-contrast="invert"] li.view-more-li a:focus-visible,
html[data-contrast="invert"] li.view-more-li a:focus-visible span {
  color: #ffffff !important;
  /* WHITE inverts to BLACK - visible on focus bg */
  background-color: #000000 !important;
  /* BLACK inverts to WHITE */
}

/* View More icon FOCUS state */
html[data-contrast="invert"] .view-more-li a:focus-visible i,
html[data-contrast="invert"] .view-more-li a:focus-visible .fa-arrow-right,
html[data-contrast="invert"] .view-more-li a:focus-visible .fa-solid {
  color: #ffffff !important;
  /* WHITE inverts to BLACK */
}

/* Condition Card Icons - Bright Yellow in Invert Mode */
html[data-contrast="invert"] .condition-card .condition-icon-wrapper svg,
html[data-contrast="invert"] .condition-card .condition-icon-wrapper i {
  color: #ffff00 !important;
}

/* Condition Card Icons Hover - Black in Invert Mode */
html[data-contrast="invert"] .condition-card:hover .condition-icon-wrapper svg,
html[data-contrast="invert"] .condition-card:hover .condition-icon-wrapper i {
  color: #000000 !important;
  /* Double Invert: Black -> White -> Black */
}

/* "Check All Conditions" Arrow - Black Default, White on Hover in Invert Mode */
html[data-contrast="invert"] .btn-view-all-conditions svg {
  color: #000000 !important;
  /* Visual Black */
}

html[data-contrast="invert"] .btn-view-all-conditions:hover svg {
  color: #ffffff !important;
  /* Visual White */
}

/* MODE 2: Dark Contrast (High Contrast) */
html[data-contrast="dark"] {
  /* Re-define Global Variables for Dark Mode */
  --primary-color: #000000 !important;
  --secondary-color: #1a1a1a !important;
  --text-color: #ffffff !important;
  --accent-color: #ffff00 !important;
  /* Yellow for high vis */
  --white-color: #000000 !important;
  /* Backgrounds -> Black */
  --black-color: #ffffff !important;
  /* Text -> White */
  --divider-color: #ffffff !important;

  /* Widget specific */
  --acc-bg: #000 !important;
  --acc-text: #fff !important;

  /* Navigation Contrast Tokens */
  --nav-bg: #000000 !important;
  --nav-text: #ffffff !important;
  --nav-hover-bg: #ffff00 !important;
  --nav-hover-text: #000000 !important;
  --nav-focus-bg: #ffff00 !important;
  --nav-focus-text: #000000 !important;
  --nav-outline: #ffff00 !important;

  /* Icon Contrast Tokens */
  --icon-default: #ffffff !important;
  --icon-hover-bg: #ffff00 !important;
  --icon-hover-fg: #000000 !important;
  --icon-focus-bg: #ffff00 !important;
  --icon-focus-fg: #000000 !important;
  --icon-focus-fg: #000000 !important;
  --icon-outline: #ffff00 !important;

  /* Footer Contrast Tokens */
  --footer-bg: #000000 !important;
  --footer-text: #ffffff !important;
  --footer-muted: #e0e0e0 !important;
  --footer-link: #ffff00 !important;
  --footer-link-hover-bg: #ffff00 !important;
  --footer-link-hover-text: #000000 !important;
  /* Footer Contrast Tokens */
  --footer-bg: #000000 !important;
  --footer-text: #ffffff !important;
  --footer-muted: #e0e0e0 !important;
  --footer-link: #ffff00 !important;
  --footer-link-hover-bg: #ffff00 !important;
  --footer-link-hover-text: #000000 !important;
  --footer-focus-outline: #ffff00 !important;

  /* Play Button Contrast Tokens */
  --play-bg: #ffff00 !important;
  --play-fg: #000000 !important;
  /* Border is not visually needed if we have high contrast bg, but let's keep it safe or remove if it causes glitches. 
     User requested --play-border: #000000 in prompt root cause, but strategy said "border: none" in point 5. 
     Let's follow the STRATEGY point 5: "border: none" for the base, but point 3.1 had tokens.
     Actually, let's stick to the prompt's explicit CSS block requests. 
     Prompt point 3.1: --play-border: #000000.
     Prompt point 5: border: none; (Wait, point 5 says border: none, but point 4 says border: 2px solid...)
     Let's look at point 4: "border: 2px solid var(--play-border);" -> I will use this.
  */
  --play-border: #000000 !important;
  --play-hover-bg: #ffffff !important;
  --play-hover-fg: #000000 !important;
  --play-focus-outline: #ffffff !important;
  /* White ring against dark background for visibility? Or yellow? Prompt 3.1 said yellow outline. Prompt 8 said white focus ring. Let's use White for contrast against dark video overlay. */
  --focus-ring: #ffffff !important;
}

html[data-contrast="dark"] body {
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* GLOBAL TEXT COLOR IN DARK MODE - ENSURE NO WHITE REMAINS */
html[data-contrast="dark"] h1:not(.btn-default *):not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"] h1 *:not(.btn-default *):not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"] h2:not(.btn-default *):not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"] h2 *:not(.btn-default *):not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"] h3:not(.btn-default *):not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"]
  h3
  *:not(.btn-default *):not(.timeline-dot *):not(.step-number *):not(.visually-hidden):not(
    .sr-only
  ),
html[data-contrast="dark"] h4:not(.btn-default *):not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"]
  h4
  *:not(.btn-default *):not(.timeline-dot *):not(.step-number *):not(.visually-hidden):not(
    .sr-only
  ),
html[data-contrast="dark"] h5:not(.btn-default *):not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"]
  h5
  *:not(.btn-default *):not(.timeline-dot *):not(.step-number *):not(.visually-hidden):not(
    .sr-only
  ),
html[data-contrast="dark"] h6:not(.btn-default *):not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"]
  h6
  *:not(.btn-default *):not(.timeline-dot *):not(.step-number *):not(.visually-hidden):not(
    .sr-only
  ),
html[data-contrast="dark"] p:not(.btn-default *):not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"]
  p
  *:not(.btn-default *):not(.timeline-dot *):not(.step-number *):not(.visually-hidden):not(
    .sr-only
  ),
html[data-contrast="dark"]
  span:not(.visually-hidden):not(.sr-only):not(.btn-default *):not(.timeline-dot *):not(
    .step-number *
  ):not(.nav-link):not(.main-menu a),
html[data-contrast="dark"]
  li
  *:not(.btn-default *):not(.timeline-dot *):not(.step-number *):not(.visually-hidden):not(
    .sr-only
  ),
html[data-contrast="dark"]
  a:not(.btn-default):not(.btn-default *):not(.timeline-dot *):not(.step-number *):not(
    .nav-link:hover
  ):not(.main-menu a:hover):not(.visually-hidden-focusable):not(.visually-hidden),
html[data-contrast="dark"]
  i:not(.btn-default *):not(.timeline-dot *):not(.step-number *):not(.visually-hidden):not(
    .sr-only
  ),
html[data-contrast="dark"]
  div:not(#acc-menu *):not(.btn-default *):not(.timeline-dot):not(.timeline-dot *):not(
    .step-number
  ):not(.step-number *):not(.visually-hidden):not(.sr-only) {
  color: #ffff00 !important;
}

/* Specific fix for Book Appointment buttons/links */
html[data-contrast="dark"] .conditions-treated-section,
html[data-contrast="dark"] .condition-card,
html[data-contrast="dark"] .condition-icon-wrapper {
  background-color: #000000 !important;
  background: #000000 !important;
}

html[data-contrast="dark"] a[href*="appointment"],
html[data-contrast="dark"] a[href*="appointment"] span,
html[data-contrast="dark"] .btn-default.btn-highlighted,
html[data-contrast="dark"] .btn-default.btn-highlighted span,
html[data-contrast="dark"] .contact-us-form .btn-default.btn-highlighted,
html[data-contrast="dark"] .contact-us-form .btn-default.btn-highlighted span,
html[data-contrast="dark"] #appt-submit-btn,
html[data-contrast="dark"] #appt-submit-btn span {
  color: #ffff00 !important;
  background-color: #000000 !important;
  background: #000000 !important;
  border-color: #ffff00 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

/* Override ::before and ::after pseudo-elements on btn-default in dark mode */
/* These are overlay elements - hide them entirely to prevent covering text */
html[data-contrast="dark"] .btn-default::after,
html[data-contrast="dark"] .btn-default::before,
html[data-contrast="dark"] .btn-default span::after,
html[data-contrast="dark"] .btn-default.btn-highlighted::before,
html[data-contrast="dark"] .btn-default.btn-highlighted::after,
html[data-contrast="dark"] .btn-default.btn-highlighted span::after,
html[data-contrast="dark"] .btn-default:hover::after,
html[data-contrast="dark"] .btn-default.btn-highlighted:hover::after,
html[data-contrast="dark"] .btn-default:hover span::after,
html[data-contrast="dark"] .btn-default.btn-highlighted:hover span::after {
  display: none !important;
}

/* GLOBAL BUTTON CONTRAST FIX - DARK MODE (FORCE BLACK BG & YELLOW TEXT) */
html[data-contrast="dark"] .btn-default,
html[data-contrast="dark"] a.btn-default,
html[data-contrast="dark"] .btn-default span,
html[data-contrast="dark"] a.btn-default span,
html[data-contrast="dark"] .btn-location-primary,
html[data-contrast="dark"] .btn-location-secondary,
html[data-contrast="dark"] .cta-box .btn-default,
html[data-contrast="dark"] .cta-box .btn-default span {
  background-color: #000000 !important;
  background: #000000 !important;
  color: #ffff00 !important;
  -webkit-text-fill-color: #ffff00 !important;
  /* WAVE/Accessibility Hack: Box shadow defines the background for scan tools */
  box-shadow: inset 0 0 0 100px #000000 !important;
  border: 2px solid #ffff00 !important;
  text-decoration: none !important;
  opacity: 1 !important;
  transition: none !important;
  border-radius: 100px !important;
}

/* Suppress all pseudo-elements that might overlay the text color */
html[data-contrast="dark"] .btn-default::after,
html[data-contrast="dark"] .btn-default::before,
html[data-contrast="dark"] .btn-default span::after,
html[data-contrast="dark"] .btn-default span::before,
html[data-contrast="dark"] a.btn-default::after,
html[data-contrast="dark"] a.btn-default::before {
  display: none !important;
  content: none !important;
  opacity: 0 !important;
}

html[data-contrast="dark"] .btn-default:hover,
html[data-contrast="dark"] a.btn-default:hover,
html[data-contrast="dark"] .btn-default:hover span,
html[data-contrast="dark"] a.btn-default:hover span {
  background-color: #ffff00 !important;
  background: #ffff00 !important;
  box-shadow: inset 0 0 0 100px #ffff00 !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  border-color: #000000 !important;
}

/* Specific fix for Logo text and navigation */
html[data-contrast="dark"] .logo-text,
html[data-contrast="dark"] .main-menu ul li a,
html[data-contrast="dark"] .topbar-contact-info ul li a,
html[data-contrast="dark"] .topbar-social-links ul li a {
  color: #ffff00 !important;
}

/* Fix social links hover in dark mode (Black text on Yellow bg) */
/* Using extreme specificity with ID selector because header.php uses id="acc-social-links" */
html[data-contrast="dark"] #acc-social-links ul li a:hover,
html[data-contrast="dark"] #acc-social-links ul li a:focus,
html[data-contrast="dark"] #acc-social-links ul li a:active {
  background-color: #ffff00 !important;
  color: #000000 !important;
}

html[data-contrast="dark"] #acc-social-links ul li a:hover i,
html[data-contrast="dark"] #acc-social-links ul li a:focus i,
html[data-contrast="dark"] #acc-social-links ul li a:active i,
html[data-contrast="dark"] #acc-social-links ul li a:hover svg,
html[data-contrast="dark"] #acc-social-links ul li a:focus svg,
html[data-contrast="dark"] #acc-social-links ul li a:active svg,
html[data-contrast="dark"] #acc-social-links ul li a:hover path,
html[data-contrast="dark"] #acc-social-links ul li a:focus path {
  color: #000000 !important;
  fill: #000000 !important;
  stroke: #000000 !important;
  opacity: 1 !important;
  transition: none !important;
}

/* Ensure white text is NOT used in dark contrast mode for body elements */
html[data-contrast="dark"]
  *:not(.btn-default):not(.btn-default *):not(.timeline-dot):not(.timeline-dot *):not(
    .step-number
  ):not(.step-number *):not(.nav-link:hover):not(.main-menu a:hover):not(#acc-menu *):not(.fa):not(
    .fab
  ):not(.fas):not(.far):not(.fa-brands):not(.visually-hidden):not(.sr-only):not(
    .visually-hidden-focusable
  ) {
  color: #ffff00 !important;
}

/* Force standard text elements in Main to be yellow */
html[data-contrast="dark"] main p:not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"] main li:not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"] main span:not(.timeline-dot *):not(.step-number *),
html[data-contrast="dark"] main a:not(.btn-default):not(.timeline-dot *):not(.step-number *) {
  color: #ffff00 !important;
}

/* Light Contrast Mode - Icons */
html[data-contrast="light"] .condition-icon-wrapper svg,
html[data-contrast="light"] .condition-icon-wrapper i {
  color: #000000 !important;
  stroke: #000000 !important;
}

/* Ensure visually-hidden elements stay hidden in all contrast modes */
/* WAVE Fix: Use same color for text and background to avoid contrast errors */
html[data-contrast="dark"] .visually-hidden,
html[data-contrast="dark"] .sr-only,
html[data-contrast="light"] .visually-hidden,
html[data-contrast="light"] .sr-only,
html[data-contrast="invert"] .visually-hidden,
html[data-contrast="invert"] .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;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
  /* WAVE Fix: Use high contrast (Black on White) to satisfy tools. 
     The element remains invisible to sighted users due to clip/size. */
  color: #000000 !important;
  background-color: #ffffff !important;
}

/* Light Contrast Mode - Force dark text on light backgrounds */
html[data-contrast="light"] .page-header-box h1,
html[data-contrast="light"] .page-header-box h1 * {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Light Contrast Mode - Form labels and text */
/* Must beat .contact-us-form.appointment-form .form-label (0,3,0) from custom.css */
html[data-contrast="light"] .contact-us-form.appointment-form .form-label,
html[data-contrast="light"] .contact-us-form.appointment-form .form-label *,
html[data-contrast="light"] .contact-us-form .form-label,
html[data-contrast="light"] .contact-us-form .form-label *,
html[data-contrast="light"] .form-label,
html[data-contrast="light"] .form-label *,
html[data-contrast="light"] label,
html[data-contrast="light"] label * {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Light Contrast Mode - Step numbers */
html[data-contrast="light"] .step-number,
html[data-contrast="light"] .step-card-light .step-number,
html[data-contrast="light"] .easy-steps-section .step-number {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Light Contrast Mode - Easy steps section headings (dark bg needs white text) */
html[data-contrast="light"] .easy-steps-section .section-title h2,
html[data-contrast="light"] .easy-steps-section .section-title h2 *,
html[data-contrast="light"] .easy-steps-section .section-title .sub-title {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Light Contrast Mode - Step icon hover states */
html[data-contrast="light"] .process-step-card:hover .step-icon,
html[data-contrast="light"] .process-step-card:focus .step-icon {
  background-color: #000000 !important;
  color: #ffffff !important;
  stroke: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Light Contrast Mode - Button Highlight Hover Fix */
html[data-contrast="light"] .btn-default.btn-highlighted:hover,
html[data-contrast="light"] .btn-default.btn-highlighted:hover span,
html[data-contrast="light"] .btn-default.btn-highlighted:focus-visible,
html[data-contrast="light"] .btn-default.btn-highlighted:focus-visible span {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Light Contrast Mode - Regenexx Feature Content Refinement */
html[data-contrast="light"] .regenexx-feature-card,
html[data-contrast="light"] .regenexx-pill {
  background-color: #ffffff !important;
  background: #ffffff !important;
  border: 1px solid #000000 !important;
}

html[data-contrast="light"] .regenexx-badge {
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 1px solid #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

html[data-contrast="light"] .regenexx-header h3,
html[data-contrast="light"] .regenexx-header p,
html[data-contrast="light"] .regenexx-pill .pill-title,
html[data-contrast="light"] .regenexx-pill .pill-desc {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Skip Link Fix - Dark Mode Contrast */
/* Explicitly override the generic hidden style when focused */
html[data-contrast="dark"] .visually-hidden-focusable:focus,
html[data-contrast="dark"] .visually-hidden-focusable:active,
html[data-contrast="dark"] a.visually-hidden-focusable:focus {
  color: #ffff00 !important;
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
  clip: auto !important;
  clip-path: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
  z-index: 999999 !important;
  outline: 3px solid #ffff00 !important;
}

/* Timeline Dot Number Fix - BLACK text on yellow/white background */
html[data-contrast="dark"] .timeline-dot {
  color: #000000 !important;
  background-color: #ffff00 !important;
  border-color: #000000 !important;
}

/* Physician Credentials Card Fix - ensure BLACK bg with WHITE text */
html[data-contrast="dark"] .physician-credentials-card {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
}

html[data-contrast="dark"] .physician-credentials-card .credentials-title {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .physician-credentials-card .credentials-list li {
  color: #ffffff !important;
}

html[data-contrast="dark"] .physician-credentials-card .credentials-list li::before {
  background-color: #ffff00 !important;
}

/* Testimonial Arrows Fix - White in Dark Mode */
/* Testimonial Arrows Fix - White in Dark Mode */
html[data-contrast="dark"] .testimonial-button-prev {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
  background-image: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  /* Allow HTML arrows instead of SVGs */
}

html[data-contrast="dark"] .testimonial-button-next {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
  background-image: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  /* Allow HTML arrows instead of SVGs */
}

/* Aggressively hide all possible overlapping pseudo-elements but preserve real icons */
html[data-contrast="dark"] .testimonial-button-prev::after,
html[data-contrast="dark"] .testimonial-button-next::after,
html[data-contrast="dark"] .testimonial-button-prev::before,
html[data-contrast="dark"] .testimonial-button-next::before,
html[data-contrast="light"] .testimonial-button-prev::after,
html[data-contrast="light"] .testimonial-button-next::after,
html[data-contrast="light"] .testimonial-button-prev::before,
html[data-contrast="light"] .testimonial-button-next::before,
html[data-contrast="invert"] .testimonial-button-prev::after,
html[data-contrast="invert"] .testimonial-button-next::after,
html[data-contrast="invert"] .testimonial-button-prev::before,
html[data-contrast="invert"] .testimonial-button-next::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
}

/* Section Heading Fix for Dark Contrast - Must be more specific than custom.css */
html[data-contrast="dark"] .text-anime-style-3,
html[data-contrast="dark"] h2.text-anime-style-3,
html[data-contrast="dark"] .section-title h2,
html[data-contrast="dark"] .section-title h2.text-anime-style-3,
html[data-contrast="dark"] .our-services .text-anime-style-3,
html[data-contrast="dark"] .our-services .text-anime-style-3 *,
html[data-contrast="dark"] .our-services .section-title h2,
html[data-contrast="dark"] .about-us .text-anime-style-3,
html[data-contrast="dark"] .about-us .text-anime-style-3 *,
html[data-contrast="dark"] .how-it-work .text-anime-style-3,
html[data-contrast="dark"] .how-it-work .text-anime-style-3 *,
html[data-contrast="dark"] .quality-treatment .text-anime-style-3,
html[data-contrast="dark"] .quality-treatment .text-anime-style-3 *,
html[data-contrast="dark"] .targeted-treatments .text-anime-style-3,
html[data-contrast="dark"] .targeted-treatments .text-anime-style-3 *,
html[data-contrast="dark"] .our-testimonial .text-anime-style-3,
html[data-contrast="dark"] .our-testimonial .text-anime-style-3 *,
html[data-contrast="dark"] section .text-anime-style-3,
html[data-contrast="dark"] section .text-anime-style-3 * {
  color: #ffffff !important;
}

/* Location Card Text Visibility Fix */
html[data-contrast="dark"] .location-card-pro,
html[data-contrast="dark"] .location-card-body {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .location-card-pro h3,
html[data-contrast="dark"] .location-card-pro p,
html[data-contrast="dark"] .loc-content h3,
html[data-contrast="dark"] .loc-content p,
html[data-contrast="dark"] .loc-item p,
html[data-contrast="dark"] .availability-block p,
html[data-contrast="dark"] .address-block p {
  color: #ffffff !important;
}

html[data-contrast="dark"] .loc-icon i {
  color: #ffff00 !important;
}

/* Testimonial Section Fixes for Dark Contrast */
html[data-contrast="dark"] .testimonial-item,
html[data-contrast="dark"] .testimonial-content p,
html[data-contrast="dark"] .author-content h3,
html[data-contrast="dark"] .author-content p {
  color: #ffffff !important;
}

html[data-contrast="dark"] .testimonial-rating i {
  color: #ffff00 !important;
  /* Yellow stars for contrast */
}

/* Ensure card background is black if needed, or transparent on black section */
html[data-contrast="dark"] .testimonial-item {
  background-color: #000000 !important;
  border: 1px solid #ffffff !important;
  /* White border to define card */
}

/* Custom Cursor Text Fix for Dark Contrast */
html[data-contrast="dark"] .cb-cursor-text {
  color: #ffffff !important;
  opacity: 1 !important;
  background-color: #000000 !important;
}

/* Button Layout Fix for Contrast Modes - Prevent stacking */
/* Button Layout Fix for Contrast Modes - Prevent stacking */
html[data-contrast="dark"] .btn-default,
html[data-contrast="light"] .btn-default {
  display: inline-flex !important;
  width: auto !important;
}

/* FORCE HORIZONTAL LAYOUT via Flexbox */
html[data-contrast="dark"] .hero-content-body,
html[data-contrast="light"] .hero-content-body {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 15px !important;
}

/* Remove margins in favor of flex gap */
html[data-contrast="dark"] .hero-content-body .btn-default,
html[data-contrast="light"] .hero-content-body .btn-default {
  margin: 0 0 10px 0 !important;
}

/* Medical Condition Card Fix - BLACK text on WHITE background */
html[data-contrast="dark"] .medical-condition-card {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
}

html[data-contrast="dark"] .medical-condition-card .medical-card-title,
html[data-contrast="dark"] .medical-condition-card .condition-item span,
html[data-contrast="dark"] .medical-condition-card span {
  color: #000000 !important;
}

html[data-contrast="dark"] .medical-condition-card .condition-icon,
html[data-contrast="dark"] .medical-condition-card .condition-item i {
  color: #000000 !important;
}

html[data-contrast="dark"] .medical-condition-card .medical-divider {
  background-color: #000000 !important;
}

/* Diagnostic Dashboard / Our Approach Section Fix */
html[data-contrast="dark"] .diagnostic-dashboard-section,
html[data-contrast="dark"] .our-approach {
  background-color: #ffffff !important;
}

html[data-contrast="dark"] .diagnostic-label,
html[data-contrast="dark"] .diagnostic-title,
html[data-contrast="dark"] .diagnostic-validation,
html[data-contrast="dark"] .diagnostic-footer p {
  color: #000000 !important;
}

html[data-contrast="dark"] .diagnostic-module {
  background-color: #f5f5f5 !important;
  border: 1px solid #000000 !important;
}

html[data-contrast="dark"] .diagnostic-module .module-title,
html[data-contrast="dark"] .diagnostic-module .module-text {
  color: #000000 !important;
}

html[data-contrast="dark"] .diagnostic-module .module-icon {
  color: #000000 !important;
}

/* Narrative Scroll / Meet the Doctor Section Fix */
html[data-contrast="dark"] .narrative-scroll-section {
  background-color: #ffffff !important;
}

html[data-contrast="dark"] .narrative-label,
html[data-contrast="dark"] .narrative-headline,
html[data-contrast="dark"] .narrative-beat p,
html[data-contrast="dark"] .narrative-context p,
html[data-contrast="dark"] .fact-desc {
  color: #000000 !important;
}

html[data-contrast="dark"] .narrative-fact-item .fact-number,
html[data-contrast="dark"] .narrative-fact-item .fact-number i {
  color: #000000 !important;
}

html[data-contrast="dark"] .narrative-philosophy blockquote {
  color: #000000 !important;
  border-left-color: #000000 !important;
}

/* =========================================
   DROPDOWN MENU VISIBILITY FIX (DARK CONTRAST MODE)
   ========================================= */

/* Dropdown background - BLACK */
html[data-contrast="dark"] .mega-dropdown-list,
html[data-contrast="dark"] .main-menu ul ul,
html[data-contrast="dark"] .main-menu ul ul.mega-dropdown-list {
  background: #000000 !important;
  background-color: #000000 !important;
  border: 1px solid #ffffff !important;
}

/* All dropdown menu items - WHITE text */
html[data-contrast="dark"] .main-menu ul ul li a,
html[data-contrast="dark"] .main-menu ul ul.mega-dropdown-list li a,
html[data-contrast="dark"] .mega-dropdown-list li a,
html[data-contrast="dark"] .mega-dropdown-list .nav-item a {
  color: #ffffff !important;
  background-color: transparent !important;
}

/* Dropdown menu items hover - Yellow BG, Black text */
html[data-contrast="dark"] .main-menu ul ul li a:hover,
html[data-contrast="dark"] .main-menu ul ul li a:focus,
html[data-contrast="dark"] .mega-dropdown-list li a:hover,
html[data-contrast="dark"] .mega-dropdown-list li a:focus {
  background-color: #ffff00 !important;
  color: #000000 !important;
}

/* View More link - Yellow text for emphasis */
html[data-contrast="dark"] .view-more-li,
html[data-contrast="dark"] li.view-more-li {
  border-top: 1px solid #ffffff !important;
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html[data-contrast="dark"] .view-more-li a,
html[data-contrast="dark"] .view-more-li a span,
html[data-contrast="dark"] li.view-more-li a,
html[data-contrast="dark"] li.view-more-li a span {
  color: #ffff00 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* View More icon */
html[data-contrast="dark"] .view-more-li a i,
html[data-contrast="dark"] .view-more-li a .fa-arrow-right,
html[data-contrast="dark"] .view-more-li a .fa-solid {
  color: #ffff00 !important;
}

/* View More hover - invert colors */
html[data-contrast="dark"] .view-more-li a:hover,
html[data-contrast="dark"] .view-more-li a:focus,
html[data-contrast="dark"] .view-more-li a:hover span,
html[data-contrast="dark"] .view-more-li a:focus span {
  background-color: #ffff00 !important;
  color: #000000 !important;
}

html[data-contrast="dark"] .view-more-li a:hover i,
html[data-contrast="dark"] .view-more-li a:focus i {
  color: #000000 !important;
}

/* Fix Widget Text Visibility in Dark Mode */
html[data-contrast="dark"] #acc-menu h1,
html[data-contrast="dark"] #acc-menu h2,
html[data-contrast="dark"] #acc-menu p,
html[data-contrast="dark"] #acc-menu span,
html[data-contrast="dark"] #acc-menu i {
  color: inherit !important;
}

html[data-contrast="dark"] .acc-feature-btn {
  color: #333 !important;
  /* Ensure default text on buttons is dark */
}

html[data-contrast="dark"] .acc-feature-btn.active {
  color: #0056b3 !important;
  /* Active text color matching default active style */
}

html[data-contrast="dark"] .acc-feature-btn.active i {
  color: #0056b3 !important;
}

html[data-contrast="dark"] #acc-menu-title {
  color: #fff !important;
  /* Header is blue/dark, keep white */
}

html[data-contrast="dark"] a {
  color: #ffff00 !important;
  text-decoration: underline !important;
}

html[data-contrast="dark"] a:hover,
html[data-contrast="dark"] a:focus {
  color: #00ffff !important;
  background-color: #000000 !important;
  outline: 2px solid #ffff00 !important;
}

/* STRONGEST BUTTON OVERRIDE FOR DARK MODE */
html[data-contrast="dark"] .btn-default,
html[data-contrast="dark"] .btn-default *,
html[data-contrast="dark"] .btn-default span,
html[data-contrast="dark"] .btn-default span:not(.visually-hidden) {
  background-color: #000000 !important;
  background: #000000 !important;
  color: #ffff00 !important;
  fill: #ffff00 !important;
  -webkit-text-fill-color: #ffff00 !important;
}

/* Ensure no text-node inherits yellow inside button */
html[data-contrast="dark"] .btn-default * {
  color: #ffff00 !important;
}

/* Fix: Numbered Circles/Dots (Timeline, Steps) visibility */
html[data-contrast="dark"] .timeline-dot,
html[data-contrast="dark"] .step-number,
html[data-contrast="dark"] [class*="number"],
html[data-contrast="dark"] [class*="dot"] {
  background-color: #ffff00 !important;
  color: #000000 !important;
  border-color: #000000 !important;
  font-weight: 900 !important;
}

/* Ensure nested spans or text nodes inside dots are black */
html[data-contrast="dark"] .timeline-dot *,
html[data-contrast="dark"] .step-number * {
  color: #000000 !important;
}

/* Hide sliding backgrounds that interfere with contrast */
html[data-contrast="dark"] .btn-default::after,
html[data-contrast="dark"] .btn-default span::after {
  display: none !important;
}

/* Make arrow icon black */
html[data-contrast="dark"] .btn-default::before {
  z-index: 2 !important;
}

html[data-contrast="dark"] .btn-default,
html[data-contrast="dark"]
  button:not(#acc-widget-btn):not(.acc-feature-btn):not(#acc-close-btn):not(#acc-reset-btn),
html[data-contrast="dark"] a.final-cta-btn,
html[data-contrast="dark"] .section-btn a,
html[data-contrast="dark"] .centered-section-btn a {
  background-color: #000000 !important;
  background: #000000 !important;
  color: #ffff00 !important;
  border: 3px solid #ffff00 !important;
  font-weight: 800 !important;
  opacity: 1 !important;
}

/* Ensure icons inside final-cta-btn are properly contrasted */
html[data-contrast="dark"] a.final-cta-btn i {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .btn-default:hover,
html[data-contrast="dark"] a.final-cta-btn:hover,
html[data-contrast="dark"] .section-btn a:hover,
html[data-contrast="dark"] .centered-section-btn a:hover,
html[data-contrast="dark"] .btn-default:focus,
html[data-contrast="dark"] a.final-cta-btn:focus,
html[data-contrast="dark"] .btn-default:hover span,
html[data-contrast="dark"] .btn-default:hover *,
html[data-contrast="dark"] a.final-cta-btn:hover i {
  background-color: #ffff00 !important;
  background: #ffff00 !important;
  color: #000000 !important;
  border-color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

html[data-contrast="dark"] input,
html[data-contrast="dark"] textarea,
html[data-contrast="dark"] select {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: 2px solid #ffff00 !important;
}

/* 4. HOVER & FOCUS RULES (Strict Navigation Fix) */
html[data-contrast="dark"] .nav-link,
html[data-contrast="dark"] .main-menu ul li a {
  color: var(--nav-text) !important;
  background-color: transparent !important;
  /* Default transparent */
}

/* 4.1 Navigation Hover State */
html[data-contrast="dark"] .nav-link:hover,
html[data-contrast="dark"] .nav-link:hover *,
html[data-contrast="dark"] .main-menu ul li a:hover,
html[data-contrast="dark"] .main-menu ul li a:hover *,
html[data-contrast="dark"] .main-menu .nav-link:hover,
html[data-contrast="dark"] .main-menu .nav-link:hover *,
html[data-contrast="dark"] .main-menu ul ul li a:hover,
html[data-contrast="dark"] .main-menu ul ul li a:hover *,
html[data-contrast="dark"] .main-menu ul li:hover > a,
html[data-contrast="dark"] .main-menu ul li:hover > a * {
  background-color: var(--nav-hover-bg) !important;
  color: #000000 !important;
  fill: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 4.2 Navigation Keyboard Focus State */
html[data-contrast="dark"] .nav-link:focus-visible,
html[data-contrast="dark"] .nav-link:focus-visible *,
html[data-contrast="dark"] .main-menu ul li a:focus-visible,
html[data-contrast="dark"] .main-menu ul li a:focus-visible *,
html[data-contrast="dark"] .main-menu .nav-link:focus-visible,
html[data-contrast="dark"] .main-menu .nav-link:focus-visible *,
html[data-contrast="dark"] .main-menu ul ul li a:focus-visible,
html[data-contrast="dark"] .main-menu ul ul li a:focus-visible * {
  background-color: var(--nav-focus-bg) !important;
  color: #000000 !important;
  fill: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  outline: 3px solid #ffffff !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 2px #000000 !important;
}

/* 4.3 Logo Focus State (Dark Mode) */
html[data-contrast="dark"] .navbar-brand:focus,
html[data-contrast="dark"] .header-logo a:focus {
  background-color: #000000 !important;
  outline: 3px solid #ffff00 !important;
}

html[data-contrast="dark"] .navbar-brand:focus span,
html[data-contrast="dark"] .header-logo a:focus span,
html[data-contrast="dark"] .navbar-brand:focus i,
html[data-contrast="dark"] .header-logo a:focus i {
  color: #ffff00 !important;
  /* Force Yellow Text */
}

/* 5. ICON CONTRAST RULES (Strict Social & Action Icons) */

/* 5.1 Default Icon State */
html[data-contrast="dark"] .social-icon,
html[data-contrast="dark"] .team-social-icon ul li a,
html[data-contrast="dark"] .footer-links.social-links ul li a {
  color: var(--icon-default) !important;
  border-color: var(--icon-default) !important;
  /* Ensure borders are visible if present */
  background-color: transparent !important;
  /* Ensure no dark-on-dark default bg */
}

html[data-contrast="dark"] .social-icon i,
html[data-contrast="dark"] .team-social-icon ul li a i,
html[data-contrast="dark"] .footer-links.social-links ul li a i {
  color: inherit !important;
  /* Inherit white from parent */
}

/* 5.2 Icon Hover State */
html[data-contrast="dark"] .social-icon:hover,
html[data-contrast="dark"] .team-social-icon ul li a:hover,
html[data-contrast="dark"] .footer-links.social-links ul li a:hover {
  background-color: var(--icon-hover-bg) !important;
  color: var(--icon-hover-fg) !important;
  border-color: var(--icon-hover-bg) !important;
}

html[data-contrast="dark"] .social-icon:hover i,
html[data-contrast="dark"] .team-social-icon ul li a:hover i,
html[data-contrast="dark"] .footer-links.social-links ul li a:hover i {
  color: var(--icon-hover-fg) !important;
  /* Force Black Icon on Yellow BG */
}

/* 5.3 Icon Focus State */
html[data-contrast="dark"] .social-icon:focus-visible,
html[data-contrast="dark"] .team-social-icon ul li a:focus-visible,
html[data-contrast="dark"] .footer-links.social-links ul li a:focus-visible {
  background-color: var(--icon-focus-bg) !important;
  color: var(--icon-focus-fg) !important;
  outline: 3px solid var(--icon-outline) !important;
  outline-offset: 2px !important;
}

html[data-contrast="dark"] .social-icon:focus-visible i,
html[data-contrast="dark"] .team-social-icon ul li a:focus-visible i,
html[data-contrast="dark"] .footer-links.social-links ul li a:focus-visible i {
  color: var(--icon-focus-fg) !important;
  color: var(--icon-focus-fg) !important;
  /* Force Black Icon on Yellow BG */
}

/* 6. FOOTER CONTRAST RULES (Strict Visibility) */
html[data-contrast="dark"] footer,
html[data-contrast="dark"] .main-footer,
html[data-contrast="dark"] .footer-info-box-content p,
html[data-contrast="dark"] .footer-copyright-text p,
html[data-contrast="dark"] .about-footer-content p {
  background-color: var(--footer-bg) !important;
  color: var(--footer-text) !important;
}

html[data-contrast="dark"] .footer-logo .logo-text,
html[data-contrast="dark"] .footer-links h2,
html[data-contrast="dark"] .about-footer-content h2,
html[data-contrast="dark"] .footer-info-box-content h3 {
  color: var(--footer-text) !important;
}

/* 6.1 Footer Links (Yellow Default) */
html[data-contrast="dark"] footer a,
html[data-contrast="dark"] .footer-links ul li a,
html[data-contrast="dark"] .footer-terms-condition ul li a,
html[data-contrast="dark"] .footer-info-box-content p {
  color: var(--footer-link) !important;
}

/* 6.2 Footer Link Hover/Focus (Yellow BG / Black Text) */
html[data-contrast="dark"] footer a:hover,
html[data-contrast="dark"] footer a:focus,
html[data-contrast="dark"] .footer-links ul li a:hover,
html[data-contrast="dark"] .footer-links ul li a:focus,
html[data-contrast="dark"] .footer-terms-condition ul li a:hover,
html[data-contrast="dark"] .footer-terms-condition ul li a:focus {
  background-color: var(--footer-link-hover-bg) !important;
  color: var(--footer-link-hover-text) !important;
  outline: 2px solid var(--footer-focus-outline) !important;
  outline-offset: 2px !important;
  text-decoration: underline !important;
}

/* Ensure hover text color is explicitly black (beats global yellow rule) */
html[data-contrast="dark"] .main-footer .footer-links ul li a:hover,
html[data-contrast="dark"] .main-footer .footer-links ul li a:hover *,
html[data-contrast="dark"] .main-footer .footer-links ul li a:focus,
html[data-contrast="dark"] .main-footer .footer-links ul li a:focus *,
html[data-contrast="dark"] .main-footer .footer-terms-condition ul li a:hover,
html[data-contrast="dark"] .main-footer .footer-terms-condition ul li a:focus,
html[data-contrast="dark"] .main-footer footer a:hover,
html[data-contrast="dark"] .main-footer footer a:hover * {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 6.3 List Bullets (Ensure Visibility) */
html[data-contrast="dark"] footer ul li,
html[data-contrast="dark"] .footer-links ul li {
  color: var(--footer-text) !important;
}

html[data-contrast="dark"] footer ul li::marker,
html[data-contrast="dark"] .footer-links ul li::marker {
  color: var(--footer-text) !important;
}

/* 6.4 Footer Icons (SVG/Font) */
html[data-contrast="dark"] footer .icon-box img,
html[data-contrast="dark"] .footer-info-box .icon-box img {
  filter: invert(100%) !important;
  /* Invert dark icons to white/yellow if needed, or specific color filter */
  /* Better: Force white/yellow via CSS filter or explicit color if font-icon */
}

/* If Social Icons in Footer use the generic social-icon class, they inherit Rule 5. 
   But specific footer social link overrides might be needed if they have different structure */
html[data-contrast="dark"] .footer-links.social-links ul li a {
  border: 1px solid var(--footer-link) !important;
}

/* 7. PLAY BUTTON VISIBILITY (Hardened Focus) */
html[data-contrast="dark"] .video-play-button {
  overflow: visible !important;
  background: transparent !important;
  border: none !important;
  /* Ensure it centers itself */
  display: flex !important;
  justify-content: center;
  align-items: center;
}

html[data-contrast="dark"] .video-play-button a,
html[data-contrast="dark"] .video-play-btn a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  /* Restore full size for the ring */
  width: 168px !important;
  height: 168px !important;
  border-radius: 50% !important;

  /* No background on the main container to avoid square box */
  background-color: transparent !important;
  border: none !important;

  transition: none !important;
  transform: none !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 10 !important;
}

/* 7b. SOCIAL ICONS VISIBILITY FIX (Dark Mode) - COMPREHENSIVE */
/* Force Icons to Yellow to stand out against Black background */
html[data-contrast="dark"] .member-social-list ul li a i,
html[data-contrast="dark"] .social-icon i,
html[data-contrast="dark"] .footer-links.social-links ul li a i,
html[data-contrast="dark"] .post-social-sharing ul li a i,
html[data-contrast="dark"] .topbar-social-links a i {
  color: #ffff00 !important;
  /* Yellow Icon */
  opacity: 1 !important;
}

/* Borders / Containers */
html[data-contrast="dark"] .social-icon,
html[data-contrast="dark"] .footer-links.social-links ul li a,
html[data-contrast="dark"] .post-social-sharing ul li a,
html[data-contrast="dark"] .topbar-social-links ul li a {
  border-color: #ffff00 !important;
  /* Yellow Border */
  background-color: transparent !important;
}

/* Specific Fix for Team Member Icons (Add Layout) */
html[data-contrast="dark"] .member-social-list ul li a {
  border: 1px solid #ffff00 !important;
  background-color: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  text-decoration: none !important;
}

/* Hover States (Invert to Black on Yellow) - Mouse Only */
html[data-contrast="dark"] .member-social-list ul li a:hover,
html[data-contrast="dark"] .social-icon:hover,
html[data-contrast="dark"] .footer-links.social-links ul li a:hover,
html[data-contrast="dark"] .post-social-sharing ul li a:hover,
html[data-contrast="dark"] .topbar-social-links ul li a:hover {
  background-color: #ffff00 !important;
  color: #000000 !important;
  outline: none !important;
  /* No ring on hover */
}

/* Focus States (Invert + Spacious Outline) - Keyboard */
html[data-contrast="dark"] .member-social-list ul li a:focus-visible,
html[data-contrast="dark"] .social-icon:focus-visible,
html[data-contrast="dark"] .footer-links.social-links ul li a:focus-visible,
html[data-contrast="dark"] .post-social-sharing ul li a:focus-visible,
html[data-contrast="dark"] .topbar-social-links ul li a:focus-visible {
  background-color: #ffff00 !important;
  color: #000000 !important;
  outline: 2px solid #ffffff !important;
  /* White outer ring */
  outline-offset: 4px !important;
  /* Spacious gap */
  box-shadow: 0 0 0 4px #000000 !important;
  /* Black spacer ring */
  z-index: 100 !important;
}

/* Ensure Icon changes color on Hover */
html[data-contrast="dark"] .member-social-list ul li a:hover i,
html[data-contrast="dark"] .member-social-list ul li a:focus i,
html[data-contrast="dark"] .footer-links.social-links ul li a:hover i,
html[data-contrast="dark"] .footer-links.social-links ul li a:focus i,
html[data-contrast="dark"] .post-social-sharing ul li a:hover i,
html[data-contrast="dark"] .post-social-sharing ul li a:focus i,
html[data-contrast="dark"] .topbar-social-links ul li a:hover i,
html[data-contrast="dark"] .topbar-social-links ul li a:focus i {
  color: #000000 !important;
}

/* 8. INPUT FIELD FOCUS VISIBILITY FIX (Dark Mode) */
/* Distinguish Focus from standard Border */
html[data-contrast="dark"] input:focus-visible,
html[data-contrast="dark"] textarea:focus-visible,
html[data-contrast="dark"] select:focus-visible,
html[data-contrast="dark"] .form-control:focus-visible {
  outline: 2px solid #ffffff !important;
  /* White Outer Ring */
  outline-offset: 2px !important;
  /* Gap */
  box-shadow: 0 0 0 4px #000000 !important;
  /* Black Spacer */
  border-color: #ffff00 !important;
  /* Keep Yellow Border */
  z-index: 100 !important;
}

/* 
   RECONSTRUCTING COMPOSITE BUTTON:
   1. ::after -> Solid Yellow Center Circle 
   2. img    -> Rotating White Text Ring 
   3. ::before -> Black Play Triangle 
*/

/* 1. Yellow Center Circle */
html[data-contrast="dark"] .video-play-button a::after {
  content: "";
  position: absolute;
  width: 60px;
  /* Inner circle size */
  height: 60px;
  background-color: var(--play-bg) !important;
  /* Yellow */
  border: 2px solid var(--play-border) !important;
  /* Black Border */
  border-radius: 50%;
  z-index: 5;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

/* 2. Rotating Text Ring (Image) */
html[data-contrast="dark"] .video-play-button img,
html[data-contrast="dark"] .video-play-button svg,
html[data-contrast="dark"] .video-play-btn img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 15;
  /* sits above center circle? Or below? Usually ring is outside. Let's put it above just in case overlap. */

  /* 
     Transform Blue Ring (#023047) -> Yellow Background (#FFFF00)
     Transform White Text -> Black Text (#000000)
     Logic: Grayscale(Preserve Luminance) -> Invert(Flip Contrast) -> Colorize Yellow
  */
  filter: grayscale(100%) invert(100%) sepia(100%) saturate(5000%) hue-rotate(5deg) brightness(100%) !important;

  background-color: transparent !important;

  animation: rotate 30s infinite linear !important;
  opacity: 1 !important;
}

/* 3. Black Play Triangle */
html[data-contrast="dark"] .video-play-button a::before {
  display: flex !important;
  content: "\f04b";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 24px !important;
  color: var(--play-fg) !important;
  /* Black */
  align-items: center;
  justify-content: center;
  z-index: 20;
  /* Top most */
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

/* Hover State - Invert Colors */
html[data-contrast="dark"] .video-play-button a:hover::after,
html[data-contrast="dark"] .video-play-btn a:hover::after {
  background-color: var(--play-hover-bg) !important;
  /* White */
}

/* Keyboard Focus State (Strict Separation with High Specificity) */
html[data-contrast="dark"] .video-play-button a.popup-video:focus-visible,
html[data-contrast="dark"] .video-play-button a:focus-visible,
html[data-contrast="dark"] .video-play-btn a:focus-visible {
  outline: 4px solid #ffffff !important;
  /* Bright White */
  outline-offset: 4px !important;
  box-shadow: 0 0 0 6px #000000 !important;
  /* Thick Black Buffer */
  background-color: transparent !important;
  border-radius: 50% !important;
  z-index: 9999 !important;
  /* Max Z-Index */
  z-index: 9999 !important;
  /* Max Z-Index */
}

/* 7b. VIDEO GALLERY PLAY BUTTON FIX (Dark Mode) */
/* The Gallery Video items use a simpler structure (.video-gallery-image a::after) */
html[data-contrast="dark"] .video-gallery-image a::after {
  content: "\f04b" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;

  /* High Contrast Colors */
  background: #ffff00 !important;
  /* Yellow Background */
  color: #000000 !important;
  /* Black Icon */

  /* Reset Visibility (in case it was hidden) */
  opacity: 1 !important;
  visibility: visible !important;

  /* Ensure Size/Shape */
  width: 60px !important;
  height: 60px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 20px !important;

  /* Centering */
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 20 !important;

  /* Border for contrast against image */
  border: 2px solid #000000 !important;
}

/* Hover State for Gallery Button */
html[data-contrast="dark"] .video-gallery-image a:hover::after,
html[data-contrast="dark"] .video-gallery-image a:focus-visible::after {
  background: #ffffff !important;
  /* White Background */
  color: #000000 !important;
  /* Black Icon */
  transform: translate(-50%, -50%) scale(1.1) !important;
  /* Slight Zoom */
}

/* 8. SECTION TITLE VISIBILITY (Dark Mode Fix) */
/* If section backgrounds are forced to black/dark by global rules, text MUST be white. 
   Sometimes specific classes override this. */
html[data-contrast="dark"] .section-title h2,
html[data-contrast="dark"] .section-title .sub-title,
html[data-contrast="dark"] .section-title p,
html[data-contrast="dark"] .page-header h1,
/* Ensure Page Header Text is White */
html[data-contrast="dark"] .page-header nav ol li {
  color: #ffffff !important;
}

html[data-contrast="dark"] .page-about-faqs {
  background-color: #000000 !important;
  background-image: none !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Restore Background Images but Darkened */
html[data-contrast="dark"] .page-about-faqs::before {
  display: block !important;
  content: "" !important;
  /* Gradient Overlay to darken image + Original Image Path */
  background:
    linear-gradient(rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.85)),
    url("../images/page-about-faqs-bg-1.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: 1 !important;
  z-index: -1 !important;
  /* Ensure behind text */
}

html[data-contrast="dark"] .page-about-faqs::after {
  display: block !important;
  content: "" !important;
  /* Gradient Overlay to darken image + Original Image Path */
  background:
    linear-gradient(rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.85)),
    url("../images/page-about-faqs-bg-2.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: 1 !important;
  z-index: -1 !important;
  /* Ensure behind text */
}

/* Ensure breadcrumb links are also high contrast */
html[data-contrast="dark"] .page-header nav ol li a {
  color: #ffff00 !important;
  text-decoration: underline;
}

/* Fix Focus for Dark Mode */
html[data-contrast="dark"] body *:focus-visible {
  outline: 3px solid #ffff00 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 5px #000000 !important;
}

/* MODE 3: Light Contrast */
html[data-contrast="light"] {
  /* Re-define Global Variables for Light Mode */
  --primary-color: #ffffff !important;
  --secondary-color: #f4f4f4 !important;
  --text-color: #000000 !important;
  --accent-color: #000066 !important;
  /* Dark Blue */
  --white-color: #ffffff !important;
  --black-color: #000000 !important;
  --divider-color: #000000 !important;
}

html[data-contrast="light"] body {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* =========================================
   NAVBAR VISIBILITY FIX (LIGHT CONTRAST MODE)
   ========================================= */

/* Navbar backgrounds - WHITE */
html[data-contrast="light"] .logo-text {
  color: #000000 !important;
}

html[data-contrast="light"] .timeline-dot {
  color: #000000 !important;
  border-color: #000000 !important;
}

/* Accessibility Menu Title Fix - White Text on Blue BG */
html[data-contrast="light"] #acc-menu-title {
  color: #ffffff !important;
}

/* Service Icons in Light Contrast Mode - Force Black */
html[data-contrast="light"] .icon-badge img {
  filter: brightness(0) !important;
}

/* =======================================================
   TARGETED TREATMENTS SECTION FIX (Light Contrast Mode)
   ======================================================= */

/* Force Container Background & Text */
html[data-contrast="light"] .targeted-treatments,
html[data-contrast="light"] .treatment-areas-card,
html[data-contrast="light"] .treatment-cta-card {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* Fix List Layout (Resetting to standard vertical list) */
/* Fix List Layout - Maintain Grid but High Contrast Colors */
html[data-contrast="light"] .treatment-areas-list {
  /* Allow original grid/flex layout to persist */
  background: transparent !important;
}

html[data-contrast="light"] .treatment-areas-list li {
  /* Allow original display/width/position */
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
  /* Visible card border */
  margin-bottom: 10px !important;
  /* Ensure spacing if margins were color-dependent */
}

/* Links - Black & Underlined */
html[data-contrast="light"] .treatment-areas-list li a {
  color: #000000 !important;
  text-decoration: underline !important;
  display: inline !important;
}

/* Headings */
html[data-contrast="light"] .treatment-areas-title,
html[data-contrast="light"] .treatment-cta-content h4 {
  color: #000000 !important;
}

/* CTA Cards - Border & Arrow */
html[data-contrast="light"] .treatment-cta-card {
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] .treatment-cta-arrow {
  color: #000000 !important;
}

/* SVG Icons in CTA - Force Black by default, White on Hover against dark accents */
html[data-contrast="light"] .treatment-cta-icon svg {
  color: #000000 !important;
  stroke: #000000 !important;
  filter: none !important;
  /* Remove any inverts/filters */
}

html[data-contrast="light"] .treatment-cta-icon svg path {
  stroke: #000000 !important;
}

html[data-contrast="light"] .treatment-cta-card:hover .treatment-cta-icon svg,
html[data-contrast="light"] .treatment-cta-card:hover .treatment-cta-icon svg path {
  color: #ffffff !important;
  stroke: #ffffff !important;
}

html[data-contrast="light"] .topbar,
html[data-contrast="light"] .main-header,
html[data-contrast="light"] .header-sticky,
html[data-contrast="light"] .navbar {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-bottom: 1px solid #000000 !important;
}

/* All navbar text - BLACK */
html[data-contrast="light"] .nav-link,
html[data-contrast="light"] .main-menu ul li a,
html[data-contrast="light"] .navbar-nav .nav-link {
  color: #000000 !important;
  background-color: transparent !important;
}

/* Topbar items - BLACK */
html[data-contrast="light"] .topbar-contact-info ul li a,
html[data-contrast="light"] .topbar-social-links ul li a,
html[data-contrast="light"] .topbar-contact-info ul li a i,
html[data-contrast="light"] .topbar-social-links ul li a i {
  color: #000000 !important;
}

/* Navigation hover - Dark Blue BG, White text */
html[data-contrast="light"] .nav-link:hover,
html[data-contrast="light"] .main-menu ul li a:hover {
  background-color: #000066 !important;
  color: #ffffff !important;
}

/* Navigation focus - visible outline */
html[data-contrast="light"] .nav-link:focus-visible,
html[data-contrast="light"] .main-menu ul li a:focus-visible {
  outline: 3px solid #000066 !important;
  outline-offset: 2px !important;
  background-color: #000066 !important;
  color: #ffffff !important;
}

/* =========================================
   DROPDOWN MENU VISIBILITY FIX (LIGHT CONTRAST MODE)
   ========================================= */

/* Dropdown background - WHITE with border */
html[data-contrast="light"] .mega-dropdown-list,
html[data-contrast="light"] .main-menu ul ul,
html[data-contrast="light"] .main-menu ul ul.mega-dropdown-list {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
}

/* All dropdown menu items - BLACK text */
html[data-contrast="light"] .main-menu ul ul li a,
html[data-contrast="light"] .main-menu ul ul.mega-dropdown-list li a,
html[data-contrast="light"] .mega-dropdown-list li a,
html[data-contrast="light"] .mega-dropdown-list .nav-item a {
  color: #000000 !important;
  background-color: transparent !important;
}

/* Dropdown menu items hover - Dark Blue BG, White text */
html[data-contrast="light"] .main-menu ul ul li a:hover,
html[data-contrast="light"] .main-menu ul ul li a:focus,
html[data-contrast="light"] .mega-dropdown-list li a:hover,
html[data-contrast="light"] .mega-dropdown-list li a:focus {
  background-color: #000066 !important;
  color: #ffffff !important;
}

/* View More link - Dark Blue for emphasis */
html[data-contrast="light"] .view-more-li,
html[data-contrast="light"] li.view-more-li {
  border-top: 1px solid #000000 !important;
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html[data-contrast="light"] .view-more-li a,
html[data-contrast="light"] .view-more-li a span,
html[data-contrast="light"] li.view-more-li a,
html[data-contrast="light"] li.view-more-li a span {
  color: #000066 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* View More icon */
html[data-contrast="light"] .view-more-li a i,
html[data-contrast="light"] .view-more-li a .fa-arrow-right,
html[data-contrast="light"] .view-more-li a .fa-solid {
  color: #000066 !important;
}

/* View More hover - invert colors */
html[data-contrast="light"] .view-more-li a:hover,
html[data-contrast="light"] .view-more-li a:focus,
html[data-contrast="light"] .view-more-li a:hover span,
html[data-contrast="light"] .view-more-li a:focus span {
  background-color: #000066 !important;
  color: #ffffff !important;
}

html[data-contrast="light"] .view-more-li a:hover i,
html[data-contrast="light"] .view-more-li a:focus i {
  color: #ffffff !important;
}

/* Location Card Text Visibility Fix - Light Contrast Mode */
html[data-contrast="light"] .location-card-pro,
html[data-contrast="light"] .location-card-body {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] .location-card-pro h3,
html[data-contrast="light"] .location-card-pro p,
html[data-contrast="light"] .loc-content h3,
html[data-contrast="light"] .loc-content p,
html[data-contrast="light"] .loc-item p,
html[data-contrast="light"] .availability-block p,
html[data-contrast="light"] .address-block p {
  color: #000000 !important;
}

html[data-contrast="light"] .loc-icon i {
  color: #000066 !important;
}

/* Fix Service Process Arrow Button in Light Contrast Mode */
html[data-contrast="light"] .service-process-btn a {
  background-color: #000000 !important;
  /* Black Background for White Arrow */
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] .service-process-btn a:hover,
html[data-contrast="light"] .service-process-btn a:focus {
  background-color: #ffffff !important;
  /* White Background on Hover */
  border-color: #000000 !important;
}

html[data-contrast="light"] .service-process-btn a:hover img,
html[data-contrast="light"] .service-process-btn a:focus img {
  filter: invert(1) brightness(0) !important;
  /* Invert White Arrow to Black */
}

/* Fix Social Icons in Light Contrast Mode */
/* Force Icons to Black to stand out against White background */
html[data-contrast="light"] .member-social-list ul li a i,
html[data-contrast="light"] .social-icon i,
html[data-contrast="light"] .footer-links.social-links ul li a i,
html[data-contrast="light"] .post-social-sharing ul li a i,
html[data-contrast="light"] .topbar-social-links a i {
  color: #000000 !important;
  /* Black Icon */
  opacity: 1 !important;
}

/* Borders / Containers */
html[data-contrast="light"] .member-social-list ul li a,
html[data-contrast="light"] .social-icon,
html[data-contrast="light"] .footer-links.social-links ul li a,
html[data-contrast="light"] .post-social-sharing ul li a,
html[data-contrast="light"] .topbar-social-links ul li a {
  border-color: #000000 !important;
  /* Black Border */
  background-color: transparent !important;
}

/* Hover States (Invert to White on Black) - Mouse Only */
html[data-contrast="light"] .member-social-list ul li a:hover,
html[data-contrast="light"] .social-icon:hover,
html[data-contrast="light"] .footer-links.social-links ul li a:hover,
html[data-contrast="light"] .post-social-sharing ul li a:hover,
html[data-contrast="light"] .topbar-social-links ul li a:hover {
  background-color: #000000 !important;
  color: #ffffff !important;
  outline: none !important;
}

/* Focus States (Invert + Spacious Outline) - Keyboard */
html[data-contrast="light"] .member-social-list ul li a:focus-visible,
html[data-contrast="light"] .social-icon:focus-visible,
html[data-contrast="light"] .footer-links.social-links ul li a:focus-visible,
html[data-contrast="light"] .post-social-sharing ul li a:focus-visible,
html[data-contrast="light"] .topbar-social-links ul li a:focus-visible {
  background-color: #000000 !important;
  color: #ffffff !important;
  outline: 2px solid #000000 !important;
  /* Black outer ring */
  outline-offset: 4px !important;
  /* Spacious gap */
  box-shadow: 0 0 0 4px #ffffff !important;
  /* White spacer ring */
  z-index: 100 !important;
}

/* Ensure Icon changes color on Hover/Focus */
html[data-contrast="light"] .member-social-list ul li a:hover i,
html[data-contrast="light"] .member-social-list ul li a:focus-visible i,
html[data-contrast="light"] .footer-links.social-links ul li a:hover i,
html[data-contrast="light"] .footer-links.social-links ul li a:focus-visible i,
html[data-contrast="light"] .post-social-sharing ul li a:hover i,
html[data-contrast="light"] .post-social-sharing ul li a:focus-visible i,
html[data-contrast="light"] .topbar-social-links ul li a:hover i,
html[data-contrast="light"] .topbar-social-links ul li a:focus-visible i {
  color: #ffffff !important;
}

/* 9b. INPUT FIELD FOCUS VISIBILITY FIX (Light Mode) */
/* Distinguish Focus from standard Border using Double Ring */
html[data-contrast="light"] input:focus-visible,
html[data-contrast="light"] textarea:focus-visible,
html[data-contrast="light"] select:focus-visible,
html[data-contrast="light"] .form-control:focus-visible {
  outline: 2px solid #000000 !important;
  /* Black Outer Ring */
  outline-offset: 2px !important;
  /* Gap */
  box-shadow: 0 0 0 4px #ffffff !important;
  /* White Spacer */
  border-color: #000000 !important;
  /* Keep Black Border */
  z-index: 100 !important;
}

/* 9c. VIDEO GALLERY PLAY BUTTON FIX (Light Mode) */
/* Force Black Button with White Icon */
html[data-contrast="light"] .video-gallery-image a::after {
  content: "\f04b" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;

  /* High Contrast Colors */
  background: #000000 !important;
  /* Black Background */
  color: #ffffff !important;
  /* White Icon */

  /* Reset Visibility */
  opacity: 1 !important;
  visibility: visible !important;

  /* Ensure Size/Shape */
  width: 60px !important;
  height: 60px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 20px !important;

  /* Centering */
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 20 !important;

  /* Border for contrast */
  border: 2px solid #ffffff !important;
}

/* Hover State for Gallery Button (Light Mode) */
html[data-contrast="light"] .video-gallery-image a:hover::after,
html[data-contrast="light"] .video-gallery-image a:focus-visible::after {
  background: #ffffff !important;
  /* White Background */
  color: #000000 !important;
  /* Black Icon */
  transform: translate(-50%, -50%) scale(1.1) !important;
  border-color: #000000 !important;
}

/* 9. INVERT MODE NAVBAR FIX (Solid Background) */
/* Force White BG (becomes Black) and Black Text (becomes White) for legibility */
html[data-contrast="invert"] header,
html[data-contrast="invert"] .main-header,
html[data-contrast="invert"] .header-sticky {
  background-color: #ffffff !important;
  color: #000000 !important;
}

html[data-contrast="invert"] .main-menu ul li a,
html[data-contrast="invert"] .navbar-brand .logo-text {
  color: #000000 !important;
  /* Becomes White */
}

/* Fix Dropdown Menus in Invert Mode */
html[data-contrast="invert"] .main-menu ul ul {
  background-color: #ffffff !important;
  /* Becomes Black */
  box-shadow: none !important;
}

html[data-contrast="invert"] .main-menu ul ul li a {
  color: #000000 !important;
  /* Becomes White */
  background-color: transparent !important;
}

html[data-contrast="invert"] .main-menu ul ul li a:hover,
html[data-contrast="invert"] .main-menu ul ul li a:focus {
  background-color: #000000 !important;
  /* Becomes White highlight */
  color: #ffffff !important;
  /* Becomes Black text */
}

/* Fix Post Tags (Manual Therapy) in Invert Mode */
html[data-contrast="invert"] .post-tags a {
  background-color: #ffffff !important;
  /* Becomes Black */
  color: #000000 !important;
  /* Becomes White */
  border: 1px solid #000000 !important;
  /* Becomes White border */
}

html[data-contrast="invert"] .post-tags a:focus,
html[data-contrast="invert"] .post-tags a:focus-visible {
  background-color: #000000 !important;
  /* Becomes White */
  color: #ffffff !important;
  /* Becomes Black */
  outline: 2px solid #000000 !important;
  /* Becomes White outline */
  box-shadow: 0 0 0 4px #ffffff !important;
  /* Becomes Black buffer */
}

html[data-contrast="light"] h1,
html[data-contrast="light"] h2,
html[data-contrast="light"] h3,
html[data-contrast="light"] h4,
html[data-contrast="light"] h5,
html[data-contrast="light"] h6,
html[data-contrast="light"] p,
html[data-contrast="light"] span,
html[data-contrast="light"] li {
  color: #000000 !important;
}

html[data-contrast="light"] a {
  color: #0000ee !important;
  text-decoration: underline !important;
  font-weight: bold !important;
}

/* Boost specificity to override custom theme nav styles */
/* Boost specificity to override custom theme nav styles */
html[data-contrast="light"] body a:hover,
html[data-contrast="light"] body a:focus,
html[data-contrast="light"] .main-menu ul li a:hover,
html[data-contrast="light"] .main-menu ul li a:focus,
html[data-contrast="light"] .navbar-nav .nav-link:hover,
html[data-contrast="light"] .navbar-nav .nav-link:focus,
html[data-contrast="light"] .navbar-brand:focus,
html[data-contrast="light"] .header-logo a:focus {
  color: #000000 !important;
  background-color: #f4f4f4 !important;
  outline: 3px solid #000000 !important;
  /* Restored Thickness */
  outline-offset: 2px !important;
  /* Added Offset */
  box-shadow: 0 0 0 4px #ffffff !important;
  /* Restored White Buffer */
}

/* Ensure Logo Image is Visible in Light Mode Focus */
/* If the logo is white text, it will vanish on #f4f4f4 background. 
   We must invert it or add a border */
html[data-contrast="light"] .navbar-brand:focus img,
html[data-contrast="light"] .header-logo a:focus img {
  filter: invert(1) brightness(0) !important;
  /* Force Black Logo */
  background-color: transparent !important;
  /* Let parent handle bg */
}

/* Ensure Logo TEXT is Visible in Light Mode Focus */
html[data-contrast="light"] .navbar-brand:focus span,
html[data-contrast="light"] .header-logo a:focus span,
html[data-contrast="light"] .navbar-brand:focus i,
html[data-contrast="light"] .header-logo a:focus i {
  color: #000000 !important;
  background-color: transparent !important;
}

html[data-contrast="light"] .btn-default,
html[data-contrast="light"]
  button:not(#acc-widget-btn):not(.acc-feature-btn):not(#acc-close-btn):not(#acc-reset-btn) {
  background-color: #d60000 !important;
  color: #ffffff !important;
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] input,
html[data-contrast="light"] textarea,
html[data-contrast="light"] select {
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
}

/* Fix Focus for Light Mode */
html[data-contrast="light"] body *:focus-visible {
  outline: 3px solid #000000 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 4px #ffffff !important;
}

/* Fix Social Icons in Light Contrast Mode */
/* Prevent "Blue Underlines" and visibility issues on icon-only links */
html[data-contrast="light"] .social-icon,
html[data-contrast="light"] .team-social-icon ul li a {
  text-decoration: none !important;
  /* Remove glitchy underlines */
  background-color: transparent !important;
  /* Prevent double-backgrounds */
  border-radius: 50% !important;
  /* Ensure round if they trigger focus bg */
}

/* Force Icons to be Black (override "White" primary color) */
html[data-contrast="light"] .social-icon i,
html[data-contrast="light"] .team-social-icon ul li a i {
  color: #000000 !important;
}

/* Fix Hidden Service Button Arrow (White-on-White) in Light Mode */
html[data-contrast="light"] .service-btn a img,
html[data-contrast="light"] .more-service-btn a img {
  filter: invert(1) brightness(0) !important;
  /* Force Black Arrow */
}

/* Ensure Logo TEXT is Visible in Light Mode Focus */

/* Light Mode Video Play Button Fix */
html[data-contrast="light"] .video-play-button a.popup-video:focus,
html[data-contrast="light"] .video-play-button a.popup-video:focus-visible,
html[data-contrast="light"] .video-play-button a:focus,
html[data-contrast="light"] .video-play-button a:focus-visible {
  background-color: transparent !important;
  /* Remove the square white box */
  border-radius: 50% !important;
  /* Enforce circular focus */
  outline: 4px solid #000000 !important;
  /* Circular Outline by default, overridden by custom.css potentially if not specific */
  outline-offset: 4px !important;
  box-shadow: 0 0 0 6px #ffffff !important;
  /* White Buffer */
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  z-index: 9999 !important;
  z-index: 9999 !important;
  z-index: 9999 !important;
}

/* Fix Hardcoded White Outlines from index-2.php in Light Mode */
/* Fix Hardcoded White Outlines from index-2.php in Light Mode */
html[data-contrast="light"] .how-work-accordion .accordion-button:focus,
html[data-contrast="light"] .how-work-accordion .accordion-button:focus-visible,
html[data-contrast="light"] .btn-default:focus,
html[data-contrast="light"] .btn-default:focus-visible {
  outline: 4px solid #000000 !important;
  /* Force Black */
  outline-offset: 2px !important;
  box-shadow: 0 0 0 4px #ffffff !important;
  /* White Buffer */
  background-color: transparent !important;
  /* Prevent white fill if needed */
}

/* Testimonial Buttons - KEEP BACKGROUND OPAQUE */
html[data-contrast="light"] .testimonial-button-prev:focus-visible,
html[data-contrast="light"] .testimonial-button-next:focus-visible {
  outline: 4px solid #000000 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 4px #ffffff !important;
  background-color: #ffffff !important;
  /* Restore White Background */
}

/* Fix "Choose Plan" Pricing Button Arrow (White-on-White) */
html[data-contrast="light"] .pricing-btn a {
  padding-top: 10px !important;
  /* Increase height of focus box */
  padding-bottom: 10px !important;
  /* Increase height of focus box */
  padding-left: 10px !important;
  /* Add breathing room */
  display: inline-block !important;
}

html[data-contrast="light"] .pricing-btn a::before {
  background-color: transparent !important;
  /* Remove white bg */
  filter: invert(1) brightness(0) !important;
  /* Turn white arrow black */
  border: 1px solid #000000 !important;
  /* Keep box shape */
  /* Reverted to standard size to match theme */
  width: 40px !important;
  height: 40px !important;
  border-radius: 10px !important;
}

/* Specific Fix for "Find Out More" Button (Boosted Specificity) */
html[data-contrast="light"] body .more-service-btn a:focus,
html[data-contrast="light"] body .more-service-btn a:focus-visible,
html[data-contrast="light"] .more-service-btn a:focus,
html[data-contrast="light"] .more-service-btn a:focus-visible {
  outline: 4px solid #000000 !important;
  outline-offset: 4px !important;
  box-shadow: 0 0 0 6px #ffffff !important;
  color: #000000 !important;
  /* Force text black */
  background-color: transparent !important;
  z-index: 9999 !important;
}

/* Fix Invisible Footer Text in Light Mode */
/* Footer intentionally uses white text, which vanishes on light mode white bg. */
html[data-contrast="light"] .footer-links ul li,
html[data-contrast="light"] .footer-links ul li a,
html[data-contrast="light"] .footer-copyright-text p,
html[data-contrast="light"] .footer-info-box-content p,
html[data-contrast="light"] .footer-terms-condition ul li a,
html[data-contrast="light"] .about-footer-content p,
html[data-contrast="light"] .footer-menu ul li a,
html[data-contrast="light"] .footer-links.social-links ul li a i,
html[data-contrast="light"] .footer-links h2,
html[data-contrast="light"] .footer-links h3,
html[data-contrast="light"] .about-footer-content h3 {
  color: #000000 !important;
}

/* Ensure the bullets/icons in footer list are also visible/black */
html[data-contrast="light"] .footer-links ul li::before {
  background-color: #000000 !important;
}

/* 2. Highlight Links */
body.acc-links a {
  text-decoration: underline !important;
  text-decoration-thickness: 3px !important;
  font-weight: 900 !important;
  /* Smart Adaptation: underline color matches text color */
  text-decoration-color: currentColor !important;
}

/* Contrast Mode Overrides for Highlight Links */
html[data-contrast="dark"] body.acc-links a {
  color: #ffff00 !important;
  /* Yellow text/underline in Dark Mode */
  text-decoration-color: #ffff00 !important;
}

html[data-contrast="light"] body.acc-links a {
  color: #000000 !important;
  /* Black text/underline in Light Mode */
  text-decoration-color: #000000 !important;
}

html[data-contrast="invert"] body.acc-links a {
  color: #000000 !important;
  /* Text/Underline Black -> Inverts to White */
  text-decoration-color: #000000 !important;
}

body.acc-links a:hover,
body.acc-links a:focus {
  outline: 3px solid #ffff00 !important;
  background-color: #000 !important;
  color: #ffff00 !important;
}

/* Invert Mode Hover Fix - Prevent White Box blocking text */
html[data-contrast="invert"] body.acc-links a:hover,
html[data-contrast="invert"] body.acc-links a:focus {
  background-color: transparent !important;
  color: #000000 !important;
  /* Inverts to White */
  outline: 2px solid #000000 !important;
  /* Inverts to White */
  text-decoration-color: #000000 !important;
}

/* 3. Bigger Text (Scaling classes) - REVISED STRATEGY */
/* 
   Scaling 'body' allows 'em/rem' and inherited text (p, span, li) to grow.
   We REMOVE explicit h1-h6 targeting so we don't accidentally shrink pixel-defined headers.
   We add explicit targeting for inputs/buttons which often don't inherit font-size.
*/

/* Scale Body (Base) - INCREASED INTERVALS for distinct steps */
body.acc-text-x1 {
  font-size: 120% !important;
}

body.acc-text-x2 {
  font-size: 140% !important;
}

body.acc-text-x3 {
  font-size: 175% !important;
}

/* Scale Form Elements matches body */
body.acc-text-x1 button:not(#acc-menu *),
body.acc-text-x1 input:not(#acc-menu *),
body.acc-text-x1 select:not(#acc-menu *),
body.acc-text-x1 textarea:not(#acc-menu *) {
  font-size: 1.1em !important;
}

body.acc-text-x2 button:not(#acc-menu *),
body.acc-text-x2 input:not(#acc-menu *),
body.acc-text-x2 select:not(#acc-menu *),
body.acc-text-x2 textarea:not(#acc-menu *) {
  font-size: 1.25em !important;
}

body.acc-text-x3 button:not(#acc-menu *),
body.acc-text-x3 input:not(#acc-menu *),
body.acc-text-x3 select:not(#acc-menu *),
body.acc-text-x3 textarea:not(#acc-menu *) {
  font-size: 1.4em !important;
}

/* Fix: Ensure Section Titles (defined in px) also scale */
body.acc-text-x1 .section-title h1 {
  font-size: 65px !important;
}

body.acc-text-x1 .section-title h2 {
  font-size: 50px !important;
}

body.acc-text-x2 .section-title h1 {
  font-size: 75px !important;
}

body.acc-text-x2 .section-title h2 {
  font-size: 60px !important;
}

body.acc-text-x3 .section-title h1 {
  font-size: 85px !important;
}

body.acc-text-x3 .section-title h2 {
  font-size: 70px !important;
}

/* Fix: Hero Paragraph Scaling (Corrected Selector) */
body.acc-text-x1 .hero-content p,
body.acc-text-x1 .section-title p {
  font-size: 20px !important;
}

body.acc-text-x2 .hero-content p,
body.acc-text-x2 .section-title p {
  font-size: 24px !important;
}

body.acc-text-x3 .hero-content p,
body.acc-text-x3 .section-title p {
  font-size: 28px !important;
}

/* Fix: Appointment Intro Section Text Scaling */
/* h2 base: 48px, p base: 17px */

/* Level 1 (120%) */
body.acc-text-x1 .appointment-intro-section .intro-headline h2 {
  font-size: 58px !important;
}

body.acc-text-x1 .appointment-intro-section .intro-content-panel p {
  font-size: 20px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .appointment-intro-section .intro-headline h2 {
  font-size: 67px !important;
}

body.acc-text-x2 .appointment-intro-section .intro-content-panel p {
  font-size: 24px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .appointment-intro-section .intro-headline h2 {
  font-size: 84px !important;
}

body.acc-text-x3 .appointment-intro-section .intro-content-panel p {
  font-size: 30px !important;
}

/* Fix: Appointment Details Section Text Scaling */
/* .consultation-heading: 40px, .consultation-desc: 17px, h4: 14px, .availability-text: 18px, .form-instruction: 18px */

/* Level 1 (120%) */
body.acc-text-x1 .consultation-heading {
  font-size: 48px !important;
}

body.acc-text-x1 .consultation-desc {
  font-size: 20px !important;
}

body.acc-text-x1 .consultation-options h4 {
  font-size: 17px !important;
}

body.acc-text-x1 .availability-text {
  font-size: 22px !important;
}

body.acc-text-x1 .form-instruction {
  font-size: 22px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .consultation-heading {
  font-size: 56px !important;
}

body.acc-text-x2 .consultation-desc {
  font-size: 24px !important;
}

body.acc-text-x2 .consultation-options h4 {
  font-size: 20px !important;
}

body.acc-text-x2 .availability-text {
  font-size: 25px !important;
}

body.acc-text-x2 .form-instruction {
  font-size: 25px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .consultation-heading {
  font-size: 70px !important;
}

body.acc-text-x3 .consultation-desc {
  font-size: 30px !important;
}

body.acc-text-x3 .consultation-options h4 {
  font-size: 24px !important;
}

body.acc-text-x3 .availability-text {
  font-size: 32px !important;
}

body.acc-text-x3 .form-instruction {
  font-size: 32px !important;
}

/* Fix: Process Step Card Text Scaling (Post-Submit Details) */
/* h3 base: ~27px, p base: 16px */

/* Level 1 (120%) */
body.acc-text-x1 .process-step-card h3 {
  font-size: 32px !important;
}

body.acc-text-x1 .process-step-card p {
  font-size: 19px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .process-step-card h3 {
  font-size: 38px !important;
}

body.acc-text-x2 .process-step-card p {
  font-size: 22px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .process-step-card h3 {
  font-size: 48px !important;
}

body.acc-text-x3 .process-step-card p {
  font-size: 28px !important;
}

body.acc-text-x3 .process-step-card p {
  font-size: 28px !important;
}

/* Fix: Suitability Card Text Scaling */
/* .suitability-text base: 16px, .panel-icon base: 24px */

/* Level 1 (120%) */
body.acc-text-x1 .suitability-text {
  font-size: 19px !important;
}

body.acc-text-x1 .panel-icon {
  width: 28px !important;
  height: 28px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .suitability-text {
  font-size: 22px !important;
}

body.acc-text-x2 .panel-icon {
  width: 34px !important;
  height: 34px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .suitability-text {
  font-size: 28px !important;
}

body.acc-text-x3 .panel-icon {
  width: 42px !important;
  height: 42px !important;
}

/* Fix: Suitability Note Text Scaling */
/* .suitability-note p base: 15px */

/* Level 1 (120%) */
body.acc-text-x1 .suitability-note p {
  font-size: 18px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .suitability-note p {
  font-size: 21px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .suitability-note p {
  font-size: 26px !important;
}

/* Fix: Footer Links and Button Text Scaling */
/* .footer-links li a base: 16px, .btn-default span base: 18px */

/* Level 1 (120%) */
body.acc-text-x1 .footer-links li a {
  font-size: 19px !important;
}

body.acc-text-x1 .btn-default span {
  font-size: 22px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .footer-links li a {
  font-size: 22px !important;
}

body.acc-text-x2 .btn-default span {
  font-size: 26px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .footer-links li a {
  font-size: 28px !important;
}

body.acc-text-x3 .btn-default span {
  font-size: 32px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .suitability-note p {
  font-size: 26px !important;
}

/* Fix: Miscellaneous Appointment Page Text Scaling */
/* .section-desc-text: 18px, .clinic-name: 36px, .address-line: 18px, .step-number: 16px */

/* Level 1 (120%) */
body.acc-text-x1 .section-desc-text {
  font-size: 22px !important;
}

body.acc-text-x1 .clinic-name {
  font-size: 43px !important;
}

body.acc-text-x1 .address-line {
  font-size: 22px !important;
}

body.acc-text-x1 .step-number {
  font-size: 19px !important;
}

body.acc-text-x1 .sub-title {
  font-size: 16px !important;
}

body.acc-text-x1 .disclaimer-header h2 {
  font-size: 31px !important;
}

body.acc-text-x1 .disclaimer-text {
  font-size: 20px !important;
}

body.acc-text-x1 .disclaimer-icon {
  width: 38px !important;
  height: 38px !important;
}

body.acc-text-x1 .cta-title {
  font-size: 43px !important;
}

body.acc-text-x1 .cta-text {
  font-size: 23px !important;
}

body.acc-text-x1 .cta-rectangular-link {
  font-size: 19px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .section-desc-text {
  font-size: 25px !important;
}

body.acc-text-x2 .clinic-name {
  font-size: 50px !important;
}

body.acc-text-x2 .address-line {
  font-size: 25px !important;
}

body.acc-text-x2 .step-number {
  font-size: 22px !important;
}

body.acc-text-x2 .sub-title {
  font-size: 18px !important;
}

body.acc-text-x2 .disclaimer-header h2 {
  font-size: 36px !important;
}

/* Fix: Factor Items Text Scaling */
/* Base: .factor-text 19px, .factor-icon 40px (approx), .goal-text 24px */

/* Level 1 (120%) */
body.acc-text-x1 .factor-text {
  font-size: 23px !important;
}

body.acc-text-x1 .factor-icon {
  font-size: 48px !important;
}

body.acc-text-x1 .goal-text {
  font-size: 29px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .factor-text {
  font-size: 27px !important;
}

body.acc-text-x2 .factor-icon {
  font-size: 56px !important;
}

body.acc-text-x2 .goal-text {
  font-size: 34px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .factor-text {
  font-size: 33px !important;
}

body.acc-text-x3 .factor-icon {
  font-size: 70px !important;
}

body.acc-text-x3 .goal-text {
  font-size: 42px !important;
}

/* Fix: Physician Section Text Scaling */
/* Base: .physician-title 36px, .physician-intro-text 19px */

/* Level 1 (120%) */
body.acc-text-x1 .physician-title {
  font-size: 43px !important;
}

body.acc-text-x1 .physician-intro-text {
  font-size: 23px !important;
}

/* Physician Highlight Section (index.php) Level 1 */
body.acc-text-x1 .physician-highlight-section h2 {
  font-size: clamp(38px, 6vw, 58px) !important;
}
body.acc-text-x1 .physician-highlight-section .sub-title {
  font-size: 18px !important;
}
body.acc-text-x1 .physician-highlight-section .physician-info-wrap p {
  font-size: 24px !important;
}
body.acc-text-x1 .physician-highlight-section strong {
  font-size: 28px !important;
}
body.acc-text-x1 .physician-highlight-section i {
  font-size: 22px !important;
}
body.acc-text-x1 .physician-highlight-section .physician-image-container span:first-child {
  font-size: 34px !important;
}
body.acc-text-x1 .physician-highlight-section .physician-image-container span:last-child {
  font-size: 15px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .physician-title {
  font-size: 50px !important;
}

body.acc-text-x2 .physician-intro-text {
  font-size: 27px !important;
}

/* Physician Highlight Section (index.php) Level 2 */
body.acc-text-x2 .physician-highlight-section h2 {
  font-size: clamp(45px, 7vw, 67px) !important;
}
body.acc-text-x2 .physician-highlight-section .sub-title {
  font-size: 22px !important;
}
body.acc-text-x2 .physician-highlight-section .physician-info-wrap p {
  font-size: 28px !important;
}
body.acc-text-x2 .physician-highlight-section strong {
  font-size: 32px !important;
}
body.acc-text-x2 .physician-highlight-section i {
  font-size: 25px !important;
}
body.acc-text-x2 .physician-highlight-section .physician-image-container span:first-child {
  font-size: 40px !important;
}
body.acc-text-x2 .physician-highlight-section .physician-image-container span:last-child {
  font-size: 18px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .physician-title {
  font-size: 63px !important;
}

body.acc-text-x3 .physician-intro-text {
  font-size: 33px !important;
}

/* Physician Highlight Section (index.php) Level 3 */
body.acc-text-x3 .physician-highlight-section h2 {
  font-size: clamp(56px, 9vw, 84px) !important;
}
body.acc-text-x3 .physician-highlight-section .sub-title {
  font-size: 28px !important;
}
body.acc-text-x3 .physician-highlight-section .physician-info-wrap p {
  font-size: 34px !important;
}
body.acc-text-x3 .physician-highlight-section strong {
  font-size: 38px !important;
}
body.acc-text-x3 .physician-highlight-section i {
  font-size: 32px !important;
}

/* Patient Journey Vertical (index.php) Level 1 */
body.acc-text-x1 .patient-journey-vertical h2 {
  font-size: clamp(40px, 6vw, 64px) !important;
}
body.acc-text-x1 .patient-journey-vertical .sub-title {
  font-size: 1.1rem !important;
}
body.acc-text-x1 .patient-journey-vertical h3 {
  font-size: 2.1rem !important;
}
body.acc-text-x1 .patient-journey-vertical p {
  font-size: 1.35rem !important;
}
body.acc-text-x1 .patient-journey-vertical .journey-step-number {
  font-size: 1.8rem !important;
}
body.acc-text-x1 .patient-journey-vertical i {
  font-size: 28px !important;
}

/* Level 2 */
body.acc-text-x2 .patient-journey-vertical h2 {
  font-size: clamp(48px, 7vw, 75px) !important;
}
body.acc-text-x2 .patient-journey-vertical .sub-title {
  font-size: 1.3rem !important;
}
body.acc-text-x2 .patient-journey-vertical h3 {
  font-size: 2.45rem !important;
}
body.acc-text-x2 .patient-journey-vertical p {
  font-size: 1.6rem !important;
}
body.acc-text-x2 .patient-journey-vertical .journey-step-number {
  font-size: 2.1rem !important;
}
body.acc-text-x2 .patient-journey-vertical i {
  font-size: 34px !important;
}

/* Level 3 */
body.acc-text-x3 .patient-journey-vertical h2 {
  font-size: clamp(60px, 9vw, 92px) !important;
}
body.acc-text-x3 .patient-journey-vertical .sub-title {
  font-size: 1.6rem !important;
}
body.acc-text-x3 .patient-journey-vertical h3 {
  font-size: 3rem !important;
}
body.acc-text-x3 .patient-journey-vertical p {
  font-size: 2rem !important;
}
body.acc-text-x3 .patient-journey-vertical .journey-step-number {
  font-size: 2.6rem !important;
}
body.acc-text-x3 .patient-journey-vertical i {
  font-size: 42px !important;
}

/* Location Nexus Section (index.php) Level 1 */
body.acc-text-x1 .location-nexus-section h2 {
  font-size: clamp(38px, 6vw, 52px) !important;
}
body.acc-text-x1 .location-nexus-section .sub-title {
  font-size: 18px !important;
}
body.acc-text-x1 .location-nexus-section p {
  font-size: 1.35rem !important;
}
body.acc-text-x1 .location-neighborhood-tag {
  font-size: 1.15rem !important;
}
body.acc-text-x1 .location-card-main h3 {
  font-size: 1.8rem !important;
}
body.acc-text-x1 .location-card-main p {
  font-size: 1.5rem !important;
}
body.acc-text-x1 .location-card-main span {
  font-size: 1.15rem !important;
}
body.acc-text-x1 .location-btn {
  font-size: 1.25rem !important;
}

/* Level 2 */
body.acc-text-x2 .location-nexus-section h2 {
  font-size: clamp(44px, 7vw, 62px) !important;
}
body.acc-text-x2 .location-nexus-section .sub-title {
  font-size: 22px !important;
}
body.acc-text-x2 .location-nexus-section p {
  font-size: 1.6rem !important;
}
body.acc-text-x2 .location-neighborhood-tag {
  font-size: 1.35rem !important;
}
body.acc-text-x2 .location-card-main h3 {
  font-size: 2.1rem !important;
}
body.acc-text-x2 .location-card-main p {
  font-size: 1.75rem !important;
}
body.acc-text-x2 .location-card-main span {
  font-size: 1.35rem !important;
}
body.acc-text-x2 .location-btn {
  font-size: 1.45rem !important;
}

/* Level 3 */
body.acc-text-x3 .location-nexus-section h2 {
  font-size: clamp(54px, 9vw, 84px) !important;
}
body.acc-text-x3 .location-nexus-section .sub-title {
  font-size: 28px !important;
}
body.acc-text-x3 .location-nexus-section p {
  font-size: 2rem !important;
}
body.acc-text-x3 .location-neighborhood-tag {
  font-size: 1.7rem !important;
}
body.acc-text-x3 .location-card-main h3 {
  font-size: 2.6rem !important;
}
body.acc-text-x3 .location-card-main p {
  font-size: 2.2rem !important;
}
body.acc-text-x3 .location-card-main span {
  font-size: 1.7rem !important;
}
body.acc-text-x3 .location-btn {
  font-size: 1.85rem !important;
}

/* Testimonials Impact Section (index.php) Level 1 */
body.acc-text-x1 .our-testimonial-impact h2 {
  font-size: clamp(38px, 6vw, 58px) !important;
}
body.acc-text-x1 .our-testimonial-impact .sub-title {
  font-size: 18px !important;
}
body.acc-text-x1 .our-testimonial-impact p {
  font-size: 1.35rem !important;
}
body.acc-text-x1 .our-testimonial-impact .author-content h3 {
  font-size: 1.35rem !important;
}
body.acc-text-x1 .our-testimonial-impact .author-content p {
  font-size: 1.1rem !important;
}

/* Level 2 */
body.acc-text-x2 .our-testimonial-impact h2 {
  font-size: clamp(45px, 7vw, 67px) !important;
}
body.acc-text-x2 .our-testimonial-impact .sub-title {
  font-size: 22px !important;
}
body.acc-text-x2 .our-testimonial-impact p {
  font-size: 1.55rem !important;
}
body.acc-text-x2 .our-testimonial-impact .author-content h3 {
  font-size: 1.55rem !important;
}
body.acc-text-x2 .our-testimonial-impact .author-content p {
  font-size: 1.3rem !important;
}

/* Level 3 */
body.acc-text-x3 .our-testimonial-impact h2 {
  font-size: clamp(56px, 9vw, 84px) !important;
}
body.acc-text-x3 .our-testimonial-impact .sub-title {
  font-size: 28px !important;
}
body.acc-text-x3 .our-testimonial-impact p {
  font-size: 1.9rem !important;
}
body.acc-text-x3 .our-testimonial-impact .author-content h3 {
  font-size: 1.9rem !important;
}
body.acc-text-x3 .our-testimonial-impact .author-content p {
  font-size: 1.6rem !important;
}

/* Final CTA Impact Section (index.php) Level 1 */
body.acc-text-x1 .final-cta-impact h2 {
  font-size: clamp(38px, 5vw, 60px) !important;
}
body.acc-text-x1 .final-cta-impact .cta-badge {
  font-size: 1.1rem !important;
}
body.acc-text-x1 .final-cta-impact p {
  font-size: 1.45rem !important;
}
body.acc-text-x1 .final-cta-btn {
  font-size: 1.35rem !important;
}
body.acc-text-x1 .final-cta-btn i {
  font-size: 1.2rem !important;
}

/* Level 2 */
body.acc-text-x2 .final-cta-impact h2 {
  font-size: clamp(45px, 6vw, 72px) !important;
}
body.acc-text-x2 .final-cta-impact .cta-badge {
  font-size: 1.3rem !important;
}
body.acc-text-x2 .final-cta-impact p {
  font-size: 1.7rem !important;
}
body.acc-text-x2 .final-cta-btn {
  font-size: 1.6rem !important;
}
body.acc-text-x2 .final-cta-btn i {
  font-size: 1.4rem !important;
}

/* Level 3 */
body.acc-text-x3 .final-cta-impact h2 {
  font-size: clamp(56px, 8vw, 90px) !important;
}
body.acc-text-x3 .final-cta-impact .cta-badge {
  font-size: 1.7rem !important;
}
body.acc-text-x3 .final-cta-impact p {
  font-size: 2.1rem !important;
}
body.acc-text-x3 .final-cta-btn {
  font-size: 2rem !important;
}
body.acc-text-x3 .final-cta-btn i {
  font-size: 1.8rem !important;
}
body.acc-text-x3 .physician-highlight-section .physician-image-container span:first-child {
  font-size: 50px !important;
}
body.acc-text-x3 .physician-highlight-section .physician-image-container span:last-child {
  font-size: 22px !important;
}

/* Fix: Primary Button Text Scaling */
/* Base: 16px approx */

body.acc-text-x1 .primary-btn {
  font-size: 19px !important;
}

body.acc-text-x2 .primary-btn {
  font-size: 22px !important;
}

body.acc-text-x3 .primary-btn {
  font-size: 28px !important;
}

/* Fix: Condition Text Scaling */
/* Base: 18px */

body.acc-text-x1 .condition-text {
  font-size: 22px !important;
}

body.acc-text-x2 .condition-text {
  font-size: 25px !important;
}

body.acc-text-x3 .condition-text {
  font-size: 32px !important;
}

/* Fix: Treatment Options Text Scaling */
/* Base: h4 20px, p 16px, .read-more-link 14px */

/* Level 1 (120%) */
body.acc-text-x1 .treatment-card h4 {
  font-size: 24px !important;
}

body.acc-text-x1 .treatment-card p {
  font-size: 19px !important;
}

body.acc-text-x1 .read-more-link {
  font-size: 17px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .treatment-card h4 {
  font-size: 28px !important;
}

body.acc-text-x2 .treatment-card p {
  font-size: 22px !important;
}

body.acc-text-x2 .read-more-link {
  font-size: 20px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .treatment-card h4 {
  font-size: 35px !important;
}

body.acc-text-x3 .treatment-card p {
  font-size: 28px !important;
}

body.acc-text-x3 .read-more-link {
  font-size: 25px !important;
}

body.acc-text-x2 .disclaimer-text {
  font-size: 24px !important;
}

body.acc-text-x2 .disclaimer-icon {
  width: 45px !important;
  height: 45px !important;
}

body.acc-text-x2 .cta-title {
  font-size: 50px !important;
}

body.acc-text-x2 .cta-text {
  font-size: 27px !important;
}

body.acc-text-x2 .cta-rectangular-link {
  font-size: 22px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .section-desc-text {
  font-size: 32px !important;
}

body.acc-text-x3 .clinic-name {
  font-size: 63px !important;
}

body.acc-text-x3 .address-line {
  font-size: 32px !important;
}

body.acc-text-x3 .step-number {
  font-size: 28px !important;
}

body.acc-text-x3 .sub-title {
  font-size: 23px !important;
}

body.acc-text-x3 .disclaimer-header h2 {
  font-size: 45px !important;
}

body.acc-text-x3 .disclaimer-text {
  font-size: 30px !important;
}

body.acc-text-x3 .disclaimer-icon {
  width: 56px !important;
  height: 56px !important;
}

body.acc-text-x3 .cta-title {
  font-size: 63px !important;
}

body.acc-text-x3 .cta-text {
  font-size: 33px !important;
}

body.acc-text-x3 .cta-rectangular-link {
  font-size: 28px !important;
}

/* Fix: Pain Care Section Text Scaling (Overrides Inline REM) */

/* Level 1 */
body.acc-text-x1 .spine-heading {
  font-size: 42px !important;
}

body.acc-text-x1 .spine-sub {
  font-size: 21px !important;
}

body.acc-text-x1 .timeline-content h3 {
  font-size: 22px !important;
}

body.acc-text-x1 .checklist-header {
  font-size: 21px !important;
}

body.acc-text-x1 .patient-fit-bar div {
  font-size: 18px !important;
}

/* Level 2 */
body.acc-text-x2 .spine-heading {
  font-size: 48px !important;
}

body.acc-text-x2 .spine-sub {
  font-size: 25px !important;
}

body.acc-text-x2 .timeline-content h3 {
  font-size: 26px !important;
}

body.acc-text-x2 .checklist-header {
  font-size: 25px !important;
}

body.acc-text-x2 .patient-fit-bar div {
  font-size: 21px !important;
}

/* Level 3 */
body.acc-text-x3 .spine-heading {
  font-size: 60px !important;
}

body.acc-text-x3 .spine-sub {
  font-size: 30px !important;
}

body.acc-text-x3 .timeline-content h3 {
  font-size: 32px !important;
}

body.acc-text-x3 .checklist-header {
  font-size: 30px !important;
}

body.acc-text-x3 .patient-fit-bar div {
  font-size: 26px !important;
}

/* Fix: Clinical List Text Scaling & Wrapping */
body.acc-text-x1 .clinical-term,
body.acc-text-x1 .clinical-term a {
  font-size: 20px !important;
  white-space: normal !important;
  line-height: 1.3 !important;
}

body.acc-text-x2 .clinical-term,
body.acc-text-x2 .clinical-term a {
  font-size: 24px !important;
  white-space: normal !important;
  line-height: 1.3 !important;
}

body.acc-text-x3 .clinical-term,
body.acc-text-x3 .clinical-term a {
  font-size: 28px !important;
  white-space: normal !important;
  line-height: 1.3 !important;
}

/* Fix: Process Steps Text Scaling */
body.acc-text-x1 .step-content h3 {
  font-size: 24px !important;
}

body.acc-text-x1 .step-content p {
  font-size: 20px !important;
}

body.acc-text-x2 .step-content h3 {
  font-size: 28px !important;
}

body.acc-text-x2 .step-content p {
  font-size: 24px !important;
}

body.acc-text-x3 .step-content h3 {
  font-size: 32px !important;
}

body.acc-text-x3 .step-content p {
  font-size: 28px !important;
}

/* Fix: Location Text Scaling */
body.acc-text-x1 .loc-content h3 {
  font-size: 24px !important;
}

body.acc-text-x1 .loc-content p {
  font-size: 20px !important;
}

body.acc-text-x2 .loc-content h3 {
  font-size: 28px !important;
}

body.acc-text-x2 .loc-content p {
  font-size: 24px !important;
}

body.acc-text-x3 .loc-content h3 {
  font-size: 32px !important;
}

body.acc-text-x3 .loc-content p {
  font-size: 28px !important;
}

/* Fix: Final CTA Text Scaling (Increased Sizes) */
body.acc-text-x1 .final-cta-content h2 {
  font-size: 60px !important;
}

body.acc-text-x1 .final-cta-content p {
  font-size: 24px !important;
}

body.acc-text-x2 .final-cta-content h2 {
  font-size: 70px !important;
}

body.acc-text-x2 .final-cta-content p {
  font-size: 28px !important;
}

body.acc-text-x3 .final-cta-content h2 {
  font-size: 80px !important;
}

body.acc-text-x3 .final-cta-content p {
  font-size: 32px !important;
}

/* Fix: Footer Heading Scaling (Links & About) - Increased Sizes */
body.acc-text-x1 .footer-links h2,
body.acc-text-x1 .about-footer-content h2 {
  font-size: 36px !important;
}

body.acc-text-x2 .footer-links h2,
body.acc-text-x2 .about-footer-content h2 {
  font-size: 42px !important;
}

body.acc-text-x3 .footer-links h2,
body.acc-text-x3 .about-footer-content h2 {
  font-size: 48px !important;
}

/* Fix: Footer About Paragraph Scaling */
body.acc-text-x1 .about-footer-content p {
  font-size: 20px !important;
}

body.acc-text-x2 .about-footer-content p {
  font-size: 24px !important;
}

body.acc-text-x3 .about-footer-content p {
  font-size: 28px !important;
}

/* Scaling for headers/containers to prevent clipping */
body.acc-text-x1 .container,
body.acc-text-x2 .container,
body.acc-text-x3 .container {
  max-width: 95% !important;
  width: 95% !important;
}

body.acc-text-x1 .row,
body.acc-text-x2 .row,
body.acc-text-x3 .row {
  height: auto !important;
}

body.acc-text-x1 section,
body.acc-text-x2 section,
body.acc-text-x3 section {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

/* Fix: Ensure Page Header Titles (66px) also scale */
body.acc-text-x1 .page-header-box h1 {
  font-size: 75px !important;
}

body.acc-text-x2 .page-header-box h1 {
  font-size: 85px !important;
}

body.acc-text-x3 .page-header-box h1 {
  font-size: 100px !important;
}

/* Fix: Rehab Benefits Text (18px) not scaling */
body.acc-text-x1 .rehab-benefits-content h3 {
  font-size: 20px !important;
}

body.acc-text-x2 .rehab-benefits-content h3 {
  font-size: 24px !important;
}

body.acc-text-x3 .rehab-benefits-content h3 {
  font-size: 26px !important;
  /* Adjusted for narrow column fit */
  word-wrap: break-word !important;
  hyphens: auto !important;
}

/* Fix: Rehab Benefits Box Layout for Large Text */
body.acc-text-x1 .rehab-benefits-item,
body.acc-text-x2 .rehab-benefits-item,
body.acc-text-x3 .rehab-benefits-item {
  height: auto !important;
  min-height: 100% !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}

/* Fix: Service Entry List (16px) and Headers not scaling */
body.acc-text-x1 .service-entry ul li {
  font-size: 20px !important;
}

body.acc-text-x2 .service-entry ul li {
  font-size: 24px !important;
}

body.acc-text-x3 .service-entry ul li {
  font-size: 28px !important;
}

/* Fix: Blog Post Titles (22px) not scaling */
body.acc-text-x1 .post-item-body h2 {
  font-size: 26px !important;
}

body.acc-text-x2 .post-item-body h2 {
  font-size: 31px !important;
}

body.acc-text-x3 .post-item-body h2 {
  font-size: 38px !important;
}

/* Fix: Blog Dates (14px) not scaling */
body.acc-text-x1 .article-meta ul li a {
  font-size: 18px !important;
}

body.acc-text-x2 .article-meta ul li a {
  font-size: 21px !important;
}

body.acc-text-x3 .article-meta ul li a {
  font-size: 24px !important;
}

/* Fix: Blog Post Lists (18px) to scale */
body.acc-text-x1 .post-entry ul li,
body.acc-text-x1 .post-entry ol li {
  font-size: 22px !important;
}

body.acc-text-x2 .post-entry ul li,
body.acc-text-x2 .post-entry ol li {
  font-size: 26px !important;
}

body.acc-text-x3 .post-entry ul li,
body.acc-text-x3 .post-entry ol li {
  font-size: 32px !important;
}

/* Fix: Blog Tags Label (22px) and Links (16px) not scaling */
body.acc-text-x1 .tag-links {
  font-size: 26px !important;
}

body.acc-text-x2 .tag-links {
  font-size: 30px !important;
}

body.acc-text-x3 .tag-links {
  font-size: 36px !important;
}

body.acc-text-x1 .post-tags .tag-links a {
  font-size: 20px !important;
}

body.acc-text-x2 .post-tags .tag-links a {
  font-size: 24px !important;
}

body.acc-text-x3 .post-tags .tag-links a {
  font-size: 30px !important;
}

/* Fix: Blockquote Text (20px) not scaling */
body.acc-text-x1 .post-entry blockquote p {
  font-size: 24px !important;
}

body.acc-text-x2 .post-entry blockquote p {
  font-size: 28px !important;
}

body.acc-text-x3 .post-entry blockquote p {
  font-size: 34px !important;
}

body.acc-text-x3 .post-item-body h2 {
  font-size: 38px !important;
}

body.acc-text-x1 .service-entry h2 {
  font-size: 42px !important;
}

body.acc-text-x2 .service-entry h2 {
  font-size: 48px !important;
}

body.acc-text-x3 .service-entry h2 {
  font-size: 60px !important;
}

/* Fix: Therapy/Rehabilitation Item Collision at Large Text Sizes */
/* Convert from Image-Height to Text-Height layout */
body.acc-text-x2 .therapy-rehabilitation-item,
body.acc-text-x3 .therapy-rehabilitation-item {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  /* Contain image */
}

body.acc-text-x2 .therapy-rehabilitation-image,
body.acc-text-x3 .therapy-rehabilitation-image {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100% !important;
  z-index: 0 !important;
}

body.acc-text-x2 .therapy-rehabilitation-header,
body.acc-text-x3 .therapy-rehabilitation-header {
  position: relative !important;
  top: auto !important;
  padding-bottom: 0 !important;
  /* Stack with body */
  flex-shrink: 0 !important;
}

body.acc-text-x2 .therapy-rehabilitation-body,
body.acc-text-x3 .therapy-rehabilitation-body {
  position: relative !important;
  bottom: auto !important;
  flex-shrink: 0 !important;
  padding-top: 10px !important;
}

/* Fix: Ensure Navbar Links (16px) and Buttons (18px) scale */
body.acc-text-x1 .main-menu ul li a {
  font-size: 20px !important;
}

body.acc-text-x1 .btn-default span {
  font-size: 22px !important;
}

body.acc-text-x2 .main-menu ul li a {
  font-size: 23px !important;
}

body.acc-text-x2 .btn-default span {
  font-size: 26px !important;
}

body.acc-text-x3 .main-menu ul li a {
  font-size: 28px !important;
}

body.acc-text-x3 .btn-default span {
  font-size: 32px !important;
}

/* Fix: Team Member Name (30px) and Role (18px) not scaling in Team Single */
body.acc-text-x1 .member-detail-title h2 {
  font-size: 36px !important;
}

body.acc-text-x1 .member-detail-title p {
  font-size: 22px !important;
}

body.acc-text-x2 .member-detail-title h2 {
  font-size: 42px !important;
}

body.acc-text-x2 .member-detail-title p {
  font-size: 26px !important;
}

body.acc-text-x3 .member-detail-title h2 {
  font-size: 52px !important;
}

body.acc-text-x3 .member-detail-title p {
  font-size: 32px !important;
}

/* Fix: Team Detail List (Experience, Email, etc.) not scaling */
body.acc-text-x1 .member-detail-list-content h3 {
  font-size: 28px !important;
}

body.acc-text-x1 .member-detail-list-content p {
  font-size: 20px !important;
}

body.acc-text-x2 .member-detail-list-content h3 {
  font-size: 34px !important;
}

body.acc-text-x2 .member-detail-list-content p {
  font-size: 24px !important;
}

body.acc-text-x3 .member-detail-list-content h3 {
  font-size: 40px !important;
}

body.acc-text-x3 .member-detail-list-content p {
  font-size: 28px !important;
}

/* Fix: Therapy Rehabilitation Titles (26px) not scaling */
body.acc-text-x1 .therapy-rehabilitation-title h3 {
  font-size: 32px !important;
}

body.acc-text-x2 .therapy-rehabilitation-title h3 {
  font-size: 38px !important;
}

body.acc-text-x3 .therapy-rehabilitation-title h3 {
  font-size: 44px !important;
}

/* Fix: Therapy Process Titles (22px) not scaling in About Page */
body.acc-text-x1 .therapy-process-item-content h3 {
  font-size: 26px !important;
}

/* Scaling up from 22px */
body.acc-text-x2 .therapy-process-item-content h3 {
  font-size: 32px !important;
}

body.acc-text-x3 .therapy-process-item-content h3 {
  font-size: 40px !important;
}

/* Fix: Team Member Names (22px) and Roles (16px) */
body.acc-text-x1 .team-content h3 {
  font-size: 26px !important;
}

body.acc-text-x1 .team-content p {
  font-size: 20px !important;
}

body.acc-text-x2 .team-content h3 {
  font-size: 32px !important;
}

body.acc-text-x2 .team-content p {
  font-size: 24px !important;
}

body.acc-text-x3 .team-content h3 {
  font-size: 38px !important;
}

body.acc-text-x1 .team-content h2 {
  font-size: 28px !important;
}

body.acc-text-x2 .team-content h2 {
  font-size: 34px !important;
}

body.acc-text-x3 .team-content h2 {
  font-size: 42px !important;
}

body.acc-text-x3 .team-content p {
  font-size: 28px !important;
}

/* Fix: Working History Titles (Team Single Page) */
body.acc-text-x1 .working-history-content h3 {
  font-size: 26px !important;
}

body.acc-text-x2 .working-history-content h3 {
  font-size: 32px !important;
}

body.acc-text-x3 .working-history-content h3 {
  font-size: 38px !important;
}

/* Fix: Service Process Titles (Initial Contact, etc.) */
body.acc-text-x1 .service-process-title h3 {
  font-size: 26px !important;
}

body.acc-text-x2 .service-process-title h3 {
  font-size: 32px !important;
}

body.acc-text-x3 .service-process-title h3 {
  font-size: 40px !important;
}

/* Fix: Service Item Titles (e.g. Manual Therapy) */
body.acc-text-x1 .service-content h3 {
  font-size: 26px !important;
}

body.acc-text-x1 .service-content p {
  font-size: 20px !important;
}

body.acc-text-x2 .service-content h3 {
  font-size: 32px !important;
}

body.acc-text-x2 .service-content p {
  font-size: 24px !important;
}

body.acc-text-x3 .service-content h3 {
  font-size: 40px !important;
}

body.acc-text-x3 .service-content p {
  font-size: 28px !important;
}

/* Protect Widget from Inheritance and Global Scaling */
#acc-menu,
#acc-menu *,
#acc-widget-btn,
#acc-widget-btn * {
  font-size: 16px !important;
  line-height: 1.2 !important;
  /* Reset Line Height to compact */
  letter-spacing: normal !important;
  /* Reset Spacing */
  word-spacing: normal !important;
}

/* Bigger Text - Layout Healers */
/* Force headers/navs to auto-expand to contain larger text */
body.acc-text-x1 .main-header,
body.acc-text-x1 .header-sticky,
body.acc-text-x1 .topbar,
body.acc-text-x2 .main-header,
body.acc-text-x2 .header-sticky,
body.acc-text-x2 .topbar,
body.acc-text-x3 .main-header,
body.acc-text-x3 .header-sticky,
body.acc-text-x3 .topbar {
  height: auto !important;
  min-height: 0 !important;
}

/* Only reduce padding for Main Header/Sticky, NOT topbar */
body.acc-text-x1 .main-header,
body.acc-text-x1 .header-sticky,
body.acc-text-x2 .main-header,
body.acc-text-x2 .header-sticky,
body.acc-text-x3 .main-header,
body.acc-text-x3 .header-sticky {
  padding-bottom: 5px !important;
}

body.acc-text-x1 .navbar-collapse,
body.acc-text-x2 .navbar-collapse,
body.acc-text-x3 .navbar-collapse {
  flex-wrap: wrap !important;
  justify-content: center !important;
}

body.acc-text-x1 .main-header .container,
body.acc-text-x2 .main-header .container,
body.acc-text-x3 .main-header .container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 15px !important;
}

/* 4. Text Spacing - EXCLUDE WIDGET */
body.acc-spacing *:not(#acc-menu *):not(#acc-widget-btn) {
  line-height: 1.8 !important;
  letter-spacing: 0.12em !important;
  word-spacing: 0.16em !important;
}

/* ... (skip unmodified sections) ... */

/* 10. Line Height Controls - EXCLUDE WIDGET */
body.acc-line-height-1 *:not(#acc-menu *):not(#acc-widget-btn) {
  line-height: 1.5 !important;
}

body.acc-line-height-2 *:not(#acc-menu *):not(#acc-widget-btn) {
  line-height: 1.75 !important;
}

body.acc-line-height-3 *:not(#acc-menu *):not(#acc-widget-btn) {
  line-height: 2 !important;
}

/* 11. Text Alignment - EXCLUDE WIDGET */
body.acc-align-left *:not(#acc-menu *):not(#acc-widget-btn) {
  text-align: left !important;
}

body.acc-align-center *:not(#acc-menu *):not(#acc-widget-btn) {
  text-align: center !important;
}

body.acc-align-right *:not(#acc-menu *):not(#acc-widget-btn) {
  text-align: right !important;
}

body.acc-spacing p {
  margin-bottom: 2em !important;
}

/* 5. Pause Animations */
body.acc-pause *,
body.acc-pause *::before,
body.acc-pause *::after {
  transition: none !important;
  animation: none !important;
}

body.acc-pause video {
  display: none;
  /* Simplest handling for autoplay videos without controls logic */
}

/* Allow manual override for videos if we add controls, but for now disable autoplay logic handled in JS */

/* 6. Hide Images */
body.acc-hide-images img:not(#acc-menu img) {
  opacity: 0 !important;
  visibility: hidden !important;
}

body.acc-hide-images [style*="background-image"] {
  background-image: none !important;
  background-color: #ccc !important;
  /* Placeholder */
}

/* 7. Dyslexia Friendly */
body.acc-dyslexia {
  font-family: "Open Dyslexic", "Comic Sans MS", "Verdana", sans-serif !important;
}

body.acc-dyslexia * {
  font-family: "Open Dyslexic", "Comic Sans MS", "Verdana", sans-serif !important;
}

/* 8. Cursor Enhancements */
body.acc-cursor,
body.acc-cursor * {
  cursor:
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewport="0 0 48 48" style="fill:black;stroke:white;stroke-width:2px;"><path d="M1 1l18 18l-6 1l6 14l-4 2l-6-14l-8 4z"/></svg>'),
    auto !important;
}

/* 9. Tooltips */
/* CSS tooltips for elements with aria-label or title when this mode is on */
body.acc-tooltips [aria-label]:hover::after,
body.acc-tooltips [title]:hover::after,
body.acc-tooltips [aria-label]:focus-visible::after,
body.acc-tooltips [title]:focus-visible::after {
  content: attr(aria-label) attr(title);
  position: absolute;
  background: #333;
  color: #fff;
  padding: 5px 10px;
  border-radius: 4px;
  z-index: 10000;
  top: 100%;
  left: 0;
  font-size: 14px;
  white-space: nowrap;
  pointer-events: none;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

/* 10. Line Height Controls */
body.acc-line-height-1 * {
  line-height: 1.5 !important;
}

body.acc-line-height-2 * {
  line-height: 1.75 !important;
}

body.acc-line-height-3 * {
  line-height: 2 !important;
}

/* 11. Text Alignment */
body.acc-align-left * {
  text-align: left !important;
}

body.acc-align-center * {
  text-align: center !important;
}

body.acc-align-right * {
  text-align: right !important;
}

/* Fix: Availability Card Flex Alignment */
body.acc-align-left .availability-card {
  justify-content: flex-start !important;
}

body.acc-align-center .availability-card {
  justify-content: center !important;
  text-align: center !important;
}

body.acc-align-right .availability-card {
  justify-content: flex-start !important;
  text-align: right !important;
  flex-direction: row-reverse !important;
}

body.acc-align-right .availability-card .option-icon {
  margin-right: 0 !important;
  margin-left: 24px !important;
}

/* Fix: Process Step Card Flex Alignment */
body.acc-align-left .process-step-card {
  align-items: flex-start !important;
}

body.acc-align-center .process-step-card {
  align-items: center !important;
  text-align: center !important;
}

body.acc-align-right .process-step-card {
  align-items: flex-end !important;
  text-align: right !important;
}

/* Fix: Condition Card Text Alignment */
body.acc-align-left .condition-card {
  justify-content: flex-start !important;
  text-align: left !important;
}

body.acc-align-center .condition-card {
  justify-content: center !important;
  text-align: center !important;
}

body.acc-align-right .condition-card {
  justify-content: flex-start !important;
  /* Keep flex-start but reverse row */
  text-align: right !important;
  flex-direction: row-reverse !important;
}

body.acc-align-right .condition-card .animated-bullet {
  margin-right: 0 !important;
  margin-left: 20px !important;
}

/* Fix: Treatment Options Alignment */
/* Left */
body.acc-align-left .treatment-card {
  text-align: left !important;
}

body.acc-align-left .treatment-card h4,
body.acc-align-left .treatment-card .read-more-link {
  justify-content: flex-start !important;
}

/* Center */
body.acc-align-center .treatment-card {
  text-align: center !important;
}

body.acc-align-center .treatment-card h4,
body.acc-align-center .treatment-card .read-more-link {
  justify-content: center !important;
}

/* Right */
body.acc-align-right .treatment-card {
  text-align: right !important;
}

body.acc-align-right .treatment-card h4,
body.acc-align-right .treatment-card .read-more-link {
  justify-content: flex-end !important;
}

body.acc-align-right .treatment-card .read-more-link {
  flex-direction: row-reverse !important;
}

body.acc-align-right .treatment-card .read-more-link i {
  margin-left: 0 !important;
  margin-right: 8px !important;
  transform: rotate(180deg) !important;
}

/* Fix: Suitability Item Flex Alignment */
body.acc-align-left .suitability-item {
  justify-content: flex-start !important;
  text-align: left !important;
}

body.acc-align-center .suitability-item {
  justify-content: center !important;
  text-align: center !important;
}

body.acc-align-right .suitability-item {
  justify-content: flex-start !important;
  text-align: right !important;
  flex-direction: row-reverse !important;
}

body.acc-align-right .suitability-item .panel-icon {
  margin-right: 0 !important;
  margin-left: 18px !important;
}

/* 2. Highlight Links */
body.acc-links a:not(#acc-menu *):not(#acc-widget-btn):not(.btn-default) {
  background-color: #ffff00 !important;
  color: #000000 !important;
  text-decoration: underline !important;
  font-weight: 700 !important;
  outline: 2px solid #000000 !important;
  padding: 2px 4px !important;
  border-radius: 2px !important;
}

body.acc-links a:not(#acc-menu *):not(#acc-widget-btn):not(.btn-default) * {
  color: #000000 !important;
}

body.acc-links a:not(#acc-menu *):not(#acc-widget-btn):not(.btn-default) i {
  color: #000000 !important;
}

/* Ensure Highlighted Links remain high-contrast in Dark Mode */
html[data-contrast="dark"] body.acc-links a:not(.btn-default) {
  background-color: #ffff00 !important;
  color: #000000 !important;
}

/* 12. Saturation */
/* 12. Saturation - Apply to all content except exclusion list */
body.acc-saturation-low *:not(#acc-menu):not(#acc-widget-btn):not(#acc-overlay):not(.sr-only) {
  filter: saturate(50%);
}

body.acc-grayscale *:not(#acc-menu):not(#acc-widget-btn):not(#acc-overlay):not(.sr-only) {
  filter: grayscale(100%);
}

body.acc-saturation-high *:not(#acc-menu):not(#acc-widget-btn):not(#acc-overlay):not(.sr-only) {
  filter: saturate(200%);
}

/* Screen Reader Only Utilities */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* 13. CARD LINK FOCUS VISIBILITY FIX (Universal High Contrast) */
/* Targeted fix for cards where background images/colors obscure outlines */

/* 1. Standardize Focus for Semantic Card Classes */
/* 1. Standardize Focus for Semantic Card Classes (BLOCK/IMAGE LINKS) */
.service-item a:focus-visible:not(h2 a):not(h3 a):not(.readmore-btn),
.benefits-item a:focus-visible:not(h2 a):not(h3 a),
.project-item a:focus-visible,
.post-featured-image a:focus-visible,
/* Image Link in Blog */
.team-item a:focus-visible,
.pricing-item a:focus-visible,
.rehab-benefits-item a:focus-visible,
.service-process-btn a:focus-visible,
/* 2. Generic Block Links (likely wrappers) */
a[class*="item"]:focus-visible:not(h2 a):not(h3 a):not(.readmore-btn),
a[class*="card"]:focus-visible:not(h2 a):not(h3 a),
a.full-link:focus-visible {
  /* Double-layer high contrast outline for BLOCKS */
  outline: 4px solid #ffffff !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 6px #000000 !important;

  /* Ensure visibility */
  z-index: 1000 !important;
  position: relative !important;
  transition: none !important;
  display: block;
  /* Helps typically */
}

/* 4. Text Link Specific Focus (Cleaner Style for Titles/Text) */
.blog-item h2 a:focus-visible,
.post-item-body h2 a:focus-visible,
.service-item h3 a:focus-visible,
.post-tags a:focus-visible {
  outline: 3px solid #000000 !important;
  outline-offset: 2px !important;
  background-color: #ffeeba !important;
  /* Light yellow highlight */
  color: #000000 !important;
  text-decoration: underline !important;
  box-shadow: none !important;
  border-radius: 2px;
}

/* Fix Read More buttons */
.readmore-btn:focus-visible {
  outline: 3px solid #000000 !important;
  outline-offset: 2px !important;
  background-color: transparent !important;
}

/* 3. Force Container Overflow Visibility */
/* Often focus rings are clipped by overflow:hidden on cards */
.service-item,
.benefits-item,
.project-item,
.blog-item,
.rehab-benefits-item,
[class*="item"],
[class*="card"] {
  overflow: visible !important;
}

/* 5. Invert Mode Specific Adjustments */
/* Invert mode flips colors, so we just ensure opacity is high */
html[data-contrast="invert"] .service-item a:focus-visible,
html[data-contrast="invert"] a[class*="item"]:focus-visible {
  outline: 4px solid #000000 !important;
  /* Becomes White */
  box-shadow: 0 0 0 6px #ffffff !important;
  /* Becomes Black */
}

/* =========================================
   HIDE IMAGES FEATURE
   ========================================= */

/* Hide all images when "Hide Images" is enabled */
body.acc-hide-images img {
  display: none !important;
}

/* Hide background images */
body.acc-hide-images [style*="background-image"],
body.acc-hide-images [style*="background:"] {
  background-image: none !important;
}

/* Hide physician section decorative images */
body.acc-hide-images .physician-deco-1,
body.acc-hide-images .physician-deco-2,
body.acc-hide-images .physician-deco-3 {
  display: none !important;
}

/* Hide physician section background images */
body.acc-hide-images .physician-led-care,
body.acc-hide-images .physician-led-care .quality-treatment,
body.acc-hide-images .physician-led-care::before,
body.acc-hide-images .physician-led-care::after {
  background-image: none !important;
}

/* Hide SVG elements */
body.acc-hide-images svg {
  display: none !important;
}

/* Keep essential icons visible (navigation, UI controls) */
body.acc-hide-images #acc-menu svg,
body.acc-hide-images .acc-feature-btn i,
body.acc-hide-images .fa-solid,
body.acc-hide-images .fa-regular,
body.acc-hide-images .fa-brands {
  display: inline !important;
}

/* Benefit Icons - Brighten in Invert Mode */
/* Force icon to Blue (#0000ff) with filter:none, so GLOBAL INVERT turns it into BRIGHT YELLOW */
html[data-contrast="invert"] .benefit-icon i {
  color: #0000ff !important;
  filter: none !important;
}

/* Process Icons - Force Black in Invert Mode */
/* Force icon to White (#ffffff) with filter:none, so GLOBAL INVERT turns it into BLACK */
html[data-contrast="invert"] .process-icon i {
  color: #ffffff !important;
  filter: none !important;
}

/* Force icon to White (#ffffff) with filter:none, so GLOBAL INVERT turns it into BLACK */
html[data-contrast="invert"] .factor-icon,
html[data-contrast="invert"] .factor-icon i {
  color: #ffffff !important;
  filter: none !important;
}

/* Service Introduction Section - Force Black Background in Dark Mode */
html[data-contrast="dark"] .service-introduction-section {
  background-color: #000000 !important;
  background: #000000 !important;
}

/* Hide light effects in dark mode */
html[data-contrast="dark"] .intro-ambient-bg,
html[data-contrast="dark"] .decorative-shapes {
  display: none !important;
}

/* Why Avoid Surgery Section - Force Black Background in Dark Mode */
html[data-contrast="dark"] .why-avoid-surgery {
  background-color: #000000 !important;
  background: #000000 !important;
}

/* Why Avoid Surgery Section - Force benefit items Black in Dark Mode */
html[data-contrast="dark"] .benefit-item {
  background-color: #000000 !important;
  background: #000000 !important;
  border: 1px solid #ffffff !important;
  /* Ensure visibility against black section */
}

/* Treatment Options Section - Force Black Background in Dark Mode */
html[data-contrast="dark"] .treatment-options-section {
  background-color: #000000 !important;
  background: #000000 !important;
  background-image: none !important;
  /* Remove dotted pattern */
}

/* Hide decorative shape in dark mode */
html[data-contrast="dark"] .treatment-deco-shape {
  display: none !important;
}

/* Treatment Cards - Force Black in Dark Mode */
html[data-contrast="dark"] .treatment-card {
  background-color: #000000 !important;
  background: #000000 !important;
  border: 1px solid #ffffff !important;
  /* Ensure visibility against black section */
}

/* Physician Led Section - Force Black Background in Dark Mode */
html[data-contrast="dark"] .physician-led-section {
  background-color: #000000 !important;
  background: #000000 !important;
}

html[data-contrast="dark"] .physician-card {
  background-color: #000000 !important;
  background: #000000 !important;
  border: 1px solid #ffffff !important;
  box-shadow: none !important;
}

/* Ensure physician title is visible (gradient text might be dark) */
html[data-contrast="dark"] .physician-title {
  background: none !important;
  -webkit-text-fill-color: #ffff00 !important;
  /* Force Yellow text */
  color: #ffff00 !important;
}

/* Force High Contrast for CTA Buttons in Dark Mode - STRONGEST SPECIFICITY */
/* Targets .btn-default specifically to override generic a[href] rules */
html[data-contrast="dark"] a.btn-default,
html[data-contrast="dark"] a.btn-default span {
  background-color: #000000 !important;
  /* Opaque Black Background */
  color: #ffff00 !important;
  /* Bright Yellow Text */
  border: 2px solid #ffff00 !important;
  /* Bright Yellow Border */
  opacity: 1 !important;
  visibility: visible !important;
}

html[data-contrast="dark"] a.btn-default:hover,
html[data-contrast="dark"] a.btn-default:hover span {
  background-color: #ffff00 !important;
  /* Fill Yellow */
  color: #000000 !important;
  /* Black Text */
}

/* Fix Button Arrow Visibility in Dark Mode */
/* Restore the ::before pseudo-element (arrow) which was hidden */
html[data-contrast="dark"] a.btn-default::before {
  display: block !important;
  content: "" !important;
  /* Use mask to color the SVG yellow */
  background-image: none !important;
  -webkit-mask-image: url("../images/arrow-blue.svg") !important;
  mask-image: url("../images/arrow-blue.svg") !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  background-color: #ffff00 !important;
  /* Yellow Arrow */
  /* Ensure positioning overrides */
  position: absolute !important;
  top: 50% !important;
  right: 0 !important;
  width: 10px !important;
  height: 10px !important;
  transform: translate(-10px, -50%) !important;
  z-index: 2 !important;
}

/* On hover, arrow becomes Black to match text */
html[data-contrast="dark"] a.btn-default:hover::before {
  background-color: #000000 !important;
}

/* CTA Evaluation Section - Force Black Background in Dark Mode */
/* Ensures button border (Yellow) has contrast against background */
html[data-contrast="dark"] .cta-evaluation-section {
  background-color: #000000 !important;
  background: #000000 !important;
}

html[data-contrast="dark"] .cta-title,
html[data-contrast="dark"] .cta-text {
  color: #ffff00 !important;
}

html[data-contrast="dark"] a.btn-default:hover::before {
  background-color: #000000 !important;
}

/* Fix for Non-Surgical Orthopedics What Is Section in Light Mode */
html[data-contrast="light"] .what-is-section h2,
html[data-contrast="light"] .what-is-section h2 *,
html[data-contrast="light"] .what-is-section h4,
html[data-contrast="light"] .what-is-section h4 *,
html[data-contrast="light"] .what-is-section p,
html[data-contrast="light"] .what-is-section p *,
html[data-contrast="light"] .what-is-section strong,
html[data-contrast="light"] .what-is-section li,
html[data-contrast="light"] .what-is-section li * {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Fix for Benefit Icons in Light Contrast Mode */
html[data-contrast="light"] .benefit-icon,
html[data-contrast="light"] .benefit-icon i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Fix for Common Conditions Section in Light Mode */
html[data-contrast="light"] .common-conditions-section h2,
html[data-contrast="light"] .common-conditions-section p,
html[data-contrast="light"] .common-conditions-section .condition-text {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

html[data-contrast="light"] .common-conditions-section .animated-bullet {
  background-color: #000000 !important;
  box-shadow: none !important;
}

/* Fix for Physician Title (Gradient Text) in Light Contrast Mode */
html[data-contrast="light"] .physician-title {
  background: none !important;
  -webkit-text-fill-color: #000000 !important;
  color: #000000 !important;
}

/* Fix for Primary Button in Light Contrast Mode */
html[data-contrast="light"] .primary-btn,
html[data-contrast="light"] .primary-btn i {
  background: #000000 !important;
  background-image: none !important;
  background-color: #000000 !important;
  color: #ffffff !important;
  border: 2px solid #000000 !important;
  box-shadow: none !important;
}

html[data-contrast="light"] .primary-btn:hover,
html[data-contrast="light"] .primary-btn:hover i {
  background: #ffffff !important;
  background-image: none !important;
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
}

/* Fix for Process Icons in Light Contrast Mode */
html[data-contrast="light"] .process-icon,
html[data-contrast="light"] .process-icon i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Fix: Treatment Icons Visibility in Light Contrast Mode */
html[data-contrast="light"] .highlight-icon,
html[data-contrast="light"] .highlight-icon i,
html[data-contrast="light"] .experience-badge,
html[data-contrast="light"] .experience-badge i,
html[data-contrast="light"] .btn-treatment-explore,
html[data-contrast="light"] .btn-treatment-explore i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Hover States for Light Mode */
html[data-contrast="light"] .highlight-icon:hover,
html[data-contrast="light"] .highlight-icon:hover i,
html[data-contrast="light"] .btn-treatment-explore:hover,
html[data-contrast="light"] .btn-treatment-explore:hover i {
  color: #000000 !important;
  background-color: #ffffff !important;
  border-color: #000000 !important;
}

/* Fix for Primary Button in Dark Contrast Mode */
html[data-contrast="dark"] .primary-btn,
html[data-contrast="dark"] .primary-btn i {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: 2px solid #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-contrast="dark"] .primary-btn:hover,
html[data-contrast="dark"] .primary-btn:hover i {
  background-color: #ffffff !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Fix for Factor Items in Light Contrast Mode */
html[data-contrast="light"] .factor-item,
html[data-contrast="light"] .factor-text,
html[data-contrast="light"] .factor-icon,
html[data-contrast="light"] .factor-icon i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Fix: Process Overview Header Text Scaling (Overrides Inline Style) */
/* Base: 20px */

/* Level 1 (120%) */
body.acc-text-x1 .process-card h4 {
  font-size: 24px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .process-card h4 {
  font-size: 28px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .process-card h4 {
  font-size: 35px !important;
}

/* Fix: Benefit Item Text Scaling */
/* Base: Text 18px, Icon 18px (Container 40px) */

/* Level 1 (120%) */
body.acc-text-x1 .benefit-item {
  font-size: 22px !important;
}

body.acc-text-x1 .benefit-icon {
  width: 48px !important;
  height: 48px !important;
  font-size: 22px !important;
  flex-shrink: 0 !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .benefit-item {
  font-size: 25px !important;
}

body.acc-text-x2 .benefit-icon {
  width: 56px !important;
  height: 56px !important;
  font-size: 25px !important;
  flex-shrink: 0 !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .benefit-item {
  font-size: 32px !important;
}

body.acc-text-x3 .benefit-icon {
  width: 70px !important;
  height: 70px !important;
  font-size: 32px !important;
  flex-shrink: 0 !important;
}

/* Fix: Feature Card List Text Scaling */
/* Base: h4 24px (approx), li 18px */

/* Level 1 (120%) */
body.acc-text-x1 .what-is-content h4 {
  font-size: 29px !important;
}

body.acc-text-x1 .feature-card-item {
  font-size: 22px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .what-is-content h4 {
  font-size: 34px !important;
}

body.acc-text-x2 .feature-card-item {
  font-size: 25px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .what-is-content h4 {
  font-size: 42px !important;
}

body.acc-text-x3 .feature-card-item {
  font-size: 32px !important;
}

/* Fix: Primary Button Alignment */
.primary-btn {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
}

.primary-btn i {
  margin-left: 10px !important;
}

/* Ensure parent of primary-btn inside physician-content aligns */
body.acc-align-left .physician-content div {
  text-align: left !important;
}

body.acc-align-center .physician-content div {
  text-align: center !important;
}

body.acc-align-right .physician-content div {
  text-align: right !important;
}

body.acc-align-right .primary-btn {
  flex-direction: row-reverse !important;
}

body.acc-align-right .primary-btn i {
  margin-left: 0 !important;
  margin-right: 10px !important;
  transform: rotate(180deg) !important;
}

/* Fix: Treatment Icons Visibility in Invert Mode */
/* Force icon to Blue (#0000ff) with filter:none, so GLOBAL INVERT turns it into BRIGHT YELLOW */
html[data-contrast="invert"] .highlight-icon i {
  color: #0000ff !important;
  filter: none !important;
}

html[data-contrast="invert"] .experience-badge i {
  color: #0000ff !important;
  filter: none !important;
}

html[data-contrast="invert"] .diagnosis-icon i {
  color: #ffffff !important;
  /* Black in Invert Mode */
  filter: none !important;
}

html[data-contrast="invert"] .btn-treatment-explore i {
  color: #0000ff !important;
  filter: none !important;
}

/* Hover States for Invert Mode - Turn Black (White in Code) */
html[data-contrast="invert"] .highlight-icon:hover i,
html[data-contrast="invert"] .experience-badge:hover i,
html[data-contrast="invert"] .btn-treatment-explore:hover i {
  color: #ffffff !important;
  /* Turns Black in Invert Mode */
  filter: none !important;
}

/* Fix: Intro Section Text Scaling (treatments.php) */
/* Base sizes:
   .content-lead: 1.15rem (~18.4px)
   .highlights-list li: 1.05rem (~16.8px)
   .eyebrow-label: 0.9rem (~14.4px)
   .doc-desc: 1rem (16px)
*/

/* Level 1 (120%) */
body.acc-text-x1 .content-lead {
  font-size: 22px !important;
}

body.acc-text-x1 .highlights-list li {
  font-size: 20px !important;
}

body.acc-text-x1 .eyebrow-label {
  font-size: 17px !important;
}

body.acc-text-x1 .doc-desc {
  font-size: 19px !important;
}

body.acc-text-x1 .location-tag {
  font-size: 27px !important;
}

body.acc-text-x1 .btn-treatment-explore {
  font-size: 17px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .content-lead {
  font-size: 26px !important;
}

body.acc-text-x2 .highlights-list li {
  font-size: 24px !important;
}

body.acc-text-x2 .eyebrow-label {
  font-size: 20px !important;
}

body.acc-text-x2 .doc-desc {
  font-size: 22px !important;
}

body.acc-text-x2 .location-tag {
  font-size: 31px !important;
}

body.acc-text-x2 .btn-treatment-explore {
  font-size: 20px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .content-lead {
  font-size: 32px !important;
}

body.acc-text-x3 .highlights-list li {
  font-size: 29px !important;
}

body.acc-text-x3 .eyebrow-label {
  font-size: 25px !important;
}

body.acc-text-x3 .doc-desc {
  font-size: 28px !important;
}

body.acc-text-x3 .location-tag {
  font-size: 39px !important;
}

body.acc-text-x3 .btn-treatment-explore {
  font-size: 25px !important;
}

/* Fix: Doctor Card Text Scaling */
/* Base:
   .doc-name: 1.5rem (24px)
   .doc-title: 0.95rem (15.2px)
   .experience-badge: 0.85rem (13.6px)
   .doc-desc: 1rem (16px) - Already added above but reinforcing
*/

/* Level 1 (120%) */
body.acc-text-x1 .doc-name {
  font-size: 29px !important;
}

body.acc-text-x1 .doc-title {
  font-size: 18px !important;
}

body.acc-text-x1 .experience-badge {
  font-size: 16px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .doc-name {
  font-size: 34px !important;
}

body.acc-text-x2 .doc-title {
  font-size: 21px !important;
}

body.acc-text-x2 .experience-badge {
  font-size: 19px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .doc-name {
  font-size: 42px !important;
}

body.acc-text-x3 .doc-title {
  font-size: 27px !important;
}

body.acc-text-x3 .experience-badge {
  font-size: 24px !important;
}

body.acc-text-x3 .eyebrow-label {
  font-size: 25px !important;
}

body.acc-text-x3 .doc-desc {
  font-size: 28px !important;
}

body.acc-text-x3 .location-tag {
  font-size: 39px !important;
}

body.acc-text-x3 .btn-treatment-explore {
  font-size: 25px !important;
}

/* Fix: Location Tag Background in Dark Mode */
html[data-contrast="dark"] .location-tag {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: 1px solid #ffffff !important;
}

/* Fix: Intro Section Text Alignment (treatments.php) */

/* LEFT ALIGNMENT */
body.acc-align-left .intro-header,
body.acc-align-left .intro-content-wrapper,
body.acc-align-left .cta-wrapper,
body.acc-align-left .doctor-profile-card,
body.acc-align-left .doc-name,
body.acc-align-left .doc-title,
body.acc-align-left .doc-desc {
  text-align: left !important;
}

body.acc-align-left .title-accent-line {
  margin-right: auto !important;
  margin-left: 0 !important;
}

body.acc-align-left .highlights-list li {
  justify-content: flex-start !important;
}

/* CENTER ALIGNMENT */
body.acc-align-center .intro-header,
body.acc-align-center .intro-content-wrapper,
body.acc-align-center .cta-wrapper,
body.acc-align-center .doctor-profile-card,
body.acc-align-center .doc-name,
body.acc-align-center .doc-title,
body.acc-align-center .doc-desc {
  text-align: center !important;
}

body.acc-align-center .title-accent-line {
  margin: 15px auto 0 auto !important;
}

body.acc-align-center .highlights-list li {
  justify-content: center !important;
}

/* RIGHT ALIGNMENT */
body.acc-align-right .intro-header,
body.acc-align-right .intro-content-wrapper,
body.acc-align-right .cta-wrapper,
body.acc-align-right .doctor-profile-card,
body.acc-align-right .doc-name,
body.acc-align-right .doc-title,
body.acc-align-right .doc-desc {
  text-align: right !important;
}

body.acc-align-right .title-accent-line {
  margin-left: auto !important;
  margin-right: 0 !important;
}

body.acc-align-right .highlights-list li {
  justify-content: flex-end !important;
  flex-direction: row-reverse !important;
}

body.acc-align-right .highlights-list li .highlight-icon {
  margin-left: 15px !important;
  margin-right: 0 !important;
}

body.acc-align-right .btn-treatment-explore {
  flex-direction: row-reverse !important;
}

body.acc-align-right .btn-treatment-explore i {
  margin-left: 0 !important;
  margin-right: 10px !important;
  transform: rotate(180deg) !important;
}

/* Fix: Step Numbers in Dark Contrast Mode */
html[data-contrast="dark"] .step-number {
  color: #ffff00 !important;
  -webkit-text-fill-color: #ffff00 !important;
  background-color: #000000 !important;
  padding: 5px 10px !important;
  border-radius: 6px !important;
}

/* Fix: Diagnosis Icons Black in Light Contrast Mode */
html[data-contrast="light"] .diagnosis-icon,
html[data-contrast="light"] .diagnosis-icon i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Fix: Decision Section Text Scaling */
/* Base sizes:
   .decision-title: 2.5rem (40px)
   .decision-lead: 1.25rem (20px)
   .step-number: 3.5rem (56px)
   .diagnosis-title: 1.4rem (22.4px)
   .closing-text: 1.25rem (20px)
*/

/* Level 1 (120%) */
body.acc-text-x1 .decision-title {
  font-size: 48px !important;
}

body.acc-text-x1 .decision-lead {
  font-size: 24px !important;
}

body.acc-text-x1 .step-number {
  font-size: 67px !important;
}

body.acc-text-x1 .diagnosis-title {
  font-size: 27px !important;
}

body.acc-text-x1 .closing-text {
  font-size: 24px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .decision-title {
  font-size: 56px !important;
}

body.acc-text-x2 .decision-lead {
  font-size: 28px !important;
}

body.acc-text-x2 .step-number {
  font-size: 78px !important;
}

body.acc-text-x2 .diagnosis-title {
  font-size: 31px !important;
}

body.acc-text-x2 .closing-text {
  font-size: 28px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .decision-title {
  font-size: 70px !important;
}

body.acc-text-x3 .decision-lead {
  font-size: 35px !important;
}

body.acc-text-x3 .step-number {
  font-size: 98px !important;
}

body.acc-text-x3 .diagnosis-title {
  font-size: 39px !important;
}

body.acc-text-x3 .closing-text {
  font-size: 35px !important;
}

/* Fix: Procedures Section Text Scaling */
/* Base sizes:
   .procedure-title: 1.5rem (24px)
   .procedure-desc: ~16px (default)
   .procedure-link: 0.95rem (15.2px)
*/

/* Level 1 (120%) */
body.acc-text-x1 .procedure-title {
  font-size: 29px !important;
}

body.acc-text-x1 .procedure-desc {
  font-size: 19px !important;
}

body.acc-text-x1 .procedure-link {
  font-size: 18px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .procedure-title {
  font-size: 34px !important;
}

body.acc-text-x2 .procedure-desc {
  font-size: 22px !important;
}

body.acc-text-x2 .procedure-link {
  font-size: 21px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .procedure-title {
  font-size: 42px !important;
}

body.acc-text-x3 .procedure-desc {
  font-size: 28px !important;
}

body.acc-text-x3 .procedure-link {
  font-size: 27px !important;
}

/* Fix: Procedures Section Text Alignment */

/* LEFT */
body.acc-align-left .procedure-card,
body.acc-align-left .procedure-title,
body.acc-align-left .procedure-desc {
  text-align: left !important;
}

body.acc-align-left .procedure-links {
  align-items: flex-start !important;
}

/* CENTER */
body.acc-align-center .procedure-card,
body.acc-align-center .procedure-title,
body.acc-align-center .procedure-desc {
  text-align: center !important;
}

body.acc-align-center .procedure-links {
  align-items: center !important;
}

/* RIGHT */
body.acc-align-right .procedure-card,
body.acc-align-right .procedure-title,
body.acc-align-right .procedure-desc {
  text-align: right !important;
}

body.acc-align-right .procedure-links {
  align-items: flex-end !important;
}

body.acc-align-right .procedure-link {
  flex-direction: row-reverse !important;
}

body.acc-align-right .procedure-link i {
  margin-right: 0 !important;
  margin-left: 8px !important;
  transform: rotate(180deg) !important;
}

/* Fix: Mosaic Icons Black in Invert Mode */
html[data-contrast="invert"] .mosaic-icon {
  color: #ffffff !important;
  /* Turns Black in Invert Mode */
  filter: none !important;
}

/* Fix: Eligibility Section in Dark Contrast Mode */
html[data-contrast="dark"] .eligibility-watermark {
  display: none !important;
}

html[data-contrast="dark"] .mosaic-card {
  background: #000000 !important;
  border: 1px solid #ffffff !important;
}

html[data-contrast="dark"] .mosaic-card:hover {
  background: #111111 !important;
  border-color: #ffff00 !important;
}

html[data-contrast="dark"] .mosaic-card::before {
  background: #ffff00 !important;
}

html[data-contrast="dark"] .mosaic-icon {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .mosaic-text {
  color: #ffffff !important;
}

/* Fix: Mosaic Icons Black in Light Contrast Mode */
html[data-contrast="light"] .mosaic-icon {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Fix: Eligibility Section Text Scaling */
/* Base sizes:
   .stack-title: 2.75rem (44px)
   .eligibility-header-stack p: ~16px
   .mosaic-icon: 2rem (32px)
   .mosaic-text: 1.1rem (17.6px)
*/

/* Level 1 (120%) */
body.acc-text-x1 .stack-title {
  font-size: 53px !important;
}

body.acc-text-x1 .eligibility-header-stack p {
  font-size: 19px !important;
}

body.acc-text-x1 .mosaic-icon {
  font-size: 38px !important;
}

body.acc-text-x1 .mosaic-text {
  font-size: 21px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .stack-title {
  font-size: 62px !important;
}

body.acc-text-x2 .eligibility-header-stack p {
  font-size: 22px !important;
}

body.acc-text-x2 .mosaic-icon {
  font-size: 45px !important;
}

body.acc-text-x2 .mosaic-text {
  font-size: 25px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .stack-title {
  font-size: 77px !important;
}

body.acc-text-x3 .eligibility-header-stack p {
  font-size: 28px !important;
}

body.acc-text-x3 .mosaic-icon {
  font-size: 56px !important;
}

body.acc-text-x3 .mosaic-text {
  font-size: 31px !important;
}

/* Fix: Item Icons Bright Yellow in Invert Mode */
html[data-contrast="invert"] .item-icon {
  color: #0000ff !important;
  /* Turns Bright Yellow in Invert Mode */
  filter: none !important;
}

/* Fix: Why Choose Section in Dark Contrast Mode */
html[data-contrast="dark"] .why-choose-section {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .anchor-title,
html[data-contrast="dark"] .item-content h3 {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .anchor-subtitle,
html[data-contrast="dark"] .item-content p {
  color: #ffffff !important;
}

html[data-contrast="dark"] .sub-title {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .item-number {
  color: #ffff00 !important;
  background-color: #000000 !important;
  padding: 5px 10px !important;
  border-radius: 6px !important;
  border: 1px solid #ffff00 !important;
}

html[data-contrast="dark"] .item-icon {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .clinical-item {
  border-bottom-color: rgba(255, 255, 255, 0.3) !important;
}

html[data-contrast="dark"] .anchor-subtitle {
  border-left-color: #ffff00 !important;
}

/* Fix: Item Icons Black in Light Contrast Mode */
html[data-contrast="light"] .item-icon {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Fix: Why Choose Section Text Scaling */
/* Base sizes:
   .sub-title: ~14px
   .anchor-title: 2.75rem (44px)
   .anchor-subtitle: 1.25rem (20px)
   .item-number: 1.2rem (19.2px)
   .item-icon: 1.4rem (22.4px)
   .item-content h3: 1.4rem (22.4px)
   .item-content p: 1.1rem (17.6px)
*/

/* Level 1 (120%) */
body.acc-text-x1 .sub-title {
  font-size: 17px !important;
}

body.acc-text-x1 .anchor-title {
  font-size: 53px !important;
}

body.acc-text-x1 .anchor-subtitle {
  font-size: 24px !important;
}

body.acc-text-x1 .item-number {
  font-size: 23px !important;
}

body.acc-text-x1 .item-icon {
  font-size: 27px !important;
}

body.acc-text-x1 .item-content h3 {
  font-size: 27px !important;
}

body.acc-text-x1 .item-content p {
  font-size: 21px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .sub-title {
  font-size: 20px !important;
}

body.acc-text-x2 .anchor-title {
  font-size: 62px !important;
}

body.acc-text-x2 .anchor-subtitle {
  font-size: 28px !important;
}

body.acc-text-x2 .item-number {
  font-size: 27px !important;
}

body.acc-text-x2 .item-icon {
  font-size: 31px !important;
}

body.acc-text-x2 .item-content h3 {
  font-size: 31px !important;
}

body.acc-text-x2 .item-content p {
  font-size: 25px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .sub-title {
  font-size: 25px !important;
}

body.acc-text-x3 .anchor-title {
  font-size: 77px !important;
}

body.acc-text-x3 .anchor-subtitle {
  font-size: 35px !important;
}

body.acc-text-x3 .item-number {
  font-size: 34px !important;
}

body.acc-text-x3 .item-icon {
  font-size: 39px !important;
}

body.acc-text-x3 .item-content h3 {
  font-size: 39px !important;
}

body.acc-text-x3 .item-content p {
  font-size: 31px !important;
}

/* Fix: Why Choose Section Text Alignment */

/* LEFT */
body.acc-align-left .credibility-anchor,
body.acc-align-left .sub-title,
body.acc-align-left .anchor-title,
body.acc-align-left .anchor-subtitle,
body.acc-align-left .item-content h3,
body.acc-align-left .item-content p {
  text-align: left !important;
}

body.acc-align-left .item-meta {
  align-items: flex-start !important;
}

/* CENTER */
body.acc-align-center .credibility-anchor,
body.acc-align-center .sub-title,
body.acc-align-center .anchor-title,
body.acc-align-center .anchor-subtitle,
body.acc-align-center .item-content h3,
body.acc-align-center .item-content p {
  text-align: center !important;
}

body.acc-align-center .item-meta {
  align-items: center !important;
}

/* RIGHT */
body.acc-align-right .credibility-anchor,
body.acc-align-right .sub-title,
body.acc-align-right .anchor-title,
body.acc-align-right .anchor-subtitle,
body.acc-align-right .item-content h3,
body.acc-align-right .item-content p {
  text-align: right !important;
}

body.acc-align-right .item-meta {
  align-items: flex-end !important;
}

/* Fix: CTA Section Text Scaling */
/* Level 1 (120%) */
body.acc-text-x1 .cta-content h2 {
  font-size: 50px !important;
}

body.acc-text-x1 .cta-content p {
  font-size: 24px !important;
}

body.acc-text-x1 .cta-btn .btn-default span {
  font-size: 23px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .cta-content h2 {
  font-size: 59px !important;
}

body.acc-text-x2 .cta-content p {
  font-size: 28px !important;
}

body.acc-text-x2 .cta-btn .btn-default span {
  font-size: 27px !important;
}

/* Fix: Conditions We Treat Section Text Scaling */
/* Base sizes (Approx):
   .conditions-intro h2: ~36px
   .conditions-intro p: 16px
   .condition-card h3: 19.2px
   .btn-view-all-conditions: 16px
*/

/* Level 1 (120%) */
body.acc-text-x1 .conditions-intro h2 {
  font-size: 43px !important;
}

body.acc-text-x1 .conditions-intro p {
  font-size: 19px !important;
}

body.acc-text-x1 .condition-card h3 {
  font-size: 23px !important;
}

body.acc-text-x1 .btn-view-all-conditions {
  font-size: 19px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .conditions-intro h2 {
  font-size: 50px !important;
}

body.acc-text-x2 .conditions-intro p {
  font-size: 22px !important;
}

body.acc-text-x2 .condition-card h3 {
  font-size: 27px !important;
}

body.acc-text-x2 .btn-view-all-conditions {
  font-size: 22px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .conditions-intro h2 {
  font-size: 63px !important;
}

body.acc-text-x3 .conditions-intro p {
  font-size: 28px !important;
}

body.acc-text-x3 .condition-card h3 {
  font-size: 34px !important;
}

body.acc-text-x3 .btn-view-all-conditions {
  font-size: 28px !important;
}

/* Fix: CTA Section Text Scaling - Level 3 & Alignment Restore */
body.acc-text-x3 .cta-section h2 {
  font-size: 70px !important;
}

body.acc-text-x3 .cta-section .lead {
  font-size: 35px !important;
}

body.acc-text-x3 .cta-section .btn {
  font-size: 28px !important;
}

/* Fix: CTA Section Text Alignment */
/* LEFT */
body.acc-align-left .cta-content,
body.acc-align-left .cta-content h2,
body.acc-align-left .cta-content p {
  text-align: left !important;
}

body.acc-align-left .cta-btn {
  text-align: left !important;
}

/* CENTER */
body.acc-align-center .cta-content,
body.acc-align-center .cta-content h2,
body.acc-align-center .cta-content p {
  text-align: center !important;
}

body.acc-align-center .cta-btn {
  text-align: center !important;
}

/* RIGHT */
body.acc-align-right .cta-content,
body.acc-align-right .cta-content h2,
body.acc-align-right .cta-content p {
  text-align: right !important;
}

body.acc-align-right .cta-btn {
  text-align: right !important;
}

/* Fix: Regenerative Medicine Icon Black in Invert Mode */
html[data-contrast="invert"] .regen-icon-box svg {
  color: #000000 !important;
  /* Visual Black (Double Invert) */
  filter: none !important;
}

/* Fix: Conditions We Treat Section Text Scaling */
/* Base sizes (Approx):
   .conditions-intro h2: ~36px
   .conditions-intro p: 16px
   .condition-card h3: 19.2px
   .btn-view-all-conditions: 16px
*/

/* Level 1 (120%) */
body.acc-text-x1 .conditions-intro h2 {
  font-size: 43px !important;
}

body.acc-text-x1 .conditions-intro p {
  font-size: 19px !important;
}

body.acc-text-x1 .condition-card h3 {
  font-size: 23px !important;
}

body.acc-text-x1 .btn-view-all-conditions {
  font-size: 19px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .conditions-intro h2 {
  font-size: 50px !important;
}

body.acc-text-x2 .conditions-intro p {
  font-size: 22px !important;
}

body.acc-text-x2 .condition-card h3 {
  font-size: 27px !important;
}

body.acc-text-x2 .btn-view-all-conditions {
  font-size: 22px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .conditions-intro h2 {
  font-size: 63px !important;
}

body.acc-text-x3 .conditions-intro p {
  font-size: 28px !important;
}

body.acc-text-x3 .condition-card h3 {
  font-size: 34px !important;
}

body.acc-text-x3 .btn-view-all-conditions {
  font-size: 28px !important;
}

/* Fix: CTA Section Text Scaling - Level 3 & Alignment Restore */
body.acc-text-x3 .cta-section h2 {
  font-size: 70px !important;
}

body.acc-text-x3 .cta-section .lead {
  font-size: 35px !important;
}

body.acc-text-x3 .cta-section .btn {
  font-size: 28px !important;
}

/* Fix: CTA Section Text Alignment */
/* LEFT */
body.acc-align-left .cta-content,
body.acc-align-left .cta-content h2,
body.acc-align-left .cta-content p {
  text-align: left !important;
}

body.acc-align-left .cta-btn {
  text-align: left !important;
}

/* CENTER */
body.acc-align-center .cta-content,
body.acc-align-center .cta-content h2,
body.acc-align-center .cta-content p {
  text-align: center !important;
}

body.acc-align-center .cta-btn {
  text-align: center !important;
}

/* RIGHT */
body.acc-align-right .cta-content,
body.acc-align-right .cta-content h2,
body.acc-align-right .cta-content p {
  text-align: right !important;
}

body.acc-align-right .cta-btn {
  text-align: right !important;
}

/* Fix: Regenerative Medicine Icon Black in Invert Mode */
html[data-contrast="invert"] .regen-icon-box svg {
  color: #ffffff !important;
  /* Visual Black (Inverts to Black) */
  filter: none !important;
}

/* Fix: Treatment Checkmark Icons Yellow in Dark Contrast Mode */
html[data-contrast="dark"] .treatment-check svg {
  color: #ffff00 !important;
  stroke: #ffff00 !important;
}

/* Fix: Regenerative Medicine Icon Black in Light Mode */
html[data-contrast="light"] .regen-icon-box svg {
  color: #000000 !important;
  stroke: #000000 !important;
}

/* Fix: Advanced Treatments Section Text Scaling */

/* Level 1 (120%) */
body.acc-text-x1 .treatments-intro h2 {
  font-size: 42px !important;
}

body.acc-text-x1 .treatments-intro p {
  font-size: 22px !important;
}

body.acc-text-x1 .treatment-item span {
  font-size: 20px !important;
}

body.acc-text-x1 .regen-content h3 {
  font-size: 23px !important;
}

body.acc-text-x1 .regen-content p {
  font-size: 20px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .treatments-intro h2 {
  font-size: 49px !important;
}

body.acc-text-x2 .treatments-intro p {
  font-size: 26px !important;
}

body.acc-text-x2 .treatment-item span {
  font-size: 24px !important;
}

body.acc-text-x2 .regen-content h3 {
  font-size: 27px !important;
}

body.acc-text-x2 .regen-content p {
  font-size: 24px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .treatments-intro h2 {
  font-size: 62px !important;
}

body.acc-text-x3 .treatments-intro p {
  font-size: 32px !important;
}

body.acc-text-x3 .treatment-item span {
  font-size: 29px !important;
}

body.acc-text-x3 .regen-content h3 {
  font-size: 34px !important;
}

body.acc-text-x3 .regen-content p {
  font-size: 29px !important;
}

/* Fix: Advanced Treatments Section Text Alignment */

/* Left Alignment */
body.acc-align-left .treatments-section,
body.acc-align-left .treatments-intro,
body.acc-align-left .treatment-list-container,
body.acc-align-left .regen-content,
body.acc-align-left .regen-content {
  text-align: left !important;
  justify-content: flex-start !important;
}

body.acc-align-left .treatment-item {
  text-align: left !important;
  justify-content: flex-start !important;
}

body.acc-align-left .treatments-intro p {
  margin-left: 0 !important;
  margin-right: auto !important;
}

body.acc-align-left .regenerative-banner {
  flex-direction: row !important;
  justify-content: flex-start !important;
  border-left: 5px solid var(--secondary-color) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
  text-align: left !important;
}

body.acc-align-left .regen-icon-box {
  margin-right: 25px !important;
  margin-left: 0 !important;
  margin-bottom: 0 !important;
}

/* Center Alignment */
body.acc-align-center .treatments-section,
body.acc-align-center .treatments-intro,
body.acc-align-center .treatment-list-container,
body.acc-align-center .regen-content {
  text-align: center !important;
  justify-content: center !important;
}

body.acc-align-center .treatment-item {
  text-align: center !important;
  justify-content: center !important;
}

body.acc-align-center .treatments-intro p {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Ensure flex direction allows centering for horizontal items */
body.acc-align-center .treatment-item {
  display: flex !important;
  flex-direction: row !important;
}

/* Center the banner content specifically */
body.acc-align-center .regenerative-banner {
  text-align: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  /* Stack icon and text for better centering */
  border-left: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
  padding-top: 45px !important;
  padding-bottom: 45px !important;
}

body.acc-align-center .regen-icon-box {
  margin-right: 0 !important;
  margin-left: 0 !important;
  margin-bottom: 15px !important;
}

/* Right Alignment */
body.acc-align-right .treatments-section,
body.acc-align-right .treatments-intro,
body.acc-align-right .treatment-list-container,
body.acc-align-right .regen-content {
  text-align: right !important;
  justify-content: flex-end !important;
}

body.acc-align-right .treatment-item {
  text-align: right !important;
  justify-content: flex-end !important;
}

body.acc-align-right .treatments-intro p {
  margin-left: auto !important;
  margin-right: 0 !important;
}

/* Ensure flex direction allows right alignment for horizontal items */
body.acc-align-right .treatment-item {
  display: flex !important;
  flex-direction: row-reverse !important;
  justify-content: flex-start !important;
  /* Visual Right in Row-Reverse */
}

body.acc-align-right .treatment-check {
  margin-right: 0 !important;
  margin-left: 15px !important;
}

body.acc-align-right .regenerative-banner {
  display: flex !important;
  flex-direction: row-reverse !important;
  justify-content: flex-start !important;
  /* Visual Right in Row-Reverse */
  border-right: 5px solid var(--secondary-color) !important;
  border-left: 1px solid rgba(255, 255, 255, 0.1) !important;
  text-align: right !important;
}

body.acc-align-right .regen-icon-box {
  margin-right: 0 !important;
  margin-left: 25px !important;
  margin-bottom: 0 !important;
}

/* Fix: Benefit Icons High Contrast - Invert Mode */
html[data-contrast="invert"] .benefit-icon svg {
  color: #ffff00 !important;
  stroke: #ffff00 !important;
  transition: all 0.3s ease !important;
}

html[data-contrast="invert"] .benefit-card:hover .benefit-icon svg {
  color: #000000 !important;
  stroke: #000000 !important;
}

/* Fix: Benefit Cards - Dark Contrast Mode */
html[data-contrast="dark"] .benefit-card {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
}

/* Fix: Benefit Icons Background - Dark Contrast Mode */
html[data-contrast="dark"] .benefit-icon {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
  color: #ffff00 !important;
}

/* Fix: Text Scaling for Why Choose Us Section */

/* Level 1 (120%) */
body.acc-text-x1 .why-choose-header h2 {
  font-size: 50px !important;
}

body.acc-text-x1 .benefit-card h3 {
  font-size: 29px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .why-choose-header h2 {
  font-size: 59px !important;
}

body.acc-text-x2 .benefit-card h3 {
  font-size: 34px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .why-choose-header h2 {
  font-size: 73px !important;
}

body.acc-text-x3 .benefit-card h3 {
  font-size: 42px !important;
}

/* Fix: Visit Section Icons - Invert Mode */
html[data-contrast="invert"] .info-group h3 svg {
  color: #000000 !important;
  stroke: #000000 !important;
}

html[data-contrast="invert"] .appt-list li svg {
  color: #000000 !important;
  stroke: #000000 !important;
}

/* Fix: Appointment List Icons - Light Contrast Mode */
html[data-contrast="light"] .appt-list li svg {
  color: #000000 !important;
  stroke: #000000 !important;
}

/* Fix: Text Scaling for Visit Location Section */

/* Level 1 (120%) */
body.acc-text-x1 .visit-content h2 {
  font-size: 48px !important;
}

body.acc-text-x1 .address-block p {
  font-size: 24px !important;
}

body.acc-text-x1 .info-group h3 {
  font-size: 21px !important;
}

body.acc-text-x1 .info-list li {
  font-size: 21px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .visit-content h2 {
  font-size: 56px !important;
}

body.acc-text-x2 .address-block p {
  font-size: 28px !important;
}

body.acc-text-x2 .info-group h3 {
  font-size: 25px !important;
}

body.acc-text-x2 .info-list li {
  font-size: 25px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .visit-content h2 {
  font-size: 70px !important;
}

body.acc-text-x3 .address-block p {
  font-size: 35px !important;
}

body.acc-text-x3 .info-group h3 {
  font-size: 31px !important;
}

body.acc-text-x3 .info-list li {
  font-size: 31px !important;
}

/* Fix: Text Alignment for Visit Location Card */

/* Left Alignment */
body.acc-align-left .visit-card,
body.acc-align-left .info-group h3,
body.acc-align-left .info-list li {
  text-align: left !important;
  justify-content: flex-start !important;
  flex-direction: row !important;
}

body.acc-align-left .info-group h3 {
  gap: 10px !important;
}

body.acc-align-left .info-list {
  padding-left: 0 !important;
}

body.acc-align-left .info-list li:not(.appt-list li) {
  justify-content: space-between !important;
  /* Keep Hours separated */
}

/* Center Alignment */
body.acc-align-center .visit-card,
body.acc-align-center .info-group h3,
body.acc-align-center .info-list li {
  text-align: center !important;
  justify-content: center !important;
  flex-direction: row !important;
  /* Keep items ordered but centered */
}

body.acc-align-center .info-group h3 {
  gap: 10px !important;
}

body.acc-align-center .appt-list li {
  flex-direction: column !important;
  /* Stack icon and text for better centering */
  align-items: center !important;
}

body.acc-align-center .info-list li:not(.appt-list li) {
  flex-direction: column !important;
  /* Stack Day and Time for centering */
  gap: 5px !important;
  align-items: center !important;
}

/* Right Alignment */
body.acc-align-right .visit-card,
body.acc-align-right .info-group h3,
body.acc-align-right .info-list li {
  text-align: right !important;
  justify-content: flex-end !important;
  flex-direction: row-reverse !important;
  /* Icon moves to right */
}

body.acc-align-right .info-group h3 {
  gap: 10px !important;
}

body.acc-align-right .info-list {
  padding-left: 0 !important;
}

body.acc-align-right .appt-list li svg {
  margin-right: 0 !important;
  margin-left: 10px !important;
}

body.acc-align-right .info-list li:not(.appt-list li) {
  justify-content: space-between !important;
  /* Keep separated but flipped */
  flex-direction: row-reverse !important;
}

/* Fix: FAQ Section Alignment */

/* Left Alignment */
body.acc-align-left .location-faq-section,
body.acc-align-left .location-faq-section .section-title,
body.acc-align-left .accordion-button,
body.acc-align-left .accordion-body {
  text-align: left !important;
}

body.acc-align-left .accordion-button {
  justify-content: flex-start !important;
}

/* Center Alignment */
body.acc-align-center .location-faq-section .section-title,
body.acc-align-center .accordion-button,
body.acc-align-center .accordion-body {
  text-align: center !important;
}

body.acc-align-center .accordion-button {
  justify-content: center !important;
}

/* Hide or adjust the accordion icon if centered to avoid visual imbalance */
body.acc-align-center .accordion-button::after {
  position: absolute !important;
  right: 20px !important;
}

/* Right Alignment */
body.acc-align-right .location-faq-section .section-title,
body.acc-align-right .accordion-button,
body.acc-align-right .accordion-body {
  text-align: right !important;
}

body.acc-align-right .accordion-button {
  justify-content: flex-end !important;
  padding-right: 50px !important;
  /* Make room for the icon */
}

body.acc-align-right .accordion-button::after {
  position: absolute !important;
  left: 20px !important;
  right: auto !important;
}

/* Fix: Location CTA Section - Light Contrast Mode */
html[data-contrast="light"] .cta-box .section-title h2,
html[data-contrast="light"] .cta-box .section-title p,
html[data-contrast="light"] .cta-box .section-title .sub-title {
  color: #000000 !important;
  opacity: 1 !important;
}

/* Fix: Doctor Credential Icons - Invert Mode */
html[data-contrast="invert"] .cred-icon img {
  filter: brightness(0) saturate(100%) invert(98%) sepia(95%) saturate(7483%) hue-rotate(3deg)
    brightness(103%) contrast(106%) invert(100%) hue-rotate(180deg) !important;
}

/* Fix: Doctor Credential Grid & Items - Dark Contrast Mode */
html[data-contrast="dark"] .credential-grid {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
}

html[data-contrast="dark"] .credential-item {
  background-color: #000000 !important;
  border: 1px solid #333333 !important;
  /* Subtle inner border or none */
  padding: 15px !important;
  border-radius: 12px !important;
}

html[data-contrast="dark"] .cred-text strong,
html[data-contrast="dark"] .cred-text span {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .cred-icon img {
  filter: brightness(0) saturate(100%) invert(98%) sepia(95%) saturate(7483%) hue-rotate(3deg)
    brightness(103%) contrast(106%) !important;
}

/* Fix: Doctor Credential Text - Light Contrast Mode */
html[data-contrast="light"] .cred-text strong,
html[data-contrast="light"] .cred-text span {
  color: #000000 !important;
  opacity: 1 !important;
}

/* Fix: Text Scaling for Physician Profile Section */

/* Level 1 (120%) */
body.acc-text-x1 .physician-info-wrapper .section-title .sub-title {
  font-size: 22px !important;
}

body.acc-text-x1 .physician-info-wrapper .section-title h1 {
  font-size: 48px !important;
}

body.acc-text-x1 .specialty-breadcrumb {
  font-size: 24px !important;
}

body.acc-text-x1 .physician-career-bio p {
  font-size: 23px !important;
}

body.acc-text-x1 .cred-text strong {
  font-size: 17px !important;
}

body.acc-text-x1 .cred-text span {
  font-size: 21px !important;
}

body.acc-text-x1 .physician-action .btn-default span {
  font-size: 19px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .physician-info-wrapper .section-title .sub-title {
  font-size: 25px !important;
}

body.acc-text-x2 .physician-info-wrapper .section-title h1 {
  font-size: 56px !important;
}

body.acc-text-x2 .specialty-breadcrumb {
  font-size: 28px !important;
}

body.acc-text-x2 .physician-career-bio p {
  font-size: 27px !important;
}

body.acc-text-x2 .cred-text strong {
  font-size: 20px !important;
}

body.acc-text-x2 .cred-text span {
  font-size: 25px !important;
}

body.acc-text-x2 .physician-action .btn-default span {
  font-size: 22px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .physician-info-wrapper .section-title .sub-title {
  font-size: 31px !important;
}

body.acc-text-x3 .physician-info-wrapper .section-title h1 {
  font-size: 70px !important;
}

body.acc-text-x3 .specialty-breadcrumb {
  font-size: 35px !important;
}

body.acc-text-x3 .physician-career-bio p {
  font-size: 33px !important;
}

body.acc-text-x3 .cred-text strong {
  font-size: 25px !important;
}

body.acc-text-x3 .cred-text span {
  font-size: 31px !important;
}

body.acc-text-x3 .physician-action .btn-default span {
  font-size: 28px !important;
}

/* Fix: Expertise Icons - Invert Mode (Black on Screen) */
html[data-contrast="invert"] .expertise-icon-box img {
  /* Step 1: Force image to White | Step 2: Let global HTML inversion flip it to Black */
  filter: brightness(0) invert(1) !important;
}

html[data-contrast="invert"] .expertise-card:hover .expertise-icon-box img {
  /* Step 1: Force image to Black | Step 2: Let global HTML inversion flip it to White */
  filter: brightness(0) !important;
}

/* Fix: Expertise Icons - Dark Contrast Mode Hover */
html[data-contrast="dark"] .expertise-card:hover .expertise-icon-box img {
  filter: brightness(0) invert(1) !important;
}

/* Fix: Expertise Icons - Light Contrast Mode */
html[data-contrast="light"] .expertise-icon-box img,
html[data-contrast="light"] .expertise-card:hover .expertise-icon-box img {
  filter: brightness(0) !important;
}

/* Fix: Expertise Section Titles - Light Contrast Mode */
html[data-contrast="light"] .expertise-section .section-title h2,
html[data-contrast="light"] .expertise-section .section-title .sub-title {
  color: #000000 !important;
}

/* Fix: Text Scaling for Expertise Section */

/* Level 1 (120%) */
body.acc-text-x1 .expertise-section .section-title .sub-title {
  font-size: 22px !important;
}

body.acc-text-x1 .expertise-section .section-title h2 {
  font-size: 48px !important;
}

body.acc-text-x1 .expertise-card h3 {
  font-size: 23px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .expertise-section .section-title .sub-title {
  font-size: 25px !important;
}

body.acc-text-x2 .expertise-section .section-title h2 {
  font-size: 56px !important;
}

body.acc-text-x2 .expertise-card h3 {
  font-size: 27px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .expertise-section .section-title .sub-title {
  font-size: 31px !important;
}

body.acc-text-x3 .expertise-section .section-title h2 {
  font-size: 70px !important;
}

body.acc-text-x3 .expertise-card h3 {
  font-size: 34px !important;
}

/* Fix: Qualifications / Decorative Creds Section - Dark Contrast Mode */
html[data-contrast="dark"] .decorative-creds-section {
  background-color: #000000 !important;
  background-image: none !important;
}

html[data-contrast="dark"] .creds-title-wrapper .sub-title,
html[data-contrast="dark"] .creds-title-wrapper h2,
html[data-contrast="dark"] .creds-icon-title h3 {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .d-timeline-item,
html[data-contrast="dark"] .cert-badge-card {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .dt-degree,
html[data-contrast="dark"] .dt-inst,
html[data-contrast="dark"] .cert-text h5,
html[data-contrast="dark"] .cert-text span {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .d-timeline-item::after {
  background-color: #000000 !important;
  border-color: #ffff00 !important;
}

html[data-contrast="dark"] .cert-seal {
  background: #000000 !important;
  color: #ffff00 !important;
  border: 1px solid #ffff00 !important;
  outline: none !important;
}

html[data-contrast="dark"] .feature-proficiency {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
  background-image: none !important;
}

html[data-contrast="dark"] .feature-proficiency::before {
  display: none !important;
}

html[data-contrast="dark"] .fp-title,
html[data-contrast="dark"] .fp-desc,
html[data-contrast="dark"] .fp-desc strong {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .fp-label {
  background-color: #000000 !important;
  color: #ffff00 !important;
  border: 1px solid #ffff00 !important;
}

/* Fix: Regenexx Featured Block - Light Contrast Mode */
html[data-contrast="light"] .feature-proficiency {
  background-color: #ffffff !important;
  background-image: none !important;
  border: 1px solid #000000 !important;
  color: #000000 !important;
}

html[data-contrast="light"] .feature-proficiency::before {
  display: none !important;
}

html[data-contrast="light"] .fp-title,
html[data-contrast="light"] .fp-desc,
html[data-contrast="light"] .fp-desc strong {
  color: #000000 !important;
}

html[data-contrast="light"] .fp-label {
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* Fix: Qualifications Section - Light Contrast Mode */
html[data-contrast="light"] .decorative-creds-section {
  background-color: #ffffff !important;
  background-image: none !important;
}

html[data-contrast="light"] .creds-title-wrapper .sub-title,
html[data-contrast="light"] .creds-title-wrapper h2,
html[data-contrast="light"] .creds-icon-title h3 {
  color: #000000 !important;
}

/* Fix: Text Scaling for Qualifications Section */

/* Level 1 (120%) */
body.acc-text-x1 .decorative-creds-section .sub-title {
  font-size: 20px !important;
}

body.acc-text-x1 .creds-title-wrapper h2 {
  font-size: 48px !important;
}

body.acc-text-x1 .creds-icon-title h3 {
  font-size: 35px !important;
}

body.acc-text-x1 .dt-degree {
  font-size: 22px !important;
}

body.acc-text-x1 .dt-inst {
  font-size: 19px !important;
}

body.acc-text-x1 .cert-text h5 {
  font-size: 21px !important;
}

body.acc-text-x1 .cert-text span {
  font-size: 17px !important;
}

body.acc-text-x1 .fp-label {
  font-size: 15px !important;
}

body.acc-text-x1 .fp-title {
  font-size: 35px !important;
}

body.acc-text-x1 .fp-desc {
  font-size: 21px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .decorative-creds-section .sub-title {
  font-size: 23px !important;
}

body.acc-text-x2 .creds-title-wrapper h2 {
  font-size: 56px !important;
}

body.acc-text-x2 .creds-icon-title h3 {
  font-size: 41px !important;
}

body.acc-text-x2 .dt-degree {
  font-size: 26px !important;
}

body.acc-text-x2 .dt-inst {
  font-size: 22px !important;
}

body.acc-text-x2 .cert-text h5 {
  font-size: 25px !important;
}

body.acc-text-x2 .cert-text span {
  font-size: 20px !important;
}

body.acc-text-x2 .fp-label {
  font-size: 18px !important;
}

body.acc-text-x2 .fp-title {
  font-size: 41px !important;
}

body.acc-text-x2 .fp-desc {
  font-size: 25px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .decorative-creds-section .sub-title {
  font-size: 29px !important;
}

body.acc-text-x3 .creds-title-wrapper h2 {
  font-size: 70px !important;
}

body.acc-text-x3 .creds-icon-title h3 {
  font-size: 51px !important;
}

body.acc-text-x3 .dt-degree {
  font-size: 32px !important;
}

body.acc-text-x3 .dt-inst {
  font-size: 28px !important;
}

body.acc-text-x3 .cert-text h5 {
  font-size: 31px !important;
}

body.acc-text-x3 .cert-text span {
  font-size: 25px !important;
}

body.acc-text-x3 .fp-label {
  font-size: 22px !important;
}

body.acc-text-x3 .fp-title {
  font-size: 51px !important;
}

body.acc-text-x3 .fp-desc {
  font-size: 31px !important;
}

/* Fix: Text Alignment for Qualifications Section */

/* Center Alignment */
body.acc-align-center .decorative-creds-section .creds-title-wrapper,
body.acc-align-center .decorative-creds-section .creds-icon-title,
body.acc-align-center .decorative-creds-section .d-timeline-item,
body.acc-align-center .decorative-creds-section .cert-badge-card,
body.acc-align-center .decorative-creds-section .feature-proficiency {
  text-align: center !important;
}

body.acc-align-center .creds-icon-title {
  justify-content: center !important;
}

body.acc-align-center .cert-badge-card {
  flex-direction: column !important;
}

body.acc-align-center .cert-badge-card .cert-seal {
  margin-right: 0 !important;
  margin-bottom: 15px !important;
}

body.acc-align-center .decorative-timeline {
  padding-left: 0 !important;
  text-align: center !important;
}

body.acc-align-center .decorative-timeline::before,
body.acc-align-center .d-timeline-item::before,
body.acc-align-center .d-timeline-item::after {
  display: none !important;
}

body.acc-align-center .dt-degree {
  justify-content: center !important;
  text-align: center !important;
  flex-direction: column !important;
}

body.acc-align-center .dt-inst {
  text-align: center !important;
}

/* Right Alignment */
body.acc-align-right .decorative-creds-section .creds-title-wrapper,
body.acc-align-right .decorative-creds-section .creds-icon-title,
body.acc-align-right .decorative-creds-section .d-timeline-item,
body.acc-align-right .decorative-creds-section .cert-badge-card,
body.acc-align-right .decorative-creds-section .feature-proficiency {
  text-align: right !important;
}

body.acc-align-right .creds-icon-title {
  justify-content: flex-start !important;
  flex-direction: row-reverse !important;
  text-align: right !important;
}

body.acc-align-right .creds-icon-title h3 {
  text-align: right !important;
}

body.acc-align-right .cert-badge-card {
  flex-direction: row-reverse !important;
}

body.acc-align-right .cert-badge-card .cert-seal {
  margin-right: 0 !important;
  margin-left: 25px !important;
}

body.acc-align-right .decorative-timeline {
  padding-left: 0 !important;
  padding-right: 40px !important;
}

body.acc-align-right .decorative-timeline::before {
  left: auto !important;
  right: 14px !important;
}

body.acc-align-right .d-timeline-item::after {
  left: auto !important;
  right: -32px !important;
}

/* Ensure no stray elements on the left */
body.acc-align-right .d-timeline-item::before,
body.acc-align-right .decorative-timeline::after {
  display: none !important;
}

body.acc-align-right .dt-degree {
  display: block !important;
  text-align: right !important;
}

body.acc-align-right .dt-inst,
body.acc-align-right .fp-title,
body.acc-align-right .fp-desc {
  text-align: right !important;
  width: 100% !important;
}

/* Fix: Regenexx Block specific alignment */
body.acc-align-right .fp-content {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  text-align: right !important;
}

/* Fix: Stray dots and centering glitches in Right Mode */
body.acc-align-right .creds-title-wrapper {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  text-align: right !important;
}

body.acc-align-right .creds-title-wrapper::before,
body.acc-align-right .creds-title-wrapper::after,
body.acc-align-right .d-timeline-item::before,
body.acc-align-right .fp-content::before,
body.acc-align-right .fp-content::after {
  display: none !important;
}

/* Left Alignment (Explicit Override) */
body.acc-align-left .decorative-creds-section .creds-title-wrapper,
body.acc-align-left .decorative-creds-section .creds-icon-title,
body.acc-align-left .decorative-creds-section .d-timeline-item,
body.acc-align-left .decorative-creds-section .cert-badge-card,
body.acc-align-left .decorative-creds-section .feature-proficiency {
  text-align: left !important;
}

body.acc-align-left .creds-icon-title {
  justify-content: flex-start !important;
  flex-direction: row !important;
}

body.acc-align-left .cert-badge-card {
  flex-direction: row !important;
}

/* Fix: Telehealth Icon - Invert Mode */
html[data-contrast="invert"] .info-glass-panel {
  background: #ffffff !important;
  /* Inverts to Black on screen */
  border-color: #0000ff !important;
  /* Inverts to Yellow */
}

html[data-contrast="invert"] .info-glass-icon {
  background: #ffffff !important;
  /* Inverts to Black on screen */
  color: #0000ff !important;
  /* Inverts to Bright Yellow on screen */
  border: 1px solid #0000ff !important;
}

html[data-contrast="invert"] .info-glass-icon svg {
  color: #0000ff !important;
  stroke: #0000ff !important;
  fill: none !important;
  /* Double Check: Use filter to force brightness if needed */
  filter: brightness(0) saturate(100%) invert(98%) sepia(95%) saturate(7483%) hue-rotate(3deg)
    brightness(103%) contrast(106%) invert(100%) hue-rotate(180deg) !important;
}

html[data-contrast="invert"] .info-glass-text h5 {
  color: #0000ff !important;
  /* Inverts to Bright Yellow on screen */
}

html[data-contrast="invert"] .info-glass-text span {
  color: #000000 !important;
  /* Inverts to White on screen for max brightness */
}

/* Fix: Clinic Hours Section & Schedule Card - Dark Contrast Mode */
html[data-contrast="dark"] .clinic-hours-section {
  background-color: #000000 !important;
  background-image: none !important;
}

html[data-contrast="dark"] .hours-intro-col h2,
html[data-contrast="dark"] .hours-intro-col p,
html[data-contrast="dark"] .hours-intro-col .sub-title {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .hours-card {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .hours-card::before {
  background: #ffff00 !important;
}

html[data-contrast="dark"] .hours-card h3,
html[data-contrast="dark"] .day-name,
html[data-contrast="dark"] .time-slot,
html[data-contrast="dark"] .day-icon {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .hours-card h3 {
  border-bottom-color: #ffff00 !important;
}

html[data-contrast="dark"] .hour-row {
  border-bottom: 1px dashed #ffff00 !important;
}

html[data-contrast="dark"] .hour-row:hover {
  background: transparent !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .avail-badge {
  background-color: #000000 !important;
  color: #ffff00 !important;
  border: 1px solid #ffff00 !important;
}

html[data-contrast="dark"] .info-glass-panel {
  background: #000000 !important;
  border: 1px solid #ffff00 !important;
}

html[data-contrast="dark"] .info-glass-icon {
  background: #000000 !important;
  color: #ffff00 !important;
  border: 1px solid #ffff00 !important;
}

html[data-contrast="dark"] .info-glass-icon svg {
  color: #ffff00 !important;
  stroke: #ffff00 !important;
}

html[data-contrast="dark"] .info-glass-text h5,
html[data-contrast="dark"] .info-glass-text span {
  color: #ffff00 !important;
}

/* Fix: Clinic Hours Section & Schedule Card - Light Contrast Mode */
html[data-contrast="light"] .clinic-hours-section {
  background-color: #ffffff !important;
  background-image: none !important;
}

html[data-contrast="light"] .hours-intro-col h2,
html[data-contrast="light"] .hours-intro-col p,
html[data-contrast="light"] .hours-intro-col .sub-title {
  color: #000000 !important;
}

html[data-contrast="light"] .info-glass-panel {
  background: #ffffff !important;
  border: 1px solid #000000 !important;
}

html[data-contrast="light"] .info-glass-icon {
  background: #ffffff !important;
  color: #000000 !important;
  border: 1px solid #000000 !important;
}

html[data-contrast="light"] .info-glass-icon svg {
  color: #000000 !important;
  stroke: #000000 !important;
}

html[data-contrast="light"] .info-glass-text h5,
html[data-contrast="light"] .info-glass-text span {
  color: #000000 !important;
}

html[data-contrast="light"] .hours-card {
  background-color: #ffffff !important;
  border: 1px solid #000000 !important;
  box-shadow: none !important;
}

html[data-contrast="light"] .hours-card::before {
  background: #000000 !important;
}

html[data-contrast="light"] .hours-list h3,
html[data-contrast="light"] .hours-card h3,
html[data-contrast="light"] .day-name,
html[data-contrast="light"] .time-slot,
html[data-contrast="light"] .day-icon {
  color: #000000 !important;
}

html[data-contrast="light"] .hours-card h3 {
  border-bottom-color: #000000 !important;
}

html[data-contrast="light"] .hour-row {
  border-bottom: 1px dashed #000000 !important;
}

html[data-contrast="light"] .avail-badge {
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* Fix: Text Scaling for Clinic Hours Section */

/* Level 1 (120%) */
body.acc-text-x1 .hours-intro-col .sub-title {
  font-size: 20px !important;
}

body.acc-text-x1 .hours-intro-col h2 {
  font-size: 48px !important;
}

body.acc-text-x1 .hours-intro-col p {
  font-size: 21px !important;
}

body.acc-text-x1 .info-glass-text h5 {
  font-size: 21px !important;
}

body.acc-text-x1 .info-glass-text span {
  font-size: 17px !important;
}

body.acc-text-x1 .hours-card h3 {
  font-size: 27px !important;
}

body.acc-text-x1 .day-name {
  font-size: 21px !important;
}

body.acc-text-x1 .time-slot {
  font-size: 20px !important;
}

body.acc-text-x1 .avail-badge {
  font-size: 14px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .hours-intro-col .sub-title {
  font-size: 23px !important;
}

body.acc-text-x2 .hours-intro-col h2 {
  font-size: 56px !important;
}

body.acc-text-x2 .hours-intro-col p {
  font-size: 25px !important;
}

body.acc-text-x2 .info-glass-text h5 {
  font-size: 25px !important;
}

body.acc-text-x2 .info-glass-text span {
  font-size: 20px !important;
}

body.acc-text-x2 .hours-card h3 {
  font-size: 31px !important;
}

body.acc-text-x2 .day-name {
  font-size: 25px !important;
}

body.acc-text-x2 .time-slot {
  font-size: 24px !important;
}

body.acc-text-x2 .avail-badge {
  font-size: 16px !important;
}

body.acc-text-x2 .hour-row {
  flex-wrap: wrap !important;
  gap: 10px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .hours-intro-col .sub-title {
  font-size: 29px !important;
}

body.acc-text-x3 .hours-intro-col h2 {
  font-size: 70px !important;
}

body.acc-text-x3 .hours-intro-col p {
  font-size: 31px !important;
}

body.acc-text-x3 .info-glass-text h5 {
  font-size: 31px !important;
}

body.acc-text-x3 .info-glass-text span {
  font-size: 25px !important;
}

body.acc-text-x3 .hours-card h3 {
  font-size: 39px !important;
}

body.acc-text-x3 .day-name {
  font-size: 31px !important;
}

body.acc-text-x3 .time-slot {
  font-size: 30px !important;
}

body.acc-text-x3 .avail-badge {
  font-size: 20px !important;
}

body.acc-text-x3 .hour-row {
  flex-wrap: wrap !important;
  gap: 15px !important;
}

body.acc-text-x3 .day-name {
  width: 100% !important;
}

body.acc-text-x3 .time-slot {
  text-align: left !important;
  width: 100% !important;
}

/* Fix: Career Narrative Section - Dark Contrast Mode */
html[data-contrast="dark"] .career-narrative-section {
  background-color: #000000 !important;
  background-image: none !important;
}

html[data-contrast="dark"] .career-narrative-section::before,
html[data-contrast="dark"] .career-narrative-section::after {
  display: none !important;
}

html[data-contrast="dark"] .narrative-intro h1,
html[data-contrast="dark"] .narrative-block h3,
html[data-contrast="dark"] .narrative-block p {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .narrative-intro h1::after,
html[data-contrast="dark"] .narrative-intro h1::before {
  background-color: #ffff00 !important;
}

html[data-contrast="dark"] .narrative-block::before {
  background-color: #ffff00 !important;
}

html[data-contrast="dark"] .narrative-block::after {
  background-color: #000000 !important;
  border-color: #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .narrative-block.current-role {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .narrative-block.current-role::before {
  background: #ffff00 !important;
}

html[data-contrast="dark"] .narrative-block.current-role::after {
  display: none !important;
}

/* Fix: Career Narrative Section - Light Contrast Mode */
html[data-contrast="light"] .career-narrative-section {
  background-image: none !important;
  background-color: #ffffff !important;
}

html[data-contrast="light"] .career-narrative-section::before,
html[data-contrast="light"] .career-narrative-section::after {
  display: none !important;
}

html[data-contrast="light"] .narrative-intro h1,
html[data-contrast="light"] .narrative-block h3,
html[data-contrast="light"] .narrative-block p {
  color: #000000 !important;
}

html[data-contrast="light"] .narrative-intro h1::after,
html[data-contrast="light"] .narrative-intro h1::before {
  background-color: #000000 !important;
}

html[data-contrast="light"] .narrative-block::before {
  background-color: #000000 !important;
}

html[data-contrast="light"] .narrative-block::after {
  background-color: #ffffff !important;
  border-color: #000000 !important;
  box-shadow: none !important;
}

html[data-contrast="light"] .narrative-block.current-role {
  background-color: #ffffff !important;
  border: 1px solid #000000 !important;
  box-shadow: none !important;
}

html[data-contrast="light"] .narrative-block.current-role::before {
  background: #000000 !important;
}

html[data-contrast="light"] .narrative-block.current-role::after {
  display: none !important;
}

/* Fix: Text Scaling for Career Narrative Section */

/* Level 1 (120%) */
body.acc-text-x1 .career-narrative-section .narrative-intro h1 {
  font-size: 58px !important;
}

body.acc-text-x1 .narrative-block h3 {
  font-size: 26px !important;
}

body.acc-text-x1 .narrative-block p {
  font-size: 22px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .career-narrative-section .narrative-intro h1 {
  font-size: 67px !important;
}

body.acc-text-x2 .narrative-block h3 {
  font-size: 31px !important;
}

body.acc-text-x2 .narrative-block p {
  font-size: 25px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .career-narrative-section .narrative-intro h1 {
  font-size: 84px !important;
}

body.acc-text-x3 .narrative-block h3 {
  font-size: 38px !important;
}

body.acc-text-x3 .narrative-block p {
  font-size: 32px !important;
}

/* Fix: Consultation Contact Icons - Invert Mode */
html[data-contrast="invert"] .contact-icon {
  background-color: #0000ff !important;
  /* Inverts to Yellow circle on screen */
  border-color: #0000ff !important;
}

html[data-contrast="invert"] .contact-icon svg {
  color: #ffffff !important;
  /* Source White -> Inverts to Black on screen */
  stroke: #ffffff !important;
  filter: none !important;
  /* CRITICAL: Prevents the widget from de-inverting the icon back to white */
  stroke-width: 3px !important;
  /* Make it thicker for better contrast */
}

/* Fix: Consultation Section & Appointment Form - Dark Contrast Mode */
html[data-contrast="dark"] .consultation-section {
  background-color: #000000 !important;
  background-image: none !important;
}

html[data-contrast="dark"] .consultation-intro h2,
html[data-contrast="dark"] .consultation-intro p,
html[data-contrast="dark"] .contact-detail h5,
html[data-contrast="dark"] .contact-detail p {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .contact-icon {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
  color: #ffff00 !important;
}

html[data-contrast="dark"] .contact-icon svg {
  color: #ffff00 !important;
  stroke: #ffff00 !important;
}

html[data-contrast="dark"] .profile-appointment-form {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .profile-appointment-form .form-label {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .profile-appointment-form .form-control,
html[data-contrast="dark"] .profile-appointment-form .form-select {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
  color: #ffff00 !important;
}

html[data-contrast="dark"] .profile-appointment-form .form-control::placeholder {
  color: rgba(255, 255, 0, 0.5) !important;
}

html[data-contrast="dark"] .profile-appointment-form button[type="submit"] {
  background-color: #000000 !important;
  color: #ffff00 !important;
  border: 2px solid #ffff00 !important;
}

html[data-contrast="dark"] .profile-appointment-form button[type="submit"]:hover {
  background-color: #ffff00 !important;
  color: #000000 !important;
}

/* Fix: Consultation Section & Contact Icons - Light Contrast Mode */
html[data-contrast="light"] .consultation-section {
  background-color: #ffffff !important;
  background-image: none !important;
}

html[data-contrast="light"] .consultation-intro h2,
html[data-contrast="light"] .consultation-intro p,
html[data-contrast="light"] .contact-detail h5,
html[data-contrast="light"] .contact-detail p {
  color: #000000 !important;
}

html[data-contrast="light"] .contact-icon {
  background-color: #ffffff !important;
  border: 1px solid #000000 !important;
}

html[data-contrast="light"] .contact-icon svg {
  color: #000000 !important;
  stroke: #000000 !important;
}

html[data-contrast="light"] .profile-appointment-form {
  background-color: #ffffff !important;
  border: 1px solid #000000 !important;
  box-shadow: none !important;
}

html[data-contrast="light"] .profile-appointment-form .form-label {
  color: #000000 !important;
}

html[data-contrast="light"] .profile-appointment-form .form-control,
html[data-contrast="light"] .profile-appointment-form .form-select {
  background-color: #ffffff !important;
  border: 1px solid #000000 !important;
  color: #000000 !important;
}

html[data-contrast="light"] .profile-appointment-form button[type="submit"] {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: 1px solid #000000 !important;
}

/* Fix: Text Scaling for Consultation Section & Appointment Form */

/* Level 1 (120%) */
body.acc-text-x1 .consultation-intro h2 {
  font-size: 46px !important;
}

body.acc-text-x1 .consultation-intro p {
  font-size: 21px !important;
}

body.acc-text-x1 .contact-detail h5 {
  font-size: 21px !important;
}

body.acc-text-x1 .contact-detail p {
  font-size: 19px !important;
}

body.acc-text-x1 .profile-appointment-form .form-label {
  font-size: 17px !important;
}

body.acc-text-x1 .profile-appointment-form .form-control,
body.acc-text-x1 .profile-appointment-form .form-select {
  font-size: 19px !important;
}

body.acc-text-x1 .profile-appointment-form button[type="submit"] {
  font-size: 19px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .consultation-intro h2 {
  font-size: 54px !important;
}

body.acc-text-x2 .consultation-intro p {
  font-size: 25px !important;
}

body.acc-text-x2 .contact-detail h5 {
  font-size: 25px !important;
}

body.acc-text-x2 .contact-detail p {
  font-size: 22px !important;
}

body.acc-text-x2 .profile-appointment-form .form-label {
  font-size: 20px !important;
}

body.acc-text-x2 .profile-appointment-form .form-control,
body.acc-text-x2 .profile-appointment-form .form-select {
  font-size: 22px !important;
  height: auto !important;
  padding: 15px !important;
}

body.acc-text-x2 .profile-appointment-form button[type="submit"] {
  font-size: 22px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .consultation-intro h2 {
  font-size: 66px !important;
}

body.acc-text-x3 .consultation-intro p {
  font-size: 31px !important;
}

body.acc-text-x3 .contact-detail h5 {
  font-size: 31px !important;
}

body.acc-text-x3 .contact-detail p {
  font-size: 28px !important;
}

body.acc-text-x3 .profile-appointment-form .form-label {
  font-size: 25px !important;
  text-transform: none !important;
}

body.acc-text-x3 .profile-appointment-form .form-control,
body.acc-text-x3 .profile-appointment-form .form-select {
  font-size: 28px !important;
  height: auto !important;
  padding: 20px !important;
}

body.acc-text-x3 .profile-appointment-form button[type="submit"] {
  font-size: 28px !important;
}

/* Fix: Text Alignment for Consultation Section & Appointment Form */

/* Center Alignment */
body.acc-align-center .consultation-intro,
body.acc-align-center .direct-contact-info,
body.acc-align-center .profile-appointment-form {
  text-align: center !important;
}

body.acc-align-center .contact-item {
  flex-direction: column !important;
  align-items: center !important;
}

body.acc-align-center .contact-icon {
  margin-right: 0 !important;
  margin-bottom: 10px !important;
}

body.acc-align-center .profile-appointment-form .form-label,
body.acc-align-center .profile-appointment-form .form-control,
body.acc-align-center .profile-appointment-form .form-select {
  text-align: center !important;
}

/* Right Alignment */
body.acc-align-right .consultation-intro,
body.acc-align-right .direct-contact-info,
body.acc-align-right .profile-appointment-form {
  text-align: right !important;
}

body.acc-align-right .contact-item {
  flex-direction: row-reverse !important;
  text-align: right !important;
}

body.acc-align-right .contact-icon {
  margin-right: 0 !important;
  margin-left: 20px !important;
}

body.acc-align-right .profile-appointment-form .form-label,
body.acc-align-right .profile-appointment-form .form-control,
body.acc-align-right .profile-appointment-form .form-select {
  text-align: right !important;
}

/* Left Alignment (Reset) */
body.acc-align-left .consultation-intro,
body.acc-align-left .direct-contact-info,
body.acc-align-left .profile-appointment-form {
  text-align: left !important;
}

body.acc-align-left .contact-item {
  flex-direction: row !important;
  text-align: left !important;
}

body.acc-align-left .contact-icon {
  margin-left: 0 !important;
  margin-right: 20px !important;
}

body.acc-align-left .profile-appointment-form .form-label,
body.acc-align-left .profile-appointment-form .form-control,
body.acc-align-left .profile-appointment-form .form-select {
  text-align: left !important;
}

/* =========================================
   HERO REVAMP TEXT SCALING (INDEX PAGE)
   ========================================= */

/* Level 1: Bigger */
body.acc-text-x1 .hero-revamp .hero-label {
  font-size: 14px !important;
}

body.acc-text-x1 .hero-revamp h1 {
  font-size: 54px !important;
}

body.acc-text-x1 .hero-revamp p {
  font-size: 20px !important;
}

body.acc-text-x1 .hero-revamp .badge-item {
  font-size: 17px !important;
}

body.acc-text-x1 .hero-revamp .badge-item i {
  font-size: 16px !important;
}

/* Level 2: Even Bigger */
body.acc-text-x2 .hero-revamp .hero-label {
  font-size: 18px !important;
}

body.acc-text-x2 .hero-revamp h1 {
  font-size: 64px !important;
}

body.acc-text-x2 .hero-revamp p {
  font-size: 24px !important;
}

body.acc-text-x2 .hero-revamp .badge-item {
  font-size: 20px !important;
}

body.acc-text-x2 .hero-revamp .badge-item i {
  font-size: 18px !important;
}

/* Level 3: Maximum */
body.acc-text-x3 .hero-revamp .hero-label {
  font-size: 22px !important;
}

body.acc-text-x3 .hero-revamp h1 {
  font-size: 76px !important;
}

body.acc-text-x3 .hero-revamp p {
  font-size: 28px !important;
}

body.acc-text-x3 .hero-revamp .badge-item {
  font-size: 24px !important;
}

body.acc-text-x3 .hero-revamp .badge-item i {
  font-size: 22px !important;
}

/* =========================================
   HERO REVAMP TEXT ALIGNMENT (INDEX PAGE)
   ========================================= */

/* Center Alignment */
body.acc-align-center .hero-revamp,
body.acc-align-center .hero-content-body {
  text-align: center !important;
  justify-content: center !important;
}

body.acc-align-center .hero-revamp .hero-label,
body.acc-align-center .hero-revamp .hero-highlights {
  justify-content: center !important;
}

body.acc-align-center .hero-revamp p {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Right Alignment */
body.acc-align-right .hero-revamp,
body.acc-align-right .hero-content-body {
  text-align: right !important;
  justify-content: flex-end !important;
}

body.acc-align-right .hero-revamp .hero-label,
body.acc-align-right .hero-revamp .hero-highlights {
  justify-content: flex-end !important;
}

body.acc-align-right .hero-revamp p {
  margin-left: auto !important;
  margin-right: 0 !important;
}

/* Left Alignment (Reset) */
body.acc-align-left .hero-revamp,
body.acc-align-left .hero-content-body {
  text-align: left !important;
  justify-content: flex-start !important;
}

body.acc-align-left .hero-revamp .hero-label,
body.acc-align-left .hero-revamp .hero-highlights {
  justify-content: flex-start !important;
}

body.acc-align-left .hero-revamp p {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* ============================================================================
   PROCEDURE OVERVIEW ICONS - INVERT MODE (Force Black)
   ============================================================================ */

/* Step 1: Set color to White (#ffffff). 
   Step 2: Remove the default .fa-solid double-invert filter.
   Result: The global HTML invert flips the White to VISUAL BLACK. 
*/
html[data-contrast="invert"] .procedure-overview-section .overview-note i,
html[data-contrast="invert"] .procedure-overview-section .overview-footer-note i {
  color: #000000 !important;
  /* Rendered Black -> Visual White */
  filter: none !important;
}

html[data-contrast="invert"] .procedure-overview-section .benefit-icon i {
  color: #ffffff !important;
  /* Rendered White -> Visual Black */
  filter: none !important;
}

/* Optional: If you want the icon to turn White when the user hovers over the Benefit Card */
html[data-contrast="invert"] .procedure-overview-section .benefit-card:hover .benefit-icon i {
  color: #000000 !important;
  /* Rendered Black -> Visual White */
  filter: none !important;
}

/* ============================================================================
   PROCEDURE OVERVIEW TEXT FIXES - LIGHT CONTRAST MODE
   ============================================================================ */

/* 1. Fix the main Overview Note box */
html[data-contrast="light"] .procedure-overview-section .overview-note {
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
  /* Makes the box visible against white bg */
  border-left: 6px solid #000000 !important;
  /* Retains the thick accent line design */
}

/* Ensure all text and icons inside the note are strictly black */
html[data-contrast="light"] .procedure-overview-section .overview-note *,
html[data-contrast="light"] .procedure-overview-section .overview-note i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 2. Fix the Footer Note (Overrides the inline style from the HTML) */
html[data-contrast="light"] .procedure-overview-section .overview-footer-note,
html[data-contrast="light"] .procedure-overview-section .overview-footer-note p,
html[data-contrast="light"] .procedure-overview-section .overview-footer-note i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* ============================================================================
   PROCEDURE OVERVIEW TEXT SCALING (Overrides 'rem' lock)
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .overview-eyebrow {
  font-size: 17px !important;
}

body.acc-text-x1 .overview-title {
  font-size: 48px !important;
}

body.acc-text-x1 .overview-intro-text,
body.acc-text-x1 .overview-footer-note {
  font-size: 22px !important;
}

body.acc-text-x1 .overview-note {
  font-size: 19px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .overview-eyebrow {
  font-size: 20px !important;
}

body.acc-text-x2 .overview-title {
  font-size: 56px !important;
}

body.acc-text-x2 .overview-intro-text,
body.acc-text-x2 .overview-footer-note {
  font-size: 25px !important;
}

body.acc-text-x2 .overview-note {
  font-size: 22px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .overview-eyebrow {
  font-size: 25px !important;
}

body.acc-text-x3 .overview-title {
  font-size: 70px !important;
}

body.acc-text-x3 .overview-intro-text,
body.acc-text-x3 .overview-footer-note {
  font-size: 32px !important;
}

body.acc-text-x3 .overview-note {
  font-size: 28px !important;
}

/* ============================================================================
   CONDITIONS SECTION - ACCESSIBILITY OVERRIDES
   ============================================================================ */

/* --- Text Scaling (Overrides REM units) --- */
/* ============================================================================
   CONDITIONS SECTION - ACCESSIBILITY OVERRIDES
   ============================================================================ */

/* --- Text Scaling (Overrides REM units) --- */

/* Level 1 (120%) */
body.acc-text-x1 .conditions-subtitle {
  font-size: 17px !important;
}

body.acc-text-x1 .condition-desc {
  font-size: 17px !important;
}

body.acc-text-x1 .conditions-note p {
  font-size: 21px !important;
}

body.acc-text-x1 .condition-name {
  font-size: 26px !important;
}

/* Added */

/* Level 2 (140%) */
body.acc-text-x2 .conditions-subtitle {
  font-size: 20px !important;
}

body.acc-text-x2 .condition-desc {
  font-size: 20px !important;
}

body.acc-text-x2 .conditions-note p {
  font-size: 24px !important;
}

body.acc-text-x2 .condition-name {
  font-size: 30px !important;
}

/* Added */

/* Level 3 (175%) */
body.acc-text-x3 .conditions-subtitle {
  font-size: 24px !important;
}

body.acc-text-x3 .condition-desc {
  font-size: 24px !important;
}

body.acc-text-x3 .conditions-note p {
  font-size: 30px !important;
}

body.acc-text-x3 .condition-name {
  font-size: 38px !important;
}

/* Added */
/* --- Dark Contrast Mode --- */
html[data-contrast="dark"] .conditions-section {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .condition-item-card,
html[data-contrast="dark"] .conditions-note {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .conditions-subtitle,
html[data-contrast="dark"] .condition-name,
html[data-contrast="dark"] .condition-desc,
html[data-contrast="dark"] .conditions-note p {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .condition-arrow {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
}

/* --- Light Contrast Mode --- */
html[data-contrast="light"] .conditions-section {
  background-color: #ffffff !important;
}

html[data-contrast="light"] .condition-item-card {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
  box-shadow: none !important;
}

html[data-contrast="light"] .conditions-note {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
  border-top: 6px solid #000000 !important;
}

html[data-contrast="light"] .condition-name,
html[data-contrast="light"] .condition-desc,
html[data-contrast="light"] .conditions-subtitle,
html[data-contrast="light"] .conditions-note p {
  color: #000000 !important;
}

html[data-contrast="light"] .condition-arrow {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
}

/* --- Invert Colors Mode --- */
html[data-contrast="invert"] .conditions-note i {
  color: #ffffff !important;
  filter: none !important;
  /* Turns Black on screen */
}

/* Update the arrow container and icon to use theme variables (Default Mode) */
.condition-item-card .condition-arrow {
  background-color: #f0f7fa;
  /* Faint blue circle background */
  color: var(--primary-color) !important;
  /* Dark blue arrow */
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  transition: all 0.4s ease;
}

/* Ensure the FontAwesome icon inherits the primary color */
.condition-item-card .condition-arrow i {
  color: inherit;
}

/* Default hover state: Primary color circle, White arrow */
.condition-item-card:hover .condition-arrow {
  background-color: var(--primary-color);
  /* Solid primary color background on hover */
  color: #ffffff !important;
  /* White arrow on hover */
  transform: translateX(8px);
}

/* Update the arrow container and icon color */

/* ============================================================================
   CONDITION CARD ARROW - ACCESSIBILITY MODE OVERRIDES
   ============================================================================ */

/* 1. Dark Contrast Mode: Force Yellow Arrow & Black Background */
html[data-contrast="dark"] .condition-item-card .condition-arrow,
html[data-contrast="dark"] .condition-item-card .condition-arrow i {
  color: #ffff00 !important;
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
}

/* Hover state for Dark Mode */
html[data-contrast="dark"] .condition-item-card:hover .condition-arrow,
html[data-contrast="dark"] .condition-item-card:hover .condition-arrow i {
  background-color: #ffff00 !important;
  color: #000000 !important;
}

/* 2. Light Contrast Mode: Force Black Arrow & White Background */
html[data-contrast="light"] .condition-item-card .condition-arrow,
html[data-contrast="light"] .condition-item-card .condition-arrow i {
  color: #000000 !important;
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
}

/* Hover state for Light Mode */
html[data-contrast="light"] .condition-item-card:hover .condition-arrow,
html[data-contrast="light"] .condition-item-card:hover .condition-arrow i {
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* 3. Invert Colors Mode: Force White (Inverts to Black on Screen) */
html[data-contrast="invert"] .condition-item-card .condition-arrow,
html[data-contrast="invert"] .condition-item-card .condition-arrow i {
  color: #ffffff !important;
  background-color: transparent !important;
  border: 2px solid #ffffff !important;
  filter: none !important;
}

/* Hover state for Invert Mode */
html[data-contrast="invert"] .condition-item-card:hover .condition-arrow,
html[data-contrast="invert"] .condition-item-card:hover .condition-arrow i {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* Fix: Remove the accidental square border from the inner arrow icon in all modes */
html[data-contrast="dark"] .condition-item-card .condition-arrow i,
html[data-contrast="light"] .condition-item-card .condition-arrow i,
html[data-contrast="invert"] .condition-item-card .condition-arrow i {
  border: none !important;
  background-color: transparent !important;
}

/* ============================================================================
   CONDITION CARD ARROWS - INVERT MODE FIX
   ============================================================================ */

/* Problem: The cyan arrow inverts to a dark color, blending with the background.
   Solution: Set the icon color to BLACK (#000000). The global page inversion 
             will then flip this to WHITE, making it highly visible.
*/
html[data-contrast="invert"] .condition-item-card .condition-arrow i,
html[data-contrast="invert"] .condition-item-card .condition-arrow .fa-solid {
  color: #000000 !important;
  /* CSS Black -> VISUAL WHITE on screen */
  filter: none !important;
  /* Ensure no extra filters interfere */
}

/* Optional: Keep them white on hover as well */
html[data-contrast="invert"] .condition-item-card:hover .condition-arrow i {
  color: #000000 !important;
  /* Stays VISUAL WHITE */
}

/* ============================================================================
   PROCEDURE TIMELINE SECTION - ACCESSIBILITY OVERRIDES
   ============================================================================ */

/* --- Text Scaling (Overrides REM units) --- */

/* Level 1 (120%) */
body.acc-text-x1 .flow-eyebrow {
  font-size: 17px !important;
}

body.acc-text-x1 .flow-title {
  font-size: 53px !important;
}

body.acc-text-x1 .flow-description {
  font-size: 22px !important;
}

body.acc-text-x1 .metric-icon {
  font-size: 38px !important;
}

body.acc-text-x1 .metric-value {
  font-size: 23px !important;
}

body.acc-text-x1 .metric-label {
  font-size: 17px !important;
}

body.acc-text-x1 .flow-note {
  font-size: 19px !important;
}

body.acc-text-x1 .flow-list-heading {
  font-size: 24px !important;
}

body.acc-text-x1 .timeline-text {
  font-size: 21px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .flow-eyebrow {
  font-size: 20px !important;
}

body.acc-text-x2 .flow-title {
  font-size: 62px !important;
}

body.acc-text-x2 .flow-description {
  font-size: 26px !important;
}

body.acc-text-x2 .metric-icon {
  font-size: 45px !important;
}

body.acc-text-x2 .metric-value {
  font-size: 27px !important;
}

body.acc-text-x2 .metric-label {
  font-size: 20px !important;
}

body.acc-text-x2 .flow-note {
  font-size: 22px !important;
}

body.acc-text-x2 .flow-list-heading {
  font-size: 28px !important;
}

body.acc-text-x2 .timeline-text {
  font-size: 25px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .flow-eyebrow {
  font-size: 25px !important;
}

body.acc-text-x3 .flow-title {
  font-size: 77px !important;
}

body.acc-text-x3 .flow-description {
  font-size: 32px !important;
}

body.acc-text-x3 .metric-icon {
  font-size: 56px !important;
}

body.acc-text-x3 .metric-value {
  font-size: 34px !important;
}

body.acc-text-x3 .metric-label {
  font-size: 25px !important;
}

body.acc-text-x3 .flow-note {
  font-size: 28px !important;
}

body.acc-text-x3 .flow-list-heading {
  font-size: 35px !important;
}

body.acc-text-x3 .timeline-text {
  font-size: 31px !important;
}

/* --- Dark Contrast Mode --- */
html[data-contrast="dark"] .procedure-flow-section {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .flow-metric {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .metric-icon {
  background-color: transparent !important;
  color: #ffff00 !important;
}

html[data-contrast="dark"] .metric-icon i {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .flow-eyebrow,
html[data-contrast="dark"] .flow-title,
html[data-contrast="dark"] .flow-description,
html[data-contrast="dark"] .metric-value,
html[data-contrast="dark"] .metric-label,
html[data-contrast="dark"] .flow-note,
html[data-contrast="dark"] .flow-list-heading,
html[data-contrast="dark"] .timeline-text {
  color: #ffff00 !important;
}

/* Timeline line and dots */
html[data-contrast="dark"] .flow-timeline::before {
  background-color: #ffff00 !important;
}

html[data-contrast="dark"] .timeline-marker {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
  color: #ffff00 !important;
  box-shadow: 0 0 0 4px #000000 !important;
}

html[data-contrast="dark"] .flow-note {
  border-left-color: #ffff00 !important;
}

/* --- Light Contrast Mode --- */
html[data-contrast="light"] .procedure-flow-section {
  background-color: #ffffff !important;
  border-top: 2px solid #000000;
}

html[data-contrast="light"] .flow-metric {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
  box-shadow: none !important;
}

html[data-contrast="light"] .metric-icon {
  background-color: transparent !important;
  color: #000000 !important;
}

html[data-contrast="light"] .metric-icon i {
  color: #000000 !important;
}

html[data-contrast="light"] .flow-eyebrow,
html[data-contrast="light"] .flow-title,
html[data-contrast="light"] .flow-description,
html[data-contrast="light"] .metric-value,
html[data-contrast="light"] .metric-label,
html[data-contrast="light"] .flow-note,
html[data-contrast="light"] .flow-list-heading,
html[data-contrast="light"] .timeline-text {
  color: #000000 !important;
}

/* Timeline line and dots */
html[data-contrast="light"] .flow-timeline::before {
  background-color: #000000 !important;
}

html[data-contrast="light"] .timeline-marker {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
  color: #000000 !important;
  box-shadow: 0 0 0 4px #ffffff !important;
}

html[data-contrast="light"] .flow-note {
  border-left-color: #000000 !important;
}

/* --- Invert Colors Mode --- */
html[data-contrast="invert"] .metric-icon i {
  color: #000000 !important;
  filter: none !important;
  /* Inverts to White */
}

/* ============================================================================
   PROCEDURE STEPS SECTION - ACCESSIBILITY OVERRIDES
   ============================================================================ */
/* ============================================================================
   PROCEDURE STEP NUMBER - TEXT SCALING FIX
   ============================================================================ */

/* ============================================================================
     PROCEDURE STEP NUMBER - TEXT SCALING FIX
     ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .procedure-step-number {
  font-size: 15px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .procedure-step-number {
  font-size: 17px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .procedure-step-number {
  font-size: 21px !important;
}

/* Level 1 (120%) */
body.acc-text-x1 .procedure-step-number {
  font-size: 15px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .procedure-step-number {
  font-size: 17px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .procedure-step-number {
  font-size: 21px !important;
}

/* --- Text Scaling --- */
body.acc-text-x1 .procedure-subtitle {
  font-size: 17px !important;
}

body.acc-text-x1 .procedure-title {
  font-size: 53px !important;
}

body.acc-text-x1 .procedure-desc {
  font-size: 22px !important;
}

body.acc-text-x1 .procedure-step-title {
  font-size: 27px !important;
}

body.acc-text-x1 .procedure-step-text {
  font-size: 21px !important;
}

body.acc-text-x1 .procedure-footer p {
  font-size: 22px !important;
}

body.acc-text-x2 .procedure-subtitle {
  font-size: 20px !important;
}

body.acc-text-x2 .procedure-title {
  font-size: 62px !important;
}

body.acc-text-x2 .procedure-desc {
  font-size: 26px !important;
}

body.acc-text-x2 .procedure-step-title {
  font-size: 31px !important;
}

body.acc-text-x2 .procedure-step-text {
  font-size: 25px !important;
}

body.acc-text-x2 .procedure-footer p {
  font-size: 26px !important;
}

body.acc-text-x3 .procedure-subtitle {
  font-size: 25px !important;
}

body.acc-text-x3 .procedure-title {
  font-size: 77px !important;
}

body.acc-text-x3 .procedure-desc {
  font-size: 32px !important;
}

body.acc-text-x3 .procedure-step-title {
  font-size: 39px !important;
}

body.acc-text-x3 .procedure-step-text {
  font-size: 31px !important;
}

body.acc-text-x3 .procedure-footer p {
  font-size: 32px !important;
}

/* --- Dark Contrast Mode --- */
html[data-contrast="dark"] .procedure-steps-section {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .procedure-timeline::before {
  background-color: #ffff00 !important;
}

html[data-contrast="dark"] .procedure-step-dot {
  border-color: #ffff00 !important;
  background-color: #000000 !important;
  box-shadow: 0 0 0 6px #000000 !important;
}

html[data-contrast="dark"] .procedure-step-card {
  border: 1px solid #ffff00 !important;
  background-color: #000000 !important;
}

html[data-contrast="dark"] .procedure-step-icon {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
}

html[data-contrast="dark"] .procedure-step-icon i {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .procedure-footer {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
}

html[data-contrast="dark"] .procedure-subtitle,
html[data-contrast="dark"] .procedure-title,
html[data-contrast="dark"] .procedure-desc,
html[data-contrast="dark"] .procedure-step-title,
html[data-contrast="dark"] .procedure-step-text,
html[data-contrast="dark"] .procedure-step-number,
html[data-contrast="dark"] .procedure-footer p {
  color: #ffff00 !important;
}

/* --- Light Contrast Mode --- */
html[data-contrast="light"] .procedure-steps-section {
  background-color: #ffffff !important;
}

html[data-contrast="light"] .procedure-timeline::before {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .procedure-step-item::after {
  background-color: #ffff00 !important;
}

html[data-contrast="light"] .procedure-step-item::after {
  background-color: #000000 !important;
}

html[data-contrast="light"] .procedure-step-dot {
  border-color: #000000 !important;
  background-color: #ffffff !important;
  box-shadow: 0 0 0 6px #ffffff !important;
}

html[data-contrast="light"] .procedure-step-card {
  border: 2px solid #000000 !important;
  background-color: #ffffff !important;
}

html[data-contrast="light"] .procedure-step-icon {
  background-color: #ffffff !important;
  border: 1px solid #000000 !important;
}

html[data-contrast="light"] .procedure-step-icon i {
  color: #000000 !important;
}

html[data-contrast="light"] .procedure-footer {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
  border-left: 6px solid #000000 !important;
}

html[data-contrast="light"] .procedure-subtitle,
html[data-contrast="light"] .procedure-title,
html[data-contrast="light"] .procedure-desc,
html[data-contrast="light"] .procedure-step-title,
html[data-contrast="light"] .procedure-step-text,
html[data-contrast="light"] .procedure-step-number,
html[data-contrast="light"] .procedure-footer p {
  color: #000000 !important;
}

/* --- Invert Colors Mode --- */
html[data-contrast="invert"] .procedure-step-icon i {
  color: #ffffff !important;
  filter: none !important;
  /* Turns Black on screen */
}

/* ============================================================================
   PROCEDURE TIMELINE ICONS - INVERT MODE HOVER FIX
   ============================================================================ */

/* Force the icon to CSS Black on hover, which inverts to VISUAL WHITE on screen */
html[data-contrast="invert"] .procedure-step-item:hover .procedure-step-icon i {
  color: #000000 !important;
}

/* ============================================================================
   PROCEDURE STEP NUMBER - DARK MODE BACKGROUND FIX
   ============================================================================ */

/* Overrides the global wildcard [class*="number"] that forces a yellow background */
html[data-contrast="dark"] .procedure-step-number {
  background-color: transparent !important;
  /* Removes the accidental yellow block */
  color: #ffff00 !important;
  /* Ensures the text is bright yellow */
  border: none !important;
  /* Removes any accidental borders */
}

/* ============================================================================
   PROCEDURE STEP NUMBER - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .procedure-step-number {
  font-size: 15px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .procedure-step-number {
  font-size: 17px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .procedure-step-number {
  font-size: 21px !important;
}
/* ============================================================================
   FLUOROSCOPY VS ULTRASOUND SECTION - INVERT MODE FIXES
   ============================================================================ */

/* 1. Fluoroscopy Side Tick Marks -> Black */
html[data-contrast="invert"] .comparison-section .rounded-start-4 .fa-circle-check {
  color: #000000 !important;
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* 2. Ultrasound Side Tick Marks -> Cyan */
html[data-contrast="invert"] .comparison-section .rounded-end-4 .fa-circle-check {
  color: #22d3ee !important;
  /* Bright Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* 3. "Learn more about Ultrasound Guidance" Arrow -> Cyan */
html[data-contrast="invert"] .comparison-section .btn .fa-arrow-right {
  color: #22d3ee !important;
  /* Bright Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
}
/* ============================================================================
   FINAL CTA BUTTON ARROW - INVERT MODE FIX
   ============================================================================ */

/* Changes the color of the calendar check icon to Cyan in Invert Mode */
html[data-contrast="invert"] .final-cta-section .btn .fa-calendar-check {
  color: #22d3ee !important;
  /* Force Cyan */
  /* Re-apply the double-invert filter to bypass global inversion and render visual Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
}
/* ============================================================================
   PILLAR CARD NUMBER BOX - DARK MODE GLITCH FIX
   ============================================================================ */

/* Removes the accidental yellow background from the 01, 02, 03 boxes */
html[data-contrast="dark"] .pillar-card .number-box {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Ensures the numbers themselves are visible and bright yellow */
html[data-contrast="dark"] .pillar-card .number-box span {
  color: #ffff00 !important;
  background-color: transparent !important;
  opacity: 1 !important;
}
/* ============================================================================
   PROCEDURE CARD HOVER TEXT - DARK MODE FIX
   ============================================================================ */

/* Forces the text and the right-arrow to turn black when the card is hovered */
html[data-contrast="dark"] a.procedure-card:hover h5,
html[data-contrast="dark"] a.procedure-card:hover .card-arrow i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  /* Overrides aggressive global text fills */
}

/* Optional: Ensures the icon box stays distinct on hover */
html[data-contrast="dark"] a.procedure-card:hover .icon-box {
  background-color: #000000 !important;
  border-color: #000000 !important;
}

html[data-contrast="dark"] a.procedure-card:hover .icon-box i {
  color: #ffff00 !important;
  -webkit-text-fill-color: #ffff00 !important;
}
/* ============================================================================
   PROCEDURE CARD HOVER ICON - LIGHT MODE FIX
   ============================================================================ */

/* Forces the icon inside the circle to stay black on hover */
html[data-contrast="light"] a.procedure-card:hover .icon-box i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Ensure the circle background stays white on hover for contrast */
html[data-contrast="light"] a.procedure-card:hover .icon-box {
  background-color: #ffffff !important;
  border-color: #000000 !important;
}
/* ============================================================================
   QUOTE ICON - LIGHT MODE FIX
   ============================================================================ */

/* Forces the quote icon to be solid black in Light Contrast Mode */
html[data-contrast="light"] .quote-box .fa-quote-left {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  opacity: 1 !important;
  /* Removes the 50% opacity so it stands out */
}
/* ============================================================================
   FINAL CTA BUTTON - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .final-cta-section .btn {
  font-size: 24px !important;
}

body.acc-text-x1 .final-cta-section .btn i {
  font-size: 22px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .final-cta-section .btn {
  font-size: 28px !important;
}

body.acc-text-x2 .final-cta-section .btn i {
  font-size: 26px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .final-cta-section .btn {
  font-size: 35px !important;
}

body.acc-text-x3 .final-cta-section .btn i {
  font-size: 32px !important;
}
/* ============================================================================
   APPROACH SECTION (PATHWAY) - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .approach-section .sub-title {
  font-size: 1.1rem !important;
}

body.acc-text-x1 .approach-section .section-title.display-6 {
  font-size: 2.5rem !important;
}

body.acc-text-x1 .approach-section .lead {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .approach-section .pathway-card h5 {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .approach-section .fs-5 {
  font-size: 1.5rem !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .approach-section .sub-title {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .approach-section .section-title.display-6 {
  font-size: 3rem !important;
}

body.acc-text-x2 .approach-section .lead {
  font-size: 1.8rem !important;
}

body.acc-text-x2 .approach-section .pathway-card h5 {
  font-size: 1.8rem !important;
}

body.acc-text-x2 .approach-section .fs-5 {
  font-size: 1.8rem !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .approach-section .sub-title {
  font-size: 1.6rem !important;
}

body.acc-text-x3 .approach-section .section-title.display-6 {
  font-size: 3.8rem !important;
}

body.acc-text-x3 .approach-section .lead {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .approach-section .pathway-card h5 {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .approach-section .fs-5 {
  font-size: 2.2rem !important;
}
/* ============================================================================
   PHYSICIAN EXPERTISE SECTION - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .expert-subtitle {
  font-size: 1.3rem !important;
}

body.acc-text-x1 .expert-title {
  font-size: 3rem !important;
}

body.acc-text-x1 .expert-text {
  font-size: 1.4rem !important;
}

body.acc-text-x1 .expert-cta-wrap .btn,
body.acc-text-x1 .expert-cta-wrap .btn span,
body.acc-text-x1 .expert-cta-wrap .btn i {
  font-size: 1.3rem !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .expert-subtitle {
  font-size: 1.5rem !important;
}

body.acc-text-x2 .expert-title {
  font-size: 3.5rem !important;
}

body.acc-text-x2 .expert-text {
  font-size: 1.6rem !important;
}

body.acc-text-x2 .expert-cta-wrap .btn,
body.acc-text-x2 .expert-cta-wrap .btn span,
body.acc-text-x2 .expert-cta-wrap .btn i {
  font-size: 1.5rem !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .expert-subtitle {
  font-size: 1.95rem !important;
}

body.acc-text-x3 .expert-title {
  font-size: 4.4rem !important;
}

body.acc-text-x3 .expert-text {
  font-size: 2rem !important;
}

body.acc-text-x3 .expert-cta-wrap .btn,
body.acc-text-x3 .expert-cta-wrap .btn span,
body.acc-text-x3 .expert-cta-wrap .btn i {
  font-size: 1.8rem !important;
}
/* ============================================================================
   TREATMENT PLANNING SECTION - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .treatment-planning-section .sub-title {
  font-size: 1.1rem !important;
}

body.acc-text-x1 .treatment-planning-section .display-5 {
  font-size: 3.6rem !important;
}

body.acc-text-x1 .treatment-planning-section .lead {
  font-size: 1.45rem !important;
}

body.acc-text-x1 .treatment-planning-section .quote-box p {
  font-size: 1.2rem !important;
}

body.acc-text-x1 .treatment-planning-section h5 {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .treatment-planning-section .display-4 {
  font-size: 4.2rem !important;
}

body.acc-text-x1 .treatment-planning-section .pillar-card p {
  font-size: 1.2rem !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .treatment-planning-section .sub-title {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .treatment-planning-section .display-5 {
  font-size: 4.2rem !important;
}

body.acc-text-x2 .treatment-planning-section .lead {
  font-size: 1.7rem !important;
}

body.acc-text-x2 .treatment-planning-section .quote-box p {
  font-size: 1.4rem !important;
}

body.acc-text-x2 .treatment-planning-section h5 {
  font-size: 1.75rem !important;
}

body.acc-text-x2 .treatment-planning-section .display-4 {
  font-size: 4.9rem !important;
}

body.acc-text-x2 .treatment-planning-section .pillar-card p {
  font-size: 1.4rem !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .treatment-planning-section .sub-title {
  font-size: 1.6rem !important;
}

body.acc-text-x3 .treatment-planning-section .display-5 {
  font-size: 5.2rem !important;
}

body.acc-text-x3 .treatment-planning-section .lead {
  font-size: 2.1rem !important;
}

body.acc-text-x3 .treatment-planning-section .quote-box p {
  font-size: 1.75rem !important;
}

body.acc-text-x3 .treatment-planning-section h5 {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .treatment-planning-section .display-4 {
  font-size: 6.1rem !important;
}

body.acc-text-x3 .treatment-planning-section .pillar-card p {
  font-size: 1.75rem !important;
}
/* ============================================================================
   COMPARISON SECTION (Fluoroscopy vs Ultrasound) - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .comparison-section .sub-title {
  font-size: 1.1rem !important;
}

body.acc-text-x1 .comparison-section .display-6 {
  font-size: 2.5rem !important;
}

body.acc-text-x1 .comparison-section .lead {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .comparison-section .comparison-card h3 {
  font-size: 2.1rem !important;
}

body.acc-text-x1 .comparison-section .comparison-card p {
  font-size: 1.1rem !important;
}

body.acc-text-x1 .comparison-section .custom-list li span {
  font-size: 1.25rem !important;
}

body.acc-text-x1 .comparison-section .custom-list li i {
  font-size: 1.25rem !important;
}

body.acc-text-x1 .comparison-section .fs-5 {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .comparison-section .btn {
  font-size: 1.3rem !important;
}

body.acc-text-x1 .comparison-section .btn i {
  font-size: 1.2rem !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .comparison-section .sub-title {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .comparison-section .display-6 {
  font-size: 3rem !important;
}

body.acc-text-x2 .comparison-section .lead {
  font-size: 1.8rem !important;
}

body.acc-text-x2 .comparison-section .comparison-card h3 {
  font-size: 2.4rem !important;
}

body.acc-text-x2 .comparison-section .comparison-card p {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .comparison-section .custom-list li span {
  font-size: 1.5rem !important;
}

body.acc-text-x2 .comparison-section .custom-list li i {
  font-size: 1.5rem !important;
}

body.acc-text-x2 .comparison-section .fs-5 {
  font-size: 1.8rem !important;
}

body.acc-text-x2 .comparison-section .btn {
  font-size: 1.5rem !important;
}

body.acc-text-x2 .comparison-section .btn i {
  font-size: 1.4rem !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .comparison-section .sub-title {
  font-size: 1.6rem !important;
}

body.acc-text-x3 .comparison-section .display-6 {
  font-size: 3.8rem !important;
}

body.acc-text-x3 .comparison-section .lead {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .comparison-section .comparison-card h3 {
  font-size: 3rem !important;
}

body.acc-text-x3 .comparison-section .comparison-card p {
  font-size: 1.6rem !important;
}

body.acc-text-x3 .comparison-section .custom-list li span {
  font-size: 1.9rem !important;
}

body.acc-text-x3 .comparison-section .custom-list li i {
  font-size: 1.9rem !important;
}

body.acc-text-x3 .comparison-section .fs-5 {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .comparison-section .btn {
  font-size: 1.9rem !important;
}

body.acc-text-x3 .comparison-section .btn i {
  font-size: 1.8rem !important;
}
/* ============================================================================
   PROCEDURES COMMONLY PERFORMED SECTION - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .procedures-section .sub-title {
  font-size: 1.1rem !important;
}

body.acc-text-x1 .procedures-section .display-6 {
  font-size: 3rem !important;
}

body.acc-text-x1 .procedures-section .lead {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .procedures-section .procedure-card h5 {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .procedures-section .procedure-card .icon-box i {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .procedures-section .procedure-card .card-arrow i {
  font-size: 1.2rem !important;
}

body.acc-text-x1 .procedures-section .fs-5 {
  font-size: 1.5rem !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .procedures-section .sub-title {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .procedures-section .display-6 {
  font-size: 3.5rem !important;
}

body.acc-text-x2 .procedures-section .lead {
  font-size: 1.8rem !important;
}

body.acc-text-x2 .procedures-section .procedure-card h5 {
  font-size: 1.8rem !important;
}

body.acc-text-x2 .procedures-section .procedure-card .icon-box i {
  font-size: 1.8rem !important;
}

body.acc-text-x2 .procedures-section .procedure-card .card-arrow i {
  font-size: 1.5rem !important;
}

body.acc-text-x2 .procedures-section .fs-5 {
  font-size: 1.8rem !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .procedures-section .sub-title {
  font-size: 1.6rem !important;
}

body.acc-text-x3 .procedures-section .display-6 {
  font-size: 4.4rem !important;
}

body.acc-text-x3 .procedures-section .lead {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .procedures-section .procedure-card h5 {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .procedures-section .procedure-card .icon-box i {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .procedures-section .procedure-card .card-arrow i {
  font-size: 1.8rem !important;
}

body.acc-text-x3 .procedures-section .fs-5 {
  font-size: 2.2rem !important;
}
/* ============================================================================
   CLINICAL INDICATIONS (APPLICATIONS) SECTION - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .fluoroscopy-applications-section .sub-title {
  font-size: 1.1rem !important;
}

body.acc-text-x1 .fluoroscopy-applications-section .display-5 {
  font-size: 3.6rem !important;
}

body.acc-text-x1 .fluoroscopy-applications-section .lead {
  font-size: 1.45rem !important;
}

body.acc-text-x1 .fluoroscopy-applications-section .fst-italic {
  font-size: 1.2rem !important;
}

body.acc-text-x1 .fluoroscopy-applications-section .step-content h4 {
  font-size: 1.8rem !important;
}

body.acc-text-x1 .fluoroscopy-applications-section .step-content p {
  font-size: 1.2rem !important;
}

body.acc-text-x1 .fluoroscopy-applications-section .fa-2x {
  font-size: 2.4em !important;
}

/* Scales the icons */

/* Level 2 (140%) */
body.acc-text-x2 .fluoroscopy-applications-section .sub-title {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .fluoroscopy-applications-section .display-5 {
  font-size: 4.2rem !important;
}

body.acc-text-x2 .fluoroscopy-applications-section .lead {
  font-size: 1.7rem !important;
}

body.acc-text-x2 .fluoroscopy-applications-section .fst-italic {
  font-size: 1.4rem !important;
}

body.acc-text-x2 .fluoroscopy-applications-section .step-content h4 {
  font-size: 2.1rem !important;
}

body.acc-text-x2 .fluoroscopy-applications-section .step-content p {
  font-size: 1.4rem !important;
}

body.acc-text-x2 .fluoroscopy-applications-section .fa-2x {
  font-size: 2.8em !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .fluoroscopy-applications-section .sub-title {
  font-size: 1.6rem !important;
}

body.acc-text-x3 .fluoroscopy-applications-section .display-5 {
  font-size: 5.2rem !important;
}

body.acc-text-x3 .fluoroscopy-applications-section .lead {
  font-size: 2.1rem !important;
}

body.acc-text-x3 .fluoroscopy-applications-section .fst-italic {
  font-size: 1.75rem !important;
}

body.acc-text-x3 .fluoroscopy-applications-section .step-content h4 {
  font-size: 2.6rem !important;
}

body.acc-text-x3 .fluoroscopy-applications-section .step-content p {
  font-size: 1.75rem !important;
}

body.acc-text-x3 .fluoroscopy-applications-section .fa-2x {
  font-size: 3.5em !important;
}
/* ============================================================================
   WHAT IS FLUOROSCOPIC GUIDANCE SECTION - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .fluoroscopy-guidance-section .sub-title {
  font-size: 1.1rem !important;
}

body.acc-text-x1 .fluoroscopy-guidance-section .display-5 {
  font-size: 3.6rem !important;
}

body.acc-text-x1 .fluoroscopy-guidance-section .lead {
  font-size: 1.4rem !important;
}

body.acc-text-x1 .fluoroscopy-guidance-section h5 {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .fluoroscopy-guidance-section .small {
  font-size: 1.1rem !important;
}

body.acc-text-x1 .fluoroscopy-guidance-section .fs-5 {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .fluoroscopy-guidance-section .fa-2x {
  font-size: 2.4em !important;
}

body.acc-text-x1 .fluoroscopy-guidance-section .fa-xl {
  font-size: 1.8em !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .fluoroscopy-guidance-section .sub-title {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .fluoroscopy-guidance-section .display-5 {
  font-size: 4.2rem !important;
}

body.acc-text-x2 .fluoroscopy-guidance-section .lead {
  font-size: 1.6rem !important;
}

body.acc-text-x2 .fluoroscopy-guidance-section h5 {
  font-size: 1.75rem !important;
}

body.acc-text-x2 .fluoroscopy-guidance-section .small {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .fluoroscopy-guidance-section .fs-5 {
  font-size: 1.75rem !important;
}

body.acc-text-x2 .fluoroscopy-guidance-section .fa-2x {
  font-size: 2.8em !important;
}

body.acc-text-x2 .fluoroscopy-guidance-section .fa-xl {
  font-size: 2.1em !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .fluoroscopy-guidance-section .sub-title {
  font-size: 1.6rem !important;
}

body.acc-text-x3 .fluoroscopy-guidance-section .display-5 {
  font-size: 5.2rem !important;
}

body.acc-text-x3 .fluoroscopy-guidance-section .lead {
  font-size: 2rem !important;
}

body.acc-text-x3 .fluoroscopy-guidance-section h5 {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .fluoroscopy-guidance-section .small {
  font-size: 1.6rem !important;
}

body.acc-text-x3 .fluoroscopy-guidance-section .fs-5 {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .fluoroscopy-guidance-section .fa-2x {
  font-size: 3.5em !important;
}

body.acc-text-x3 .fluoroscopy-guidance-section .fa-xl {
  font-size: 2.6em !important;
}
/* ============================================================================
   MEDIAL BRANCH BLOCK - NEW SECTIONS ICON FIXES
   ============================================================================ */

/* 1. Results Section - Force Cyan Icons in Invert Mode */
html[data-contrast="invert"] .results-icon i {
  color: #22d3ee !important;
  /* Bright Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
  /* Prevents unwanted color flip */
}

/* 2. Related Treatments Section - Force Cyan Icons & Hover States */
html[data-contrast="invert"] .related-card-icon i,
html[data-contrast="invert"] .related-card-arrow i {
  color: #22d3ee !important;
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* Keep icon black on hover */
html[data-contrast="invert"] .related-item-card:hover .related-card-icon i,
html[data-contrast="invert"] .related-item-card:hover .related-card-arrow i {
  color: #000000 !important;
}

/* 3. Spine Care Options Section - Icon and Button Hover Polish */
html[data-contrast="invert"] .options-card-icon i,
html[data-contrast="invert"] .options-card-link i {
  color: #22d3ee !important;
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* Keep icon black on hover */
html[data-contrast="invert"] .options-card:hover .options-card-icon i,
html[data-contrast="invert"] .options-card:hover .options-card-link i {
  color: #000000 !important;
}

/* 4. Fix Options Card 'Learn More' Button Hover in Dark/Light Mode */
/* Prevents the default Cyan background from clashing with Dark/Light modes */
html[data-contrast="dark"] .options-card:hover .options-card-link {
  background-color: transparent !important;
  color: #ffff00 !important;
}

html[data-contrast="light"] .options-card:hover .options-card-link {
  background-color: #000000 !important;
  color: #ffffff !important;
}

html[data-contrast="light"] .options-card:hover .options-card-link i {
  color: #ffffff !important;
}
/* ============================================================================
   ROLE IN PAIN MANAGEMENT SECTION - TEXT SCALING FIX
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .role-section .role-subtitle {
  font-size: 1.3rem !important;
}

body.acc-text-x1 .role-section .role-title {
  font-size: 3rem !important;
}

body.acc-text-x1 .role-section .role-desc {
  font-size: 1.4rem !important;
}

body.acc-text-x1 .role-section .role-card-title {
  font-size: 1.9rem !important;
}

body.acc-text-x1 .role-section .role-card-text {
  font-size: 1.3rem !important;
}

body.acc-text-x1 .role-section .role-footer-note p {
  font-size: 1.3rem !important;
}

body.acc-text-x1 .role-section .role-icon i {
  font-size: 2.1rem !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .role-section .role-subtitle {
  font-size: 1.5rem !important;
}

body.acc-text-x2 .role-section .role-title {
  font-size: 3.5rem !important;
}

body.acc-text-x2 .role-section .role-desc {
  font-size: 1.6rem !important;
}

body.acc-text-x2 .role-section .role-card-title {
  font-size: 2.2rem !important;
}

body.acc-text-x2 .role-section .role-card-text {
  font-size: 1.5rem !important;
}

body.acc-text-x2 .role-section .role-footer-note p {
  font-size: 1.5rem !important;
}

body.acc-text-x2 .role-section .role-icon i {
  font-size: 2.5rem !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .role-section .role-subtitle {
  font-size: 1.9rem !important;
}

body.acc-text-x3 .role-section .role-title {
  font-size: 4.4rem !important;
}

body.acc-text-x3 .role-section .role-desc {
  font-size: 2rem !important;
}

body.acc-text-x3 .role-section .role-card-title {
  font-size: 2.8rem !important;
}

body.acc-text-x3 .role-section .role-card-text {
  font-size: 1.9rem !important;
}

body.acc-text-x3 .role-section .role-footer-note p {
  font-size: 1.9rem !important;
}

body.acc-text-x3 .role-section .role-icon i {
  font-size: 3.1rem !important;
}
/* ============================================================================
   FINAL CTA BUTTON HOVER TEXT - LIGHT MODE FIX
   ============================================================================ */

/* Forces the "Book an Appointment" text to turn Black when hovered in Light Mode */
html[data-contrast="light"] .final-cta-section .btn-default:hover,
html[data-contrast="light"] .final-cta-section .btn-default:hover span,
html[data-contrast="light"] .final-cta-section .btn-default:hover .cta-btn-text {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  /* Overrides any aggressive webkit fills */
}
/* ============================================================================
   TYPES OF NERVE BLOCKS SECTION - WIDGET OVERRIDES
   ============================================================================ */

/* Strict Dark Mode (Forces High-Contrast Yellow instead of Theme Cyan) */
html[data-contrast="dark"] .types-subtitle,
html[data-contrast="dark"] .types-icon {
  color: #ffff00 !important;
}

html[data-contrast="dark"] .types-card:hover {
  border-color: #ffff00 !important;
}

html[data-contrast="dark"] .types-icon {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
}

html[data-contrast="dark"] .types-card:hover .types-icon {
  background-color: #ffff00 !important;
  color: #000000 !important;
}

/* Strict Light Mode (Forces High-Contrast Black/White) */
html[data-contrast="light"] .types-subtitle {
  color: #000000 !important;
}

html[data-contrast="light"] .types-icon {
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] .types-card:hover .types-icon {
  color: #ffffff !important;
}

/* Text Alignment Logic for the Types Cards */
body.acc-align-left .types-intro,
body.acc-align-left .types-card {
  text-align: left !important;
  align-items: flex-start !important;
}

body.acc-align-center .types-intro,
body.acc-align-center .types-card {
  text-align: center !important;
  align-items: center !important;
}

body.acc-align-right .types-intro,
body.acc-align-right .types-card {
  text-align: right !important;
  align-items: flex-end !important;
}
/* Fix for icon color on hover in Dark Contrast Mode for types-section cards */
html[data-contrast="dark"] .types-section .types-card:hover .types-icon i {
  color: #000000 !important;
}
/* ============================================================================
   TYPES OF NERVE BLOCKS - DARK MODE HOVER & GLITCH FIX
   ============================================================================ */

/* 1. Remove the solid yellow background glitch from the icon circles */
html[data-contrast="dark"] .types-section .types-icon {
  background-color: transparent !important;
  border: 2px solid #ffff00 !important;
}

/* 2. Ensure the icon inside is always yellow by default */
html[data-contrast="dark"] .types-section .types-icon i {
  color: #ffff00 !important;
  -webkit-text-fill-color: #ffff00 !important;
}

/* 3. FIX: When hovering the card, force the icon to turn BLACK against the yellow background */
html[data-contrast="dark"] .types-section .types-card:hover .types-icon i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 4. Ensure the circle itself doesn't disappear on hover */
html[data-contrast="dark"] .types-section .types-card:hover .types-icon {
  background-color: #ffff00 !important;
  border-color: #000000 !important;
}
/* ============================================================================
   RADIOFREQUENCY ABLATION - ACCESSIBILITY WIDGET PATCH
   ============================================================================ */

/* 1. INVERT MODE: Force Cyan/Black Icons for RFA Sections */
html[data-contrast="invert"] .results-icon i,
html[data-contrast="invert"] .related-card-icon i,
html[data-contrast="invert"] .related-card-arrow i,
html[data-contrast="invert"] .options-card-icon i,
html[data-contrast="invert"] .options-card-link i {
  color: #22d3ee !important;
  /* Visual Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* 2. INVERT MODE: Keep icons black on card hover */
html[data-contrast="invert"] .related-item-card:hover .related-card-icon i,
html[data-contrast="invert"] .options-card:hover .options-card-icon i {
  color: #000000 !important;
  /* Visual White */
}

/* 3. DARK MODE: Fix "Yellow-on-Yellow" Hover Glitch for Related Cards */
html[data-contrast="dark"] .related-item-card:hover {
  background-color: #ffff00 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-name,
html[data-contrast="dark"] .related-item-card:hover .related-card-arrow i {
  color: #000000 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-icon {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-icon i {
  color: #ffff00 !important;
}

/* 4. LIGHT MODE: Fix "White-on-White" Hover Glitch for Icons */
html[data-contrast="light"] .related-item-card:hover .related-card-icon {
  background-color: #000000 !important;
}

html[data-contrast="light"] .related-item-card:hover .related-card-icon i {
  color: #ffffff !important;
}

/* 5. TEXT SCALING: Ensure RFA Role and Result titles scale */
body.acc-text-x1 .results-card-text {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .results-card-text {
  font-size: 1.5rem !important;
}

body.acc-text-x3 .results-card-text {
  font-size: 1.8rem !important;
}
/* ============================================================================
   SI JOINT INJECTION - ACCESSIBILITY WIDGET FIXES
   ============================================================================ */

/* 1. INVERT MODE: Force High-Contrast Icons (Visual Cyan) */
html[data-contrast="invert"] .results-icon i,
html[data-contrast="invert"] .related-card-icon i,
html[data-contrast="invert"] .related-card-arrow i,
html[data-contrast="invert"] .options-card-icon i,
html[data-contrast="invert"] .options-card-link i {
  color: #22d3ee !important;
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* 2. INVERT MODE: Hover Logic (Force Black against White/Cyan backgrounds) */
html[data-contrast="invert"] .related-item-card:hover .related-card-icon i,
html[data-contrast="invert"] .options-card:hover .options-card-icon i {
  color: #000000 !important;
  /* Visual White after double invert */
}

/* 3. DARK MODE: Fix "Yellow-on-Yellow" Hover Glitch (Matching image_25119d.png fix) */
html[data-contrast="dark"] .related-item-card:hover {
  background-color: #ffff00 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-name,
html[data-contrast="dark"] .related-item-card:hover .related-card-arrow i {
  color: #000000 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-icon {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-icon i {
  color: #ffff00 !important;
}

/* 4. LIGHT MODE: Final CTA Button Text (Fix for image_257ef4.png) */
html[data-contrast="light"] .final-cta-section a.btn-default:hover,
html[data-contrast="light"] .final-cta-section a.btn-default:hover span,
html[data-contrast="light"] .final-cta-section a.btn-default:hover .cta-btn-text {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 5. TEXT SCALING: Ensure all specific card labels grow */
body.acc-text-x1 .results-card-text,
body.acc-text-x1 .related-card-name {
  font-size: 1.3rem !important;
}

body.acc-text-x2 .results-card-text,
body.acc-text-x2 .related-card-name {
  font-size: 1.5rem !important;
}

body.acc-text-x3 .results-card-text,
body.acc-text-x3 .related-card-name {
  font-size: 1.8rem !important;
}
/* ============================================================================
   TREATMENTS PAGE - GLOBAL WIDGET OVERRIDES
   ============================================================================ */

/* 1. TEXT SCALING: Overriding REM and PX locks for new sections */

/* Level 1 (120%) */
body.acc-text-x1 .intro-title,
body.acc-text-x1 .decision-title,
body.acc-text-x1 .stack-title,
body.acc-text-x1 .anchor-title {
  font-size: 3.2rem !important;
}

body.acc-text-x1 .content-lead,
body.acc-text-x1 .decision-lead,
body.acc-text-x1 .anchor-subtitle {
  font-size: 1.4rem !important;
}

body.acc-text-x1 .highlights-list li,
body.acc-text-x1 .mosaic-text,
body.acc-text-x1 .item-content p {
  font-size: 1.2rem !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .intro-title,
body.acc-text-x2 .decision-title,
body.acc-text-x2 .stack-title,
body.acc-text-x2 .anchor-title {
  font-size: 3.8rem !important;
}

body.acc-text-x2 .content-lead,
body.acc-text-x2 .decision-lead,
body.acc-text-x2 .anchor-subtitle {
  font-size: 1.7rem !important;
}

body.acc-text-x2 .highlights-list li,
body.acc-text-x2 .mosaic-text,
body.acc-text-x2 .item-content p {
  font-size: 1.45rem !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .intro-title,
body.acc-text-x3 .decision-title,
body.acc-text-x3 .stack-title,
body.acc-text-x3 .anchor-title {
  font-size: 4.8rem !important;
}

body.acc-text-x3 .content-lead,
body.acc-text-x3 .decision-lead,
body.acc-text-x3 .anchor-subtitle {
  font-size: 2.1rem !important;
}

body.acc-text-x3 .highlights-list li,
body.acc-text-x3 .mosaic-text,
body.acc-text-x3 .item-content p {
  font-size: 1.8rem !important;
}

/* 2. INVERT MODE: Fixing Icons and Badges */
html[data-contrast="invert"] .highlight-icon,
html[data-contrast="invert"] .diagnosis-icon,
html[data-contrast="invert"] .mosaic-icon,
html[data-contrast="invert"] .item-icon {
  filter: invert(100%) hue-rotate(180deg) !important;
  color: #22d3ee !important;
  /* Force Cyan */
}

/* 3. DARK MODE: Fix "Yellow-on-Yellow" Hover on Procedure Cards */
html[data-contrast="dark"] .procedure-card:hover {
  background-color: #ffff00 !important;
}

html[data-contrast="dark"] .procedure-card:hover .procedure-title,
html[data-contrast="dark"] .procedure-card:hover .procedure-desc,
html[data-contrast="dark"] .procedure-card:hover .procedure-link {
  color: #000000 !important;
}

/* 4. ALIGNMENT LOGIC: Handling the Mosaic and Clinical Lists */
body.acc-align-center .highlights-list,
body.acc-align-center .clinical-item {
  justify-content: center !important;
  text-align: center !important;
}

body.acc-align-center .item-meta {
  align-items: center !important;
}

body.acc-align-right .clinical-item {
  grid-template-columns: 1fr 50px !important;
  text-align: right !important;
}

body.acc-align-right .item-meta {
  order: 2 !important;
}
/* ============================================================================
   INTRO SECTION HIGHLIGHT ICONS - INVERT MODE VISIBILITY FIX
   ============================================================================ */

/* 1. Force the icon to CSS White and disable the global inversion filter */
html[data-contrast="invert"] .highlight-icon i {
  color: #ffffff !important;
  filter: none !important;
  /* Prevents the icon from being flipped to black by global rules */
}

/* 2. FIX: When hovering the text/li, ensure the icon STAYS white */
html[data-contrast="invert"] .highlights-list li:hover .highlight-icon i {
  color: #ffffff !important;
  filter: none !important;
}

/* 3. Optional: If the circle background is also turning too dark on hover */
html[data-contrast="invert"] .highlights-list li:hover .highlight-icon {
  background-color: #000000 !important;
  /* CSS Black -> VISUAL WHITE background */
  border-color: #ffffff !important;
  /* CSS White -> VISUAL BLACK border */
}
/* ============================================================================
   INTRO SECTION ICONS - INVERT MODE STYLE (Black BG / White Icon)
   ============================================================================ */

/* 1. Set the circular wrapper to CSS White (which inverts to Visual Black) */
html[data-contrast="invert"] .highlight-icon {
  background-color: #ffffff !important;
  border-color: #000000 !important;
  /* Visual White border */
}

/* 2. Set the FontAwesome icon to CSS Black (which inverts to Visual White) */
html[data-contrast="invert"] .highlight-icon i {
  color: #000000 !important;
  filter: none !important;
  /* Critical: Stops the widget from trying to flip it back */
}

/* 3. Maintain visibility when the parent list item (li) is hovered */
html[data-contrast="invert"] .highlights-list li:hover .highlight-icon {
  background-color: #ffffff !important;
}

html[data-contrast="invert"] .highlights-list li:hover .highlight-icon i {
  color: #000000 !important;
  filter: none !important;
}
/* ============================================================================
   TREATMENT DECISION ICONS - INVERT MODE FIX
   ============================================================================ */

/* 1. Force the icons and their circular wrappers to Visual Black */
html[data-contrast="invert"] .diagnosis-icon,
html[data-contrast="invert"] .diagnosis-icon i {
  /* CSS White (#ffffff) inverts to VISUAL BLACK on the screen */
  color: #ffffff !important;
  border-color: #ffffff !important;
  background-color: transparent !important;
  filter: none !important;
  /* Critical: Stops the widget from trying to "fix" it back */
}

/* 2. Fix the hover state visibility */
html[data-contrast="invert"] .diagnosis-card:hover .diagnosis-icon,
html[data-contrast="invert"] .diagnosis-card:hover .diagnosis-icon i {
  background-color: #000000 !important;
  /* CSS Black inverts to VISUAL WHITE */
  color: #ffffff !important;
  /* VISUAL BLACK icon */
}

/* 3. Ensure the large step numbers also appear strictly as Visual Black */
html[data-contrast="invert"] .decision-section .step-number {
  color: #ffffff !important;
  /* Visual Black */
  filter: none !important;
  opacity: 0.8 !important;
}
/* ============================================================================
   TREATMENTS PAGE: PROCEDURE ARROWS - INVERT MODE FIX
   ============================================================================ */

/* 1. Force the arrow to be Bright Cyan and protect it from the global invert filter */
html[data-contrast="invert"] .procedure-link i {
  color: #22d3ee !important;
  /* Bright Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
  /* Double-invert to restore exact color */
}

/* 2. Ensure it stays Cyan even when the user hovers over the link or the card */
html[data-contrast="invert"] .procedure-card:hover .procedure-link i,
html[data-contrast="invert"] .procedure-link:hover i {
  color: #22d3ee !important;
  filter: invert(100%) hue-rotate(180deg) !important;
}
/* ============================================================================
   MOSAIC ICONS - INVERT MODE FIX (Visual Black)
   ============================================================================ */

/* CSS White (#ffffff) is inverted by the browser to become VISUAL BLACK */
html[data-contrast="invert"] .mosaic-icon {
  color: #ffffff !important;
  filter: none !important;
}

/* Ensure it stays Visual Black even when the card is hovered */
html[data-contrast="invert"] .mosaic-card:hover .mosaic-icon {
  color: #ffffff !important;
  filter: none !important;
}
/* ============================================================================
   PROCEDURE CARDS - DISABLE HOVER COLOR CHANGES (Lock States)
   ============================================================================ */

/* 1. DARK MODE: Lock background to Black, text to Yellow */
html[data-contrast="dark"] .procedure-card,
html[data-contrast="dark"] .procedure-card:hover {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
}

html[data-contrast="dark"] .procedure-card .procedure-title,
html[data-contrast="dark"] .procedure-card .procedure-desc,
html[data-contrast="dark"] .procedure-card .procedure-link,
html[data-contrast="dark"] .procedure-card .procedure-link i,
html[data-contrast="dark"] .procedure-card:hover .procedure-title,
html[data-contrast="dark"] .procedure-card:hover .procedure-desc,
html[data-contrast="dark"] .procedure-card:hover .procedure-link,
html[data-contrast="dark"] .procedure-card:hover .procedure-link i {
  color: #ffff00 !important;
  background-color: transparent !important;
  /* Prevents the black bar */
  -webkit-text-fill-color: #ffff00 !important;
}

/* Nullify the global link hover background for these specific links */
html[data-contrast="dark"] .procedure-link:hover,
html[data-contrast="dark"] .procedure-link:focus {
  background-color: transparent !important;
  outline: none !important;
  text-decoration: underline !important;
}

/* 2. LIGHT MODE: Lock background to White, text to Black */
html[data-contrast="light"] .procedure-card,
html[data-contrast="light"] .procedure-card:hover {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] .procedure-card .procedure-title,
html[data-contrast="light"] .procedure-card .procedure-desc,
html[data-contrast="light"] .procedure-card .procedure-link,
html[data-contrast="light"] .procedure-card .procedure-link i,
html[data-contrast="light"] .procedure-card:hover .procedure-title,
html[data-contrast="light"] .procedure-card:hover .procedure-desc,
html[data-contrast="light"] .procedure-card:hover .procedure-link,
html[data-contrast="light"] .procedure-card:hover .procedure-link i {
  color: #000000 !important;
  background-color: transparent !important;
  /* Prevents the white bar */
  -webkit-text-fill-color: #000000 !important;
}

html[data-contrast="light"] .procedure-link:hover,
html[data-contrast="light"] .procedure-link:focus {
  background-color: transparent !important;
  outline: none !important;
  text-decoration: underline !important;
}

/* 3. NORMAL MODE: Stop the card from turning primary blue/cyan if previously set */
.procedure-card:hover {
  background-color: var(--white-color) !important;
  border-color: var(--primary-color) !important;
}

.procedure-card:hover .procedure-title,
.procedure-card:hover .procedure-desc {
  color: inherit !important;
}
/* ============================================================================
   WHY CHOOSE SECTION - TEXT ALIGNMENT FIXES
   ============================================================================ */

/* 1. RIGHT ALIGNMENT (Fixes the screenshot glitch) */
body.acc-align-right .why-choose-section .credibility-anchor,
body.acc-align-right .why-choose-section .anchor-title,
body.acc-align-right .why-choose-section .anchor-subtitle {
  text-align: right !important;
}

/* Move the accent border to the right side */
body.acc-align-right .why-choose-section .anchor-subtitle {
  border-left: none !important;
  padding-left: 0 !important;
  border-right: 4px solid var(--accent-color) !important;
  padding-right: 25px !important;
}

/* Flip the list items cleanly using Flexbox */
body.acc-align-right .why-choose-section .clinical-item {
  display: flex !important;
  flex-direction: row-reverse !important;
  text-align: right !important;
  align-items: flex-start !important;
}

body.acc-align-right .why-choose-section .item-content {
  flex: 1 !important;
}

body.acc-align-right .why-choose-section .item-meta {
  width: 50px !important;
  flex-shrink: 0 !important;
}

/* 2. CENTER ALIGNMENT */
body.acc-align-center .why-choose-section .credibility-anchor,
body.acc-align-center .why-choose-section .anchor-title,
body.acc-align-center .why-choose-section .anchor-subtitle {
  text-align: center !important;
}

/* Move accent border to the top for centered text */
body.acc-align-center .why-choose-section .anchor-subtitle {
  border-left: none !important;
  border-right: none !important;
  border-top: 4px solid var(--accent-color) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 20px !important;
  display: inline-block !important;
}

/* Stack the list items vertically */
body.acc-align-center .why-choose-section .clinical-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  gap: 20px !important;
}

body.acc-align-center .why-choose-section .item-meta {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 15px !important;
  width: auto !important;
}

/* 3. LEFT ALIGNMENT (Reset Base) */
body.acc-align-left .why-choose-section .clinical-item {
  display: flex !important;
  flex-direction: row !important;
  text-align: left !important;
  align-items: flex-start !important;
}

body.acc-align-left .why-choose-section .item-content {
  flex: 1 !important;
}

body.acc-align-left .why-choose-section .item-meta {
  width: 50px !important;
  flex-shrink: 0 !important;
}

body.acc-align-left .why-choose-section .anchor-subtitle {
  border-right: none !important;
  border-top: none !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  border-left: 4px solid var(--accent-color) !important;
  padding-left: 25px !important;
}
/* ============================================================================
   TRIGGER POINT INJECTION - ACCESSIBILITY WIDGET FIXES
   ============================================================================ */

/* 1. ROLE IN PAIN MANAGEMENT - Fix for new List Layout Inline Styles */
/* Text Scaling */
body.acc-text-x1 .role-list h3 {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .role-list p {
  font-size: 1.2rem !important;
}

body.acc-text-x1 .role-icon-box i {
  font-size: 1.8rem !important;
}

body.acc-text-x2 .role-list h3 {
  font-size: 1.75rem !important;
}

body.acc-text-x2 .role-list p {
  font-size: 1.4rem !important;
}

body.acc-text-x2 .role-icon-box i {
  font-size: 2.1rem !important;
}

body.acc-text-x3 .role-list h3 {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .role-list p {
  font-size: 1.8rem !important;
}

body.acc-text-x3 .role-icon-box i {
  font-size: 2.6rem !important;
}

/* Dark Mode Contrast */
html[data-contrast="dark"] .role-list h3,
html[data-contrast="dark"] .role-list p {
  color: #ffffff !important;
}

html[data-contrast="dark"] .role-icon-box {
  background: rgba(255, 255, 0, 0.1) !important;
  color: #ffff00 !important;
}

html[data-contrast="dark"] .role-icon-box i {
  color: #ffff00 !important;
}

/* Light Mode Contrast */
html[data-contrast="light"] .role-list h3,
html[data-contrast="light"] .role-list p {
  color: #000000 !important;
}

html[data-contrast="light"] .role-icon-box {
  background: rgba(0, 0, 0, 0.05) !important;
  border: 1px solid #000 !important;
}

html[data-contrast="light"] .role-icon-box i {
  color: #000000 !important;
}

/* Invert Mode */
html[data-contrast="invert"] .role-icon-box i {
  color: #22d3ee !important;
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* Alignment Dynamics */
body.acc-align-center .role-list > div {
  text-align: center !important;
  flex-direction: column !important;
  align-items: center !important;
}

body.acc-align-center .role-list .role-icon-box {
  margin-right: 0 !important;
  margin-bottom: 15px !important;
}

body.acc-align-right .role-list > div {
  text-align: right !important;
  flex-direction: row-reverse !important;
  align-items: flex-start !important;
}

body.acc-align-right .role-list .role-icon-box {
  margin-right: 0 !important;
  margin-left: 20px !important;
}

/* 2. INVERT MODE: Force Cyan/Black Icons for Cards */
html[data-contrast="invert"] .results-icon i,
html[data-contrast="invert"] .related-card-icon i,
html[data-contrast="invert"] .related-card-arrow i,
html[data-contrast="invert"] .options-card-icon i,
html[data-contrast="invert"] .options-card-link i {
  color: #22d3ee !important;
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* Invert Hover */
html[data-contrast="invert"] .related-item-card:hover .related-card-icon i,
html[data-contrast="invert"] .options-card:hover .options-card-icon i {
  color: #000000 !important;
}

/* 3. DARK MODE: Fix Card Hovers */
html[data-contrast="dark"] .related-item-card:hover {
  background-color: #ffff00 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-name,
html[data-contrast="dark"] .related-item-card:hover .related-card-arrow i {
  color: #000000 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-icon {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-icon i {
  color: #ffff00 !important;
}

/* 4. LIGHT MODE: Final CTA Fix */
html[data-contrast="light"] .final-cta-section a.btn-default:hover,
html[data-contrast="light"] .final-cta-section a.btn-default:hover span,
html[data-contrast="light"] .final-cta-section a.btn-default:hover .cta-btn-text {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}
/* ============================================================================
   ULTRASOUND GUIDED INJECTIONS - ACCESSIBILITY WIDGET FIXES
   ============================================================================ */

/* 1. INVERT MODE: Force Cyan/Black Icons */
html[data-contrast="invert"] .planning-section .icon-box i,
html[data-contrast="invert"] .comparison-section .icon-box i,
html[data-contrast="invert"] .comparison-section .fa-circle-check {
  color: #22d3ee !important;
  /* Visual Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* 2. DARK MODE: Fix Colors for Planning & Comparison Sections */
html[data-contrast="dark"] .comparison-section,
html[data-contrast="dark"] .comparison-section .bg-white {
  background-color: #000000 !important;
  color: #ffffff !important;
  border-color: #ffff00 !important;
}

html[data-contrast="dark"] .comparison-section .text-dark,
html[data-contrast="dark"] .comparison-section .text-muted,
html[data-contrast="dark"] .comparison-section span,
html[data-contrast="dark"] .comparison-section .h3 {
  color: #ffffff !important;
}

html[data-contrast="dark"] .planning-section .feature-card {
  background: #000000 !important;
  border: 1px solid #ffff00 !important;
}

html[data-contrast="dark"] .planning-section .feature-card h3,
html[data-contrast="dark"] .planning-section .feature-card p,
html[data-contrast="dark"] .planning-section .fst-italic {
  color: #ffffff !important;
  opacity: 1 !important;
}

html[data-contrast="dark"] .planning-section .icon-box,
html[data-contrast="dark"] .comparison-section .icon-box {
  background-color: #000000 !important;
  border: 2px solid #ffff00 !important;
}

html[data-contrast="dark"] .planning-section .icon-box i,
html[data-contrast="dark"] .comparison-section .icon-box i,
html[data-contrast="dark"] .comparison-section .fa-circle-check,
html[data-contrast="dark"] .planning-section .fa-circle-info {
  color: #ffff00 !important;
}

/* 3. LIGHT MODE: Fix Colors for Planning Section */
html[data-contrast="light"] .planning-section {
  background-color: #ffffff !important;
}

html[data-contrast="light"] .planning-section .section-title,
html[data-contrast="light"] .planning-section .lead,
html[data-contrast="light"] .planning-section .sub-title {
  color: #000000 !important;
  opacity: 1 !important;
}

html[data-contrast="light"] .planning-section .feature-card {
  background: #ffffff !important;
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] .planning-section .feature-card h3,
html[data-contrast="light"] .planning-section .feature-card p,
html[data-contrast="light"] .planning-section .fst-italic {
  color: #000000 !important;
  opacity: 1 !important;
}

html[data-contrast="light"] .planning-section .icon-box {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] .planning-section .icon-box i,
html[data-contrast="light"] .planning-section .fa-circle-info {
  color: #000000 !important;
}

/* 4. TEXT SCALING: Planning & Comparison Sections */
body.acc-text-x1 .planning-section h3,
body.acc-text-x1 .comparison-section h3 {
  font-size: 1.6rem !important;
}

body.acc-text-x1 .planning-section p,
body.acc-text-x1 .comparison-section p {
  font-size: 1.2rem !important;
}

body.acc-text-x1 .comparison-section .custom-list span {
  font-size: 1.2rem !important;
}

body.acc-text-x2 .planning-section h3,
body.acc-text-x2 .comparison-section h3 {
  font-size: 1.8rem !important;
}

body.acc-text-x2 .planning-section p,
body.acc-text-x2 .comparison-section p {
  font-size: 1.4rem !important;
}

body.acc-text-x2 .comparison-section .custom-list span {
  font-size: 1.4rem !important;
}

body.acc-text-x3 .planning-section h3,
body.acc-text-x3 .comparison-section h3 {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .planning-section p,
body.acc-text-x3 .comparison-section p {
  font-size: 1.7rem !important;
}

body.acc-text-x3 .comparison-section .custom-list span {
  font-size: 1.7rem !important;
}

/* 5. ALIGNMENT LOGIC: Handling complex Flex/Grid headers */
body.acc-align-center .comparison-section .d-flex.align-items-center {
  justify-content: center !important;
  flex-direction: column !important;
  text-align: center !important;
}

body.acc-align-center .comparison-section .icon-box.me-3 {
  margin-right: 0 !important;
  margin-bottom: 15px !important;
}

body.acc-align-center .comparison-section .custom-list li {
  justify-content: center !important;
}

body.acc-align-right .comparison-section .d-flex.align-items-center {
  justify-content: flex-end !important;
  flex-direction: row-reverse !important;
  text-align: right !important;
}

body.acc-align-right .comparison-section .icon-box.me-3 {
  margin-right: 0 !important;
  margin-left: 1rem !important;
}

body.acc-align-right .comparison-section .custom-list li {
  flex-direction: row-reverse !important;
  text-align: right !important;
}

body.acc-align-right .comparison-section .fa-circle-check.me-3 {
  margin-right: 0 !important;
  margin-left: 1rem !important;
} /* ============================================================================
   ULTRASOUND GUIDED INJECTIONS - COMPARISON SECTION - LIGHT MODE FIX
   ============================================================================ */

/* Force all icons (main icons, list checks, button arrow) in this section to black */
html[data-contrast="light"] .comparison-section i {
  color: #000000 !important;
  /* rgba(255,255,255,0.7) override for left card list */
  opacity: 1 !important;
}

/* Ensure the left card (Ultrasound) header text also turns black in light mode,
   as it is white inline in the HTML */
html[data-contrast="light"] .comparison-section .h3.text-white {
  color: #000000 !important;
}

/* Ensure the left card prefereed text also turns black */
html[data-contrast="light"] .comparison-section .text-white-50 {
  color: #000000 !important;
  opacity: 0.7 !important;
}
/* ============================================================================
   XEOMIN FOR PAIN - ACCESSIBILITY WIDGET FIXES
   ============================================================================ */

/* 1. INVERT MODE: Force Cyan/Black Icons for Cards */
html[data-contrast="invert"] .results-icon i,
html[data-contrast="invert"] .related-card-icon i,
html[data-contrast="invert"] .related-card-arrow i,
html[data-contrast="invert"] .options-card-icon i,
html[data-contrast="invert"] .options-card-link i {
  color: #22d3ee !important;
  /* Vivid Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* Invert Mode Hover Protection */
html[data-contrast="invert"] .related-item-card:hover .related-card-icon i,
html[data-contrast="invert"] .options-card:hover .options-card-icon i {
  color: #000000 !important;
  /* Stays crisp black (Visual White) on hover */
}

/* 2. DARK MODE: Fix Card Hovers (Yellow background, Black text/icons) */
html[data-contrast="dark"] .related-item-card:hover {
  background-color: #ffff00 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-name,
html[data-contrast="dark"] .related-item-card:hover .related-card-arrow i {
  color: #000000 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-icon {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .related-item-card:hover .related-card-icon i {
  color: #ffff00 !important;
}

/* 3. LIGHT MODE: Final CTA Button Text Fix */
html[data-contrast="light"] .final-cta-section a.btn-default:hover,
html[data-contrast="light"] .final-cta-section a.btn-default:hover span,
html[data-contrast="light"] .final-cta-section a.btn-default:hover .cta-btn-text {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}
/* ============================================================================
   ABOUT PAGE - ACCESSIBILITY WIDGET FIXES
   ============================================================================ */

/* 1. TEXT SCALING (Overrides for custom REM headers) */
/* Level 1 */
body.acc-text-x1 .medical-pain-section h2,
body.acc-text-x1 .diagnostic-title,
body.acc-text-x1 .premium-heading,
body.acc-text-x1 .narrative-headline,
body.acc-text-x1 .visit-heading {
  font-size: 3rem !important;
}

body.acc-text-x1 .medical-intro-text,
body.acc-text-x1 .diagnostic-validation,
body.acc-text-x1 .premium-subtext,
body.acc-text-x1 .narrative-context p,
body.acc-text-x1 .visit-intro {
  font-size: 1.35rem !important;
}

body.acc-text-x1 .module-title,
body.acc-text-x1 .card-text,
body.acc-text-x1 .clarity-content h3 {
  font-size: 1.5rem !important;
}

/* Level 2 */
body.acc-text-x2 .medical-pain-section h2,
body.acc-text-x2 .diagnostic-title,
body.acc-text-x2 .premium-heading,
body.acc-text-x2 .narrative-headline,
body.acc-text-x2 .visit-heading {
  font-size: 3.5rem !important;
}

body.acc-text-x2 .medical-intro-text,
body.acc-text-x2 .diagnostic-validation,
body.acc-text-x2 .premium-subtext,
body.acc-text-x2 .narrative-context p,
body.acc-text-x2 .visit-intro {
  font-size: 1.6rem !important;
}

body.acc-text-x2 .module-title,
body.acc-text-x2 .card-text,
body.acc-text-x2 .clarity-content h3 {
  font-size: 1.75rem !important;
}

/* Level 3 */
body.acc-text-x3 .medical-pain-section h2,
body.acc-text-x3 .diagnostic-title,
body.acc-text-x3 .premium-heading,
body.acc-text-x3 .narrative-headline,
body.acc-text-x3 .visit-heading {
  font-size: 4.5rem !important;
}

body.acc-text-x3 .medical-intro-text,
body.acc-text-x3 .diagnostic-validation,
body.acc-text-x3 .premium-subtext,
body.acc-text-x3 .narrative-context p,
body.acc-text-x3 .visit-intro {
  font-size: 2rem !important;
}

body.acc-text-x3 .module-title,
body.acc-text-x3 .card-text,
body.acc-text-x3 .clarity-content h3 {
  font-size: 2.2rem !important;
}

/* 2. INVERT MODE FIXES (Icons & Graphics) */
html[data-contrast="invert"] .condition-icon,
html[data-contrast="invert"] .module-icon,
html[data-contrast="invert"] .card-icon,
html[data-contrast="invert"] .fact-number i,
html[data-contrast="invert"] .clarity-icon i {
  color: #22d3ee !important;
  /* Force Bright Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
}

html[data-contrast="invert"] .fact-number {
  background-color: #000000 !important;
  /* Inverts to Visual White */
  border-color: #ffffff !important;
  /* Inverts to Visual Black */
}

/* 3. DARK MODE (Force High Contrast Yellow/Black) */
html[data-contrast="dark"] .medical-pain-section,
html[data-contrast="dark"] .diagnostic-dashboard-section,
html[data-contrast="dark"] .premium-expectations-section,
html[data-contrast="dark"] .narrative-scroll-section,
html[data-contrast="dark"] .first-visit-section {
  background-color: #000000 !important;
  color: #ffffff !important;
}

html[data-contrast="dark"] .medical-condition-card,
html[data-contrast="dark"] .diagnostic-module,
html[data-contrast="dark"] .premium-card,
html[data-contrast="dark"] .narrative-philosophy,
html[data-contrast="dark"] .assurance-panel {
  background-color: #000000 !important;
  border: 1px solid #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .medical-pain-section h2,
html[data-contrast="dark"] .medical-card-title,
html[data-contrast="dark"] .diagnostic-title,
html[data-contrast="dark"] .module-title,
html[data-contrast="dark"] .premium-heading,
html[data-contrast="dark"] .card-text,
html[data-contrast="dark"] .narrative-headline,
html[data-contrast="dark"] .fact-desc,
html[data-contrast="dark"] .visit-heading,
html[data-contrast="dark"] .clarity-content h3 {
  color: #ffff00 !important;
}

/* 4. LIGHT MODE (Force Pure White/Black) */
html[data-contrast="light"] .medical-pain-section,
html[data-contrast="light"] .diagnostic-dashboard-section,
html[data-contrast="light"] .premium-expectations-section,
html[data-contrast="light"] .narrative-scroll-section,
html[data-contrast="light"] .first-visit-section {
  background-color: #ffffff !important;
  color: #000000 !important;
}

html[data-contrast="light"] .medical-condition-card,
html[data-contrast="light"] .diagnostic-module,
html[data-contrast="light"] .premium-card,
html[data-contrast="light"] .narrative-philosophy,
html[data-contrast="light"] .assurance-panel {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
  box-shadow: none !important;
}

html[data-contrast="light"] .medical-pain-section h2,
html[data-contrast="light"] .medical-card-title,
html[data-contrast="light"] .diagnostic-title,
html[data-contrast="light"] .module-title,
html[data-contrast="light"] .premium-heading,
html[data-contrast="light"] .card-text,
html[data-contrast="light"] .narrative-headline,
html[data-contrast="light"] .fact-desc,
html[data-contrast="light"] .visit-heading,
html[data-contrast="light"] .clarity-content h3,
html[data-contrast="light"] .medical-intro-text,
html[data-contrast="light"] .medical-sub-text,
html[data-contrast="light"] .premium-subtext,
html[data-contrast="light"] .visit-intro {
  color: #000000 !important;
}

/* Ensure icons are black in light mode */
html[data-contrast="light"] .condition-icon,
html[data-contrast="light"] .module-icon,
html[data-contrast="light"] .card-icon,
html[data-contrast="light"] .fact-number i,
html[data-contrast="light"] .clarity-icon i {
  color: #000000 !important;
}

/* 5. TEXT ALIGNMENT FIXES */
body.acc-align-center .diagnostic-header,
body.acc-align-center .visit-split-row {
  text-align: center !important;
  justify-content: center !important;
}

body.acc-align-center .narrative-beat {
  align-items: center !important;
  text-align: center !important;
}

body.acc-align-center .clarity-block {
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

body.acc-align-center .diagnostic-validation {
  border-left: none !important;
  border-top: 4px solid var(--primary-color) !important;
  padding-left: 0 !important;
  padding-top: 15px !important;
}

body.acc-align-right .diagnostic-header,
body.acc-align-right .visit-split-row {
  text-align: right !important;
  justify-content: flex-end !important;
}

body.acc-align-right .narrative-beat {
  align-items: flex-end !important;
  text-align: right !important;
}

body.acc-align-right .clarity-block {
  flex-direction: row-reverse !important;
  text-align: right !important;
}

body.acc-align-right .diagnostic-validation {
  border-left: none !important;
  border-right: 4px solid var(--primary-color) !important;
  padding-left: 0 !important;
  padding-right: 24px !important;
}
/* ============================================================================
   ABOUT PAGE - ICON HOVER FREEZE & INVERT MODE FIX
   ============================================================================ */

/* 1. FREEZE HOVER EFFECTS (All Modes): Prevent icons from changing color when the card is hovered */
.premium-card:hover .card-icon {
  color: var(--secondary-color) !important;
  /* Locks to default */
}

.narrative-fact-item:hover .fact-number i {
  color: var(--primary-color) !important;
  /* Locks to default */
}

.clarity-block:hover .clarity-icon i {
  color: var(--secondary-color) !important;
  /* Locks to default */
}

/* 2. INVERT MODE ONLY: Force icons to Visual Black (CSS White inverts to Black) */
html[data-contrast="invert"] .premium-expectations-section .card-icon,
html[data-contrast="invert"] .narrative-scroll-section .fact-number i,
html[data-contrast="invert"] .first-visit-section .clarity-icon i {
  color: #ffffff !important;
  filter: none !important;
}

/* 3. INVERT MODE HOVER: Ensure they stay Visual Black even if the user hovers */
html[data-contrast="invert"] .premium-card:hover .card-icon,
html[data-contrast="invert"] .narrative-fact-item:hover .fact-number i,
html[data-contrast="invert"] .clarity-block:hover .clarity-icon i {
  color: #ffffff !important;
  filter: none !important;
}
/* ============================================================================
   PREMIUM EXPECTATIONS CARDS - DARK MODE HOVER FREEZE
   ============================================================================ */

/* 1. Freeze the card itself (stop the lift and background change) */
html[data-contrast="dark"] .premium-card:hover {
  transform: none !important;
  background-color: #000000 !important;
  border-color: #ffff00 !important;
  box-shadow: none !important;
}

/* 2. Freeze the icon circle (stop it from turning white) */
html[data-contrast="dark"] .premium-card:hover .card-icon-box {
  background-color: rgba(255, 255, 255, 0.1) !important;
  /* Locks it to the default dark grey */
  box-shadow: none !important;
}

/* 3. Lock the icon and text color to Yellow across all states */
html[data-contrast="dark"] .premium-card .card-icon,
html[data-contrast="dark"] .premium-card:hover .card-icon,
html[data-contrast="dark"] .premium-card:hover .card-text {
  color: #ffff00 !important;
}
/* ============================================================================
   ABOUT PAGE - DARK MODE ICON FIX (Black Icons on Yellow Boxes)
   ============================================================================ */

/* 1. Force the Icon Box Backgrounds to Solid Yellow in Dark Mode */
html[data-contrast="dark"] .premium-card .card-icon-box,
html[data-contrast="dark"] .narrative-fact-item .fact-number,
html[data-contrast="dark"] .clarity-block .clarity-icon {
  background-color: #ffff00 !important;
  border-color: #ffff00 !important;
}

/* 2. Force the Icons Inside to be Solid Black */
html[data-contrast="dark"] .premium-card .card-icon,
html[data-contrast="dark"] .narrative-fact-item .fact-number i,
html[data-contrast="dark"] .clarity-block .clarity-icon i {
  color: #000000 !important;
}

/* 3. FREEZE HOVER STATES: Prevent boxes from turning white or icons vanishing */
html[data-contrast="dark"] .premium-card:hover .card-icon-box,
html[data-contrast="dark"] .narrative-fact-item:hover .fact-number,
html[data-contrast="dark"] .clarity-block:hover .clarity-icon {
  background-color: #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .premium-card:hover .card-icon,
html[data-contrast="dark"] .narrative-fact-item:hover .fact-number i,
html[data-contrast="dark"] .clarity-block:hover .clarity-icon i {
  color: #000000 !important;
}
/* ============================================================================
   ABOUT PAGE - DARK MODE ICON FIX (Black Icons on Yellow Boxes)
   ============================================================================ */

/* Force the Icon Box Backgrounds to Solid Yellow in Dark Mode */
html[data-contrast="dark"] .premium-card .card-icon-box,
html[data-contrast="dark"] .narrative-fact-item .fact-number,
html[data-contrast="dark"] .clarity-block .clarity-icon {
  background-color: #ffff00 !important;
  border-color: #ffff00 !important;
}

/* Force the Icons Inside to be Solid Black */
html[data-contrast="dark"] .premium-card .card-icon,
html[data-contrast="dark"] .narrative-fact-item .fact-number i,
html[data-contrast="dark"] .clarity-block .clarity-icon i {
  color: #000000 !important;
}

/* FREEZE HOVER STATES: Prevent boxes from turning white or icons vanishing */
html[data-contrast="dark"] .premium-card:hover .card-icon-box,
html[data-contrast="dark"] .narrative-fact-item:hover .fact-number,
html[data-contrast="dark"] .clarity-block:hover .clarity-icon {
  background-color: #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] .premium-card:hover .card-icon,
html[data-contrast="dark"] .narrative-fact-item:hover .fact-number i,
html[data-contrast="dark"] .clarity-block:hover .clarity-icon i {
  color: #000000 !important;
}
/* ============================================================================
   ABOUT PAGE - DARK MODE ICON FIX (Nuclear Specificity Override)
   ============================================================================ */

/* 1. Force Yellow Background on the Icon Boxes */
html[data-contrast="dark"] #main-content .premium-card .card-icon-box,
html[data-contrast="dark"] #main-content .narrative-fact-item .fact-number,
html[data-contrast="dark"] #main-content .clarity-block .clarity-icon {
  background-color: #ffff00 !important;
  border-color: #ffff00 !important;
  box-shadow: none !important;
}

/* 2. Force Black Color on the Icons (Beats global rules using ID specificity) */
html[data-contrast="dark"] #main-content .premium-card .card-icon-box i,
html[data-contrast="dark"] #main-content .narrative-fact-item .fact-number i,
html[data-contrast="dark"] #main-content .clarity-block .clarity-icon i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 3. Freeze Hover States so nothing changes when hovering the card */
html[data-contrast="dark"] #main-content .premium-card:hover {
  transform: none !important;
  background-color: #000000 !important;
  border-color: #ffff00 !important;
}

html[data-contrast="dark"] #main-content .premium-card:hover .card-icon-box,
html[data-contrast="dark"] #main-content .narrative-fact-item:hover .fact-number,
html[data-contrast="dark"] #main-content .clarity-block:hover .clarity-icon {
  background-color: #ffff00 !important;
  border-color: #ffff00 !important;
  box-shadow: none !important;
}

html[data-contrast="dark"] #main-content .premium-card:hover .card-icon-box i,
html[data-contrast="dark"] #main-content .narrative-fact-item:hover .fact-number i,
html[data-contrast="dark"] #main-content .clarity-block:hover .clarity-icon i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}
/* ============================================================================
   ABOUT PAGE - LIGHT MODE NARRATIVE QUOTE TEXT FIX
   ============================================================================ */

html[data-contrast="light"] #main-content .narrative-philosophy blockquote {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}
/* ============================================================================
   ABOUT PAGE - CTA BOX LIGHT MODE TEXT FIX 
   ============================================================================ */

/* Overrides the hardcoded inline #ffffff text color using webkit-text-fill */
html[data-contrast="light"] #main-content .cta-box .section-title h2,
html[data-contrast="light"] #main-content .cta-box .section-title p,
html[data-contrast="light"] #main-content .cta-box .section-title .sub-title {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  /* Critical: Bypasses inline CSS color locks */
  opacity: 1 !important;
}
/* ============================================================================
   ABOUT PAGE - FIRST VISIT SECTION TEXT SCALING (Overrides Inline Styles)
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .visit-label {
  font-size: 17px !important;
}

body.acc-text-x1 .visit-heading {
  font-size: 58px !important;
}

body.acc-text-x1 .visit-intro {
  font-size: 24px !important;
}

body.acc-text-x1 .clarity-content p {
  font-size: 24px !important;
  line-height: 1.6 !important;
}

body.acc-text-x1 .clarity-icon {
  font-size: 24px !important;
  width: 55px !important;
  height: 55px !important;
}

body.acc-text-x1 .assurance-panel p {
  font-size: 26px !important;
  line-height: 1.6 !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .visit-label {
  font-size: 20px !important;
}

body.acc-text-x2 .visit-heading {
  font-size: 67px !important;
}

body.acc-text-x2 .visit-intro {
  font-size: 28px !important;
}

body.acc-text-x2 .clarity-content p {
  font-size: 28px !important;
  line-height: 1.6 !important;
}

body.acc-text-x2 .clarity-icon {
  font-size: 28px !important;
  width: 65px !important;
  height: 65px !important;
}

body.acc-text-x2 .assurance-panel p {
  font-size: 31px !important;
  line-height: 1.6 !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .visit-label {
  font-size: 25px !important;
}

body.acc-text-x3 .visit-heading {
  font-size: 84px !important;
}

body.acc-text-x3 .visit-intro {
  font-size: 35px !important;
}

body.acc-text-x3 .clarity-content p {
  font-size: 35px !important;
  line-height: 1.6 !important;
}

body.acc-text-x3 .clarity-icon {
  font-size: 35px !important;
  width: 75px !important;
  height: 75px !important;
}

body.acc-text-x3 .assurance-panel p {
  font-size: 39px !important;
  line-height: 1.6 !important;
}
/* ============================================================================
   ABOUT PAGE - NARRATIVE SCROLL (MEET THE DOCTOR) TEXT SCALING
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .narrative-label {
  font-size: 16px !important;
}

body.acc-text-x1 .narrative-headline {
  font-size: 72px !important;
  line-height: 1.1 !important;
}

body.acc-text-x1 .narrative-context p {
  font-size: 26px !important;
  line-height: 1.6 !important;
}

body.acc-text-x1 .fact-desc {
  font-size: 22px !important;
  line-height: 1.5 !important;
}

body.acc-text-x1 .narrative-philosophy blockquote {
  font-size: 24px !important;
  line-height: 1.6 !important;
}

body.acc-text-x1 .btn-nar-primary {
  font-size: 19px !important;
}

/* Scale the icon and its circular box so it doesn't break */
body.acc-text-x1 .fact-number,
body.acc-text-x1 .fact-number i {
  font-size: 29px !important;
  width: 55px !important;
  height: 55px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .narrative-label {
  font-size: 19px !important;
}

body.acc-text-x2 .narrative-headline {
  font-size: 84px !important;
  line-height: 1.1 !important;
}

body.acc-text-x2 .narrative-context p {
  font-size: 30px !important;
  line-height: 1.6 !important;
}

body.acc-text-x2 .fact-desc {
  font-size: 26px !important;
  line-height: 1.5 !important;
}

body.acc-text-x2 .narrative-philosophy blockquote {
  font-size: 28px !important;
  line-height: 1.6 !important;
}

body.acc-text-x2 .btn-nar-primary {
  font-size: 22px !important;
}

/* Scale the icon and its circular box */
body.acc-text-x2 .fact-number,
body.acc-text-x2 .fact-number i {
  font-size: 34px !important;
  width: 65px !important;
  height: 65px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .narrative-label {
  font-size: 24px !important;
}

body.acc-text-x3 .narrative-headline {
  font-size: 105px !important;
  line-height: 1.1 !important;
}

body.acc-text-x3 .narrative-context p {
  font-size: 38px !important;
  line-height: 1.6 !important;
}

body.acc-text-x3 .fact-desc {
  font-size: 32px !important;
  line-height: 1.5 !important;
}

body.acc-text-x3 .narrative-philosophy blockquote {
  font-size: 35px !important;
  line-height: 1.6 !important;
}

body.acc-text-x3 .btn-nar-primary {
  font-size: 28px !important;
}

/* Scale the icon and its circular box */
body.acc-text-x3 .fact-number,
body.acc-text-x3 .fact-number i {
  font-size: 42px !important;
  width: 80px !important;
  height: 80px !important;
}
/* ============================================================================
   ABOUT PAGE - PREMIUM EXPECTATIONS SECTION TEXT SCALING
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .premium-eyebrow {
  font-size: 16px !important;
}

body.acc-text-x1 .premium-heading {
  font-size: 48px !important;
  line-height: 1.2 !important;
}

body.acc-text-x1 .premium-goal-text {
  font-size: 20px !important;
  line-height: 1.6 !important;
}

body.acc-text-x1 .premium-card .card-text {
  font-size: 21px !important;
  line-height: 1.5 !important;
}

body.acc-text-x1 .premium-card .card-icon-box {
  width: 58px !important;
  height: 58px !important;
  flex-shrink: 0 !important;
}

body.acc-text-x1 .premium-card .card-icon {
  font-size: 21px !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .premium-eyebrow {
  font-size: 19px !important;
}

body.acc-text-x2 .premium-heading {
  font-size: 56px !important;
  line-height: 1.2 !important;
}

body.acc-text-x2 .premium-goal-text {
  font-size: 24px !important;
  line-height: 1.6 !important;
}

body.acc-text-x2 .premium-card .card-text {
  font-size: 25px !important;
  line-height: 1.5 !important;
}

body.acc-text-x2 .premium-card .card-icon-box {
  width: 68px !important;
  height: 68px !important;
  flex-shrink: 0 !important;
}

body.acc-text-x2 .premium-card .card-icon {
  font-size: 25px !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .premium-eyebrow {
  font-size: 24px !important;
}

body.acc-text-x3 .premium-heading {
  font-size: 70px !important;
  line-height: 1.2 !important;
}

body.acc-text-x3 .premium-goal-text {
  font-size: 30px !important;
  line-height: 1.6 !important;
}

body.acc-text-x3 .premium-card .card-text {
  font-size: 31px !important;
  line-height: 1.5 !important;
}

body.acc-text-x3 .premium-card .card-icon-box {
  width: 80px !important;
  height: 80px !important;
  flex-shrink: 0 !important;
}

body.acc-text-x3 .premium-card .card-icon {
  font-size: 31px !important;
}
/* ============================================================================
   ABOUT PAGE - OUR APPROACH (DIAGNOSTIC) TEXT SCALING
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .diagnostic-label {
  font-size: 16px !important;
}

body.acc-text-x1 .diagnostic-title {
  font-size: 53px !important;
  line-height: 1.2 !important;
}

body.acc-text-x1 .diagnostic-validation {
  font-size: 24px !important;
  line-height: 1.6 !important;
}

body.acc-text-x1 .module-title {
  font-size: 27px !important;
}

body.acc-text-x1 .module-icon {
  font-size: 23px !important;
}

body.acc-text-x1 .module-text {
  font-size: 20px !important;
  line-height: 1.7 !important;
}

body.acc-text-x1 .diagnostic-footer p {
  font-size: 21px !important;
  line-height: 1.6 !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .diagnostic-label {
  font-size: 19px !important;
}

body.acc-text-x2 .diagnostic-title {
  font-size: 62px !important;
  line-height: 1.2 !important;
}

body.acc-text-x2 .diagnostic-validation {
  font-size: 28px !important;
  line-height: 1.6 !important;
}

body.acc-text-x2 .module-title {
  font-size: 31px !important;
}

body.acc-text-x2 .module-icon {
  font-size: 27px !important;
}

body.acc-text-x2 .module-text {
  font-size: 24px !important;
  line-height: 1.7 !important;
}

body.acc-text-x2 .diagnostic-footer p {
  font-size: 25px !important;
  line-height: 1.6 !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .diagnostic-label {
  font-size: 24px !important;
}

body.acc-text-x3 .diagnostic-title {
  font-size: 77px !important;
  line-height: 1.2 !important;
}

body.acc-text-x3 .diagnostic-validation {
  font-size: 35px !important;
  line-height: 1.6 !important;
}

body.acc-text-x3 .module-title {
  font-size: 39px !important;
}

body.acc-text-x3 .module-icon {
  font-size: 34px !important;
}

body.acc-text-x3 .module-text {
  font-size: 29px !important;
  line-height: 1.7 !important;
}

body.acc-text-x3 .diagnostic-footer p {
  font-size: 31px !important;
  line-height: 1.6 !important;
}
/* ============================================================================
   ABOUT PAGE - WHAT WE DO SECTION TEXT SCALING
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .medical-eyebrow {
  font-size: 1.1rem !important;
}

body.acc-text-x1 .medical-pain-section h2 {
  font-size: 3rem !important;
}

body.acc-text-x1 .medical-intro-text {
  font-size: 1.35rem !important;
}

body.acc-text-x1 .medical-sub-text {
  font-size: 1.2rem !important;
}

body.acc-text-x1 .medical-card-title {
  font-size: 1.5rem !important;
}

body.acc-text-x1 .condition-item {
  font-size: 1.1rem !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .medical-eyebrow {
  font-size: 1.25rem !important;
}

body.acc-text-x2 .medical-pain-section h2 {
  font-size: 3.5rem !important;
}

body.acc-text-x2 .medical-intro-text {
  font-size: 1.6rem !important;
}

body.acc-text-x2 .medical-sub-text {
  font-size: 1.4rem !important;
}

body.acc-text-x2 .medical-card-title {
  font-size: 1.75rem !important;
}

body.acc-text-x2 .condition-item {
  font-size: 1.3rem !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .medical-eyebrow {
  font-size: 1.5rem !important;
}

body.acc-text-x3 .medical-pain-section h2 {
  font-size: 4.4rem !important;
}

body.acc-text-x3 .medical-intro-text {
  font-size: 2rem !important;
}

body.acc-text-x3 .medical-sub-text {
  font-size: 1.8rem !important;
}

body.acc-text-x3 .medical-card-title {
  font-size: 2.2rem !important;
}

body.acc-text-x3 .condition-item {
  font-size: 1.6rem !important;
}
/* ============================================================================
   ABOUT PAGE - TOP "ABOUT US" SECTION TEXT SCALING 
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .page-about-content .sub-title {
  font-size: 18px !important;
}

body.acc-text-x1 .page-about-content h2 {
  font-size: 58px !important;
  line-height: 1.2 !important;
}

body.acc-text-x1 .page-about-content p,
body.acc-text-x1 .page-about-body-content p {
  font-size: 21px !important;
  line-height: 1.6 !important;
}

/* Level 2 (140%) */
body.acc-text-x2 .page-about-content .sub-title {
  font-size: 21px !important;
}

body.acc-text-x2 .page-about-content h2 {
  font-size: 67px !important;
  line-height: 1.2 !important;
}

body.acc-text-x2 .page-about-content p,
body.acc-text-x2 .page-about-body-content p {
  font-size: 24px !important;
  line-height: 1.6 !important;
}

/* Level 3 (175%) */
body.acc-text-x3 .page-about-content .sub-title {
  font-size: 26px !important;
}

body.acc-text-x3 .page-about-content h2 {
  font-size: 84px !important;
  line-height: 1.2 !important;
}

body.acc-text-x3 .page-about-content p,
body.acc-text-x3 .page-about-body-content p {
  font-size: 30px !important;
  line-height: 1.6 !important;
}

/* ============================================================================
   CARE PRINCIPLES SECTION - TEXT SCALING
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .care-principles h2 {
    font-size: 58px !important;
}
body.acc-text-x1 .care-principles .care-intro,
body.acc-text-x1 .care-principles .care-intro p {
    font-size: 21px !important;
}
body.acc-text-x1 .care-principles .dark-contrast-ring-yellow {
    width: 60px !important;
    height: 60px !important;
    font-size: 24px !important;
}
body.acc-text-x1 .care-principles h3 {
    font-size: 1.5rem !important;
}
body.acc-text-x1 .care-principles p {
    font-size: 1.1rem !important;
}
body.acc-text-x1 .care-principles .btn-default span {
    font-size: 1.2rem !important;
}

/* Level 1 (120%) - Targeted Treatments & Trust Statements */
body.acc-text-x1 .targeted-treatments h2 {
    font-size: 58px !important;
}
body.acc-text-x1 .care-continuity-statement p {
    font-size: 1.4rem !important;
}

/* Level 2 (150%) */
body.acc-text-x2 .care-principles h2 {
    font-size: 70px !important;
}
body.acc-text-x2 .care-principles .care-intro,
body.acc-text-x2 .care-principles .care-intro p {
    font-size: 26px !important;
}
body.acc-text-x2 .care-principles .dark-contrast-ring-yellow {
    width: 75px !important;
    height: 75px !important;
    font-size: 30px !important;
}
body.acc-text-x2 .care-principles h3 {
    font-size: 1.8rem !important;
}
body.acc-text-x2 .care-principles p {
    font-size: 1.35rem !important;
}
body.acc-text-x2 .care-principles .btn-default span {
    font-size: 1.4rem !important;
}

/* Level 2 (150%) - Targeted Treatments & Trust Statements */
body.acc-text-x2 .targeted-treatments h2 {
    font-size: 70px !important;
}
body.acc-text-x2 .care-continuity-statement p {
    font-size: 1.7rem !important;
}

/* Level 3 (180%) */
body.acc-text-x3 .care-principles h2 {
    font-size: 85px !important;
}
body.acc-text-x3 .care-principles .care-intro,
body.acc-text-x3 .care-principles .care-intro p {
    font-size: 32px !important;
}
body.acc-text-x3 .care-principles .dark-contrast-ring-yellow {
    width: 90px !important;
    height: 90px !important;
    font-size: 40px !important;
}
body.acc-text-x3 .care-principles h3 {
    font-size: 2.3rem !important;
}
body.acc-text-x3 .care-principles p {
    font-size: 1.7rem !important;
}
body.acc-text-x3 .care-principles .btn-default span {
    font-size: 1.8rem !important;
}

/* Level 3 (180%) - Targeted Treatments & Trust Statements */
body.acc-text-x3 .targeted-treatments h2 {
    font-size: 85px !important;
}
body.acc-text-x3 .care-continuity-statement p {
    font-size: 2.1rem !important;
}
/* ============================================================================
   APPOINTMENT PAGE - FOOTER CTA ACCESSIBILITY FIXES 
   ============================================================================ */

/* 1. DARK MODE: Force High Contrast Yellow on Black */
html[data-contrast="dark"] .next-step-cta-section {
  background-color: #000000 !important;
}

html[data-contrast="dark"] .next-step-cta-section .cta-title,
html[data-contrast="dark"] .next-step-cta-section .cta-text {
  color: #ffff00 !important;
  -webkit-text-fill-color: #ffff00 !important;
  filter: none !important;
}

html[data-contrast="dark"] .next-step-cta-section .btn-default {
  background-color: #000000 !important;
  color: #ffff00 !important;
  border: 2px solid #ffff00 !important;
}

html[data-contrast="dark"] .next-step-cta-section .btn-default:hover {
  background-color: #ffff00 !important;
  color: #000000 !important;
}

/* 2. LIGHT MODE: Force Pure Black on White */
html[data-contrast="light"] .next-step-cta-section {
  background-color: #ffffff !important;
}

html[data-contrast="light"] .next-step-cta-section .cta-title,
html[data-contrast="light"] .next-step-cta-section .cta-text {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  filter: none !important;
}

html[data-contrast="light"] .next-step-cta-section .btn-default {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] .next-step-cta-section .btn-default:hover {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* 3. INVERT MODE: Force Visual Black (Source White) */
html[data-contrast="invert"] .next-step-cta-section .cta-title,
html[data-contrast="invert"] .next-step-cta-section .cta-text {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  filter: none !important;
}
/* ============================================================================
   APPOINTMENT PAGE - DETAILS SECTION LIGHT MODE FIX
   ============================================================================ */

/* 1. Force the main section background to pure white and remove the gradient */
html[data-contrast="light"] .appointment-details-section {
  background-color: #ffffff !important;
  background-image: none !important;
}

/* 2. Force all text to be solid black */
html[data-contrast="light"] .appointment-details-section .consultation-heading,
html[data-contrast="light"] .appointment-details-section .consultation-desc,
html[data-contrast="light"] .appointment-details-section h4,
html[data-contrast="light"] .appointment-details-section .form-instruction,
html[data-contrast="light"] .appointment-details-section .availability-text {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 3. Make the grey boxes pure white with black borders for clear contrast */
html[data-contrast="light"] .consultation-desc-container,
html[data-contrast="light"] .form-instruction-container,
html[data-contrast="light"] .availability-card {
  background-color: #ffffff !important;
  background: #ffffff !important;
  border: 2px solid #000000 !important;
  box-shadow: none !important;
}

/* 4. Force the square icons in the list to have a black border so they are visible */
html[data-contrast="light"] .availability-card .option-icon {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
}
/* ============================================================================
   APPOINTMENT PAGE - AVAILABILITY DOTS LIGHT MODE FIX
   ============================================================================ */

/* Force the inner dots inside the square icons to be solid black */
html[data-contrast="light"] .availability-card .option-icon::before,
html[data-contrast="light"] .availability-card .option-icon::after {
  background-color: #000000 !important;
}

/* Ensure they stay black even if hovered or active */
html[data-contrast="light"] .availability-card:hover .option-icon::before,
html[data-contrast="light"] .availability-card:hover .option-icon::after {
  background-color: #000000 !important;
}

/* ============================================================================
   INDEX PAGE - LOCATION SECTION LIGHT MODE FIX
   ============================================================================ */

/* 1. Force the main section background to pure white */
html[data-contrast="light"] .location-nexus-section {
  background-color: #ffffff !important;
  background: #ffffff !important;
  background-image: none !important;
}

/* 2. Force all text elements to solid black (Handles !important inlines) */
html[data-contrast="light"] .location-nexus-section .sub-title,
html[data-contrast="light"] .location-nexus-section h2,
html[data-contrast="light"] .location-nexus-section h2 span,
html[data-contrast="light"] .location-nexus-section p,
html[data-contrast="light"] .location-nexus-section .location-card-main h3,
html[data-contrast="light"] .location-nexus-section .location-card-main p,
html[data-contrast="light"] .location-nexus-section .location-card-main span,
html[data-contrast="light"] .location-nexus-section .location-card-main i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 3. Neighborhood Tags: Black border and white background for contrast */
html[data-contrast="light"] .location-neighborhood-tag {
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 1px solid #000000 !important;
}

/* 4. Address Card: Pure white with black border */
html[data-contrast="light"] .location-card-main {
  background-color: #ffffff !important;
  background: #ffffff !important;
  border: 2px solid #000000 !important;
  box-shadow: none !important;
}

/* 5. Address Card Accent Top Bar: Make it black */
html[data-contrast="light"] .location-card-main > div[style*="height: 6px"] {
  background-color: #000000 !important;
  background: #000000 !important;
}

/* 6. Address Card Inner Info Block: White background and black border */
html[data-contrast="light"] .location-card-main div[style*="background: rgba(255, 255, 255, 0.05)"] {
  background-color: #ffffff !important;
  background: #ffffff !important;
  border: 1px solid #000000 !important;
}
/* ============================================================================
   ABOUT PAGE - PREMIUM CARDS HOVER FREEZE (Fixes Black-on-Black Glitch)
   ============================================================================ */

/* 1. Stop the cards from jumping/moving on hover in all contrast modes */
html[data-contrast] #main-content .premium-card:hover {
  transform: none !important;
}

/* 2. LIGHT MODE: Freeze circle background to White, Icon to Black */
html[data-contrast="light"] #main-content .premium-card:hover .card-icon-box {
  background-color: #ffffff !important;
  background: #ffffff !important;
  border: 2px solid #000000 !important;
}

html[data-contrast="light"] #main-content .premium-card:hover .card-icon-box i,
html[data-contrast="light"] #main-content .premium-card:hover .card-icon {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 3. DARK MODE: Freeze circle background to Yellow, Icon to Black */
html[data-contrast="dark"] #main-content .premium-card:hover .card-icon-box {
  background-color: #ffff00 !important;
  background: #ffff00 !important;
  border-color: #ffff00 !important;
}

html[data-contrast="dark"] #main-content .premium-card:hover .card-icon-box i,
html[data-contrast="dark"] #main-content .premium-card:hover .card-icon {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 4. INVERT MODE: Ensure icon doesn't turn black on hover */
html[data-contrast="invert"] #main-content .premium-card:hover .card-icon-box {
  background-color: transparent !important;
}

html[data-contrast="invert"] #main-content .premium-card:hover .card-icon-box i,
html[data-contrast="invert"] #main-content .premium-card:hover .card-icon {
  color: #22d3ee !important;
  /* Visual Cyan */
  filter: invert(100%) hue-rotate(180deg) !important;
}
/* ============================================================================
   ABOUT PAGE - REMOVE CYAN HOVER ON PREMIUM CARDS
   ============================================================================ */

/* 1. Force the icon to remain pure black on hover (overrides the cyan variable) */
#main-content .premium-card:hover .card-icon,
#main-content .premium-card:hover .card-icon-box i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* 2. Force the little tracking dot to turn black on hover instead of cyan */
#main-content .premium-card:hover::before,
#main-content .premium-card:hover::after {
  background-color: #000000 !important;
  border-color: #000000 !important;
}

/* ============================================================================
   FOOTER - LIGHT MODE CONTRAST FIX
   ============================================================================ */
html[data-contrast="light"] .main-footer {
  background-color: #ffffff !important;
  background: #ffffff !important;
  border-top: 2px solid #000000 !important;
}

html[data-contrast="light"] .main-footer,
html[data-contrast="light"] .main-footer p,
html[data-contrast="light"] .main-footer h2,
html[data-contrast="light"] .main-footer li,
html[data-contrast="light"] .main-footer a {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

html[data-contrast="light"] .footer-logo .logo-text {
  background-color: #000000 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-contrast="light"] .footer-links h2 {
    background-color: #000000 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-contrast="light"] .footer-info-box .icon-box img {
    filter: brightness(0) !important; /* Pure black icons on white bg */
}

html[data-contrast="light"] .footer-links.social-links ul li a {
    border: 1px solid #000000 !important;
    background-color: #ffffff !important;
}

html[data-contrast="light"] .footer-links.social-links ul li a:hover {
    background-color: #000000 !important;
    color: #ffffff !important;
}

html[data-contrast="light"] .footer-links.social-links ul li a i {
    color: inherit !important;
}

html[data-contrast="light"] .footer-links ul li a {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* Dark Contrast Fix: Patient Journey Step Numbers */
html[data-contrast="dark"] .journey-step-number {
  background: #000000 !important;
  background-color: #000000 !important;
  color: #ffff00 !important;
  -webkit-text-fill-color: #ffff00 !important;
  border: 4px solid #ffff00 !important;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.5) !important;
}

/* ============================================================================
   BROOKLYN PAGE - CUSTOM SECTIONS TEXT SCALING
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .why-choose-header h2 { font-size: 3.1rem !important; }
body.acc-text-x1 .benefit-card h3 { font-size: 1.35rem !important; }
body.acc-text-x1 .regenexx-badge { font-size: 1rem !important; }
body.acc-text-x1 .regenexx-header h3 { font-size: 2.4rem !important; }
body.acc-text-x1 .regenexx-header p { font-size: 1.35rem !important; }
body.acc-text-x1 .pill-title { font-size: 1.3rem !important; }
body.acc-text-x1 .pill-desc { font-size: 1.15rem !important; }

/* Level 2 (150%) */
body.acc-text-x2 .why-choose-header h2 { font-size: 3.9rem !important; }
body.acc-text-x2 .benefit-card h3 { font-size: 1.65rem !important; }
body.acc-text-x2 .regenexx-badge { font-size: 1.25rem !important; }
body.acc-text-x2 .regenexx-header h3 { font-size: 3rem !important; }
body.acc-text-x2 .regenexx-header p { font-size: 1.65rem !important; }
body.acc-text-x2 .pill-title { font-size: 1.6rem !important; }
body.acc-text-x2 .pill-desc { font-size: 1.4rem !important; }

/* Level 3 (180%) */
body.acc-text-x3 .why-choose-header h2 { font-size: 4.6rem !important; }
body.acc-text-x3 .benefit-card h3 { font-size: 1.95rem !important; }
body.acc-text-x3 .regenexx-badge { font-size: 1.5rem !important; }
body.acc-text-x3 .regenexx-header h3 { font-size: 3.6rem !important; }
body.acc-text-x3 .regenexx-header p { font-size: 2rem !important; }
body.acc-text-x3 .pill-title { font-size: 2rem !important; }
body.acc-text-x3 .pill-desc { font-size: 1.7rem !important; }
body.acc-text-x3 .regenexx-pill { padding: 35px !important; }

/* ============================================================================
   CONDITIONS PAGE - SPECIALIST EVALUATION TEXT SCALING
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .specialist-evaluation h2 { font-size: 3.3rem !important; }
body.acc-text-x1 .specialist-evaluation p.lead { font-size: 1.5rem !important; }
body.acc-text-x1 .specialist-evaluation h4 { font-size: 1.35rem !important; }

/* Level 2 (150%) */
body.acc-text-x2 .specialist-evaluation h2 { font-size: 4.2rem !important; }
body.acc-text-x2 .specialist-evaluation p.lead { font-size: 1.8rem !important; }
body.acc-text-x2 .specialist-evaluation h4 { font-size: 1.7rem !important; }

/* Level 3 (180%) */
body.acc-text-x3 .specialist-evaluation h2 { font-size: 5rem !important; }
body.acc-text-x3 .specialist-evaluation p.lead { font-size: 2.2rem !important; }
body.acc-text-x3 .specialist-evaluation h4 { font-size: 2rem !important; }



/* Treatments Page - Doctor Highlight Box - Contrast Overrides */
html[data-contrast="dark"] .doctor-highlight-box {
  background-color: #000000 !important;
  background: #000000 !important;
  border: 4px solid #ffff00 !important;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.5) !important;
}

html[data-contrast="dark"] .doctor-highlight-box h3,
html[data-contrast="dark"] .doctor-highlight-box p {
  color: #ffff00 !important;
  -webkit-text-fill-color: #ffff00 !important;
}

html[data-contrast="light"] .doctor-highlight-box {
  background-color: #ffffff !important;
  background: #ffffff !important;
  border: 4px solid #000000 !important;
}

html[data-contrast="light"] .doctor-highlight-box h3,
html[data-contrast="light"] .doctor-highlight-box p {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* ============================================================================
   TREATMENTS PAGE - TEXT SCALING
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .doctor-highlight-box h3 { font-size: 1.8rem !important; }
body.acc-text-x1 .doctor-highlight-box p.small { font-size: 1.05rem !important; }
body.acc-text-x1 .doctor-highlight-box p.mb-0 { font-size: 1.2rem !important; }
body.acc-text-x1 .stack-title { font-size: 4rem !important; }
body.acc-text-x1 .stack-subtitle { font-size: 1.9rem !important; }
body.acc-text-x1 .mosaic-text { font-size: 1.4rem !important; }
body.acc-text-x1 .anchor-title { font-size: 3.3rem !important; }
body.acc-text-x1 .item-content h3 { font-size: 1.7rem !important; }
body.acc-text-x1 .item-content p { font-size: 1.3rem !important; }
body.acc-text-x1 .cta-content h2 { font-size: 3.0rem !important; }
body.acc-text-x1 .cta-content p { font-size: 1.3rem !important; }

/* Level 2 (150%) */
body.acc-text-x2 .doctor-highlight-box h3 { font-size: 2.25rem !important; }
body.acc-text-x2 .doctor-highlight-box p.small { font-size: 1.3rem !important; }
body.acc-text-x2 .doctor-highlight-box p.mb-0 { font-size: 1.5rem !important; }
body.acc-text-x2 .stack-title { font-size: 4.8rem !important; }
body.acc-text-x2 .stack-subtitle { font-size: 2.3rem !important; }
body.acc-text-x2 .mosaic-text { font-size: 1.7rem !important; }
body.acc-text-x2 .anchor-title { font-size: 4.1rem !important; }
body.acc-text-x2 .item-content h3 { font-size: 2.1rem !important; }
body.acc-text-x2 .item-content p { font-size: 1.65rem !important; }
body.acc-text-x2 .cta-content h2 { font-size: 3.75rem !important; }
body.acc-text-x2 .cta-content p { font-size: 1.65rem !important; }

/* Level 3 (180%) */
body.acc-text-x3 .doctor-highlight-box h3 { font-size: 2.7rem !important; }
body.acc-text-x3 .doctor-highlight-box p.small { font-size: 1.6rem !important; }
body.acc-text-x3 .doctor-highlight-box p.mb-0 { font-size: 1.8rem !important; }
body.acc-text-x3 .stack-title { font-size: 5.5rem !important; }
body.acc-text-x3 .stack-subtitle { font-size: 2.8rem !important; }
body.acc-text-x3 .mosaic-text { font-size: 2rem !important; }
body.acc-text-x3 .anchor-title { font-size: 5.0rem !important; }
body.acc-text-x3 .item-content h3 { font-size: 2.5rem !important; }
body.acc-text-x3 .item-content p { font-size: 2.0rem !important; }
body.acc-text-x3 .cta-content h2 { font-size: 4.5rem !important; }
body.acc-text-x3 .cta-content p { font-size: 2.0rem !important; }

/* ============================================================================
   APPOINTMENT PAGE (GUIDED INTAKE) - COMPREHENSIVE TEXT SCALING
   ============================================================================ */

/* Level 1 (120%) */
body.acc-text-x1 .intro-headline h2 { font-size: 58px !important; }
body.acc-text-x1 .intro-content-panel p { font-size: 20px !important; }
body.acc-text-x1 .consultation-heading { font-size: 48px !important; }
body.acc-text-x1 .consultation-desc { font-size: 20px !important; }
body.acc-text-x1 .consultation-focus-area p { font-size: 19px !important; }
body.acc-text-x1 .availability-text { font-size: 22px !important; }
body.acc-text-x1 .form-instruction { font-size: 22px !important; }
body.acc-text-x1 .btn-premium-action { font-size: 18px !important; }
body.acc-text-x1 .post-submit-details .section-title h2 { font-size: 50px !important; }
body.acc-text-x1 .section-desc-text { font-size: 22px !important; }
body.acc-text-x1 .patient-suitability-section .section-title h2 { font-size: 43px !important; }
body.acc-text-x1 .suitability-text { font-size: 19px !important; }
body.acc-text-x1 .disclaimer-header h2 { font-size: 31px !important; }
body.acc-text-x1 .disclaimer-text { font-size: 20px !important; }
body.acc-text-x1 .easy-steps-section .section-title h2 { font-size: 50px !important; }
body.acc-text-x1 .step-card-light h3 { font-size: 26px !important; }
body.acc-text-x1 .step-card-light p { font-size: 19px !important; }
body.acc-text-x1 .clinic-name { font-size: 43px !important; }
body.acc-text-x1 .address-line { font-size: 22px !important; }
body.acc-text-x1 .cta-title { font-size: 43px !important; }
body.acc-text-x1 .cta-text { font-size: 23px !important; }

/* Level 2 (150%) */
body.acc-text-x2 .intro-headline h2 { font-size: 72px !important; }
body.acc-text-x2 .intro-content-panel p { font-size: 25px !important; }
body.acc-text-x2 .consultation-heading { font-size: 60px !important; }
body.acc-text-x2 .consultation-desc { font-size: 25px !important; }
body.acc-text-x2 .consultation-focus-area p { font-size: 24px !important; }
body.acc-text-x2 .availability-text { font-size: 27px !important; }
body.acc-text-x2 .form-instruction { font-size: 27px !important; }
body.acc-text-x2 .btn-premium-action { font-size: 22px !important; }
body.acc-text-x2 .post-submit-details .section-title h2 { font-size: 63px !important; }
body.acc-text-x2 .section-desc-text { font-size: 27px !important; }
body.acc-text-x2 .patient-suitability-section .section-title h2 { font-size: 54px !important; }
body.acc-text-x2 .suitability-text { font-size: 24px !important; }
body.acc-text-x2 .disclaimer-header h2 { font-size: 39px !important; }
body.acc-text-x2 .disclaimer-text { font-size: 25px !important; }
body.acc-text-x2 .easy-steps-section .section-title h2 { font-size: 63px !important; }
body.acc-text-x2 .step-card-light h3 { font-size: 33px !important; }
body.acc-text-x2 .step-card-light p { font-size: 24px !important; }
body.acc-text-x2 .clinic-name { font-size: 54px !important; }
body.acc-text-x2 .address-line { font-size: 27px !important; }
body.acc-text-x2 .cta-title { font-size: 54px !important; }
body.acc-text-x2 .cta-text { font-size: 28px !important; }

/* Level 3 (180%) */
body.acc-text-x3 .intro-headline h2 { font-size: 86px !important; }
body.acc-text-x3 .intro-content-panel p { font-size: 30px !important; }
body.acc-text-x3 .consultation-heading { font-size: 72px !important; }
body.acc-text-x3 .consultation-desc { font-size: 30px !important; }
body.acc-text-x3 .consultation-focus-area p { font-size: 28px !important; }
body.acc-text-x3 .availability-text { font-size: 32px !important; }
body.acc-text-x3 .form-instruction { font-size: 32px !important; }
body.acc-text-x3 .btn-premium-action { font-size: 26px !important; }
body.acc-text-x3 .post-submit-details .section-title h2 { font-size: 75px !important; }
body.acc-text-x3 .section-desc-text { font-size: 32px !important; }
body.acc-text-x3 .patient-suitability-section .section-title h2 { font-size: 65px !important; }
body.acc-text-x3 .suitability-text { font-size: 28px !important; }
body.acc-text-x3 .disclaimer-header h2 { font-size: 47px !important; }
body.acc-text-x3 .disclaimer-text { font-size: 30px !important; }
body.acc-text-x3 .easy-steps-section .section-title h2 { font-size: 75px !important; }
body.acc-text-x3 .step-card-light h3 { font-size: 40px !important; }
body.acc-text-x3 .step-card-light p { font-size: 28px !important; }
body.acc-text-x3 .clinic-name { font-size: 65px !important; }
body.acc-text-x3 .address-line { font-size: 32px !important; }
body.acc-text-x3 .cta-title { font-size: 65px !important; }
body.acc-text-x3 .cta-text { font-size: 34px !important; }

/* ============================================================================
   EMERGENCY OVERRIDE: LOCK ACCESSIBILITY WIDGET DESIGN
   (This must stay at the end of the file to win the cascade)
   ============================================================================ */

/* 1. Global Reset for Menu in Contrast Modes */
html[data-contrast] #acc-menu, 
html[data-contrast] #acc-menu *,
html[data-contrast] #acc-widget-btn,
html[data-contrast] #acc-widget-btn *,
html[data-contrast] #acc-overlay {
  filter: none !important;
}

/* 2. Invert Mode Fix (Re-invert to render normally) */
html[data-contrast="invert"] #acc-menu,
html[data-contrast="invert"] #acc-widget-btn {
  filter: invert(100%) hue-rotate(180deg) !important;
}

/* Background overlay exclusion to prevent background neutralization */
html[data-contrast="invert"] #acc-overlay {
  filter: none !important;
}

/* 3. Dark/Light Contrast Force Default Colors */
html[data-contrast="dark"] #acc-menu,
html[data-contrast="light"] #acc-menu {
    background-color: #f3f6f9 !important; /* var(--acc-panel-bg) */
    color: #1a1a1a !important;
}

html[data-contrast="dark"] .acc-main-list-card,
html[data-contrast="light"] .acc-main-list-card,
html[data-contrast="dark"] .acc-score-card,
html[data-contrast="light"] .acc-score-card {
    background-color: #ffffff !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.02) !important;
}

html[data-contrast="dark"] #acc-menu h2,
html[data-contrast="light"] #acc-menu h2,
html[data-contrast="dark"] #acc-menu h3,
html[data-contrast="light"] #acc-menu h3,
html[data-contrast="dark"] #acc-menu span,
html[data-contrast="light"] #acc-menu span,
html[data-contrast="dark"] #acc-menu .acc-item-label,
html[data-contrast="light"] #acc-menu .acc-item-label {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
}

html[data-contrast="dark"] #acc-menu p,
html[data-contrast="light"] #acc-menu p {
    color: #6b7280 !important;
    -webkit-text-fill-color: #6b7280 !important;
}

html[data-contrast="dark"] #acc-menu i,
html[data-contrast="light"] #acc-menu i {
    color: #007bff !important;
}

html[data-contrast="dark"] #acc-close-btn,
html[data-contrast="light"] #acc-close-btn {
    background-color: #e5eef7 !important;
}

html[data-contrast="dark"] #acc-close-btn i,
html[data-contrast="light"] #acc-close-btn i {
    color: #444444 !important;
}

html[data-contrast="dark"] .acc-score-num,
html[data-contrast="light"] .acc-score-num {
    color: #2bc48a !important;
}

html[data-contrast="dark"] .acc-score-fill,
html[data-contrast="light"] .acc-score-fill {
    stroke: #2bc48a !important;
}

html[data-contrast="dark"] #acc-widget-btn,
html[data-contrast="light"] #acc-widget-btn {
    background-color: #007bff !important;
    color: #ffffff !important;
}

html[data-contrast="dark"] #acc-reset-btn,
html[data-contrast="light"] #acc-reset-btn {
    background-color: transparent !important;
    color: #ef4444 !important;
    border-color: #fee2e2 !important;
}