@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

/* ── Tokens ─────────────────────────────────────── */
:root {
  --teal:       #36e0c4;
  --teal-dark:  #28c4aa;
  --teal-light: rgba(54,224,196,.12);
  --teal-mid:   rgba(54,224,196,.22);
  --navy:       #112443;
  --navy-mid:   #1a3358;
  --tech-blue:  #12d6ff;
  --blue-light: rgba(18,214,255,.12);

  --bg:         #f4f7fb;
  --bg-page:    #e8ebee; /* -5% de luminosidade sobre --bg, so para o fundo por tras de tudo (body/overlay/agd-nav-bar) */
  --bg-card:    #ffffff;
  --bg-sidebar: #ffffff;
  --bg-topbar:  #ffffff;

  --text:       #112443;
  --text-2:     #4a6080;
  --text-muted: #8097b1;
  --text-label: #b0c0d4;

  --border:     rgba(17,36,67,.08);
  --border-2:   rgba(17,36,67,.15);

  --green:      #10b981;
  --green-light:rgba(16,185,129,.12);
  --amber:      #f59e0b;
  --amber-light:rgba(245,158,11,.12);
  --red:        #ef4444;
  --red-light:  rgba(239,68,68,.12);
  --blue:       #3b82f6;
  --blue-light2:rgba(59,130,246,.12);

  /* ── Linguagem de cor financeira (PADRÃO do sistema) ──
     verde claro  = receita recebida / confirmada / entrada
     verde escuro = receita a receber (em aberto, ainda não vencida)
     azul         = saída operacional neutra (despesa, custo, pago, saída de caixa)
     vermelho     = patológico (saldo negativo, vencido, prejuízo/resultado negativo) */
  --receita-recebida: #10b981;
  --receita-areceber: #047857;
  --saida:            #3b82f6;
  --patologico:       #ef4444;

  --shadow-xs:  0 0.0625rem 0.125rem rgba(17,36,67,.06);
  --shadow-sm:  0 0.0625rem 0.25rem rgba(17,36,67,.07), 0 0.125rem 0.5rem rgba(17,36,67,.04);
  --shadow:     0 0.25rem 1rem rgba(17,36,67,.08), 0 0.125rem 0.375rem rgba(17,36,67,.04);
  --shadow-lg:  0 0.625rem 2.5rem rgba(17,36,67,.10), 0 0.25rem 0.75rem rgba(17,36,67,.05);

  --sidebar-w: 13.125rem;
  --topbar-h:  3.375rem;
  --r-sm:      0.5rem;
  --r-md:      0.625rem;
  --r:         0.75rem;
  --r-lg:      1rem;
  --r-pill:    62.4375rem;
}

/* ── Reset ───────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
/* Regua mestra de escala. Toda medida do sistema esta em rem, entao mudar
   este numero unico escala tudo (fontes, cards, espacamentos, icones) de
   forma proporcional e consistente. Historico: 80% (22/07) -> 90% (23/07
   manha) -> 100% (23/07, ponto de partida) -> 115% (23/07, ainda pequeno
   demais no ponto de partida, +15%). */
html{font-size:115%}
html,body{height:100%;max-width:100vw;overflow-x:hidden}
body{font-family:'Poppins',sans-serif;font-size:0.7875rem;color:var(--text);background:var(--bg-page);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{cursor:pointer;font-family:inherit}
input,select,textarea{font-family:inherit}

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

/* ── Sidebar ─────────────────────────────────────── */
.sidebar{width:var(--sidebar-w);flex:0 0 var(--sidebar-w);background:var(--bg-sidebar);border-right:0.0625rem solid var(--border);display:flex;flex-direction:column;overflow-y:auto;z-index:10}
.sidebar-logo{display:flex;align-items:center;justify-content:center;height:var(--topbar-h);flex:0 0 var(--topbar-h);padding:0 0.875rem;border-bottom:0.0625rem solid var(--border)}
.logo-text{font-size:0.9rem;font-weight:700;color:var(--navy);letter-spacing:.04em}
/* zoom local +10% sobre a escala geral do sistema, so nos itens do menu (a pedido de
   Reinaldo) — nao aplicado na logo/rodape para nao desalinhar a linha da logo com a
   linha do topbar (ja corrigido antes, ambos usam --topbar-h). */
.sidebar-nav{flex:1;padding:0.4375rem 0.375rem;display:flex;flex-direction:column;gap:0.0625rem;zoom:1.1}
/* Os 3 titulos de secao (PRINCIPAL/PSI ALEM/SISTEMA) seguem exatamente o mesmo padrao:
   mesma fonte, cor, tamanho, peso, sem icone. Margem superior = o dobro do espacamento
   normal entre itens, para separar visualmente cada secao do menu. */
.nav-section-label{font-size:0.695rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);padding:1.125rem 0.5rem 0.25rem;display:block}
.nav-item{display:flex;align-items:center;gap:0.5625rem;padding:0.375rem 0.625rem;border-radius:var(--r-sm);color:var(--text-2);font-size:0.675rem;font-weight:500;border:none;background:transparent;width:100%;text-align:left;cursor:pointer;transition:background .12s,color .12s,transform .12s}
.nav-item:hover{background:var(--bg);color:var(--text)}
.nav-item.active{background:var(--teal-light);color:var(--navy);font-weight:600}
/* Efeito unico para TODOS os icones do menu: cinza por padrao, cor propria do modulo (--icon-color,
   definida inline por item) no hover com leve zoom, cor propria mantida quando ativo mas SEM zoom. */
.nav-item:hover:not(.active){transform:scale(1.03)}
.nav-item:hover:not(.active) .nav-icon{color:var(--icon-color, var(--teal-dark))}
.nav-item.active .nav-icon{color:var(--icon-color, var(--teal-dark))}
.nav-icon{width:1.125rem;height:1.125rem;flex:0 0 1.125rem;display:flex;align-items:center;justify-content:center;color:var(--text-label)}
/* O icone (svg ou img) sempre preenche exatamente o container .nav-icon, nunca o proprio
   width/height do elemento — assim o tamanho real acompanha a regua mestra de escala
   automaticamente (rem), sem precisar recalcular atributos px a cada mudanca de escala.
   Isso foi o que causou o corte dos icones quando a escala mudou (atributo px desatualizado). */
.nav-icon svg, .nav-icon img{width:100%;height:100%;display:block}
.nav-icon img{object-fit:contain}
/* Icone Ei7 (imagem real) — container do menu lateral mais largo que os demais porque o
   logotipo (436x263) e mais largo que alto. -3% e depois mais -5% a pedido de Reinaldo
   (o da topbar ficou perfeito e nunca foi mexido). */
.nav-item[data-nav="marketing"] .nav-icon{width:1.555rem;height:0.933rem;flex:0 0 1.555rem}
/* Mesmo efeito cinza/hover/ativo dos demais icones, mas via filter (imagem, nao currentColor) —
   filter e mais confiavel entre navegadores do que a tecnica de mascara CSS que tentei antes
   e sumiu no navegador de Reinaldo (mesmo funcionando no meu teste). */
.nav-item[data-nav="marketing"] .nav-icon img{filter:grayscale(100%) opacity(.55);transition:filter .12s}
.nav-item.active[data-nav="marketing"] .nav-icon img,
.nav-item:hover:not(.active)[data-nav="marketing"] .nav-icon img{filter:none}
.nav-badge{margin-left:auto;background:var(--red);color:#fff;font-size:0.5625rem;font-weight:700;padding:0.0625rem 0.375rem;border-radius:var(--r-pill);min-width:1.125rem;text-align:center}
.sidebar-footer{padding:0.4375rem 0.375rem 0.6875rem;border-top:0.0625rem solid var(--border)}
.sidebar-user{display:flex;align-items:center;gap:0.5625rem;padding:0.375rem 0.5rem;border-radius:var(--r-sm);cursor:pointer;transition:background .12s}
.sidebar-user:hover{background:var(--bg)}
.avatar{width:2rem;height:2rem;border-radius:var(--r-pill);background:#36e0c4;color:#ffffff;display:flex;align-items:center;justify-content:center;font-size:0.675rem;font-weight:700;flex:0 0 2rem}
.sidebar-user-info{min-width:0}
.sidebar-user-name{font-size:0.7313rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-user-crp{font-size:0.6188rem;color:var(--text-muted)}

/* ── Main ────────────────────────────────────────── */
.main{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}

/* ── Topbar ──────────────────────────────────────── */
.topbar{height:var(--topbar-h);background:var(--bg-topbar);border-bottom:0.0625rem solid var(--border);display:flex;align-items:center;padding:0 1.25rem;gap:0.875rem;flex:0 0 var(--topbar-h);box-shadow:var(--shadow-xs)}
.topbar-module{display:flex;align-items:center;gap:0.625rem;flex:1;padding-left:0.875rem;border-left:0.1875rem solid var(--teal);height:2.125rem;transition:border-left-color .25s}
.topbar-module-icon{display:flex;align-items:center;justify-content:center;color:var(--teal);transition:color .25s;flex:0 0 1.3125rem;width:1.3125rem;height:1.3125rem}
/* Mesmo principio do .nav-icon: o icone preenche o container, nao o proprio atributo px */
.topbar-module-icon svg, .topbar-module-icon img{width:100%;height:100%;display:block}
.topbar-module-icon img{object-fit:contain}
/* Ei7 na topbar: container mais largo (logotipo largo) e pelo menos o dobro do tamanho dos demais */
#topbar-module-icon.icon-lg-ei7{flex:0 0 2.625rem;width:2.625rem;height:1.575rem}
.topbar-title{font-size:0.8438rem;font-weight:600;color:var(--text)}
/* ── Inline table inputs ─────────────────────────── */
.inline-date{border:0.0938rem solid var(--border-2);background:var(--bg-card);font-size:0.675rem;font-family:inherit;color:var(--text-2);cursor:pointer;padding:0.1875rem 0.5rem;border-radius:var(--r-sm);transition:border-color .12s;min-width:8.125rem}
.inline-date:hover{border-color:var(--teal)}
.inline-date:focus{outline:0.125rem solid var(--teal);outline-offset:0.0625rem;border-color:var(--teal)}
.inline-date:disabled{opacity:.4;cursor:not-allowed;background:var(--bg)}
.th-sort{cursor:pointer;user-select:none;white-space:nowrap}
.th-sort:hover{color:var(--text)}

/* ── Content ─────────────────────────────────────── */
.content{flex:1;overflow-y:auto;padding:1.25rem}

/* ── Typography ──────────────────────────────────── */
h1{font-size:1.125rem;font-weight:700;color:var(--text);line-height:1.2}
h2{font-size:1.0125rem;font-weight:600;color:var(--text)}
h3{font-size:0.8438rem;font-weight:600;color:var(--text)}
p{color:var(--text-2);line-height:1.6}

/* ── Cards ───────────────────────────────────────── */
.card{background:var(--bg-card);border:0.0625rem solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);padding:1.25rem}
.card-header{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;margin-bottom:1rem}
.card-title{font-size:0.7875rem;font-weight:600;color:var(--text)}

/* ── Stat Cards ──────────────────────────────────── */
.stat-card{background:var(--bg-card);border:0.0625rem solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);padding:1.125rem 1.25rem;display:flex;flex-direction:column;gap:0.3125rem;position:relative;overflow:hidden}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:0.1875rem;background:var(--teal);border-radius:var(--r-lg) var(--r-lg) 0 0}
.stat-card.red::before{background:var(--red)}
.stat-card.green::before{background:var(--green)}
.stat-card.blue::before{background:var(--tech-blue)}
.stat-card.amber::before{background:var(--amber)}
.stat-card.green-dark::before{background:var(--receita-areceber)}
.stat-card.saida::before{background:var(--saida)}
/* Cinza de "nada apurado": zero nao e lucro nem prejuizo, entao nao pode
   herdar o verde de sucesso (21/09/2026, item 2 do P0). */
.stat-card.neutro::before{background:var(--text-label)}
.stat-label{font-size:0.6188rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}
.stat-value{font-size:1.575rem;font-weight:700;color:var(--text);line-height:1}
.stat-sub{font-size:0.675rem;color:var(--text-muted)}

/* Versao discreta dos stat-cards, usada DENTRO das abas (Contas a Pagar/Receber) pra
   nao competir visualmente com os stat-cards fixos de cima — sem sombra, sem barra
   colorida no topo, borda fina; a cor vira so no valor (25/07) */
.stat-card-mini{background:var(--bg);border:0.0625rem solid var(--border);border-radius:0.5rem;padding:0.5rem 0.75rem;display:flex;flex-direction:column;gap:0.125rem}
.stat-mini-label{font-size:0.5625rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}
.stat-mini-value{font-size:0.9375rem;font-weight:700;color:var(--text);line-height:1.1}
.stat-mini-value.green{color:var(--green)}
.stat-mini-value.green-dark{color:var(--receita-areceber)}
.stat-mini-value.saida{color:var(--saida)}
.stat-mini-value.red{color:var(--red)}
.stat-mini-sub{font-size:0.6rem;color:var(--text-muted)}

/* ── Multi-select com checkbox (filtros de natureza/cliente) ── */
.multiselect{position:relative;display:inline-block}
.multiselect-btn{display:flex;align-items:center;gap:0.5rem;cursor:pointer;white-space:nowrap}
.multiselect-panel{position:absolute;top:calc(100% + 0.25rem);left:0;z-index:40;background:var(--bg-card);border:0.0625rem solid var(--border);border-radius:var(--r-sm);box-shadow:var(--shadow-md,0 0.5rem 1.5rem rgba(0,0,0,.15));padding:0.5rem;min-width:11rem;max-height:14rem;overflow-y:auto}
.multiselect-opt{display:flex;align-items:center;gap:0.4375rem;padding:0.3125rem 0.375rem;font-size:0.7rem;color:var(--text-2);cursor:pointer;border-radius:0.25rem;white-space:nowrap}
.multiselect-opt:hover{background:var(--bg)}
.multiselect-opt input{width:0.8125rem;height:0.8125rem;cursor:pointer;flex-shrink:0}
.multiselect-actions{display:flex;align-items:center;justify-content:space-between;padding:0.5rem 0.375rem 0.125rem;border-top:0.0625rem solid var(--border);margin-top:0.25rem}
.btn-link{background:none;border:none;padding:0;font-size:0.675rem;color:var(--text-muted);cursor:pointer;text-decoration:underline}
.btn-link:hover{color:var(--text-2)}

/* ── Buttons ─────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.375rem;padding:0.5625rem 1rem;border-radius:var(--r-sm);font-size:0.7313rem;font-weight:600;border:none;cursor:pointer;transition:background .12s,color .12s,border-color .12s,transform .08s;white-space:nowrap;line-height:1}
.btn:active{transform:scale(0.95)}
.btn-primary{background:var(--teal);color:var(--navy)}
.btn-primary:hover{background:var(--teal-dark)}
.btn-secondary{background:var(--bg);color:var(--text);border:0.0625rem solid var(--border-2)}
.btn-secondary:hover{background:var(--border)}
.btn-ghost{background:transparent;color:var(--text-2);border:0.0625rem solid var(--border-2)}
.btn-ghost:hover{background:var(--bg);color:var(--text)}
.btn-danger{background:var(--red-light);color:var(--red);border:0.0625rem solid rgba(239,68,68,.20)}
.btn-danger:hover{background:rgba(239,68,68,.20)}
.btn-sm{padding:0.375rem 0.6875rem;font-size:0.675rem}
.btn-icon{width:2.125rem;height:2.125rem;padding:0;border-radius:var(--r-sm);background:var(--bg);border:0.0625rem solid var(--border-2);color:var(--text-2)}
.btn-icon:hover{color:var(--text);background:var(--border)}
.btn-icon.btn-sm{width:1.75rem;height:1.75rem}

/* ── Badges ──────────────────────────────────────── */
.badge{display:inline-flex;align-items:center;gap:0.25rem;padding:0.1875rem 0.5rem;border-radius:var(--r-pill);font-size:0.6188rem;font-weight:600;white-space:nowrap}
.badge-teal  {background:var(--teal-light);color:var(--teal-dark)}
.badge-green {background:var(--green-light);color:#0a7a55}
.badge-amber {background:var(--amber-light);color:#b45309}
.badge-red   {background:var(--red-light);color:#dc2626}
.badge-blue  {background:var(--blue-light2);color:#2563eb}
.badge-gray  {background:rgba(128,151,177,.12);color:#607090}
.badge-navy  {background:rgba(17,36,67,.10);color:var(--navy)}

/* ── Forms ───────────────────────────────────────── */
.form-group{display:flex;flex-direction:column;gap:0.375rem}
.form-label{font-size:0.6188rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.07em}
.form-input{padding:0.5625rem 0.75rem;border:0.0938rem solid var(--border-2);border-radius:var(--r-sm);font-size:0.7313rem;color:var(--text);background:var(--bg-card);outline:none;transition:border-color .12s,box-shadow .12s;width:100%}
/* ATENÇÃO ao combinar .form-input com height fixo inline (ex: height:2rem) num select/input
   compacto: o padding vertical acima (0.5625rem topo+base) foi calculado pra caixa de altura
   automática. Com box-sizing:border-box, height fixo + esse padding some quase toda a altura,
   sobrando pouco espaço pro line-height do texto e cortando a base dos caracteres (bug real,
   corrigido em 05/08/2026 nos filtros De/Até do Financeiro, ver PSISELIFE-PENDENCIAS-EXECUCAO
   item #2). Ao fixar height, sempre sobrescrever também o padding vertical pra 0 no mesmo
   inline style (ex: "height:2rem;padding:0 0.5rem"), como já faz .pa-score-input. */
.form-input:focus{border-color:var(--teal);box-shadow:0 0 0 0.1875rem var(--teal-light)}
.form-input::placeholder{color:var(--text-label)}
select.form-input{cursor:pointer}
input[type="date"].form-input{cursor:pointer}
input[type="date"].form-input::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.7}
textarea.form-input{resize:vertical;min-height:4.5rem}

/* ── Layout helpers ──────────────────────────────── */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.grid-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(12.5rem,1fr));gap:1rem}

/* ── Table ───────────────────────────────────────── */
.table-wrap{background:var(--bg-card);border:0.0625rem solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm)}
.table-overflow{overflow-x:auto}
.table{width:100%;border-collapse:collapse;min-width:37.5rem}
.table th{background:var(--bg);color:var(--text-muted);font-size:0.6188rem;font-weight:600;text-transform:uppercase;letter-spacing:.07em;padding:0.625rem 0.875rem;text-align:left;border-bottom:0.0625rem solid var(--border);white-space:nowrap}
.table td{padding:0.75rem 0.875rem;border-bottom:0.0625rem solid var(--border);font-size:0.7313rem;color:var(--text);vertical-align:middle}
.fluxo-dia-hoje{background:rgba(54,224,196,.1)!important}
.table tr:last-child td{border-bottom:none}
.table tr:hover td{background:var(--bg)}
/* Variante compacta (linhas mais baixas) — usar so onde for pedido, para nao afetar as demais tabelas do sistema */
.table-compact td{padding:0.375rem 0.875rem}
/* Cabecalho de tabela tingido na cor do icone do modulo (isolado por classe, nao afeta outras tabelas) */
/* Fundo volta neutro (padrao .table th); so uma borda superior viva na cor cheia do modulo,
   mesmo principio da barra colorida no topo dos stat-cards do Dashboard */
/* Moldura completa (topo + laterais) so na linha do cabecalho, nao na tabela toda */
.table-hdr-crm th{border-top:0.1875rem solid #3b82f6}
.table-hdr-clientes th{border-top:0.1875rem solid #6366f1}
.table-hdr-tarefas th{border-top:0.1875rem solid #8b5cf6}
/* CRM: fontes da lista 10% maiores (pedido especifico so para o CRM) */
.table-lg-font td{font-size:0.804rem}
.table-lg-font th{font-size:0.681rem}

/* ── Page header ─────────────────────────────────── */
.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}
.page-title{font-size:1.2375rem;font-weight:700;color:var(--text)}
.page-subtitle{font-size:0.7313rem;color:var(--text-muted);margin-top:0.1875rem}

/* ── Empty state ─────────────────────────────────── */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3.5rem 1.5rem;text-align:center;gap:0.625rem}
.empty-icon{width:3.25rem;height:3.25rem;background:var(--teal-light);border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;color:var(--teal-dark)}
.empty-title{font-size:0.9rem;font-weight:600;color:var(--text)}
.empty-desc{font-size:0.7313rem;color:var(--text-muted);max-width:18.75rem;line-height:1.6}

/* ── Modal ───────────────────────────────────────── */
.modal-backdrop{position:fixed;inset:0;background:rgba(17,36,67,.40);backdrop-filter:blur(0.25rem);display:flex;align-items:center;justify-content:center;padding:1.5rem;z-index:100;opacity:0;pointer-events:none;transition:opacity .18s}
.modal-backdrop.open{opacity:1;pointer-events:all}
.modal{background:var(--bg-card);border:0.0625rem solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);width:100%;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;transform:translateY(0.625rem);transition:transform .18s}
.modal-backdrop.open .modal{transform:translateY(0)}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;padding:0.75rem 1.25rem;background:var(--navy);flex-shrink:0;border-bottom:none}
.modal-title{font-size:0.7313rem;font-weight:600;color:#fff;letter-spacing:.01em}
.modal-head .btn-icon{color:#fff;border-color:transparent;border-radius:50%;background:rgba(255,255,255,.18);width:1.625rem;height:1.625rem}
.modal-head .btn-icon:hover{background:rgba(255,255,255,.30);color:#fff}
.modal-head-branded{background:var(--navy);flex-shrink:0;padding:1.25rem;border-bottom:none;display:flex;align-items:center;justify-content:center;position:relative}
.modal-close-branded:hover{background:rgba(255,255,255,.12)!important}
.modal-body{padding:1rem 1.25rem;display:flex;flex-direction:column;gap:0.625rem;overflow-y:auto;flex:1}
.modal-foot{padding:0.625rem 1.25rem;border-top:0.0625rem solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:0.5rem;flex-wrap:wrap;flex-shrink:0}
/* Tela de anotações (ocupa área de conteúdo inteira com margem) */
.nota-fullscreen{display:flex;flex-direction:column;height:100%;background:var(--bg-card);overflow:hidden;border-radius:var(--r-lg);border:0.0625rem solid rgba(17,36,67,.12);box-shadow:var(--shadow)}
.nota-hdr{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0.625rem 1.25rem;background:var(--navy);flex-shrink:0;border-radius:var(--r-lg) var(--r-lg) 0 0}
.nota-hdr-title{font-size:0.6188rem;font-weight:600;color:rgba(255,255,255,.8);letter-spacing:.02em}
.nota-body{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}
/* Seções de nota */
.nota-section{display:flex;flex-direction:column;border-bottom:0.0625rem solid var(--border);min-height:0;overflow:hidden}
.nota-section:last-child{border-bottom:none}
.nota-sec-hdr{background:var(--bg);border-bottom:0.0625rem solid var(--border);padding:0.375rem 0.75rem;flex-shrink:0}
.nota-sec-title{font-size:0.5625rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--text-muted)}
/* Editor de texto rico */
.rte-toolbar{background:rgba(17,36,67,.025);border-bottom:0.0625rem solid var(--border);flex-shrink:0}
.rte-row{display:flex;align-items:center;gap:0.0625rem;padding:0.1875rem 0.5rem}
.rte-row+.rte-row{border-top:0.0625rem solid var(--border)}
.rte-btn{min-width:1.625rem;height:1.5rem;display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;border-radius:0.25rem;cursor:pointer;font-size:0.675rem;font-weight:700;color:var(--text-2);transition:background .1s,color .1s;flex-shrink:0;padding:0 0.3125rem;letter-spacing:0}
.rte-btn:hover{background:rgba(54,224,196,.18);color:var(--navy)}
.rte-sep{width:0.0625rem;height:1rem;background:var(--border-2);margin:0 0.25rem;flex-shrink:0;align-self:center}
.rte-size-sel{font-size:0.6188rem;height:1.5rem;border:0.0625rem solid var(--border-2);border-radius:0.25rem;background:var(--bg);color:var(--text-2);padding:0 0.25rem;cursor:pointer;min-width:3.5rem;font-weight:600}
.rte-cbar{width:0.875rem;height:0.1875rem;border-radius:0.0625rem;display:block;flex-shrink:0}
.rte-color-panel{position:fixed;z-index:800;background:var(--bg-card);border:0.0625rem solid var(--border-2);border-radius:var(--r-sm);box-shadow:var(--shadow-lg);padding:0.375rem;display:flex;flex-wrap:wrap;gap:0.25rem;width:8.25rem}
.rte-color-swatch{width:1.125rem;height:1.125rem;border-radius:0.25rem;cursor:pointer;transition:transform .1s;outline:0.0625rem solid transparent}
.rte-color-swatch:hover{transform:scale(1.25)}
.rte-content{flex:1;overflow-y:auto;padding:0.875rem 1.125rem;font-family:'Poppins',sans-serif;font-size:0.7313rem;line-height:1.8;color:var(--text);outline:none;position:relative}
.rte-content:empty::before{content:attr(data-placeholder);color:var(--text-label);pointer-events:none;font-style:italic}
/* Dropdown customizado inline */
.pc-custom-dd{position:fixed;z-index:600;background:var(--bg-card);border:0.0625rem solid var(--border-2);border-radius:var(--r-sm);box-shadow:var(--shadow-lg);overflow:hidden;min-width:9.375rem;padding:0.25rem 0}
.pc-dd-item{padding:0.375rem 0.75rem;cursor:pointer;display:flex;align-items:center;gap:0.5rem;transition:background .1s}
.pc-dd-item:hover{background:var(--bg)}
/* Sessões futuras ocultas */
.pc-fut-hidden{display:none}
/* Próxima sessão destacada */
.pc-row-proxima{background:rgba(16,185,129,.07)!important}
.pc-row-proxima td{color:var(--text)}
/* Sidebar desfocada quando anotações estão abertas */
.sidebar-blurred{filter:blur(0.1875rem);pointer-events:none;opacity:.5;transition:filter .2s,opacity .2s}
/* Botões de nota */
.btn-nota-new{background:transparent;border:0.0938rem solid var(--teal);color:var(--teal-dark);border-radius:var(--r-pill);font-weight:600}
.btn-nota-new:hover{background:var(--teal-light)}
.btn-nota-view{background:var(--teal);border:0.0938rem solid var(--teal);color:var(--navy);border-radius:var(--r-pill);font-weight:700}
.btn-nota-view:hover{background:var(--teal-dark);border-color:var(--teal-dark)}
/* Footer da tela de anotações */
.nota-footer{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;padding:0.625rem 1.25rem;background:var(--navy);flex-shrink:0;border-top:0.0625rem solid rgba(255,255,255,.08);border-radius:0 0 var(--r-lg) var(--r-lg)}
/* Botão voltar dentro do header da nota */
.nota-back-btn:hover{background:rgba(255,255,255,.15)!important;color:rgba(255,255,255,.95)!important;border-color:rgba(255,255,255,.3)!important}

/* ── Toast ───────────────────────────────────────── */
#toast-container{position:fixed;bottom:1.5rem;right:1.5rem;display:flex;flex-direction:column;gap:0.5rem;z-index:200;pointer-events:none}
.toast{background:var(--navy);color:#fff;padding:0.6875rem 1rem;border-radius:var(--r);font-size:0.7313rem;font-weight:500;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:0.625rem;pointer-events:all;animation:toast-in .22s ease;max-width:20rem;transition:opacity .3s,transform .3s}
.toast.success{border-left:0.1875rem solid var(--green)}
.toast.error  {border-left:0.1875rem solid var(--red)}
.toast.info   {border-left:0.1875rem solid var(--teal)}
.toast.warning{border-left:0.1875rem solid var(--teal-dark)}

/* Sino com alerta ativo */
@keyframes bell-pulse{0%,100%{transform:rotate(0)}20%{transform:rotate(-12deg)}40%{transform:rotate(12deg)}60%{transform:rotate(-8deg)}80%{transform:rotate(8deg)}}
#topbar-alertas.has-alerts svg{animation:bell-pulse 2.5s ease infinite;color:var(--amber)}
@keyframes toast-in{from{opacity:0;transform:translateY(0.625rem)}to{opacity:1;transform:translateY(0)}}

/* Celebração de depósito no Cofre de Fundo de Reserva */
@keyframes cofre-celebra{
  0%{opacity:0;transform:translate(-50%,-40%) scale(0.6)}
  25%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}
  70%{opacity:1;transform:translate(-50%,-58%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-72%) scale(0.9)}
}

/* ── Alerts inline ───────────────────────────────── */
.alert{display:flex;align-items:flex-start;gap:0.625rem;padding:0.75rem 0.875rem;border-radius:var(--r);font-size:0.7313rem}
.alert-info   {background:var(--teal-light);color:var(--navy);border:0.0625rem solid rgba(54,224,196,.22)}
.alert-warning{background:var(--amber-light);color:#92400e;border:0.0625rem solid rgba(245,158,11,.22)}
.alert-danger {background:var(--red-light);color:#991b1b;border:0.0625rem solid rgba(239,68,68,.22)}

/* ── Tabs fichário ───────────────────────────────── */
.fin-tabs,.cfg-tabs{display:flex;gap:0.1875rem;padding:0 0 0 0.125rem;position:relative;z-index:2}
.fin-tab,.cfg-tab{background:rgba(17,36,67,.04);border:0.0625rem solid var(--border);border-bottom:none;border-radius:0.625rem 0.625rem 0 0;padding:0.5625rem 1.25rem;font-size:0.7313rem;font-weight:600;color:var(--text-muted);cursor:pointer;transition:background .12s,color .12s;white-space:nowrap;position:relative;top:0.125rem}
.fin-tab:hover,.cfg-tab:hover{color:var(--text);background:var(--bg-card)}
.fin-tab.active,.cfg-tab.active{background:var(--bg-card);border-color:var(--border);border-bottom-color:var(--bg-card);color:var(--teal);z-index:3;top:0}
.tab-panel{background:var(--bg-card);border:0.0625rem solid var(--border);border-radius:0 0.75rem 0.75rem 0.75rem;padding:1.5rem;position:relative;z-index:1}

/* ── Colunas ordenáveis ──────────────────────────── */
.sort-th{cursor:pointer;user-select:none;white-space:nowrap}
.sort-th:hover{color:var(--teal)}
.sort-ind{font-size:0.5625rem;margin-left:0.1875rem;opacity:.7}

/* ── Toolbar / search ────────────────────────────── */
.toolbar{display:flex;align-items:center;gap:0.625rem;flex-wrap:wrap;margin-bottom:0.875rem}
.search-input{padding:0.5rem 0.75rem;border:0.0938rem solid var(--border-2);border-radius:var(--r-sm);font-size:0.7313rem;color:var(--text);background:var(--bg-card);outline:none;width:13.75rem;transition:border-color .12s}
.search-input:focus{border-color:var(--teal)}

/* ── Onboarding ──────────────────────────────────── */
.onboarding-overlay{position:fixed;inset:0;background:var(--bg-page);z-index:50;display:flex;align-items:flex-start;justify-content:center;padding:1.5rem;overflow-y:auto}
.onboarding-card{background:var(--bg-card);border:0.0625rem solid var(--border);border-radius:1.25rem;box-shadow:var(--shadow-lg);width:min(33.75rem,100%);padding:2.25rem;margin:auto}
.onboarding-logo{display:flex;align-items:center;gap:0.625rem;margin-bottom:1.5rem}
.onboarding-step{font-size:0.6188rem;font-weight:600;text-transform:uppercase;letter-spacing:.10em;color:var(--teal-dark);margin-bottom:0.375rem}
.onboarding-title{font-size:1.2375rem;font-weight:700;color:var(--text);margin-bottom:0.375rem}
.onboarding-desc{font-size:0.7875rem;color:var(--text-muted);margin-bottom:1.5rem;line-height:1.6}
.onboarding-fields{display:flex;flex-direction:column;gap:0.875rem;margin-bottom:1.375rem}
.onboarding-progress{display:flex;gap:0.375rem;margin-bottom:1.125rem}
.progress-dot{height:0.25rem;flex:1;background:var(--border-2);border-radius:var(--r-pill);transition:background .25s}
.progress-dot.done{background:var(--teal)}
.onboarding-actions{display:flex;justify-content:flex-end;gap:0.625rem}

/* ── Utilities ───────────────────────────────────── */
.hidden{display:none!important}
.mt-8 {margin-top:0.5rem}
.mt-16{margin-top:1rem}
.mt-24{margin-top:1.5rem}
.mb-12{margin-bottom:0.75rem}
.mb-16{margin-bottom:1rem}
.mb-20{margin-bottom:1.25rem}
.mb-24{margin-bottom:1.5rem}
.w-full{width:100%}
.text-muted{color:var(--text-muted)}
.text-sm{font-size:0.675rem}
.font-600{font-weight:600}

/* ── Scrollbar ───────────────────────────────────── */
::-webkit-scrollbar{width:0.3125rem;height:0.3125rem}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:var(--r-pill)}
::-webkit-scrollbar-thumb:hover{background:var(--text-label)}

/* ── Pipeline bar ────────────────────────────────── */
.pipeline-bar{display:flex;gap:0.375rem;flex-wrap:wrap}
.pipeline-chip{display:inline-flex;align-items:center;gap:0.3125rem;padding:0.3125rem 0.6875rem;border-radius:var(--r-pill);font-size:0.6188rem;font-weight:600;border:0.0938rem solid var(--border-2);background:var(--bg-card);color:var(--text-2);cursor:pointer;transition:all .12s;white-space:nowrap}
.pipeline-chip:hover{border-color:var(--teal);color:var(--navy)}
.pipeline-chip.active{background:var(--teal-light);border-color:var(--teal);color:var(--navy)}
.pipeline-count{background:var(--bg);border-radius:var(--r-pill);padding:0.0625rem 0.375rem;font-size:0.5625rem;min-width:1.125rem;text-align:center;border:0.0625rem solid var(--border)}

/* ── Inline select (CRM) ─────────────────────────── */
.inline-select{border:none;background:transparent;font-family:'Poppins',sans-serif;font-size:0.6188rem;font-weight:600;cursor:pointer;outline:none;padding:0.1875rem 0.375rem;border-radius:var(--r-pill);max-width:10rem}
.inline-select:focus{box-shadow:0 0 0 0.125rem var(--teal-light)}
.inline-select-fluxo{font-size:0.6188rem;font-weight:500;color:var(--text-2);border:none;background:transparent;font-family:'Poppins',sans-serif;cursor:pointer;outline:none;padding:0.1875rem 0.375rem;max-width:12.5rem}
.inline-select-fluxo:focus{box-shadow:0 0 0 0.125rem var(--teal-light)}

/* ── CRM row states ──────────────────────────────── */
.crm-row-stale td{background:rgba(245,158,11,.05)}

/* ── Upload avatar ───────────────────────────────── */
.upload-avatar{width:5rem;height:5rem;border-radius:var(--r);background:var(--bg);border:0.125rem dashed var(--border-2);display:flex;align-items:center;justify-content:center;overflow:hidden}

/* ── Script builder ──────────────────────────────── */
.script-etapas-list{display:flex;flex-direction:column;gap:0.375rem}
.script-etapa-row{display:flex;align-items:center;gap:0.5rem;padding:0.375rem 0.5rem;background:var(--bg);border-radius:var(--r-sm)}
.script-etapa-num{font-size:0.6188rem;font-weight:700;color:var(--text-muted);min-width:1.375rem;text-align:right}
.script-etapa-label{flex:1;padding:0.3125rem 0.5rem;font-size:0.675rem;border:0.0938rem solid var(--border-2);border-radius:var(--r-sm);background:var(--bg-card)}
.script-etapa-label:focus{border-color:var(--teal);outline:none}

/* ── Sessões / Prontuário ────────────────────────── */
.sess-row{display:flex;align-items:center;gap:0.875rem;padding:0.75rem 1rem;cursor:pointer;transition:background .12s}
.sess-row:hover{background:var(--bg)}
.sess-date{display:flex;flex-direction:column;align-items:center;min-width:2.625rem;flex-shrink:0}
.sess-date-d{font-size:1.2375rem;font-weight:800;color:var(--text);line-height:1}
.sess-date-m{font-size:0.5625rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;white-space:nowrap}
.sess-body{flex:1;min-width:0}
.sess-meta{display:flex;align-items:center;gap:0.4375rem;flex-wrap:wrap}
.sess-nome{font-weight:700;font-size:0.7313rem;color:var(--text)}
.sess-num{font-size:0.6188rem;color:var(--text-muted);font-weight:500}
.sess-tipo{font-size:0.6188rem;color:var(--text-muted)}
.sess-tag{font-size:0.5625rem;font-weight:600;padding:0.125rem 0.4375rem;border-radius:var(--r-pill);background:rgba(54,224,196,.15);color:var(--teal-dark)}
.sess-queixa{font-size:0.675rem;color:var(--text-muted);margin-top:0.1875rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sess-actions{display:flex;align-items:center;gap:0.5rem;flex-shrink:0}
.sess-pron-dot{font-size:0.5625rem;line-height:1}
.sess-secao-label{font-size:0.6188rem;font-weight:700;color:var(--text-muted);letter-spacing:.07em;text-transform:uppercase;margin-bottom:0.625rem}

/* ── Agenda ──────────────────────────────────────── */
/* Nav bar interna do card */
/* Fundo cinza padrao (igual CRM/Clientes/Tarefas) + moldura verde (cor do icone da Agenda)
   no topo e nas laterais, mesmo principio das outras telas — antes esquecida nesta tela */
.agd-nav-bar{display:flex;align-items:center;justify-content:space-between;padding:0.625rem 0.875rem;border-bottom:0.0625rem solid var(--border);gap:0.75rem;flex-shrink:0;background:var(--bg);border-top:0.1875rem solid #10b981}
.agd-nav-ctrl{display:flex;align-items:center;gap:0.125rem;background:var(--bg);border:0.0625rem solid var(--border);border-radius:var(--r-sm);padding:0.125rem;flex-shrink:0}
.agd-periodo-lbl{font-size:0.7313rem;font-weight:700;color:var(--text);white-space:nowrap;flex:1;text-align:center}
/* Tabs de vista */
.agd-view-tabs{display:flex;align-items:center;background:var(--bg);border:0.0625rem solid var(--border);border-radius:var(--r-sm);padding:0.125rem;gap:0.125rem;flex-shrink:0}
.agd-view-tab{font-size:0.6188rem;font-weight:600;padding:0.25rem 0.625rem;border-radius:0.25rem;border:none;background:transparent;color:var(--text-muted);cursor:pointer;transition:background .12s,color .12s}
.agd-view-tab:hover{background:rgba(17,36,67,.06);color:var(--text)}
.agd-view-tab.active{background:var(--teal);color:#fff}
/* Card da agenda — fundo da pagina volta ao padrao das demais telas; o contraste
   com o fundo agora vem de uma sombra mais forte que a dos outros cards do sistema
   (--shadow em vez de --shadow-sm), nao de escurecer o fundo por tras */
.agd-card{padding:0!important;overflow:hidden;box-shadow:var(--shadow);border-left-color:rgba(17,36,67,.11);border-right-color:rgba(17,36,67,.11);border-bottom-color:rgba(17,36,67,.11)}
.agd-card-mes{overflow:hidden}
/* Header de dias */
.agd-grid-hdr{display:grid;grid-template-columns:3.5rem repeat(7,1fr);border-bottom:0.0625rem solid var(--border);background:var(--bg-card);position:sticky;top:0;z-index:2}
.agd-grid-hdr-1col{display:grid;grid-template-columns:3.5rem 1fr;border-bottom:0.0625rem solid var(--border);background:var(--bg-card);position:sticky;top:0;z-index:2}
.agd-time-col-hdr{border-right:0.0625rem solid var(--border)}
.agd-day-hdr{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0.5rem 0.25rem 0.375rem;border-right:0.0625rem solid var(--border);gap:0.125rem;transition:background .15s}
.agd-day-hdr:last-child{border-right:none}
.agd-day-hdr.is-today{background:rgba(54,224,196,.06)}
.agd-dh-dia{font-size:0.5063rem;font-weight:700;letter-spacing:.09em;color:var(--text-label);text-transform:uppercase}
.agd-dh-num{font-size:0.9rem;font-weight:700;color:var(--text-2);width:1.875rem;height:1.875rem;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .15s}
.agd-dh-num.is-today{background:var(--teal);color:#fff;font-weight:800}
/* Grid — altura calculada dinamicamente em JS (_ajustarAlturaSlots) para caber o
   intervalo padrao (ex: 7h-21h) inteiro na tela sem barra de rolagem. Overflow so
   entra quando o usuario aumenta o intervalo de visualizacao alem do que cabe. */
.agd-grid-body{overflow-y:hidden;height:calc(100vh - var(--topbar-h) - 15rem)}
.agd-grid-inner{display:grid;grid-template-columns:3.5rem repeat(7,1fr)}
.agd-grid-inner-1col{display:grid;grid-template-columns:3.5rem 1fr}
/* Coluna de horas */
.agd-time-col{border-right:0.0625rem solid var(--border)}
.agd-tlbl{height:var(--agd-slot-h, 2.5rem);display:flex;align-items:flex-start;justify-content:flex-end;padding-right:0.5rem;padding-top:0.25rem;font-size:0.5625rem;font-weight:600;color:var(--text-muted);line-height:1;white-space:nowrap;border-top:0.0625rem solid var(--border)}
/* Colunas dos dias */
.agd-day-col{position:relative;border-right:0.0625rem solid var(--border)}
.agd-day-col:last-child{border-right:none}
.agd-day-col.is-today{background:rgba(54,224,196,.025)}
/* Slots */
.agd-slot{height:var(--agd-slot-h, 2.5rem);cursor:pointer;transition:background .08s}
.agd-slot.h{border-top:0.0625rem solid var(--border)}
.agd-slot:hover{background:rgba(54,224,196,.08)}
/* Feedback visual ao arrastar um agendamento sobre um slot (drag-and-drop) */
.agd-slot-dragover{background:rgba(54,224,196,.22)!important;box-shadow:inset 0 0 0 0.125rem var(--teal)}
/* Eventos — item #22 (08/08/2026): cursor de mão (grab) ficava ativo o tempo todo sobre
   o card, mesmo o clique simples pra editar sendo a ação mais comum, o que Reinaldo achou
   estranho. Padrão pesquisado em Google Agenda/Outlook: cursor padrão (pointer, "clique
   pra abrir") até o usuário de fato começar a arrastar — a partir daí o próprio navegador
   assume o cursor/ghost nativo de drag (a implementação já é 100% HTML5 nativo, sem
   setDragImage nem cursor customizado, ver agenda.js), então basta não competir com isso
   em CSS. Sem grab/grabbing artificial no idle nem no mousedown. */
.agd-event{position:absolute;left:0.1875rem;right:0.1875rem;border-radius:0.375rem;padding:0.125rem 0.375rem;cursor:pointer;overflow:hidden;z-index:1;display:flex;align-items:center;gap:0.3125rem;box-shadow:var(--shadow-sm);transition:opacity .12s,transform .12s}
.agd-event:hover{opacity:.88;transform:translateX(0.0625rem)}
.agd-ev-nome{font-size:0.5906rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
.agd-ev-hora{font-size:0.5344rem;opacity:.75;white-space:nowrap;flex-shrink:0}
.agd-event-lado .agd-ev-hora,.agd-event-lado svg{display:none}
.agd-event-lado{padding:0.125rem 0.25rem}
/* Vista mensal */
.agd-mes-hdr-row{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:0.0625rem solid var(--border);background:var(--bg)}
.agd-mes-hdr-cell{font-size:0.5625rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--text-label);text-align:center;padding:0.4375rem 0.25rem}
.agd-mes-body{display:grid;grid-template-columns:repeat(7,1fr)}
.agd-mes-cell{border-right:0.0625rem solid var(--border-2);border-bottom:0.0625rem solid var(--border-2);padding:0.25rem 0.3125rem;min-height:5rem;cursor:pointer;transition:background .1s;display:flex;flex-direction:column;gap:0.125rem}
.agd-mes-cell:nth-child(7n){border-right:none}
.agd-mes-cell:hover{background:rgba(17,36,67,.03)}
.agd-mes-other{opacity:.35}
.agd-mes-today{background:rgba(54,224,196,.06)!important}
.agd-mes-day-num{font-size:0.675rem;font-weight:600;color:var(--text-2);line-height:1;margin-bottom:0.125rem;display:inline-block}
.agd-mes-today-num{background:var(--teal);color:#fff;border-radius:50%;width:1.25rem;height:1.25rem;display:inline-flex;align-items:center;justify-content:center;font-size:0.6188rem;font-weight:800}
.agd-mes-evs{display:flex;flex-direction:column;gap:0.125rem;overflow:hidden}
.agd-mes-ev{font-size:0.5625rem;font-weight:600;padding:0.0625rem 0.3125rem;border-radius:0.1875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.6}
.agd-mes-ev-more{font-size:0.5625rem;color:var(--text-muted);padding:0.0625rem 0.3125rem;font-weight:500}
/* Configurações — menu */
.agd-sett-item{display:flex;align-items:center;justify-content:space-between;gap:0.625rem;padding:0.625rem 0.75rem;border-radius:var(--r-sm);border:none;background:transparent;cursor:pointer;width:100%;transition:background .12s}
.agd-sett-item:hover:not(:disabled){background:var(--bg)}
.agd-sett-disabled{opacity:.4;cursor:not-allowed!important}

/* Badge clicável */
.badge-clickable{cursor:pointer;transition:opacity .12s,transform .1s;user-select:none}
.badge-clickable:hover{opacity:.8;transform:scale(1.04)}

/* Tipo de evento (toggle Atendimento/Geral) */
.ag-tipo-toggle{display:flex;border:0.0625rem solid var(--border-2);border-radius:var(--r-sm);overflow:hidden;width:fit-content}
.ag-tipo-btn{padding:0.375rem 1.125rem;font-size:0.675rem;font-weight:600;color:var(--text-muted);background:transparent;border:none;cursor:pointer;transition:background .12s,color .12s}
.ag-tipo-btn.active{background:var(--teal);color:#fff}
.ag-tipo-btn:not(.active):hover{background:var(--teal-light);color:var(--teal-dark)}

/* ── Página do Cliente ───────────────────────────── */
.pc-tabs{display:flex;gap:0.125rem;background:var(--bg);border:0.0625rem solid var(--border);border-radius:var(--r-sm);padding:0.1875rem;width:fit-content}
.pc-tab{padding:0.375rem 1.125rem;font-size:0.675rem;font-weight:600;color:var(--text-muted);background:transparent;border:none;border-radius:calc(var(--r-sm) - 0.125rem);cursor:pointer;transition:background .12s,color .12s;white-space:nowrap}
.pc-tab.active{background:var(--bg-card);color:var(--text);box-shadow:var(--shadow-xs)}
.pc-tab:not(.active):hover{color:var(--text-2);background:rgba(17,36,67,.04)}

/* ── Popover de ação rápida (calendário) ─────────── */
.agd-popover{position:fixed;z-index:600;background:var(--bg-card);border:0.0625rem solid var(--border);border-radius:0.875rem;box-shadow:0 0.75rem 2.25rem rgba(0,0,0,.11),0 0.125rem 0.5rem rgba(0,0,0,.05);width:19.375rem;overflow:visible}
.agd-pop-toolbar{display:flex;justify-content:flex-end;align-items:center;gap:0.0625rem;padding:0.625rem 0.625rem 0}
.agd-pop-ico{width:1.75rem;height:1.75rem;border:none;background:transparent;border-radius:0.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-muted);transition:background .12s,color .12s}
.agd-pop-ico:hover{background:rgba(17,36,67,.06);color:var(--text)}
.agd-pop-del-btn:hover{background:rgba(239,68,68,.08)!important;color:var(--red)!important}
.agd-pop-body{padding:0.375rem 1.125rem 1.125rem}
.agd-pop-title{display:flex;align-items:center;gap:0.5625rem;margin-bottom:0.625rem}
.agd-pop-clr-sq{width:0.6875rem;height:0.6875rem;border-radius:0.25rem;flex-shrink:0}
.agd-pop-nome{font-size:0.7875rem;font-weight:600;color:var(--text);line-height:1.35}
.agd-pop-tags{display:flex;gap:0.3125rem;flex-wrap:wrap;margin-bottom:0.75rem}
.agd-pop-tag{display:inline-block;font-size:0.5625rem;font-weight:500;padding:0.1875rem 0.5625rem;border-radius:1.25rem;background:rgba(17,36,67,.06);color:var(--text-2);letter-spacing:.01em}
.agd-pop-tag-blue{background:rgba(14,165,233,.09);color:#0369a1}
.agd-pop-info{font-size:0.675rem;font-weight:400;color:var(--text-2);line-height:2;margin-bottom:0.875rem}
.agd-pop-recorr{color:var(--text-muted);font-size:0.6188rem}
.agd-pop-obs{font-style:italic;color:var(--text-muted);margin-top:0.125rem}
.agd-pop-st-wrap{position:relative}
.agd-pop-st-btn{width:100%;display:flex;align-items:center;gap:0.5rem;padding:0.5625rem 0.75rem;border:0.0625rem solid var(--border);border-radius:0.5625rem;background:var(--bg);cursor:pointer;font-size:0.675rem;font-weight:500;color:var(--text-2);transition:background .12s,border-color .12s}
.agd-pop-st-btn:hover{background:rgba(17,36,67,.04);border-color:var(--border-2)}
.agd-pop-st-dot{width:0.5rem;height:0.5rem;border-radius:50%;flex-shrink:0}
.agd-pop-chevron{margin-left:auto;opacity:.38}
.agd-pop-st-dd{position:absolute;top:calc(100% + 0.3125rem);left:0;right:0;background:var(--bg-card);border:0.0625rem solid var(--border);border-radius:0.625rem;box-shadow:0 0.5rem 1.5rem rgba(0,0,0,.09);z-index:10;overflow:hidden}
.agd-pop-st-item{display:block;width:100%;padding:0.5625rem 0.875rem;text-align:left;font-size:0.675rem;font-weight:500;border:none;background:transparent;cursor:pointer;color:var(--text-2);transition:background .1s}
.agd-pop-st-item:hover{background:rgba(17,36,67,.05);color:var(--text)}
.agd-pop-st-item.active{background:rgba(12,188,159,.08);color:var(--teal-dark);font-weight:600}

/* ── Legenda de cores da agenda ───────────────────── */
.agd-legend{display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:1rem;padding:0.5625rem 1.125rem 0.625rem;border-top:0.0625rem solid var(--border)}
.agd-leg-item{display:flex;align-items:center;gap:0.375rem;font-size:0.6188rem;font-weight:500;color:var(--text-2);user-select:none}
.agd-leg-bar{width:0.25rem;height:1.125rem;border-radius:0.1875rem;flex-shrink:0}
.agd-leg-sw-cancel{background:#c4cdd9}

/* ── Responsive ──────────────────────────────────── */
@media(max-width:900px){
  .app-shell{display:block}
  .sidebar{display:none}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .mb-20,.mb-24{margin-bottom:0.75rem}
  .content{padding:1rem}
}
@media(max-width:560px){
  .grid-stats{grid-template-columns:1fr 1fr}
  .modal{max-height:95vh}
}

/* Notificacao flutuante dos recados do painel admin (data/comunicados.js).
   Ate 05/09/2026 isto era uma faixa no alto (.comunicados-faixa), que empurrava
   o conteudo para baixo. Agora mora no mesmo canto do toast, por cima da tela,
   sem tomar espaco de nenhum modulo. Uma por vez; o resto espera no sino. */
.notif{position:relative;background:var(--bg-card);color:var(--text);border:0.0625rem solid var(--border-2);
  border-left:0.1875rem solid var(--teal);border-radius:var(--r);box-shadow:var(--shadow-lg);
  padding:0.875rem 2rem 0.875rem 1rem;max-width:21rem;pointer-events:all;animation:toast-in .22s ease;
  transition:opacity .3s,transform .3s}
.notif.alerta{border-left-color:var(--amber)}
.notif-titulo{font-size:0.7313rem;font-weight:700;color:var(--navy);line-height:1.3}
.notif-texto{font-size:0.7313rem;color:var(--text-2);margin-top:0.3125rem;white-space:pre-wrap;line-height:1.45}
.notif-link{display:inline-block;margin-top:0.375rem;font-size:0.7313rem;font-weight:600;color:var(--teal-dark);text-decoration:underline}
.notif-acoes{display:flex;gap:0.5rem;margin-top:0.75rem}
.notif-x{position:absolute;top:0.375rem;right:0.5rem;background:transparent;border:0;cursor:pointer;
  color:var(--text-muted);font-size:1rem;line-height:1;padding:0.125rem 0.25rem;opacity:.6}
.notif-x:hover{opacity:1}

/* Sino da barra superior: separador entre Renovacoes e Recados do PSISELIFE */
.notif-secao{font-size:0.625rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--text-label);margin:1rem 0 0.375rem}
.notif-secao:first-child{margin-top:0}

/* ═══ BARRA INFERIOR DO CELULAR (P0 item 1, 21/09/2026) ═══════════════
   Até aqui, @media(max-width:900px) escondia a .sidebar e não colocava nada
   no lugar: no celular só sobrava o sino. Esta barra é o substituto. No
   computador ela não existe (display:none), então nada acima de 900px muda.
   Camadas: barra 50 e painel 90, os dois abaixo do modal (100), para nunca
   cobrir uma janela aberta. */
.bottom-nav{display:none}
.bmais{display:none}

@media(max-width:900px){
  .bottom-nav{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;
    background:var(--bg-card);border-top:0.0625rem solid var(--border);
    box-shadow:0 -0.125rem 0.75rem rgba(17,36,67,.06);
    padding-bottom:env(safe-area-inset-bottom,0px);
  }
  .bnav-item{
    flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;
    justify-content:center;gap:0.1875rem;height:3.5rem;padding:0 0.125rem;
    border:none;background:transparent;cursor:pointer;color:var(--text-muted);
    transition:color .12s;-webkit-tap-highlight-color:transparent;
  }
  .bnav-icon{position:relative;width:1.375rem;height:1.375rem;display:flex;align-items:center;justify-content:center}
  .bnav-icon svg,.bnav-icon img{width:100%;height:100%;display:block}
  .bnav-icon img{object-fit:contain}
  .bnav-label{font-size:0.625rem;font-weight:600;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .bnav-item.active{color:var(--navy)}
  .bnav-item.active .bnav-icon{color:var(--icon-color,var(--teal-dark))}
  .bnav-badge{
    position:absolute;top:-0.25rem;right:-0.375rem;min-width:1rem;height:1rem;padding:0 0.1875rem;
    background:var(--red);color:#fff;font-size:0.5625rem;font-weight:700;line-height:1rem;
    text-align:center;border-radius:var(--r-pill);
  }

  /* O conteúdo precisa terminar acima da barra, senão a última linha some. */
  .content{padding-bottom:calc(3.5rem + 1rem + env(safe-area-inset-bottom,0px))}
  /* O aviso flutuante sobe para não ficar atrás da barra. */
  #toast-container{bottom:calc(4.25rem + env(safe-area-inset-bottom,0px));right:1rem;left:1rem}
  .notif{max-width:100%}

  /* ── Painel "Mais": tela cheia, mesmos grupos do computador ── */
  .bmais{
    display:flex;flex-direction:column;position:fixed;inset:0;z-index:90;
    background:var(--bg-card);animation:bmais-sobe .18s ease-out;
    padding-bottom:env(safe-area-inset-bottom,0px);
  }
  .bmais-topo{
    display:flex;align-items:center;justify-content:space-between;
    height:var(--topbar-h);flex:0 0 var(--topbar-h);padding:0 1rem;
    border-bottom:0.0625rem solid var(--border);
  }
  .bmais-titulo{font-size:0.8438rem;font-weight:600;color:var(--text)}
  .bmais-fechar{
    display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;
    border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:var(--r-sm);
  }
  .bmais-fechar:active{background:var(--bg)}
  .bmais-lista{flex:1;overflow-y:auto;padding:0.5rem 0.625rem 1rem}
  .bmais-secao{
    display:block;font-size:0.695rem;font-weight:600;text-transform:uppercase;
    letter-spacing:.12em;color:var(--text-muted);padding:1.125rem 0.5rem 0.25rem;
  }
  .bmais-item{
    display:flex;align-items:center;gap:0.75rem;width:100%;text-align:left;
    padding:0.75rem 0.625rem;border:none;background:transparent;cursor:pointer;
    border-radius:var(--r-sm);color:var(--text-2);font-size:0.7313rem;font-weight:500;
    -webkit-tap-highlight-color:transparent;
  }
  .bmais-item:active{background:var(--bg)}
  .bmais-item.active{background:var(--teal-light);color:var(--navy);font-weight:600}
  .bmais-icon{width:1.25rem;height:1.25rem;flex:0 0 1.25rem;display:flex;align-items:center;justify-content:center;color:var(--text-label)}
  .bmais-icon svg,.bmais-icon img{width:100%;height:100%;display:block}
  .bmais-icon img{object-fit:contain}
  .bmais-item.active .bmais-icon{color:var(--icon-color,var(--teal-dark))}
  .bmais-item[data-nav="marketing"] .bmais-icon{width:1.75rem;height:1.05rem;flex:0 0 1.75rem}
  .bmais-user{
    display:flex;align-items:center;gap:0.625rem;padding:0.75rem 1rem;
    border-top:0.0625rem solid var(--border);cursor:pointer;
  }
  .bmais-user-name{font-size:0.7313rem;font-weight:600;color:var(--text)}
  .bmais-user-crp{font-size:0.6188rem;color:var(--text-muted)}
  body.bmais-aberto{overflow:hidden}
}

@keyframes bmais-sobe{from{opacity:0;transform:translateY(0.75rem)}to{opacity:1;transform:none}}

/* Menu novo (18/10/2026): Soluções em destaque logo abaixo de Hoje */
.nav-item.nav-destaque{background:linear-gradient(110deg,rgba(54,224,196,.14),rgba(54,224,196,.04));border:0.0625rem solid rgba(40,196,170,.35);color:var(--navy);font-weight:600;margin:0.1875rem 0 0.125rem}
.nav-item.nav-destaque .nav-icon{color:var(--teal-dark)}
.nav-item.nav-destaque:hover:not(.active){background:rgba(54,224,196,.2)}
.nav-item.nav-destaque.active{background:var(--teal-light);border-color:var(--teal-dark)}

/* Menu lateral compacto por altura da janela (18/10/2026): evita barra de rolagem no menu novo */
@media (min-width:901px) and (max-height:900px){
  .nav-section-label{padding-top:0.75rem}
  .nav-item{padding-top:0.28rem;padding-bottom:0.28rem}
}
@media (min-width:901px) and (max-height:780px){
  .nav-section-label{padding-top:0.5rem;padding-bottom:0.125rem}
  .nav-item{padding-top:0.2rem;padding-bottom:0.2rem}
  .sidebar-nav{zoom:1}
}

/* Soluções, Cursos, Mentoria e Central de IA: capa, garfo de perfil e abas (18/10/2026, protótipo v2) */
.v2-capa{width:calc(100% + 2.5rem);margin:-1.25rem -1.25rem 0.25rem;aspect-ratio:16/9;border-radius:0.75rem 0.75rem 0 0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.85);background:linear-gradient(135deg,#e3ebf4,#d3e0ee)}
.v2-capa.destaque{background:linear-gradient(135deg,var(--navy) 0%,#1d4a6b 55%,var(--teal-dark) 130%)}
.v2-capa:not(.destaque){color:var(--text-2)}
.v2-garfo{display:flex;flex-direction:column;gap:0.5rem;margin-bottom:1.5rem}
.v2-garfo-t{font-size:0.8rem;font-weight:700;margin:0;color:var(--text)}
.v2-garfo-b{display:grid;grid-template-columns:repeat(3,1fr);gap:0.75rem}
.v2-garfo-b button{background:var(--bg-card);border:1px solid var(--border-2);border-radius:var(--r-lg);padding:0.75rem 1rem;text-align:left;cursor:pointer;font-family:inherit;display:flex;flex-direction:column;gap:0.2rem}
.v2-garfo-b button b{font-size:0.8rem;color:var(--text)}
.v2-garfo-b button span{font-size:0.68rem;color:var(--text-2);line-height:1.5}
.v2-garfo-b button.on{border:2px solid var(--teal-dark);background:var(--teal-light)}
.v2-garfo-ver{align-self:flex-start;background:none;border:none;padding:0;font-family:inherit;font-size:0.7rem;color:var(--text-2);text-decoration:underline;cursor:pointer}
.v2-economia{font-size:0.7rem;color:#047857;font-weight:600}
.v2-como{display:flex;gap:1rem;align-items:flex-start;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);padding:0.9rem 1.1rem;margin-bottom:1.25rem}
.v2-como b{font-size:0.78rem}
.v2-como ol{margin:0.35rem 0 0;padding-left:1.1rem;font-size:0.72rem;color:var(--text-2);line-height:1.7}
.v2-pr-dest{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem}
.v2-pr-peq{display:grid;grid-template-columns:repeat(3,1fr);gap:0.75rem}
.v2-pr{display:flex;flex-direction:column;gap:0.5rem}
.v2-pr.grande{border-top:3px solid var(--teal-dark)}
.v2-pr .quando{font-size:0.68rem;color:var(--text);background:var(--bg);border-radius:var(--r-sm);padding:0.45rem 0.65rem;line-height:1.5}
.v2-pr .acoes{display:flex;gap:0.5rem;flex-wrap:wrap;margin-top:auto}
.v2-etapas{display:flex;flex-direction:column;max-width:43.75rem;margin-top:1.5rem}
.v2-etapa{padding:0.8rem 0;border-top:1px solid var(--border-2)}
.v2-etapa:first-child{border-top:none}
.v2-etapa b{font-size:0.82rem}
.v2-etapa p{margin:0.15rem 0 0;font-size:0.72rem;color:var(--text-2);line-height:1.55}
@media(max-width:860px){
  .v2-garfo-b,.v2-pr-dest,.v2-pr-peq{grid-template-columns:1fr}
}

/* Meu plano: atalho ao lado do nome, sem aumentar a altura do menu (18/10/2026) */
.sidebar-footer{display:flex;align-items:center;gap:0.25rem}
.sidebar-footer .sidebar-user{flex:1;min-width:0}
.sidebar-plano{flex:none;background:none;border:0.0625rem solid var(--border-2);border-radius:var(--r-pill);padding:0.2rem 0.55rem;font-family:inherit;font-size:0.6188rem;font-weight:600;color:var(--text-2);cursor:pointer}
.sidebar-plano:hover,.sidebar-plano.active{background:var(--teal-light);color:var(--navy)}
.bmais-plano{margin:0.5rem 1rem 0;background:none;border:0.0625rem solid var(--border-2);border-radius:var(--r-pill);padding:0.4rem 0.9rem;font-family:inherit;font-size:0.7rem;font-weight:600;color:var(--text-2);cursor:pointer}
