/* Shared Bootstrap-style presentation. Local assets only; no framework reset
   so existing layout, localizer geometry and application behavior stay intact. */
:root {
  color-scheme: light;
  --mmm-navy: #0b3555;
  --mmm-blue: #176d95;
  --mmm-blue-hover: #125778;
  --mmm-mist: #f4f9fb;
  --mmm-soft: #eaf5f9;
  --mmm-line: #d9e7ec;
  --mmm-text: #243f50;
  --mmm-muted: #526b78;
  --mmm-shadow: 0 6px 22px rgba(20, 57, 78, .06);
  --bg: var(--mmm-mist);
  --card: #fff;
  --text: var(--mmm-text);
  --muted: var(--mmm-muted);
  --accent: var(--mmm-blue);
  --accent2: var(--mmm-blue);
  --border: var(--mmm-line);
  --soft: var(--mmm-soft);
}
body {
  background: var(--mmm-mist);
  color: var(--mmm-text);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
}
h1, h2, h3, h4 { color: var(--mmm-navy); }
a { color: var(--mmm-blue); text-underline-offset: 3px; }
button, input, select, textarea { font: inherit; }
button { transition: background-color .15s, border-color .15s, box-shadow .15s; }
button:disabled { opacity: .6; cursor: not-allowed; }
button:focus-visible, a:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, .choice-card:focus-visible {
  outline: 3px solid var(--mmm-blue);
  outline-offset: 3px;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea {
  border-color: #b8cfd9;
  border-radius: 8px;
  color: var(--mmm-text);
  background-color: #fff;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):focus, select:focus, textarea:focus {
  border-color: var(--mmm-blue);
  box-shadow: 0 0 0 3px rgba(23,109,149,.14);
}
input[type="checkbox"], input[type="radio"] {
  width: auto;
  accent-color: var(--mmm-blue);
}
.muted, .small-text, .help { color: var(--mmm-muted); }
.card, .account-card {
  border: 1px solid var(--mmm-line);
  border-radius: 12px;
  box-shadow: var(--mmm-shadow);
  background: #fff;
}

/* Patient screens */
.patient-app > .app {
  background: var(--mmm-mist);
  box-shadow: 0 0 36px rgba(20,57,78,.05);
}
.patient-app .app > header {
  background: var(--mmm-navy);
  border-bottom: 3px solid var(--mmm-blue);
  backdrop-filter: none;
  padding: 18px 18px 14px;
}
.patient-app .app > header h1 { color: #fff; font-size: 20px; }
.patient-app .app > header .sub,
.patient-app .app > header .muted { color: #dff3f7; }
.patient-app .hero {
  background: linear-gradient(135deg, #eaf5f9, #fff 75%);
  border-top: 3px solid var(--mmm-blue);
}
.patient-app h2 { line-height: 1.25; }
.patient-app .btn, .patient-app .contact-link {
  background: var(--mmm-blue);
  color: #fff;
  border: 1px solid var(--mmm-blue);
  border-radius: 8px;
  font-weight: 650;
}
.patient-app .btn.secondary, .patient-app .btn.ghost,
.patient-app .contact-link.secondary {
  background: #fff;
  border-color: var(--mmm-blue);
  color: var(--mmm-blue);
}
.patient-app .btn.danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.patient-app .choice button, .patient-app .localizer-view-row button,
.patient-app .segmented-options button, .patient-app .primary-switcher button,
.patient-app .weekday-row button, .patient-app .result-frequency-row button {
  color: var(--mmm-navy);
  border-color: #b8cfd9;
  border-radius: 8px;
  min-height: 44px;
}
.patient-app .choice button.active,
.patient-app .localizer-view-row button.selected,
.patient-app .segmented-options button.selected,
.patient-app .primary-switcher button.selected,
.patient-app .weekday-row button.selected,
.patient-app .result-frequency-row button.selected {
  border-color: var(--mmm-blue);
  background: var(--mmm-blue);
  color: #fff;
  box-shadow: inset 0 0 0 1px var(--mmm-blue);
}
.patient-app .result-frequency-row button.selected .frequency-year-count,
.patient-app .result-frequency-row button.selected.recommended::after { color: #fff; }
.patient-app .result-frequency-row button.recommended::after { color: var(--mmm-blue); }
.patient-app .choice-card.selected {
  border-color: var(--mmm-blue);
  background: var(--mmm-soft);
  box-shadow: inset 3px 0 var(--mmm-blue);
}
.patient-app .choice-card .recommended { background: var(--mmm-blue); }
.patient-app .info-link { color: var(--mmm-blue); }
.patient-app .modal-note { border-left-color: var(--mmm-blue); background: var(--mmm-soft); }
.patient-app .pill, .patient-app .num, .patient-app .tag,
.patient-app .page-id-badge, .patient-app .finding-count-banner {
  background: var(--mmm-soft);
  color: var(--mmm-navy);
  border-color: var(--mmm-line);
}
.patient-app .progress { background: #dcecf3; }
.patient-app .progress > div { background: var(--mmm-blue); }
.patient-app .subcard, .patient-app .contact-card, .patient-app .choice-card,
.patient-app .schedule-item, .patient-app .selected-location { border-radius: 10px; }
.patient-app .anatomy-card, .patient-app .primary-map-wrap,
.patient-app .basin-detail-host, .patient-app .feel-info {
  background: var(--mmm-mist);
  border-color: var(--mmm-line);
}
.patient-app .camera { border-color: #b8cfd9; background: var(--mmm-mist); }
.patient-app .basin-detail-dialog { border: 1px solid var(--mmm-line); }
.patient-app .basin-detail-header { background: var(--mmm-soft); }
.patient-app .basin-detail-close {
  color: var(--mmm-blue);
  border-color: var(--mmm-blue);
  border-radius: 8px;
  min-height: 44px;
}
.patient-app #bottomNav {
  z-index: 20;
  border-color: var(--mmm-line);
  box-shadow: 0 -4px 18px rgba(20,57,78,.06);
  gap: 3px;
}
.patient-app #bottomNav button { border-radius: 8px; min-height: 54px; }
.patient-app #bottomNav button.active { background: var(--mmm-soft); color: var(--mmm-blue); }
.patient-app .account-status {
  position: relative;
  background: #eaf5f9;
  border-bottom: 1px solid var(--mmm-line);
  color: var(--mmm-navy);
}
.patient-app .account-status button {
  border: 1px solid #9bbdce;
  border-radius: 6px;
  background: #fff;
  color: var(--mmm-blue);
  min-height: 36px;
}
.patient-app .account-status[data-error=true] { background: #fff0eb; color: #8e2413; }

/* Account */
.account-page { background: var(--mmm-mist); color: var(--mmm-text); }
.account-card { border-top: 4px solid var(--mmm-blue); padding: 28px; }
.account-card > p:first-child { color: var(--mmm-blue); font-weight: 700; }
.account-card h1 { margin: 16px 0 8px; }
.account-card button {
  background: var(--mmm-blue);
  border: 1px solid var(--mmm-blue);
  font-weight: 650;
}
.account-card button.secondary { background: #fff; color: var(--mmm-blue); }
.demo-credentials { border-color: var(--mmm-line); color: var(--mmm-muted); }
.demo-credentials strong, .demo-credentials code { color: var(--mmm-navy); }

/* Clinician portal */
.clinician-page { background: var(--mmm-mist); color: var(--mmm-text); }
.clinician-page button { background: var(--mmm-blue); border-radius: 8px; }
.clinician-page button.secondary { background: #fff; border: 1px solid var(--mmm-blue); color: var(--mmm-blue); }
.clinician-page button.danger { background: #a83232; color: #fff; }
.clinician-page .topbar { background: var(--mmm-navy); border-color: var(--mmm-blue); color: #fff; }
.clinician-page .topbar span { color: #dff3f7; }
.clinician-page .topbar button.secondary { background: transparent; color: #fff; border-color: #a8cadb; }
.clinician-page .patient-sidebar { border-color: var(--mmm-line); }
.clinician-page .patient-item { background: #fff; border-color: var(--mmm-line); color: var(--mmm-text); }
.clinician-page .patient-item.active { background: var(--mmm-soft); border-color: var(--mmm-blue); box-shadow: inset 3px 0 var(--mmm-blue); }
.clinician-page .patient-item span, .clinician-page .eyebrow { color: var(--mmm-muted); }
.clinician-page .section-nav a { background: var(--mmm-soft); color: var(--mmm-blue); border-radius: 8px; }
.clinician-page .view-toggle button { background: var(--mmm-soft); color: var(--mmm-navy); }
.clinician-page .view-toggle button.selected { background: var(--mmm-blue); color: #fff; }
.clinician-page .localizer-wrap { background: var(--mmm-mist); border-color: var(--mmm-line); }
.clinician-page .pill { background: var(--mmm-soft); color: var(--mmm-navy); }
.clinician-page .data-table th { color: var(--mmm-navy); background: var(--mmm-mist); }
.clinician-page .data-table td, .clinician-page .data-table th { border-color: var(--mmm-line); }
.clinician-page .empty-state h2 { color: var(--mmm-navy); }
.clinician-page .card.danger-card { border-color: #ebcaca; }
.clinician-page dialog { color: var(--mmm-text); }

/* Standalone localizer and configuration editors */
.localizer-page .card { border-top: 4px solid var(--mmm-blue); }
.localizer-page .options label { border-color: var(--mmm-line); border-radius: 8px; }
.localizer-page .options label.selected { background: var(--mmm-soft); border-color: var(--mmm-blue); }
.localizer-page button#showBtn { background: var(--mmm-blue); border-radius: 8px; }
.localizer-page #resetLink { color: var(--mmm-blue); }
.localizer-page #regionsToggle, .localizer-page #basinsToggle { color: var(--mmm-navy); border-color: var(--mmm-line); }
.localizer-page #regionsToggle[aria-pressed="true"] .switch,
.localizer-page #basinsToggle[aria-pressed="true"] .switch { background: var(--mmm-blue); }
.editor-page .panel { border-color: var(--mmm-line); border-top: 4px solid var(--mmm-blue); }
.editor-page button { border-color: #9bbdce; border-radius: 8px; color: var(--mmm-blue); }
.editor-page button.primary { background: var(--mmm-blue); border-color: var(--mmm-blue); color: #fff; }
.editor-page button.danger { border-color: #fca5a5; color: #b91c1c; }
.editor-page .coords { background: var(--mmm-navy); }
.editor-page .stage { box-shadow: var(--mmm-shadow); }
.editor-page .status:not(.ok):not(.warn), .editor-page .mapping-list { background: var(--mmm-soft); color: var(--mmm-navy); }

@media (hover: hover) {
  .patient-app .btn:not(.danger):not(:disabled):hover,
  .patient-app .contact-link:hover,
  .account-card button:not(.secondary):not(:disabled):hover,
  .clinician-page button:not(.patient-item):not(.danger):not(.secondary):not(:disabled):hover,
  .editor-page button.primary:not(:disabled):hover,
  .localizer-page button#showBtn:hover { background: var(--mmm-blue-hover); color: #fff; }
  .patient-app .btn.secondary:not(:disabled):hover,
  .patient-app .btn.ghost:not(:disabled):hover,
  .patient-app .contact-link.secondary:hover,
  .account-card button.secondary:not(:disabled):hover { background: var(--mmm-soft); color: var(--mmm-blue); }
  .patient-app .choice button:not(.active):hover,
  .patient-app .segmented-options button:not(.selected):hover,
  .patient-app .localizer-view-row button:not(.selected):hover,
  .patient-app .primary-switcher button:not(.selected):hover,
  .patient-app .weekday-row button:not(.selected):hover,
  .patient-app .result-frequency-row button:not(.selected):hover,
  .clinician-page .patient-item:not(.active):hover,
  .editor-page button:not(.primary):not(.danger):not(:disabled):hover { background: var(--mmm-soft); border-color: var(--mmm-blue); }
}
@media (max-width: 380px) {
  .patient-app main { padding-left: 12px; padding-right: 12px; }
  .patient-app .card { padding: 16px; }
  .patient-app .row { flex-wrap: wrap; }
  .patient-app .row > * { min-width: 0; }
  .localizer-page { padding: 16px; }
  .localizer-page .card { padding: 24px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  button { transition: none; }
  .patient-app .progress > div { transition: none; }
}