/* ============================================================
   EdgeCare.ai — Dashboard shell (shared: consumer + pro)
   ============================================================ */
:root{
  --green:#4A7C59; --green-light:#6BAF5B; --green-pale:#E8F5E3; --green-deep:#3A6248;
  --blue:#3B7DD8; --blue-light:#5BA0D9; --blue-pale:#E3F0FC; --blue-deep:#2A5DA8;
  --amber:#C77F2A; --amber-pale:#FBF1E4; --red:#E04443; --red-pale:#FDECEC; --yellow:#D6A12E;
  --ink:#15202B; --slate:#46566A; --muted:#7C8AA0; --faint:#A9B4C4;
  --bg:#F5F8FA; --panel:#FFFFFF; --border:#E6EBF0; --border-soft:#EEF2F6;
  --night:#0E1622; --night-2:#16202E; --night-3:#1C2940;
  --shadow-sm:0 1px 3px rgba(20,30,45,.06);
  --shadow-md:0 6px 20px rgba(20,30,45,.08);
  --shadow-lg:0 18px 44px rgba(20,30,45,.12);
  --r:14px; --r-sm:10px; --r-lg:20px;
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:1.55;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
::selection{background:var(--green-pale);}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:#cfd8e2;border-radius:8px;border:2px solid var(--bg);}
::-webkit-scrollbar-thumb:hover{background:#b6c2d0;}

/* ---------- layout shell ---------- */
.app{display:grid;grid-template-columns:248px 1fr;min-height:100vh;}
.side{position:sticky;top:0;height:100vh;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:20px 16px;z-index:30;}
.side-brand{display:flex;align-items:center;gap:9px;padding:6px 8px 18px;}
.side-brand img{height:46px;}
.side-nav{display:flex;flex-direction:column;gap:3px;margin-top:6px;}
.side-nav .sn{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:11px;font-size:14.5px;font-weight:600;color:var(--slate);cursor:pointer;transition:.16s;border:none;background:none;font-family:var(--font);width:100%;text-align:left;}
.side-nav .sn svg{width:19px;height:19px;flex-shrink:0;stroke-width:2;}
.side-nav .sn:hover{background:var(--bg);color:var(--ink);}
.side-nav .sn.on{background:var(--green-pale);color:var(--green-deep);}
.side-nav .sn .badge{margin-left:auto;font-size:11px;font-weight:700;background:var(--red);color:#fff;border-radius:20px;padding:1px 7px;}
.side-sep{height:1px;background:var(--border-soft);margin:14px 6px;}
.side-foot{margin-top:auto;}
.side-profile{display:flex;align-items:center;gap:11px;padding:12px;border-radius:13px;background:var(--bg);min-width:0;}
.side-profile .ava{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#cfe6d3,#bcd8f0);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--green);font-size:15px;flex-shrink:0;}
.side-profile .nm{font-size:13.5px;font-weight:700;line-height:1.15;white-space:nowrap;}
.side-profile .mt{font-size:11.5px;color:var(--muted);}
.side-back{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted);padding:12px 14px 2px;transition:.16s;}
.side-back:hover{color:var(--green);}
.side-back svg{width:15px;height:15px;}

/* ---------- main + topbar ---------- */
.main{min-width:0;display:flex;flex-direction:column;}
.topbar{position:sticky;top:0;background:rgba(245,248,250,.84);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:16px 34px;display:flex;align-items:center;justify-content:space-between;gap:18px;z-index:20;}
.topbar h1{font-size:21px;font-weight:800;letter-spacing:-.5px;}
.topbar .sub{font-size:13px;color:var(--muted);margin-top:1px;}
.topbar-right{display:flex;align-items:center;gap:14px;}
.tb-status{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--green-deep);background:var(--green-pale);padding:7px 14px;border-radius:30px;}
.tb-status .d{width:8px;height:8px;border-radius:50%;background:var(--green-light);box-shadow:0 0 0 3px rgba(107,175,91,.2);animation:liveDot 2.2s infinite;}
@keyframes liveDot{0%,100%{box-shadow:0 0 0 3px rgba(107,175,91,.2);}50%{box-shadow:0 0 0 6px rgba(107,175,91,.04);}}
.tb-date{font-size:13px;color:var(--slate);font-weight:500;}

.view{padding:30px 34px 56px;max-width:1280px;width:100%;}
.view[hidden]{display:none;}
.view-head{margin-bottom:22px;}
.view-head h2{font-size:23px;font-weight:800;letter-spacing:-.6px;}
.view-head p{font-size:14px;color:var(--muted);margin-top:3px;}

/* ---------- cards & grid ---------- */
.row{display:grid;gap:18px;}
.c2{grid-template-columns:repeat(2,1fr);} .c3{grid-template-columns:repeat(3,1fr);} .c4{grid-template-columns:repeat(4,1fr);}
.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--r);padding:22px;}
.card.pad-lg{padding:26px;}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;}
.card-head h3{font-size:15.5px;font-weight:700;}
.card-head .hint{font-size:12px;color:var(--muted);}
.card-head .pillbtns{display:flex;gap:4px;background:var(--bg);border-radius:9px;padding:3px;}
.card-head .pillbtns button{border:none;background:none;font-family:var(--font);font-size:12px;font-weight:600;color:var(--muted);padding:5px 11px;border-radius:7px;cursor:pointer;transition:.15s;}
.card-head .pillbtns button.on{background:#fff;color:var(--ink);box-shadow:var(--shadow-sm);}

/* stat tiles */
.tile{background:var(--panel);border:1px solid var(--border);border-radius:var(--r);padding:18px;transition:.22s;}
.tile:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);}
.tile .t-top{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.tile .t-ico{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.tile .t-ico svg{width:19px;height:19px;stroke-width:2;}
.ic-green{background:var(--green-pale);color:var(--green);} .ic-blue{background:var(--blue-pale);color:var(--blue);}
.ic-amber{background:var(--amber-pale);color:var(--amber);} .ic-red{background:var(--red-pale);color:var(--red);}
.ic-purple{background:#F1EAFB;color:#805AD5;}
.tile .t-label{font-size:12.5px;color:var(--muted);font-weight:600;}
.tile .t-val{font-size:30px;font-weight:800;letter-spacing:-1px;line-height:1;}
.tile .t-val small{font-size:14px;font-weight:600;color:var(--muted);}
.tile .t-foot{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;margin-top:10px;}
.trend-up{color:var(--green);} .trend-down{color:var(--red);} .trend-flat{color:var(--muted);}
.t-foot svg{width:14px;height:14px;}

/* chart canvas wrapper */
.chart-wrap{position:relative;width:100%;}
.chart-wrap.h-sm{height:160px;} .chart-wrap.h-md{height:220px;} .chart-wrap.h-lg{height:300px;}

/* score ring */
.score-ring{position:relative;width:150px;height:150px;flex-shrink:0;}
.score-ring svg{width:100%;height:100%;transform:rotate(-90deg);}
.score-ring .rbg{fill:none;stroke:var(--border-soft);stroke-width:11;}
.score-ring .rfl{fill:none;stroke-width:11;stroke-linecap:round;transition:stroke-dashoffset 1.4s cubic-bezier(.2,.7,.2,1);}
.score-ring .ctr{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.score-ring .ctr b{font-size:42px;font-weight:800;letter-spacing:-1.5px;line-height:1;}
.score-ring .ctr span{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-top:3px;}

/* badges */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:20px;}
.b-good{background:var(--green-pale);color:var(--green-deep);}
.b-warn{background:var(--amber-pale);color:var(--amber);}
.b-crit{background:var(--red-pale);color:var(--red);}
.b-info{background:var(--blue-pale);color:var(--blue-deep);}
.b-neutral{background:var(--bg);color:var(--slate);}

/* metric mini grid (caregiver 10) */
.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.mini{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:14px;transition:.2s;}
.mini:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--green-light);}
.mini .m-label{font-size:11.5px;color:var(--muted);font-weight:600;line-height:1.2;min-height:28px;}
.mini .m-val{font-size:21px;font-weight:800;letter-spacing:-.6px;margin-top:4px;}
.mini .m-val small{font-size:11px;font-weight:600;color:var(--muted);}
.mini .m-spark{height:30px;margin-top:8px;}

/* list / alerts */
.alist{display:flex;flex-direction:column;gap:10px;}
.aitem{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:12px;border:1px solid var(--border);background:var(--panel);transition:.18s;cursor:pointer;}
.aitem:hover{box-shadow:var(--shadow-sm);border-color:var(--border);}
.aitem .a-ico{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.aitem .a-ico svg{width:19px;height:19px;}
.aitem .a-body{flex:1;min-width:0;}
.aitem .a-title{font-size:14.5px;font-weight:700;}
.aitem .a-sum{font-size:13px;color:var(--slate);margin-top:2px;}
.aitem .a-meta{font-size:12px;color:var(--muted);margin-top:6px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.aitem .a-detail{font-size:13px;color:var(--slate);line-height:1.6;max-height:0;opacity:0;overflow:hidden;transition:max-height .35s ease,opacity .3s,margin .3s;}
.aitem.open .a-detail{max-height:280px;opacity:1;margin-top:12px;}
.aitem .a-rec{margin-top:10px;padding:11px 13px;background:var(--green-pale);border-radius:9px;font-size:12.5px;color:var(--green-deep);}

/* progress bars (factors) */
.fbar{margin-bottom:14px;}
.fbar .fb-top{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px;}
.fbar .fb-top b{font-weight:600;color:var(--slate);}
.fbar .fb-track{height:8px;border-radius:6px;background:var(--border-soft);overflow:hidden;}
.fbar .fb-fill{height:100%;border-radius:6px;transition:width 1s cubic-bezier(.2,.7,.2,1);}

/* room/list rows */
.kv{display:flex;flex-direction:column;gap:11px;}
.kv .kv-row{display:flex;align-items:center;gap:12px;}
.kv .kv-row .kvl{font-size:13px;color:var(--slate);width:108px;flex-shrink:0;}
.kv .kv-row .kvt{flex:1;height:8px;border-radius:6px;background:var(--border-soft);overflow:hidden;}
.kv .kv-row .kvf{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--green-light),var(--green));}
.kv .kv-row .kvv{font-size:12.5px;font-weight:700;width:40px;text-align:right;white-space:nowrap;margin-left:auto;}

.section-label{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin:6px 0 14px;}

/* reveal */
.dz{opacity:0;transform:translateY(16px);transition:opacity .55s,transform .55s;}
.dz.in{opacity:1;transform:none;}

@media (prefers-reduced-motion:reduce){.dz{opacity:1!important;transform:none!important;}.tb-status .d{animation:none;}}

/* responsive */
@media (max-width:1100px){
  .mini-grid{grid-template-columns:repeat(3,1fr);}
  .c4{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:860px){
  .app{grid-template-columns:1fr;}
  .side{position:fixed;left:-260px;transition:left .26s;box-shadow:var(--shadow-lg);width:248px;}
  .side.open{left:0;}
  .row.c2,.row.c3{grid-template-columns:1fr!important;}
  .mini-grid{grid-template-columns:repeat(2,1fr);}
  .menu-btn{display:inline-flex!important;}
  .view{padding:22px 18px 48px;}
  .topbar{padding:14px 18px;}
  .topbar h1{font-size:18px;}
}
@media (max-width:560px){
  .row.c4{grid-template-columns:1fr 1fr!important;}
  .mini-grid{grid-template-columns:1fr 1fr;}
  .view{padding:18px 14px 44px;}
  .card,.tile{padding:16px;}
  .tile .t-val{font-size:26px;}
  .view-head h2{font-size:20px;}
}
.ov-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.55fr);gap:18px;align-items:stretch;}
@media(max-width:1140px){.ov-hero{grid-template-columns:1fr;}}
.menu-btn{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;border:1px solid var(--border);background:#fff;cursor:pointer;}
.menu-btn svg{width:20px;height:20px;}