:root { --petrol:#1d3031; --deep:#152526; --cream:#f7f3ea; --copper:#b9452a; --orange:#f0734f; --sage:#d9e7df; --line:#c8d6cb; }
html { scroll-padding-top: 85px; }
body.client-page { min-width:320px; background:var(--cream); color:var(--petrol); }
:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
button { transition:background .2s ease, color .2s ease, transform .2s ease; }
.client-header { position:sticky; top:0; z-index:30; height:76px; background:var(--petrol); color:var(--cream); border-bottom:1px solid #829b8c66; }
.client-header-inner { max-width:1600px; height:100%; margin:auto; padding:0 30px; display:flex; align-items:center; justify-content:space-between; gap:25px; }
.client-brand { display:flex; align-items:center; gap:12px; text-decoration:none; font-size:1.05rem; font-weight:900; letter-spacing:-.05em; white-space:nowrap; }
.client-brand small { display:block; font-size:.51rem; letter-spacing:.13em; margin-top:4px; color:#c8d8ce; }
.client-mark { width:34px; height:34px; border:2px solid var(--orange); border-radius:7px; display:grid; place-items:center; color:var(--orange); font-size:1.2rem; }
.header-right { display:flex; gap:22px; align-items:center; }
.environment-pill { color:#d5e2d9; border:1px solid #759184; padding:7px 10px; font-size:.59rem; font-weight:900; letter-spacing:.08em; white-space:nowrap; }
.client-user { font-size:.78rem; font-weight:800; white-space:nowrap; }
#logout { background:var(--orange); color:var(--petrol); border:0; padding:11px 15px; font-size:.73rem; font-weight:900; white-space:nowrap; }
#logout:hover { background:#ffa184; transform:translateY(-2px); }
#logout span { margin-left:10px; }
.workspace { max-width:1600px; margin:auto; display:grid; grid-template-columns:238px minmax(0,1fr); min-height:calc(100vh - 76px); }
.sidebar { background:var(--deep); color:var(--cream); }
.sidebar-inner { position:sticky; top:76px; min-height:calc(100vh - 76px); padding:32px 16px 28px; display:flex; flex-direction:column; }
.sidebar-label { font-size:.6rem; font-weight:900; letter-spacing:.14em; color:#9fb9aa; margin:0 12px 20px; }
.panel-nav { display:grid; gap:7px; }
.panel-nav button { background:transparent; color:#d6e3da; border:1px solid transparent; text-align:left; min-height:50px; padding:12px; font-size:.82rem; font-weight:800; display:flex; align-items:center; gap:10px; }
.panel-nav button span { color:var(--orange); font-size:1.2rem; width:23px; text-align:center; }
.panel-nav button b { margin-left:auto; border-radius:20px; background:#435f55; padding:3px 7px; font-size:.66rem; }
.panel-nav button:hover { background:#29413f; }
.panel-nav button.active { background:var(--sage); color:var(--petrol); }
.panel-nav button.active b { background:var(--petrol); color:white; }
.sidebar-bottom { margin:auto 10px 0; border-top:1px solid #6c897a; padding-top:25px; }
.sidebar-orb { color:var(--orange); font-size:2rem; }
.sidebar-bottom strong { display:block; font-size:1.1rem; line-height:1.05; letter-spacing:-.04em; margin:10px 0; }
.sidebar-bottom p { font-size:.7rem; line-height:1.5; color:#b5cabc; }
.panel-main { min-width:0; padding:48px min(5vw,65px) 90px; }
.panel-alert { background:#fce7dc; color:#762d1c; border-left:5px solid var(--copper); padding:14px 18px; margin-bottom:25px; font-size:.82rem; }
.panel-view[hidden] { display:none; }
.page-top { display:flex; justify-content:space-between; align-items:end; gap:25px; margin-bottom:32px; }
.page-top .eyebrow { color:var(--copper); margin:0 0 18px; }
.page-top h1 { font-family:Arial Black,Arial,sans-serif; font-size:clamp(3.25rem,6vw,6.5rem); font-weight:1000; letter-spacing:-.09em; line-height:.93; margin:0 0 18px; }
.page-top h1 span { color:var(--copper); }
.page-top p:last-child { font-size:.9rem; color:#51665c; margin:0; line-height:1.5; }
.refresh-button { border:1px solid var(--petrol); background:transparent; padding:13px 16px; font-size:.69rem; font-weight:900; white-space:nowrap; }
.refresh-button:hover { background:var(--petrol); color:white; transform:translateY(-2px); }
.refresh-button span { font-size:1.1rem; margin-left:10px; }
.demo-banner { display:flex; align-items:center; gap:20px; background:var(--sage); border-left:6px solid var(--copper); padding:15px 18px; margin-bottom:25px; font-size:.78rem; line-height:1.4; }
.demo-banner strong { white-space:nowrap; font-size:.68rem; letter-spacing:.07em; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:24px; }
.metric-grid article { background:#fff; border:1px solid var(--line); border-top:6px solid var(--copper); min-height:170px; padding:20px; display:flex; flex-direction:column; }
.metric-grid article:nth-child(2) { border-top-color:var(--petrol); }
.metric-grid article:nth-child(3) { border-top-color:var(--orange); }
.metric-grid article:nth-child(4) { border-top-color:#85a995; }
.metric-grid span { font-size:.66rem; font-weight:900; letter-spacing:.08em; }
.metric-grid strong { font-family:Arial Black,Arial,sans-serif; font-size:3.55rem; line-height:1; letter-spacing:-.08em; margin:auto 0 8px; }
.metric-grid small { font-size:.71rem; color:#718178; }
.overview-grid { display:grid; grid-template-columns:1.13fr .87fr; gap:16px; margin-bottom:20px; }
.panel-card { background:#fff; border:1px solid var(--line); padding:25px; min-width:0; }
.card-head { display:flex; justify-content:space-between; gap:15px; align-items:start; border-bottom:1px solid var(--line); padding-bottom:18px; margin-bottom:18px; }
.card-head .eyebrow { color:var(--copper); margin:0 0 8px; font-size:.59rem; }
.card-head h2, .settings-card h2 { font-family:Arial Black,Arial,sans-serif; font-size:1.48rem; letter-spacing:-.07em; line-height:1.04; margin:0; }
.card-head > span { color:#8ca095; font-size:.64rem; font-weight:900; }
.pipeline-bars { display:grid; gap:14px; }
.pipeline-row { display:grid; grid-template-columns:120px minmax(0,1fr) 22px; gap:12px; align-items:center; font-size:.74rem; font-weight:800; }
.pipeline-track { height:12px; background:#edf3ee; overflow:hidden; }
.pipeline-track i { display:block; height:100%; background:var(--copper); transition:width .7s cubic-bezier(.2,.8,.2,1); }
.pipeline-row:nth-child(2) i { background:var(--petrol); }
.pipeline-row:nth-child(3) i { background:var(--orange); }
.pipeline-row:nth-child(4) i { background:#80aa94; }
.pipeline-row:nth-child(5) i { background:#bacbc0; }
.pipeline-card > p { color:#718178; font-size:.71rem; margin:20px 0 0; }
.attention-list { display:grid; gap:9px; }
.attention-item { width:100%; display:flex; justify-content:space-between; align-items:center; gap:15px; background:#f6f7f2; border:1px solid #dce5dd; padding:14px; text-align:left; }
.attention-item:hover { background:var(--sage); transform:translateX(3px); }
.attention-item strong { display:block; font-size:.8rem; }
.attention-item small { display:block; color:#6e7e75; font-size:.7rem; margin-top:4px; }
.attention-item > span:last-child { font-size:1.2rem; color:var(--copper); }
.empty-inline { font-size:.78rem; color:#61756b; line-height:1.5; }
.recent-card { margin-bottom:15px; }
.text-link { border:0; background:transparent; color:var(--copper); font-size:.7rem; font-weight:900; white-space:nowrap; }
.text-link:hover { transform:translateY(-2px); text-decoration:underline; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; text-align:left; min-width:660px; }
th { font-size:.59rem; letter-spacing:.08em; padding:10px 10px 13px 0; color:#62786a; }
td { border-top:1px solid #e3ebe3; padding:15px 10px 15px 0; font-size:.76rem; }
td:first-child { font-weight:900; }
tbody tr { cursor:pointer; }
tbody tr:hover { background:#f2f6f0; }
.status-pill { display:inline-block; border-radius:20px; padding:6px 9px; font-size:.64rem; font-weight:900; white-space:nowrap; background:#ecf0ec; }
.status-novo { background:#edf0e9; }
.status-qualificado { background:#d9e7df; }
.status-humano { background:#ffe0d4; color:#8e371e; }
.status-agendado { background:#dce9ef; color:#1b5364; }
.status-concluido { background:#e8e8e2; color:#55625a; }
.lead-toolbar { display:flex; align-items:end; flex-wrap:wrap; gap:10px; margin:0 0 18px; }
.lead-toolbar label { font-size:.7rem; font-weight:900; margin-right:2px; }
.lead-toolbar input, .lead-toolbar select { border:1px solid #8fa99b; background:#fff; color:var(--petrol); padding:12px 13px; border-radius:0; min-height:46px; }
.lead-toolbar input { min-width:230px; flex:1; }
.lead-toolbar select { min-width:175px; }
.leads-card { padding:14px 22px; }
.leads-card td:last-child { color:var(--copper); font-size:1.1rem; font-weight:900; }
.empty-state { padding:25px; font-size:.82rem; color:#61756b; }
.settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.settings-card .eyebrow { color:var(--copper); margin:0 0 12px; }
.settings-card dl { margin:25px 0 0; }
.settings-card dl div { display:flex; justify-content:space-between; gap:15px; padding:16px 0; border-top:1px solid #e1e9e2; font-size:.8rem; }
.settings-card dt { color:#6c7e73; }
.settings-card dd { margin:0; font-weight:900; text-align:right; overflow-wrap:anywhere; }
.connection-off { background:#edf0e9; color:#64756b; border-radius:20px; padding:5px 8px; font-size:.69rem; }
.onboarding-card { margin-top:20px; }
.onboarding-card .card-head > span { color:var(--copper); border:1px solid var(--copper); padding:7px 9px; white-space:nowrap; }
.onboarding-card > p { font-size:.82rem; line-height:1.55; color:#536961; margin:0 0 18px; }
.onboarding-progress { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:25px; }
.onboarding-progress span { background:#e8eee7; border-top:4px solid #aabdaf; padding:10px; font-size:.67rem; font-weight:900; }
.onboarding-progress span.done { background:var(--sage); border-top-color:var(--petrol); }
.onboarding-fields { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.onboarding-field { display:grid; align-content:start; gap:8px; }
.onboarding-wide { grid-column:1/-1; }
.onboarding-field label { font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; font-weight:900; }
.onboarding-field input,.onboarding-field textarea { width:100%; border:1px solid #8fa99b; border-radius:0; background:#fff; color:var(--petrol); padding:12px; font-size:.82rem; line-height:1.5; }
.onboarding-field textarea { resize:vertical; }
.onboarding-field small { font-size:.69rem; color:#65786d; line-height:1.45; }
.onboarding-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:22px; }
.onboarding-actions button { min-height:45px; padding:12px 15px; font-size:.69rem; font-weight:900; }
.onboarding-actions button:disabled { opacity:.5; cursor:wait; }
#save-onboarding { border:1px solid var(--petrol); color:var(--petrol); background:transparent; }
#save-onboarding:hover:not(:disabled) { background:var(--sage); }
#submit-onboarding { border:1px solid var(--copper); background:var(--copper); color:#fff; }
#submit-onboarding:hover:not(:disabled) { background:#9e351e; }
#onboarding-message { font-size:.74rem; color:var(--copper); flex-basis:100%; min-height:15px; }
.onboarding-card .onboarding-disclaimer { border-top:1px solid var(--line); padding-top:15px; margin:20px 0 0; font-size:.72rem; }
.settings-next { display:flex; gap:25px; background:var(--petrol); color:var(--cream); padding:32px; margin-top:20px; }
.settings-next > span { color:var(--orange); font-size:3rem; line-height:1; }
.settings-next .eyebrow { color:var(--orange); margin:0 0 12px; }
.settings-next h2 { font-family:Arial Black,Arial,sans-serif; font-size:clamp(1.8rem,3vw,3rem); line-height:1.05; letter-spacing:-.07em; margin:0 0 15px; }
.settings-next p:last-child { max-width:680px; font-size:.82rem; line-height:1.6; }
.lead-dialog { width:min(520px,calc(100% - 24px)); max-height:calc(100vh - 40px); border:0; padding:28px; color:var(--petrol); background:var(--cream); box-shadow:15px 15px 0 var(--sage); }
.lead-dialog::backdrop { background:#081716bb; }
.dialog-head { display:flex; justify-content:space-between; align-items:center; }
.dialog-head .eyebrow { color:var(--copper); }
.dialog-head button { border:0; background:transparent; font-size:1.8rem; }
.lead-dialog h2 { font-family:Arial Black,Arial,sans-serif; font-size:2.6rem; letter-spacing:-.07em; line-height:1; margin:20px 0 8px; }
.detail-interest { font-size:.92rem; color:#64766b; }
.lead-dialog dl { margin:25px 0; border-top:1px solid var(--line); }
.lead-dialog dl div { display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid var(--line); padding:12px 0; font-size:.8rem; }
.lead-dialog dd { margin:0; font-weight:800; text-align:right; }
.lead-dialog h3 { font-size:.7rem; letter-spacing:.1em; }
.lead-dialog > p:not(.detail-interest) { line-height:1.55; font-size:.85rem; }
#status-form { display:grid; gap:10px; margin-top:30px; }
#status-form label { font-size:.7rem; font-weight:900; text-transform:uppercase; letter-spacing:.07em; }
#status-form select { min-height:48px; padding:10px; border:1px solid #8fa99b; background:#fff; }
#status-form button { display:flex; justify-content:space-between; background:var(--copper); border:0; color:#fff; min-height:49px; padding:14px; font-size:.75rem; font-weight:900; }
#status-form button:hover { background:#9e351e; }
#detail-message { font-size:.75rem; color:var(--copper); min-height:17px; margin:0; }
@media (max-width:1100px) { .metric-grid { grid-template-columns:repeat(2,1fr); } .overview-grid { grid-template-columns:1fr; } }
@media (max-width:850px) { .workspace { display:block; } .sidebar-inner { position:static; min-height:0; padding:9px 16px; } .sidebar-label,.sidebar-bottom { display:none; } .panel-nav { display:flex; overflow-x:auto; } .panel-nav button { flex:none; min-height:45px; } .panel-main { padding:35px 24px 70px; } }
@media (max-width:620px) { .client-header { height:68px; } .client-header-inner { padding:0 16px; gap:8px; } .client-brand { font-size:.84rem; gap:7px; } .client-brand small { font-size:.41rem; } .client-mark { width:26px; height:26px; font-size:.9rem; } .environment-pill,.client-user { display:none; } #logout { padding:9px 11px; font-size:.68rem; } .panel-main { padding:30px 16px 60px; } .page-top { display:block; } .page-top h1 { font-size:clamp(2.7rem,10vw,4rem); } .refresh-button { margin-top:20px; } .demo-banner { display:block; } .demo-banner strong { display:block; margin-bottom:5px; } .metric-grid { gap:8px; } .metric-grid article { padding:15px; min-height:140px; } .metric-grid strong { font-size:2.8rem; } .panel-card { padding:18px; } .pipeline-row { grid-template-columns:90px minmax(0,1fr) 16px; gap:8px; font-size:.67rem; } .lead-toolbar label { width:100%; } .lead-toolbar input,.lead-toolbar select { width:100%; } .settings-grid,.onboarding-fields { grid-template-columns:1fr; } .onboarding-progress { grid-template-columns:repeat(2,1fr); } .settings-next { padding:23px; } .settings-next > span { display:none; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition-duration:.01ms!important; animation-duration:.01ms!important; } }

/* Fichas e histórico de atendimento */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.conversation-layout { display:grid; grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr); gap:16px; min-height:660px; }
.conversation-list,.conversation-stage { padding:0; overflow:hidden; }
.conversation-list .card-head { padding:24px 24px 18px; margin:0; }
.conversation-list > input { display:block; width:calc(100% - 48px); margin:18px 24px; padding:12px 14px; border:1px solid #9bb1a3; background:#f8faf6; color:var(--petrol); }
.conversation-items { max-height:620px; overflow:auto; }
.conversation-item { display:grid; gap:8px; width:100%; border:0; border-top:1px solid #e5ece5; background:#fff; color:var(--petrol); text-align:left; padding:18px 24px; }
.conversation-item:hover { background:#f1f6ef; }
.conversation-item.selected { background:var(--sage); box-shadow:inset 5px 0 0 var(--copper); }
.conversation-item-top { display:flex; justify-content:space-between; gap:12px; align-items:baseline; }
.conversation-item-top strong { font-size:.84rem; }
.conversation-item-top small { color:#63796b; font-size:.64rem; white-space:nowrap; }
.conversation-preview { font-size:.77rem; color:#52695c; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.conversation-topic { color:var(--copper); font-size:.63rem; font-weight:900; text-transform:uppercase; letter-spacing:.04em; }
.conversation-stage { display:flex; flex-direction:column; background:#f4f7f1; }
.conversation-stage-head { display:flex; align-items:center; justify-content:space-between; gap:16px; background:#fff; border-bottom:1px solid var(--line); padding:23px 26px; }
.conversation-stage-head .eyebrow { color:var(--copper); margin:0 0 8px; }
.conversation-stage-head h2 { font-family:Arial Black,Arial,sans-serif; letter-spacing:-.06em; font-size:1.4rem; margin:0 0 7px; }
.conversation-stage-head p:last-child { color:#61756a; font-size:.72rem; margin:0; }
.outline-button { border:1px solid var(--petrol); padding:12px 14px; background:transparent; color:var(--petrol); font-size:.64rem; font-weight:900; white-space:nowrap; }
.outline-button:hover { background:var(--petrol); color:#fff; }
.message-thread { display:flex; flex-direction:column; gap:14px; padding:25px; overflow:auto; }
.conversation-stage .message-thread { flex:1; }
.empty-thread { align-items:center; justify-content:center; color:#74887a; font-size:.82rem; text-align:center; }
.message-bubble { align-self:flex-start; width:min(88%,500px); padding:15px 18px; background:#fff; border:1px solid #dae5d9; box-shadow:3px 3px 0 #d9e5da; }
.message-bubble.message-agent { align-self:flex-end; background:#dfece1; border-color:#c4d8c6; }
.message-bubble.message-human { align-self:flex-end; border-left:4px solid var(--copper); }
.message-meta { display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin-bottom:8px; }
.message-meta strong { color:var(--copper); font-size:.67rem; text-transform:uppercase; letter-spacing:.06em; }
.message-agent .message-meta strong { color:var(--petrol); }
.message-meta time { color:#718579; font-size:.61rem; white-space:nowrap; }
.message-bubble p { margin:0; font-size:.79rem; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
.detail-navigation { display:flex; justify-content:space-between; align-items:center; gap:15px; margin:0 0 25px; }
.detail-navigation > span { font-size:.61rem; letter-spacing:.08em; font-weight:900; color:#748879; }
.back-button { border:0; background:transparent; padding:0; color:var(--copper); font-size:.68rem; font-weight:900; letter-spacing:.05em; }
.back-button:hover { text-decoration:underline; }
.detail-hero { display:flex; align-items:end; justify-content:space-between; gap:20px; padding:0 0 25px; border-bottom:1px solid var(--line); margin-bottom:24px; }
.detail-hero .eyebrow { color:var(--copper); margin:0 0 12px; }
.detail-hero h1 { font-family:Arial Black,Arial,sans-serif; font-size:clamp(2.7rem,5vw,5rem); letter-spacing:-.09em; line-height:.98; margin:0; }
.detail-interest { color:#536b5c; margin:12px 0 0; font-size:.9rem; }
.detail-hero .status-pill { margin-bottom:6px; }
.detail-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr); gap:17px; align-items:start; }
.detail-primary { display:grid; gap:17px; }
.lead-fields { display:grid; grid-template-columns:1fr 1fr; gap:17px; }
.lead-fields > div { min-width:0; display:grid; align-content:start; gap:7px; }
.lead-fields .wide { grid-column:1/-1; }
.lead-fields label { font-size:.64rem; font-weight:900; text-transform:uppercase; letter-spacing:.06em; color:#52695c; }
.lead-fields input,.lead-fields select,.lead-fields textarea { width:100%; min-height:45px; border:1px solid #94aa9a; border-radius:0; background:#fbfcf9; padding:11px 12px; color:var(--petrol); font:inherit; font-size:.82rem; }
.lead-fields textarea { resize:vertical; line-height:1.55; }
.readonly-value { margin:0; min-height:45px; display:flex; align-items:center; background:#eff3ec; border:1px solid #dce6db; padding:10px 12px; font-size:.82rem; }
.form-footer { display:flex; align-items:center; flex-wrap:wrap; gap:14px; margin-top:23px; }
#save-lead { border:0; background:var(--copper); color:#fff; min-height:48px; padding:12px 17px; font-size:.69rem; font-weight:900; }
#save-lead:hover { background:#96361f; }
#save-lead:disabled { opacity:.6; cursor:wait; }
#detail-message { font-size:.73rem; color:var(--copper); }
.lead-timeline dl { margin:0; }
.lead-timeline dl div { display:flex; justify-content:space-between; gap:20px; border-top:1px solid #e2e9e1; padding:13px 0; font-size:.76rem; }
.lead-timeline dt { color:#61776a; }
.lead-timeline dd { margin:0; font-weight:800; text-align:right; }
.transcript-card { padding:0; overflow:hidden; }
.transcript-card .card-head { padding:25px 25px 18px; margin:0; }
.transcript-note { margin:0; background:#f0f4ed; border-bottom:1px solid var(--line); padding:12px 25px; color:#5c7164; font-size:.69rem; line-height:1.45; }
.transcript-card .message-thread { max-height:590px; min-height:230px; background:#f6f8f3; }
.transcript-card .message-bubble { width:min(95%,420px); }
.full-width { width:calc(100% - 50px); margin:0 25px 25px; }
@media (max-width:1150px) { .detail-grid { grid-template-columns:1fr; } .conversation-layout { grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr); } }
@media (max-width:720px) { .conversation-layout { display:block; } .conversation-list { margin-bottom:16px; } .conversation-items { max-height:290px; } .conversation-stage { min-height:460px; } .conversation-stage-head { display:block; } .conversation-stage-head .outline-button { margin-top:15px; } .detail-hero { align-items:start; } .detail-hero .status-pill { margin-top:10px; } }
@media (max-width:520px) { .lead-fields { grid-template-columns:1fr; } .lead-fields .wide { grid-column:auto; } .detail-hero { display:block; } .detail-hero h1 { font-size:2.8rem; } .message-thread { padding:16px; } .message-bubble { width:95%; } .detail-navigation > span { display:none; } }