/* ============================================================
   Daybreak — warm "morning light" skin for the WHOLE SITE.
   Same look as the generator page (see static/css/daybreak.css).

   Rolled out PAGE BY PAGE: each page gets ONE <link> to this file
   (after style.css / after the page's own inline <style>), so it
   loads last and wins on ties. Colors + fonts ONLY. No markup, no
   JS, no wiring changes. Remove the <link> line to revert a page.

   Palette (from the approved handoff):
     accent      #FF7B4D   deep #EE5E36   light #FF9366
     page ground #FBF6EE   panel #FFFDF9   soft #F7F1E8
     ink #2A2620  muted #6E6559  faint #A59C8C  border #ECE4D6
   The ChartB logo stays BLUE everywhere (brand mark, unchanged).
   ============================================================ */


/* ============================================================
   GLOBAL LAYER — every page that loads this file (base.html +
   _auth_card.html). Retints the shared design tokens, kills the
   global blue buttons + slate Logout, warms the base font. The
   generator page keeps its own look (daybreak.css is more
   specific and loads after, so it always wins).
   ============================================================ */
:root {
  --primary:       #FF7B4D;
  --primary-dark:  #EE5E36;
  --primary-light: #FF9366;
  --bg-main:  #FBF6EE;
  --bg-white: #FFFDF9;
  --bg-gray:  #F7F1E8;
  --text-dark:   #2A2620;
  --text-medium: #6E6559;
  --text-light:  #A59C8C;
  --border:      #ECE4D6;
  --shadow-sm: 0 2px 10px rgba(120, 80, 40, .06);
  --shadow-md: 0 10px 28px rgba(120, 80, 40, .09);
  --shadow-lg: 0 22px 56px rgba(120, 80, 40, .12);

  /* --- shared "clinical glass" palette → warm (drives many backgrounds/cards) --- */
  --cb-clinical-blue:      #EE5E36;
  --cb-clinical-blue-dark: #D9502B;
  --cb-clinical-sky:       #FBD9BE;
  --cb-clinical-aqua:      #F6E7D3;
  --cb-clinical-mint:      #F2EAD9;
  --cb-clinical-lavender:  #F3E9DB;
  --cb-clinical-warm:      #FFF3E6;
  --cb-clinical-rose:      #FDECE6;
  --cb-glass-surface:        rgba(255, 253, 249, .82);
  --cb-glass-surface-strong: rgba(255, 253, 249, .95);
  --cb-glass-border:  rgba(219, 209, 191, .7);
  --cb-glass-shadow:      0 22px 56px rgba(120, 80, 40, .12);
  --cb-glass-shadow-soft: 0 12px 32px rgba(120, 80, 40, .09);
  --cb-soft-page:
    radial-gradient(820px 460px at 4% -6%, rgba(255, 168, 112, .16), transparent 58%),
    radial-gradient(900px 480px at 92% 4%, rgba(255, 196, 150, .12), transparent 60%),
    linear-gradient(180deg, #FCEEDF 0%, #FBF6EE 55%);
  --cb-soft-card:
    linear-gradient(135deg, rgba(255, 253, 249, .96), rgba(247, 241, 232, .92));
  --cb-soft-card-mint:
    linear-gradient(135deg, rgba(255, 253, 249, .96), rgba(245, 240, 230, .92));

  /* --- shared "professional skin" set → warm (sidebar, surfaces, borders) --- */
  --cb-pro-bg:            #FBF6EE;
  --cb-pro-surface:       #FFFDF9;
  --cb-pro-surface-soft:  #F7F1E8;
  --cb-pro-border:        #ECE4D6;
  --cb-pro-border-strong: #DBD1BF;
  --cb-pro-text:  #2A2620;
  --cb-pro-muted: #6E6559;
  --cb-pro-blue:      #EE5E36;
  --cb-pro-blue-dark: #C24E2C;
  --cb-pro-sidebar:   #F6EFE3;
  --cb-pro-sidebar-2: #EFE6D6;
  --cb-pro-shadow:    0 18px 45px rgba(60, 45, 35, .10);
  --cb-pro-shadow-sm: 0 8px 24px rgba(60, 45, 35, .06);
}

/* Base font — kill the generic 'Inter' (style.css:136) for the native font. */
body {
  font-family: system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif !important;
}

/* Global PRIMARY buttons: blue gradient (style.css ~16668) → warm orange. */
.nav-btn-primary,
.btn-primary,
.audit-btn-primary,
.auth-btn,
.template-modal-footer .tmpl-btn-primary,
.template-modal-footer .btn-modal-primary,
.history-choice-btn.is-primary,
.interp2-btn-start {
  background: linear-gradient(180deg, #FF7B4D, #EE5E36) !important;
  border-color: #EE5E36 !important;
  color: #fff !important;
  box-shadow: 0 12px 28px -10px rgba(238, 94, 54, .45) !important;
}
.nav-btn-primary:hover,
.btn-primary:hover,
.audit-btn-primary:hover,
.auth-btn:hover,
.template-modal-footer .tmpl-btn-primary:hover,
.template-modal-footer .btn-modal-primary:hover,
.history-choice-btn.is-primary:hover,
.interp2-btn-start:hover {
  background: linear-gradient(180deg, #F26A3C, #E0521F) !important;
  box-shadow: 0 16px 34px -10px rgba(238, 94, 54, .5) !important;
}

/* Global LOGOUT / danger button: slate (style.css ~16697) → warm; red on hover. */
.nav-btn-danger,
.back-link.logout {
  background: #FFFDF9 !important;
  color: #2A2620 !important;
  border-color: #ECE4D6 !important;
}
.nav-btn-danger:hover,
.back-link.logout:hover {
  background: #FDECE9 !important;
  color: #C0392B !important;
  border-color: #E8B4AE !important;
}


/* ============================================================
   APP-LAYOUT PAGES (differential, audit, dictations, advance
   planning — wrapper .app-layout, NOT the generator). Same
   light warm sidebar + dark text as the generator, so their
   dark-navy sidebar can't stay blue.
   ============================================================ */
.app-layout:not(.generator-layout) .sidebar {
  background: #F6EFE3 !important;
  border-right: 1px solid #ECE4D6 !important;
}
.app-layout:not(.generator-layout) .main-area {
  background: linear-gradient(180deg, #FCEEDF 0, #FBF6EE 260px) !important;
}
.app-layout:not(.generator-layout) .sidebar-collapse-tab,
.app-layout:not(.generator-layout) .sidebar-expand-tab {
  background: #EAE0CF !important;
  color: #6E6559 !important;
}
.app-layout:not(.generator-layout) .nav-label {
  color: #6E6559 !important;
  font-family: ui-monospace, "SF Mono", "IBM Plex Mono", Menlo, monospace !important;
  font-weight: 600 !important;
}
.app-layout:not(.generator-layout) .current-type {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
  color: #2A2620 !important;
}
.app-layout:not(.generator-layout) .current-type svg { color: #FF7B4D !important; }
.app-layout:not(.generator-layout) .case-name,
.app-layout:not(.generator-layout) .case-item.active .case-name { color: #2A2620 !important; }
.app-layout:not(.generator-layout) .case-date { color: #6E6559 !important; }
.app-layout:not(.generator-layout) .sidebar-user,
.app-layout:not(.generator-layout) .back-link,
.app-layout:not(.generator-layout) .back-link.logout { color: #6E6559 !important; }
.app-layout:not(.generator-layout) .case-item:hover { background: rgba(255, 123, 77, .10) !important; }
.app-layout:not(.generator-layout) .case-item.active { background: rgba(255, 123, 77, .14) !important; }


/* ============================================================
   AUTH-CARD PAGES (signup, admin_*, account_settings, forgot/
   reset password, verify, 403 — self-contained, wrapper
   .auth-page). Retint its blue tokens + warm the glass card.
   ============================================================ */
.auth-page {
  --blue-700: #EE5E36;
  --blue-600: #FF7B4D;
  --blue-500: #FF9366;
  --bg-body:  #FBF6EE;
  --text-dark:  #2A2620;
  --text-body:  #4A4034;
  --text-muted: #6E6559;
  --border:     #ECE4D6;
}
body:has(.auth-page) {
  background:
    radial-gradient(820px 460px at 4% -6%, rgba(255, 168, 112, .16), transparent 58%),
    radial-gradient(900px 460px at 96% 100%, rgba(255, 196, 150, .12), transparent 60%),
    linear-gradient(180deg, #FCEEDF 0%, #FBF6EE 100%) !important;
}
.auth-page .auth-card {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
  box-shadow: 0 25px 50px -20px rgba(238, 94, 54, .14), 0 8px 20px rgba(60, 45, 35, .05) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.auth-page .form-group input {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
}
.auth-page .form-group input:focus {
  border-color: #FF7B4D !important;
  box-shadow: 0 0 0 3px rgba(255, 123, 77, .15) !important;
}
.auth-page .auth-btn {
  background: linear-gradient(180deg, #FF7B4D, #EE5E36) !important;
  border-color: #EE5E36 !important;
  color: #fff !important;
  box-shadow: 0 12px 28px -10px rgba(238, 94, 54, .45) !important;
}
.auth-page .auth-btn:hover { background: linear-gradient(180deg, #F26A3C, #E0521F) !important; }
/* Keep the logo blue. */
.auth-page .auth-logo-icon {
  background: linear-gradient(135deg, #0066cc, #0052b3) !important;
  box-shadow: 0 6px 16px rgba(0, 102, 204, .25) !important;
}
.auth-page .auth-logo-text .ai { color: #0066cc !important; }
/* Headings — the generator's editorial serif. */
.auth-page .auth-card h1 {
  font-family: ui-serif, "New York", "Iowan Old Style", Georgia, "Times New Roman", serif !important;
  font-weight: 600 !important;
}


/* ============================================================
   SITE-WIDE HOLDOUTS — hard-coded blues not driven by tokens.
   Warm every sidebar (with dark text) + every page ground. The
   generator keeps its own look (its rules are more specific and
   load after this file, so they always win).
   ============================================================ */

/* Every sidebar → light warm paper (was navy / #7ba3d4 blue). */
.sidebar {
  background: #F6EFE3 !important;
  border-right: 1px solid #ECE4D6 !important;
}
/* Sidebar text was white for a dark bar — flip to dark ink. */
.sidebar .nav-label { color: #6E6559 !important; }
.sidebar .case-name,
.sidebar .case-item.active .case-name { color: #2A2620 !important; }
.sidebar .case-date,
.sidebar .sidebar-user,
.sidebar .back-link,
.sidebar .back-link.logout { color: #6E6559 !important; }
.sidebar .case-item:hover { background: rgba(255, 123, 77, .10) !important; }
.sidebar .case-item.active { background: rgba(255, 123, 77, .14) !important; }
.sidebar .current-type {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
  color: #2A2620 !important;
}
.sidebar .current-type svg { color: #FF7B4D !important; }
.sidebar .sidebar-collapse-tab,
.sidebar .sidebar-expand-tab,
.sidebar-collapse-tab,
.sidebar-expand-tab { background: #EAE0CF !important; color: #6E6559 !important; }

/* Main page grounds → warm cream (was blue radial gradients). */
.home-page,
.patients-page,
.patients-main,
.settings-page,
.account-page,
.main-area,
.content-area,
.app-layout:not(.generator-layout) .main-area {
  background:
    radial-gradient(820px 460px at 4% -6%, rgba(255, 168, 112, .14), transparent 58%),
    linear-gradient(180deg, #FCEEDF 0, #FBF6EE 300px) !important;
}

/* Patients sidebar (glass navy) → light warm + dark text. Page-scoped +
   doubled class so it outranks the higher-specificity blue glass rule. */
.patients-page .patients-sidebar,
.patients-sidebar.patients-sidebar {
  background: #F6EFE3 !important;
  border-right: 1px solid #ECE4D6 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.patients-page .patients-sidebar-top h3,
.patients-page .patients-search-label,
.patients-page .patient-side-notes-label,
.patients-page .patients-sidebar .nav-label { color: #6E6559 !important; }
.patients-page .patient-item,
.patients-page .patient-item .patient-name { color: #2A2620 !important; }
.patients-page .patient-item .patient-meta { color: #6E6559 !important; }
.patients-page .patient-item.active { background: rgba(255, 123, 77, .14) !important; }
.patients-page .patient-item:hover { background: rgba(255, 123, 77, .10) !important; }

/* Glass cards & panels → warm paper. PAGE-SCOPED (0,2,0) to beat the blue glass. */
.home-page .home-voice-card,
.home-page .home-insight-card,
.home-page .home-clinical-card,
.patients-page .card,
.patients-page .entry-card,
.patients-page .ext-card,
.patients-page .ext-panel,
.patients-page .organize-box,
.patients-page .patient-detail-hero,
.patients-page .patient-detail-meta-card,
.settings-page .settings-right,
.settings-page .settings-left,
.settings-page .settings-panel,
.settings-page .settings-panel-inner,
.settings-page .card,
.settings-page .settings-card,
.user-chip.user-chip {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
  box-shadow: 0 1px 2px rgba(42, 38, 32, .04), 0 18px 40px -30px rgba(238, 94, 54, .20) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Primary call-to-action cards (were blue gradient) → soft warm accent. */
.home-page .clinical-add-patient,
.home-page .home-clinical-card.clinical-add-patient,
.patients-page .patient-intake-hero,
.patients-page .patients-intake-hero,
.patients-page .intake-hero {
  background: linear-gradient(135deg, #FFF3E8, #FCE7D6) !important;
  border: 1px solid #F3D3BC !important;
  box-shadow: 0 18px 40px -26px rgba(238, 94, 54, .30) !important;
}

/* Blue accent eyebrows / labels + pills / chips / tabs → warm. */
.home-page .home-section-label.blue {
  background: rgba(255, 123, 77, .10) !important;
  color: #C24E2C !important;
}
.patients-page .note-btn,
.patients-page .chip,
.patients-page .entry-date-chip,
.patients-page .ext-tab,
.patients-page .entry-label {
  background: #F3ECE0 !important;
  border-color: #ECE4D6 !important;
  color: #2A2620 !important;
}

/* Settings nav items + badges → warm. */
/* Inactive tabs: white-on-blue leftovers (style.css ~17064) → warm paper
   pills with dark warm text so they read on the cream ground. */
.settings-page .settings-nav-item {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
  color: #4A4034 !important;
  box-shadow: 0 1px 2px rgba(42, 38, 32, .04) !important;
}
.settings-page .settings-nav-item.disabled {
  color: #8A8175 !important;
}
.settings-page .settings-nav-item.active,
.settings-page .settings-nav-item:hover:not(.disabled) {
  background: rgba(255, 123, 77, .12) !important;
  border-color: rgba(255, 123, 77, .35) !important;
  color: #C24E2C !important;
}
.settings-page .settings-badge {
  background: rgba(255, 123, 77, .14) !important;
  color: #C24E2C !important;
}

/* Settings chrome: the redesign (style.css ~16971+) was built for a BLUE glass
   theme — navy nav bar, white title, blue/green radial glows on the panels.
   The warm skin never covered these, so they clash on the cream ground. Warm
   the whole settings header + panels to match the rest of the site. */
.settings-page .settings-nav {
  background: #F6EFE3 !important;
  border: 1px solid #ECE4D6 !important;
  box-shadow: 0 1px 2px rgba(42, 38, 32, .04), 0 18px 40px -30px rgba(238, 94, 54, .20) !important;
}
.settings-page .settings-title {
  color: #2A2620 !important;
}
.settings-page .settings-left,
.settings-page .settings-left-rail,
.settings-page .settings-panel-solo {
  background: #FFFDF9 !important;
  background-image: none !important;
  border: 1px solid #ECE4D6 !important;
  box-shadow: 0 1px 2px rgba(42, 38, 32, .04), 0 18px 40px -30px rgba(238, 94, 54, .20) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Blue icon squares → orange. */
.home-page .clinical-icon,
.home-page .voice-icon,
.home-page .card-icon,
.home-page .icon-square,
.patients-page .patient-intake-icon,
.patients-page .intake-icon { background: linear-gradient(135deg, #FF7B4D, #EE5E36) !important; }

/* Floating Help button (bottom-right, was blue).
   NOTE: .help-bubble-bot (the AI ANSWER bubble) is deliberately NOT here —
   it must stay light so the answer text and clickable button-names are
   readable. Only the round Help button/toggles are orange. */
.help-fab,
.help-toggle,
.help-bubble-toggle,
#helpBubble,
.help-open-btn { background: linear-gradient(180deg, #FF7B4D, #EE5E36) !important; }


/* ============================================================
   ID HAMMER — the base pages live inside #helpMainContent (an ID),
   so this prefix outranks every class-based blue rule (0,x,x).
   Scoped to page-specific classes → the generator is never touched.
   ============================================================ */

/* --- HOME right note-cards → warm paper + kill the blue "orb". --- */
#helpMainContent .home-page .home-right .home-clinical-card {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
  box-shadow: 0 1px 2px rgba(42, 38, 32, .04), 0 18px 40px -30px rgba(238, 94, 54, .20) !important;
}
#helpMainContent .home-page .home-right .home-clinical-card.clinical-add-patient {
  background: linear-gradient(135deg, #FFF3E8, #FCE7D6) !important;
  border: 1px solid #F3D3BC !important;
}
#helpMainContent .home-page .home-right .home-clinical-card::after {
  background: radial-gradient(circle, rgba(255, 168, 112, .12), transparent 70%) !important;
}
#helpMainContent .home-page .home-clinical-card .clinical-icon,
#helpMainContent .home-page .home-clinical-card .home-clinical-icon,
#helpMainContent .home-page .home-clinical-card .card-icon,
#helpMainContent .home-page .clinical-add-patient .clinical-icon {
  background: linear-gradient(135deg, #FF7B4D, #EE5E36) !important;
}

/* --- PATIENTS sidebar → light warm + dark text. --- */
#helpMainContent .patients-sidebar {
  background: #F6EFE3 !important;
  border-right: 1px solid #ECE4D6 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#helpMainContent .patients-sidebar .patients-sidebar-top h3,
#helpMainContent .patients-sidebar .patients-search-label,
#helpMainContent .patients-sidebar .patients-list-empty,
#helpMainContent .patient-preview-empty { color: #4A4034 !important; }
#helpMainContent .patients-sidebar .patients-search {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
  color: #2A2620 !important;
}
/* --- PATIENTS intake hero (blue → warm accent). --- */
#helpMainContent .new-patient-intake-hero {
  background: linear-gradient(135deg, #FFF3E8, #FCE7D6) !important;
  border: 1px solid #F3D3BC !important;
}
#helpMainContent .intake-eyebrow { color: #C24E2C !important; }
#helpMainContent .intake-hero-icon { background: linear-gradient(135deg, #FF7B4D, #EE5E36) !important; }
#helpMainContent .intake-hero-steps span {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
  color: #2A2620 !important;
}
#helpMainContent .patients-page .chip,
#helpMainContent .patients-page .cat-chip,
#helpMainContent .patients-page .intake-cat {
  background: #F3ECE0 !important;
  border: 1px solid #ECE4D6 !important;
  color: #2A2620 !important;
}

/* --- SETTINGS: blue top-tabs bar + blue folder buttons/eyebrow → warm. --- */
#helpMainContent .settings-page .settings-tabs,
#helpMainContent .settings-page .settings-tabbar,
#helpMainContent .settings-page .settings-nav,
#helpMainContent .settings-page .settings-topnav,
#helpMainContent .settings-page .settings-header {
  background: #F6EFE3 !important;
  border: 1px solid #ECE4D6 !important;
}
#helpMainContent .settings-page .settings-tab,
#helpMainContent .settings-page .settings-tab.active {
  color: #2A2620 !important;
  background: transparent !important;
}
#helpMainContent .settings-page .settings-tab.active {
  background: #FFFDF9 !important;
  color: #C24E2C !important;
}
#helpMainContent .settings-page .settings-panel-eyebrow,
#helpMainContent .settings-page .settings-section-eyebrow,
#helpMainContent .settings-page .note-structure-eyebrow { color: #C24E2C !important; }
#helpMainContent .settings-page .settings-rail-btn,
#helpMainContent .settings-page .folder-open-btn,
#helpMainContent .settings-page .section-setup-btn,
#helpMainContent .settings-page .settings-open-btn {
  color: #C24E2C !important;
  border-color: #F3D3BC !important;
  background: #FFFDF9 !important;
}

/* --- HOME leftovers: blue "Interpreter" badge, waveform, icon squares. --- */
#helpMainContent .home-page .home-voice-interpreter .home-tool-badge {
  background: rgba(255, 123, 77, .12) !important;
  color: #C24E2C !important;
}
#helpMainContent .home-page .home-voice-wave span { background: #EE5E36 !important; }
#helpMainContent .home-page .clinical-add-patient .icon-wrap,
#helpMainContent .home-page .home-bank-search-icon {
  background: linear-gradient(135deg, #FF7B4D, #EE5E36) !important;
}

/* --- PATIENTS leftovers: bottom category chips (ER note, Labs, …). --- */
#helpMainContent .intake-data-hints span {
  background: #F3ECE0 !important;
  border: 1px solid #ECE4D6 !important;
  color: #4A4034 !important;
}

/* --- Shared follow-up chat panel (differential + generator) → warm. --- */
#helpMainContent .chat-section {
  background: #FFFDF9 !important;
  border: 1px solid #ECE4D6 !important;
  box-shadow: 0 4px 24px rgba(238, 94, 54, .08), 0 1px 3px rgba(42, 38, 32, .04) !important;
}

/* --- SETTINGS OPEN / SET UP action cues (blue). Two IDs to beat #panel rule. --- */
#helpMainContent #panel-note-structure .settings-action-cue,
#helpMainContent .settings-page .settings-action-cue {
  background: #FFFDF9 !important;
  border: 1px solid #F3D3BC !important;
  color: #C24E2C !important;
}

/* --- SETTINGS folder colors: Admission was blue (the DEFAULT accent). Warm the
   default → orange, then re-assert Progress=green / Discharge=purple (later in
   source, equal specificity → they win), so only Admission turns orange. --- */
.settings-folder-btn[data-folder],
.settings-middle-folder-card[data-folder],
.settings-middle-folder-top[data-folder],
.settings-folder-parts[data-folder-parts] {
  --folder-accent: #EE5E36;
  --folder-accent-2: #FF9366;
  --folder-tab: #F6C9A3;
  --folder-soft: rgba(255, 123, 77, 0.13);
  --folder-soft-strong: rgba(255, 123, 77, 0.24);
  --folder-border: rgba(238, 94, 54, 0.32);
  --folder-shadow: rgba(238, 94, 54, 0.12);
}
.settings-folder-btn[data-folder="progress"],
.settings-middle-folder-card[data-folder="progress"],
.settings-middle-folder-top[data-folder="progress"],
.settings-folder-parts[data-folder-parts="progress"] {
  --folder-accent: #059669; --folder-accent-2: #34d399; --folder-tab: #a7f3d0;
  --folder-soft: rgba(5,150,105,0.13); --folder-soft-strong: rgba(5,150,105,0.23);
  --folder-border: rgba(5,150,105,0.34); --folder-shadow: rgba(5,150,105,0.12);
}
.settings-folder-btn[data-folder="discharge"],
.settings-middle-folder-card[data-folder="discharge"],
.settings-middle-folder-top[data-folder="discharge"],
.settings-folder-parts[data-folder-parts="discharge"] {
  --folder-accent: #7c3aed; --folder-accent-2: #a78bfa; --folder-tab: #ddd6fe;
  --folder-soft: rgba(124,58,237,0.12); --folder-soft-strong: rgba(124,58,237,0.22);
  --folder-border: rgba(124,58,237,0.32); --folder-shadow: rgba(124,58,237,0.11);
}
/* "NOTE STRUCTURE" mini-label eyebrow (blue) → warm. */
#helpMainContent .settings-mini-label { color: #C24E2C !important; }


/* ============================================================
   SITE-WIDE FONTS — match the generator page EXACTLY: editorial
   SERIF for headings, titles, card names and note/prose bodies;
   Gill Sans for the top-bar buttons; system sans for the rest.
   This is the font character George wants on every page.
   ============================================================ */

/* Editorial serif headings + titles (like the generator's "Good afternoon"). */
#helpMainContent h1,
#helpMainContent h2,
#helpMainContent h3,
#helpMainContent .page-title,
#helpMainContent .home-right-heading h2,
#helpMainContent .home-clinical-card h3,
#helpMainContent .home-insight-card h3,
#helpMainContent .home-voice-card h3,
#helpMainContent .patients-header h1,
#helpMainContent .new-patient-intake-hero h2,
#helpMainContent .patient-detail-header h2,
#helpMainContent .settings-panel-title,
#helpMainContent .settings-flow-intro h2,
#helpMainContent .settings-folder-title,
#helpMainContent .settings-part-title,
#helpMainContent .card h2,
#helpMainContent .chat-header {
  font-family: ui-serif, "New York", "Iowan Old Style", Georgia, "Times New Roman", serif !important;
  letter-spacing: -.012em !important;
}

/* Generated-note / analysis prose → serif (matches the generator note body). */
#helpMainContent .output-content,
#helpMainContent .output-content p,
#helpMainContent .output-content li,
#helpMainContent .output-content h1,
#helpMainContent .output-content h2,
#helpMainContent .output-content h3,
#helpMainContent .audit-output,
#helpMainContent .audit-output p,
#helpMainContent .differential-output,
#helpMainContent .differential-output p {
  font-family: ui-serif, "New York", "Iowan Old Style", Georgia, "Times New Roman", serif !important;
}

/* Top-bar nav buttons + email chip → Gill Sans (George's pick, like the generator). */
#helpMainContent .nav-btn,
#helpMainContent .nav-btn.nav-btn-primary,
#helpMainContent .nav-btn.nav-btn-back,
#helpMainContent .nav-btn.nav-btn-danger,
#helpMainContent .nav-btn-primary,
#helpMainContent .nav-btn-back,
#helpMainContent .nav-btn-danger,
#helpMainContent .user-chip,
#helpMainContent .user-chip .user-name {
  font-family: "Gill Sans", "Gill Sans MT", "Seravek", system-ui, -apple-system, sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: .002em !important;
}


/* ============================================================
   READABILITY — source citations in the Safety Audit were a very
   pale gray (#aab3c0), too faint to read. Darken to the readable
   warm muted tone used across the design.
   ============================================================ */
.csn-audit-src,
.csn-audit-main {
  color: #5f5749 !important;
}

/* The Safety-Audit note sat in a narrow 920px column, centered — on a wide
   screen it felt cramped with big empty margins. Widen the reading column so
   the lines stretch and breathe (still capped so prose stays readable). */
#helpMainContent .csn-screen { max-width: 1240px !important; }


/* ============================================================
   LOGIN PAGE  (templates/login.html — wrapper .page-wrapper)
   Its base colors live in the page's own inline <style>. We apply
   a balanced clinical palette here, replace the pale glass surfaces,
   and keep the shared ChartB logo blue.
   ============================================================ */

/* 1. Balanced clinical palette for the login page. */
.page-wrapper {
  --blue-700: #004C99;
  --blue-600: #0066CC;
  --blue-500: #1A7ADB;
  --blue-400: #4A9FE5;
  --blue-100: #D9EAFB;
  --blue-50:  #EDF6FF;
  --bg-body:  #CFE8F6;
  --bg-white: #FFFFFF;
  --text-dark:  #102A43;
  --text-body:  #334E68;
  --text-muted: #3F5870;
  --border:       #668AA5;
  --border-light: #C2D3DF;
}

/* 2a. Distinct sky and mint zones separate product from sign-in. */
body:has(.hero-viewport),
.hero-viewport {
  background: #CFE8F6 !important;
}
.hero-viewport {
  isolation: isolate;
}
.hero-viewport::before {
  content: "";
  position: absolute;
  inset: 0 0 0 auto;
  left: calc(100% - 496px);
  background: #DFF2E7;
  z-index: 0;
  pointer-events: none;
}
.page-wrapper .nav {
  background: #FFFFFF;
  box-shadow: 0 1px 0 #A8C2D4, 0 8px 24px rgba(22, 61, 87, .09);
}
.page-wrapper .hero-gradient-1,
.page-wrapper .hero-gradient-blob-1,
.page-wrapper .hero-gradient-blob-2 { display: none !important; }

/* 2b. Crisp white login card with visible separation from the page. */
.page-wrapper .login-card {
  background: #FFFFFF !important;
  border: 1px solid #527D9B !important;
  box-shadow: 0 26px 60px rgba(15, 55, 77, .24), 0 8px 20px rgba(15, 55, 77, .12) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.page-wrapper .login-card-footer { border-top: 1px solid #B9CDD9 !important; }

/* 2c. Feature cards use the same crisp white surface. */
.page-wrapper .feature-card {
  background: #FFFFFF !important;
  border: 1px solid #91A6BA !important;
  box-shadow: 0 12px 30px rgba(15, 39, 68, .12) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.page-wrapper .feature-card:hover { border-color: #7F98B2 !important; }

/* 2d. Product tour frame gets a stronger clinical-blue edge and shadow. */
.page-wrapper .hero-image-card {
  background: #FFFFFF !important;
  border: 1px solid #4D7897 !important;
  box-shadow: 0 26px 58px rgba(15, 55, 77, .24), 0 6px 16px rgba(0, 102, 204, .14) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* 2e. Inputs + OAuth buttons are white with clear blue-gray borders. */
.page-wrapper .form-group input,
.page-wrapper .oauth-btn {
  background: #F7FBFF !important;
  border: 1px solid #7398B4 !important;
  box-shadow: none !important;
}
.page-wrapper .form-group input:focus {
  border-color: #0066CC !important;
  box-shadow: 0 0 0 3px rgba(0, 102, 204, .16) !important;
}
.page-wrapper .oauth-btn:hover {
  border-color: #0066CC !important;
  background: #EDF6FF !important;
}

/* 2f. Sign In returns to the ChartB primary blue. */
.page-wrapper .login-btn {
  background: #0066CC !important;
  box-shadow: 0 12px 26px -8px rgba(0, 102, 204, .52) !important;
  font-family: ui-rounded, "SF Pro Rounded", system-ui, -apple-system, "Segoe UI", sans-serif !important;
}
.page-wrapper .login-btn:hover {
  background: #004C99 !important;
}

/* 2g. Coral stays as a supporting accent, not the page's base color. */
.page-wrapper .badge-pill.blue {
  background: #FFF1EB !important;
  border: 1px solid #EFA58B !important;
  color: #B83E21 !important;
}
.page-wrapper .badge-dot { background: #E65032 !important; }

/* 3. Keep the ChartB logo BLUE — identical brand mark on every page. */
.page-wrapper .logo-icon {
  background: linear-gradient(135deg, #0066cc, #0052b3) !important;
  box-shadow: 0 6px 16px rgba(0, 102, 204, .25) !important;
}
.page-wrapper .logo-text .ai { color: #0066cc !important; }

/* 4. Fonts — warm body sans; elegant (not aggressive) headings. */
body:has(.hero-viewport) {
  font-family: system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif !important;
}
/* Headings — the generator's editorial serif (the font George wants everywhere). */
.page-wrapper .main-heading,
.page-wrapper .features-heading,
.page-wrapper .login-card-header h2 {
  font-family: ui-serif, "New York", "Iowan Old Style", Georgia, "Times New Roman", serif !important;
  font-weight: 600 !important;
}
/* Hero heading SMALLER (was oversized), so the logo can lead. */
.page-wrapper .main-heading {
  font-size: clamp(2rem, 2.6vw, 2.25rem) !important;
  line-height: 1.16 !important;
}
.page-wrapper .main-heading .gradient-text { color: #E65032 !important; }
.page-wrapper .hero-subtitle { color: #3F5870 !important; }
/* Logo wordmark BIGGER. */
.page-wrapper .logo-text { font-size: 2.75rem !important; }

@media (min-width: 1200px) {
  .page-wrapper .login-section { transform: translateX(18px); }
}

@media (min-width: 1601px) {
  .hero-viewport::before { left: calc(50% + 304px); }
  .page-wrapper .login-section { transform: translateX(calc(25vw - 382px)); }
}

@media (max-width: 960px) {
  .hero-viewport::before { display: none; }
}