/* ── Variables & Pico overrides ──────────────────────────────────────────── */
:root {
  /* Teal primary — clinical, calm */
  --cu-primary:    #00897b;
  --cu-primary-dk: #00695c;
  --cu-primary-lt: #e0f2f1;

  /* Pico v2 primary override */
  --pico-primary:                  #00897b;
  --pico-primary-background:       #00897b;
  --pico-primary-border:           #00897b;
  --pico-primary-hover:            #00695c;
  --pico-primary-hover-background: #00695c;
  --pico-primary-inverse:          #ffffff;
  --pico-primary-focus:            rgba(0,137,123,.25);
  --pico-primary-underline:        rgba(0,137,123,.5);

  /* Flash */
  --flash-error-bg:       #fdecea;
  --flash-error-color:    #c62828;
  --flash-ok-bg:          #e8f5e9;
  --flash-ok-color:       #2e7d32;
  --flash-info-bg:        #e3f2fd;
  --flash-info-color:     #1565c0;
  --flash-warning-bg:     #fff8e1;
  --flash-warning-color:  #e65100;

  /* Shadows */
  --cu-shadow-sm: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.05);
  --cu-shadow-md: 0 4px 10px rgba(0,0,0,.09), 0 2px 4px rgba(0,0,0,.06);
}

/* Font */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ── Skip-to-content ─────────────────────────────────────────────────────── */
.skip-to-content {
  position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden;
}
.skip-to-content:focus {
  position: static; width: auto; height: auto; display: block;
  padding: .5rem 1rem; background: var(--cu-primary); color: #fff;
  text-decoration: none; z-index: 9999;
}

/* ── Navigation ──────────────────────────────────────────────────────────── */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--pico-background-color);
  border-bottom: 1px solid var(--pico-muted-border-color);
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
  padding: 0;
}

.site-header nav {
  padding-top: .5rem;
  padding-bottom: .5rem;
}

.site-header nav > ul {
  align-items: center;
  gap: 0.25rem;
}

.site-header nav > ul > li > a {
  font-size: 0.9rem;
  padding: 0.25rem 0.5rem;
}

.site-header nav > ul:first-child {
  margin-right: auto;
}

.site-header nav > ul:last-child {
  margin-left: auto;
  gap: 0.5rem;
}

.site-brand {
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-decoration: none;
  color: var(--cu-primary) !important;
  padding: 0.25rem 0;
}

.nav-user-name {
  color: var(--pico-muted-color);
  display: flex;
  align-items: center;
  font-size: 0.85rem;
}

.nav-user-name a {
  color: inherit;
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
.site-footer {
  background: var(--pico-background-color);
  border-top: 1px solid var(--pico-muted-border-color);
  padding: 1.5rem 0;
  margin-top: 3rem;
  text-align: center;
}

.footer-links {
  margin-bottom: 0.5rem;
}

.footer-links a {
  color: var(--cu-primary, #00897b);
  text-decoration: none;
  font-size: 0.9rem;
}

.footer-links a:hover {
  text-decoration: underline;
}

.footer-sep {
  margin: 0 0.5rem;
  color: var(--pico-muted-color);
}

.footer-version {
  color: var(--pico-muted-color);
  font-size: 0.8rem;
  margin: 0;
}

.inline-form { display: inline; margin: 0; }

/* Logout item aligns with the other nav items */
.nav-logout-item { display: flex; align-items: center; }
.nav-logout-btn {
  background: none; border: none; padding: 0; margin: 0;
  color: var(--pico-muted-color); cursor: pointer;
  font: inherit; font-size: 0.85rem; line-height: inherit;
  text-decoration: underline; text-underline-offset: 2px;
  vertical-align: baseline;
}
.nav-logout-btn:hover { color: var(--pico-primary); }

.link-button {
  background: none; border: none; padding: 0;
  color: var(--pico-primary); cursor: pointer;
  font: inherit; text-decoration: underline; text-underline-offset: 2px;
}
.link-button:hover { color: var(--pico-primary-hover); }

button.confirm-pending { outline: 2px solid #c62828; outline-offset: 2px; }

.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ── Flash messages ──────────────────────────────────────────────────────── */
.flash-bar {
  padding: 0;
  border-bottom: none;
  margin-bottom: 0;
}

.flash-bar > .container-fluid {
  padding-top: .65rem;
  padding-bottom: .65rem;
  border-left: 4px solid currentColor;
  border-radius: 0;
}

.flash-bar p { margin: 0; font-size: .9rem; }

.flash-error   { background: var(--flash-error-bg);   color: var(--flash-error-color);   }
.flash-success { background: var(--flash-ok-bg);      color: var(--flash-ok-color);      }
.flash-info    { background: var(--flash-info-bg);    color: var(--flash-info-color);    }
.flash-warning { background: var(--flash-warning-bg); color: var(--flash-warning-color); }

/* Flash bars rendered inline (e.g. inside forms) */
.flash-bar[style*="border-radius"] > .container-fluid,
.flash-bar[style] > div {
  border-radius: 6px;
  border-left: 4px solid currentColor;
}

.feedback-selected { outline: 2px solid currentColor; font-weight: 600; }

/* ── Emergency button ────────────────────────────────────────────────────── */
.emergency-btn {
  position: fixed; bottom: 1.25rem; right: 1.25rem; z-index: 200;
  background: #fff; color: #b71c1c; border: 1.5px solid #ef9a9a;
  border-radius: 999px; padding: .45rem 1.1rem;
  font-size: .8rem; font-weight: 600; text-decoration: none !important;
  box-shadow: 0 2px 10px rgba(183,28,28,.15);
  transition: background .15s, color .15s, border-color .15s, box-shadow .15s;
  white-space: nowrap;
}
.emergency-btn:hover {
  background: #c62828; color: #fff !important; border-color: #c62828;
  box-shadow: 0 4px 14px rgba(183,28,28,.3);
}
@media (max-width: 480px) {
  .emergency-btn { font-size: .75rem; padding: .35rem .8rem; bottom: .75rem; right: .75rem; }
}

/* ── Login page ──────────────────────────────────────────────────────────── */
.login-wrapper {
  max-width: 400px;
  margin: 3.5rem auto 2rem;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.08);
}

.login-header {
  background: linear-gradient(135deg, var(--cu-primary) 0%, var(--cu-primary-dk) 100%);
  padding: 2rem 2rem 1.75rem;
  text-align: center;
  color: #fff;
}

.login-brand {
  font-size: 2.25rem;
  font-weight: 700;
  letter-spacing: .2em;
  margin: 0 0 .35rem;
  color: #fff;
}

.login-tagline {
  font-size: .88rem;
  opacity: .88;
  margin: 0;
  color: #fff;
}

.login-body {
  background: var(--pico-card-background-color, #fff);
  padding: 1.75rem 2rem 2rem;
}

.login-body label { margin-bottom: .9rem; }

.login-btn { width: 100%; margin-top: .25rem; }

/* ── Error card ──────────────────────────────────────────────────────────── */
.error-card { max-width: 480px; margin: 4rem auto; text-align: center; }

/* ── Content padding ─────────────────────────────────────────────────────── */
#main-content { padding-top: 1.5rem; padding-bottom: 2rem; }

/* ── Article shadow (cards) ──────────────────────────────────────────────── */
article {
  box-shadow: var(--cu-shadow-sm);
}

/* ── Safety alert ────────────────────────────────────────────────────────── */
.alert-urgente {
  background: #fff3e0; border-left: 4px solid #e65100;
  color: #bf360c; padding: 1rem 1.25rem;
  border-radius: 6px; margin-bottom: 1rem;
}
.alert-urgente strong { display: block; margin-bottom: .25rem; }

/* ── Utilities ───────────────────────────────────────────────────────────── */
.text-muted  { color: var(--pico-muted-color); }
.text-center { text-align: center; }
.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }

/* ── Page header ─────────────────────────────────────────────────────────── */
.page-header {
  display: flex; 
  align-items: center; 
  justify-content: space-between;
  flex-wrap: wrap; 
  gap: 1rem; 
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--pico-muted-border-color);
}
.page-header h2 { margin: 0; flex: 0 1 auto; min-width: 0; }
.page-header .actions-col { flex: 0 1 auto; min-width: 0; }

/* ── Filter bar ──────────────────────────────────────────────────────────── */
.filter-bar {
  display: flex; flex-wrap: wrap; gap: .5rem; align-items: flex-end; margin-bottom: 1.25rem;
}
.filter-bar input[type=search] { flex: 1; min-width: 10rem; margin: 0; }
.filter-bar select              { flex: 0 1 14rem; margin: 0; }
.filter-bar button,
.filter-bar a                   { margin: 0; white-space: nowrap; }

/* ── Small buttons & action columns ─────────────────────────────────────── */
.btn-sm { padding: .25rem .65rem !important; font-size: .8rem !important; }

.actions-col { 
  white-space: nowrap; 
  display: flex; 
  gap: .5rem; 
  align-items: center; 
  flex-wrap: wrap;
  justify-content: flex-end;
}

/* ── Chips ───────────────────────────────────────────────────────────────── */
.tag-chip {
  display: inline-block; background: #f1f3f5; color: #495057;
  border-radius: 1rem; padding: .1rem .55rem;
  font-size: .75rem; margin: .1rem;
}

.condition-chip {
  display: inline-block; background: var(--cu-primary-lt); color: var(--cu-primary-dk);
  border-radius: 1rem; padding: .15rem .65rem;
  font-size: .75rem; font-weight: 600; margin: .1rem;
  border: 1px solid rgba(0,105,92,.2);
}

/* ── Card meta bar ───────────────────────────────────────────────────────── */
.card-meta-bar {
  display: flex; flex-wrap: wrap; gap: 1.25rem;
  font-size: .85rem; color: var(--pico-muted-color); margin-bottom: .5rem;
}
.tag-bar, .condition-bar { margin-bottom: .5rem; }

/* ── Card editor ─────────────────────────────────────────────────────────── */
.editor-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; margin-bottom: 1rem;
}
.editor-pane label { margin-bottom: .25rem; display: block; font-weight: 600; font-size: .85rem; }
.editor-pane textarea {
  width: 100%; height: 400px; resize: vertical;
  font-family: 'Menlo', 'Consolas', monospace; font-size: .88rem; line-height: 1.5; margin: 0;
}
.editor-label { font-weight: 600; font-size: .85rem; margin-bottom: .25rem; }
.preview-pane-content {
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 6px; padding: 1rem; min-height: 400px; max-height: 600px;
  overflow-y: auto; background: var(--pico-card-background-color, #fff);
}

.editor-tabs { display: none; gap: 0; margin-bottom: .75rem; border-bottom: 2px solid var(--pico-muted-border-color); }
.editor-tab {
  background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -2px;
  padding: .5rem 1rem; cursor: pointer; color: var(--pico-muted-color); font: inherit; font-size: .9rem;
}
.editor-tab.active { color: var(--cu-primary); border-bottom-color: var(--cu-primary); font-weight: 600; }

@media (max-width: 768px) {
  .editor-grid    { grid-template-columns: 1fr; }
  .editor-tabs    { display: flex; }
  .hidden-mobile  { display: none !important; }
  .visible-mobile { display: block !important; }
  .preview-col    { display: none; }
}

/* ── Form helpers ────────────────────────────────────────────────────────── */
.conditions-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: .4rem; margin-bottom: .5rem;
}
.condition-check { display: flex; align-items: center; gap: .4rem; font-weight: normal; cursor: pointer; }
.condition-check input { margin: 0; }

.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-grid-3 { display: grid; grid-template-columns: 1fr 1fr auto; gap: 1rem; align-items: end; }
@media (max-width: 600px) {
  .form-grid-2, .form-grid-3 { grid-template-columns: 1fr; }
}
.form-actions { display: flex; gap: .75rem; align-items: center; margin-top: 1rem; }

.editing-row td { background: var(--pico-card-sectioning-background-color, #f9f9f9); }
.inline-edit-form { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.inline-edit-form input,
.inline-edit-form button,
.inline-edit-form a { margin: 0; }

/* ── Symptom rows in template editor ────────────────────────────────────── */
.symptom-row { display: grid; grid-template-columns: 1fr 2fr auto; gap: .5rem; align-items: center; margin-bottom: .4rem; }
.symptom-row input { margin: 0; }

/* ── Stats page ──────────────────────────────────────────────────────────── */
.stats-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: 1rem; margin-bottom: 2rem;
}
.stat-card {
  text-align: center; padding: 1.5rem 1rem;
  border-top: 3px solid var(--cu-primary);
}
.stat-card h3 { font-size: 2.75rem; margin: 0 0 .25rem; color: var(--cu-primary); font-weight: 700; }
.stat-card p  { margin: 0; font-size: .82rem; color: var(--pico-muted-color); text-transform: uppercase; letter-spacing: .04em; }

/* ── Prose content ───────────────────────────────────────────────────────── */
.prose h2, .prose h3 { margin-top: 1.5rem; }
.prose ul, .prose ol  { padding-left: 1.5rem; }
.prose blockquote     { border-left: 4px solid var(--pico-muted-border-color); padding-left: 1rem; color: var(--pico-muted-color); }

/* ── Pagination ──────────────────────────────────────────────────────────── */
.pagination { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: 1rem; }
.pagination a, .pagination span {
  padding: .3rem .7rem; border-radius: 6px; font-size: .9rem; text-decoration: none;
}
.pagination a       { border: 1px solid var(--cu-primary); color: var(--cu-primary); }
.pagination a:hover { background: var(--cu-primary); color: #fff; }
.pagination span    { border: 1px solid var(--pico-muted-border-color); color: var(--pico-muted-color); }
.pagination .current{ background: var(--cu-primary); color: #fff; border-color: var(--cu-primary); }

/* ── Badges ──────────────────────────────────────────────────────────────── */
.badge-read     { display: inline-block; font-size: .75rem; color: #2e7d32; background: #e8f5e9; padding: .1rem .45rem; border-radius: 999px; margin-left: .35rem; }
.badge-active   { display: inline-block; padding: .15rem .6rem; border-radius: 999px; font-size: .8rem; font-weight: 600; background: #e8f5e9; color: #2e7d32; }
.badge-inactive { display: inline-block; padding: .15rem .6rem; border-radius: 999px; font-size: .8rem; font-weight: 600; background: #f5f5f5; color: #9e9e9e; }

/* ── Info browsing (caregiver) ───────────────────────────────────────────── */
.info-search-bar { margin-bottom: 1.5rem; }
.info-search-row { display: flex; gap: .5rem; align-items: center; margin-bottom: .5rem; }
.info-search-row input[type=search] { flex: 1; margin: 0; }
.info-search-row button,
.info-search-row a { margin: 0; white-space: nowrap; }
.info-filter-row { display: flex; gap: .5rem; flex-wrap: wrap; }
.info-filter-row select { flex: 1; min-width: 10rem; margin: 0; }

.info-card-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1.1rem;
}
.info-card-link { text-decoration: none; color: inherit; display: block; }
.info-card-link:hover .info-card { border-color: var(--cu-primary); box-shadow: 0 4px 16px rgba(0,137,123,.12); transform: translateY(-1px); }

.info-card {
  padding: 1.1rem 1.25rem; margin: 0; height: 100%;
  transition: border-color .15s, box-shadow .15s, transform .15s;
  border-radius: 8px;
}
.info-card-cat {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .06em;
  color: var(--cu-primary); font-weight: 700; margin-bottom: .4rem;
}
.info-card-title { font-size: .98rem; margin: 0 0 .75rem; color: var(--pico-color); font-weight: 600; }
.info-card-tags  { margin-top: auto; }

.info-card-nav {
  display: flex; align-items: center; gap: .75rem; margin-bottom: .75rem; flex-wrap: wrap;
}

.info-prose      { margin-top: 1.25rem; line-height: 1.75; }
.info-prose table{ font-size: .9rem; }

.info-tags-bar {
  margin-top: 1.25rem; display: flex; align-items: center; gap: .35rem; flex-wrap: wrap;
}
.related-list { padding-left: 1.25rem; margin: .5rem 0 0; }
.related-list li { margin-bottom: .4rem; }

@media (max-width: 600px) {
  .info-card-grid { grid-template-columns: 1fr; }
  .info-filter-row select { min-width: 0; }
}

/* ── Patient grid (caregiver) ────────────────────────────────────────────── */
.patients-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1.1rem;
}
.patient-card-link { text-decoration: none; color: inherit; display: block; }
.patient-card-link:hover .patient-card {
  border-color: var(--cu-primary); box-shadow: 0 4px 16px rgba(0,137,123,.12); transform: translateY(-1px);
}
.patient-card {
  padding: 1.25rem; margin: 0; height: 100%;
  transition: border-color .15s, box-shadow .15s, transform .15s;
  border-radius: 8px; border-left: 3px solid var(--cu-primary);
}
.patient-card-name { font-size: 1.05rem; margin: 0 0 .4rem; font-weight: 600; }
.patient-card-diag { margin: 0 0 .5rem; }

/* Patient info grid (clinician detail) */
.patient-info-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: .75rem 1.5rem; margin-bottom: 1rem;
}
.patient-info-grid > div { border-left: 3px solid var(--cu-primary-lt); padding-left: .75rem; }

/* Patient info card (caregiver view) */
.patient-info-card {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: .6rem 1.5rem;
  background: var(--pico-card-background-color, #fff);
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 8px; padding: 1.1rem 1.25rem; margin-bottom: 1.25rem;
  box-shadow: var(--cu-shadow-sm);
}
.patient-info-row { display: flex; flex-direction: column; gap: .15rem; }
.patient-info-row .text-muted { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; }

/* ── Symptom entry form ───────────────────────────────────────────────────── */
.symptom-slider-row {
  margin-bottom: 1rem; padding: .85rem 1.1rem;
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 8px; background: var(--pico-card-background-color, #fff);
  box-shadow: var(--cu-shadow-sm);
}
.symptom-slider-header {
  display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .4rem;
}
.symptom-value-display {
  font-size: 1.6rem; font-weight: 700; min-width: 2.5rem; text-align: right; transition: color .2s;
}
.val-low  { color: #2e7d32; }
.val-mid  { color: #b84500; }
.val-high { color: #c62828; }
.symptom-slider { width: 100%; margin: .25rem 0; cursor: pointer; }
.symptom-scale-labels {
  display: flex; justify-content: space-between;
  font-size: .73rem; color: var(--pico-muted-color); margin-top: .1rem;
}

/* ── Wellbeing & symptom badges ──────────────────────────────────────────── */
.wellbeing-badge {
  display: inline-block; padding: .15rem .6rem;
  border-radius: 1rem; font-size: .82rem; font-weight: 600;
}
.wb-bad  { background: #fdecea; color: #c62828; }
.wb-mid  { background: #fff3e0; color: #b84500; }
.wb-good { background: #e8f5e9; color: #2e7d32; }

.sym-badge {
  display: inline-block; padding: .08rem .45rem;
  border-radius: .75rem; font-size: .75rem; margin: .1rem .1rem .1rem 0;
}
.sym-low  { background: #e8f5e9; color: #1b5e20; }
.sym-mid  { background: #fff3e0; color: #b84500; }
.sym-high { background: #fdecea; color: #c62828; }

/* ── Entry list ──────────────────────────────────────────────────────────── */
.entry-list { display: flex; flex-direction: column; gap: .6rem; }

.entry-row {
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 8px; padding: .85rem 1rem;
  display: grid; grid-template-columns: 9rem auto; gap: .25rem .75rem;
  align-items: start; background: var(--pico-card-background-color, #fff);
  box-shadow: var(--cu-shadow-sm);
  transition: border-color .15s;
}
.entry-row:hover { border-color: var(--pico-muted-color); }
.entry-row-alert { border-color: #ef9a9a; background: #fffbfa; border-left: 3px solid #c62828; }

.entry-date      { grid-column: 1; grid-row: 1; color: var(--pico-muted-color); font-size: .85rem; }
.entry-wellbeing { grid-column: 2; grid-row: 1; }
.entry-symptoms  { grid-column: 1 / -1; }
.entry-notes     { grid-column: 1 / -1; margin-top: .25rem; }

@media (max-width: 600px) {
  .patients-grid { grid-template-columns: 1fr; }
  .entry-row { grid-template-columns: 1fr; }
  .entry-date, .entry-wellbeing, .entry-symptoms, .entry-notes { grid-column: 1; grid-row: auto; }
}

/* ── Dashboard ───────────────────────────────────────────────────────────── */
.dash-period {
  display: flex; flex-wrap: wrap; margin-bottom: 1.25rem;
  border: 1px solid var(--pico-muted-border-color); border-radius: 8px;
  overflow: hidden; width: fit-content;
}
.dash-period-btn {
  padding: .4rem 1rem; font-size: .85rem; text-decoration: none;
  color: var(--pico-muted-color); border-right: 1px solid var(--pico-muted-border-color);
  transition: background .15s;
}
.dash-period-btn:last-child { border-right: none; }
.dash-period-btn:hover      { background: var(--cu-primary-lt); color: var(--cu-primary-dk); }
.dash-period-btn.active     { background: var(--cu-primary); color: #fff; }

.chart-wrapper { position: relative; height: 240px; margin-bottom: 1.5rem; }

/* ── Report / print ──────────────────────────────────────────────────────── */
.report-table th, .report-table td { font-size: .8rem; }
.report-alert-row { background: #fff8f0; }
.print-body { padding-bottom: 0 !important; }

@media print {
  .site-header, .emergency-btn, .flash-bar, .no-print { display: none !important; }
  .page-header a[role="button"], .page-header .actions-col, .actions-col { display: none !important; }
  .print-body { padding: 0 !important; }
  #main-content { padding-top: .5rem !important; padding-bottom: 0 !important; }
  a { color: inherit !important; text-decoration: none !important; }
  .report-alert-row { background: #fff8f0 !important; -webkit-print-color-adjust: exact; }
  .wb-bad  { background: #fdecea !important; -webkit-print-color-adjust: exact; }
  .wb-mid  { background: #fff3e0 !important; -webkit-print-color-adjust: exact; }
  .wb-good { background: #e8f5e9 !important; -webkit-print-color-adjust: exact; }
  .sym-high { background: #fdecea !important; -webkit-print-color-adjust: exact; }
  .sym-mid  { background: #fff3e0 !important; -webkit-print-color-adjust: exact; }
  .sym-low  { background: #e8f5e9 !important; -webkit-print-color-adjust: exact; }
  .info-card-nav, .info-tags-bar .text-muted { display: none !important; }
  .info-prose { font-size: 11pt; line-height: 1.6; }
}

/* ── Mobile nav ──────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .site-header nav { 
    flex-wrap: nowrap; 
    overflow-x: auto;
    -webkit-overflow-scrolling: touch; 
    scrollbar-width: none;
  }
  .site-header nav::-webkit-scrollbar { display: none; }
  .site-header nav > ul { flex-wrap: nowrap; }
  .site-header nav > ul:last-child > li { white-space: nowrap; }
  .nav-user-name { display: none; }
  .nav-logout-item { flex-shrink: 0; }
}

/* ── Help page ───────────────────────────────────────────────────────────── */
.help-hint {
  display: block; color: var(--pico-muted-color); font-size: .8rem; margin-top: .2rem; line-height: 1.4;
}
.help-section {
  border: 1px solid var(--pico-muted-border-color); border-radius: 8px; margin-bottom: .75rem; overflow: hidden;
}
.help-section summary {
  padding: .9rem 1.25rem; background: var(--pico-card-sectioning-background-color, #f9f9f9);
  font-weight: 600; cursor: pointer; list-style: none;
  display: flex; justify-content: space-between; align-items: center;
}
.help-section summary::-webkit-details-marker { display: none; }
.help-section summary::after { content: '▸'; font-size: .85rem; color: var(--pico-muted-color); }
.help-section[open] summary::after { content: '▾'; }
.help-section-body { padding: 1rem 1.25rem; }
.help-section-body p, .help-section-body li { font-size: .95rem; line-height: 1.65; }
.help-section-body h4 { margin-top: 1rem; margin-bottom: .35rem; font-size: .95rem; }
.help-step { display: flex; gap: .75rem; align-items: flex-start; margin-bottom: .75rem; }
.help-step-num {
  flex-shrink: 0; width: 1.75rem; height: 1.75rem; border-radius: 50%;
  background: var(--cu-primary); color: #fff; font-weight: 700; font-size: .85rem;
  display: flex; align-items: center; justify-content: center;
}
.help-step-text { flex: 1; line-height: 1.6; font-size: .95rem; }

/* ── Nav links ───────────────────────────────────────────────────────────── */
.nav-help-link { opacity: .7; font-size: .85rem; }
.nav-help-link:hover { opacity: 1; }
.nav-account-link { color: inherit; text-decoration: none; }
.nav-account-link:hover { text-decoration: underline; }

/* ── Related cards ───────────────────────────────────────────────────────── */
.related-cards { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--pico-muted-border-color); }
.related-cards h3 { font-size: 1rem; margin-bottom: .5rem; }
.related-cards ul { padding-left: 1.25rem; margin: 0; }
.related-cards li { margin-bottom: .35rem; }

/* ── Mobile action buttons ───────────────────────────────────────────────── */
@media (max-width: 600px) {
  .page-header { flex-direction: column; align-items: stretch; }
  .page-header h2 { text-align: center; margin-bottom: 0.5rem; }
  .page-header .actions-col { 
    flex-direction: row; 
    flex-wrap: wrap; 
    justify-content: center;
    gap: 0.4rem;
  }
  .page-header .actions-col > * { flex: 0 1 auto; min-width: auto; }
  .symptom-slider { height: 2rem; }
  .symptom-value-display { font-size: 2rem; }
}

/* ── Patient Status Badges ──────────────────────────────────────────────────── */
.patient-badge {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  padding: .2rem .5rem;
  border-radius: 999px;
  font-size: .7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.patient-badge--active {
  background: #e8f5e9;
  color: #2e7d32;
}

.patient-badge--attention {
  background: #fff8e1;
  color: #e65100;
}

.patient-badge--alert {
  background: #ffebee;
  color: #c62828;
}

.patient-badge--archived {
  background: #f5f5f5;
  color: #757575;
}

.patient-badge::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

/* ── Enhanced Cards ──────────────────────────────────────────────────────────── */
.patient-card {
  background: #fff;
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 8px;
  padding: 1rem;
  box-shadow: var(--cu-shadow-sm);
  transition: box-shadow .2s ease, transform .2s ease;
}

.patient-card:hover {
  box-shadow: var(--cu-shadow-md);
  transform: translateY(-1px);
}

.patient-card--archived {
  opacity: .75;
  background: #fafafa;
}

/* ── Table Row Enhancements ──────────────────────────────────────────────────── */
table tbody tr {
  transition: background-color .15s ease;
}

table tbody tr:hover {
  background: var(--cu-primary-lt);
}

/* ── Quick Stats ──────────────────────────────────────────────────────────────── */
.quick-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: .75rem;
  margin-bottom: 1.5rem;
}

.stat-box {
  background: #fff;
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 8px;
  padding: .75rem;
  text-align: center;
  box-shadow: var(--cu-shadow-sm);
}

.stat-box-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--cu-primary);
}

.stat-box-label {
  font-size: .75rem;
  color: var(--pico-muted-color);
  text-transform: uppercase;
  letter-spacing: .05em;
}

/* ── Situation-first emergency flow ──────────────────────────────────────── */
.situation-question {
  font-size: 1.5rem;
  margin-bottom: .25rem;
}

.situation-intro {
  font-size: 1.05rem;
  margin-bottom: 1.25rem;
}

.situation-patient-picker {
  margin-bottom: 1rem;
  max-width: 320px;
}

.situation-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: .75rem;
}

.situation-tile {
  display: flex;
  align-items: center;
  min-height: 4.5rem;
  padding: 1rem 1.15rem;
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--cu-primary-dk);
  background: #fff;
  border: 2px solid var(--cu-primary-lt);
  border-radius: 10px;
  text-decoration: none;
  box-shadow: var(--cu-shadow-sm);
}

.situation-tile:hover,
.situation-tile:focus {
  background: var(--cu-primary-lt);
  border-color: var(--cu-primary);
}

.situation-emergency-note {
  margin-top: 1.5rem;
  padding: .85rem 1rem;
  border: 1px solid #ef9a9a;
  border-left: 4px solid #c62828;
  border-radius: 6px;
  background: #fdecea;
  font-size: .95rem;
}

/* Guião de acção: os passos são o conteúdo, não o texto à volta. */
.algoritmo ol {
  counter-reset: passo;
  list-style: none;
  padding-left: 0;
}

.algoritmo ol > li {
  counter-increment: passo;
  position: relative;
  padding: .85rem 1rem .85rem 3rem;
  margin-bottom: .6rem;
  font-size: 1.05rem;
  line-height: 1.45;
  background: #fff;
  border: 1px solid var(--pico-muted-border-color);
  border-left: 4px solid var(--cu-primary);
  border-radius: 8px;
}

.algoritmo ol > li::before {
  content: counter(passo);
  position: absolute;
  left: .9rem;
  top: .8rem;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 50%;
  background: var(--cu-primary);
  color: #fff;
  font-weight: 700;
  font-size: .9rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.algoritmo h2 {
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-top: 1.75rem;
}

.algoritmo details {
  margin-top: 2rem;
}

.algoritmo-plano {
  margin-top: 1.5rem;
  padding: 1rem;
  border: 1px solid var(--cu-primary-lt);
  border-radius: 8px;
  background: var(--cu-primary-lt);
}

.algoritmo-plano h3 {
  font-size: 1rem;
  margin: 0 0 .5rem;
}

.algoritmo-plano-indicacoes {
  font-size: 1rem;
  margin-bottom: .75rem;
}

.algoritmo-plano-medicacao {
  margin: 0 0 .5rem;
  white-space: pre-wrap;
  font-family: inherit;
  font-size: .9rem;
}

.situation-reassurance {
  margin-top: 1.5rem;
  padding: .75rem 1rem;
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 8px;
}

.situation-footer {
  position: sticky;
  bottom: 0;
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
  margin-top: 2rem;
  padding: .75rem 0;
  background: var(--pico-background-color);
  border-top: 1px solid var(--pico-muted-border-color);
}

.situation-footer-team {
  font-size: .9rem;
}

.situation-footer-112 {
  background: #c62828;
  border-color: #c62828;
}

/* Painel "A sua equipa" na ficha da pessoa cuidada */
.team-panel {
  margin-top: 1.25rem;
  padding: 1rem;
  border: 1px solid var(--cu-primary-lt);
  border-left: 4px solid var(--cu-primary);
  border-radius: 8px;
  background: #fff;
}

.team-panel-title {
  font-size: 1rem;
  margin: 0 0 .5rem;
}

.team-panel-line {
  margin: 0 0 .35rem;
  font-size: .95rem;
}

.team-panel-actions {
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
  margin-top: .5rem;
}

.team-panel-contact {
  font-size: .9rem;
  font-weight: 600;
}

.entry-reply {
  margin-top: .4rem;
  padding: .5rem .75rem;
  border-radius: 6px;
  background: var(--cu-primary-lt);
  font-size: .9rem;
}

@media (max-width: 640px) {
  .situation-grid { grid-template-columns: 1fr; }
  .situation-tile { min-height: 3.75rem; font-size: 1.05rem; }
}

/* CUIDAR care experience — shared tokens and responsive shells */
:root:not([data-theme=dark]), [data-theme=light] {
  --pico-font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --pico-font-size: 100%; --pico-line-height: 1.6;
  --pico-background-color: #f7f8f4; --pico-color: #253d36;
  --pico-muted-color: #63766e; --pico-muted-border-color: #dce4dc;
  --pico-primary: #1a6455; --pico-primary-background: #1a6455; --pico-primary-border: #1a6455;
  --pico-primary-hover: #124c40; --pico-primary-hover-background: #124c40; --pico-primary-hover-border: #124c40;
  --pico-primary-focus: rgba(26,100,85,.22); --pico-primary-inverse: #fff;
  --pico-secondary: #456659; --pico-secondary-background: #edf2ec; --pico-secondary-border: #d5e0d5; --pico-secondary-inverse: #294b3e;
  --pico-secondary-hover-background: #e1eae1; --pico-secondary-hover-border: #bfd0c1; --pico-secondary-hover-inverse: #203c31;
  --pico-card-background-color: #fff; --pico-card-sectioning-background-color: #f5f7f2;
  --pico-form-element-background-color: #fff; --pico-form-element-border-color: #c7d4c9;
  --pico-border-radius: .7rem;
  --cu-primary: #1a6455; --cu-primary-dk: #124c40; --cu-primary-lt: #eaf3ea;
}
body { font-family:var(--pico-font-family); color:var(--pico-color); }
h1,h2,h3 { color:#233e33; letter-spacing:-.035em; line-height:1.2; }
h1 { font-size:clamp(2rem,3.3vw,3rem); font-weight:650; }
h2 { font-size:1.45rem; } h3 { font-size:1.2rem; }
button,[role=button] { font-size:.94rem; font-weight:600; }
a { text-underline-offset:.2em; }
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #59846c; outline-offset:4px; }
main.container { max-width:1180px; padding-top:2.6rem; padding-bottom:2rem; }
.site-header { background:#fff; border-bottom:1px solid #e0e7dc; box-shadow:none; }
.app-header { max-width:1440px; padding:1rem 2rem; display:flex; align-items:center; gap:2rem; }
.site-brand { display:flex; flex-direction:column; line-height:1.1; font-weight:800; font-size:1.35rem; letter-spacing:.13em; }
.site-brand span { font-size:.58rem; letter-spacing:.035em; font-weight:400; margin-top:.3rem; color:#63766e; }
.site-header .desktop-nav { margin-left:auto; display:flex; gap:1.6rem; align-items:center; padding:0; overflow:visible; }
.desktop-nav a { color:#4f675b; font-size:.93rem; text-decoration:none; padding:.4rem 0; }
.desktop-nav a[aria-current=page] { color:#1a6455; font-weight:700; box-shadow:0 2px #1a6455; }
.account-menu { position:relative; margin:0; min-width:75px; }
.account-menu summary { color:#365547; font-size:.9rem; list-style:none; cursor:pointer; }
.account-menu summary:after { display:none; }
.account-menu-panel { position:absolute; top:2.2rem; right:0; z-index:300; width:260px; max-height:75vh; overflow:auto; background:white; border:1px solid #dce4dc; border-radius:12px; box-shadow:0 12px 30px #183d2920; padding:1rem; }
.account-menu-panel a,.account-menu-panel strong,.account-menu-panel form { display:block; padding:.4rem 0; }
.account-menu-panel strong { font-size:.85rem; color:#617367; }
.care-heading { display:flex; justify-content:space-between; align-items:center; gap:2rem; margin-bottom:2rem; }
.care-heading h1 { margin:.45rem 0 .75rem; }
.care-heading p { color:#65766c; margin:0; }
.section-kicker { text-transform:uppercase; letter-spacing:.11em; font-size:.68rem; font-weight:700; color:#55745e; }
.care-panel { background:#fff; padding:1.7rem; border:1px solid #dfe6db; border-radius:1rem; margin:0 0 1.25rem; box-shadow:0 2px 5px #26402b03; }
.care-panel h2,.care-panel h3 { margin:.5rem 0 1rem; }
.care-panel p:last-child { margin-bottom:0; }
.home-grid { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(0,1fr); gap:1.5rem; }
.home-primary,.home-secondary { min-width:0; }
.daily-card { background:#e9f1e4; border:1px solid #d8e6d0; border-radius:1rem; padding:2rem; margin-bottom:1.25rem; position:relative; overflow:hidden; }
.daily-card h2 { font-size:1.9rem; max-width:440px; margin:.9rem 0 1rem; }
.daily-card p { color:#48634e; max-width:460px; }
.daily-card .daily-meta { font-size:.8rem; }
.daily-card [role=button] { margin:1rem 0 0; min-height:48px; }
.daily-card:after { content:''; width:220px; height:220px; border:35px solid #cedfc029; border-radius:50%; position:absolute; right:-100px; top:-80px; pointer-events:none; }
.preserve-lines { white-space:pre-wrap; overflow-wrap:anywhere; }
.care-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.8rem; margin-top:1rem; }
.care-actions form,.care-actions button,.care-actions [role=button] { margin-bottom:0; }
.text-action { color:#1a6455; font-size:.91rem; font-weight:600; text-decoration:none; }
.text-action:hover { text-decoration:underline; }
.help-card { background:#fcfaf4; border-color:#e9e0cf; }
.assistant-teaser { background:#f0f3ec; }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.recent-observation { display:flex; flex-wrap:wrap; gap:.7rem 1.4rem; border-top:1px solid #e4eadf; padding:1rem 0; font-size:.85rem; }
.recent-observation .text-muted { flex-basis:100%; }
.reply-panel { border-left:4px solid #618167; }
.reply-text { margin:1rem 0; padding:1rem; background:#f3f6ef; border:0; border-radius:.6rem; color:#284934; white-space:pre-wrap; }
.reply-text footer { margin-top:.7rem; color:#63766e; font-size:.78rem; }
.care-notice { background:#fcf5e6; border:1px solid #e5d6b5; border-left:4px solid #a77921; border-radius:.8rem; padding:1rem 1.3rem; margin-bottom:1.5rem; font-size:.94rem; }
.care-notice p { margin:.5rem 0; }
.notification-warning { color:#896620; }
.person-picker { max-width:380px; margin-bottom:1.7rem; }
.person-picker label { font-size:.8rem; font-weight:600; }
.picker-controls { display:flex; gap:.5rem; }
.picker-controls select,.picker-controls button { margin:0; }
.checkin-form { max-width:760px; margin:0 auto; }
.checkin-form legend { font-weight:700; padding:0 .4rem; }
.checkin-row { display:grid; grid-template-columns:1fr minmax(170px,.75fr); align-items:center; gap:1rem; border-top:1px solid #e5eadd; padding:1.1rem 0; }
.checkin-row label,.checkin-row select { margin:0; }
.checkin-row small { display:block; font-size:.75rem; font-weight:400; margin-top:.25rem; color:#62756a; }
.review-list { display:grid; grid-template-columns:1fr auto; gap:.7rem 1rem; }
.review-list dd { text-align:right; font-weight:600; }
.empty-state { text-align:center; max-width:720px; margin:3rem auto; padding:3rem; }
.conversation-title { margin:2rem 0 1rem; }
.conversation-meta { display:flex; gap:.7rem; flex-wrap:wrap; align-items:center; color:#65766e; font-size:.75rem; margin-bottom:1rem; }
.status-pill { background:#eef3e9; color:#355846; padding:.25rem .65rem; border-radius:2rem; font-size:.72rem; font-weight:600; }
.message-bubble { padding:1.2rem; background:#f6f7f2; border-radius:.7rem; margin:1rem 0; }
.message-bubble p { margin:.5rem 0; }
.message-team { background:#eaf2e7; border-left:3px solid #698b6d; }
.message-bubble strong,.message-bubble small { font-size:.8rem; }
.checkbox-label { display:flex; align-items:flex-start; gap:.75rem; font-size:.86rem; }
.checkbox-label input { flex-shrink:0; margin-top:.35rem; }
.inbox-overview { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:1rem; }
.inbox-overview .care-panel { display:flex; flex-direction:column; gap:.3rem; margin:0; }
.inbox-overview strong { font-size:2rem; color:#345e42; }
.inbox-overview span { font-size:.85rem; color:#627166; }
.inbox-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-top:2rem; }
.inbox-urgent { border-left:4px solid #ae4838; }
.inbox-item small { display:block; font-size:.76rem; line-height:1.6; }
.assistant-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:1.5rem; align-items:start; }
.assistant-intro { display:flex; align-items:flex-start; gap:1rem; margin-bottom:2rem; }
.assistant-mark { display:grid; place-items:center; width:44px; height:44px; border-radius:14px; background:#e1eddb; color:#345b3f; font-weight:700; flex-shrink:0; }
.assistant-intro h2 { margin:0 0 .75rem; }
.assistant-intro p { font-size:.9rem; }
.assistant-suggestions { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.2rem; }
.assistant-suggestions button { margin:0; }
.assistant-answer { padding:1.4rem; background:#f0f5ec; border-radius:.8rem; margin-bottom:1.8rem; }
.source-passage { border-left:3px solid #7c9875; color:#2c4634; padding-left:1rem; }
.source-passage footer { font-size:.78rem; }
.content-review-row { display:grid; grid-template-columns:1fr 260px; gap:1.5rem; border-top:1px solid #e2e8dc; padding:1.3rem 0; }
.review-actions { display:flex; flex-direction:column; gap:.6rem; }
.review-actions form { margin:0; }
.review-actions label { font-size:.8rem; }
.review-actions input { margin-bottom:.5rem; }
.coverage-row { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem; padding:.75rem 0; border-top:1px solid #e2e8dc; font-size:.88rem; }
.coverage-ready { color:#315c38; } .coverage-gap { color:#8b6326; }
.urgent-access { max-width:1180px; margin:0 auto; padding:0 1rem; }
.urgent-access a { display:flex; align-items:center; gap:.7rem; background:#fbf0ed; color:#913d32; border:1px solid #efd9d3; border-radius:.8rem; padding:.9rem 1.2rem; font-weight:600; font-size:.9rem; text-decoration:none; }
.urgent-access a span:last-child { margin-left:auto; }
.urgent-dot { width:8px; height:8px; border-radius:50%; background:#b55544; }
.mobile-care-nav { display:none; }
.site-footer { background:transparent; margin-top:2rem; padding:2rem 0; }
.site-footer .footer-links a { color:#536a5d; font-size:.8rem; }
.site-footer .footer-version { font-size:.7rem; color:#6a7c70; }
.auth-shell main { padding-top:4rem; }
.login-wrapper { border:1px solid #dae3d6; box-shadow:0 15px 50px #23412908; border-radius:1.2rem; }
.situation-footer { position:static; margin:2rem 0 0; border:1px solid #e0e7dc; border-radius:.8rem; box-shadow:none; background:#fff; padding:1.2rem; }
.situation-footer-112 { background:#a8382b; border-color:#a8382b; color:#fff; }
iframe.preview-pane-content { width:100%; min-height:520px; border:1px solid #dce4dc; }
@media(max-width:768px) {
  .app-header { padding:.85rem 1rem; justify-content:space-between; }
  .site-header .desktop-nav { display:none; }
  .site-brand { font-size:1.13rem; }
  main.container { padding:1.5rem 1rem; }
  .care-heading { align-items:flex-start; flex-direction:column; gap:.8rem; margin-bottom:1.5rem; }
  .care-heading h1 { font-size:2.2rem; }
  .home-grid,.inbox-grid,.assistant-layout { grid-template-columns:1fr; }
  .care-panel { padding:1.3rem; border-radius:.85rem; }
  .daily-card { padding:1.6rem; }
  .daily-card h2 { font-size:1.65rem; }
  .home-secondary { display:grid; grid-template-columns:1fr; }
  .section-heading { align-items:flex-start; flex-direction:column; gap:.25rem; }
  .checkin-row { grid-template-columns:1fr; gap:.6rem; }
  .checkin-row select { min-height:48px; }
  .inbox-overview { gap:.5rem; }
  .inbox-overview .care-panel { padding:1rem .7rem; }
  .inbox-overview span { font-size:.72rem; }
  .content-review-row { grid-template-columns:1fr; }
  .caregiver-shell { padding-bottom:80px; }
  .mobile-care-nav { display:flex; position:fixed; bottom:0; left:0; right:0; z-index:200; background:#fff; border-top:1px solid #dce5d6; padding:.35rem .5rem calc(.35rem + env(safe-area-inset-bottom)); box-shadow:0 -3px 14px #2a482607; }
  .mobile-care-nav a { flex:1; color:#687b6c; text-align:center; font-size:.82rem; font-weight:600; padding:1rem .2rem; text-decoration:none; border-radius:.6rem; min-height:48px; }
  .mobile-care-nav a[aria-current=page] { color:#285939; background:#edf3e7; }
  .situation-footer { position:sticky; bottom:80px; z-index:80; margin-top:2rem; }
  .empty-state { padding:2rem 1rem; }
}
@media(prefers-reduced-motion:reduce) { *,*:before,*:after { animation:none!important; scroll-behavior:auto!important; transition:none!important; } }
@media print {
  .account-menu,.mobile-care-nav,.urgent-access,.site-footer { display:none!important; }
  body { background:#fff; padding:0!important; }
  .care-panel { break-inside:avoid; box-shadow:none; }
}

/* Urgent entry remains reachable in the header on every caregiver screen. */
.header-urgent { color:#922c30; font-weight:650; font-size:.85rem; white-space:nowrap; margin-left:auto; }
@media (max-width:768px) { .app-header { gap:.7rem; } .header-urgent { font-size:.75rem; } }