/* =====================================================================
   TEMPLO FLUXO DE CAIXA — EDIÇÃO CLARIDADE v6.8.0
   Camada final de refinamento: interface limpa e elegante, tipografia
   estilo iOS (SF Pro), leitura confortável, respiro generoso e
   responsividade polida. Carregada por último — vence todas as camadas.
   ===================================================================== */

/* ------------------------------------------------------------------ */
/* 1. SISTEMA TIPOGRÁFICO — SF Pro / Inter, números tabulares          */
/* ------------------------------------------------------------------ */
:root{
  --c-sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif !important;

  /* paleta serenada — mesmos verdes, menos saturação de efeito */
  --h-bg:#f2f9f5 !important;
  --h-bg-deep:#e9f4ee !important;
  --h-line:#dcebe3 !important;
  --h-line-strong:#c3ddd0 !important;
  --h-text:#122e25 !important;
  --h-text-2:#3d5c4f !important;
  --h-muted:#6b8478 !important;

  /* sombras discretas — profundidade sem peso */
  --h-shadow:0 1px 2px rgba(9,60,44,.05),0 8px 24px rgba(9,60,44,.06) !important;
  --h-shadow-soft:0 1px 2px rgba(9,60,44,.04),0 4px 14px rgba(9,60,44,.05) !important;
  --c-radius:16px;
  --c-radius-sm:11px;
  --c-ease:cubic-bezier(.25,.6,.3,1);
}

html{
  font-size:16px;
  text-rendering:optimizeLegibility;
  background:linear-gradient(165deg,#f4faf7 0%,#fbfdfc 55%,#ecf6f1 100%) fixed !important;
}
body,button,input,select,textarea,table,.tooltip,.toast{
  font-family:var(--c-sans) !important;
}
body{
  font-weight:400 !important;
  letter-spacing:0 !important;
  line-height:1.6 !important;
  color:var(--h-text) !important;
  -webkit-font-smoothing:antialiased;
}

/* títulos e cabeçalhos: sem serifa, peso firme, tracking apertado */
h1,h2,h3,h4,h5,
.title,.login-title,.modal-title,.chart-title,.tfc-chart-title,
.card-header span,.tfc-card-header span,.dept-title,
.tfc-home-copy h1,.section-title,.config-box h3,.config-box h4{
  font-family:var(--c-sans) !important;
  font-weight:700 !important;
  letter-spacing:-.015em !important;
}
h4[style*="Cinzel"],h4[style*="font-family"],p[style*="Cinzel"]{
  font-family:var(--c-sans) !important;
  font-weight:700 !important;
  letter-spacing:-.01em !important;
  text-transform:none !important;
}

/* números — sempre tabulares, grandes e nítidos (estilo iOS) */
.hero-value,.hero-mini-value,.stat-value,.dept-value,.comissao-value,
.reg-resumo-value,.reg-resumo-item strong,.form-resumo-valor,
td.val-bruto,td.val-liquido,td.num,tfoot td,
[id*="Total"],[id*="Valor"],[id*="Saldo"],[id*="Faturamento"]{
  font-family:var(--c-sans) !important;
  font-variant-numeric:tabular-nums lining-nums !important;
  font-feature-settings:"tnum" 1,"lnum" 1 !important;
  letter-spacing:-.02em !important;
}
.stat-value{font-size:1.85rem !important;font-weight:700 !important;line-height:1.15 !important}
.hero-value{font-weight:750 !important}
.dept-value{font-weight:700 !important}

/* rótulos: menores, porém legíveis — tracking moderado, sem gritaria */
.stat-label,.hero-label,.hero-mini-label,.dept-count,.comissao-label,
.reg-resumo-label,.reg-resumo-item span,.form-group label,label{
  font-size:.68rem !important;
  font-weight:600 !important;
  letter-spacing:.07em !important;
  text-transform:uppercase !important;
  color:var(--h-muted) !important;
}
.subtitle{letter-spacing:.14em !important;font-weight:500 !important}
.header .title{font-size:1.22rem !important;font-weight:700 !important;letter-spacing:-.01em !important}

/* botões conversam, não gritam: caixa normal, peso 600 */
.btn,button[class*="btn"],.btn-primary,.btn-secondary,.btn-action,.btn-lote,
.login-btn,.tfc-home-primary,.tfc-home-secondary{
  font-family:var(--c-sans) !important;
  text-transform:none !important;
  letter-spacing:0 !important;
  font-weight:600 !important;
  font-size:.83rem !important;
}
.main-tab,.nav-btn,.nav-btn-saida,.nav-btn-colab,.nav-btn-config{
  font-family:var(--c-sans) !important;
  font-weight:600 !important;
  letter-spacing:.01em !important;
  font-size:.8rem !important;
}

/* corpo de tabela maior e mais respirado */
tbody td,table td{
  font-size:.86rem !important;
  font-weight:480 !important;
  padding-top:.8rem !important;
  padding-bottom:.8rem !important;
  line-height:1.45 !important;
}
thead th,table th{
  font-size:.68rem !important;
  font-weight:700 !important;
  letter-spacing:.06em !important;
}

/* ------------------------------------------------------------------ */
/* 2. FUNDO E SUPERFÍCIES — silêncio visual                            */
/* ------------------------------------------------------------------ */
body::after{
  animation:none !important;
  background:
    radial-gradient(44rem 30rem at 8% 0%,rgba(203,236,220,.35),transparent 62%),
    radial-gradient(40rem 30rem at 100% 100%,rgba(190,229,210,.28),transparent 62%) !important;
}

.card,.tfc-card,.config-box,.chart-box,.section-card,.ranking-card,
.resumo-card,.comissao-card,.tfc-chart-container{
  border:1px solid var(--h-line) !important;
  border-radius:var(--c-radius) !important;
  box-shadow:var(--h-shadow-soft) !important;
  background:#ffffff !important;
}
.card:hover,.tfc-card:hover,.chart-box:hover{
  transform:none !important;
  border-color:var(--h-line-strong) !important;
  box-shadow:var(--h-shadow) !important;
}
.card-header,.tfc-card-header{
  background:#fbfdfc !important;
  padding:1.15rem 1.4rem !important;
}
.card-header::before{width:3px !important;background:#0b7d57 !important;border-radius:0 3px 3px 0}
.card-header::after,.chart-title::after,.tfc-card-header::after,.tfc-chart-title::after{
  background:linear-gradient(90deg,#bfe6d4,transparent) !important;
  height:1px !important;
}

/* cartões de estatística: flutuação mínima, friso fino */
.stat-card,.dept-card,.reg-resumo-item,.comissao-item{
  border-radius:var(--c-radius) !important;
  box-shadow:var(--h-shadow-soft) !important;
  background:#ffffff !important;
}
.stat-card:hover,.dept-card:hover,.reg-resumo-item:hover{
  transform:translateY(-2px) !important;
  box-shadow:var(--h-shadow) !important;
}
.stat-card::before,.dept-card::before{height:2px !important;opacity:.9}
.stat-icon,.dept-icon{box-shadow:none !important}

/* hero mais sereno */
.hero-strip,.tfc-home-hero{
  background:linear-gradient(140deg,#ffffff 0%,#f0f9f4 100%) !important;
  border:1px solid var(--h-line) !important;
  border-left:4px solid #0b7d57 !important;
  border-radius:20px !important;
  box-shadow:var(--h-shadow-soft) !important;
}
.hero-value{
  background:none !important;
  -webkit-text-fill-color:currentColor !important;
  color:#0d4a36 !important;
}
.tfc-home-copy h1 span{
  background:none !important;
  -webkit-text-fill-color:currentColor !important;
  color:#0b7d57 !important;
}

/* ------------------------------------------------------------------ */
/* 3. CABEÇALHO E NAVEGAÇÃO — vidro calmo, sem fio animado             */
/* ------------------------------------------------------------------ */
.header{
  background:rgba(255,255,255,.86) !important;
  backdrop-filter:blur(20px) saturate(150%) !important;
  border-bottom:1px solid var(--h-line) !important;
  box-shadow:0 1px 0 rgba(9,60,44,.03) !important;
}
.header::after{
  animation:none !important;
  height:1px !important;
  background:linear-gradient(90deg,transparent,#bfe6d4,transparent) !important;
  opacity:1 !important;
}
.header .logo{box-shadow:0 2px 8px rgba(9,60,44,.10) !important}
.header .brand-home:hover .logo{transform:scale(1.03) rotate(0deg)}

.main-tabs{background:rgba(251,253,252,.92) !important;backdrop-filter:blur(16px) !important}
.main-tab,.nav-btn,.nav-btn-saida,.nav-btn-colab,.nav-btn-config{
  border-radius:999px !important;
}
.main-tab.active,.nav-btn.active,.nav-btn-saida.active,.nav-btn-colab.active,.nav-btn-config.active{
  background:#0b7d57 !important;
  color:#fff !important;
  box-shadow:0 3px 10px rgba(11,125,87,.22) !important;
  animation:none !important;
  text-shadow:none !important;
}
.main-tab:hover,.nav-btn:hover,.nav-btn-saida:hover,.nav-btn-colab:hover,.nav-btn-config:hover{
  transform:none !important;
}
.nav,.nav-config{background:transparent !important;border-bottom:none !important}

/* ------------------------------------------------------------------ */
/* 4. BOTÕES — sólidos, planos, precisos                               */
/* ------------------------------------------------------------------ */
.btn,.btn-primary,.btn-success,.btn-colab,.btn-luxo-gold,.btn-luxo-purple,.btn-action,.btn-lote,
button[class*="btn"]:not(.header-btn):not(.nav-btn):not(.nav-btn-saida):not(.nav-btn-colab):not(.nav-btn-config):not(.btn-red):not(.btn-secondary):not(.delete):not(.excluir):not(.action-btn){
  background:#0b7d57 !important;
  border:1px solid #0b7d57 !important;
  border-radius:var(--c-radius-sm) !important;
  color:#fff !important;
  text-shadow:none !important;
  box-shadow:0 1px 2px rgba(9,60,44,.12) !important;
  min-height:40px !important;
  transition:background .18s var(--c-ease),transform .15s var(--c-ease),box-shadow .18s var(--c-ease) !important;
}
.btn:hover,.btn-primary:hover,.btn-success:hover,.btn-colab:hover,.btn-luxo-gold:hover,.btn-luxo-purple:hover,.btn-action:hover,.btn-lote:hover,
button[class*="btn"]:not(.header-btn):not(.nav-btn):not(.nav-btn-saida):not(.nav-btn-colab):not(.nav-btn-config):not(.btn-red):not(.btn-secondary):not(.delete):not(.excluir):not(.action-btn):hover{
  background:#096747 !important;
  transform:translateY(-1px) !important;
  box-shadow:0 4px 12px rgba(11,125,87,.24) !important;
}
.btn-secondary:not(#tfcx){
  background:#ffffff !important;
  border:1px solid var(--h-line-strong) !important;
  border-radius:var(--c-radius-sm) !important;
  box-shadow:0 1px 2px rgba(9,60,44,.05) !important;
}
.btn-red,.btn-luxo-red{
  background:#b04234 !important;
  border:1px solid #b04234 !important;
  border-radius:var(--c-radius-sm) !important;
  box-shadow:0 1px 2px rgba(176,66,52,.18) !important;
  text-shadow:none !important;
}
.btn-red:hover,.btn-luxo-red:hover{background:#9c392c !important;filter:none !important}
.logout{
  background:#0b7d57 !important;
  border-radius:var(--c-radius-sm) !important;
  box-shadow:0 1px 2px rgba(9,60,44,.14) !important;
}
.logout:hover{filter:none !important;background:#096747 !important}
.login-btn,.tfc-home-primary{
  background:#0b7d57 !important;
  border-radius:12px !important;
  box-shadow:0 4px 14px rgba(11,125,87,.22) !important;
}
.login-btn:hover,.tfc-home-primary:hover{background:#096747 !important;filter:none !important}

/* pílulas de linha e lote: mantêm forma, ganham calma */
.records-bulk-actions .pagar:not(#tfcx),.record-actions .action-btn.pago:not(#tfcx){
  background:#0b7d57 !important;
  text-shadow:none !important;
}
.records-bulk-actions .btn-action:not(#tfcx),.lote-acoes .btn-lote:not(#tfcx){
  font-size:.74rem !important;
  font-weight:600 !important;
  box-shadow:0 1px 3px rgba(9,60,44,.08) !important;
}
.record-actions .action-btn:not(#tfcx){
  font-size:.72rem !important;
  font-weight:600 !important;
  box-shadow:0 1px 2px rgba(9,60,44,.06) !important;
}

/* toque: sem onda exagerada */
.tfc-ripple,.tfc-onda{opacity:.5}

/* ------------------------------------------------------------------ */
/* 5. FORMULÁRIOS — campos altos, foco sereno                          */
/* ------------------------------------------------------------------ */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea{
  background:#ffffff !important;
  border:1px solid var(--h-line-strong) !important;
  border-radius:var(--c-radius-sm) !important;
  font-size:.9rem !important;
  min-height:42px !important;
}
input:focus,select:focus,textarea:focus{
  border-color:#0b7d57 !important;
  box-shadow:0 0 0 3px rgba(11,125,87,.13) !important;
}
.filters,[class*="filters"],.form-card,.filter-bar{
  background:#ffffff !important;
  border-radius:var(--c-radius) !important;
  box-shadow:var(--h-shadow-soft) !important;
}

/* ------------------------------------------------------------------ */
/* 6. TABELAS — leitura em primeiro lugar                              */
/* ------------------------------------------------------------------ */
.table-wrap,.tfc-table-container,.tfc-preview-table-container{
  border-radius:var(--c-radius) !important;
  border:1px solid var(--h-line) !important;
}
thead,thead tr,thead th,table th,
.table-wrap thead tr,table thead tr{
  background:#f2f9f5 !important;
  color:#28503f !important;
  border-bottom:1px solid var(--h-line-strong) !important;
}
.table-wrap thead th,table thead th{background:#f2f9f5 !important;color:#28503f !important}
tbody tr:nth-child(even) td{background:#fafcfb !important}
tbody tr:hover td{background:#f0f9f4 !important}
tbody td,table td{border-color:#ecf3ef !important}
tfoot td{background:#f2f9f5 !important;font-weight:700 !important;border-top:2px solid var(--h-line-strong) !important}
td.val-bruto,td.val-liquido{font-weight:650 !important}

*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-thumb{background:#c3ddd0;border:2px solid transparent;background-clip:padding-box;border-radius:99px}
*::-webkit-scrollbar-thumb:hover{background:#8fbfa9;background-clip:padding-box}

/* ------------------------------------------------------------------ */
/* 7. INDICADORES, MODAIS E AVISOS                                     */
/* ------------------------------------------------------------------ */
[id*="Barra"],.progress-fill,[class*="progress-fill"]{
  background:#0b7d57 !important;
  box-shadow:none !important;
  border-radius:99px !important;
}
.tfc-motion .tfc-barra::after{display:none !important}

.modal{background:rgba(13,40,31,.35) !important;backdrop-filter:blur(6px) !important}
.modal-content{
  border-radius:20px !important;
  box-shadow:0 24px 60px rgba(9,50,37,.25) !important;
}
.modal-header{background:#fbfdfc !important}
.toast{border-radius:14px !important;box-shadow:0 10px 30px rgba(9,60,44,.14) !important}

/* flash de atualização de valores mais sutil */
@keyframes tfcFlashEsm{
  0%{box-shadow:0 0 0 0 rgba(16,162,110,0)}
  30%{box-shadow:0 0 0 3px rgba(16,162,110,.18)}
  100%{box-shadow:0 0 0 0 rgba(16,162,110,0)}
}

/* ------------------------------------------------------------------ */
/* 8. LOGIN — cartão limpo sobre fundo quieto                          */
/* ------------------------------------------------------------------ */
.login-container{
  background:linear-gradient(160deg,#f4faf7 0%,#fbfdfc 55%,#e9f4ee 100%) !important;
}
.login-box{
  border-radius:22px !important;
  box-shadow:0 18px 50px rgba(9,60,44,.12) !important;
  animation:none !important;
}
.login-box::before{
  animation:none !important;
  height:3px !important;
  background:linear-gradient(90deg,#0b7d57,#57b98d) !important;
}
.login-title{font-size:1.55rem !important}
.version-tag{font-weight:600 !important;letter-spacing:.03em !important}

/* ------------------------------------------------------------------ */
/* 9. RESPONSIVIDADE POLIDA                                            */
/* ------------------------------------------------------------------ */
.content{padding:clamp(1rem,2.6vw,2.5rem) !important}
.header{padding:clamp(.7rem,1.5vw,1.25rem) clamp(.9rem,2.4vw,2.5rem) !important}

@media (max-width:780px){
  html{font-size:15.5px}
  /* inputs a 16px evitam o zoom automático do iOS */
  input:not([type="checkbox"]):not([type="radio"]),select,textarea{font-size:16px !important;min-height:44px !important}
  .btn,button[class*="btn"]{min-height:44px !important}
  .main-tabs,.nav,.nav-config{
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .main-tabs::-webkit-scrollbar,.nav::-webkit-scrollbar,.nav-config::-webkit-scrollbar{display:none !important}
  .stat-value{font-size:1.55rem !important}
  .stats-grid,.dept-stats{gap:10px !important}
  .card-header,.tfc-card-header{padding:1rem 1.1rem !important}
  tbody td,table td{padding-top:.7rem !important;padding-bottom:.7rem !important}
}
@media (max-width:560px){
  .stat-card,.dept-card{text-align:left !important;padding:14px 16px !important;min-height:96px !important}
  .stat-value{font-size:1.5rem !important}
  .hero-strip{border-radius:16px !important}
  .modal-content{border-radius:16px !important;max-width:calc(100vw - 20px) !important}
  .toast{left:10px !important;right:10px !important;max-width:none !important}
}
@media (min-width:1720px){
  .content{max-width:1760px !important}
}

/* ------------------------------------------------------------------ */
/* 10. RESPEITO AO USUÁRIO                                             */
/* ------------------------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition-duration:.01ms !important}
}
@media print{
  body::after,.header::after{display:none !important}
  .card,.tfc-card,.chart-box{box-shadow:none !important}
}

/* ------------------------------------------------------------------ */
/* 11. VITÓRIAS DE ESPECIFICIDADE — vence camadas antigas              */
/* ------------------------------------------------------------------ */

/* Valor do hero: escala fluida, nunca gigante demais */
.hero-value:not(#tfcx){
  font-size:clamp(1.9rem,3.6vw,2.9rem) !important;
  line-height:1.1 !important;
  overflow-wrap:anywhere !important;
}

/* Cabeçalho dos cartões: respiro interno de verdade */
.card>.card-header:not(#tfcx),.tfc-card>.tfc-card-header:not(#tfcx){
  padding:1.05rem 1.35rem !important;
  background:#fbfdfc !important;
  border-bottom:1px solid var(--h-line) !important;
}
.card>.card-header>.tfc-section-title-wrap:not(#tfcx),
.tfc-card>.tfc-card-header>.tfc-section-title-wrap:not(#tfcx){
  font-family:var(--c-sans) !important;
  font-size:.95rem !important;
  font-weight:700 !important;
  letter-spacing:-.005em !important;
}

/* Abas e navegação: pílulas limpas, sem verniz nem relevo */
.main-tab:not(#tfcx),.nav button:not(#tfcx),.nav-config button:not(#tfcx),
.nav-btn:not(#tfcx),.nav-btn-saida:not(#tfcx),.nav-btn-colab:not(#tfcx),.nav-btn-config:not(#tfcx){
  background:#ffffff !important;
  border:1px solid var(--h-line-strong) !important;
  border-radius:999px !important;
  box-shadow:0 1px 2px rgba(9,60,44,.05) !important;
  color:var(--h-text-2) !important;
  font-family:var(--c-sans) !important;
  font-size:.78rem !important;
  font-weight:600 !important;
  letter-spacing:.01em !important;
  text-transform:none !important;
  text-shadow:none !important;
}
.main-tab:not(#tfcx):hover,.nav button:not(#tfcx):hover,.nav-config button:not(#tfcx):hover{
  filter:none !important;
  transform:none !important;
  background:#f0f9f4 !important;
  border-color:#a9d4bf !important;
  box-shadow:0 1px 2px rgba(9,60,44,.05) !important;
  color:#0b6a4b !important;
}
.main-tab.active:not(#tfcx),.nav button.active:not(#tfcx),.nav-config button.active:not(#tfcx),
.nav-btn.active:not(#tfcx),.nav-btn-saida.active:not(#tfcx),.nav-btn-colab.active:not(#tfcx),.nav-btn-config.active:not(#tfcx){
  color:#fff !important;
  background:#0b7d57 !important;
  border-color:#0b7d57 !important;
  box-shadow:0 3px 10px rgba(11,125,87,.22) !important;
  text-shadow:none !important;
  animation:none !important;
}
.nav:not(#tfcx),.nav-config:not(#tfcx){
  background:rgba(251,253,252,.9) !important;
  border-bottom:1px solid var(--h-line) !important;
  box-shadow:none !important;
  backdrop-filter:blur(14px) !important;
}
.main-tabs:not(#tfcx){box-shadow:none !important;border-bottom:1px solid var(--h-line) !important}

/* Botões vermelhos: vermelho sólido de verdade (a camada antiga
   pintava de verde por especificidade) */
.btn-red:not(#tfcx),.btn-luxo-red:not(#tfcx),.btn-danger:not(#tfcx),.tfc-btn-danger:not(#tfcx),
button[class*="btn"].delete:not(#tfcx),button[class*="btn"].excluir:not(#tfcx){
  color:#fff !important;
  background:#b04234 !important;
  border:1px solid #b04234 !important;
  border-radius:var(--c-radius-sm) !important;
  box-shadow:0 1px 2px rgba(176,66,52,.18) !important;
  text-shadow:none !important;
}
.btn-red:not(#tfcx):hover,.btn-luxo-red:not(#tfcx):hover,.btn-danger:not(#tfcx):hover,
button[class*="btn"].delete:not(#tfcx):hover,button[class*="btn"].excluir:not(#tfcx):hover{
  background:#9c392c !important;
  border-color:#9c392c !important;
  filter:none !important;
}

/* Botões principais: planos e sólidos mesmo contra o gradiente embutido */
button.btn:not(#tfcx):not(.btn-red):not(.btn-secondary):not(.delete):not(.excluir),
a.btn:not(#tfcx):not(.btn-red):not(.btn-secondary){
  background:#0b7d57 !important;
  border:1px solid #0b7d57 !important;
  color:#fff !important;
  text-shadow:none !important;
}
button.btn:not(#tfcx):not(.btn-red):not(.btn-secondary):not(.delete):not(.excluir):hover{
  background:#096747 !important;
}

/* Rodapé responsivo das pílulas em telas pequenas */
@media (max-width:560px){
  .main-tab:not(#tfcx){font-size:.66rem !important}
  .hero-value:not(#tfcx){font-size:clamp(1.7rem,8.5vw,2.2rem) !important}
}