:root{--bg:#06101b;--panel:#0b1725;--panel2:#101f31;--line:#20334c;--blue:#1f68d8;--orange:#ff7a18;--text:#eef4fb;--muted:#8fa2b8;--green:#34c96f;--red:#c84a4a;--yellow:#d89c32}
html[data-theme="light"]{--bg:#edf2f7;--panel:#fff;--panel2:#f6f8fb;--line:#d7e0ea;--text:#18212b;--muted:#68788a}
*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text);display:flex;flex-direction:column}a{color:inherit;text-decoration:none}
.top{height:64px;background:var(--panel);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 16px;flex:0 0 auto}.logo{height:40px}
.shell{display:grid;grid-template-columns:218px 1fr;flex:1;min-height:calc(100vh - 64px)}.sidebar{background:var(--panel);border-right:1px solid var(--line);padding:12px 9px}.navtitle{font-size:10px;color:var(--muted);text-transform:uppercase;margin:15px 10px 6px}.nav{display:flex;gap:9px;align-items:center;padding:10px 11px;border-radius:8px}.nav:hover,.nav.active{background:#174a9e;color:white}
.contentwrap{display:flex;flex-direction:column;min-height:calc(100vh - 64px)}.inbox{display:grid;flex:1;min-height:0}.inbox.with-details{grid-template-columns:350px minmax(480px,1fr) 320px}.inbox.without-details{grid-template-columns:350px minmax(0,1fr)}.col{background:var(--panel);border-right:1px solid var(--line);min-height:0}.col:last-child{border-right:0}.head{padding:14px;border-bottom:1px solid var(--line)}
.toolbar{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}.filter{font-size:12px;padding:7px 9px;border:1px solid var(--line);border-radius:18px;color:var(--muted)}.filter.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.searchbox{width:100%;margin-top:8px}.newchat{display:grid;grid-template-columns:1fr;gap:7px;margin-top:10px}.newchat input,.newchat select{width:100%}
.conv{display:flex;gap:10px;padding:12px;border-bottom:1px solid var(--line);align-items:flex-start}.conv:hover,.conv.active{background:var(--panel2)}.convmain{flex:1;min-width:0}.avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;background:#203a5c;display:grid;place-items:center;font-weight:700}.convtitle{display:flex;justify-content:space-between;gap:8px}.protocol{font-size:11px;color:var(--muted)}.subject{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.meta{color:var(--muted);font-size:12px;margin-top:4px}.pill{font-size:10px;padding:2px 6px;border-radius:10px;background:#183a63}.pill.waiting{background:#6b4c15}.pill.active{background:#144b2a}.pill.closed{background:#3f4650}
.chathead{padding:13px 15px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.messages{height:calc(100vh - 300px);overflow:auto;padding:16px}.msg{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:10px;margin:8px 0;max-width:78%}.mine{margin-left:auto;border-color:#245b9a}.note{border-left:4px solid var(--orange)}.msgimg{max-width:420px;max-height:340px;border-radius:8px;display:block;margin-top:8px}.audio-player{width:320px;max-width:100%;margin-top:8px}.filelink{display:inline-block;margin-top:8px;padding:8px 10px;border:1px solid var(--line);border-radius:8px}
.composer{padding:10px 13px;border-top:1px solid var(--line)}.composerline{display:flex;gap:8px;align-items:center}.composerline input[type=text]{flex:1}.tools{display:flex;gap:8px;margin-top:8px;align-items:center;flex-wrap:wrap}.attachbtn{position:relative;overflow:hidden}.attachbtn input{position:absolute;inset:0;opacity:0;cursor:pointer}
.details{padding:14px}.detailcard{padding:10px 0;border-bottom:1px solid var(--line)}input,select{background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:10px}button,.btn{background:var(--blue);color:#fff;border:0;border-radius:8px;padding:10px 13px;cursor:pointer}.orange{background:var(--orange)}.danger{background:var(--red)}.recording{background:#a83232!important}
.main{padding:20px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}table{width:100%;border-collapse:collapse}th,td{padding:10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.alert{padding:12px;border-radius:8px;margin-bottom:14px;border:1px solid var(--line)}.alert.ok{background:#11351f;color:#8bf0aa}.alert.err{background:#3b1717;color:#ffaaaa}
.footer{margin-top:auto;flex-shrink:0;padding:12px;text-align:center;color:var(--muted);font-size:12px;border-top:1px solid var(--line);background:var(--panel)}
.loginwrap{height:100vh;display:grid;place-items:center;background:var(--bg)}.login{width:390px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px}.login .logo{height:62px}.login input{width:100%;margin:7px 0 12px}
.micwarn{font-size:11px;color:#f0ad65;display:none}

.newchat-toggle{width:100%;margin-top:10px;background:var(--panel2);border:1px solid var(--line);color:var(--text)}
.newchat.collapsed{display:none}
.newchat-actions{display:flex;gap:8px}
.secondary{background:transparent;border:1px solid var(--line);color:var(--text)}
.inbox.without-details .col:nth-child(2){border-right:0}
.details-col{min-width:0}
@media (max-width:1100px){.inbox.with-details{grid-template-columns:320px minmax(420px,1fr)}.details-col{display:none}}

.quick-form{display:grid;grid-template-columns:180px 1fr 180px 220px;gap:12px;align-items:end}
.quick-form input,.quick-form select,.quick-form textarea{width:100%}
.quick-body{grid-column:1/-1}
.quick-replies-box{position:relative;margin-top:8px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);max-height:280px;overflow:auto}
.quick-replies-head{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:10px;border-bottom:1px solid var(--line)}
.quick-replies-head input{min-width:280px}
.quick-reply-item{display:block;width:100%;text-align:left;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:10px;color:var(--text)}
.quick-reply-item:hover{background:var(--panel)}
.quick-reply-item b{display:inline-block;min-width:90px;color:#72aefc}
.quick-reply-item span{font-weight:600}
.quick-reply-item small{display:block;margin-top:4px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1000px){.quick-form{grid-template-columns:1fr 1fr}.quick-body{grid-column:1/-1}}

html,body{width:100%;max-width:100%;overflow-x:hidden}
.shell{width:100%;max-width:100%;min-width:0}
.contentwrap{width:100%;max-width:100%;min-width:0;overflow:hidden}
.inbox{width:100%;max-width:100%;min-width:0}
.col{min-width:0;overflow:hidden}
.head,.details,.composer,.main,.panel{max-width:100%}
input,select,textarea,button{max-width:100%}
table{display:block;overflow-x:auto;max-width:100%}
.messages{min-width:0}
.msg{overflow-wrap:anywhere;word-break:break-word}
.msgimg{max-width:100%;height:auto}
.audio-player{max-width:100%}
.password-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:var(--bg)}
.password-card{width:min(430px,100%);background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:24px}
.password-card input{display:block;width:100%;margin:6px 0 14px}
@media(max-width:1400px){
  .inbox.with-details{grid-template-columns:320px minmax(0,1fr) 280px}
}
@media(max-width:1180px){
  .shell{grid-template-columns:190px minmax(0,1fr)}
  .inbox.with-details{grid-template-columns:300px minmax(0,1fr)}
  .details-col{display:none}
}
@media(max-width:900px){
  .shell{grid-template-columns:1fr}
  .sidebar{display:none}
  .inbox.with-details,.inbox.without-details{grid-template-columns:280px minmax(0,1fr)}
}
@media(max-width:700px){
  .inbox.with-details,.inbox.without-details{grid-template-columns:1fr}
  .inbox .col:first-child{display:none}
  .messages{height:calc(100vh - 300px)}
}

/* V5.8 - identificação visual dos agentes */
.agent-name{font-weight:700}
.agent-color-0{color:#63b3ff}
.agent-color-1{color:#54d98c}
.agent-color-2{color:#f5b75f}
.agent-color-3{color:#c49cff}
.agent-color-4{color:#ff8f8f}
.agent-color-5{color:#63d7d2}
.agent-color-6{color:#f19bd1}
.agent-color-7{color:#c5d66d}
.msg-time{font-size:10px;color:var(--muted);opacity:.82}
.last-login{font-size:12px;color:var(--text);white-space:nowrap}
.password-ok{color:#67d98f;font-weight:600}
.password-warning{color:#f1b75b;font-weight:700}
.password-expired{color:#ff7c7c;font-weight:700}
@media(max-width:1350px){
  .main table{font-size:12px}
  .main table input,.main table select{padding:7px;font-size:12px}
}

.top-actions{display:flex;align-items:center;gap:12px}.dashboard-main{overflow:auto}.dashboard-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.dashboard-title h2,.dashboard-title h3{margin:0}.donut-grid{display:grid;grid-template-columns:repeat(6,minmax(135px,1fr));gap:14px;margin:14px 0 20px}.metric-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;display:grid;place-items:center}.donut{width:128px;height:128px;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(currentColor 78%,var(--panel2) 0)}.donut:after{content:"";position:absolute;width:94px;height:94px;border-radius:50%;background:var(--panel)}.donut>div{position:relative;z-index:1;text-align:center;width:84px}.donut strong{display:block;font-size:28px;color:var(--text)}.donut span{display:block;font-size:11px;color:var(--muted);margin-top:5px}.d-online{color:#54d98c}.d-waiting{color:#f5b75f}.d-service{color:#63b3ff}.d-opened{color:#c49cff}.d-closed{color:#63d7d2}.d-time{color:#f19bd1}.queue-badge{font-size:13px;background:var(--panel2);border:1px solid var(--line);padding:6px 10px;border-radius:999px}.sector-row{display:grid;grid-template-columns:150px minmax(0,1fr) 42px;gap:12px;align-items:center;margin:12px 0}.sector-track{height:10px;background:var(--panel2);border-radius:999px;overflow:hidden}.sector-track i{display:block;height:100%;background:currentColor;border-radius:999px}
.msg{background:color-mix(in srgb,var(--panel2) 78%,white 22%);border-color:color-mix(in srgb,var(--line) 75%,white 25%)}.msg.mine{background:color-mix(in srgb,#275a92 68%,white 32%)}html[data-theme="light"] .msg{background:#f3f6fa}html[data-theme="light"] .msg.mine{background:#dcecff}
.image-open{display:block;background:transparent;border:0;padding:0;margin-top:7px;cursor:zoom-in;max-width:100%}.image-modal{display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.88);align-items:center;justify-content:center}.image-modal.open{display:flex}.image-modal-stage{position:absolute;inset:56px 0 0;display:flex;align-items:center;justify-content:center;overflow:auto;padding:24px}.image-modal-stage img{max-width:92vw;max-height:84vh;object-fit:contain;transition:transform .12s ease}.image-modal-toolbar{position:absolute;z-index:2;top:12px;right:18px;display:flex;gap:8px}.image-modal-toolbar button,.image-modal-toolbar .btn{min-width:42px;background:#20242b;color:#fff;border:1px solid #555}.modal-open{overflow:hidden}
@media(max-width:1450px){.donut-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.donut-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.donut-grid{grid-template-columns:1fr}.sector-row{grid-template-columns:90px minmax(0,1fr) 32px}}

/* V6.0 - navegação retrátil */
.shell{grid-template-columns:72px minmax(0,1fr)!important;position:relative}
.sidebar{width:72px;overflow:hidden;white-space:nowrap;transition:width .18s ease,box-shadow .18s ease;position:relative;z-index:50}
.sidebar:hover{width:224px;box-shadow:10px 0 24px rgba(0,0,0,.28)}
.sidebar-brand{height:38px;display:grid;place-items:center;font-weight:800;font-size:13px;border:1px solid var(--line);border-radius:9px;margin:2px 8px 10px;width:42px}
.sidebar .nav{width:204px}
.sidebar .nav-icon{display:inline-grid;width:32px;min-width:32px;place-items:center;font-size:16px}
.sidebar .nav-label{opacity:0;transition:opacity .12s ease}
.sidebar:hover .nav-label{opacity:1}
.sidebar .navtitle{opacity:0;transition:opacity .12s ease;width:190px}
.sidebar:hover .navtitle{opacity:1}

/* V6.0 dashboard */
.dashboard-main{background:radial-gradient(circle at 20% 0%,color-mix(in srgb,var(--blue) 9%,transparent),transparent 34%)}
.dashboard-split{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px}
.dashboard-side{height:max-content}
.status-summary{display:flex;justify-content:space-between;gap:10px;padding:13px 0;border-bottom:1px solid var(--line)}
.dashboard-inbox-btn{display:block;text-align:center;margin-top:16px}
.metric-card{box-shadow:0 8px 24px rgba(0,0,0,.08);transition:transform .15s ease,border-color .15s ease}
.metric-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--blue) 55%,var(--line))}
.toast-ok{margin:10px 14px 0;padding:10px 12px;border-radius:8px;background:#123a22;color:#91efae;border:1px solid #285e3a;font-size:13px}
.footer-version{opacity:.7}

/* general action buttons */
button[type=submit],button:not([type]){cursor:pointer}
button:disabled{opacity:.5;cursor:not-allowed}

@media(max-width:1100px){
  .dashboard-split{grid-template-columns:1fr}
  .dashboard-side{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .dashboard-side h3,.dashboard-inbox-btn{grid-column:1/-1}
}
@media(max-width:700px){
  .shell{grid-template-columns:1fr!important}
  .sidebar{display:none}
  .dashboard-side{grid-template-columns:1fr}
}

/* V6.4 clean */
.shell{grid-template-columns:72px minmax(0,1fr)!important}
.sidebar{width:72px;transition:width .18s ease,box-shadow .18s ease;overflow:hidden;white-space:nowrap;background:var(--panel)}
.sidebar:hover{width:292px;box-shadow:12px 0 28px rgba(0,0,0,.24)}
.sidebar-brand{display:flex;align-items:center;gap:10px;width:270px;margin:4px 8px 12px;border:0;background:transparent}
.brand-mark{width:42px;height:42px;min-width:42px;display:grid;place-items:center;border-radius:10px;background:var(--panel2);border:1px solid var(--line);font-weight:800}
.brand-text{font-size:13px;font-weight:700;opacity:0}.sidebar:hover .brand-text{opacity:1}
.sidebar .nav{width:272px;min-height:42px;padding:9px 10px;font-size:13px;gap:8px;border-radius:9px}
.sidebar .nav-icon{width:34px;min-width:34px;font-size:17px;display:inline-grid;place-items:center}.sidebar .nav-label{white-space:nowrap;opacity:0}.sidebar:hover .nav-label{opacity:1}
.sidebar .navtitle{width:260px;padding-left:10px;font-size:9px;letter-spacing:.08em}.sidebar:hover .navtitle{opacity:1}
.contentwrap,.main,.inbox,.panel,.col{min-width:0}.main{padding:18px}.panel{border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.details{padding:12px 14px}.detailcard{padding:10px 0;border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent)}.details h4{margin:16px 0 8px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.participant-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.participant-row small{color:var(--muted);font-size:11px}
.profile-menu-wrap{position:relative;margin-left:auto}.profile-trigger{display:flex;align-items:center;gap:9px;background:transparent;color:var(--text);border:1px solid transparent;border-radius:10px;padding:6px 8px}.profile-trigger:hover{background:var(--panel2);border-color:var(--line)}
.profile-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:var(--blue);color:#fff;font-weight:700}.profile-avatar.large{width:46px;height:46px}.profile-trigger-text{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}.profile-trigger-text b{font-size:12px}.profile-trigger-text small{font-size:10px;color:var(--muted);margin-top:3px}.profile-caret{font-size:12px;color:var(--muted)}
.profile-dropdown{display:none;position:absolute;right:0;top:calc(100% + 8px);width:250px;z-index:200;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 44px rgba(0,0,0,.28);padding:8px}.profile-dropdown.open{display:block}.profile-summary{display:flex;gap:10px;align-items:center;padding:8px 8px 12px;border-bottom:1px solid var(--line);margin-bottom:6px}.profile-summary div{display:flex;flex-direction:column}.profile-summary small{color:var(--muted);font-size:11px;margin-top:3px}
.profile-dropdown a,.profile-dropdown button{width:100%;display:flex;align-items:center;gap:8px;text-align:left;padding:10px;border-radius:8px;background:transparent;border:0;color:var(--text);font-size:12px}.profile-dropdown a:hover,.profile-dropdown button:hover{background:var(--panel2)}.profile-divider{height:1px;background:var(--line);margin:5px 0}.logout-link{color:#ff8b8b!important}.footer-version{opacity:.7}
@media(max-width:1180px){.sidebar:hover{width:270px}.sidebar .nav{width:250px;font-size:12.5px}}
@media(max-width:760px){.profile-trigger-text{display:none}.profile-dropdown{width:230px}}

/* V6.4 - Tema institucional azul */
:root{
  --brand-blue:#1d3d6b;
  --bg:#1d3d6b;
  --panel:#1d3d6b;
  --panel2:color-mix(in srgb,#1d3d6b 82%,#0b1a2d 18%);
  --line:color-mix(in srgb,#1d3d6b 66%,#ffffff 34%);
  --blue:#2f7eea;
  --text:#ffffff;
  --muted:#c5d3e7;
}
body,.top,.sidebar,.contentwrap,.col,.panel,.footer{
  background-color:var(--brand-blue);
}
.top,.sidebar,.panel,.col,.footer{
  border-color:rgba(255,255,255,.16);
}
.nav:hover,.nav.active{
  background:linear-gradient(90deg,#1d63c9,#246ed6);
}
.profile-dropdown{
  background:color-mix(in srgb,var(--brand-blue) 90%,#08172a 10%);
}

/* V6.4 - correção definitiva do menu de perfil */
.top{
  position:relative;
  z-index:400;
  overflow:visible!important;
}
.profile-menu-wrap{
  position:relative;
  z-index:500;
  pointer-events:auto;
}
.profile-trigger{
  position:relative;
  z-index:501;
  pointer-events:auto;
  cursor:pointer;
  user-select:none;
}
.profile-trigger *{
  pointer-events:none;
}
.profile-dropdown{
  z-index:1000!important;
  pointer-events:auto;
  visibility:hidden;
  opacity:0;
  transform:translateY(-4px);
  display:block!important;
  transition:opacity .12s ease,transform .12s ease,visibility .12s ease;
}
.profile-dropdown.open{
  visibility:visible;
  opacity:1;
  transform:translateY(0);
}
.profile-dropdown a,
.profile-dropdown button{
  pointer-events:auto;
}
.contentwrap,.shell,.main{
  position:relative;
  z-index:auto;
}

/* V6.5 - temas */
html[data-theme="light"]{--bg:#eef2f7;--panel:#ffffff;--panel2:#f5f7fa;--line:#d8dee8;--text:#172033;--muted:#667085;--blue:#246ed6}
html[data-theme="dark"]{--bg:#101827;--panel:#172235;--panel2:#202d43;--line:#334155;--text:#f8fafc;--muted:#a9b5c7;--blue:#2f7eea}
html[data-theme="custom"]{--brand-blue:var(--custom-theme,#1d3d6b);--bg:var(--custom-theme,#1d3d6b);--panel:var(--custom-theme,#1d3d6b);--panel2:color-mix(in srgb,var(--custom-theme,#1d3d6b) 78%,#07111f 22%);--line:rgba(255,255,255,.18);--text:#fff;--muted:#d3ddec;--blue:#4b91ef}
html[data-theme="light"] body,html[data-theme="light"] .top,html[data-theme="light"] .sidebar,html[data-theme="light"] .contentwrap,html[data-theme="light"] .panel,html[data-theme="light"] .footer{background-color:var(--bg)}
html[data-theme="dark"] body,html[data-theme="dark"] .top,html[data-theme="dark"] .sidebar,html[data-theme="dark"] .contentwrap,html[data-theme="dark"] .panel,html[data-theme="dark"] .footer{background-color:var(--bg)}
.theme-color-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0}.theme-color-row input[type=color]{width:56px;height:38px;padding:2px}.theme-presets{display:flex;gap:7px;flex-wrap:wrap;margin:8px 0 16px}.theme-presets button{font-size:11px}
.pdf-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.pdf-btn{display:inline-flex;align-items:center;gap:6px;text-decoration:none;padding:9px 12px;border-radius:8px;background:var(--blue);color:#fff;font-size:12px;font-weight:700}
@media(max-width:760px){
  html,body{max-width:100%;overflow-x:hidden}
  .top{min-height:58px;padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}
  .logo{max-width:145px}
  .main{padding:10px}.panel{max-width:100%;overflow-x:auto}
  table{min-width:680px}
  input,select,textarea,button{max-width:100%;font-size:16px}
  .profile-dropdown{right:0;max-width:calc(100vw - 20px)}
  .footer{padding-bottom:max(10px,env(safe-area-inset-bottom))}
  .chatbox{max-width:100%}.bubble{max-width:86%}
  img,video,audio{max-width:100%}
}

/* V6.6 produção */
.pagination{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding:16px 0 4px;font-size:12px;color:var(--muted)}
.pagination .btn{padding:7px 10px}
