/* FileGrabber theme toggle styles */
:root { color-scheme: dark; --fg-bg: #0b1020; --fg-surface: #151d31; --fg-surface-hover: #1a2640; --fg-text: #f4f7ff; --fg-muted: #aab5cc; --fg-accent: #7079f0; --fg-accent-bright: #8b93ff; --fg-line: rgba(164,177,211,.16); }
:root[data-theme="light"] { color-scheme: light; --fg-bg: #f4f6fb; --fg-surface: #fff; --fg-surface-hover: #eef2ff; --fg-text: #172033; --fg-muted: #536078; --fg-accent: #5965d8; --fg-accent-bright: #5965d8; --fg-line: rgba(35,51,80,.15); }
html[data-theme="light"] { background: var(--fg-bg); }
html[data-theme="light"] body { background: radial-gradient(ellipse at 50% -15%, #fff 0, var(--fg-bg) 58%); color: var(--fg-text); }
html[data-theme="light"] .nav-bar, html[data-theme="light"] nav { background: rgba(255,255,255,.94); border-color: var(--fg-line); }
html[data-theme="light"] .nav-bar span { color: var(--fg-muted); }
html[data-theme="light"] .nav-bar span:hover { color: var(--fg-accent); }
html[data-theme="light"] .off-screen-menu { background: #fff; }
html[data-theme="light"] .off-screen-menu a, html[data-theme="light"] .off-screen-menu a:visited { color: #172033; }
html[data-theme="light"] .off-screen-menu a:hover { color: var(--fg-accent); }
html[data-theme="light"] .ham-menu span { background-color: #27334d; }
html[data-theme="light"] .ham-menu.active span { background-color: #fff; }
html[data-theme="light"] .cont-box-mobile { background: linear-gradient(155deg,#fff,#f1f4fb); box-shadow: 0 12px 28px rgba(35,51,80,.09); }
html[data-theme="light"] .cont-box-mobile:hover { border-color: rgba(89,101,216,.38); background: linear-gradient(155deg,#fff,#eef2ff); }
html[data-theme="light"] .cont-box-mobile-body h2 { color: #4854a8; border-color: rgba(89,101,216,.22); background: rgba(89,101,216,.08); }
html[data-theme="light"] .input { color: #172033; border-color: #cbd3e2; background: #fff; }
html[data-theme="light"] .input::placeholder { color: #68758c; }
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 8px 12px; border: 1px solid var(--fg-line); border-radius: 12px; background: var(--fg-surface); color: var(--fg-text); font: 600 14px/1 sans-serif; white-space: nowrap; cursor: pointer; transition: background .18s ease,border-color .18s ease,transform .18s ease; }
.theme-toggle:hover { transform: translateY(-1px); border-color: var(--fg-accent-bright); }
.theme-toggle:focus-visible { outline: 3px solid var(--fg-accent-bright); outline-offset: 3px; }
.nav-bar .theme-toggle { width: auto; margin: 0 0 0 12px; color: var(--fg-text); }
.nav-bar .theme-toggle span { width: auto; margin: 0; padding: 0; color: inherit; font-size: inherit; }
.mobile-theme-toggle { margin-left: auto; margin-right: 12px; }
@media (min-width: 651px) { body > nav:first-of-type { display: none; } }
@media (max-width: 650px) { .nav-bar .theme-toggle { display: none; } nav .theme-toggle { min-height: 40px; padding: 7px 10px; font-size: 13px; } }

.nav-bar-body { flex: 1 1 auto; width: auto; min-width: 0; justify-content: center; gap: clamp(12px, 2vw, 24px); }
.nav-bar span { width: auto; margin: 0; padding: 10px 2px; white-space: nowrap; }


/* Mobile theme control and consistent card action alignment */
.theme-menu-item { display: none; }
@media (max-width: 650px) {
  .theme-menu-item { display: block; width: min(100%, 280px); margin-top: 10px; }
  .off-screen-menu ul { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 100%; padding: 0; margin: 0; }
  .off-screen-menu .mobile-menu-theme-toggle { display: inline-flex; width: 100%; min-height: 48px; margin: 4px 0 0; font-size: 15px; }
}
.bt-bar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 10px; width: 100%; }
.contactButton { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-width: 0; min-height: 44px; height: auto; margin: 0; padding: 8px 10px; }
.contactButton lable { display: block; flex: 1 1 auto; min-width: 0; width: auto; text-align: left; white-space: nowrap; }
.iconButton { position: static; inset: auto; display: inline-flex; flex: 0 0 25px; align-items: center; justify-content: center; width: 25px; height: 25px; margin: 0; padding: 0; line-height: 1; }
.iconButton svg, .contactButton svg { display: block; }
@media (max-width: 380px) {
  .bt-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); flex-direction: initial; gap: 8px; }
  .contactButton { width: 100%; min-width: 0; padding: 7px 8px; font-size: 12px; }
  .iconButton { flex-basis: 22px; width: 22px; height: 22px; }
}


/* Shared responsive interface rules, served from the confirmed live stylesheet */
/* FileGrabber interface refresh: presentation only */
:root {
  color-scheme: dark;
  --fg-bg: #0b1020;
  --fg-surface: #151d31;
  --fg-surface-hover: #1a2640;
  --fg-text: #f4f7ff;
  --fg-muted: #aab5cc;
  --fg-accent: #7079f0;
  --fg-accent-bright: #8b93ff;
  --fg-line: rgba(164, 177, 211, .16);
}

html { background: var(--fg-bg); }
body { min-height: 100vh; background: radial-gradient(ellipse at 50% -15%, #1e2d50 0, var(--fg-bg) 48%); color: var(--fg-text); }

.nav-bar { position: sticky; top: 0; z-index: 20; width: min(1160px, calc(100% - 40px)); min-height: 82px; align-items: center; padding: 8px 20px; border-bottom: 1px solid var(--fg-line); background: rgba(11, 16, 32, .88); backdrop-filter: blur(14px); }
.logo { flex: 0 0 64px; }
.nav-bar-body { width: auto; flex: 1; justify-content: center; gap: clamp(12px, 3vw, 42px); }
.nav-bar span { width: auto; margin: 0; padding: 10px 2px; color: var(--fg-muted); font-size: 16px; font-weight: 600; transition: color .18s ease; }
.nav-bar span:hover { color: white; }
.info { flex: 0 0 24px; }

section { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr)); gap: 18px; align-items: stretch; width: min(1160px, calc(100% - 40px)); margin: 26px auto 72px; }
.search_bar { grid-column: 1 / -1; width: min(620px, 100%); height: auto; padding: 0; margin: 0 auto 8px; }
.input { min-width: 0; min-height: 52px; width: 100%; border-color: var(--fg-line); background: #111a2c; }
.input::placeholder { color: #9ba8c1; opacity: 1; }
.input:focus, .input:focus-visible { border-color: var(--fg-accent-bright); box-shadow: 0 0 0 3px rgba(112, 121, 240, .2); }
.contactButton_search { min-height: 52px; padding-inline: 22px; font-weight: 700; background: var(--fg-accent); transition: background .18s ease, transform .18s ease; }
.contactButton_search:hover { background: #5e68d9; }

.cont-box-mobile { display: flex; width: 100%; min-width: 0; height: auto; min-height: 190px; margin: 0; padding: 22px; border: 1px solid var(--fg-line); border-radius: 18px; background: linear-gradient(155deg, rgba(25, 36, 60, .98), rgba(18, 26, 44, .98)); box-shadow: 0 12px 28px rgba(0, 0, 0, .16); transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.cont-box-mobile:hover { transform: translateY(-3px); border-color: rgba(139, 147, 255, .48); background: linear-gradient(155deg, var(--fg-surface-hover), var(--fg-surface)); }
.cont-box-mobile-body { display: flex; flex-direction: column; width: 100%; }
.cont-box-mobile-body h2 { width: fit-content; margin: 0 auto 10px; padding: 5px 11px; border: 1px solid rgba(139, 147, 255, .28); border-radius: 999px; background: rgba(112, 121, 240, .12); color: #cdd1ff; font-size: 14px; letter-spacing: .045em; }
.cont-box-mobile-body h4 { margin: 0 auto 22px; color: var(--fg-text); font-size: 17px; line-height: 1.45; font-weight: 650; text-wrap: balance; }
.bt-bar { display: flex; gap: 10px; width: 100%; margin: auto 0 0; padding: 0; }
.contactButton { display: flex; flex: 1 1 0; justify-content: space-between; gap: 10px; width: auto; min-width: 0; height: 44px; margin: 0; padding: 8px 12px; border: 1px solid rgba(139, 147, 255, .2); border-radius: 11px; background: var(--fg-accent); box-shadow: none; color: white; font-size: 13px; letter-spacing: 0; transition: background .18s ease, transform .18s ease; }
.contactButton:hover { transform: translateY(-1px); background: #5e68d9; }
.contactButton lable { width: auto; font-weight: 700; }
.iconButton { display: flex; flex: 0 0 25px; align-items: center; justify-content: center; width: 25px; height: 25px; margin-left: 0; border-radius: 7px; background: rgba(255,255,255,.12); box-shadow: none; }

.off-screen-menu { z-index: 30; background: #111a2c; }
a:focus-visible, button:focus-visible, .ham-menu:focus-visible { outline: 3px solid var(--fg-accent-bright); outline-offset: 3px; }

@media (max-width: 1000px) {
  section { width: min(920px, calc(100% - 32px)); gap: 16px; margin-top: 22px; }
  .nav-bar { width: min(920px, calc(100% - 32px)); }
}

@media (max-width: 650px) {
  html, body { max-width: none; }
  nav { max-width: none; width: 100%; align-items: center; padding: 12px 18px; background: rgba(11, 16, 32, .94); border-bottom: 1px solid var(--fg-line); }
  .ham-menu-logo { width: 48px; height: 48px; object-fit: contain; }
  .ham-menu { width: 42px; height: 42px; }
  .ham-menu span { height: 3px; }
  .off-screen-menu { max-width: none; padding: 80px 24px 32px; font-size: clamp(1.4rem, 7vw, 2rem); }
  .off-screen-menu a { margin-bottom: 22px; }
  section { grid-template-columns: 1fr; width: calc(100% - 32px); gap: 14px; margin: 22px auto 48px; }
  .search_bar { width: 100%; margin-bottom: 8px; }
  .cont-box-mobile { min-height: 166px; padding: 20px; }
  .cont-box-mobile h4 { margin-bottom: 18px; }
  .bt-bar { gap: 9px; }
  .contactButton { margin: 0; width: auto; padding: 8px 10px; }
}

@media (max-width: 360px) {
  section { width: calc(100% - 24px); }
  .cont-box-mobile { padding: 16px; }
  .bt-bar { flex-direction: column; }
  .contactButton { width: 100%; flex-basis: 42px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}


/* Responsive refinements for courses, plans and doctors */
@media (max-width: 900px) {
  section { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cont-box-mobile { min-width: 0; }
}
@media (max-width: 650px) {
  body { overflow-x: hidden; }
  section { grid-template-columns: minmax(0, 1fr); }
  .cont-box-mobile { width: 100%; min-height: 0; padding: 20px; }
  .cont-box-mobile h4 { overflow-wrap: anywhere; line-height: 1.45; }
  .bt-bar { display: flex; width: 100%; gap: 10px; }
  .contactButton { min-height: 44px; }
  .search_bar { box-sizing: border-box; min-height: 46px; }
}
@media (max-width: 380px) {
  .bt-bar { flex-direction: column; }
  .contactButton { width: 100%; }
}


/* Keep the close control above the open mobile navigation panel */
@media (max-width: 650px) {
  .ham-menu { position: relative; z-index: 40; isolation: isolate; border-radius: 12px; background: rgba(11, 16, 32, .9); }
  .ham-menu.active span { background-color: #ffffff; }
  .ham-menu:focus-visible { outline: 3px solid #a5b4fc; outline-offset: 3px; }
}


/* Mobile theme control and consistent card action alignment */
.theme-menu-item { display: none; }
@media (max-width: 650px) {
  .theme-menu-item { display: block; width: min(100%, 280px); margin-top: 10px; }
  .off-screen-menu ul { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 100%; padding: 0; margin: 0; }
  .off-screen-menu .mobile-menu-theme-toggle { display: inline-flex; width: 100%; min-height: 48px; margin: 4px 0 0; font-size: 15px; }
}
.bt-bar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 10px; width: 100%; }
.contactButton { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-width: 0; min-height: 44px; height: auto; margin: 0; padding: 8px 10px; }
.contactButton lable { display: block; flex: 1 1 auto; min-width: 0; width: auto; text-align: left; white-space: nowrap; }
.iconButton { position: static; inset: auto; display: inline-flex; flex: 0 0 25px; align-items: center; justify-content: center; width: 25px; height: 25px; margin: 0; padding: 0; line-height: 1; }
.iconButton svg, .contactButton svg { display: block; }
@media (max-width: 380px) {
  .bt-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); flex-direction: initial; gap: 8px; }
  .contactButton { width: 100%; min-width: 0; padding: 7px 8px; font-size: 12px; }
  .iconButton { flex-basis: 22px; width: 22px; height: 22px; }
}


/* Doctors page only: center names, office labels, and message actions */
section.doctors-page .cont-box-mobile-body h2,
section.doctors-page .cont-box-mobile-body h4 { text-align: center; }
section.doctors-page .bt-bar-messaging { display: flex; align-items: center; justify-content: center; width: 100%; margin: 16px auto 0; padding: 0; }
section.doctors-page .bt-bar-messaging > a { display: inline-flex; align-items: center; justify-content: center; width: auto; margin: 0; }
section.doctors-page .contactButton-messaging { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 140px; min-height: 44px; height: 44px; margin: 0; padding: 8px 12px; }
section.doctors-page .contactButton-messaging lable { flex: 1 1 auto; min-width: 0; width: auto; text-align: left; }
section.doctors-page .iconButton-messaging { position: static; inset: auto; display: inline-flex; flex: 0 0 24px; align-items: center; justify-content: center; width: 24px; height: 24px; margin: 0; padding: 0; }
section.doctors-page .iconButton-messaging svg { display: block; }


/* Match every action arrow to the Doctors messaging arrow */
.iconButton,
.iconButton-messaging {
  position: static;
  inset: auto;
  display: inline-flex;
  flex: 0 0 24px;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
  border-radius: .7em;
  background: transparent;
  box-shadow: .1em .1em .6em .2em #7a8cf3;
}
.iconButton svg,
.iconButton-messaging svg { display: block; width: 24px; height: 24px; }
