*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;font-family:'DM Sans',sans-serif;background:#f8fafc;overflow:hidden}
.app-wrap{height:100%;width:100%;display:flex;overflow:hidden}
.sidebar{width:250px;min-width:250px;height:100%;background:linear-gradient(180deg,#0e4a54 0%,#15636f 50%,#1a7a88 100%);display:flex;flex-direction:column;overflow-y:auto;transition:transform .3s}
.main-area{flex:1;height:100%;overflow-y:auto;overflow-x:hidden}
.nav-item{display:flex;align-items:center;gap:12px;padding:10px 20px;color:rgba(255,255,255,.7);cursor:pointer;transition:all .2s;border-radius:8px;margin:2px 12px;font-size:14px;font-weight:500}
.nav-item:hover{background:rgba(255,255,255,.1);color:#fff}
.nav-item.active{background:rgba(255,255,255,.15);color:#fff;font-weight:600}
.nav-item i{width:20px;height:20px}
.kpi-card{background:#fff;border-radius:16px;padding:24px;border:1px solid #e2e8f0;transition:all .3s;position:relative;overflow:hidden}
.kpi-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,.08)}
.kpi-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px}
.kpi-card.c1::after{background:linear-gradient(90deg,#15636f,#1e88c7)}
.kpi-card.c2::after{background:linear-gradient(90deg,#1e88c7,#38bdf8)}
.kpi-card.c3::after{background:linear-gradient(90deg,#10b981,#34d399)}
.kpi-card.c4::after{background:linear-gradient(90deg,#f59e0b,#fbbf24)}
.kpi-card.c5::after{background:linear-gradient(90deg,#8b5cf6,#a78bfa)}
.kpi-card.c6::after{background:linear-gradient(90deg,#ef4444,#f87171)}
.chart-box{background:#fff;border-radius:16px;padding:24px;border:1px solid #e2e8f0}
.kanban-col{min-width:280px;max-width:280px;background:#f1f5f9;border-radius:12px;padding:12px;height:fit-content;max-height:100%}
.kanban-card{background:#fff;border-radius:10px;padding:14px;border:1px solid #e2e8f0;cursor:pointer;transition:all .2s;margin-bottom:8px}
.kanban-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.08);transform:translateY(-1px)}
.badge{display:inline-flex;align-items:center;padding:2px 10px;border-radius:20px;font-size:11px;font-weight:600}
.tl-dot{width:10px;height:10px;border-radius:50%;border:2px solid #15636f;background:#fff;position:absolute;left:-5px;top:6px}
.tl-item{position:relative;padding-left:24px;padding-bottom:20px;border-left:2px solid #e2e8f0;margin-left:4px}
.tl-item:last-child{border-left:none}
.inbox-container{display:grid;grid-template-columns:280px 1fr 320px;gap:12px;height:calc(100% - 180px);overflow:hidden}
.inbox-list{background:#fff;border-radius:16px;border:1px solid #e2e8f0;display:flex;flex-direction:column;overflow:hidden}
.inbox-chat{background:#fff;border-radius:16px;border:1px solid #e2e8f0;display:flex;flex-direction:column;overflow:hidden}
.inbox-sidebar{background:#fff;border-radius:16px;border:1px solid #e2e8f0;display:flex;flex-direction:column;overflow:hidden}
.conv-item{padding:12px;border-bottom:1px solid #e2e8f0;cursor:pointer;transition:all .2s;display:flex;gap:10px;align-items:flex-start}
.conv-item:hover{background:#f8fafc}
.conv-item.active{background:#f0f4f8;border-left:3px solid #15636f}
.conv-avatar{width:40px;height:40px;border-radius:50%;flex-shrink:0;font-weight:700;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px}
.conv-content{flex:1;min-width:0}
.conv-name{font-weight:600;font-size:13px;color:#1e293b}
.conv-client{font-size:11px;color:#64748b}
.conv-msg{font-size:12px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px}
.conv-time{font-size:10px;color:#cbd5e1;text-align:right}
.conv-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:12px;font-size:10px;font-weight:600;white-space:nowrap}
.msg-group{margin-bottom:16px}
.msg-bubble{padding:10px 14px;border-radius:12px;max-width:70%;word-wrap:break-word;font-size:13px;line-height:1.4}
.msg-user{background:#15636f;color:#fff;margin-left:auto;border-radius:12px 2px 12px 12px}
.msg-client{background:#f1f5f9;color:#1e293b;margin-right:auto;border-radius:2px 12px 12px 12px}
.msg-info{font-size:11px;color:#64748b;margin-top:4px;text-align:right}
.msg-internal{background:#fef3c7;color:#92400e;border-left:3px solid #f59e0b;padding:10px 14px;border-radius:4px;margin:12px 0;font-size:12px}
.chat-input{border-top:1px solid #e2e8f0;padding:12px;display:flex;gap:8px;align-items:flex-end}
.quick-action{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#f1f5f9;border-radius:8px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;color:#1e293b;border:1px solid #cbd5e1}
.quick-action:hover{background:#e2e8f0;border-color:#94a3b8}
.sidebar-section{padding:12px;border-bottom:1px solid #e2e8f0;font-size:11px}
.sidebar-label{font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}
.sidebar-item{padding:8px;background:#f8fafc;border-radius:8px;margin-bottom:6px;font-size:12px;color:#1e293b}
.sla-indicator{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600}
.typing-indicator{display:flex;gap:4px;align-items:center}
.dot{width:6px;height:6px;border-radius:50%;background:#cbd5e1;animation:bounce .6s infinite}
.dot:nth-child(1){animation-delay:0s}
.dot:nth-child(2){animation-delay:.2s}
.dot:nth-child(3){animation-delay:.4s}
@keyframes bounce{0%,60%,100%{opacity:.5;transform:translateY(0)}30%{opacity:1;transform:translateY(-6px)}}
@media(max-width:1280px){.inbox-container{grid-template-columns:240px 1fr 280px}}
@media(max-width:1024px){.inbox-container{grid-template-columns:1fr;height:auto}.inbox-sidebar{display:none}}
.tab-btn{padding:8px 20px;font-size:13px;font-weight:500;border-radius:8px;cursor:pointer;transition:all .2s;color:#64748b;background:transparent;border:none}
.tab-btn.active{background:#15636f;color:#fff}
.tab-btn:hover:not(.active){background:#e2e8f0}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:100;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.modal-bg.show{display:flex}
.modal-box{background:#fff;border-radius:20px;max-width:600px;width:90%;max-height:80%;overflow-y:auto;padding:32px;animation:modalIn .3s}
@keyframes modalIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.progress-bar{height:6px;border-radius:3px;background:#e2e8f0;overflow:hidden}
.progress-fill{height:100%;border-radius:3px;transition:width .5s}
.sla-ring{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}
.table-row{transition:background .15s}
.table-row:hover{background:#f8fafc}
.mobile-toggle{display:none}
@media(max-width:1024px){.sidebar{position:fixed;z-index:50;transform:translateX(-100%)}.sidebar.open{transform:translateX(0)}.mobile-toggle{display:flex}}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.fade-up{animation:fadeUp .4s ease both}
.fade-up-1{animation-delay:.05s}.fade-up-2{animation-delay:.1s}.fade-up-3{animation-delay:.15s}.fade-up-4{animation-delay:.2s}.fade-up-5{animation-delay:.25s}
::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}

.dept-stage-board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,1fr);gap:14px;overflow-x:auto;padding-bottom:4px}
.dept-stage-column{background:#f1f5f9;border:1px solid #e2e8f0;border-radius:14px;padding:12px;min-height:210px}
.dept-stage-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.dept-stage-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:12px;margin-bottom:10px;cursor:pointer;transition:.2s}
.dept-stage-card:hover{box-shadow:0 4px 12px rgba(15,23,42,.07)}

.dept-card-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}
.dept-card-action-btn{width:30px;height:30px;min-width:30px;border-radius:10px;border:1px solid #e2e8f0;background:#fff;color:#64748b;display:flex;align-items:center;justify-content:center;transition:.18s ease}
.dept-card-action-btn:hover{background:#f8fafc;color:#15636f}
.dept-card-action-btn.warn{border-color:#fde68a;color:#d97706}
.dept-card-action-btn.warn:hover{background:#fffbeb;color:#b45309}
.dept-custom-field{font-size:11px;color:#64748b;margin-top:6px;display:flex;gap:4px;min-width:0}
.dept-custom-field b{color:#475569;white-space:nowrap}
.dept-custom-field span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dept-config-row{display:grid;grid-template-columns:34px 1.2fr 170px 130px 90px;gap:10px;align-items:center;padding:10px;border:1px solid #e2e8f0;border-radius:12px;background:#fff}
.dept-config-row input,.dept-config-row select{width:100%;border:1px solid #e2e8f0;border-radius:10px;padding:8px 10px;font-size:13px;outline:none;background:#fff}
@media(max-width:900px){.dept-config-row{grid-template-columns:1fr}}

.dept-card-action-btn.info{border-color:#bfdbfe;color:#1e88c7}
.dept-card-action-btn.info:hover{background:#eff6ff;color:#1670a8}
.dept-card-action-btn.file{border-color:#c7d2fe;color:#6366f1}
.dept-card-action-btn.file:hover{background:#eef2ff;color:#4f46e5}
.dept-upload-config{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;margin:0 0 18px 0}
.dept-upload-config label{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#334155}
.dept-file-list{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px}
.dept-file-pill{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:800;color:#475569;background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;padding:4px 8px}



.projeto-row{background:#fff;border:1px solid #e2e8f0;border-radius:14px;margin-bottom:10px;overflow:hidden;transition:all .2s}
.projeto-row:hover{box-shadow:0 4px 14px rgba(15,23,42,.06);border-color:#cbd5e1}
.projeto-row-main{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr auto;gap:14px;align-items:center;padding:16px 18px;cursor:pointer}
.projeto-row-details{display:none;border-top:1px solid #e2e8f0;background:#f8fafc;padding:16px 18px}
.projeto-row.open .projeto-row-details{display:block}
.projeto-row.open .expand-icon{transform:rotate(180deg)}
.expand-icon{transition:transform .2s}
@media(max-width:1100px){.projeto-row-main{grid-template-columns:1fr;gap:8px}.projeto-row-main>div{text-align:left!important}}


/* ===== DUAL CHAT: CLIENTE + INTERNO ===== */
.dual-chat-wrapper{display:flex;flex-direction:column;overflow:hidden}
.dual-chat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1;min-height:0;padding:12px}
.dual-chat-panel{background:#fff;border:1px solid #e2e8f0;border-radius:14px;display:flex;flex-direction:column;min-height:0;overflow:hidden}
.dual-chat-header{padding:12px 14px;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;background:#f8fafc}
.dual-chat-title{font-size:13px;font-weight:700;color:#1e293b}
.dual-chat-subtitle{font-size:11px;color:#94a3b8;margin-top:2px}
.dual-chat-messages{flex:1;overflow-y:auto;padding:14px;background:#f8fafc;min-height:280px}
.dual-chat-input{border-top:1px solid #e2e8f0;padding:10px;display:flex;gap:8px;background:#fff}
.internal-card{background:#fff;border:1px solid #e2e8f0;border-left:3px solid #f59e0b;border-radius:10px;padding:10px;margin-bottom:10px;font-size:12px}
.internal-card-user{font-weight:700;color:#1e293b;margin-bottom:4px}
.internal-card-text{color:#475569;line-height:1.35}
.internal-card-time{font-size:10px;color:#94a3b8;margin-top:6px}
@media(max-width:1280px){.dual-chat-grid{grid-template-columns:1fr}.dual-chat-messages{min-height:220px}}





/* =========================
   FIX SEGURO DE LAYOUT GLOBAL
   Corrige tela cortada sem sobrepor a sidebar
========================= */
html, body {
  width: 100%;
  min-height: 100%;
  margin: 0;
  overflow-x: hidden;
  background: #f4f7fb;
}

.app-shell,
.app-layout,
.flex.h-screen {
  width: 100%;
  min-height: 100vh;
}

/* Mantém a sidebar no fluxo original do layout */
.sidebar,
aside {
  flex: 0 0 280px;
  max-width: 280px;
  min-width: 280px;
  height: 100vh;
  position: sticky;
  top: 0;
  z-index: 30;
}

/* Área principal nunca fica por baixo da sidebar */
.main,
.main-content,
.content-area,
main {
  flex: 1 1 auto;
  width: auto !important;
  max-width: none !important;
  margin-left: 0 !important;
  min-width: 0;
  min-height: 100vh;
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Topbar e páginas respeitam largura disponível */
.topbar,
.header,
main > header {
  width: 100%;
  box-sizing: border-box;
}

.page-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 24px !important;
  box-sizing: border-box;
  overflow-x: hidden;
}

.page-content.hidden {
  display: none !important;
}

.page-content:not(.hidden) {
  display: block;
}

/* Evita cards e grids ultrapassarem a tela */
.chart-box,
.content-box,
.info-box,
.kpi-card,
.modal-box {
  box-sizing: border-box;
  max-width: 100%;
}

.grid,
.flex {
  min-width: 0;
}

/* Grids padronizados */
.config-grid-fixed {
  display: grid;
  grid-template-columns: repeat(3, minmax(260px, 1fr));
  gap: 24px;
  align-items: start;
  width: 100%;
}

.portal-grid-fixed {
  display: grid;
  grid-template-columns: repeat(2, minmax(300px, 1fr));
  gap: 24px;
  align-items: start;
  width: 100%;
}

#configEquipesDepartamentos,
#configEquipesLista,
#configEquipesPessoas {
  min-height: 360px;
}

/* Kanbans com rolagem interna, sem cortar a tela */
.dept-stage-board,
.kanban-board,
#departamentosKanbanEtapas {
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 8px;
}

/* Tabelas com rolagem interna */
.table-wrapper,
.overflow-x-auto {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

/* Responsivo */
@media (max-width: 1200px) {
  .config-grid-fixed,
  .portal-grid-fixed {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .sidebar,
  aside {
    flex-basis: 86px;
    min-width: 86px;
    max-width: 86px;
  }

  .page-content {
    padding: 16px !important;
  }
}


/* =========================
   FIX BOTÃO EXPANDIR / MENU
========================= */
.sidebar.sidebar-collapsed,
aside.sidebar-collapsed {
  width: 76px !important;
  min-width: 76px !important;
  max-width: 76px !important;
  overflow: hidden;
}

.sidebar.sidebar-collapsed .sidebar-label,
.sidebar.sidebar-collapsed .nav-label,
.sidebar.sidebar-collapsed span:not(.badge),
aside.sidebar-collapsed .sidebar-label,
aside.sidebar-collapsed .nav-label,
aside.sidebar-collapsed span:not(.badge) {
  opacity: 0;
  pointer-events: none;
}

.sidebar.sidebar-collapsed .menu-text,
aside.sidebar-collapsed .menu-text {
  display: none !important;
}

.main-content.main-expanded,
.content-area.main-expanded,
main.main-expanded {
  width: calc(100% - 76px) !important;
  max-width: calc(100% - 76px) !important;
}

@media (min-width: 901px) {
  .sidebar.sidebar-collapsed + .main-content,
  .sidebar.sidebar-collapsed + .content-area,
  aside.sidebar-collapsed + main {
    width: calc(100% - 76px) !important;
  }
}


/* =========================
   SIDEBAR RECOLHIDA: SOMENTE ÍCONES
========================= */
.sidebar.sidebar-collapsed,
aside.sidebar-collapsed {
  width: 86px !important;
  min-width: 86px !important;
  max-width: 86px !important;
  overflow: hidden !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
}

/* Esconde textos, subtítulos, labels e usuário quando recolhido */
.sidebar.sidebar-collapsed h1,
.sidebar.sidebar-collapsed h2,
.sidebar.sidebar-collapsed h3,
.sidebar.sidebar-collapsed p,
.sidebar.sidebar-collapsed span:not(.icon-only):not(.badge),
.sidebar.sidebar-collapsed .text-xs,
.sidebar.sidebar-collapsed .text-sm,
.sidebar.sidebar-collapsed .font-semibold:not(.keep-icon),
.sidebar.sidebar-collapsed .sidebar-text,
.sidebar.sidebar-collapsed .nav-text,
.sidebar.sidebar-collapsed .menu-text,
.sidebar.sidebar-collapsed .user-info,
.sidebar.sidebar-collapsed .logo-text,
.sidebar.sidebar-collapsed .section-title,
aside.sidebar-collapsed h1,
aside.sidebar-collapsed h2,
aside.sidebar-collapsed h3,
aside.sidebar-collapsed p,
aside.sidebar-collapsed span:not(.icon-only):not(.badge),
aside.sidebar-collapsed .text-xs,
aside.sidebar-collapsed .text-sm,
aside.sidebar-collapsed .font-semibold:not(.keep-icon),
aside.sidebar-collapsed .sidebar-text,
aside.sidebar-collapsed .nav-text,
aside.sidebar-collapsed .menu-text,
aside.sidebar-collapsed .user-info,
aside.sidebar-collapsed .logo-text,
aside.sidebar-collapsed .section-title {
  display: none !important;
  opacity: 0 !important;
  width: 0 !important;
  max-width: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

/* Mantém botões centralizados */
.sidebar.sidebar-collapsed a,
.sidebar.sidebar-collapsed button,
.sidebar.sidebar-collapsed .nav-item,
.sidebar.sidebar-collapsed [onclick*="showPage"],
aside.sidebar-collapsed a,
aside.sidebar-collapsed button,
aside.sidebar-collapsed .nav-item,
aside.sidebar-collapsed [onclick*="showPage"] {
  justify-content: center !important;
  align-items: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  gap: 0 !important;
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Ícones sempre visíveis e centralizados */
.sidebar.sidebar-collapsed i,
.sidebar.sidebar-collapsed svg,
aside.sidebar-collapsed i,
aside.sidebar-collapsed svg {
  display: block !important;
  opacity: 1 !important;
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  margin: 0 auto !important;
}

/* Logo recolhida: mostra apenas o ícone */
.sidebar.sidebar-collapsed .logo,
.sidebar.sidebar-collapsed .brand,
aside.sidebar-collapsed .logo,
aside.sidebar-collapsed .brand {
  justify-content: center !important;
}

/* Card do usuário recolhido: só avatar */
.sidebar.sidebar-collapsed .user-card,
.sidebar.sidebar-collapsed .profile-card,
aside.sidebar-collapsed .user-card,
aside.sidebar-collapsed .profile-card {
  width: 56px !important;
  height: 56px !important;
  padding: 0 !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Ajusta conteúdo quando recolhe */
.main-content.main-expanded,
.content-area.main-expanded,
main.main-expanded {
  margin-left: 0 !important;
  width: auto !important;
  max-width: none !important;
}


/* FIX MENU SEM ESPAÇO VAZIO */
.nav-item:empty,
nav div:empty,
nav button:empty,
nav a:empty{
display:none!important;
height:0!important;
padding:0!important;
margin:0!important;
}


/* INBOX PROJETOS */
.inbox-tab.active{background:#f1f5f9;font-weight:700;color:#1e293b}
.inbox-project-item{padding:14px 16px;border-bottom:1px solid #f1f5f9;cursor:pointer;transition:.18s}
.inbox-project-item:hover{background:#f8fafc}
.inbox-project-item.active{background:#ecfeff;border-left:4px solid #15636f}
.project-pill{font-size:10px;border-radius:999px;padding:3px 8px;background:#e8f3f5;color:#15636f;font-weight:700}
.quick-btn{border:1px solid #e2e8f0;border-radius:10px;padding:10px 8px;font-size:12px;font-weight:700;color:#334155;background:#f8fafc;display:flex;align-items:center;justify-content:center;gap:6px}
.quick-btn:hover{background:#f1f5f9}


/* FIX MODAL NOVA EQUIPE */
#novaEquipeModalFull .modal-box,
#equipeModal .modal-box {
  max-width: 760px !important;
  width: 94% !important;
}
#novaEquipePessoasChecks label {
  width: 100%;
}


/* FIX LISTA DE PROJETOS NO INBOX */
.inbox-tab.active{background:#f1f5f9;font-weight:700;color:#1e293b}
.inbox-project-item{padding:14px 16px;border-bottom:1px solid #eef2f7;cursor:pointer;transition:.18s ease}
.inbox-project-item:hover{background:#f8fafc}
.inbox-project-item.active{background:#ecfeff;border-left:4px solid #15636f}
.project-pill{font-size:10px;border-radius:999px;padding:3px 8px;background:#e8f3f5;color:#15636f;font-weight:700}
.quick-btn{border:1px solid #e2e8f0;border-radius:10px;padding:10px 8px;font-size:12px;font-weight:700;color:#334155;background:#f8fafc;display:flex;align-items:center;justify-content:center;gap:6px}
.quick-btn:hover{background:#f1f5f9}


/* AUTOCOMPLETE @ PESSOAS NO INBOX */
.mention-box {
  position: fixed;
  z-index: 99999;
  width: 280px;
  max-height: 220px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 18px 45px rgba(15, 23, 42, .18);
  padding: 6px;
  display: none;
}
.mention-item {
  padding: 9px 10px;
  border-radius: 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
}
.mention-item:hover {
  background: #f1f5f9;
}
.mention-avatar {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #15636f;
  color: white;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mention-meta {
  font-size: 11px;
  color: #94a3b8;
}


/* KANBAN: NOME DO PROJETO NO CARD */
.dept-stage-card .text-slate800,
.kanban-card .text-slate800 {
  letter-spacing: -0.01em;
}


/* UPLOAD DE ARQUIVO/IMAGEM NO INBOX */
.upload-preview-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 10px;
  font-size: 13px;
  color: #334155;
}
.upload-preview-card img {
  max-width: 220px;
  max-height: 160px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  display: block;
  margin-top: 8px;
}
.upload-file-line {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}






/* ===== LAYOUT FINAL: BOTAO HAMBURGUER + PROPORCAO ===== */
:root{
  --sidebar-open: 280px;
  --sidebar-closed: 82px;
  --topbar-height: 76px;
  --page-padding: 32px;
}

/* Sidebar */
#sidebar,
aside#sidebar,
aside.sidebar{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  width: var(--sidebar-open) !important;
  min-width: var(--sidebar-open) !important;
  max-width: var(--sidebar-open) !important;
  z-index: 50 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  transition: width .22s ease, min-width .22s ease, max-width .22s ease !important;
}

body.sidebar-collapsed #sidebar,
body.sidebar-collapsed aside#sidebar,
body.sidebar-collapsed aside.sidebar{
  width: var(--sidebar-closed) !important;
  min-width: var(--sidebar-closed) !important;
  max-width: var(--sidebar-closed) !important;
}

/* Main */
#mainContent,
main#mainContent,
main.main-content{
  margin-left: var(--sidebar-open) !important;
  width: calc(100vw - var(--sidebar-open)) !important;
  max-width: calc(100vw - var(--sidebar-open)) !important;
  min-width: 0 !important;
  min-height: 100vh !important;
  padding-top: var(--topbar-height) !important;
  overflow-x: hidden !important;
  transition: margin-left .22s ease, width .22s ease, max-width .22s ease !important;
  box-sizing: border-box !important;
}

body.sidebar-collapsed #mainContent,
body.sidebar-collapsed main#mainContent,
body.sidebar-collapsed main.main-content{
  margin-left: var(--sidebar-closed) !important;
  width: calc(100vw - var(--sidebar-closed)) !important;
  max-width: calc(100vw - var(--sidebar-closed)) !important;
}

/* Header/topbar */
#mainContent > header,
main#mainContent > header,
main.main-content > header,
.topbar{
  position: fixed !important;
  top: 0 !important;
  left: var(--sidebar-open) !important;
  right: 0 !important;
  width: auto !important;
  height: var(--topbar-height) !important;
  z-index: 45 !important;
  background: #fff !important;
  border-bottom: 1px solid #e2e8f0 !important;
  transition: left .22s ease !important;
  box-sizing: border-box !important;
}

body.sidebar-collapsed #mainContent > header,
body.sidebar-collapsed main#mainContent > header,
body.sidebar-collapsed main.main-content > header,
body.sidebar-collapsed .topbar{
  left: var(--sidebar-closed) !important;
}

/* Botao hamburger da topbar */
#sidebarTopToggle{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  border-radius: 12px !important;
  border: 1px solid #dbe4ef !important;
  background: #fff !important;
  color: #334155 !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

#sidebarTopToggle:hover{
  background:#f8fafc !important;
}

/* Remove botao flutuante antigo */
#sidebarToggleFixed{
  display:none !important;
}

/* Sidebar recolhida: apenas icones */
body.sidebar-collapsed #sidebar h1,
body.sidebar-collapsed #sidebar h2,
body.sidebar-collapsed #sidebar p,
body.sidebar-collapsed #sidebar span,
body.sidebar-collapsed #sidebar .brand-text,
body.sidebar-collapsed #sidebar .sidebar-text,
body.sidebar-collapsed #sidebar .nav-text,
body.sidebar-collapsed #sidebar .menu-text,
body.sidebar-collapsed #sidebar .sidebar-section-label,
body.sidebar-collapsed #sidebar .user-info{
  display:none !important;
}

body.sidebar-collapsed #sidebar nav a,
body.sidebar-collapsed #sidebar .nav-item,
body.sidebar-collapsed #sidebar .sidebar-link{
  width: 56px !important;
  height: 54px !important;
  margin: 4px auto !important;
  padding: 0 !important;
  justify-content: center !important;
  gap: 0 !important;
  overflow: hidden !important;
  font-size: 0 !important;
}

body.sidebar-collapsed #sidebar nav a *,
body.sidebar-collapsed #sidebar .nav-item *,
body.sidebar-collapsed #sidebar .sidebar-link *{
  font-size: 0 !important;
  line-height: 0 !important;
}

body.sidebar-collapsed #sidebar nav a svg,
body.sidebar-collapsed #sidebar nav a i,
body.sidebar-collapsed #sidebar .nav-item svg,
body.sidebar-collapsed #sidebar .nav-item i,
body.sidebar-collapsed #sidebar .sidebar-link svg,
body.sidebar-collapsed #sidebar .sidebar-link i{
  display:block !important;
  width:24px !important;
  height:24px !important;
  min-width:24px !important;
  margin:0 auto !important;
  font-size:24px !important;
  line-height:1 !important;
}

body.sidebar-collapsed #sidebar .user-card{
  width:56px !important;
  height:56px !important;
  padding:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  justify-content:center !important;
  overflow:hidden !important;
}

/* Paginas */
#mainContent > section,
main#mainContent > section,
main.main-content > section,
.page,
.content-page,
[id^="page-"]{
  width: 100% !important;
  max-width: 100% !important;
  padding: var(--page-padding) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  transform: none !important;
  left: auto !important;
  right: auto !important;
}

/* Grades gerais */
.grid,
.dashboard-grid{
  max-width:100% !important;
  box-sizing:border-box !important;
}

/* Dashboard proporcional */
#page-dashboard .grid:first-of-type,
#page-dashboard .dashboard-grid{
  display:grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 20px !important;
}

#page-dashboard .grid-cols-2{
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* Inbox proporcional */
#page-inbox{
  height: calc(100vh - var(--topbar-height)) !important;
  overflow: hidden !important;
}

#page-inbox .inbox-layout{
  display:grid !important;
  grid-template-columns: 320px minmax(620px, 1fr) 300px !important;
  gap:18px !important;
  width:100% !important;
  max-width:100% !important;
  height: calc(100vh - var(--topbar-height) - 130px) !important;
  min-height:620px !important;
  overflow:hidden !important;
  align-items:stretch !important;
}

#page-inbox .inbox-layout > *{
  min-width:0 !important;
  max-width:100% !important;
  height:100% !important;
}

#page-inbox .inbox-main-chat{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:14px !important;
  height:calc(100% - 84px) !important;
  overflow:hidden !important;
}

#page-inbox .inbox-chat-column{
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  height:100% !important;
  overflow:hidden !important;
}

#page-inbox .inbox-messages{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
}

#page-inbox .inbox-input-row{
  display:flex !important;
  gap:8px !important;
  padding:10px !important;
  flex-shrink:0 !important;
}

#page-inbox .inbox-input-row input{
  min-width:0 !important;
  flex:1 !important;
}

/* Responsivo */
@media(max-width:1500px){
  :root{ --page-padding:24px; }
  #page-inbox .inbox-layout{
    grid-template-columns: 290px minmax(560px,1fr) 280px !important;
    gap:14px !important;
  }
}

@media(max-width:1200px){
  #page-inbox{
    height:auto !important;
    overflow:auto !important;
  }
  #page-inbox .inbox-layout{
    grid-template-columns:1fr !important;
    height:auto !important;
    overflow:visible !important;
  }
  #page-inbox .inbox-main-chat{
    grid-template-columns:1fr !important;
    height:auto !important;
  }
  #page-dashboard .grid-cols-2{
    grid-template-columns:1fr !important;
  }
}



/* WORKFLOWS IA */
.workflow-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:16px;transition:.2s;cursor:pointer}
.workflow-card:hover{box-shadow:0 8px 22px rgba(15,23,42,.08);transform:translateY(-1px)}
.workflow-card.active{border-color:#15636f;background:#ecfeff}
.workflow-dot{width:10px;height:10px;border-radius:999px;background:#10b981;box-shadow:0 0 0 4px rgba(16,185,129,.12)}
.workflow-dot.off{background:#94a3b8;box-shadow:0 0 0 4px rgba(148,163,184,.15)}
.agent-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:16px}
.agent-avatar{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,#15636f,#1e88c7);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}
.workflow-log-row{display:grid;grid-template-columns:140px 1fr 120px 100px;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #f1f5f9;font-size:13px}
.workflow-builder-grid{display:grid;grid-template-columns:minmax(280px,380px) 1fr;gap:18px}
@media(max-width:1200px){.workflow-builder-grid{grid-template-columns:1fr}.workflow-log-row{grid-template-columns:1fr;gap:4px}}


body { box-sizing: border-box; }

/* =====================================================
   HOTFIX FINAL 14/05 - LAYOUT 100% + HAMBURGUER VISIVEL
   Mantem tudo validado e corrige apenas dimensoes globais
===================================================== */
:root{
  --opera-sidebar-open: 280px;
  --opera-sidebar-closed: 86px;
  --opera-topbar-height: 76px;
  --opera-page-padding: 28px;
}

html, body{
  width:100% !important;
  min-width:0 !important;
  height:100% !important;
  overflow:hidden !important;
}

#app.app-wrap{
  width:100vw !important;
  height:100vh !important;
  min-width:0 !important;
  display:block !important;
  overflow:hidden !important;
  background:#f4f7fb !important;
}

/* Sidebar fixa e previsivel */
#sidebar.sidebar{
  position:fixed !important;
  inset:0 auto 0 0 !important;
  width:var(--opera-sidebar-open) !important;
  min-width:var(--opera-sidebar-open) !important;
  max-width:var(--opera-sidebar-open) !important;
  height:100vh !important;
  z-index:80 !important;
  transform:none !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  transition:width .22s ease, min-width .22s ease, max-width .22s ease !important;
}

body.sidebar-collapsed #sidebar.sidebar{
  width:var(--opera-sidebar-closed) !important;
  min-width:var(--opera-sidebar-closed) !important;
  max-width:var(--opera-sidebar-closed) !important;
}

/* Area principal: ocupa exatamente o restante da tela */
#mainArea.main-area{
  position:relative !important;
  margin-left:var(--opera-sidebar-open) !important;
  width:calc(100vw - var(--opera-sidebar-open)) !important;
  max-width:calc(100vw - var(--opera-sidebar-open)) !important;
  height:100vh !important;
  min-width:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  transition:margin-left .22s ease, width .22s ease, max-width .22s ease !important;
  background:#f4f7fb !important;
  box-sizing:border-box !important;
}

body.sidebar-collapsed #mainArea.main-area{
  margin-left:var(--opera-sidebar-closed) !important;
  width:calc(100vw - var(--opera-sidebar-closed)) !important;
  max-width:calc(100vw - var(--opera-sidebar-closed)) !important;
}

/* Topbar dentro da area principal */
#mainArea > header{
  position:sticky !important;
  top:0 !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  height:var(--opera-topbar-height) !important;
  min-height:var(--opera-topbar-height) !important;
  z-index:70 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  background:rgba(255,255,255,.92) !important;
  backdrop-filter:blur(12px) !important;
  border-bottom:1px solid #e2e8f0 !important;
  box-sizing:border-box !important;
}

/* Botao hamburguer sempre presente na topbar */
#sidebarTopToggle{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  align-items:center !important;
  justify-content:center !important;
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  border-radius:12px !important;
  border:1px solid #dbe4ef !important;
  background:#ffffff !important;
  color:#334155 !important;
  cursor:pointer !important;
  position:relative !important;
  z-index:100 !important;
}

#sidebarTopToggle svg,
#sidebarTopToggle i{
  display:block !important;
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  color:#334155 !important;
  stroke:currentColor !important;
}

/* Container das paginas */
#pagesContainer{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  padding:var(--opera-page-padding) !important;
  box-sizing:border-box !important;
  overflow-x:hidden !important;
}

.page-content{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
  overflow-x:hidden !important;
}

.page-content.hidden{
  display:none !important;
}

/* Dashboard: corrige cards gigantes/metade da tela */
#page-dashboard > .grid:first-of-type{
  display:grid !important;
  grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)) !important;
  gap:18px !important;
  width:100% !important;
}

#page-dashboard .portal-grid-fixed{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:18px !important;
  width:100% !important;
}

/* Todos os blocos respeitam o container */
.chart-box,
.kpi-card,
.projeto-row,
.modal-box,
.inbox-layout,
.dept-stage-board,
table{
  max-width:100% !important;
  box-sizing:border-box !important;
}

.grid,
.flex,
.chart-box,
.kpi-card{
  min-width:0 !important;
}

/* Inbox proporcional */
#page-inbox .inbox-layout{
  display:grid !important;
  grid-template-columns:300px minmax(0, 1fr) 300px !important;
  gap:16px !important;
  width:100% !important;
  max-width:100% !important;
  height:calc(100vh - var(--opera-topbar-height) - 150px) !important;
  min-height:600px !important;
  overflow:hidden !important;
}

#page-inbox .inbox-layout > *{
  min-width:0 !important;
  max-width:100% !important;
  height:100% !important;
  overflow:hidden !important;
}

#page-inbox .grid.grid-cols-2{
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}

/* Sidebar recolhida: centraliza icones sem quebrar */
body.sidebar-collapsed #sidebar .nav-item{
  width:58px !important;
  height:54px !important;
  margin:4px auto !important;
  padding:0 !important;
  justify-content:center !important;
  gap:0 !important;
  font-size:0 !important;
}

body.sidebar-collapsed #sidebar .nav-item svg,
body.sidebar-collapsed #sidebar .nav-item i{
  width:24px !important;
  height:24px !important;
  min-width:24px !important;
  margin:0 auto !important;
}

body.sidebar-collapsed #sidebar #brandName,
body.sidebar-collapsed #sidebar #brandTag,
body.sidebar-collapsed #sidebar .text-\[10px\],
body.sidebar-collapsed #sidebar .mt-auto .text-white,
body.sidebar-collapsed #sidebar .mt-auto .text-white\/50{
  display:none !important;
}

body.sidebar-collapsed #sidebar .p-5 .flex{
  justify-content:center !important;
}

body.sidebar-collapsed #sidebar .mt-auto{
  width:58px !important;
  height:58px !important;
  padding:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

body.sidebar-collapsed #sidebar .mt-auto > .flex{
  justify-content:center !important;
  gap:0 !important;
}

/* Responsivo real */
@media(max-width:1200px){
  :root{ --opera-page-padding:20px; }
  #page-inbox .inbox-layout{
    grid-template-columns:1fr !important;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
  }
  #page-inbox .inbox-layout > *{
    height:auto !important;
    min-height:360px !important;
  }
  #page-inbox .grid.grid-cols-2{
    grid-template-columns:1fr !important;
  }
  #page-dashboard .portal-grid-fixed{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:760px){
  :root{
    --opera-sidebar-open: 260px;
    --opera-page-padding: 16px;
  }
  #sidebar.sidebar{
    width:var(--opera-sidebar-open) !important;
    min-width:var(--opera-sidebar-open) !important;
    max-width:var(--opera-sidebar-open) !important;
    transform:translateX(-100%) !important;
    box-shadow:0 20px 70px rgba(15,23,42,.24) !important;
  }
  body.sidebar-mobile-open #sidebar.sidebar{
    transform:translateX(0) !important;
  }
  #mainArea.main-area,
  body.sidebar-collapsed #mainArea.main-area{
    margin-left:0 !important;
    width:100vw !important;
    max-width:100vw !important;
  }
  #mainArea > header{
    padding-left:16px !important;
    padding-right:16px !important;
  }
  #mainArea > header input{
    width:160px !important;
  }
  #page-dashboard > .grid:first-of-type{
    grid-template-columns:1fr !important;
  }
}



/* =========================
   HOTFIX 14/05 - ABAS VISIVEIS
   Garante que o conteudo da aba ativa apareca
========================= */
#mainArea{
  display:block !important;
}
#pagesContainer{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  min-height:calc(100vh - var(--opera-topbar-height, 76px)) !important;
}
.page-content{
  position:relative !important;
  visibility:visible !important;
  opacity:1 !important;
}
.page-content.hidden{
  display:none !important;
}
.page-content:not(.hidden){
  display:block !important;
}
#pagesContainer > .page-content:not(.hidden){
  display:block !important;
}


/* =========================
   HOTFIX DASHBOARD 15/05
   Cards compactos em uma unica linha no desktop
========================= */
#page-dashboard .dashboard-kpi-grid{
  display:grid !important;
  grid-template-columns:repeat(5, minmax(145px, 1fr)) !important;
  gap:14px !important;
  width:100% !important;
  max-width:100% !important;
  margin:18px 0 22px 0 !important;
  align-items:stretch !important;
}

#page-dashboard > .grid:first-of-type{
  display:grid !important;
  grid-template-columns:repeat(5, minmax(145px, 1fr)) !important;
  gap:14px !important;
  width:100% !important;
  max-width:100% !important;
}

#page-dashboard .dashboard-kpi-grid .kpi-card,
#page-dashboard > .grid:first-of-type .kpi-card{
  height:148px !important;
  min-height:148px !important;
  max-height:148px !important;
  padding:16px 18px !important;
  border-radius:18px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  overflow:hidden !important;
}

#page-dashboard .dashboard-kpi-grid .kpi-card::after,
#page-dashboard > .grid:first-of-type .kpi-card::after{
  height:3px !important;
}

#page-dashboard .dashboard-kpi-grid .kpi-card > .flex,
#page-dashboard > .grid:first-of-type .kpi-card > .flex{
  margin-bottom:10px !important;
}

#page-dashboard .dashboard-kpi-grid .kpi-card .w-10,
#page-dashboard > .grid:first-of-type .kpi-card .w-10{
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  border-radius:14px !important;
}

#page-dashboard .dashboard-kpi-grid .kpi-card svg,
#page-dashboard > .grid:first-of-type .kpi-card svg{
  width:20px !important;
  height:20px !important;
}

#page-dashboard .dashboard-kpi-grid .kpi-card [id^="kpi"],
#page-dashboard > .grid:first-of-type .kpi-card [id^="kpi"]{
  font-size:28px !important;
  line-height:1 !important;
  margin:2px 0 6px 0 !important;
  font-weight:800 !important;
}

#page-dashboard .dashboard-kpi-grid .kpi-card .text-xs,
#page-dashboard > .grid:first-of-type .kpi-card .text-xs{
  font-size:12px !important;
  line-height:1.15 !important;
}

#page-dashboard .dashboard-kpi-grid .kpi-card .mt-1,
#page-dashboard > .grid:first-of-type .kpi-card .mt-1{
  margin-top:0 !important;
}

#page-dashboard .dashboard-kpi-grid .kpi-card .mt-2,
#page-dashboard > .grid:first-of-type .kpi-card .mt-2{
  margin-top:8px !important;
}

@media(max-width:1500px){
  #page-dashboard .dashboard-kpi-grid,
  #page-dashboard > .grid:first-of-type{
    grid-template-columns:repeat(5, minmax(120px, 1fr)) !important;
    gap:12px !important;
  }
  #page-dashboard .dashboard-kpi-grid .kpi-card,
  #page-dashboard > .grid:first-of-type .kpi-card{
    height:140px !important;
    min-height:140px !important;
    max-height:140px !important;
    padding:14px 16px !important;
  }
}

@media(max-width:1100px){
  #page-dashboard .dashboard-kpi-grid,
  #page-dashboard > .grid:first-of-type{
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  }
}

@media(max-width:760px){
  #page-dashboard .dashboard-kpi-grid,
  #page-dashboard > .grid:first-of-type{
    grid-template-columns:1fr !important;
  }
}




/* NOTIFICAÇÕES - AJUSTE ISOLADO */
.notification-wrapper{position:relative}
.notifications-panel{
  position:absolute;
  top:46px;
  right:0;
  width:360px;
  max-width:calc(100vw - 32px);
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:18px;
  box-shadow:0 22px 55px rgba(15,23,42,.18);
  z-index:120;
  overflow:hidden;
}
.notifications-panel.hidden{display:none!important}
.notifications-header{
  padding:16px;
  border-bottom:1px solid #f1f5f9;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  background:#ffffff;
}
.notifications-title{font-size:15px;font-weight:800;color:#1e293b}
.notifications-subtitle{font-size:11px;color:#94a3b8;margin-top:2px}
.notifications-clear-btn{
  font-size:11px;
  font-weight:700;
  color:#15636f;
  background:#ecfeff;
  border:1px solid #cffafe;
  border-radius:999px;
  padding:6px 10px;
  white-space:nowrap;
}
.notifications-list{max-height:360px;overflow-y:auto;background:#fff}
.notification-item{
  display:flex;
  gap:12px;
  padding:13px 16px;
  border-bottom:1px solid #f1f5f9;
  cursor:pointer;
  transition:.18s ease;
}
.notification-item:hover{background:#f8fafc}
.notification-item.unread{background:#f8fcff}
.notification-icon{
  width:34px;
  height:34px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.notification-icon.critical{background:#fee2e2;color:#dc2626}
.notification-icon.warning{background:#fef3c7;color:#d97706}
.notification-icon.info{background:#dbeafe;color:#1e88c7}
.notification-icon.success{background:#dcfce7;color:#16a34a}
.notification-content{min-width:0;flex:1}
.notification-title{font-size:13px;font-weight:700;color:#1e293b;line-height:1.25}
.notification-text{font-size:12px;color:#64748b;margin-top:3px;line-height:1.35}
.notification-meta{font-size:10px;color:#94a3b8;margin-top:6px}
.notification-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:#1e88c7;
  margin-top:7px;
  flex-shrink:0;
}
.notification-empty{
  padding:28px 18px;
  text-align:center;
  color:#94a3b8;
  font-size:13px;
}
.notifications-footer{
  padding:12px 16px;
  background:#f8fafc;
  border-top:1px solid #f1f5f9;
}
.notifications-footer button{
  width:100%;
  font-size:12px;
  font-weight:700;
  color:#334155;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:12px;
  padding:9px 12px;
}
@media(max-width:760px){
  .notifications-panel{right:-48px;width:calc(100vw - 24px)}
}



/* STATUS DE CONEXÃO - OPENAI */
.ai-connection-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
  padding:8px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  border:1px solid #e2e8f0;
  background:#f8fafc;
  color:#64748b;
}
.ai-connection-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:#94a3b8;
  box-shadow:0 0 0 4px rgba(148,163,184,.14);
}
.ai-connection-badge.connected{background:#ecfdf5;border-color:#bbf7d0;color:#15803d}
.ai-connection-badge.connected .ai-connection-dot{background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.18),0 0 12px rgba(34,197,94,.45)}
.ai-connection-badge.testing{background:#fffbeb;border-color:#fde68a;color:#b45309}
.ai-connection-badge.testing .ai-connection-dot{background:#f59e0b;box-shadow:0 0 0 4px rgba(245,158,11,.18);animation:aiPulse 1s infinite}
.ai-connection-badge.error{background:#fef2f2;border-color:#fecaca;color:#dc2626}
.ai-connection-badge.error .ai-connection-dot{background:#ef4444;box-shadow:0 0 0 4px rgba(239,68,68,.16),0 0 12px rgba(239,68,68,.35)}
.ai-connection-badge.empty{background:#f8fafc;border-color:#e2e8f0;color:#64748b}
@keyframes aiPulse{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.08)}}




/* BOT DE ATENDIMENTO - JORNADA ANTES DO HUMANO */
.bot-status-pill{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:800;border:1px solid #e2e8f0;background:#fff;color:#334155}
.bot-status-dot{width:10px;height:10px;border-radius:999px;background:#94a3b8;box-shadow:0 0 0 4px rgba(148,163,184,.15)}
.bot-status-pill.on .bot-status-dot{background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.18)}
.bot-status-pill.off .bot-status-dot{background:#ef4444;box-shadow:0 0 0 4px rgba(239,68,68,.16)}
.bot-card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:18px;transition:.2s}
.bot-card:hover{box-shadow:0 10px 28px rgba(15,23,42,.07);transform:translateY(-1px)}
.bot-journey-card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:16px;cursor:pointer;transition:.2s}
.bot-journey-card.active{border-color:#15636f;background:#ecfeff}
.bot-step-row{display:grid;grid-template-columns:42px 1fr 170px 170px 110px;gap:12px;align-items:start;padding:14px;border:1px solid #e2e8f0;border-radius:16px;background:#fff;margin-bottom:10px}
.bot-step-index{width:34px;height:34px;border-radius:12px;background:#15636f;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px}
.bot-flow-line{height:16px;width:2px;background:#cbd5e1;margin:0 0 0 31px}
@media(max-width:1200px){.bot-step-row{grid-template-columns:1fr}.bot-step-index{display:none}}
.bot-ai-panel-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:14px}
.bot-ai-kpi-label{font-size:11px;color:#94a3b8;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.bot-ai-kpi-value{font-size:14px;color:#1e293b;font-weight:800;margin-top:4px}
.bot-decision-card{border:1px solid #e2e8f0;border-radius:14px;padding:14px;background:#fff}
.bot-decision-json{background:#0f172a;color:#e2e8f0;border-radius:12px;padding:12px;font-size:11px;overflow:auto;white-space:pre-wrap}
.bot-action-chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 10px;font-size:11px;font-weight:800}




/* =====================================================
   CRM COMERCIAL - KANBAN VISUAL
   Ajuste somente visual/estrutura de tela. Não altera APIs.
===================================================== */
#page-crm{
  height:calc(100vh - var(--opera-topbar-height, 76px) - 56px) !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}
#page-crm.hidden{display:none !important;}
#page-crm > .flex.items-center.justify-between{
  flex:0 0 auto !important;
  margin-bottom:14px !important;
}
#page-crm .crm-commercial-board,
#kanbanBoard.crm-commercial-board{
  flex:1 1 auto !important;
  min-height:0 !important;
  width:100% !important;
  max-width:100% !important;
  display:grid !important;
  grid-auto-flow:column !important;
  grid-auto-columns:minmax(260px, 1fr) !important;
  gap:14px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  padding:2px 2px 10px 2px !important;
  align-items:stretch !important;
}
#page-crm .kanban-col{
  min-width:260px !important;
  max-width:none !important;
  width:100% !important;
  height:100% !important;
  max-height:none !important;
  display:flex !important;
  flex-direction:column !important;
  background:#f8fafc !important;
  border:1px solid #e2e8f0 !important;
  border-radius:18px !important;
  padding:12px !important;
  overflow:hidden !important;
}
#page-crm .crm-stage-header{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  padding:4px 4px 12px 4px !important;
  border-bottom:1px solid #e2e8f0 !important;
  margin-bottom:10px !important;
  flex-shrink:0 !important;
}
#page-crm .crm-stage-title{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  font-size:13px !important;
  font-weight:800 !important;
  color:#1e293b !important;
  white-space:nowrap !important;
}
#page-crm .crm-stage-meta{
  min-width:28px !important;
  height:24px !important;
  padding:0 8px !important;
  border-radius:999px !important;
  background:#e8f3f5 !important;
  color:#15636f !important;
  font-size:12px !important;
  font-weight:900 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#page-crm .crm-stage-body{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  padding-right:2px !important;
}
#page-crm .kanban-card{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  border-radius:16px !important;
  padding:13px !important;
  margin-bottom:10px !important;
  box-shadow:0 2px 8px rgba(15,23,42,.04) !important;
}
#page-crm .kanban-card:hover{
  transform:translateY(-1px) !important;
  box-shadow:0 10px 24px rgba(15,23,42,.08) !important;
  border-color:#cbd5e1 !important;
}
#page-crm .crm-card-top{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:10px !important;
  margin-bottom:10px !important;
}
#page-crm .crm-card-title{
  font-size:14px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  color:#1e293b !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
#page-crm .crm-card-subtitle{
  font-size:11px !important;
  color:#94a3b8 !important;
  margin-top:3px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
#page-crm .crm-card-edit-btn{
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  border-radius:10px !important;
  border:1px solid #e2e8f0 !important;
  background:#fff !important;
  color:#64748b !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#page-crm .crm-card-edit-btn:hover{background:#f1f5f9 !important;color:#15636f !important;}
#page-crm .crm-stage-actions{
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
}
#page-crm .crm-stage-add-btn{
  height:26px !important;
  min-width:26px !important;
  padding:0 8px !important;
  border-radius:9px !important;
  border:1px solid #dbe4ef !important;
  background:#ffffff !important;
  color:#15636f !important;
  font-size:11px !important;
  font-weight:900 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
}
#page-crm .crm-stage-add-btn:hover{background:#ecfeff !important;border-color:#99f6e4 !important;}
#page-crm .crm-card-actions{
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  flex-shrink:0 !important;
}
#page-crm .crm-card-delete-btn{
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  border-radius:10px !important;
  border:1px solid #fee2e2 !important;
  background:#fff !important;
  color:#ef4444 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#page-crm .crm-card-delete-btn:hover{background:#fef2f2 !important;color:#dc2626 !important;}
#page-crm .crm-card-action-btn{height:30px !important;min-width:30px !important;padding:0 8px !important;border-radius:10px !important;border:1px solid #e2e8f0 !important;background:#fff !important;color:#64748b !important;display:flex !important;align-items:center !important;justify-content:center !important;gap:5px !important;font-size:11px !important;font-weight:800 !important;}
#page-crm .crm-card-action-btn:hover{background:#ecfeff !important;color:#15636f !important;border-color:#99f6e4 !important;}
#page-crm .crm-card-action-btn.warn:hover{background:#fff7ed !important;color:#c2410c !important;border-color:#fed7aa !important;}
.crm-rule-row{display:grid;grid-template-columns:1.1fr 1.1fr 1fr 1fr 90px;gap:10px;align-items:end;padding:12px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;}
.crm-rule-row select,.crm-rule-row input{width:100%;border:1px solid #e2e8f0;border-radius:10px;padding:9px 10px;font-size:13px;outline:none;background:#fff;}
.crm-rule-row label{display:block;font-size:11px;font-weight:800;color:#64748b;margin-bottom:4px;text-transform:uppercase;letter-spacing:.02em;}
@media(max-width:900px){.crm-rule-row{grid-template-columns:1fr;}}

#page-crm .crm-card-field{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  font-size:11px !important;
  color:#64748b !important;
  min-width:0 !important;
}
#page-crm .crm-card-field span{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
#page-crm .crm-prob-bar{
  height:6px !important;
  border-radius:999px !important;
  background:#e2e8f0 !important;
  overflow:hidden !important;
  margin:12px 0 10px 0 !important;
}
#page-crm .crm-prob-fill{
  height:100% !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#15636f,#1e88c7) !important;
}
#page-crm .crm-card-footer{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:8px !important;
}
#page-crm .crm-empty-stage{
  border:1px dashed #cbd5e1 !important;
  background:#ffffff !important;
  color:#94a3b8 !important;
  border-radius:14px !important;
  padding:18px 12px !important;
  text-align:center !important;
  font-size:12px !important;
  line-height:1.35 !important;
}

#crmFieldConfigRows .crm-field-config-row{
  display:grid;
  grid-template-columns: 34px 1.2fr 180px 130px 130px 110px 82px;
  gap:10px;
  align-items:center;
  padding:10px;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#fff;
}
#crmFieldConfigRows .crm-field-config-row input[type="text"],
#crmFieldConfigRows .crm-field-config-row select{
  width:100%;
  border:1px solid #e2e8f0;
  border-radius:10px;
  padding:8px 10px;
  font-size:13px;
  outline:none;
}
#crmFieldConfigRows .crm-field-config-row input[type="text"]:focus,
#crmFieldConfigRows .crm-field-config-row select:focus{border-color:#1e88c7;}
.crm-field-row-actions{display:flex;align-items:center;justify-content:center;gap:6px;}
.crm-field-action-btn{width:34px;height:34px;border-radius:10px;border:1px solid #e2e8f0;background:#fff;color:#64748b;display:flex;align-items:center;justify-content:center;transition:.18s ease;}
.crm-field-action-btn:hover{background:#f8fafc;color:#1e293b;}
.crm-field-action-btn.danger{border-color:#fecaca;color:#ef4444;}
.crm-field-action-btn.danger:hover{background:#fef2f2;color:#dc2626;}
.crm-field-add-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid #cfe8ed;background:#ecfeff;color:#15636f;border-radius:12px;padding:10px 14px;font-size:13px;font-weight:800;transition:.18s ease;}
.crm-field-add-btn:hover{background:#cffafe;}
.crm-custom-fields-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.crm-custom-field-row label{display:block;font-size:13px;font-weight:700;color:#475569;margin-bottom:4px;}
.crm-custom-field-row input,.crm-custom-field-row textarea{width:100%;border:1px solid #e2e8f0;border-radius:10px;padding:10px 12px;font-size:13px;outline:none;}
.crm-custom-field-row input:focus,.crm-custom-field-row textarea:focus{border-color:#1e88c7;box-shadow:0 0 0 3px rgba(30,136,199,.10);}
@media(max-width:900px){.crm-custom-fields-grid{grid-template-columns:1fr;}}
.crm-card-field-label{font-weight:800;color:#475569;margin-right:3px;}
.crm-card-id-pill{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:999px;background:#f1f5f9;color:#64748b;font-size:10px;font-weight:900;margin-top:6px;border:1px solid #e2e8f0;}
.crm-stage-config-select{width:100%;border:1px solid #e2e8f0;border-radius:12px;padding:10px 12px;font-size:14px;outline:none;background:#fff;color:#1e293b;font-weight:700;}
.crm-stage-config-select:focus{border-color:#1e88c7;box-shadow:0 0 0 3px rgba(30,136,199,.12);}
@media(max-width:760px){#crmFieldConfigRows .crm-field-config-row{grid-template-columns:1fr}.crm-field-config-row .text-center{text-align:left!important}}

@media(max-width:1200px){
  #page-crm{height:auto !important;overflow:visible !important;}
  #page-crm .crm-commercial-board,#kanbanBoard.crm-commercial-board{
    display:flex !important;
    overflow-x:auto !important;
    min-height:620px !important;
  }
  #page-crm .kanban-col{min-width:280px !important;}
}



/* WHATSAPP INSTANCIAS - STATUS ONLINE/OFFLINE */
.wa-instance-status-dot{
  width:10px;
  height:10px;
  min-width:10px;
  border-radius:999px;
  display:inline-block;
  box-shadow:0 0 0 3px rgba(148,163,184,.14);
}
.wa-instance-status-dot.online{
  background:#22c55e;
  box-shadow:0 0 0 3px rgba(34,197,94,.14),0 0 10px rgba(34,197,94,.65);
}
.wa-instance-status-dot.offline{
  background:#ef4444;
  box-shadow:0 0 0 3px rgba(239,68,68,.12),0 0 10px rgba(239,68,68,.45);
}
.wa-instance-status-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:3px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
}
.wa-instance-status-pill.online{
  background:#dcfce7;
  color:#15803d;
}
.wa-instance-status-pill.offline{
  background:#fee2e2;
  color:#b91c1c;
}



.atendimento-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:800;border:1px solid #cbd5e1;background:#f8fafc;color:#334155;white-space:nowrap}
.atendimento-pill.aberto{background:#ecfeff;border-color:#a5f3fc;color:#15636f}
.atendimento-pill.em-atendimento{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}
.atendimento-pill.aguardando-cliente{background:#fffbeb;border-color:#fde68a;color:#b45309}
.atendimento-pill.transferido{background:#f5f3ff;border-color:#ddd6fe;color:#6d28d9}
.atendimento-pill.fechado{background:#f1f5f9;border-color:#cbd5e1;color:#64748b}
.atendimento-mini{font-size:10px;color:#64748b;margin-top:3px;display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.opera-v19-action-danger{border-color:#fecaca!important;background:#fff!important;color:#dc2626!important}
.opera-v19-action-danger:hover{background:#fef2f2!important}
.opera-v19-sidebar-line{display:flex;align-items:center;justify-content:space-between;gap:8px}
.opera-v19-sidebar-muted{font-size:11px;color:#94a3b8;margin-top:4px;line-height:1.3}



:root{
  --opera-inbox-left-width: 300px;
  --opera-inbox-right-width: 300px;
  --opera-inbox-collapsed-width: 58px;
}
#page-inbox .inbox-layout{
  grid-template-columns: var(--opera-inbox-left-width) minmax(0, 1fr) var(--opera-inbox-right-width) !important;
  gap: 14px !important;
}
#page-inbox .opera-panel-toggle{
  width:30px;height:30px;border:1px solid #dbe4ef;border-radius:10px;background:#fff;color:#64748b;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s;flex:0 0 auto
}
#page-inbox .opera-panel-toggle:hover{background:#f8fafc;color:#15636f;border-color:#cbd5e1}
#page-inbox .opera-panel-header-compact{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid #e2e8f0;background:#fff}
#page-inbox .opera-collapsed-label{display:none;writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;font-weight:800;color:#64748b;letter-spacing:.4px;margin:auto;padding:12px 0;text-transform:uppercase}
body.opera-inbox-left-collapsed #page-inbox .inbox-layout{grid-template-columns:var(--opera-inbox-collapsed-width) minmax(0,1fr) var(--opera-inbox-right-width)!important}
body.opera-inbox-right-collapsed #page-inbox .inbox-layout{grid-template-columns:var(--opera-inbox-left-width) minmax(0,1fr) var(--opera-inbox-collapsed-width)!important}
body.opera-inbox-left-collapsed.opera-inbox-right-collapsed #page-inbox .inbox-layout{grid-template-columns:var(--opera-inbox-collapsed-width) minmax(0,1fr) var(--opera-inbox-collapsed-width)!important}
body.opera-inbox-left-collapsed #operaInboxLeftPanel > :not(.opera-panel-header-compact),
body.opera-inbox-right-collapsed #operaInboxRightPanel > :not(.opera-panel-header-compact){display:none!important}
body.opera-inbox-left-collapsed #operaInboxLeftPanel .opera-collapsed-label,
body.opera-inbox-right-collapsed #operaInboxRightPanel .opera-collapsed-label{display:block!important}
body.opera-inbox-left-collapsed #operaInboxLeftPanel,
body.opera-inbox-right-collapsed #operaInboxRightPanel{padding:0!important;overflow:hidden!important}
#operaInboxInternalPanel.opera-internal-collapsed{max-width:58px!important;min-width:58px!important;flex:0 0 58px!important}
body.opera-inbox-internal-collapsed #page-inbox .grid.grid-cols-2{grid-template-columns:minmax(0,1fr) var(--opera-inbox-collapsed-width)!important}
body.opera-inbox-internal-collapsed #operaInboxInternalPanel > :not(.opera-panel-header-compact){display:none!important}
body.opera-inbox-internal-collapsed #operaInboxInternalPanel .opera-collapsed-label{display:block!important}
body.opera-inbox-internal-collapsed #operaInboxInternalPanel{padding:0!important;background:#fff!important}
body.opera-inbox-internal-collapsed #operaInboxInternalPanel .opera-panel-header-compact{height:100%;flex-direction:column;justify-content:flex-start;border-bottom:0}
#page-inbox .quick-action{min-height:34px;justify-content:center;font-size:11px;padding:7px 10px;white-space:nowrap}
#page-inbox #quickActions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
@media(max-width:1500px){
  :root{--opera-inbox-left-width:270px;--opera-inbox-right-width:280px}
  #page-inbox #quickActions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:1180px){
  #page-inbox .inbox-layout{grid-template-columns:1fr!important;height:auto!important;overflow:visible!important}
  body.opera-inbox-left-collapsed #page-inbox .inbox-layout,
  body.opera-inbox-right-collapsed #page-inbox .inbox-layout,
  body.opera-inbox-left-collapsed.opera-inbox-right-collapsed #page-inbox .inbox-layout{grid-template-columns:1fr!important}
}
#page-inbox .atendimento-mini,#page-inbox #sidebarAtendimentoBox,#page-inbox #sidebarAtendimentoStatus{transition:none!important;animation:none!important}
#page-inbox .conv-item{min-height:82px}
#page-inbox .conv-item .atendimento-mini{min-height:20px}
#page-inbox #clientMessages,#page-inbox #internalMessages{scroll-behavior:auto!important}



/*
  Ajuste exclusivamente visual.
  Nao altera rotas, fetchs, Evolution, endpoints, webhooks ou scripts funcionais.
  Objetivo: reduzir o titulo da aba Inbox e dar mais area util ao painel de chat.
*/
#page-inbox{
  height:calc(100vh - var(--opera-topbar-height, 76px)) !important;
  overflow:hidden !important;
}

#page-inbox .opera-inbox-page-header{
  margin-bottom:10px !important;
  min-height:38px !important;
}

#page-inbox .opera-inbox-page-header h1{
  font-size:20px !important;
  line-height:1.05 !important;
  letter-spacing:-.02em !important;
}

#page-inbox .opera-inbox-page-header p{
  display:none !important;
}

#page-inbox #inboxSearch{
  height:38px !important;
}

#page-inbox .inbox-layout{
  height:calc(100vh - var(--opera-topbar-height, 76px) - 92px) !important;
  min-height:0 !important;
  gap:14px !important;
}

#page-inbox .chart-box{
  border-radius:14px !important;
}

#page-inbox .chart-box.p-0{
  padding:0 !important;
}

#page-inbox .px-5.py-4.border-b.border-slate100{
  padding:12px 16px !important;
}

#page-inbox #chatAvatar{
  width:38px !important;
  height:38px !important;
}

#page-inbox #chatTitle{
  font-size:16px !important;
  line-height:1.15 !important;
}

#page-inbox #chatSubtitle{
  font-size:12px !important;
  line-height:1.15 !important;
  margin-top:2px !important;
}

#page-inbox .grid.grid-cols-2.gap-3.flex-1.p-4.min-h-0{
  padding:12px !important;
  gap:12px !important;
}

#page-inbox .px-4.py-3.border-b.border-slate200.bg-white{
  padding:10px 12px !important;
}

#page-inbox .p-3.border-t.border-slate200.bg-white{
  padding:10px !important;
}

#page-inbox #clientMessages,
#page-inbox #internalMessages{
  padding:12px !important;
}

#page-inbox .conv-item{
  padding:10px 12px !important;
  min-height:72px !important;
}

#page-inbox .conv-avatar{
  width:34px !important;
  height:34px !important;
}

#page-inbox .sidebar-section{
  padding:10px 12px !important;
}

#page-inbox .sidebar-item{
  padding:7px 9px !important;
  margin-bottom:6px !important;
}

#page-inbox .border-t.border-slate100.p-3.bg-white{
  padding:10px !important;
}

@media(max-width:1180px){
  #page-inbox{
    height:auto !important;
    overflow:auto !important;
  }
  #page-inbox .inbox-layout{
    height:auto !important;
  }
}



/* Mais area para conversa: remove botoes grandes de acao da base */
#page-inbox #quickActions{display:none!important}
#page-inbox #quickActions.closest-hidden{display:none!important}
#page-inbox .chart-box:has(#quickActions) > .border-t{display:none!important}
#page-inbox #operaInboxCenterPanel > .border-t{display:none!important}
#page-inbox .inbox-layout{grid-template-columns:280px minmax(0,1fr) 300px!important;gap:12px!important}
#page-inbox .grid.grid-cols-2.gap-3.flex-1{height:calc(100vh - 315px);min-height:520px!important}
#page-inbox #clientMessages,#page-inbox #internalMessages{min-height:0!important}
body.opera-inbox-internal-collapsed #page-inbox .grid.grid-cols-2.gap-3.flex-1{grid-template-columns:minmax(0,1fr) 58px!important}
body.opera-inbox-right-collapsed #page-inbox .inbox-layout{grid-template-columns:280px minmax(0,1fr) 58px!important}
body.opera-inbox-left-collapsed #page-inbox .inbox-layout{grid-template-columns:58px minmax(0,1fr) 300px!important}
body.opera-inbox-left-collapsed.opera-inbox-right-collapsed #page-inbox .inbox-layout{grid-template-columns:58px minmax(0,1fr) 58px!important}
#operaInboxActionWrap{position:relative;display:inline-flex;align-items:center}
#operaInboxActionBtn{width:34px;height:34px;border-radius:10px;border:1px solid transparent;display:flex;align-items:center;justify-content:center;color:#64748b;background:#fff;cursor:pointer}
#operaInboxActionBtn:hover{background:#f8fafc;border-color:#dbe4ef;color:#0f6773}
#operaInboxActionMenu{position:absolute;right:0;top:42px;width:250px;background:#fff;border:1px solid #dbe4ef;border-radius:14px;box-shadow:0 20px 45px rgba(15,23,42,.16);padding:8px;z-index:9999;display:none}
#operaInboxActionMenu.open{display:block}
#operaInboxActionMenu button{width:100%;display:flex;align-items:center;gap:10px;text-align:left;padding:10px 11px;border:0;background:transparent;border-radius:10px;font-weight:700;font-size:13px;color:#1e293b;cursor:pointer}
#operaInboxActionMenu button:hover{background:#f1f5f9}
#operaInboxActionMenu button.danger{color:#ef4444}
#operaInboxActionMenu .divider{height:1px;background:#e2e8f0;margin:6px 2px}
#operaInboxCurrentAtd{font-size:12px;color:#64748b;margin-top:2px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
#operaInboxCurrentAtd .atd-id{font-weight:800;color:#0f6773}
.atendimento-pill{display:inline-flex;align-items:center;border:1px solid #67e8f9;background:#ecfeff;color:#0e7490;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:800;line-height:1.3}
.atendimento-pill.fechado{border-color:#fecaca;background:#fef2f2;color:#dc2626}
.atendimento-pill.em-atendimento{border-color:#bfdbfe;background:#eff6ff;color:#2563eb}
.atendimento-pill.aguardando-cliente{border-color:#fde68a;background:#fffbeb;color:#b45309}
#page-inbox .conv-item{transition:none!important;animation:none!important}
#page-inbox .msg-group{transition:none!important;animation:none!important}
@media(max-width:1350px){#page-inbox .inbox-layout{grid-template-columns:250px minmax(0,1fr) 270px!important}#page-inbox .grid.grid-cols-2.gap-3.flex-1{height:calc(100vh - 300px);min-height:470px!important}}



  .opera-v23-table{width:100%;border-collapse:separate;border-spacing:0}
  .opera-v23-table th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#94a3b8;text-align:left;padding:12px 14px;border-bottom:1px solid #e2e8f0;font-weight:800;background:#f8fafc}
  .opera-v23-table td{font-size:13px;color:#334155;padding:13px 14px;border-bottom:1px solid #f1f5f9;vertical-align:top}
  .opera-v23-table tr:hover td{background:#f8fafc}
  .opera-v23-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;font-size:11px;font-weight:800;border:1px solid #e2e8f0;background:#f8fafc;color:#475569;white-space:nowrap}
  .opera-v23-pill.aberto,.opera-v23-pill.ativo{background:#ecfdf5;border-color:#bbf7d0;color:#15803d}
  .opera-v23-pill.fechado{background:#f1f5f9;border-color:#cbd5e1;color:#475569}
  .opera-v23-pill.cancelado{background:#fef2f2;border-color:#fecaca;color:#dc2626}
  .opera-v23-actions{display:flex;gap:8px;flex-wrap:wrap}
  .opera-v23-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid #e2e8f0;background:#fff;color:#334155;border-radius:10px;padding:8px 10px;font-size:12px;font-weight:800;cursor:pointer;transition:.18s}
  .opera-v23-btn:hover{background:#f8fafc;border-color:#cbd5e1}
  .opera-v23-btn.primary{background:#15636f;color:#fff;border-color:#15636f}
  .opera-v23-btn.primary:hover{background:#0e4a54}
  .opera-v23-card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:18px;box-shadow:0 1px 0 rgba(15,23,42,.02)}
  .opera-v23-kpi{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:18px;position:relative;overflow:hidden}
  .opera-v23-kpi:before{content:'';position:absolute;left:0;top:0;right:0;height:3px;background:linear-gradient(90deg,#15636f,#1e88c7)}
  .opera-v23-muted{color:#94a3b8;font-size:12px}
  .opera-v23-drawer{position:fixed;right:20px;top:90px;width:460px;max-width:calc(100vw - 40px);max-height:calc(100vh - 120px);background:#fff;border:1px solid #e2e8f0;border-radius:20px;box-shadow:0 24px 70px rgba(15,23,42,.22);z-index:300;display:none;overflow:hidden}
  .opera-v23-drawer.open{display:flex;flex-direction:column}
  .opera-v23-drawer-head{padding:18px;border-bottom:1px solid #f1f5f9;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
  .opera-v23-drawer-body{padding:18px;overflow:auto}
  .opera-v23-hidden-row{display:none!important}
  #page-contatos-omni,#page-historico-atendimentos{min-height:calc(100vh - 140px)}
  .opera-v23-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .opera-v23-form-grid.full{grid-template-columns:1fr}
  .opera-v23-label{display:block;font-size:12px;font-weight:800;color:#475569;margin-bottom:6px}
  .opera-v23-input,.opera-v23-select{width:100%;border:1px solid #e2e8f0;border-radius:12px;padding:10px 12px;font-size:13px;outline:none;background:#fff}
  .opera-v23-input:focus,.opera-v23-select:focus{border-color:#1e88c7;box-shadow:0 0 0 3px rgba(30,136,199,.12)}
  @media(max-width:760px){.opera-v23-form-grid{grid-template-columns:1fr}}



  #page-inbox #clientMessages{transition:none!important;}
  #page-inbox .opera-v25-transient-hidden{display:none!important;}