@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;600&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bd:#080d14; --bb:#0d1520; --be:#111e2e; --bc:#162032; --bc2:#1c2940; --bi:#0f1a28;
  --b0:rgba(255,255,255,.05); --b1:rgba(255,255,255,.09); --b2:rgba(255,255,255,.16);
  --t1:#e8edf5; --t2:#8a9ab5; --t3:#4a5a72;
  --blue:#3b82f6; --blue2:#1d4ed8; --bgl:rgba(59,130,246,.22);
  --amb:#f59e0b; --amd:rgba(245,158,11,.15);
  --red:#ef4444;  --rdd:rgba(239,68,68,.15);
  --grn:#10b981;  --gnd:rgba(16,185,129,.15);
  --pur:#8b5cf6;  --pud:rgba(139,92,246,.15);
  --sw:240px; --hh:56px; --r:6px; --rm:10px; --rl:16px;
  --tr:.16s cubic-bezier(.4,0,.2,1);
}

html, body { height:100%; background:var(--bd); color:var(--t1);
  font-family:"DM Sans",sans-serif; font-size:14px; line-height:1.6;
  -webkit-font-smoothing:antialiased; }

/* ── Layout ── */
.shell { display:flex; height:100vh; overflow:hidden; }

/* ── Sidebar ── */
.sidebar { width:var(--sw); height:100vh; background:var(--bb);
  border-right:1px solid var(--b0); display:flex; flex-direction:column;
  flex-shrink:0; overflow-y:auto; overflow-x:hidden; }
.sidebar::-webkit-scrollbar { width:4px; }
.sidebar::-webkit-scrollbar-thumb { background:var(--b1); border-radius:2px; }

.slogo { display:flex; align-items:center; gap:10px; padding:16px 18px 13px;
  border-bottom:1px solid var(--b0); }
.slogo-icon { width:36px; height:36px; background:rgba(255,255,255,.07);
  border-radius:var(--r); display:grid; place-items:center; flex-shrink:0;
  border:1px solid rgba(255,255,255,.1); }
.slogo-name { font-size:14px; font-weight:700; color:var(--t1); letter-spacing:-.3px; }
.slogo-name span { display:block; font-size:9.5px; font-weight:400; color:var(--t3);
  letter-spacing:.5px; text-transform:uppercase; margin-top:1px; }

.suser { margin:9px; padding:10px 12px; background:var(--bc);
  border:1px solid var(--b0); border-radius:var(--rm); }
.suser-name { font-size:12px; font-weight:600; color:var(--t1);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.suser-role { font-size:11px; color:var(--blue); font-weight:500; margin-top:2px; }
.suser-mat  { font-size:10px; color:var(--t3); font-family:"JetBrains Mono",monospace; margin-top:3px; }

.slbl { padding:12px 15px 3px; font-size:10px; font-weight:600;
  letter-spacing:1px; text-transform:uppercase; color:var(--t3); }

.ni { display:flex; align-items:center; gap:9px; padding:7px 13px;
  margin:1px 7px; border-radius:var(--r); color:var(--t2); font-size:13px;
  font-weight:500; cursor:pointer; border:none; background:none;
  width:calc(100% - 14px); text-align:left; transition:all var(--tr);
  font-family:"DM Sans",sans-serif; text-decoration:none; display:flex; }
.ni:hover { background:var(--bc); color:var(--t1); }
.ni.active { background:rgba(59,130,246,.15); color:var(--blue);
  border-left:2px solid var(--blue); padding-left:11px; }
.ndiv { height:1px; background:var(--b0); margin:7px 11px; }
.nsp  { flex:1; }
.ni-danger { color:#f87171; }
.ni-danger:hover { background:var(--rdd)!important; color:var(--red)!important; }

/* ── Main ── */
.main { flex:1; display:flex; flex-direction:column; overflow:hidden; }
.topbar { height:var(--hh); background:var(--bb); border-bottom:1px solid var(--b0);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 24px; flex-shrink:0; }
.tbc { font-size:12px; color:var(--t3); display:flex; align-items:center; gap:7px; }
.tbc .cur { color:var(--t1); font-weight:600; }
.clk { font-family:"JetBrains Mono",monospace; font-size:11.5px; color:var(--t3);
  background:var(--bc); padding:4px 11px; border-radius:20px; border:1px solid var(--b0); }

.pw { flex:1; overflow-y:auto; padding:24px; }
.pw::-webkit-scrollbar { width:5px; }
.pw::-webkit-scrollbar-thumb { background:var(--b1); border-radius:3px; }

/* ── Cards ── */
.card { background:var(--bc); border:1px solid var(--b0);
  border-radius:var(--rl); margin-bottom:18px; }
.card-h { padding:14px 18px; border-bottom:1px solid var(--b0);
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:8px; }
.card-t { font-size:13px; font-weight:600; }
.card-b { padding:18px; }

/* ── Stats Grid ── */
.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:20px; }
.sc { background:var(--bc); border:1px solid var(--b0); border-radius:var(--rl);
  padding:16px 18px; position:relative; overflow:hidden; cursor:pointer;
  transition:all var(--tr); }
.sc:hover { background:var(--bc2); transform:translateY(-1px); }
.sc::before { content:""; position:absolute; top:0; left:0; width:3px; height:100%; }
.sc.blue::before { background:var(--blue); }
.sc.amb::before  { background:var(--amb); }
.sc.pur::before  { background:var(--pur); }
.sc.grn::before  { background:var(--grn); }
.sc.red::before  { background:var(--red); }
.sc-lbl { font-size:10px; font-weight:600; letter-spacing:.6px;
  text-transform:uppercase; color:var(--t3); margin-bottom:8px; }
.sc-val { font-size:32px; font-weight:700; font-family:"JetBrains Mono",monospace; line-height:1; }
.sc.blue .sc-val { color:var(--blue); } .sc.amb .sc-val { color:var(--amb); }
.sc.pur .sc-val  { color:var(--pur); }  .sc.grn .sc-val { color:var(--grn); }
.sc.red .sc-val  { color:var(--red); }
.sc-ico { position:absolute; right:13px; top:50%; transform:translateY(-50%);
  font-size:28px; opacity:.1; }

/* ── Page Header ── */
.ph { display:flex; align-items:flex-start; justify-content:space-between;
  margin-bottom:22px; gap:12px; flex-wrap:wrap; }
.pt { font-size:20px; font-weight:700; color:var(--t1); letter-spacing:-.3px; }
.ps { font-size:12px; color:var(--t2); margin-top:3px; }

/* ── Buttons ── */
.btn { display:inline-flex; align-items:center; gap:6px; padding:7px 14px;
  border-radius:var(--r); font-size:12.5px; font-weight:600;
  font-family:"DM Sans",sans-serif; border:1px solid transparent;
  cursor:pointer; transition:all var(--tr); white-space:nowrap;
  text-decoration:none; }
.bp { background:var(--blue); color:#fff; border-color:var(--blue); }
.bp:hover { background:var(--blue2); }
.bs { background:var(--be); color:var(--t2); border-color:var(--b2); }
.bs:hover { background:var(--bc2); color:var(--t1); }
.bg { background:var(--gnd); color:var(--grn); border-color:rgba(16,185,129,.3); }
.bg:hover { background:rgba(16,185,129,.25); }
.br { background:var(--rdd); color:var(--red); border-color:rgba(239,68,68,.3); }
.br:hover { background:rgba(239,68,68,.25); }
.bw { background:var(--amd); color:var(--amb); border-color:rgba(245,158,11,.3); }
.bw:hover { background:rgba(245,158,11,.25); }
.sm { padding:4px 10px; font-size:11px; }

/* ── Badges ── */
.badge { display:inline-flex; align-items:center; gap:4px; padding:2px 8px;
  border-radius:20px; font-size:10px; font-weight:600; text-transform:uppercase;
  letter-spacing:.3px; }
.badge::before { content:"●"; font-size:7px; }
.bdw { background:var(--amd); color:var(--amb); }
.bdp { background:rgba(59,130,246,.15); color:var(--blue); }
.bds { background:rgba(100,116,139,.15); color:#64748b; }
.bdd { background:var(--rdd); color:var(--red); }
.bdg { background:var(--gnd); color:var(--grn); }
.bdv { background:var(--pud); color:var(--pur); }

/* ── Tables ── */
.twrap { overflow-x:auto; border-radius:var(--rl); border:1px solid var(--b0); }
table { width:100%; border-collapse:collapse; background:var(--bc); }
thead th { background:var(--be); padding:9px 13px; text-align:left; font-size:10px;
  font-weight:700; letter-spacing:.7px; text-transform:uppercase; color:var(--t3);
  border-bottom:1px solid var(--b0); white-space:nowrap; }
tbody tr { border-bottom:1px solid var(--b0); transition:background var(--tr); }
tbody tr:last-child { border-bottom:none; }
tbody tr:hover { background:var(--bc2); }
tbody td { padding:11px 13px; font-size:12.5px; color:var(--t2); vertical-align:middle; }
.tbold { font-weight:600; color:var(--t1); }
.tmono { font-family:"JetBrains Mono",monospace; font-size:11px; }

/* ── Forms ── */
.fg  { display:flex; flex-direction:column; gap:5px; margin-bottom:14px; }
.fl  { font-size:10.5px; font-weight:600; color:var(--t2);
  text-transform:uppercase; letter-spacing:.3px; }
.fc  { background:var(--bi); border:1px solid var(--b2); border-radius:var(--r);
  color:var(--t1); font-family:"DM Sans",sans-serif; font-size:13px;
  padding:8px 11px; transition:all var(--tr); width:100%; outline:none; }
.fc:focus { border-color:var(--blue); box-shadow:0 0 0 3px var(--bgl); }
.fc::placeholder { color:var(--t3); }
select.fc { cursor:pointer; }
textarea.fc { resize:vertical; min-height:80px; }
.g2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.g3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }
.s2 { grid-column:1/-1; }

/* ── Alerts ── */
.alert { padding:10px 14px; border-radius:var(--rm); font-size:12.5px;
  font-weight:500; display:flex; align-items:center; gap:8px;
  margin-bottom:16px; animation:sld .3s ease; }
@keyframes sld { from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:translateY(0)} }
.als { background:var(--gnd); border:1px solid rgba(16,185,129,.3); color:var(--grn); }
.ale { background:var(--rdd); border:1px solid rgba(239,68,68,.3);  color:var(--red); }

/* ── Login Page ── */
#login-pg { position:fixed; inset:0; background:var(--bd); z-index:999;
  display:flex; align-items:center; justify-content:center; }
.lgrid { position:absolute; inset:0;
  background-image: linear-gradient(rgba(59,130,246,.04) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(59,130,246,.04) 1px, transparent 1px);
  background-size:40px 40px; pointer-events:none; }
.lglow { position:absolute; width:600px; height:600px;
  background:radial-gradient(ellipse, rgba(59,130,246,.07) 0%, transparent 70%);
  top:50%; left:50%; transform:translate(-50%,-50%); pointer-events:none; }
.lcard { position:relative; width:420px; background:var(--bc); border:1px solid var(--b2);
  border-radius:var(--rl); padding:40px 36px 36px;
  box-shadow:0 12px 48px rgba(0,0,0,.6); animation:pop .5s ease; }
@keyframes pop { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }
.llogo { display:flex; align-items:center; gap:12px; margin-bottom:28px; }
.llogo-ico { width:56px; height:56px; background:rgba(255,255,255,.07);
  border-radius:var(--rm); display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.12); }
.llogo-name { font-size:21px; font-weight:800; color:var(--t1); letter-spacing:-1px; }
.llogo-name span { display:block; font-size:11px; font-weight:400; color:var(--t3); letter-spacing:.3px; }
.ldiv { height:1px; background:var(--b0); margin-bottom:24px; }
.lbtn { width:100%; padding:11px; font-size:14px; font-weight:700;
  background:var(--blue); color:#fff; border:none; border-radius:var(--r);
  cursor:pointer; font-family:"DM Sans",sans-serif; transition:all var(--tr); margin-top:6px; }
.lbtn:hover { background:var(--blue2); box-shadow:0 0 20px var(--bgl); }
.lfoot { text-align:center; margin-top:20px; font-size:11px; color:var(--t3); line-height:1.8; }

/* ── Plantão banner ── */
.pban { border-radius:var(--rl); padding:13px 16px; margin-bottom:18px; border:1px solid; }
.pban-d { background:rgba(245,158,11,.08); border-color:rgba(245,158,11,.22); }
.pban-n { background:rgba(139,92,246,.08); border-color:rgba(139,92,246,.22); }

/* ── Empty state ── */
.empty { text-align:center; padding:44px 18px; color:var(--t3); }
.empty p { font-size:13px; }

/* ── Responsive ── */
@media(max-width:900px) { .stats { grid-template-columns:repeat(2,1fr); } }
@media(max-width:640px) {
  .sidebar { display:none; }
  .stats { grid-template-columns:1fr 1fr; }
  .g2, .g3 { grid-template-columns:1fr; }
  .pw { padding:14px; }
}

/* ── Animations ── */
.fade { animation:fi .3s ease; }
@keyframes fi { from{opacity:0;transform:translateY(7px)} to{opacity:1;transform:translateY(0)} }