/* Shared Healthcare Screening application foundation. */
body.healthcare-app {
  --app-sidebar: 232px;
  --app-content: 1440px;
  --app-space: 24px;
  --app-gap: 20px;
  --app-radius: 14px;
  --app-canvas: #f5f8fd;
  --app-surface: #ffffff;
  --app-ink: #102449;
  --app-subtle: #586c89;
  --app-border: #dce6f3;
  --app-rail: #0a2344;
  --blue: #075eff;
  --navy: var(--app-ink);
  --muted: var(--app-subtle);
  --line: var(--app-border);
  background: var(--app-canvas);
  color: var(--app-ink);
  font-size: 14px;
  line-height: 1.5;
}
.healthcare-app .sidebar {
  width: var(--app-sidebar);
  padding: 28px 16px 18px;
  background: var(--app-rail);
  border-right: 1px solid #163858;
  color: #f5f8ff;
  overflow-y: auto;
}
.healthcare-app .logo { margin: 0 8px 22px; gap: 9px; color: #fff; }
.healthcare-app .logo > span { font-size: 28px; }
.healthcare-app .logo b { color: #fff; }
.healthcare-app .logo img { width: 31px; height: 34px; }
.healthcare-app .product { margin: 0 8px 16px; color: #b9cce7; font-size: 10px; letter-spacing: .12em; }
.healthcare-app .workspace { margin: 0 0 24px; padding: 12px; border: 1px solid #34506f; border-radius: 12px; background: #ffffff06; }
.healthcare-app .workspace strong { color: #fff; font-size: 12px; }
.healthcare-app .workspace small { color: #b9cce7; }
.healthcare-app .workspace #building { display: flex; color: #b9cce7; }
.healthcare-app .sidebar nav { gap: 6px; }
.healthcare-app .sidebar .nav-item { min-height: 46px; padding: 11px 13px; border-radius: 10px; color: #d9e6f7; font-size: 13px; font-weight: 550; gap: 12px; }
.healthcare-app .sidebar .nav-item:hover { background: #ffffff0e; color: #fff; }
.healthcare-app .sidebar .nav-item.active { background: var(--blue); color: #fff; }
.healthcare-app .sidebar .badge { min-width: 21px; height: 21px; font-size: 10px; }
.healthcare-app .side-bottom { padding-top: 24px; }
.healthcare-app .app { margin-left: var(--app-sidebar); min-height: 100dvh; min-width: 0; }
.healthcare-app .topbar { min-height: 72px; height: auto; padding: 16px 32px; background: var(--app-surface); border-bottom: 1px solid var(--app-border); }
.healthcare-app .breadcrumb { font-size: 12px; color: var(--app-subtle); }
.healthcare-app .breadcrumb strong { color: var(--app-ink); font-weight: 650; }
.healthcare-app .top-right { gap: 14px; }
.healthcare-app .topbar .demo-label { border-color: #d0def2; background: #f5f9ff; font-size: 11px; padding: 6px 11px; }
.healthcare-app .avatar { width: 34px; height: 34px; color: #244f96; background: #e8f0ff; }
.healthcare-app main { width: 100%; max-width: var(--app-content); margin: 0 auto; padding: 32px 32px 24px; }
.healthcare-app .page-heading { margin-bottom: var(--app-space); align-items: center; gap: 20px; }
.healthcare-app main h1 { color: var(--app-ink); font-size: clamp(26px, 2.2vw, 32px); line-height: 1.2; letter-spacing: -.035em; }
.healthcare-app .page-heading p { margin-top: 8px; font-size: 13px; line-height: 1.6; }
.healthcare-app main h2 { font-size: 18px; line-height: 1.35; letter-spacing: -.02em; }
.healthcare-app main h3 { font-size: 14px; line-height: 1.4; }
.healthcare-app .actions { gap: 9px; flex-wrap: wrap; }
.healthcare-app .btn { min-height: 40px; padding: 10px 14px; border-radius: 9px; font-size: 12px; line-height: 1.4; font-weight: 600; }
.healthcare-app .btn:not(.primary):not(.green):not(.red) { border-color: #cbd9ec; background: #fff; color: #24446f; }
.healthcare-app .btn.primary { background: var(--blue); border-color: var(--blue); color: #fff; }
.healthcare-app .chat-form .btn { padding: 0; min-height: 40px; line-height: 1; }
.healthcare-app .chat-provider-context .btn { font-size: 11px; }
.healthcare-app .text-btn { font-weight: 550; }
.healthcare-app .panel { background: var(--app-surface); border-color: var(--app-border); border-radius: var(--app-radius); padding: var(--app-space); box-shadow: 0 3px 12px #10244903; }
.healthcare-app .panel-top { margin-bottom: 18px; gap: 14px; }
.healthcare-app .grid { gap: var(--app-gap); }
.healthcare-app .stats { gap: 16px; margin-bottom: var(--app-gap); }
.healthcare-app .stat { border-color: var(--app-border); border-radius: var(--app-radius); padding: 20px 18px; }
.healthcare-app .stat strong { font-size: 30px; }
.healthcare-app .search,
.healthcare-app .notification-field,
.healthcare-app .review-note,
.healthcare-app .provider-edit-form input,
.healthcare-app .feedback-form input,
.healthcare-app .feedback-form textarea { border-color: #cbd9ec; border-radius: 9px; color: var(--app-ink); }
.healthcare-app .search { min-height: 40px; }
.healthcare-app #view th { background: #f3f7fd; color: #425b7c; font-size: 10px; }
.healthcare-app #view td, .healthcare-app #view th { border-bottom-color: #e7edf6; }
.healthcare-app #view .event { border-color: var(--app-border); border-radius: 12px; padding: 18px; }
.healthcare-app .page-list { gap: 14px; }
.healthcare-app .settings-row { padding: 22px 0; }
.healthcare-app .activity { margin-top: var(--app-gap); }
.healthcare-app .enrichment-card { border-color: var(--app-border); border-radius: 12px; }
.healthcare-app .footnote { margin-top: 20px; line-height: 1.6; }
.healthcare-app dialog:not(.chat-dialog) { border-color: var(--app-border); border-radius: 18px; padding: 28px; }
.healthcare-app .skip { z-index: 50; border-radius: 8px; }
@media (max-width: 1150px) {
  body.healthcare-app { --app-sidebar: 212px; --app-space: 20px; --app-gap: 16px; }
  .healthcare-app .sidebar { padding-inline: 12px; }
  .healthcare-app .logo > span { font-size: 25px; }
  .healthcare-app .logo img { width: 28px; height: 31px; }
  .healthcare-app main { padding: 26px 24px 20px; }
  .healthcare-app .topbar { padding-inline: 24px; }
  .healthcare-app .stat { padding: 17px 14px; }
}
@media (max-width: 900px) {
  .healthcare-app .page-heading { align-items: flex-start; }
  .healthcare-app .grid { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
  body.healthcare-app { --app-space: 16px; --app-gap: 16px; }
  .healthcare-app .sidebar { width: 232px; padding: 24px 16px 18px; }
  .healthcare-app .app { margin-left: 0; }
  .healthcare-app .topbar { min-height: 64px; padding: 12px; gap: 8px; }
  .healthcare-app .breadcrumb { font-size: 10px; }
  .healthcare-app .topbar .demo-label { font-size: 9px; padding: 5px 8px; }
  .healthcare-app .top-right { gap: 6px; }
  .healthcare-app main { padding: 24px 16px 18px; }
  .healthcare-app .page-heading { gap: 16px; }
  .healthcare-app .page-heading p { font-size: 12px; }
  .healthcare-app .page-heading > .actions { width: 100%; }
  .healthcare-app .stats { gap: 10px; }
  .healthcare-app .stat { padding: 14px 11px; }
  .healthcare-app .stat strong { font-size: 26px; }
  .healthcare-app .panel-top { margin-bottom: 16px; }
  .healthcare-app dialog:not(.chat-dialog) { padding: 22px; }
}

/* Desktop help belongs to the navigation rail; retain the mobile launcher. */
.healthcare-app .sidebar-help {
  position: relative;
  padding: 26px 12px 12px;
  margin: 43px 0 16px;
  background: #123354;
  border: 1px solid #355676;
  border-radius: 14px;
}
.healthcare-app .sidebar-help-ally {
  position: absolute;
  top: -27px;
  z-index: 1;
  left: 50%;
  transform: translateX(-50%);
  width: 90px;
  height: 60px;
  object-fit: contain;
  pointer-events: none;
}
.healthcare-app .sidebar-help-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  min-height: 42px;
  padding: 8px 10px;
  border: 1px solid #82aeff;
  border-radius: 10px;
  background: #075eff;
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}
.healthcare-app .sidebar-help-button:hover { background: #004fdc; }
.healthcare-app .sidebar-help-button:focus-visible { outline: 3px solid #ffcf45; outline-offset: 4px; }
.healthcare-app .sidebar-help-arrow {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  border-radius: 50%;
  background: #ffcf45;
  color: #071948;
}
.healthcare-app .sidebar-help-arrow svg {
  display: block;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 3.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media(min-width:651px) { .healthcare-app .floating-help { display: none; } }
@media(max-width:650px) { .healthcare-app .sidebar-help { display: none; } }

/* The page heading replaces the retired top bar. */
.healthcare-app .sidebar>.product{margin-bottom:26px}
.healthcare-app .sidebar .side-bottom{flex-shrink:0}
.healthcare-app .sidebar-account{border-top:1px solid #34506f;margin-top:4px;padding-top:16px}
.healthcare-app .sidebar-account summary{display:flex;align-items:center;gap:10px;list-style:none;padding:10px 5px;cursor:pointer;border-radius:10px}
.healthcare-app .sidebar-account summary::-webkit-details-marker{display:none}
.healthcare-app .sidebar-account summary:hover{background:#ffffff0d}
.healthcare-app .sidebar-account summary:focus-visible,.healthcare-app .account-menu :focus-visible{outline:3px solid #ffcf45;outline-offset:3px}
.healthcare-app .account-avatar{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:#1c4777;color:#e5f0ff;font-size:12px;font-weight:700}
.healthcare-app .account-identity{flex:1;min-width:0}
.healthcare-app .account-identity strong{display:block;font-size:12px;font-weight:650;color:#fff;overflow-wrap:anywhere}
.healthcare-app .account-identity small{display:block;font-size:10px;color:#b9cce7;line-height:1.5;margin-top:3px;overflow-wrap:anywhere}
.healthcare-app .account-chevron{width:16px;height:16px;flex:0 0 16px;fill:none;stroke:#b9cce7;stroke-width:2}
.healthcare-app .sidebar-account[open] .account-chevron{transform:rotate(180deg)}
.healthcare-app .account-menu{display:grid;gap:3px;margin:8px 0 0;padding:8px;border:1px solid #34506f;background:#123354;border-radius:10px}
.healthcare-app .account-menu button,.healthcare-app .account-menu a{display:block;width:100%;text-align:left;background:none;border:0;color:#e3edfa;padding:10px 11px;border-radius:7px;font:inherit;font-size:12px;cursor:pointer;text-decoration:none}
.healthcare-app .account-menu button:hover,.healthcare-app .account-menu a:hover{background:#ffffff12;color:#fff}
.healthcare-app .account-menu a{border-top:1px solid #34506f;border-radius:0;margin-top:3px;padding-top:13px}
.healthcare-app .account-mobile-toggle{display:none}
.account-profile-fields{display:grid;gap:16px;margin:22px 0}.account-profile-fields dt{font-size:11px;color:#586c89;margin-bottom:4px}.account-profile-fields dd{margin:0;font-size:14px}
@media(max-width:650px){.healthcare-app .account-mobile-toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid #dce6f3;background:#fff;border-radius:9px;padding:8px 12px;min-height:40px;margin:0 0 22px;font-size:18px}.healthcare-app .account-mobile-toggle span{font-size:12px;font-weight:600}}

/* Natural wordmark spacing, shared across the account. */
.healthcare-app .sidebar a.logo>span{letter-spacing:0}

/* A quiet footer follows content and rests at the bottom of short pages. */
.healthcare-app .app>main{display:flex;flex-direction:column;min-height:100dvh}
.healthcare-app .app>main>#view,.healthcare-app .app>main>.page-heading{flex-shrink:0}
.healthcare-app .account-footer{position:static;margin-top:auto;padding:26px 0 2px;flex-shrink:0;color:#617897;font-size:11px;line-height:1.7}
.account-footer-top,.account-footer-brand,.account-footer-top nav{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.account-footer-brand{margin-top:3px;font-size:10px}
.healthcare-app .account-footer a{color:#4a678e;text-decoration:none}
.healthcare-app .account-footer a:hover{text-decoration:underline;text-underline-offset:3px;color:#075eff}
.healthcare-app .account-footer-brand a{color:#075eff;text-decoration:underline;text-underline-offset:2px}
.healthcare-app .account-footer a:focus-visible{outline:2px solid #075eff;outline-offset:3px;border-radius:2px}
@media(max-width:650px){.healthcare-app .account-footer{font-size:10px;padding-top:24px;padding-bottom:6px}.account-footer-brand{font-size:10px}.account-footer-top,.account-footer-brand,.account-footer-top nav{gap:7px}}

/* Form entry uses the same quiet blue focus treatment across the demo. */
.healthcare-app :is(input,textarea,select):focus,
.healthcare-app :is(input,textarea,select):focus-visible{outline:2px solid #8fb8f0;outline-offset:2px;box-shadow:none}
