/*
 * Patient Portal — Stylesheet
 * Loaded AFTER styles.css; inherits all CSS variables.
 *
 * Sections:
 *   1. Insights Panel (#insightsPanel)
 *   2. Patient Profile Sheet (.pt-sheet)
 *   3. Consult Modal (.consult-overlay)
 *   4. Chat Header Overrides
 *   5. Home Screen Patient Customisation
 *   6. Responsive
 */

/* ═══ 1. INSIGHTS PANEL ═══ */

@media(max-width:1023px){
  #insightsPanel{display:none;flex-direction:column;position:fixed;inset:0;z-index:20;background:var(--srf)}
  #insightsPanel.show{display:flex}
}
@media(min-width:1024px){
  #insightsPanel{width:0;flex-shrink:0;display:flex;flex-direction:column;height:100dvh;overflow:hidden;transition:width .28s var(--ease);border-left:1px solid var(--bd);background:var(--srf)}
  #insightsPanel.show{width:320px}
}

/* Drag handle — mobile only */
.inp-drag{display:none;width:36px;height:4px;background:var(--bd);border-radius:4px;margin:10px auto 4px;flex-shrink:0}
@media(max-width:1023px){.inp-drag{display:block}}

/* Header */
.inp-hdr{display:flex;align-items:center;gap:8px;padding:14px 16px 10px;border-bottom:1px solid var(--bd);flex-shrink:0;background:var(--srf)}
.inp-hdr-icon{width:28px;height:28px;border-radius:8px;background:var(--or-l);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.inp-hdr-icon svg{width:14px;height:14px;stroke:var(--or)}
.inp-title{font-size:14px;font-weight:600;color:var(--t1)}
.inp-sub{font-size:11px;color:var(--t3);margin-top:1px}
.inp-close{margin-left:auto;width:26px;height:26px;border-radius:50%;background:var(--srf2);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--t3);flex-shrink:0}
.inp-close:hover{background:var(--bd)}

/* Body */
.inp-body{flex:1;overflow-y:auto;padding:0 0 8px}
@media(min-width:1024px){.inp-body{padding:28px 24px 40px}}
.inp-empty{text-align:center;padding:40px 16px;color:var(--t3);font-size:13px;line-height:1.6}

/* Reassurance card (green) */
.inp-reassure{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;background:rgba(42,122,75,.07);border-bottom:1px solid rgba(42,122,75,.12)}
.inp-reassure-icon{width:24px;height:24px;border-radius:50%;background:rgba(42,122,75,.15);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.inp-reassure-icon svg{width:12px;height:12px;stroke:var(--grn);stroke-width:2.5}
.inp-reassure-text{font-size:13px;line-height:1.55;color:var(--t1)}

/* Crisis card (red) */
.inp-crisis{padding:12px 16px;background:rgba(192,57,43,.06);border-bottom:3px solid var(--red)}
.inp-crisis-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--red);margin-bottom:4px}
.inp-crisis-text{font-size:12.5px;line-height:1.5;color:var(--t1);margin-bottom:8px}
.inp-crisis-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;background:var(--red);color:#fff;border:none;border-radius:var(--r-sm);cursor:pointer;font-size:12.5px;font-weight:600;font-family:inherit;transition:filter .15s}
.inp-crisis-btn:hover{filter:brightness(.9)}

/* Red flag card */
.inp-redflag{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;background:var(--red-l);border:1px solid rgba(192,57,43,.18);border-radius:var(--r-sm);margin:12px 16px 0}
.inp-rf-icon{width:28px;height:28px;border-radius:50%;background:rgba(192,57,43,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.inp-rf-icon svg{width:13px;height:13px;stroke:var(--red)}
.inp-rf-text{font-size:13px;line-height:1.55;color:var(--t1)}

/* Section blocks */
.inp-block{border-bottom:1px solid var(--bd)}
.inp-block:last-of-type{border-bottom:none}
.inp-block-hdr{display:flex;align-items:center;gap:7px;padding:10px 16px 0}
.inp-block-icon{width:20px;height:20px;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.inp-block-icon svg{width:11px;height:11px;stroke-width:2}
.inp-block-lbl{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em}

/* Generic section */
.inp-section{margin-bottom:16px;padding:0 16px}
.inp-section-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--t4);margin-bottom:8px}

/* Watch rows — orange dot + signal + action */
.inp-watch-row{display:flex;align-items:flex-start;gap:10px;padding:8px 16px;cursor:pointer;transition:background .12s}
.inp-watch-row:hover{background:var(--srf2)}
.inp-watch-dot{width:6px;height:6px;border-radius:50%;background:var(--or);flex-shrink:0;margin-top:5px;opacity:.7}
.inp-watch-signal{font-size:13px;color:var(--t1);font-weight:500;line-height:1.4}
.inp-watch-action{font-size:11.5px;color:var(--or);margin-top:2px;line-height:1.4;font-weight:500}

/* Next-step rows — icon square + action + when */
.inp-next-row{display:flex;align-items:center;gap:10px;padding:8px 16px;cursor:pointer;transition:background .12s}
.inp-next-row:hover{background:var(--srf2)}
.inp-next-icon{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.inp-next-icon svg{width:13px;height:13px}
.inp-next-lab{background:rgba(37,99,235,.1)}
.inp-next-lab svg{stroke:var(--blu)}
.inp-next-track{background:var(--or-l)}
.inp-next-track svg{stroke:var(--or)}
.inp-next-consult{background:var(--grn-l)}
.inp-next-consult svg{stroke:var(--grn)}
.inp-next-action{font-size:13px;font-weight:500;color:var(--t1);line-height:1.3}
.inp-next-when{font-size:11px;color:var(--t3);margin-top:2px}

/* Doctor question rows */
.inp-q{display:flex;align-items:flex-start;gap:10px;padding:8px 16px;cursor:pointer;transition:background .12s}
.inp-q:hover{background:var(--srf2)}
.inp-q svg{width:14px;height:14px;color:var(--t4);flex-shrink:0;margin-top:2px}
.inp-q:hover svg{color:var(--or)}
.inp-q-text{font-size:13px;font-weight:500;color:var(--t1);line-height:1.4}
.inp-q-sub{font-size:11px;color:var(--t3);margin-top:2px;line-height:1.3}

/* Product callout */
.inp-product{margin:8px 16px;padding:12px;background:var(--srf2);border:1.5px solid var(--bd);border-radius:var(--r-sm)}
.inp-product-badge{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--or);margin-bottom:4px}
.inp-product-name{font-size:13px;font-weight:600;color:var(--t1);margin-bottom:3px}
.inp-product-note{font-size:11.5px;color:var(--t3);line-height:1.45;margin-bottom:8px}
.inp-product-btn{padding:7px 12px;border-radius:var(--r-sm);background:var(--or);color:#fff;border:none;cursor:pointer;font-size:12px;font-weight:600;font-family:inherit;transition:filter .15s}
.inp-product-btn:hover{filter:brightness(.9)}

/* Tags */
.inp-tags{display:flex;flex-wrap:wrap;gap:5px;padding:8px 16px 12px}
.inp-tag{padding:3px 9px;border-radius:20px;background:var(--srf2);border:1px solid var(--bd);font-size:11.5px;color:var(--t3)}

/* Footer — talk to a doctor + share */
.inp-footer{display:flex;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--bd);flex-shrink:0;background:var(--srf)}
.inp-footer-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 14px;background:var(--or);color:#fff;border:none;border-radius:var(--r-sm);cursor:pointer;font-size:13px;font-weight:600;font-family:inherit;transition:filter .15s}
.inp-footer-btn:hover{filter:brightness(.9)}
.inp-footer-share{width:36px;height:36px;border-radius:var(--r-sm);border:1.5px solid var(--bd);background:var(--srf);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--t3);flex-shrink:0;transition:all .14s}
.inp-footer-share:hover{border-color:var(--or-m);color:var(--or);background:var(--or-l)}

/* ═══ 2. PATIENT PROFILE SHEET ═══ */

.pt-sheet{position:fixed;inset:0;z-index:150;display:none;align-items:flex-end;justify-content:center}
.pt-sheet.open{display:flex}
@media(min-width:1024px){.pt-sheet{align-items:center}}
.pt-sheet-backdrop{position:absolute;inset:0;background:rgba(28,25,23,.4);backdrop-filter:blur(3px)}
.pt-sheet-panel{position:relative;width:100%;max-width:480px;max-height:88dvh;background:var(--srf);border-radius:20px 20px 0 0;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 -8px 40px rgba(28,25,23,.15)}
@media(min-width:1024px){.pt-sheet-panel{border-radius:20px;max-height:80dvh}}
.pt-sheet-drag{width:36px;height:4px;background:var(--bd);border-radius:4px;margin:10px auto 0;flex-shrink:0}
.pt-sheet-hdr{display:flex;align-items:center;justify-content:space-between;padding:14px 20px 10px;flex-shrink:0}
.pt-sheet-title{font-size:17px;font-weight:700;color:var(--t1)}
.pt-sheet-close{width:28px;height:28px;border-radius:50%;background:var(--srf2);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--t3)}
.pt-sheet-close:hover{background:var(--bd)}
.pt-sheet-scroll{flex:1;overflow-y:auto;padding:0 0 24px}

/* Hero */
.pt-hero{display:flex;align-items:center;gap:14px;padding:4px 20px 16px;border-bottom:1px solid var(--bd)}
.pt-hero-av{width:56px;height:56px;border-radius:50%;background:var(--or);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;flex-shrink:0}
.pt-hero-name{font-size:17px;font-weight:700;color:var(--t1)}
.pt-hero-sub{font-size:13px;color:var(--t3);margin-top:2px}

/* Section */
.pt-section{padding:16px 20px 0}
.pt-section-title{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--t4);margin-bottom:10px}

/* Conditions */
.pt-conditions{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.pt-cond-pill{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:20px;background:var(--srf2);border:1.5px solid var(--bd);font-size:13px;font-weight:500;color:var(--t1)}
.pt-cond-dot{width:7px;height:7px;border-radius:50%;background:var(--or);flex-shrink:0}

/* Medications */
.pt-med-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid rgba(228,222,214,.5);font-size:13.5px}
.pt-med-row:last-child{border-bottom:none}
.pt-med-icon{width:30px;height:30px;border-radius:8px;background:var(--srf2);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pt-med-name{font-weight:600;color:var(--t1)}
.pt-med-dose{font-size:12px;color:var(--t3);margin-top:1px}

/* Care team */
.pt-care-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid rgba(228,222,214,.5)}
.pt-care-row:last-child{border-bottom:none}
.pt-care-av{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0}
.pt-care-name{font-size:13.5px;font-weight:600;color:var(--t1)}
.pt-care-role{font-size:12px;color:var(--t3);margin-top:1px}
.pt-care-call{margin-left:auto;width:32px;height:32px;border-radius:50%;background:var(--grn-l);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--grn)}
.pt-care-call:hover{background:rgba(42,122,75,.2)}

/* Family sharing */
.pt-family-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid rgba(228,222,214,.5)}
.pt-family-row:last-child{border-bottom:none}
.pt-family-av{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0}
.pt-family-name{font-size:13.5px;font-weight:600;color:var(--t1)}
.pt-family-access{font-size:12px;color:var(--t3);margin-top:1px}
.pt-family-badge{margin-left:auto;font-size:10.5px;font-weight:600;padding:3px 8px;border-radius:10px}
.pt-family-badge.sharing{background:var(--grn-l);color:var(--grn);border:1px solid rgba(42,122,75,.2)}
.pt-family-badge.pending{background:var(--or-l);color:var(--or);border:1px solid var(--or-m)}

/* ═══ 3. CONSULT MODAL ═══ */

.consult-overlay{position:fixed;inset:0;z-index:200;background:rgba(28,25,23,.55);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:24px}
.consult-overlay.open{display:flex}
.consult-card{width:360px;max-width:100%;background:var(--srf);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg)}
.consult-hdr{padding:18px 20px 14px;border-bottom:1px solid var(--bd);display:flex;align-items:center;gap:10px}
.consult-icon{width:40px;height:40px;border-radius:12px;background:var(--or-l);border:1.5px solid var(--or-m);display:flex;align-items:center;justify-content:center;color:var(--or);flex-shrink:0}
.consult-title{font-size:16px;font-weight:700;color:var(--t1)}
.consult-sub{font-size:12px;color:var(--t3);margin-top:2px}
.consult-close{margin-left:auto;width:28px;height:28px;border-radius:50%;background:var(--srf2);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--t3)}
.consult-body{padding:16px 20px}

/* Consent checkbox */
.consult-consent{display:flex;align-items:flex-start;gap:10px;padding:12px;background:var(--srf2);border:1.5px solid var(--bd);border-radius:10px;margin-bottom:14px;cursor:pointer}
.consult-consent:hover{border-color:var(--or-m)}
.consult-check{width:20px;height:20px;border-radius:6px;border:2px solid var(--t4);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;transition:all .12s}
.consult-check.on{background:var(--or);border-color:var(--or)}
.consult-check.on svg{display:block}
.consult-check svg{display:none;width:11px;height:11px;color:#fff}
.consult-consent-text{font-size:13px;color:var(--t2);line-height:1.4}
.consult-consent-text strong{color:var(--t1)}

/* Provider selection */
.consult-providers{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.consult-provider{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;border:1.5px solid var(--bd);cursor:pointer;transition:all .12s}
.consult-provider:hover{border-color:var(--or-m);background:var(--or-l)}
.consult-provider.sel{border-color:var(--or);background:var(--or-l)}
.consult-prov-av{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0}
.consult-prov-name{font-size:13.5px;font-weight:600;color:var(--t1)}
.consult-prov-spec{font-size:12px;color:var(--t3);margin-top:1px}
.consult-prov-avail{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--grn);white-space:nowrap}

/* Footer */
.consult-footer{padding:12px 20px;border-top:1px solid var(--bd);display:flex;gap:8px}
.consult-btn{flex:1;padding:11px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;border:none;font-family:inherit;transition:all .15s}
.consult-btn.primary{background:var(--or);color:#fff}
.consult-btn.primary:hover{filter:brightness(.9)}
.consult-btn.secondary{background:var(--srf2);color:var(--t2);border:1.5px solid var(--bd)}
.consult-btn.secondary:hover{background:var(--bd)}

/* ═══ 4. CHAT HEADER OVERRIDES ═══ */

.ch-btn-consult{display:flex;align-items:center;gap:5px;padding:0 12px;height:30px;border-radius:15px;background:var(--or);color:#fff;font-size:12.5px;font-weight:600;font-family:inherit;border:none;cursor:pointer;transition:filter .15s;white-space:nowrap}
.ch-btn-consult:hover{filter:brightness(.9)}
.ch-btn-consult svg{width:13px;height:13px;flex-shrink:0}
.ch-btn-insights{position:relative}
.insights-dot{position:absolute;top:4px;right:4px;width:7px;height:7px;border-radius:50%;background:var(--or);border:1.5px solid var(--srf);display:none}
.ch-btn-insights.has-content .insights-dot{display:block}

/* ═══ 5. HOME SCREEN PATIENT CUSTOMISATION ═══ */

.home-greet-patient{background:linear-gradient(135deg,var(--or) 0%,#D4956A 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:500}

/* ═══ 6. TURN NUDGE BANNER ═══ */

.turn-nudge{
  padding:8px 16px;text-align:center;font-size:13px;color:var(--t2);
  background:var(--or-l);border-top:1px solid rgba(192,112,64,.15);
  line-height:1.5
}
.turn-nudge a{color:var(--or);font-weight:600;text-decoration:underline;text-underline-offset:2px}

/* ═══ 7. RESPONSIVE ═══ */

@media(max-width:600px){
  .consult-card{border-radius:20px 20px 0 0}
  .consult-overlay{align-items:flex-end;padding:0}
}
