/* Atem · Orçamentos — ID visual Atem (paleta teal, clean, fundo claro) */
:root{
  --teal-900:#006B68;--teal:#008480;--teal-500:#008F8B;--teal-300:#3AA5A6;--teal-100:#D7EEEE;--teal-50:#EEF7F7;
  --slate:#456A72;--mist:#6C8996;--ink:#1E2626;--ink-2:#3A4545;--mute:#6C8996;
  --bg:#F3F6F6;--card:#FFFFFF;--line:#E1E8E9;--line-2:#CDD8DA;
  --ok:#1F9D6B;--erro:#D1434B;--aviso:#C98A12;
  --head:"Poppins","Urbane",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --body:"Inter","Tablet Gothic",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --r:14px;--sh:0 1px 2px rgba(30,38,38,.05),0 6px 20px -12px rgba(30,38,38,.18);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:14.5px;line-height:1.55;min-height:100%;-webkit-font-smoothing:antialiased}
a{color:var(--teal);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3,.head{font-family:var(--head)}

/* ── topo ─────────────────────────────────── */
header.topo{background:var(--card);border-bottom:1px solid var(--line);padding:0 28px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;position:sticky;top:0;z-index:20}
header .marca{display:flex;align-items:center;gap:14px;text-decoration:none!important}
header .marca img{height:34px;display:block}
header .marca .app{font-family:var(--head);font-weight:600;color:var(--ink);font-size:15px;padding-left:14px;border-left:1px solid var(--line-2);line-height:1}
header .marca .app small{display:block;font-family:var(--body);font-weight:400;color:var(--mute);font-size:11px;letter-spacing:.4px;margin-top:3px}
nav.menu{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
nav.menu a,nav.menu button{color:var(--slate);font-size:13.5px;font-weight:500;padding:8px 12px;border-radius:10px;background:none;border:0;cursor:pointer;font-family:inherit}
nav.menu a:hover,nav.menu a.ativo{color:var(--teal-900);background:var(--teal-50);text-decoration:none}
nav.menu .quem{color:var(--mute);font-size:12.5px;padding:0 10px;border-left:1px solid var(--line);margin-left:8px}
nav.menu .quem a{padding:0}
main{max-width:1140px;margin:0 auto;padding:34px 24px 90px}

/* ── tipografia de página ─────────────────── */
h1.titulo{font-size:26px;font-weight:700;letter-spacing:-.3px;color:var(--ink);margin-bottom:4px}
.sub-titulo{color:var(--mute);font-size:13.5px;margin-bottom:26px}
.topo-pagina{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap;margin-bottom:22px}

/* ── cards ────────────────────────────────── */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px 26px;margin-bottom:18px;box-shadow:var(--sh)}
.card h3{font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--teal);font-weight:700;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.campo{display:flex;flex-direction:column;gap:6px}
.campo.span2{grid-column:span 2}
label{font-size:11.5px;letter-spacing:.6px;text-transform:uppercase;color:var(--slate);font-weight:600}
input[type=text],input[type=password],input[type=number],select,textarea{
  background:#fff;border:1px solid var(--line-2);color:var(--ink);padding:10px 12px;border-radius:10px;font:inherit;font-size:14px;outline:none;width:100%;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{border-color:var(--teal-500);box-shadow:0 0 0 3px rgba(0,143,139,.14)}
input::placeholder,textarea::placeholder{color:#A3B1B6}
textarea{min-height:84px;resize:vertical;line-height:1.45}
.dica{color:var(--mute);font-size:12px}

/* ── botões ───────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:10px;font:inherit;font-size:13.5px;font-weight:600;cursor:pointer;border:1px solid transparent;text-decoration:none!important;white-space:nowrap;transition:filter .15s,background .15s,border-color .15s}
.btn-primario{background:var(--teal);color:#fff}.btn-primario:hover{background:var(--teal-900)}
.btn-contorno{background:#fff;border-color:var(--line-2);color:var(--ink-2)}.btn-contorno:hover{border-color:var(--teal-500);color:var(--teal-900)}
.btn-suave{background:var(--teal-50);color:var(--teal-900)}.btn-suave:hover{background:var(--teal-100)}
.btn-perigo{background:#fff;border-color:#F0C9CB;color:var(--erro)}.btn-perigo:hover{background:#FDF1F2}
.btn-sm{padding:6px 11px;font-size:12.5px;border-radius:8px}
.btn-add{background:transparent;border:1px dashed var(--line-2);color:var(--slate);padding:8px 14px;border-radius:10px;cursor:pointer;font:inherit;font-size:12.5px;font-weight:500;margin-top:6px}
.btn-add:hover{border-color:var(--teal-500);color:var(--teal-900);background:var(--teal-50)}
.btn-x{background:#fff;border:1px solid #F0C9CB;color:var(--erro);border-radius:10px;cursor:pointer;font-size:18px;height:41px;width:41px;align-self:end}
.btn-x:hover{background:#FDF1F2}
.linha-dyn{display:grid;gap:10px;align-items:end;margin-bottom:10px}

/* ── alertas ──────────────────────────────── */
.alerta{padding:12px 16px;border-radius:10px;margin-bottom:18px;font-size:13.5px;border:1px solid}
.alerta.ok{background:#EAF7F0;border-color:#BFE6D2;color:#176B49}
.alerta.erro{background:#FDF1F2;border-color:#F0C9CB;color:#9E2A31}
.alerta.aviso{background:#FFF7E6;border-color:#F5DFAE;color:#8A5A00}

/* ── tabelas ──────────────────────────────── */
table.lista{width:100%;border-collapse:collapse}
table.lista th{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--slate);text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);font-weight:700;background:#FAFCFC}
table.lista td{padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:13.5px}
table.lista td.nowrap{white-space:nowrap}
table.lista tr:last-child td{border-bottom:0}
table.lista tr:hover td{background:#F7FAFA}
.tag{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11px;letter-spacing:.6px;text-transform:uppercase;font-weight:700;border:1px solid}
.tag.link{color:var(--teal-900);border-color:var(--teal-100);background:var(--teal-50)}
.tag.interno{color:var(--slate);border-color:var(--line);background:#F5F7F8}
.acoes{display:flex;gap:6px;flex-wrap:wrap}
.vazio{text-align:center;padding:56px 20px;color:var(--mute)}
.vazio .ico{font-size:40px;margin-bottom:10px}
.filtros{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.filtros input[type=text]{width:280px}
.filtros select{width:auto}
.check{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#fff;border:1px solid var(--line-2);border-radius:10px;cursor:pointer;font-size:13.5px;text-transform:none;letter-spacing:0;font-weight:500;color:var(--ink)}
.check:hover{border-color:var(--teal-500)}
.check input{accent-color:var(--teal);width:16px;height:16px}
.check small{color:var(--mute)}
.rodape-form{display:flex;gap:12px;justify-content:flex-end;align-items:center;margin-top:6px}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;font-size:13.5px}
.kv dt{color:var(--mute)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}
.senha-nova{background:#EAF7F0;border:1px solid #BFE6D2;border-radius:12px;padding:14px 18px;margin-bottom:18px}
.senha-nova code{font-size:16px;background:#fff;padding:4px 10px;border-radius:6px;color:#176B49;border:1px solid #BFE6D2}
.inline-form{display:inline}

/* ── cards de clientes (home) ─────────────── */
.cards-clientes{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.card-cliente{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--sh);position:relative;overflow:hidden;transition:transform .15s,box-shadow .15s;text-decoration:none!important;color:inherit}
.card-cliente:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(30,38,38,.05),0 14px 30px -14px rgba(0,132,128,.35)}
.card-cliente::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--cor,var(--teal))}
.card-cliente .avatar{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-family:var(--head);font-weight:700;font-size:17px;color:#fff;background:var(--cor,var(--teal))}
.card-cliente .nome{font-family:var(--head);font-weight:700;font-size:18px;color:var(--ink)}
.card-cliente .sub{color:var(--mute);font-size:12.5px}
.card-cliente .rod{display:flex;justify-content:space-between;align-items:center;margin-top:8px;padding-top:12px;border-top:1px solid var(--line)}
.card-cliente .n{color:var(--slate);font-size:12.5px}
.card-cliente .n b{color:var(--ink);font-size:15px}
.card-cliente .entrar{color:var(--teal);font-weight:600;font-size:13px}

/* ── página do cliente (abas + link) ──────── */
.cliente-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap;margin-bottom:8px}
.cliente-head .ident{display:flex;align-items:center;gap:14px}
.cliente-head .avatar{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-family:var(--head);font-weight:700;font-size:19px;color:#fff;background:var(--cor,var(--teal))}
.cliente-head h1{font-size:24px;margin:0}
.cliente-head .sub{color:var(--mute);font-size:13px}
.voltar{color:var(--mute);font-size:12.5px;display:inline-flex;align-items:center;gap:6px;margin-bottom:14px}
.link-box{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px;min-width:300px;max-width:460px;box-shadow:var(--sh)}
.link-box .lab{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--teal);font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:8px}
.link-box .lab .dot{width:8px;height:8px;border-radius:50%;background:var(--ok)}
.link-box .url{display:flex;gap:8px;align-items:center}
.link-box input{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;padding:8px 10px;background:#FAFCFC}
.link-box .dica{margin-top:6px}
.abas{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:18px 0 24px}
.abas a{padding:10px 16px;font-weight:600;font-size:14px;color:var(--mute);border-bottom:2px solid transparent;margin-bottom:-1px;text-decoration:none!important}
.abas a:hover{color:var(--teal-900)}
.abas a.ativa{color:var(--teal-900);border-bottom-color:var(--teal)}
.abas a .n{display:inline-block;margin-left:6px;background:var(--teal-50);color:var(--teal-900);border-radius:999px;padding:1px 8px;font-size:11.5px}

/* ── login ────────────────────────────────── */
.login-wrap{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}
.login-lado{background:linear-gradient(135deg,#0FB3B0 0%,#008F8B 45%,#006B68 100%);color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:48px 56px;position:relative;overflow:hidden}
.login-lado img{height:52px;width:auto;align-self:flex-start}
.login-lado h2{font-size:34px;line-height:1.15;font-weight:700;letter-spacing:-.4px;max-width:420px}
.login-lado p{opacity:.9;max-width:420px;margin-top:12px;font-size:15px}
.login-lado .arcos{position:absolute;left:0;right:0;bottom:-2px;height:110px;opacity:.35}
.login-lado small{opacity:.75;font-size:12px}
.login-form{display:flex;align-items:center;justify-content:center;padding:40px 24px;background:var(--bg)}
.login-box{width:100%;max-width:400px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:36px;box-shadow:var(--sh)}
.login-box img{height:30px;margin-bottom:22px}
.login-box h1{font-size:22px;margin-bottom:4px}
.login-box .sub{color:var(--mute);font-size:13px;margin-bottom:22px}
.login-box .campo{margin-bottom:14px}
@media (max-width:860px){.login-wrap{grid-template-columns:1fr}.login-lado{display:none}}

/* ── público (médico) ─────────────────────── */
.pub-topo{background:var(--card);border-bottom:1px solid var(--line);padding:0 24px;height:64px;display:flex;align-items:center;justify-content:space-between}
.pub-topo .marca{display:flex;align-items:center;gap:12px}
.pub-topo .marca img{height:28px}
.pub-topo .clinica{font-family:var(--head);font-weight:600;color:var(--ink);font-size:14.5px;padding-left:12px;border-left:1px solid var(--line-2)}
.pub-topo .clinica small{display:block;font-family:var(--body);font-weight:400;color:var(--mute);font-size:11px}
.pub-topo .selo{font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--teal-900);background:var(--teal-50);padding:5px 10px;border-radius:999px;font-weight:700}

/* ── sucesso ──────────────────────────────── */
.sucesso{max-width:680px;margin:20px auto;text-align:center}
.sucesso .ico{width:64px;height:64px;border-radius:50%;background:var(--teal-50);color:var(--teal);display:flex;align-items:center;justify-content:center;font-size:30px;margin:0 auto 14px}
.sucesso .botoes{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:22px 0}
.preview{width:100%;height:72vh;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--sh)}
.pag{display:flex;gap:8px;justify-content:center;margin-top:18px;color:var(--mute);font-size:13px;align-items:center}

@media (max-width:720px){header.topo{padding:0 14px;height:auto;min-height:56px;flex-wrap:wrap;padding-bottom:8px}main{padding:20px 14px 60px}.campo.span2{grid-column:span 1}.linha-dyn{grid-template-columns:1fr!important}.btn-x{width:100%}.link-box{min-width:0;width:100%}}
