/* The card of an admitted patient on the app's Home (static/patient_app_stay.js, 5 Oct 2026).
   It sits in the glass look of the Home tab (gh-glass, gh-cap) and adds only what is its own. */
.st-card { padding:18px 16px 16px; }
.st-where { margin:4px 0 2px; font-size:21px; font-weight:600; letter-spacing:-.02em; color:var(--g-ink); }
.st-wait { height:180px; border-radius:26px; background:rgba(255,255,255,.55); }
.st-part { margin-top:16px; padding-top:14px; border-top:1px solid rgba(16,24,40,.08); }
.st-part h3 { margin:0 0 10px; font-size:14px; font-weight:600; letter-spacing:.01em; color:var(--g-soft); }
.st-note { margin:10px 2px 0; font-size:13px; font-weight:500; line-height:1.45; color:var(--g-soft); }
.st-note.good { color:#0F6B3A; }
.st-note.wait { padding:9px 12px; border-radius:14px; background:#FFF7E6; color:#7A4B00; }
.st-note.bad { padding:9px 12px; border-radius:14px; background:rgba(217,72,43,.12); color:#8E2A14; }

/* the four call buttons: two by two, the urgent one in red. The sister's is the app's own orange - it was
   the staff side's blue until he asked, three ways in one morning, why blue had come into the patient app
   (7 Oct 2026); the bedside page (bed.html) wears the same four colours. */
.st-calls { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.st-callbox { display:flex; flex-direction:column; gap:6px; min-width:0; }
.st-call { display:flex; flex-direction:column; align-items:flex-start; gap:4px; width:100%; min-height:104px; padding:12px 12px 11px; border:0; border-radius:20px;
  background:#FFF0E6; color:#7A2E06; font:inherit; text-align:left; -webkit-tap-highlight-color:transparent; transition:transform .12s ease; }
.st-call:active { transform:scale(.97); }
.st-call i { display:grid; place-items:center; width:38px; height:38px; border-radius:13px; background:#E2570F; color:#fff; }
.st-call i svg { width:22px; height:22px; }
.st-call b { font-size:15.5px; font-weight:600; line-height:1.2; }
.st-call small { font-size:12px; font-weight:500; line-height:1.3; opacity:.8; }
.st-callbox.urgent .st-call { background:#FDEBE7; color:#8E1F0B; }
.st-callbox.urgent .st-call i { background:#D9482B; }
.st-callbox.housekeeping .st-call { background:#E9F7EF; color:#0F5B33; }
.st-callbox.housekeeping .st-call i { background:#16A34A; }
.st-callbox.food .st-call { background:#FFF7D6; color:#6B4A00; }
.st-callbox.food .st-call i { background:#D98E04; }
.st-callbox.live .st-call { opacity:.62; }
.st-state { padding:6px 10px; border-radius:12px; background:#FFF7E6; color:#7A4B00; font-size:12.5px; font-weight:600; line-height:1.3; }
.st-state.on { background:#E9F7EF; color:#0F5B33; }
.st-state.done { background:rgba(16,24,40,.06); color:var(--g-soft); }
.st-undo { align-self:flex-start; padding:4px 2px; border:0; background:none; font:inherit; font-size:12.5px; font-weight:600; color:#B4500A; text-decoration:underline; }

/* food and drink now */
.st-stage { padding:12px 14px; border-radius:18px; background:#FFF1E2; }
.st-stage b { display:block; font-size:18px; font-weight:600; color:#8A3F06; }
.st-stage p { margin:4px 0 0; font-size:14px; font-weight:500; line-height:1.45; color:var(--g-ink); }
.st-diet.nbm .st-stage, .st-diet.sips .st-stage { background:#FDEBE7; }
.st-diet.nbm .st-stage b, .st-diet.sips .st-stage b { color:#8E1F0B; }
.st-diet.normal .st-stage { background:#E9F7EF; }
.st-diet.normal .st-stage b { color:#0F5B33; }
.st-cap { display:inline-block; margin:12px 0 8px; padding:3px 11px; border-radius:99px; font-size:12px; font-weight:600; }
.st-cap.ok { background:#E9F7EF; color:#0F5B33; }
.st-cap.no { background:#FDEBE7; color:#8E1F0B; }
.st-foods { display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; }
.st-food { display:flex; flex-direction:column; align-items:center; gap:5px; padding:8px 4px 9px; border-radius:16px; background:rgba(255,255,255,.75); text-align:center; }
.st-food img, .st-food i { width:56px; height:56px; border-radius:50%; object-fit:cover; background:#F1F5FB; }
.st-food b { font-size:12.5px; font-weight:600; line-height:1.25; color:var(--g-ink); }
.st-avoid { margin:0; padding:0 0 0 18px; font-size:14px; font-weight:500; line-height:1.6; color:var(--g-ink); }

/* medicines, money, visits */
.st-list, .st-visits { margin:0; padding:0; list-style:none; }
.st-list li { display:flex; flex-direction:column; gap:1px; padding:9px 12px; margin-bottom:6px; border-radius:14px; background:#FFF7E6; }
.st-list li.done { background:#E9F7EF; }
.st-list b { font-size:14.5px; font-weight:600; color:var(--g-ink); }
.st-list span { font-size:13px; font-weight:500; color:var(--g-soft); }
.st-due { display:flex; justify-content:space-between; align-items:baseline; padding:8px 2px; font-size:15px; font-weight:500; color:var(--g-ink); }
.st-due b { font-size:17px; font-weight:600; font-variant-numeric:tabular-nums; }
.st-due.paid { border-top:1px solid rgba(20,40,80,.08); }
.st-due.paid b { color:#1E8E5A; }
.st-btns { display:flex; flex-direction:column; gap:8px; margin-top:8px; }
.st-btns .gs-cta { margin-top:0; }
.st-quiet { min-height:46px; padding:0 16px; border:1.5px solid rgba(238,90,14,.35); border-radius:16px; background:rgba(255,255,255,.72); color:#C2410C; font:inherit; font-size:15px; font-weight:600; }
.st-visits li { display:flex; gap:12px; align-items:baseline; padding:7px 2px; border-bottom:1px solid rgba(16,24,40,.06); font-size:14px; }
.st-visits li:last-child { border-bottom:0; }
.st-visits span { flex:none; width:92px; font-weight:500; color:var(--g-soft); font-variant-numeric:tabular-nums; }
.st-visits b { font-weight:600; color:var(--g-ink); }
.st-visits li.doctor b { color:#7A2E06; }

/* the advance screen's amounts */
.st-chips { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:4px 0 14px; }
.st-chips button { min-height:48px; border:1.5px solid rgba(16,24,40,.12); border-radius:16px; background:#F6F8FC; font:inherit; font-size:16px; font-weight:600; color:var(--g-ink); font-variant-numeric:tabular-nums; }

/* What the call is for, and the sister's one line back (6 Oct 2026). The box of a call that is
   out takes the whole row, so its list is read at a glance and tapped with a thumb. */
.st-callbox.wide { grid-column:1 / -1; }
.st-needs { display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:10px 12px; border-radius:16px; background:rgba(255,255,255,.7); border:1px solid rgba(20,40,80,.08); }
.st-needs > span { flex:1 0 100%; font-size:13px; font-weight:600; color:var(--g-soft); }
.st-needs button { min-height:40px; padding:6px 14px; border-radius:999px; border:1.5px solid rgba(20,40,80,.16); background:#fff; font:inherit; font-size:14px; font-weight:600; color:var(--g-ink); }
.st-needs button.on { background:#EE5A0E; border-color:#EE5A0E; color:#fff; }
/* "Need help" stands for several things: they are said in small letters under it, not as more buttons. */
.st-needs button small { display:block; margin-top:1px; font-size:12px; font-weight:500; color:var(--g-soft); line-height:1.25; }
.st-needs button.on small { color:rgba(255,255,255,.92); }
.st-needs button:focus-visible { outline:3px solid #EE5A0E; outline-offset:2px; }
/* The app is orange and glass (3 Oct 2026); this came in blue with the ring and he asked why (7 Oct 2026). */
.st-reply { padding:8px 12px; border-radius:14px 14px 14px 4px; background:#FFF1E2; color:#7A3A06; border:1px solid #F8DCC3; font-size:14px; font-weight:600; line-height:1.35; align-self:flex-start; }