:root{
  --brand:#6f4ef6;
  --brand-600:#5b3ff0;
  --brand-50:#f4f1ff;

  --bg:#f7f7fb;
  --panel:#ffffff;
  --line:#e8e7f0;

  --text:#232533;
  --muted:#6d7285;
  --muted-2:#8a90a3;

  --radius:14px;
  --shadow:0 10px 28px rgba(28,32,73,.08);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font:14px/1.6 Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;
}

/* SIDEBAR */
.sidebar{
  position:fixed; top:0; left:0; bottom:0; width:240px;
  background:#fff; border-right:1px solid var(--line);
  padding:14px; display:flex; flex-direction:column; gap:8px; z-index:20;
  transition:transform .25s ease;
}
.sb-header{display:flex; align-items:center; gap:10px; padding:6px 6px 12px}
.org-pill{
  width:28px;height:28px;border-radius:10px;border:0;cursor:pointer;
  display:grid;place-items:center;background:var(--brand-50);color:var(--brand);
  font-weight:700;
}
.org-name{flex:1;font-weight:600}
.sb-collapse{border:0;background:transparent;color:#9aa0b3;cursor:pointer;padding:4px}
.sb-nav{display:flex; flex-direction:column; gap:4px}
.nav{
  appearance:none;border:0;background:transparent; text-align:left; cursor:pointer;
  padding:10px 12px;border-radius:12px;display:flex;align-items:center;gap:10px;
  color:#2a2f3b;font-weight:500;
}
.nav .ico{width:20px;height:20px;color:#7f869a;display:grid;place-items:center}
.nav:hover{background:var(--brand-50)}
.nav.is-active{
  background:#fff; border:2px solid transparent;
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(135deg,var(--brand),var(--brand-600)) border-box;
  color:var(--brand-600);
}
.sb-footer{margin-top:auto;border-top:1px solid var(--line); padding-top:10px}
.nav.small{font-size:13px}

/* TOPBAR */
.topbar{
  position:fixed; left:240px; right:0; top:0; height:56px;
  background:#fff;border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:flex-end; gap:12px;
  padding:0 16px; z-index:10;
}
.hamburger{display:none;border:0;background:transparent;cursor:pointer}
.tb-right{display:flex; align-items:center; gap:12px}
.btn.specialist{
  height:34px; padding:0 12px; font-weight:600; border-radius:10px;
  border:1px solid var(--line); background:#fff;
}
.user{display:flex; align-items:center; gap:6px}
.avatar{
  width:28px;height:28px;border-radius:999px;display:grid;place-items:center;
  background:#f1efff;color:#5a47ee;font-weight:700;font-size:12px;
}
.tb-left{display:none}

/* MAIN */
.main{margin-left:240px; padding:72px 18px 24px;}

/* Quick actions */
.quick-grid{
  display:grid;gap:12px;grid-template-columns:repeat(6,minmax(0,1fr)); margin-bottom:16px;
}
.quick{
  display:flex;align-items:center;gap:10px; justify-content:center;
  height:74px;border-radius:12px;background:#fff;border:1px solid var(--line);
  font-weight:600; cursor:pointer; box-shadow:var(--shadow);
}
.q-ico{width:24px;height:24px;color:var(--brand);display:grid;place-items:center}
.quick:hover{background:var(--brand-50)}

/* Grid content */
.content-grid{display:grid; gap:16px; grid-template-columns: minmax(0,1fr) 360px}

/* Panels */
.panel{background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow)}
.panel-header{
  padding:16px; display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid var(--line);
}
.ph-title{display:flex; align-items:center; gap:8px}
.panel h2{font-size:16px; margin:0}
.updated{color:var(--muted); font-size:12.5px}
.icon-btn{border:0;background:transparent;color:#8b91a3;cursor:pointer;padding:6px;border-radius:8px}
.icon-btn:hover{background:#f3f2ff;color:var(--brand-600)}

/* Empty card */
.empty-card{padding:26px 16px; text-align:center}
.empty-card p{margin:10px 0 14px;color:var(--muted)}
.btn{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  height:36px; padding:0 14px; border-radius:12px; border:1px solid transparent;
  font-weight:600; background:#fff;
}
.btn.primary{background:var(--brand); color:#fff; border-color:var(--brand)}
.btn.primary:hover{background:var(--brand-600)}
.btn.primary.is-disabled,
.btn.primary[disabled]{opacity:.6; filter:grayscale(.1); cursor:not-allowed}
.btn.ghost{border-color:var(--line)}
.btn.outline{background:#fff;border-color:var(--line)}
.btn.full{width:100%}
.btn.link{background:transparent;border:0;color:var(--brand);height:auto;padding:0}

/* Right column */
.news{padding:12px}
.news h3{font-size:15px; margin:4px 4px 10px}
.news-card{border:1px solid var(--line); border-radius:12px; padding:14px; background:#fff7ff}
.news-title{font-weight:600}
.btn.sm{height:30px; padding:0 10px; margin-top:10px}

.finance{padding:12px}
.fin-head{display:flex; align-items:center; justify-content:space-between; padding:4px 4px 8px}
.fin-head h3{font-size:15px; margin:0}
.see-more{color:#8a90a3; text-decoration:none; font-size:12.5px}
.fin-body{display:flex; align-items:center; gap:12px; padding:8px 4px 14px}
.donut{width:110px; height:110px}
.muted{color:var(--muted)}
.muted-2{color:var(--muted-2)}

/* Toast */
.toast{
  position:fixed; left:270px; bottom:18px; width:300px;
  background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow);
  padding:12px; z-index:30;
}
.toast-head{display:flex; justify-content:space-between; align-items:center}
.check{width:22px; height:22px; background:#e9fcef; color:#16a34a; border-radius:6px; display:grid; place-items:center; font-weight:700}
.toast-close{border:0; background:transparent; font-size:18px; color:#9aa0b3; cursor:pointer}
.toast-title{margin:8px 0 4px; font-weight:700}
.toast-text{margin:0 0 8px; color:var(--muted)}

/* Chat bubble */
.chat{
  position:fixed; right:18px; bottom:18px; width:52px; height:52px; border-radius:999px;
  display:grid; place-items:center; border:0; background:#fff; box-shadow:var(--shadow);
}
.chat .sr{position:absolute; left:-9999px}

/* ===== Drawer base ===== */
.drawer{position:fixed; inset:0; z-index:60; display:none}
.drawer.is-open{display:block}
.drawer__overlay{
  position:absolute; inset:0; background:rgba(17,18,22,.45); backdrop-filter:saturate(120%) blur(2px);
  opacity:0; transition:opacity .2s ease;
}
.drawer.is-open .drawer__overlay{opacity:1}
.drawer__panel{
  position:absolute; top:0; right:0; height:100%; width:min(520px, 100%);
  background:#fff; border-left:1px solid var(--line); display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform .25s ease;
}
.drawer.is-open .drawer__panel{transform:none}
.drawer__header{
  height:56px; display:flex; align-items:center; justify-content:space-between;
  padding:0 16px; border-bottom:1px solid var(--line);
}
.drawer__header h2{font-size:16px; margin:0}
.drawer__subtitle{font-size:14px; margin:4px 0 12px}

/* Tabs */
.tabs{display:flex; gap:8px; padding:12px 16px; border-bottom:1px solid var(--line)}
.tab{
  border:1px solid var(--line); background:#faf9ff; color:#5546d8;
  height:34px; padding:0 12px; border-radius:10px; font-weight:600; cursor:pointer;
}
.tab.is-active{background:#6f4ef6; color:#fff; border-color:#6f4ef6}

/* Form e corpo */
.drawer__body{padding:14px 16px 120px; overflow:auto}
.field{margin-bottom:12px}
.lbl{display:flex; align-items:center; justify-content:space-between}
.lbl span{font-weight:600; color:#3a3d49}
.opt{color:#9aa0b3; font-size:12px; margin-left:8px}
.field .hint{color:#8a90a3; font-size:12.5px; margin:6px 0 0}
.link{color:#6f4ef6; text-decoration:none}
.link.strong{font-weight:700; display:inline-block; margin-top:10px}
.input, .select select, .drawer__body input[type="date"], .drawer__body input[type="time"], .drawer__body textarea{
  width:100%; height:38px; padding:0 12px; border-radius:10px; border:1px solid var(--line); background:#fff; color:var(--text);
}
.drawer__body textarea{height:auto; padding:10px 12px; resize:vertical}
.select{position:relative}
.select::after{
  content:""; position:absolute; right:12px; top:50%; transform:translateY(-50%);
  border:6px solid transparent; border-top-color:#9aa0b3; pointer-events:none;
}
.select select{appearance:none; background:#fff}
.row-2{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.checkbox-line{margin-top:-6px}
.check{display:inline-flex; align-items:center; gap:8px; cursor:pointer}
.check input{width:16px; height:16px}
.radios{display:flex; gap:18px}
.radio{display:inline-flex; align-items:center; gap:8px; cursor:pointer}
.radio input{width:16px; height:16px}
.dot{display:inline-block; width:10px; height:10px; border-radius:999px; margin-left:6px}
.dot.purple{background:#6f4ef6}

/* Footer */
.drawer__footer{
  position:sticky; bottom:0; background:#fff; border-top:1px solid var(--line);
  padding:12px 16px; display:flex; justify-content:flex-end; gap:10px;
}

/* Botões roxos de ação (drawer pacientes) */
.action-purple{
  width:100%; height:40px; border-radius:10px; border:2px solid #6f4ef6; background:#fff;
  color:#6f4ef6; font-weight:700; display:flex; align-items:center; justify-content:space-between;
  padding:0 12px; margin:8px 0; cursor:pointer;
}
.action-purple:hover{background:#f4f1ff}

/* RESPONSIVO */
@media (max-width: 1200px){
  .quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .content-grid{grid-template-columns:1fr}
  .side-col{order:2}
}
@media (max-width: 860px){
  .topbar{left:0; justify-content:space-between}
  .hamburger{display:block}
  .main{margin-left:0}
  .sidebar{transform:translateX(-100%)}
  .sidebar.is-open{transform:none}
  .toast{left:18px}
}
@media (max-width: 560px){
  .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .drawer__panel{width:100%}
}