/* WholeMedicare UI refresh — CSS compatibility and layout fixes */
:root {
  --wm-cyan: #24c0d6;
  --wm-cyan-dark: #079bb4;
  --wm-navy: #0b3355;
  --wm-ink: #16334a;
  --wm-muted: #64788a;
  --wm-soft: #f2fbfd;
  --wm-border: #dcebf0;
  --wm-radius: 22px;
  --wm-shadow: 0 18px 50px rgba(11,51,85,.09);
}
html { scroll-behavior: smooth; }
body { color: var(--wm-ink); }
a { text-underline-offset: 3px; }
:focus-visible { outline: 3px solid var(--wm-cyan); outline-offset: 3px; }

/* Header: avoid relying on newer color-mix() support */
.navbar.navbar-sticky,
.navbar.navbar-sticky.is-sticky {
  background: rgba(255,255,255,.97) !important;
  border-bottom: 1px solid var(--wm-border);
  box-shadow: 0 5px 24px rgba(11,51,85,.06);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.navbar-brand { display: inline-flex; align-items: center; width: 205px !important; height: auto !important; max-width: 42vw; }
.navbar-brand img { display:block; width:100%; max-width:100%; height:auto; max-height:65px; object-fit:contain; }
.navbar .nav-link { font-weight:600; color:var(--wm-navy); padding-inline:.65rem !important; }
.navbar .nav-link:hover, .navbar .nav-link:focus { color:var(--wm-cyan-dark); }
.navbar .dropdown-menu { border:1px solid var(--wm-border); border-radius:14px; box-shadow:var(--wm-shadow); padding:.55rem; }
.navbar .dropdown-item { border-radius:8px; white-space:normal; }
.navbar .dropdown-item:hover, .navbar .dropdown-item:focus { background:#eafafd; color:var(--wm-navy); }

/* Brand controls and buttons */
.btn-primary, .btn-info {
  --bs-btn-bg: var(--wm-cyan);
  --bs-btn-border-color: var(--wm-cyan);
  --bs-btn-hover-bg: var(--wm-cyan-dark);
  --bs-btn-hover-border-color: var(--wm-cyan-dark);
  --bs-btn-color: #062d48;
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: var(--wm-navy);
  --bs-btn-active-border-color: var(--wm-navy);
}
.btn-dark { background:var(--wm-navy); border-color:var(--wm-navy); }
.btn-dark:hover, .btn-dark:focus { background:#06233b; border-color:#06233b; }
.btn-success { background:var(--wm-cyan); border-color:var(--wm-cyan); color:var(--wm-navy); }
.btn-success:hover { background:var(--wm-cyan-dark); border-color:var(--wm-cyan-dark); color:#fff; }
.bg-info { background-color:var(--wm-navy) !important; }
.text-primary, .text-info { color:var(--wm-cyan-dark) !important; }
.language-btn { border:1px solid var(--wm-border); border-radius:999px; color:var(--wm-navy); font-weight:700; min-width:38px; min-height:36px; }
#wmThemeToggle { display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; }

/* General spacing and typography */
.card { border-color:var(--wm-border); border-radius:var(--wm-radius); }
.card img { border-radius:14px; }
.content-wrapper { overflow-x:clip; }
section { scroll-margin-top:100px; }
h1, h2, h3, h4 { color:var(--wm-navy); letter-spacing:-.025em; }
p { line-height:1.72; }
img, video { max-width:100%; }
.services-section { background:linear-gradient(180deg,#f6fcfd 0%,#fff 100%); }
.service-subtitle { color:var(--wm-cyan-dark) !important; letter-spacing:.14em; }
.service-title { color:var(--wm-navy) !important; font-size:clamp(2rem,3.4vw,3.2rem) !important; }
.service-title span { background:linear-gradient(90deg,var(--wm-cyan),var(--wm-navy)) !important; }
.service-card { border:1px solid var(--wm-border); border-radius:18px; padding:28px 20px !important; box-shadow:0 8px 28px rgba(11,51,85,.05); }
.service-card:hover { border-color:var(--wm-cyan); }
.service-card h4 { color:var(--wm-navy); font-size:1rem !important; font-weight:700 !important; }
.service-card p { line-height:1.6 !important; font-size:.88rem !important; }
.line { background:var(--wm-cyan) !important; }

/* Video hero */
.wm-hero { position:relative; isolation:isolate; min-height:650px; display:flex; align-items:center; color:#fff; background:var(--wm-navy); overflow:hidden; border-radius:0 0 34px 34px; }
.wm-hero video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.wm-hero:before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(5,31,52,.9) 0%,rgba(5,31,52,.68) 52%,rgba(5,31,52,.32) 100%); pointer-events:none; }
.wm-hero .wm-hero-inner { position:relative; z-index:1; width:100%; padding-top:105px; padding-bottom:88px; }
.wm-eyebrow { display:inline-flex; align-items:center; gap:9px; color:#b9f4fb; font-weight:800; letter-spacing:.13em; text-transform:uppercase; font-size:.76rem; }
.wm-eyebrow:before { content:""; width:28px; height:2px; background:var(--wm-cyan); }
.wm-hero h1 { color:#fff !important; font-size:clamp(2.6rem,5.2vw,5rem); line-height:1.04; max-width:800px; font-weight:800; }
.wm-hero p { color:rgba(255,255,255,.9); max-width:650px; font-size:clamp(1rem,1.4vw,1.2rem); }
.wm-hero .btn { border-radius:999px; padding:.9rem 1.45rem; font-weight:750; }
.wm-hero .btn-outline-light { color:#fff; border-color:rgba(255,255,255,.75); }
.wm-hero .btn-outline-light:hover { color:var(--wm-navy); background:#fff; }

/* Reusable sections and cards */
.wm-trust-strip { margin-top:-35px; position:relative; z-index:2; }
.wm-trust-card { display:flex; align-items:flex-start; gap:14px; background:var(--bs-body-bg,#fff); border:1px solid var(--wm-border); border-radius:18px; box-shadow:var(--wm-shadow); padding:22px; height:100%; }
.wm-trust-icon { flex:0 0 46px; width:46px; height:46px; display:grid; place-items:center; border-radius:14px; background:#e2f9fc; color:var(--wm-cyan-dark); font-size:1.15rem; }
.wm-trust-text { min-width:0; }
.wm-trust-text strong { display:block; color:var(--wm-navy); font-size:1.05rem; line-height:1.3; margin:2px 0 4px; }
.wm-trust-text span { display:block; color:var(--wm-muted); font-size:.9rem; line-height:1.55; }
/* One standard vertical rhythm for all homepage sections */
:root { --wm-section-space:72px; }
.wm-section { padding-top:var(--wm-section-space) !important; padding-bottom:var(--wm-section-space) !important; }
.wm-section.wm-section-flush { padding-top:0 !important; }
.wm-section-soft { background:var(--wm-soft); }
.wm-section-heading { max-width:760px; margin:0 auto 38px; text-align:center; }
.wm-section-heading .eyebrow { color:var(--wm-cyan-dark); text-transform:uppercase; letter-spacing:.15em; font-size:.76rem; font-weight:800; }
.wm-section-heading h2 { font-size:clamp(2rem,3.5vw,3.1rem); font-weight:800; margin:.6rem 0 1rem; }
.wm-section-heading p { color:var(--wm-muted); margin:0; }
.wm-treatment-card { display:flex; align-items:center; gap:15px; min-width:0; height:100%; padding:20px; border:1px solid var(--wm-border); border-radius:18px; background:var(--bs-body-bg,#fff); color:var(--wm-navy); text-decoration:none; box-shadow:0 6px 22px rgba(11,51,85,.035); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.wm-treatment-card:hover { transform:translateY(-4px); border-color:var(--wm-cyan); box-shadow:var(--wm-shadow); color:var(--wm-navy); }
.wm-treatment-card img { width:54px; height:54px; object-fit:contain; flex:0 0 54px; }
.wm-treatment-card strong { font-size:.98rem; }
.wm-treatment-card small { display:block; color:var(--wm-muted); margin-top:4px; }
.wm-step { padding:26px; border:1px solid var(--wm-border); border-radius:20px; background:var(--bs-body-bg,#fff); height:100%; }
.wm-step-number { width:44px; height:44px; border-radius:14px; display:grid; place-items:center; background:#dcf8fc; color:var(--wm-navy); font-weight:850; margin-bottom:18px; }
.wm-step h3 { font-size:1.12rem; font-weight:750; }
.wm-step p { color:var(--wm-muted); font-size:.94rem; margin-bottom:0; }
.wm-support-panel { background:linear-gradient(135deg,var(--wm-navy),#125477); color:#fff; border-radius:28px; padding:clamp(28px,5vw,60px); overflow:hidden; position:relative; }
.wm-support-panel h2 { color:#fff; font-size:clamp(2rem,3.5vw,3rem); font-weight:800; }
.wm-support-panel p, .wm-support-panel li { color:rgba(255,255,255,.86); }
.wm-support-panel li { margin-bottom:12px; }
.wm-support-panel li::marker { color:var(--wm-cyan); }
.wm-cta-panel { border-radius:28px; background:linear-gradient(120deg,#e9fbfd,#f8fdfe); border:1px solid #cceff4; padding:clamp(24px,4vw,48px); }
.wm-cta-panel h2 { font-weight:800; }
.wm-cta-panel .btn { border-radius:999px; }

/* Footer and floating contact */
.footer { background:var(--wm-navy) !important; color:#eaf7fb !important; }
.footer h6, .footer .accordion-button { color:#fff !important; }
.footer .nav-link, .footer a { color:#c6e5ed !important; }
.footer .nav-link:hover, .footer a:hover { color:var(--wm-cyan) !important; }
.footer .accordion-item, .footer .accordion-button { background:transparent !important; }
.footer .accordion-button::after { filter:brightness(0) invert(1); }
.footer .text-body, .footer .text-dark-emphasis, .footer .text-body-secondary { color:#c6e5ed !important; }
.social-float { right:22px; left:auto !important; bottom:22px; z-index:1030; }
.social-btn { box-shadow:0 8px 22px rgba(11,51,85,.22); transition:transform .2s ease; }
.social-btn:hover { transform:translateY(-3px) scale(1.04); }

/* Dark mode: explicit colors to avoid Bootstrap theme-variable contrast bugs */
html[data-bs-theme="dark"] body { background:#081b2a; color:#e7f4f8; }
html[data-bs-theme="dark"] .navbar.navbar-sticky,
html[data-bs-theme="dark"] .navbar.navbar-sticky.is-sticky { background:rgba(8,27,42,.97) !important; border-color:#24485d; }
html[data-bs-theme="dark"] .navbar .nav-link { color:#e7f4f8; }
html[data-bs-theme="dark"] .navbar .nav-link:hover { color:var(--wm-cyan); }
html[data-bs-theme="dark"] h1, html[data-bs-theme="dark"] h2,
html[data-bs-theme="dark"] h3, html[data-bs-theme="dark"] h4 { color:#effbff; }
html[data-bs-theme="dark"] .wm-section-soft { background:#0b2233; }
html[data-bs-theme="dark"] .wm-treatment-card,
html[data-bs-theme="dark"] .wm-trust-card,
html[data-bs-theme="dark"] .wm-step { background:#102c40; border-color:#24485d; }
html[data-bs-theme="dark"] .wm-treatment-card strong,
html[data-bs-theme="dark"] .wm-trust-card strong,
html[data-bs-theme="dark"] .wm-step h3 { color:#effbff; }
html[data-bs-theme="dark"] .wm-trust-icon { background:#173d52; color:#b9f4fb; }
html[data-bs-theme="dark"] .wm-cta-panel { background:#102c40; border-color:#24485d; }
html[data-bs-theme="dark"] .wm-cta-panel h3 { color:#effbff; }
html[data-bs-theme="dark"] .text-body-secondary { color:#b5cbd7 !important; }
html[data-bs-theme="dark"] .language-btn { color:#e7f4f8; border-color:#34566b; }

/* Responsive layout */
@media (max-width: 991.98px) {
  .navbar-brand { width:175px !important; }
  .navbar .nav-link { padding-inline:.4rem !important; }
}
@media (max-width: 767.98px) {
  .navbar-brand { width:160px !important; max-width:50vw; }
  .wm-hero { min-height:610px; border-radius:0 0 24px 24px; }
  .wm-hero .wm-hero-inner { padding-top:85px; padding-bottom:70px; }
  .wm-hero:before { background:linear-gradient(90deg,rgba(5,31,52,.9),rgba(5,31,52,.7)); }
  :root { --wm-section-space:48px; }
  .wm-trust-strip { margin-top:-22px; }
  .wm-treatment-card { padding:16px; }
  .social-float { right:14px; bottom:14px; }
  .social-btn { width:50px; height:50px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}


/* Homepage hospital and empanelled-doctor carousels */
.wm-directory-carousel { position:relative; }
.wm-directory-card {
  background:var(--bs-body-bg,#fff); border:1px solid var(--wm-border); border-radius:20px;
  padding:28px 24px; box-shadow:0 8px 28px rgba(11,51,85,.055);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.wm-directory-card:hover { transform:translateY(-4px); border-color:var(--wm-cyan); box-shadow:var(--wm-shadow); }
.wm-directory-icon {
  display:grid; place-items:center; width:54px; height:54px; border-radius:16px;
  background:#e2f9fc; color:var(--wm-navy); font-size:1.35rem; margin-bottom:18px;
}
.wm-directory-card h3 { color:var(--wm-navy); font-size:1.15rem; font-weight:800; margin-bottom:10px; }
.wm-directory-card p { color:var(--wm-muted); font-size:.94rem; line-height:1.65; }
.wm-directory-link { color:var(--wm-cyan-dark); font-weight:750; text-decoration:none; }
.wm-directory-link:hover { color:var(--wm-navy); }
.wm-directory-carousel .carousel-item { padding:3px 2px 8px; }
.wm-directory-carousel .btn-outline-secondary { width:40px; height:40px; border-color:var(--wm-border); color:var(--wm-navy); }
.wm-directory-carousel .btn-outline-secondary:hover { background:var(--wm-cyan); border-color:var(--wm-cyan); }
html[data-bs-theme="dark"] .wm-directory-card { background:#102c40; border-color:#24485d; }
html[data-bs-theme="dark"] .wm-directory-card h3 { color:#effbff; }
html[data-bs-theme="dark"] .wm-directory-icon { background:#173d52; color:#b9f4fb; }
@media(max-width:767.98px) { .wm-directory-card { padding:22px 20px; } }


/* ---------- Mobile navigation (offcanvas) ---------- */
@media (max-width: 991.98px) {
  /* backdrop-filter creates a containing block that traps the fixed offcanvas inside the header */
  .navbar.navbar-sticky,
  .navbar.navbar-sticky.is-sticky { -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
  /* keep the open menu above the page backdrop and floating buttons */
  .navbar.navbar-sticky:has(.offcanvas.show),
  .navbar.navbar-sticky:has(.offcanvas.showing) { z-index:1050 !important; }
  .navbar .navbar-toggler { padding:.4rem; border:0; box-shadow:none; }
  .navbar .offcanvas { width:min(320px,86vw); background:var(--bs-body-bg,#fff); }
  .navbar .offcanvas-header { border-bottom:1px solid var(--wm-border); padding:1rem 1.25rem; }
  .navbar .offcanvas-title { color:var(--wm-navy); font-weight:800; }
  .navbar .offcanvas-body { padding:1rem 1.25rem 1.5rem; }
  .navbar .offcanvas .navbar-nav { gap:4px; width:100%; }
  .navbar .offcanvas .nav-item { padding:0 !important; margin:0 !important; }
  .navbar .offcanvas .nav-link { display:block; padding:.8rem .9rem !important; border-radius:10px; font-size:1rem; color:var(--wm-navy); }
  .navbar .offcanvas .nav-link:hover,
  .navbar .offcanvas .nav-link:focus { background:#eafafd; color:var(--wm-cyan-dark); }
  html[data-bs-theme="dark"] .navbar .offcanvas { background:#081b2a; }
  html[data-bs-theme="dark"] .navbar .offcanvas .nav-link { color:#e7f4f8; }
  html[data-bs-theme="dark"] .navbar .offcanvas .nav-link:hover { background:#102c40; }
}
@media (max-width: 575.98px) {
  .navbar .container { flex-wrap:nowrap; gap:8px; }
  .navbar .navbar-toggler { margin-right:0 !important; }
  .navbar-brand { width:140px !important; max-width:40vw; margin-right:auto; }
  .navbar .language-btn { height:36px; padding:0 10px; }
}

/* ---------- Trust strip ---------- */
@media (max-width: 767.98px) {
  .wm-trust-strip .row { --bs-gutter-y:.75rem; }
  .wm-trust-card { padding:16px; gap:12px; }
  .wm-trust-icon { flex-basis:40px; width:40px; height:40px; font-size:1rem; border-radius:12px; }
  .wm-trust-text strong { font-size:1rem; }
  .wm-trust-text span { font-size:.86rem; }
}

/* ---------- Treatments carousel ---------- */
.wm-best-treatments .wm-treatment-swiper { padding:4px 2px 0 !important; }
@media (max-width: 559.98px) {
  .wm-best-treatments .wm-treatment-swiper .card > .p-4 { padding:14px !important; }
  .wm-best-treatments .wm-treatment-swiper .card .gap-3 { gap:10px !important; }
  .wm-best-treatments .wm-treatment-swiper .card .ratio { width:38px !important; height:38px !important; padding:6px !important; }
  .wm-best-treatments .wm-treatment-swiper .card h3 { font-size:.88rem; line-height:1.3; }
  .wm-best-treatments .wm-treatment-swiper .card p { font-size:.8rem; line-height:1.5; margin-bottom:0 !important; }
  .wm-best-treatments .wm-treatment-swiper .card > .p-3 { flex-direction:column; align-items:stretch !important; padding:10px !important; gap:6px !important; }
  .wm-best-treatments .wm-treatment-swiper .card > .p-3 .btn { font-size:.75rem; padding:.35rem .5rem !important; }
}

/* ---------- Hospital carousel: two cards per view on phones ---------- */
@media (max-width: 575.98px) {
  #wmHospitalTrack { gap:12px !important; }
  #wmHospitalTrack .wm-dynamic-card.wm-hospital-card { flex:0 0 calc((100% - 12px) / 2) !important; min-width:0 !important; }
  #wmHospitalTrack .wm-hospital-card .wm-dynamic-image-link { height:120px; }
  #wmHospitalTrack .wm-hospital-card .badge { font-size:.65rem; }
  #wmHospitalTrack .wm-hospital-card .position-absolute.m-3 { margin:8px !important; }
  #wmHospitalTrack .wm-hospital-card .wm-dynamic-card-body { padding:12px !important; }
  #wmHospitalTrack .wm-hospital-card h3 { font-size:.92rem; line-height:1.3; }
  #wmHospitalTrack .wm-hospital-card .wm-dynamic-card-kicker { font-size:.66rem; }
  #wmHospitalTrack .wm-hospital-card .wm-dynamic-location { font-size:.78rem; margin-bottom:10px !important; }
  #wmHospitalTrack .wm-hospital-card .border-top { flex-direction:column; align-items:stretch !important; gap:6px !important; padding-top:10px !important; }
  #wmHospitalTrack .wm-hospital-card .border-top .btn { font-size:.75rem; padding:.35rem .4rem; white-space:nowrap; }
}

/* hide floating chat buttons while the mobile menu is open */
body:has(.offcanvas.show) .social-float { display:none; }
