/* ============================================================================
   ESTILOS ESPECÍFICOS DE VIEWS — componentes que não existem no protótipo base
   (2a.2: Financeiro — seletor de unidade, CTA IRPF, informe, totalizadores)
   ========================================================================== */

/* Acessibilidade: região live invisível */
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}

/* ── Seletor de unidade (Financeiro) ── */
.fin-selector{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); padding:12px 16px; margin-bottom:14px;
}
.fin-selector-label{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-400)}
.fin-selector .input{max-width:340px; flex:1; min-width:200px}
.fin-context-label{
  font-size:12px; font-weight:700; color:var(--brand-600);
  background:var(--brand-50); border-radius:var(--r-full); padding:4px 12px;
}
.fin-context-label.consolidado{color:var(--ink-600); background:var(--surface-3)}

/* ── CTA IRPF ── */
.irpf-cta{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  background:linear-gradient(135deg, var(--shell-800), var(--shell-900));
  border-radius:var(--r-md); padding:14px 18px; margin-bottom:16px;
}
.irpf-cta-text{display:flex; flex-direction:column; gap:2px}
.irpf-cta-text strong{color:var(--shell-text); font-family:var(--font-display); font-size:13.5px}
.irpf-cta-text span{color:var(--shell-text-2); font-size:12px}

/* ── Linhas de destaque nas tabelas ── */
table.dt tbody tr.row-late{background:var(--danger-bg)}
table.dt tbody tr.row-late:hover{background:#FBDBD8}
table.dt tbody tr.row-open td:first-child{box-shadow:inset 3px 0 0 var(--warning)}
table.dt tr.subtotal-row td{background:var(--surface-2); font-weight:700; font-size:12.5px; color:var(--ink-600)}
table.dt tr.grand-total-row td{background:var(--surface-3); font-weight:800; font-size:13px}

/* ── Totalizadores do Extrato ── */
table.dt tfoot tr.ext-tot td{font-weight:700; border-top:2px solid var(--border-strong)}
table.dt tfoot tr.ext-tot-pago td{background:var(--success-bg)}
table.dt tfoot tr.ext-tot-aberto td{background:var(--warning-bg)}
table.dt tfoot tr.ext-tot-geral td{background:var(--shell-800); color:#fff; font-weight:800}
table.dt tfoot tr.ext-tot-geral td.num{color:#fff}

/* ── Dados do contrato (cabeçalho do extrato) ── */
.contrato-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px;
  padding:14px 20px; border-bottom:1px solid var(--border); background:var(--surface-2);
}
.contrato-item{display:flex; flex-direction:column; gap:2px}
.contrato-item span{font-size:10.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-400)}
.contrato-item strong{font-family:var(--font-display); font-size:15px; color:var(--ink-900)}

/* ── Totalizador de pagos por tipo ── */
.pago-tot-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:10px;
  padding:14px 20px 4px;
}
.pago-tot-card{
  background:var(--success-bg); border-radius:var(--r-sm); padding:10px 14px;
  display:flex; flex-direction:column; gap:2px;
}
.pago-tot-card span{font-size:11px; font-weight:600; color:var(--success-ink)}
.pago-tot-card strong{font-family:var(--font-display); font-size:15.5px; color:var(--success-ink)}

/* ── Ações do IRPF ── */
.irpf-actions{display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; margin-bottom:16px}
.irpf-modo-toggle-wrap{display:flex; align-items:center; gap:8px}
.irpf-modo-toggle-wrap > span{font-size:11px; color:var(--ink-400); font-weight:600; white-space:nowrap}
.irpf-modo-toggle{display:flex; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-full); padding:3px}
.irpf-modo-btn{
  border:none; background:none; color:var(--ink-500); font-size:12px; font-weight:600;
  padding:6px 13px; border-radius:var(--r-full); cursor:pointer; transition:all var(--t-fast) var(--ease);
}
.irpf-modo-btn.active{background:var(--ink-900); color:#fff}

/* ── Informe IRPF (preview) ── */
.irpf-informe{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); overflow:hidden;
}
.iip-head{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  background:linear-gradient(135deg, var(--shell-800), var(--shell-900));
  padding:22px 26px; border-bottom:3px solid var(--brand);
}
.iip-head-logo{width:150px; height:auto; display:block}
.iip-head-title{text-align:right}
.iip-ht-sub{font-size:10.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--shell-text-2)}
.iip-ht-main{font-family:var(--font-display); font-size:17px; font-weight:800; color:var(--shell-text); margin:2px 0}
.iip-ht-ano{font-size:12px; color:var(--shell-text-2)}
.iip-parties{display:grid; grid-template-columns:1fr 1fr; gap:0; border-bottom:1px solid var(--border)}
.iip-party{padding:18px 26px}
.iip-party + .iip-party{border-left:1px solid var(--border)}
.iip-party-lbl{font-size:10px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-400); margin-bottom:6px}
.iip-party-name{font-family:var(--font-display); font-size:14.5px; font-weight:800; color:var(--ink-900); margin-bottom:6px}
.iip-party-detail{font-size:12px; color:var(--ink-500); line-height:1.6}
.iip-participacao{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:12px 26px; background:var(--surface-2); border-bottom:1px solid var(--border);
}
.iip-participacao-badge{
  color:#fff; font-size:10.5px; font-weight:800; letter-spacing:.04em;
  padding:4px 12px; border-radius:var(--r-full); white-space:nowrap;
}
.iip-participacao-txt{font-size:12px; color:var(--ink-600)}
.iip-totals{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; padding:18px 26px}
.iip-total-box{border-radius:var(--r-sm); padding:14px 16px; color:#fff}
.iip-total-lbl{font-size:9.5px; font-weight:700; letter-spacing:.05em; line-height:1.4; opacity:.85; margin-bottom:6px}
.iip-total-val{font-family:var(--font-display); font-size:19px; font-weight:800}
.iip-tb-dark{background:var(--shell-800)}
.iip-tb-red{background:var(--brand)}
.iip-tb-green{background:var(--success-ink)}
.iip-tb-blue{background:var(--info-ink)}
.iip-breakdown{padding:0 26px}
.iip-breakdown-title{font-size:12px; font-weight:700; color:var(--ink-600); margin-bottom:8px}
.irpf-informe > .table-wrap{margin:0 26px 18px; border-radius:var(--r-sm)}
.iip-legal{
  padding:14px 26px 20px; font-size:11px; color:var(--ink-400); line-height:1.6;
  border-top:1px solid var(--border);
}

/* ============================================================================
   ATENDIMENTO / AGENDAMENTOS / INDICAÇÕES (2a.3) — lista de itens + thread
   ========================================================================== */
.ch-list{display:flex; flex-direction:column; gap:10px}
.ch-row{
  display:flex; align-items:flex-start; justify-content:space-between; gap:14px;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); padding:14px 16px; cursor:pointer; transition:all var(--t-fast) var(--ease);
}
.ch-row:hover{border-color:var(--border-strong); box-shadow:var(--shadow-2)}
.ch-main{min-width:0; flex:1}
.ch-proto{font-family:var(--font-display); font-size:11px; font-weight:700; color:var(--ink-400); margin-bottom:2px}
.ch-assunto{font-size:13.5px; font-weight:700; color:var(--ink-900); margin-bottom:4px}
.ch-meta{font-size:12px; color:var(--ink-500)}

.thread{display:flex; flex-direction:column; gap:10px; max-height:320px; overflow-y:auto; padding:2px}
.msg-bubble{border-radius:var(--r-sm); padding:10px 13px; font-size:13px; max-width:88%}
.msg-mine{background:var(--brand-50); align-self:flex-end; margin-left:auto}
.msg-theirs{background:var(--surface-2); align-self:flex-start}
.msg-who{font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-400); margin-bottom:4px}
.msg-anexo{display:inline-flex; align-items:center; gap:5px; font-size:12px; color:var(--brand-600); margin-top:6px; font-weight:600}
.msg-anexo:hover{text-decoration:underline}
.msg-time{font-size:10.5px; color:var(--ink-400); margin-top:6px}

.nps-box{background:var(--surface-2); border-radius:var(--r-md); padding:16px; margin-top:14px}

/* ============================================================================
   EMPREENDIMENTOS (2a.4)
   ========================================================================== */
.hint{font-size:11px; color:var(--ink-400)}
.emp-layout{display:grid; grid-template-columns:320px 1fr; gap:16px; align-items:start}
.emp-list{display:flex; flex-direction:column; gap:10px}
.emp-list-card{
  display:flex; gap:12px; align-items:flex-start; padding:12px 14px; background:var(--surface);
  border:1.5px solid var(--border); border-radius:var(--r-md); cursor:pointer; text-align:left;
  transition:all var(--t-fast) var(--ease); width:100%;
}
.emp-list-card:hover{border-color:var(--border-strong); box-shadow:var(--shadow-1)}
.emp-list-card.active{border-color:var(--brand); background:var(--brand-50)}
.emp-list-thumb{position:relative; width:56px; height:56px; border-radius:var(--r-sm); overflow:hidden; background:var(--surface-2); flex-shrink:0; display:flex; align-items:center; justify-content:center; color:var(--ink-300)}
.emp-list-thumb img{width:100%; height:100%; object-fit:cover}
.emp-list-thumb-bar{position:absolute; bottom:0; left:0; height:3px; background:var(--brand)}
.emp-list-info{flex:1; min-width:0; display:flex; flex-direction:column; gap:4px}
.emp-list-name{font-size:13px; font-weight:700; color:var(--ink-900); display:flex; align-items:center; gap:6px; flex-wrap:wrap}
.emp-list-addr{font-size:11.5px; color:var(--ink-500)}
.emp-list-pct{font-size:12px; font-weight:800; color:var(--brand-600)}
.emp-panel{padding:0; overflow:hidden}
.emp-panel-img{position:relative; height:200px; background:var(--surface-2); display:flex; align-items:center; justify-content:center; color:var(--ink-300)}
.emp-panel-img img{width:100%; height:100%; object-fit:cover}
.emp-panel-img-overlay{
  position:absolute; left:0; right:0; bottom:0; padding:16px 20px;
  background:linear-gradient(to top, rgba(10,15,20,.75), transparent);
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.emp-panel-img-name{color:#fff; font-family:var(--font-display); font-weight:800; font-size:16px}
.emp-panel-body{padding:20px 22px}
.emp-panel-section{font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-400); margin-bottom:4px}
.emp-etapa{display:flex; align-items:center; gap:10px}
.emp-unidade-row{display:flex; align-items:center; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--border); font-size:12.5px}

/* ============================================================================
   DOCUMENTOS (2a.4)
   ========================================================================== */
.docs-sep{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-400); margin:20px 0 10px}
.docs-sep:first-child{margin-top:0}
.docs-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:10px}
.doc-card{
  display:flex; align-items:center; gap:12px; text-align:left; background:var(--surface);
  border:1px solid var(--border); border-radius:var(--r-md); padding:12px 14px; cursor:pointer;
  transition:all var(--t-fast) var(--ease);
}
.doc-card:hover{border-color:var(--border-strong); box-shadow:var(--shadow-1)}
.doc-card-icon{width:36px; height:36px; border-radius:var(--r-sm); background:var(--brand-50); color:var(--brand-700); display:flex; align-items:center; justify-content:center; flex-shrink:0}
.doc-card-icon svg{width:17px; height:17px}
.doc-card strong{display:block; font-size:12.5px; color:var(--ink-900); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.doc-card-sub{display:block; font-size:11px; color:var(--ink-400); margin-top:2px}

/* ============================================================================
   PERSONALIZAÇÃO (2a.4)
   ========================================================================== */
.pz-hero{text-align:center; margin-bottom:14px}
.pz-hero-label{font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-400); margin-bottom:6px}
.pz-hero-pct{font-family:var(--font-display); font-size:32px; font-weight:800; margin-bottom:10px}
.pz-legend{margin-bottom:14px; font-size:12.5px; color:var(--ink-500)}
.pz-legend summary{cursor:pointer; font-weight:600}
.pz-legend-body{display:flex; gap:8px; flex-wrap:wrap; margin-top:10px}
.pz-card{margin-bottom:16px}
.timeline{display:flex; flex-direction:column; gap:16px}
.tl{border-left:2px solid var(--border); padding:2px 0 2px 16px; position:relative}
.tl::before{content:""; position:absolute; left:-5px; top:4px; width:8px; height:8px; border-radius:50%; background:var(--border-strong)}
.tl h4{font-size:13.5px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:4px}
.tl-meta{font-size:12px; color:var(--ink-500); margin-bottom:6px}
.tl-com{background:var(--surface-2); border-radius:var(--r-sm); padding:8px 10px; font-size:12.5px; color:var(--ink-600); margin-bottom:8px}
.pz-sub-list{margin:8px 0; padding:8px 10px; background:var(--surface-2); border-radius:var(--r-sm); display:flex; flex-direction:column; gap:6px}
.pz-sub-check{display:flex; align-items:center; gap:8px; font-size:12.5px}
.pz-sub-btn{flex-shrink:0; width:20px; height:20px; border-radius:5px; border:1.5px solid var(--border-strong); background:var(--surface); cursor:pointer; font-size:12px}
.pz-sub-empty{flex-shrink:0; width:20px; height:20px; border-radius:5px; border:1.5px solid var(--border); display:inline-flex; align-items:center; justify-content:center; font-size:11px; color:var(--ink-400)}
.pz-com-item{padding:6px 0; border-bottom:1px solid var(--border)}
.pz-com-item:last-child{border-bottom:none}
.pz-com-form{display:flex; gap:8px; margin-top:10px; align-items:flex-end}
.pz-com-form textarea{flex:1; min-height:44px}
.pz-upload-panel{margin-top:8px; padding:10px; background:var(--surface-2); border-radius:var(--r-sm)}

/* ============================================================================
   OBRA — jornada + galeria (2a.4)
   ========================================================================== */
.jr-steps{display:flex; flex-direction:column; gap:14px}
.jr-step{display:flex; gap:12px; align-items:flex-start}
.jr-dot{width:10px; height:10px; border-radius:50%; background:var(--border-strong); margin-top:4px; flex-shrink:0}
.jr-concluido .jr-dot{background:var(--success)}
.jr-atual .jr-dot{background:var(--brand); box-shadow:0 0 0 3px var(--brand-100)}
.jr-body h4{font-size:13px; margin-bottom:2px}
.jr-meta{font-size:11.5px; color:var(--ink-500)}
.gal-grupo{margin-bottom:20px}
.gal-emp{font-size:13px; font-weight:700; margin-bottom:10px}
.gal-mes{font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-400); margin:12px 0 8px}
.gal-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px}
.gal-item{position:relative; display:block; aspect-ratio:4/3; border-radius:var(--r-sm); overflow:hidden; background:var(--surface-2)}
.gal-item img{width:100%; height:100%; object-fit:cover}
.gal-cat{position:absolute; top:6px; left:6px; font-size:9.5px; font-weight:700; color:#fff; background:rgba(10,15,20,.6); padding:2px 7px; border-radius:var(--r-full); z-index:1}
.gal-video{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; background:var(--shell-800); color:var(--shell-text); font-size:12px; font-weight:600; text-align:center; padding:10px}
.gal-video svg{width:26px; height:26px}

/* ============================================================================
   NOTIFICAÇÕES (sino + painel) (2a.4)
   ========================================================================== */
.notif-badge{
  position:absolute; top:2px; right:2px; min-width:15px; height:15px; background:var(--brand); color:#fff;
  border-radius:999px; font-size:9.5px; font-weight:800; line-height:15px; text-align:center; padding:0 3px;
  border:1.5px solid var(--surface);
}
@keyframes notifPulse{0%{box-shadow:0 0 0 0 rgba(176,24,40,.6)} 70%{box-shadow:0 0 0 8px rgba(176,24,40,0)} 100%{box-shadow:0 0 0 0 rgba(176,24,40,0)}}
.notif-badge.pulse{animation:notifPulse .9s ease-out 3}
.notif-panel{
  position:fixed; z-index:1150; background:var(--surface); border-radius:var(--r-md); box-shadow:var(--shadow-3);
  width:340px; max-width:92vw; max-height:70vh; overflow:hidden; display:flex; flex-direction:column;
  top:66px; right:16px; border:1px solid var(--border);
}
.notif-head{display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--border)}
.notif-link{background:none; border:none; color:var(--brand-600); font-size:11.5px; font-weight:600; cursor:pointer}
.notif-list{overflow-y:auto}
.notif-item{display:flex; gap:10px; padding:12px 16px; border-bottom:1px solid var(--border); cursor:pointer; align-items:flex-start}
.notif-item:hover{background:var(--surface-2)}
.notif-item.nao-lida{background:var(--brand-50)}
.notif-dot{width:8px; height:8px; border-radius:50%; background:var(--brand); flex-shrink:0; margin-top:5px}
.notif-item.lida .notif-dot{background:transparent; border:1px solid var(--border-strong)}
.notif-tit{font-size:13px; font-weight:700; color:var(--ink-900)}
.notif-txt{font-size:12px; color:var(--ink-500); margin-top:2px; line-height:1.4}
.notif-time{font-size:10.5px; color:var(--ink-400); margin-top:3px}
.notif-empty{padding:30px 16px; text-align:center; color:var(--ink-400); font-size:12.5px}

/* ============================================================================
   COMUNICADOS + MINI-JORNADA NO INÍCIO
   ========================================================================== */
.nav-badge{width:7px; height:7px; border-radius:50%; background:var(--brand); margin-left:auto; flex-shrink:0}
.notice-list{display:flex; flex-direction:column; gap:12px}
.notice{display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding-bottom:12px; border-bottom:1px solid var(--border)}
.notice:last-child{border-bottom:none; padding-bottom:0}
.notice-body{flex:1; min-width:0}
.notice-tags{display:flex; gap:6px; margin-bottom:4px}
.notice-body strong{display:block; font-size:13px; color:var(--ink-900); margin-bottom:2px}
.notice-body p{font-size:12.5px; color:var(--ink-600); margin:0; line-height:1.5}
.notice-side{display:flex; flex-direction:column; align-items:flex-end; gap:6px; flex-shrink:0}

/* ============================================================================
   DRAWER "MAIS" (mobile) + MODAL DE PREFERÊNCIAS DE E-MAIL
   ========================================================================== */
.overlay-mais{position:fixed; inset:0; background:rgba(10,15,20,.5); z-index:190; opacity:0; visibility:hidden; transition:opacity var(--t-base) var(--ease), visibility var(--t-base)}
.overlay-mais.open{opacity:1; visibility:visible}
.drawer-mais{
  position:fixed; left:0; right:0; bottom:0; z-index:200; background:var(--surface);
  border-radius:var(--r-lg) var(--r-lg) 0 0; padding:10px 20px 24px; box-shadow:var(--shadow-3);
  transform:translateY(100%); transition:transform var(--t-slow) var(--ease); max-height:80vh; overflow-y:auto;
}
.drawer-mais.open{transform:translateY(0)}
.drawer-handle{width:36px; height:4px; border-radius:var(--r-full); background:var(--border-strong); margin:6px auto 14px}
.drawer-title{font-family:var(--font-display); font-weight:800; font-size:14px; margin-bottom:14px}
.drawer-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px}
.drawer-item{
  display:flex; flex-direction:column; align-items:center; gap:8px; padding:16px 8px; border-radius:var(--r-md);
  border:1px solid var(--border); background:var(--surface); cursor:pointer; font-size:11.5px; font-weight:600; color:var(--ink-700);
}
.drawer-item svg{width:20px; height:20px}
.drawer-item:hover{border-color:var(--border-strong); background:var(--surface-2)}
.drawer-item-danger{color:var(--danger-ink)}

.ep-section-title{font-size:10.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-400); margin:14px 0 4px}
.ep-section-title:first-child{margin-top:0}
.ep-cli-row{display:flex; align-items:center; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--border); font-size:12.5px; cursor:pointer}
.ep-cli-row:last-child{border-bottom:none}
.ep-cli-row input[type=checkbox]{width:16px; height:16px; cursor:pointer; accent-color:var(--brand); flex-shrink:0}

/* ── Mobile compacto (2a.4) ── */
@media (max-width: 860px){
  .emp-layout{grid-template-columns:1fr}
  .notif-panel{width:calc(100vw - 24px); right:12px; left:12px; top:60px}
}

/* ── Mobile compacto (Financeiro) ── */
@media (max-width: 640px){
  .fin-selector{padding:10px 12px; gap:8px}
  .fin-selector .input{max-width:none}
  .irpf-cta{padding:12px 14px}
  .iip-parties{grid-template-columns:1fr}
  .iip-party + .iip-party{border-left:none; border-top:1px solid var(--border)}
  .iip-head{padding:16px 18px}
  .iip-head-logo{width:120px}
  .iip-head-title{text-align:left}
  .iip-totals{padding:14px 18px; gap:8px}
  .irpf-informe > .table-wrap{margin:0 14px 14px}
  .iip-party, .iip-participacao{padding-left:18px; padding-right:18px}
  .iip-legal{padding:12px 18px 16px}
  .irpf-actions .btn{flex:1}
}