:root{
  --bg:rgb(32, 33, 36);
  --panel:rgba(41, 41, 41, 0.8);
  --panel2:rgba(41, 41, 41, 0.8);
  --border:rgba(255,255,255,.10);
  --text:#e5e7eb;
  --muted:#9ca3af;
  --accent:#3b82f6;
  --accent2:#60a5fa;
  --ok:#41b86d;
  --err:#ec6969;
  --warn:#f59e0b;
  --violet:#a855f7;
  --shadow:0 10px 30px rgba(0,0,0,.45);
  --radius:14px;
  --topbar-h:60px; 
}

:root[data-theme="light"]{
  --bg:#0000000f;
  --panel:#ffffff;
  --panel2:#f1f5f9;
  --border:rgba(15,23,42,.12);
  --text:#0f172a;
  --muted:#475569;
  --accent:#2563eb;
  --accent2:#3b82f6;
  --ok:#41b86d;
  --err:#ec6969;
  --warn:#d97706;
  --violet:#7c3aed;
  --shadow:0 10px 30px rgba(2,6,23,.12);
  --radius:14px;

  --topbar-h:60px;
}


*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:"Roboto", system-ui, -apple-system, "Segoe UI", Arial; font-weight:300; background:var(--bg);color:var(--text)}
a{color:inherit}
button, input, select, textarea{font:inherit}
b,strong{font-weight:500}
h1,h2,h3,h4{font-weight:500}

/* Layout */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:var(--panel2);border-bottom:1px solid var(--border)}
.tb-brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:300}
.dot{width:10px;height:10px;border-radius:999px;background:var(--accent)}
.tb-left{display:flex;align-items:center;gap:10px}
.tb-right{display:flex;align-items:center;gap:12px}
.tb-user{display:flex;align-items:center;gap:10px;border-left:1px solid var(--border);padding-left:12px}
.tb-user-name{font-size:13px;color:var(--muted)}
/* Topbar refinements */
.tb-title{font-size:26px;letter-spacing:-0.01em;}
.tb-ico{width:42px;height:42px;padding:0;justify-content:center}
.btn-quickadd{height:42px}
.btn-quickadd .btn-plus{font-size:18px;line-height:1;font-weight:800}
.btn-quickadd .btn-label{font-weight:650}

/* Mobile: compactar topbar */
@media (max-width: 640px){
  .tb-title{font-size:18px}
  .btn-quickadd{padding:9px 10px}
  .btn-quickadd .btn-label{display:none}
}


/* Mobile menu button (hidden on desktop) */
.tb-menu{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;border:1px solid var(--border);background:rgba(255,255,255,.03);color:var(--text);cursor:pointer}
.tb-menu:hover{background:rgba(255,255,255,.06)}

.wrap{display:grid;grid-template-columns:var(--side-w,260px) 1fr;min-height:calc(100vh - var(--topbar-h, 54px));align-items:stretch}
/* Desktop: recolher sidebar (ícones apenas) */
@media (min-width: 981px){
  body.side-collapsed .wrap{grid-template-columns:var(--side-w-collapsed,76px) 1fr}
  body.side-collapsed .sidebar{width:var(--side-w-collapsed,76px)}
  body.side-collapsed .nav{padding:12px}
  body.side-collapsed .nav-item{justify-content:flex-start;gap:10px;padding:10px 12px;min-height:40px;overflow:hidden}
  body.side-collapsed .nav-label{display:inline-block;opacity:0;max-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;transition:none}
  body.side-collapsed .side-foot{display:none}
  /* Hover-to-expand quando recolhido (desktop) */
  body.side-collapsed .sidebar{overflow:hidden}
  body.side-collapsed .sidebar:hover,
  body.side-collapsed .sidebar:focus-within{
    width:var(--side-w,260px);
    position:fixed;
    top:var(--topbar-h, 54px);
    left:0;
    height:calc(100vh - var(--topbar-h, 54px));
    z-index:80;
    background:var(--panel2) !important;
    box-shadow:0 14px 26px rgba(0,0,0,.28);
    overflow:auto;
  }
  body.side-collapsed .sidebar:hover .nav-label,
  body.side-collapsed .sidebar:focus-within .nav-label{opacity:1;max-width:220px;pointer-events:auto}
  body.side-collapsed .sidebar:hover .side-foot,
  body.side-collapsed .sidebar:focus-within .side-foot{display:block}
}

.sidebar{border-right:1px solid var(--border);background:var(--panel2);transition:width .22s ease;will-change:width;display:flex;flex-direction:column;height:100%;min-height:calc(100vh - var(--topbar-h, 54px))}

.side-title{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 14px 10px;
  font-weight:800;
  font-size:15px;
  letter-spacing:-0.01em;
}
.side-title-text{opacity:.98}
.nav{flex:1;min-height:0;overflow:auto}
.nav{display:flex;flex-direction:column;padding:12px}
.nav-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;text-decoration:none;color:var(--text);opacity:.92}
.nav-item:hover{background:rgba(255,255,255,.04)}
.nav-item.active{background:rgba(59,130,246,.16);border:1px solid rgba(59,130,246,.25)}
.nav-ico{width:18px;height:18px;border-radius:6px;background:rgba(255,255,255,.08)}
.side-foot{padding:10px 14px;border-top:1px solid var(--border)}

.content{padding:16px;max-width:1400px;min-width:0;width:100%}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
h1{margin:0;font-size:22px}

/* UI */
.muted{color:var(--muted)}
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;font-size:12px;border:1px solid var(--border);background:rgba(255,255,255,.03)}
.badge-ok{border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.10)}
.badge-err{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.10)}
.badge-warn{border-color:rgba(245,158,11,.35);background:rgba(245,158,11,.12)}

.btn{appearance:none;border:1px solid var(--border);background:rgba(255,255,255,.03);color:var(--text);padding:9px 12px;border-radius:12px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px;font-weight:500}
.btn:hover{background:rgba(255,255,255,.06)}
.btn:active{transform:translateY(1px)}
.btn-primary{border-color:rgba(59,130,246,.45);background:rgba(59,130,246,.18)}
.btn-primary:hover{transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease; }
.btn-danger{border-color:rgba(239,68,68,.45);background:rgba(239,68,68,.16)}
.btn-danger:hover{background:rgba(239,68,68,.22)}
.btn-xs{padding:6px 9px;border-radius:10px;font-size:12px}

.input,.select{width:100%;padding:9px 10px;border-radius:12px;border:1px solid var(--border);background:rgba(0,0,0,.20);color:var(--text);outline:none}
.input:focus,.select:focus{border-color:rgba(59,130,246,.5);box-shadow:0 0 0 3px rgba(59,130,246,.15)}
.label-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.label-row .label{margin:0}
.label{display:block;font-size:12px;color:var(--muted);margin:0 0 6px 2px}

.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.fgrp{min-width:80px}

.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:10px 0 14px}
.kpis .card.kpi-rev .card-val{color:var(--ok)}
.kpis .card.kpi-exp .card-val{color:var(--err)}
.kpis .card.kpi-profit.pos .card-val{color:var(--ok)}
.kpis .card.kpi-profit.neg .card-val{color:var(--err)}
.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:12px;box-shadow:var(--shadow)}
.card-label{color:var(--muted);font-size:12px}
.card-val{font-size:22px;font-weight:700;margin-top:6px}
.card-sub{color:var(--muted);font-size:12px;margin-top:2px}

.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:12px;box-shadow:var(--shadow);min-width:0}
.panel-title{font-weight:700;margin-bottom:10px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}

/*Tamanho campos party type e party name */
#rjf_party_type{min-width:200px;}
.qa-party-name{min-width:200px !important;margin-top:10px;}

/* Filtros acima da tabela (Lançamentos) */
.filters.filters-table{margin:2px 0 10px;align-items:flex-end}
.filters.filters-table .icon-btn{height:38px;width:38px;justify-content:center;border-radius:12px}

/* Lançamentos: filtros v2 (data + busca + modo + mais filtros) */
.tx-filters{align-items:center}
.tx-filters-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;width:100%}
.tx-date-group{position:relative;display:inline-flex;align-items:center;gap:6px}
.tx-date-group .tx-date-arrow{height:38px;width:32px;justify-content:center;border-radius:12px}
.tx-date-btn{display:inline-flex;align-items:center;gap:8px}
.tx-date-pop{min-width:280px}
.menu-sep{height:1px;background:var(--border);margin:6px 8px;border-radius:1px}
.tx-date-custom{padding:8px 8px 4px}
.tx-date-custom .rjf-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tx-date-custom-actions{display:flex;justify-content:flex-end;margin-top:8px}
.tx-view-toggle{display:inline-flex;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--panel2)}
.tx-view-toggle .seg-btn{border:0;background:transparent;color:var(--muted);padding:9px 12px;font-weight:600;font-size:13px;cursor:pointer}
.tx-view-toggle .seg-btn:hover{background:rgba(255,255,255,.06);color:var(--text)}
.tx-view-toggle .seg-btn.is-active{background:rgba(59,130,246,.20);color:var(--text)}
:root[data-theme="light"] .tx-view-toggle{background:rgba(15,23,42,.03)}
:root[data-theme="light"] .tx-view-toggle .seg-btn.is-active{background:rgba(59,130,246,.12)}
.tx-search{min-width:180px;max-width:320px;flex:0 1 260px}
.tx-more{position:relative}
.tx-more-pop{left:auto;right:0;min-width:560px;max-width:92vw;z-index:120}
.tx-more-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:10px}
.tx-more-actions{display:flex;justify-content:flex-end;gap:8px;padding:0 10px 10px}
.tx-more-pop .fgrp{min-width:0}
/* Desktop: "Mais filtros" em colunas por grupo (Status/Tipo/Centro/Conta) */
@media (min-width: 980px){
  /*
    IMPORTANTE: não usar min-width alto aqui, senão em telas menores (ex.: 1000px)
    o dropdown pode "escapar" para fora do viewport.
    Mantemos largura ampla, porém sempre limitada ao viewport.
  */
  .tx-more-pop{
    min-width:0;
    width:min(1240px, calc(100vw - 24px));
    max-width:calc(100vw - 24px);
    /* Alinha ao viewport mesmo quando o conteúdo está centralizado com margens laterais */
    right:calc(12px - (100vw - 100%) / 2);
    left:auto;
  }
  .tx-more-grid{grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; padding:12px;}
}
/* Mobile: empilha os grupos */
@media (max-width: 820px){
  .tx-more-pop{min-width:0;width:92vw;}
  .tx-more-grid{grid-template-columns:1fr;}
}

.tx-more-pop .select,.tx-more-pop .input{min-width:0;max-width:100%}

/* Lançamentos (mobile): layout organizado dos filtros (sem afetar desktop) */
@media (max-width: 820px){
  /* 1ª linha: Data centralizada + Exportar no topo direito */
  .tx-filters-row{
    display:grid;
    grid-template-columns: 1fr auto 1fr;
    grid-auto-rows:auto;
    column-gap:10px;
    row-gap:10px;
    align-items:center;
    justify-items:stretch;
    width:100%;
  }

  .tx-date-group{grid-column:2; justify-self:center;margin-top:15px;}
  .tx-export{grid-column:3; justify-self:end; margin-left:0;}

  /* 2ª linha: Busca + Filtrar centralizados */
  .tx-search{
    grid-column:1 / -1;
    justify-self:center;
    width:100%;
    max-width:360px;
    margin-top:15px;
  }

  /* 3ª linha: Mais filtros centralizado */
  .tx-more{
    grid-column:1 / -1;
    justify-self:center;
    margin-top:10px;
  }

  /* Dropdown "Mais filtros" centralizado no viewport */
  .tx-more-pop{
    position:fixed;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%);
    top:170px;
    width:min(560px, calc(100vw - 24px));
    max-width:calc(100vw - 24px);
    min-width:0;
    z-index:300;
  }
}

@media (max-width: 900px){
  .tx-more-grid{grid-template-columns:1fr}
  .tx-more-pop{min-width:320px}
}

.kpis a.card{text-decoration:none;color:inherit;display:block}
.kpis a.card:hover{border-color:rgba(59,130,246,.55)}
.kpis .card.is-active{position:relative;border-color:rgba(59,130,246,1);box-shadow:0 0 0 3px rgba(59,130,246,.18), var(--shadow)}
.kpis .card.is-active:after{content:"";position:absolute;inset:-4px;border:2px solid rgba(59,130,246,.90);border-radius:calc(var(--radius) + 4px);pointer-events:none}

/* KPI ativo: borda acompanha o modo (DRE = azul, Fluxo de caixa = verde) */
.kpi-tabs.mode-cashflow .card.is-active{
  border-color: rgba(16,185,129,1) !important;
  box-shadow: 0 0 0 3px rgba(16,185,129,.18), var(--shadow) !important;
}
.kpi-tabs.mode-cashflow .card.is-active:after{
  border-color: rgba(16,185,129,.90) !important;
}

.rjf-view-val{white-space:pre-line;line-height:1.35}

.tx-more-pop .select,.tx-more-pop .input{min-width:0;max-width:100%}

/* Mobile: move pra direita o dropdown */
@media (min-width: 980px){
    .menu-pop{min-width:200px !important;}
    .menu-pop.tx-date-pop{left:50px !important}
}

/* Ação em massa (dropdown) */
.bulkbar{display:flex;align-items:center;justify-content:flex-start;margin:6px 0 10px}
.bulkbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bulk-actions{position:relative;display:inline-flex;align-items:center}
.menu-pop{position:absolute;top:calc(100% + 6px);min-width:400px;background:var(--panel2);border:1px solid var(--border);border-radius:12px;box-shadow:0 14px 30px rgba(0,0,0,.35);padding:6px;display:none;z-index:50}
.menu-pop.open{display:block}
.menu-item{width:100%;text-align:left;background:transparent;border:0;color:var(--text);padding:10px 10px;border-radius:10px;cursor:pointer;font-weight:500;font-size:13px}
.menu-item:hover{background:rgba(255,255,255,.06)}
.menu-item.danger{color:var(--err)}

.table-wrap{overflow:auto;border-radius:14px;border:none;min-width:0;max-width:100%}
.table{width:100%;border-collapse:separate;border-spacing:0;background:none;}
.table th,.table td{padding:10px 10px;border-bottom:1px solid var(--border);text-align:center;white-space:nowrap}

/* ===================== Table column resize (arrastar) ===================== */
.table.is-resizable th{ position:relative; }
.rjf-col-resizer{
  position:absolute;
  top:0;
  right:-5px;
  width:10px;
  height:100%;
  cursor:col-resize;
  touch-action:none;
  z-index:2;
}
.rjf-col-resizer::after{
  content:'';
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:2px;
  height:18px;
  border-radius:2px;
  background:var(--border2);
  opacity:.55;
}
.table.is-resizable th:hover .rjf-col-resizer::after{ opacity:.95; }

.table th{position:sticky;top:0;background:rgba(41,41,41,.92);z-index:1;font-size:12px;color:var(--muted)}
:root[data-theme="light"] .table th{background:#f1f5f9}

.table tr:hover td{background:rgba(255,255,255,.03)}


/* ===== Lançamentos v3: colunas + ícones + sort ===== */
.td-left{text-align:left}
.td-ellipsis{max-width:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.td-money{text-align:right}
.td-money.is-neg{color:var(--err)}
.src-label{display:inline-block;color:var(--muted);font-size:12px}

.th-sort a{color:var(--muted);text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.th-sort.is-sorted a{color:var(--text)}
.sort-arrow{font-size:11px;opacity:.85;min-width:10px;text-align:center}

.ico{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle}
.ico.type,.ico.status,.ico.recur,.ico.pay{border-radius:10px;border:1px solid var(--border);background:var(--panel2)}
:root[data-theme="light"] .ico.type,
:root[data-theme="light"] .ico.status,
:root[data-theme="light"] .ico.recur,
:root[data-theme="light"] .ico.pay{background:rgba(15,23,42,.03)}

.ico.type,.ico.status,.ico.recur{width:22px;height:22px}
.ico.pay{width:22px;height:22px}
.ico svg{width:18px;height:18px;display:block}
.icon-btn svg{width:18px;height:18px;display:block}

.type-expense{color:var(--err)}
.type-revenue{color:var(--ok)}
.type-transfer{color:var(--warn)}
.type-reserve{color:var(--violet)}
.type-profit{color:var(--accent)}
.type-loan{color:var(--warn)}

.status.st-open{color:var(--muted)}
.status.st-closed{color:var(--ok)}
.recur{color:var(--accent)}

.pay-icos{display:inline-flex;gap:6px;justify-content:center;align-items:center;flex-wrap:wrap}

/* Mobile: listagem em cards (estilo Salão99) */
#txCards{display:none}

@media (max-width: 900px){
    .stat-text{display:none}
    
  #txTableWrap{display:none}
  #txCards{display:block;border:none;overflow:hidden;background:rgba(255,255,255,.0)}
  :root[data-theme="light"] #txCards{background:#fff}

  .tx-card{padding:12px 8px;border-bottom:1px solid var(--border);position:relative}
  .tx-card:last-child{border-bottom:0}
  .tx-card-empty{padding:16px}

  .tx-card-top{display:flex;align-items:flex-start;gap:10px}
  .tx-card-check{flex:0 0 auto;margin-top:2px}
  .tx-card-check input{width:16px;height:16px}
  .tx-card-dates{flex:1 1 auto;min-width:0}
  .tx-card-line{font-size:12.5px;line-height:1.3;color:var(--text)}
  .tx-card-line .muted{font-size:12px}
  .tx-card-status{flex:0 0 auto;margin-left:auto}

  .tx-card-body{display:flex;align-items:flex-start;gap:12px;margin-top:6px}
  .tx-card-main{flex:1 1 auto;min-width:0}
  .tx-card-desc{font-weight:700;font-size:14.5px;line-height:1.25;margin:2px 0 3px}
  .tx-card-sub{font-size:12.5px;color:var(--muted);line-height:1.35}
  .tx-card-meta{font-size:12.5px;color:var(--muted);line-height:1.35}

  .tx-card-amount{flex:0 0 auto;text-align:right;white-space:nowrap}
  .tx-card-value{font-weight:700;font-size:18px;letter-spacing:-0.02em}
  .tx-card-value.is-neg{color:var(--err)}
  .tx-card-inst{font-size:12px;color:var(--muted);margin-top:2px}

  .tx-card-bottom{display:flex;justify-content:flex-end;margin-top:8px}
  .tx-card-icons{display:flex;align-items:center;gap:10px}
  .tx-card-icons .pay-icos{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
}


.tr-rec td{background:transparent!important}
.actions{display:flex;justify-content:center;gap:6px}

.pager{display:flex;align-items:center;justify-content:space-between;margin-top:10px}
.pager-btns{display:flex;gap:8px}

.pager-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pager-controls .select{width:auto;min-width:96px;padding:6px 10px;border-radius:10px;font-size:12px}
@media (max-width: 700px){.pager{flex-direction:column;align-items:flex-start;gap:10px}.pager-btns{align-self:flex-end}}

.alert{border:1px solid var(--border);border-radius:14px;padding:10px 12px;margin:0 0 12px;background:rgba(255,255,255,.03)}
.alert-ok{border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.08)}
.alert-err{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.08)}

/* Auth */
.auth-bg{display:flex;align-items:center;justify-content:center;padding:18px;background:var(--bg)}
.auth-wrap{width:100%;max-width:520px}
.auth-card{background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:16px;box-shadow:var(--shadow)}
.auth-brand{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.auth-title{font-weight:700;font-size:18px}
.auth-sub{color:var(--muted);font-size:12px;margin-top:2px}
.form{display:flex;flex-direction:column;gap:10px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.col2{grid-column:1/-1}
.section-title{font-weight:700;margin-top:6px}
.auth-foot{margin-top:12px;color:var(--muted);font-size:12px}

/* Modal */

/* === Modal (Lançamentos): títulos como placeholder + placeholder em cinza === */
#rjfModalBackdrop .label,
#rjfEditBack .label{display:none !important;}

/* Exceção: alguns campos precisam de rótulo visível (ex.: datas) */
#rjfModalBackdrop .label.force-show,
#rjfEditBack .label.force-show{display:block !important;}

#rjfModalBackdrop input::placeholder,
#rjfModalBackdrop textarea::placeholder,
#rjfEditBack input::placeholder,
#rjfEditBack textarea::placeholder{
  color: var(--muted);
  opacity: .85;
}

/* Select com placeholder (primeira option vazia) */
#rjfModalBackdrop select.select option[value=""],
#rjfEditBack select.select option[value=""]{
  color: var(--muted);
}
#rjfModalBackdrop select.select:required:invalid,
#rjfEditBack select.select:required:invalid{
  color: var(--muted);
}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;padding:14px;}
.modal{width:100%;padding: 0px 10px 0px 10px;background:var(--panel);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);overflow:hidden}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--border)}
.modal-title{font-weight:700}
.modal-body{padding:14px}
.modal-foot{display:flex;gap:10px;justify-content:flex-end;padding:12px 14px;border-top:1px solid var(--border)}
/* View/Audit modais: limitar largura no desktop (evita "layout zoado" em telas grandes) */
@media (min-width: 980px){
  #rjfViewBack .modal{max-width:920px;}
  #rjfAuditBack .modal{max-width:980px;}
}
#rjfViewBack .modal, #rjfAuditBack .modal{
  max-height:calc(100dvh - 28px);
  overflow:auto;
}


/* Modal (mobile): travar scroll do fundo e evitar arrasto horizontal */
body.modal-open{overflow:hidden;width:100%;overscroll-behavior:none;}
/* body.modal-open touch-action removido: permite scroll dentro dos modais */
/* body.modal-open{touch-action:none;} */
#rjfModalBackdrop,#rjfEditBack,#rjfInlineCreateBack,#rjfMvBack{overscroll-behavior:contain;}
/* MV (Cadastros -> Movimentações) — fullscreen overlay (all entities) */
#rjfMvBack{
  position: fixed !important;
  inset: 0 !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  padding: 0 !important;
  margin: 0 !important;
  background: var(--bg) !important; /* solid, no "seems embedded" */
  z-index: 10050 !important;
}
#rjfMvBack > .modal{
  width: 100% !important;
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: var(--panel) !important;
}
#rjfMvBack .modal-body{min-height: 0;
  flex:1; overflow:auto; -webkit-overflow-scrolling:touch;
}

#rjfModalScroll,#rjfMvScroll,#rjfEditBack .rjf-mb,.rjf-inline-create-modal .modal-body{overflow-x:hidden;touch-action:pan-y;}

/* Inline create (cadastros rápidos dentro do modal) */
#rjfInlineCreateBack{z-index:10050;}
#rjfInlineCreateBack.rjf-inline-create-back{display:none;align-items:center;justify-content:center;padding:14px;}
#rjfInlineCreateBack .rjf-inline-create-modal{width:min(560px,100%);max-height:calc(100vh - 28px);display:flex;flex-direction:column;}
#rjfInlineCreateBack .rjf-inline-create-modal .modal-body{flex:1;min-height:0;overflow:auto;}

/* Bot o fechar do modal (topo direito) */
.modal-x{
  width:40px;
  height:40px;
  padding:0;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.modal-x svg{width:18px;height:18px;display:block}


/* Fullscreen: modal de "Incluir lançamento" (Quick Add) */
#rjfModalBackdrop.modal-backdrop{padding:0;
  align-items:stretch;
  justify-content:stretch;position:fixed;inset:0;z-index:9999;}
#rjfModalBackdrop .modal{
  /* iOS/Android: 100vw pode criar overflow horizontal (scroll lateral). */
  width:100%;
  max-width:100%;
  height:100vh;
  height:100dvh;
  height:calc(var(--rjf-vh, 1vh) * 100);
  max-height:none;
  border-radius:0;
  box-shadow:none;
  padding:0;
  border:0;
}
#rjfModalBackdrop .modal-head{position:sticky;top:0;z-index:2;
  padding-left:calc(14px + env(safe-area-inset-left));
  padding-right:calc(14px + env(safe-area-inset-right));
  padding-top:calc(12px + env(safe-area-inset-top));
}
#rjfModalBackdrop .modal-foot{
  padding-left:calc(14px + env(safe-area-inset-left));
  padding-right:calc(14px + env(safe-area-inset-right));
  padding-bottom:calc(12px + env(safe-area-inset-bottom) + 8px);
}


/* Fullscreen: modal de EDIÇÃO (igual ao Quick Add) */
#rjfEditBack.modal-backdrop{padding:0;
  align-items:stretch;
  justify-content:stretch;position:fixed;inset:0;z-index:9999;}
#rjfEditBack .modal{
  /* iOS/Android: 100vw pode criar overflow horizontal (scroll lateral). */
  width:100%;
  max-width:100%;
  height:100vh;
  height:100dvh;
  height:calc(var(--rjf-vh, 1vh) * 100);
  max-height:none;
  border-radius:0;
  box-shadow:none;
  padding:0;
  border:0;
}
#rjfEditBack .modal-head{position:sticky;top:0;z-index:2;
  padding-left:calc(14px + env(safe-area-inset-left));
  padding-right:calc(14px + env(safe-area-inset-right));
  padding-top:calc(12px + env(safe-area-inset-top));
}
#rjfEditBack .modal-foot{
  padding-left:calc(14px + env(safe-area-inset-left));
  padding-right:calc(14px + env(safe-area-inset-right));
  padding-bottom:calc(12px + env(safe-area-inset-bottom) + 8px);
}

/* Hotfix mobile: evitar scroll horizontal (principalmente em inputs type=date) */
#rjfModalBackdrop,
#rjfEditBack{ overflow-x:hidden; }

#rjfModalBackdrop input[type="date"],
#rjfEditBack input[type="date"]{
  max-width:100%;
  width:100%;
  min-width:0;
}

#rjfModalBackdrop .modal-foot,
#rjfEditBack .modal-foot{ flex-shrink:0; }

/* Fullscreen: modal de "Movimentações" (Cadastros) */
#rjfMvBack.modal-backdrop{
  padding:0;
  align-items:stretch;
  justify-content:stretch;
  position:fixed !important;
  left:0; right:0; bottom:0;
  top: var(--rjf-topbar-h, 56px) !important;
  height:auto;
  z-index:3000;
  background: rgba(0,0,0,.35);
}
#rjfMvBack .modal{
  width:100%;
  display:flex;
  flex-direction:column;
  min-height:0;
  height:100%;
  max-height:none;
  border-radius:0;
  box-shadow:none;
  padding:0;
  border:0;
}
#rjfMvBack .modal-head{position:sticky;top:0;z-index:2;
  padding-left:calc(14px + env(safe-area-inset-left));
  padding-right:calc(14px + env(safe-area-inset-right));
  padding-top:calc(12px + env(safe-area-inset-top));
}
#rjfMvBack .modal-body{
  padding-left:calc(14px + env(safe-area-inset-left));
  padding-right:calc(14px + env(safe-area-inset-right));
  padding-bottom:calc(12px + env(safe-area-inset-bottom));
}

/* Segmented toggle (Receita/Despesa) */
.seg{display:inline-flex;border:1px solid var(--border);background:rgba(255,255,255,.03);border-radius:14px;padding:4px;gap:4px}
.seg button{border:0;background:transparent;color:var(--text);padding:8px 12px;border-radius:12px;font-weight:700;cursor:pointer}
.seg button.active{background:rgba(59,130,246,.18);border:1px solid rgba(59,130,246,.35)}
.help{color:var(--muted);font-size:12px;margin-top:6px}

@media (max-width: 980px){
  .wrap{grid-template-columns:1fr}
  /* Drawer sidebar */
  .tb-menu{display:inline-flex}
  .sidebar{display:block;position:fixed;top:var(--topbar-h, 54px);left:0;width:260px;height:calc(100vh - var(--topbar-h, 54px));z-index:40;transform:translateX(-105%);transition:transform .18s ease;background:var(--panel2)}
  .sidebar.open{transform:translateX(0)}
  .kpis{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
}

/* Rateio (Categoria -> Centro de custo) */
.split-wrap{border:1px solid var(--border);border-radius:16px;background:var(--panel2)}
.split-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;border-bottom:1px solid var(--border)}
.split-body{padding:12px 14px;display:flex;flex-direction:column;gap:12px}
.split-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 14px;border-top:1px solid var(--border)}
.split-cat{border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:10px;background:rgba(0,0,0,.10)}
.split-row{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:end}
.split-row-unit{grid-template-columns:2fr 1fr 1fr auto}
.split-col{min-width:0}
.split-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.split-sub{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding-top:8px;border-top:1px dashed rgba(255,255,255,.10)}
.split-units{margin-top:10px;display:flex;flex-direction:column;gap:10px}
.split-unit{border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:10px;background:var(--panel2)}
/* Rateio: campo de % com sufixo visível */
.rjf-pct-wrap{position:relative;}
.rjf-pct-wrap .input{padding-right:28px;}
.rjf-pct-suf{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  color:var(--muted);
  font-weight:700;
  font-size:12px;
  pointer-events:none;
  opacity:.9;
}



/* ===================== Calculadora de provisão (Funcionário) ===================== */
.qa-prov-wrap{margin-top:10px}
.qa-prov-panel{padding:12px}
.qa-prov-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:10px}
.qa-prov-total{
  width:100%;
  padding:9px 10px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(0,0,0,.14);
  color:var(--text);
  font-weight:800;
  letter-spacing:-0.01em;
  display:flex;
  align-items:center;
  min-height:40px;
}
:root[data-theme="light"] .qa-prov-total{background:rgba(15,23,42,.03)}
.qa-prov-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.qa-prov-col{border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.02);padding:10px}
:root[data-theme="light"] .qa-prov-col{background:rgba(15,23,42,.02)}
.qa-prov-h{font-weight:800;margin-bottom:8px}
.qa-prov-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px dashed rgba(255,255,255,.10);font-size:13px}
:root[data-theme="light"] .qa-prov-row{border-bottom-color: rgba(15,23,42,.10)}
.qa-prov-row:last-child{border-bottom:0}
.qa-prov-row.total{padding-top:8px;margin-top:2px;border-top:1px solid var(--border);border-bottom:0;font-weight:800}
.qa-prov-row span{color:var(--muted)}
.qa-prov-row.total span{color:var(--text)}
@media (max-width: 980px){
  .qa-prov-top{grid-template-columns:1fr}
  .qa-prov-grid{grid-template-columns:1fr}
}

/* Utility */
.td-left{text-align:left !important}

@media (max-width: 980px){
  .split-row{grid-template-columns:1fr;}
  .split-actions{justify-content:flex-start}
}

.audit-table td{vertical-align:top}

/* ===================== Toast (popup) ===================== */
.rjf-toast-host{
  position:fixed;
  right:16px;
  bottom:16px;
  z-index:9999;
  display:flex;
  flex-direction:column;
  gap:10px;
  max-width:min(420px, calc(100vw - 32px));
  pointer-events:none;
}
.rjf-toast{
  pointer-events:auto;
  background:var(--panel);
  color:var(--text);
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  border-radius:12px;
  padding:12px 14px;
  font-size:13px;
  line-height:1.35;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .18s ease, transform .18s ease;
}
.rjf-toast.on{
  opacity:1;
  transform:translateY(0);
}
.rjf-toast.is-warn{ border-color: rgba(245,158,11,.35); }
.rjf-toast.is-err{ border-color: rgba(239,68,68,.45); }

@media (max-width: 640px){
  .rjf-toast-host{
    left:12px;
    right:12px;
    bottom:12px;
    max-width:none;
  }
  .rjf-toast{ width:100%; }
}

/* ===================== Auditoria (detalhes mais legíveis) ===================== */
.audit-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:3px 8px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  border:1px solid var(--border);
  background:transparent;
}
:root[data-theme="light"] .audit-badge{ background:transparent; }

.audit-action{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0;
  border:0;
  background:transparent;
  font-size:13px;
  font-weight:600;
}
.audit-action .audit-ico{
  width:16px;
  height:16px;
  opacity:.92;
  flex:0 0 auto;
}
.audit-action-label{ line-height:1.2; }

.audit-ok{ border-color: rgba(34,197,94,.35); color: rgba(34,197,94,.95); }
.audit-info{ border-color: rgba(59,130,246,.35); color: rgba(59,130,246,.95); }
.audit-danger{ border-color: rgba(239,68,68,.40); color: rgba(239,68,68,.95); }
.audit-muted{ opacity:1; color: var(--muted); }

.audit-kv{ display:flex; flex-direction:none; gap:6px; }
.audit-kv-row{ display:flex; gap:8px; flex-wrap:wrap; align-items:baseline; }
.audit-k{ min-width:110px; font-size:12px; color:var(--muted); }
.audit-v{ font-size:12px; }
.audit-raw{ margin-top:6px; }
.audit-raw summary{ cursor:pointer; font-size:12px; color:var(--muted); }
.audit-raw pre{
  margin:6px 0 0 0;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--border2);
  background:rgba(0,0,0,.08);
  font-size:12px;
  white-space:pre-wrap;
  word-break:break-word;
}
:root[data-theme="light"] .audit-raw pre{ background:rgba(15,23,42,.03); }

/* Corrige dropdown nativo (select/options) no tema escuro (Windows/Chrome) */
:root{ color-scheme: light; }
:root[data-theme="dark"]{ color-scheme: dark; }

select.select option,
select.select optgroup{
  background: var(--panel2);
  color: var(--text);
}

:root[data-theme="light"] select.select option,
:root[data-theme="light"] select.select optgroup{
  background: #fff;
  color: var(--text);
}

/* ===================== Cadastros (padronização) ===================== */
/* layout 40/60 (cadastro/lista) apenas onde aplicarmos .cad-grid */
@media (min-width: 981px){
  .grid2.cad-grid{ grid-template-columns: 30% 70%; }
}

/* toolbar de lista: abas + busca + ações */
.cad-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin: 8px 0 10px;
}
.cad-toolbar .tabs{ margin:0; border-bottom:0; }
.cad-search{ flex:1; min-width:220px; }
.cad-search .input{ width:100%; }

/* status pill (neutro) – aplicado somente em .cad-grid */
.cad-grid .pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 9px;
  border-radius:999px;
  font-size:12px;
  border:0;
  background: rgba(255,255,255,.03);
  line-height:1;
  font-weight:500;
  white-space:nowrap;
}
:root[data-theme="light"] .cad-grid .pill{ background: rgba(15,23,42,.03); }
.cad-grid .pill.is-active{ color: var(--text); }
.cad-grid .pill.is-inactive{ color: var(--muted); }


/* indicador de subcategoria (bolinha) */
.cad-grid .cat-branch{
  display:inline-block;
  width:14px;
  text-align:center;
  color: var(--muted);
  margin-right:4px;
}

/* grid auxiliar para formulários */
.cad-grid .row{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:10px;
  align-items:end;
}

/* ===== KPIs: modo DRE vs Caixa (mais visível, sem gradiente) ===== */

/* Base: garante contraste no claro/escuro */
.kpi-tabs.mode-dre a.card,
.kpi-tabs.mode-dre .card{
  background-color: rgba(59,130,246,.22) !important; /* mais forte */
  border: 1px solid rgba(59,130,246,.45) !important;
  box-shadow: 0 0 0 1px rgba(59,130,246,.20), 0 8px 24px rgba(59,130,246,.10) !important;
}

.kpi-tabs.mode-cashflow a.card,
.kpi-tabs.mode-cashflow .card{
  background-color: rgba(16,185,129,.16) !important; /* mais forte */
  border: 1px solid rgba(16,185,129,.45) !important;
  box-shadow: 0 0 0 1px rgba(16,185,129,.18), 0 8px 24px rgba(16,185,129,.10) !important;
}

/* Dark: sobe um pouco o alpha pra aparecer bem no fundo escuro */
html[data-theme="dark"] .kpi-tabs.mode-dre a.card,
html[data-theme="dark"] .kpi-tabs.mode-dre .card{
  background-color: rgba(59,130,246,.18) !important;
  border-color: rgba(59,130,246,.50) !important;
  box-shadow: 0 0 0 1px rgba(59,130,246,.22), 0 10px 28px rgba(59,130,246,.14) !important;
}

html[data-theme="dark"] .kpi-tabs.mode-cashflow a.card,
html[data-theme="dark"] .kpi-tabs.mode-cashflow .card{
  background-color: rgba(16,185,129,.16) !important;
  border-color: rgba(16,185,129,.50) !important;
  box-shadow: 0 0 0 1px rgba(16,185,129,.22), 0 10px 28px rgba(16,185,129,.14) !important;
}




/* Card do seletor DRE/Caixa logo abaixo dos KPIs */
.panel.panel-viewmode{padding:10px 12px}
.panel.panel-viewmode .segmented{display:inline-flex;gap:8px;align-items:center}
.panel.panel-viewmode .seg-btn{min-height:36px;padding:8px 12px;border-radius:10px;font-weight:650}

/* ===== Botões DRE / Fluxo (mesma paleta dos KPIs) ===== */

.panel-viewmode .tx-view-toggle{
  display:flex;
  gap:8px;
  padding:4px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}

.panel-viewmode .tx-view-toggle .seg-btn{
  border:1px solid rgba(255,255,255,.10);
  background: transparent;
  color: var(--text);
  padding: 8px 12px;
  border-radius:10px;
  font-weight:600;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .05s ease;
}

.panel-viewmode .tx-view-toggle .seg-btn:hover{
  background: rgba(255,255,255,.05);
}

.panel-viewmode .tx-view-toggle .seg-btn:active{
  transform: translateY(1px);
}

/* Ativo = mesma cor do modo */
.panel-viewmode .tx-view-toggle .seg-btn.is-active[data-view="dre"]{
  background-color: var(--kpi-dre-bg) !important;
  border-color: var(--kpi-dre-bd) !important;
  box-shadow: 0 0 0 1px rgba(59,130,246,.18), 0 10px 24px rgba(59,130,246,.12) !important;
  font-weight:800;
}

.panel-viewmode .tx-view-toggle .seg-btn.is-active[data-view="cashflow"]{
  background-color: var(--kpi-cx-bg) !important;
  border-color: var(--kpi-cx-bd) !important;
  box-shadow: 0 0 0 1px rgba(16,185,129,.18), 0 10px 24px rgba(16,185,129,.12) !important;
  font-weight:800;
}


/* ===== Card + botões DRE/Caixa com fundo (mesma paleta dos KPIs) ===== */

/* Fundo do CARD "Visualização" conforme o modo (puxa do estado atual dos KPIs) */
.kpi-tabs.mode-dre + .panel.panel-viewmode{
  background-color: rgba(59,130,246,.18) !important;
  border-color: rgba(59,130,246,.22) !important;
}

.kpi-tabs.mode-cashflow + .panel.panel-viewmode{
  background-color: rgba(16,185,129,.16) !important;
  border-color: rgba(16,185,129,.22) !important;
}

/* Toggle container (sempre com fundo leve, não branco) */
.panel-viewmode .tx-view-toggle{
  background-color: rgba(0,0,0,.06) !important; /* tema claro */
  border: 1px solid rgba(0,0,0,.10) !important;
  border-radius: 12px;
  padding: 4px;
}

/* No dark, ajusta pra não ficar “lavado” */
html[data-theme="dark"] .panel-viewmode .tx-view-toggle{
  background-color: rgba(59,130,246,.18) !important;
  border-color: rgba(255,255,255,.10) !important;
}

/* Botões */
.panel-viewmode .tx-view-toggle .seg-btn{
  background: transparent !important;
  border: 1px solid transparent !important;
  padding: 8px 12px;
  border-radius: 10px;
  font-weight: 650;
}

/* Ativo = fundo igual o modo (bem visível) */
.panel-viewmode .tx-view-toggle .seg-btn.is-active[data-view="dre"]{
  background-color: rgba(59,130,246,.22) !important;
  border-color: rgba(59,130,246,.45) !important;
  box-shadow: 0 0 0 1px rgba(59,130,246,.18), 0 10px 24px rgba(59,130,246,.12) !important;
  font-weight: 800;
}

.panel-viewmode .tx-view-toggle .seg-btn.is-active[data-view="cashflow"]{
  background-color: rgba(16,185,129,.20) !important;
  border-color: rgba(16,185,129,.45) !important;
  box-shadow: 0 0 0 1px rgba(16,185,129,.18), 0 10px 24px rgba(16,185,129,.12) !important;
  font-weight: 800;
}

/* Hover discreto */
.panel-viewmode .tx-view-toggle .seg-btn:hover{
  background-color: rgba(0,0,0,.05) !important;
}
html[data-theme="dark"] .panel-viewmode .tx-view-toggle .seg-btn:hover{
  background-color: rgba(255,255,255,.06) !important;
}




html.modal-open, body.modal-open{overflow:hidden !important;}

/* === MOVED FROM layout.php <style> (keep identical front-end) === */
:root{
      --font: "Roboto", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
      --radius: 12px;
      --radius-sm: 8px;
      --shadow: 0 10px 30px rgba(0,0,0,.20);
      --shadow-soft: 0 6px 18px rgba(0,0,0,.16);

      /* light (default) */
      --bg: #ffffff;
      --panel: #ffffff;
      --panel2: #f6f7fb;
      --text: #0f172a;
      --muted: rgba(15,23,42,.62);
      --border: rgba(15,23,42,.12);
      --border2: rgba(15,23,42,.08);
      --hover: rgba(15,23,42,.06);

      --accent: #2563eb;
      --accent2: rgba(37,99,235,.12);
      --danger: #ef4444;
      --danger2: rgba(239,68,68,.12);
      --warn: #f59e0b;

      --topbar-h: 56px;
      --side-w: 260px;
      --side-w-collapsed: 76px;

      --chart-text: var(--text);
      --chart-grid: var(--border2);
    }

    html[data-theme="dark"]{
      color-scheme: dark;
      /* Paleta neutra (tons de cinza/ preto) — estilo ChatGPT */
      --bg: #000000;
      --panel: #1a1a1a;
      --panel2: #141414;
      --text: #EDEDED;
      --muted: rgba(237,237,237,.62);
      --border: rgba(255,255,255,.10);
      --border2: rgba(255,255,255,.06);
      --hover: rgba(255,255,255,.06);

      --accent: #3b82f6;
      --accent2: rgba(59,130,246,.16);
      --danger: #ef4444;
      --danger2: rgba(239,68,68,.16);

      --chart-text: var(--text);
      --chart-grid: var(--border2);
    }

    html[data-theme="light"]{ color-scheme: light; }

    body{
      font-family: var(--font) !important;
      
   /*   font-weight: 300 !important;*/
background: var(--bg) !important;
      color: var(--text) !important;
    }

    /* Topbar */
    
    /* Topbar fixa (não depende de sticky/scroll container) */
.topbar{
  height: var(--topbar-h);
  background: var(--panel) !important;
  border-bottom: 1px solid var(--border) !important;

  position: fixed;
  top: 0;
  left: 0;
  right: 0;

  z-index: 9999;
  backdrop-filter: saturate(1.2);
}
/* Compensa a topbar fixa */
.wrap{
  padding-top: var(--topbar-h);
}

    .tb-brand{ color: var(--text) !important; font-weight: 300; letter-spacing: .2px; }
    .tb-menu{
      width: 38px; height: 38px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text);
      cursor: pointer;
    }
    .tb-menu:hover{ background: var(--hover); }
    .tb-right{ gap: 10px !important; }



  /* Sidebar */
.wrap{ background: transparent !important; }
.sidebar{
  background: transparent !important;
  border-right: 1px solid var(--border) !important;
}

.side-title{
  display:flex; align-items:center; gap:10px;
  margin: 10px 12px 6px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border2);
  background: rgba(255,255,255,.02);
  font-weight: 750;
  letter-spacing: .2px;

  /* ✅ centraliza o conteúdo */
  justify-content: center;
  text-align: center;
}

.side-title .dot{ width:9px; height:9px; }
.side-title-mini{ display:none; font-weight: 800; letter-spacing:.3px; line-height: 1; }

.side-title-text{
  display:inline-block;
  max-width: 180px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  transition: opacity .18s ease, max-width .18s ease;
  line-height: 1;
}

/* ✅ RECOLHIDO: tira o GAP e some com o texto de verdade */
body.side-collapsed .side-title{
  margin: 10px 8px 6px;
  justify-content:center;
  gap: 0;                 /* <<< chave */
}

body.side-collapsed .side-title-mini{ display:inline-block; }

/* no recolhido, o texto não pode existir no layout (senão sobra gap/offset) */
body.side-collapsed .side-title-text{
  display:none;           /* <<< chave */
  opacity:0;
  max-width:0;
  pointer-events:none;
}

/* ✅ HOVER no recolhido: volta o texto e volta o gap */
body.side-collapsed .sidebar:hover .side-title{
  justify-content:center;
  gap: 10px;              /* <<< volta o gap */
}

body.side-collapsed .sidebar:hover .side-title-mini{ display:none; }

body.side-collapsed .sidebar:hover .side-title-text{
  display:inline-block;   /* <<< volta a existir */
  opacity:1;
  max-width:180px;
  pointer-events:auto;
}

.nav-item{
  display:flex; align-items:center; gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  color: var(--text) !important;
  transition: background .12s ease, border-color .12s ease;
}
.nav-ico{ width: 18px; height: 18px; display:inline-flex; align-items:center; justify-content:center; opacity: .85; }
.nav-ico svg{ width: 18px; height: 18px; }
.nav-label{ line-height: 1.1; }
.nav-item:hover{ background: var(--hover); }
.nav-item.active{
  background: var(--accent2) !important;
  border: 1px solid transparent;
}
.side-foot{ border-top: 1px solid var(--border2) !important; }

/* Sidebar: fixa na tela ao rolar (desktop) */
@media (min-width: 981px){
  .wrap{
    display: flex;
    align-items: stretch;
  }

  .sidebar{
    position: sticky;
    top: var(--topbar-h);
    height: calc(100vh - var(--topbar-h));
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  /* opcional: deixa o scroll mais “limpo” */
  .sidebar::-webkit-scrollbar{ width: 8px; }
  .sidebar::-webkit-scrollbar-thumb{
    background: rgba(255,255,255,.10);
    border-radius: 999px;
  }
  html[data-theme="light"] .sidebar::-webkit-scrollbar-thumb{
    background: rgba(15,23,42,.14);
  }
}

/* Mobile sidebar backdrop */
.side-backdrop{
  position: fixed; inset: 0;
  background: rgba(0,0,0,.35);
  display: none;
  z-index: 35;
}
html[data-theme="light"] .side-backdrop{ background: rgba(15,23,42,.12); }
body.side-open .side-backdrop{ display:block; }

@media (max-width: 980px){
  .sidebar{
    background: var(--panel) !important;
    border-right: 1px solid var(--border) !important;
    box-shadow: var(--shadow-soft);
  }
}

    /* Content */
    .content{ width: 100%; max-width: none; margin: 0; padding: 18px 18px 28px; }
    @media (min-width: 980px){
      .content{ padding-right: 18px; }
    }
    @media (max-width: 980px){
         .content{padding: 18px 10px;}
}
    /* Panels / cards */
    .panel, .card, .modal, .rjf-modal{
      background: var(--panel) !important;
      border: 1px solid var(--border) !important;
      border-radius: var(--radius) !important;
      box-shadow: none !important;
    }
    .panel-title{ color: var(--text) !important; font-weight: 650; }
    .muted, .help{ color: var(--muted) !important; }
    
        @media (max-width: 980px){
         .panel{border:none !important;padding: 12px;}
}
    

    /* Inputs */
    .input, .select, select.input, select.select, input.input, textarea.input{
      background: transparent !important;
      border: 2px solid var(--border) !important;
      color: var(--text) !important;
      border-radius: 10px !important;
      outline: none;
    }
    .input:focus, .select:focus, select:focus, input:focus, textarea:focus{
      border-color: rgba(37,99,235,.45) !important;
      box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important;
    }
    html[data-theme="dark"] .input:focus,
    html[data-theme="dark"] .select:focus,
    html[data-theme="dark"] select:focus,
    html[data-theme="dark"] input:focus,
    html[data-theme="dark"] textarea:focus{
      border-color: rgba(59,130,246,.55) !important;
      box-shadow: 0 0 0 3px rgba(59,130,246,.18) !important;
    }
    
     @media (max-width: 700px){
    .input, .select, select.input, select.select, input.input, textarea.input{
    margin-top:10px !important;
         }
     }

    /* Buttons (minimal) */
    .btn{
      background: transparent !important;
      border: 1px solid transparent !important;
      color: var(--text) !important;
      border-radius: 10px !important;
      padding: 9px 12px !important;
    }
    .btn:hover{ background: var(--hover) !important; }
    .btn.btn-xs{ padding: 6px 10px !important; border-radius: 10px !important; }
    .btn-primary{
      background: var(--accent) !important;
      color: #fff !important;
      border-color: rgba(0,0,0,.02) !important;
    }
    .btn-primary:hover{ filter: brightness(1.02); }

    /* Quick Add (Topbar) */
    #btnQuickAdd{ transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease; }
    #btnQuickAdd:hover{
      background: rgba(37,99,235,.16) !important;
      border-color: rgba(37,99,235,.38) !important;
    }
    html[data-theme="dark"] #btnQuickAdd:hover{
      background: rgba(96,165,250,.14) !important;
      border-color: rgba(96,165,250,.34) !important;
    }
    #btnQuickAdd .btn-plus{ font-size: 18px; line-height: 1; margin-right: 6px; }
    #btnQuickAdd .btn-label{ display: inline-block; }
    @media (max-width: 700px){
      #btnQuickAdd{ min-width: 42px; padding: 9px 12px; justify-content: center; }
      #btnQuickAdd .btn-label{ display: none; }
      #btnQuickAdd .btn-plus{ margin-right: 0; }
    }
    .btn-danger{
      background: var(--danger2) !important;
      color: var(--danger) !important;
    }
    .btn-danger:hover{ filter: brightness(1.02); }

    /* Icon buttons (ex: export, theme) */
    .icon-btn, .tb-ico{
      width: 46px; height: 46px;
      display: inline-flex; align-items:center; justify-content:center;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text);
      cursor: pointer;
      text-decoration: none;
      user-select: none;
    }
    .icon-btn:hover, .tb-ico:hover{ background: var(--hover); }
    .icon-btn svg, .tb-ico svg{ width: 18px; height: 18px; }

    /* Tabs (underline, estilo Salão99/GA) */
    .tabs{
      position: relative;
      display:flex; gap: 18px; flex-wrap: wrap;
      background: transparent;
      border: 0;
      border-bottom: 1px solid var(--border);
      border-radius: 0;
      padding: 0;
      overflow: visible;
    }
    .tabs .tab{
      position: relative;
      background: transparent;
      cursor: pointer;
      font: inherit;
      appearance: none;
      display:inline-flex;
      align-items:center;
      padding: 14px 2px;
      text-decoration:none;
      color: var(--muted);
      border: 0;
      border-radius: 0;
      font-weight: 650;
      text-transform: uppercase;
      letter-spacing: .08em;
      font-size: 12px;
      white-space: nowrap;
    }
    .tabs .tab:hover{ color: var(--text); }
    .tabs .tab.on{ color: var(--accent); }

    .tabs .tab.is-dim{ opacity: .70; }
    .tabs .tab.is-dim:hover{ opacity: .85; }
    .tabs .tab:disabled{ opacity: .45; cursor: not-allowed; }

    .rjf-tab-indicator{
      position: absolute;
      left: 0;
      bottom: -1px;
      height: 3px;
      width: 0;
      background: var(--accent);
      border-radius: 3px 3px 0 0;
      transform: translateX(0);
      transition: transform .22s ease, width .22s ease;
    }

    .subtabs{
      display:flex; gap: 6px; align-items:center;
      background: transparent;
    }
    .subtab{
      padding: 6px 10px;
      border-radius: 10px;
      text-decoration:none;
      color: var(--muted);
      border: 1px solid transparent;
      font-weight: 600;
    }
    .subtab:hover{ background: var(--hover); color: var(--text); }
    .subtab.on{ background: var(--panel2); border-color: var(--border2); color: var(--text); }

    
    /* Tabs: variante com scroll horizontal + setas (mobile) */
    .tabs-scrollwrap{ position: relative; display:flex; align-items:center; gap:8px; }
    .tabs.tabs-scroll{
      flex-wrap: nowrap;
      overflow-x: auto;
      overflow-y: hidden;
      scroll-behavior: smooth;
      -webkit-overflow-scrolling: touch;
      padding-right: 2px;
    }
    .tabs.tabs-scroll::-webkit-scrollbar{ height: 0; }
    .tabs-scrollwrap .tabs-arrow{
      display:none;
      flex:0 0 auto;
      height:38px;
      width:38px;
      justify-content:center;
      border-radius:12px;
    }
    @media (max-width: 820px){
      .tabs-scrollwrap .tabs-arrow{ display:inline-flex; }
      /* evita quebrar em 2 linhas no mobile */
      .tabs.tabs-scroll{ border-bottom: 1px solid var(--border); }
      .tabs.tabs-scroll .tab{ padding: 12px 2px; }
    }

    /* Cadastros: esconder coluna "Ações" (usamos action sheet ao clicar na linha) */
    .table.cad-hide-actions th:last-child,
    .table.cad-hide-actions td:last-child{ display:none; }

    /* Tables: row-click */
    .table-wrap{ border: none; border-radius: var(--radius) !important; overflow:auto; }
    .table thead th{
      background: transparent !important;
      border-bottom: 1px solid var(--border) !important;
      color: var(--muted) !important;
      font-weight: 650 !important;
    }
    .table tbody tr[data-row-actions]{ cursor: pointer; }
    .table tbody tr:hover{ background: var(--hover) !important; }

    /* Dropdown menus (se houver) */
    .dropdown, .menu, .dd, .popover{
      background: var(--panel) !important;
      color: var(--text) !important;
      border: 1px solid var(--border) !important;
    }

    /* Action sheet */
    .rjf-sheet-backdrop{
      position: fixed; inset: 0;
      background: rgba(0,0,0,.45);
      display: none;
      z-index: 10000;
    }
    html[data-theme="light"] .rjf-sheet-backdrop{ background: rgba(15,23,42,.14); }

    .rjf-sheet{
      position: fixed;
      left: 50%;
      top: 50%;
      transform: translate(-50%,-50%);
      width: min(420px, calc(100vw - 24px));
      background: var(--panel);
      border: 1px solid var(--border);
      border-radius: 14px;
      box-shadow: var(--shadow-soft);
      display: none;
      z-index: 10001;
      overflow: hidden;
    }
    @media (max-width: 980px){
      .rjf-sheet{
        top: auto;
        bottom: 0;
        transform: translateX(-50%);
        width: 100%;
        border-radius: 16px 16px 0 0;
      }
      .rjf-sheet-backdrop{ background: rgba(0,0,0,.55); }
      html[data-theme="light"] .rjf-sheet-backdrop{ background: rgba(15,23,42,.18); }
    }
    .rjf-sheet-head{
      display:flex; align-items:center; justify-content:space-between;
      gap: 10px;
      padding: 12px 14px;
      border-bottom: 1px solid var(--border2);
      background: var(--panel);
    }
    .rjf-sheet-title{
      display:flex;
      flex-direction:column;
      gap: 2px;
      min-width: 0;
    }
    .rjf-sheet-title-main{
      font-weight: 700;
      color: var(--text);
      line-height: 1.15;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .rjf-sheet-title-sub{
      font-size: 12px;
      color: var(--muted);
      font-weight: 400;
      line-height: 1.15;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      opacity: .95;
    }
    .rjf-sheet-body{ padding: 6px 0; }
    .rjf-sheet-item{
      width: 100%;
      display:flex; align-items:flex-start; justify-content:space-between;
      gap: 10px;
      padding: 10px 14px;
      border: 0;
      background: transparent;
      color: var(--text);
      font: inherit;
      text-align: left;
      cursor: pointer;
    }
    .rjf-sheet-item:hover{ background: var(--hover); }
    .rjf-sheet-item .hint{
      display:none;
      font-size: 12px;
      color: var(--muted);
      margin-top: 2px;
      font-weight: 500;
    }
    .rjf-sheet-item.danger{ color: var(--danger); }
    .rjf-sheet-item.danger .hint{ color: rgba(239,68,68,.75); }
  

    /* Filtros (dropdown como texto + setinha, sem borda/fundo) */
    .filters .label{
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: .08em;
      color: var(--muted) !important;
      margin-bottom: 6px;
    }
    .filters select.select,
    .filters input.input{
      background: transparent !important;
      border: 0 !important;
      border-bottom: 1px solid var(--border) !important;
      border-radius: 0 !important;
      padding: 6px 2px !important;
      height: 34px;
    }
    .filters select.select:focus,
    .filters input.input:focus{
      box-shadow: none !important;
      border-bottom-color: var(--accent) !important;
    }

    /* Checkbox um pouco maior */
    input[type="checkbox"]{
      width: 18px;
      height: 18px;
      accent-color: var(--accent);
    }

    /* Resizer de colunas (arrastar borda do cabeçalho) */
    #txTable{ table-layout: fixed; }
    #txTable th, #txTable td{ overflow:hidden; text-overflow: ellipsis; white-space: nowrap;font-size:14px;font-weight:400; }
    .rjf-col-resizer{
      position:absolute;
      top:0;
      right:-4px;
      width: 8px;
      height: 100%;
      cursor: col-resize;
      user-select:none;
      touch-action: none;
    }
    .rjf-col-resizer::after{
      content:'';
      position:absolute;
      top: 25%;
      bottom: 25%;
      left: 3px;
      width: 1px;
      background: var(--border);
      opacity: .55;
    }
    .table thead th:hover .rjf-col-resizer::after{ opacity: .9; }

    body.col-resizing{ cursor: col-resize; user-select: none; }

    /* select option legível (especialmente no tema escuro) */
    html[data-theme="dark"] select option{ background: #0F1115; color: #EDEDED; }


/* === MV (Cadastros -> Movimentações) Hotfix: quando MV aberto, esconder o grid do cadastros para não "espremir" o overlay === */
body.modal-open .grid2.cad-grid{display:none !important;}
/* Garantir overlay do MV sempre fullscreen e acima de tudo (evita estilos inline riscando por !important concorrente) */
#rjfMvBack.modal-backdrop{
  position: fixed !important;
  inset: 0 !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  padding: 0 !important;
  margin: 0 !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  background: var(--bg) !important;
  z-index: 10060 !important;
}
#rjfMvBack.modal-backdrop > .modal{
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}
#rjfMvBack.modal-backdrop .modal-body{
  flex: 1 !important;
  min-height: 0 !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}


/* ===================== Modal Ver Lançamento (layout tipo comprovante) ===================== */
#rjfViewBack .rjf-mb{padding:14px;}
#rjfViewBack .rjf-receipt{
  max-width:760px;
  margin:0 auto;
  border:1px dashed var(--border);
  border-radius:16px;
  background:rgba(255,255,255,.01);
  padding:14px;
}
:root[data-theme="light"] #rjfViewBack .rjf-receipt{background:#fff;}

.rjf-receipt-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-bottom:10px;
  border-bottom:1px dashed var(--border);
}
.rjf-receipt-title{font-weight:850;letter-spacing:-0.01em;}
.rjf-receipt-sub{margin-top:2px;font-size:12px;color:var(--muted);line-height:1.25;}
.rjf-receipt-badges{display:flex;flex-direction:column;gap:6px;align-items:flex-end;}
.rjf-receipt-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  font-size:12px;
  font-weight:750;
}
.rjf-receipt-badge.ok{border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.10);color:var(--text);}
.rjf-receipt-badge.warn{border-color:rgba(245,158,11,.35);background:rgba(245,158,11,.12);color:var(--text);}
.rjf-receipt-badge.err{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.10);color:var(--text);}

.rjf-receipt-amount{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  padding:12px 0 10px;
}
.rjf-receipt-amount .lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;}
.rjf-receipt-amount .val{font-size:26px;font-weight:900;letter-spacing:-0.02em;}
.rjf-receipt-amount .val.is-neg{color:var(--err);}

.rjf-receipt-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 14px;
  padding-top:10px;
  border-top:1px dashed var(--border);
}
@media (max-width: 700px){
  .rjf-receipt-grid{grid-template-columns:1fr;}
  .rjf-receipt-badges{align-items:flex-start;}
}

.rjf-receipt-row{
  padding:10px 10px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:14px;
  background:rgba(0,0,0,.10);
}
:root[data-theme="light"] .rjf-receipt-row{background:rgba(15,23,42,.02);border-color:rgba(15,23,42,.10);}

.rjf-receipt-row .k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px;}
.rjf-receipt-row .v{white-space:pre-line;line-height:1.35;font-size:13px;}

.rjf-receipt-row.is-wide{grid-column:1/-1;}


/* ===================== View modal (comprovante) ===================== */
#rjfViewBack .rjf-mb{padding:14px;}
#rjfViewBack .rjf-modal{max-width:min(780px, 100%);}

@media (max-width: 640px){
  /* Mobile: modal "Ver" mais próximo das laterais */
  #rjfViewBack.modal-backdrop{padding:6px;}
  #rjfViewBack .modal{padding:0 6px;}
  #rjfViewBack .rjf-mb{padding:10px;}
}


.rjf-receipt{
  border:1px solid var(--border);
  border-radius:16px;
  background:rgba(255,255,255,.02);
  padding:14px;
}
:root[data-theme="light"] .rjf-receipt{background:rgba(15,23,42,.02);}

.rjf-receipt-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-bottom:10px;
  border-bottom:1px dashed rgba(255,255,255,.12);
}
:root[data-theme="light"] .rjf-receipt-head{border-bottom-color: rgba(15,23,42,.12);}

.rjf-receipt-title{font-weight:800; font-size:14px; letter-spacing:.02em;}
.rjf-receipt-sub{font-size:12px; color:var(--muted); margin-top:2px;}

.rjf-receipt-amount{
  text-align:right;
  font-weight:900;
  font-size:22px;
  letter-spacing:-0.02em;
  white-space:nowrap;
}
.rjf-receipt-amount.is-neg{color:var(--err);}

.rjf-receipt-badges{display:flex; gap:6px; justify-content:flex-end; flex-wrap:wrap; margin-top:6px;}
.rjf-receipt-pill{
  display:inline-flex; align-items:center; justify-content:center;
  padding:3px 8px; border-radius:999px;
  font-size:12px; font-weight:750;
  border:1px solid var(--border);
  background:transparent;
}
.rjf-receipt-pill.ok{border-color: rgba(34,197,94,.35); color: rgba(34,197,94,.95);}
.rjf-receipt-pill.warn{border-color: rgba(245,158,11,.35); color: rgba(245,158,11,.95);}
.rjf-receipt-pill.info{border-color: rgba(59,130,246,.35); color: rgba(59,130,246,.95);}
.rjf-receipt-pill.muted{color: var(--muted);}

.rjf-receipt-kv{margin-top:12px;}
.rjf-receipt-row{
  display:flex;
  gap:12px;
  justify-content:space-between;
  align-items:flex-start;
  padding:8px 2px;
  border-bottom:1px dashed rgba(255,255,255,.10);
}
:root[data-theme="light"] .rjf-receipt-row{border-bottom-color: rgba(15,23,42,.10);}
.rjf-receipt-row:last-child{border-bottom:0;}
.rjf-receipt-k{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  min-width:160px;
}
.rjf-receipt-v{
  font-size:13px;
  text-align:right;
  white-space:pre-line;
  line-height:1.35;
  max-width:520px;
}
.rjf-receipt-section{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--border);
}
.rjf-receipt-section-title{
  font-weight:850;
  letter-spacing:.02em;
  margin:0 0 8px 0;
  font-size:12px;
  color:var(--muted);
  text-transform:uppercase;
}

@media (max-width: 640px){
  .rjf-receipt-head{flex-direction:column; align-items:flex-start;}
  .rjf-receipt-amount{width:100%; text-align:left;}
  .rjf-receipt-badges{justify-content:flex-start;}
  .rjf-receipt-row{flex-direction:column; gap:6px;}
  .rjf-receipt-v{text-align:left; max-width:none;}
  .rjf-receipt-k{min-width:0;}
}


/* Quick Add: rateio com fundo igual ao modal de edição (sem painel mais claro) */
.qa-split-wrap{background:rgb(139 139 139 / 5%);}


/* Diff status (rateio/pagamentos) */
.rjf-diff-ok{color:var(--ok)!important;font-weight:700;}
.rjf-diff-bad{color:var(--err)!important;font-weight:700;}

/* Patch (DRE): posicionamento e largura do popover de data (igual Lançamentos) */
.menu-pop.tx-date-pop{left:0;margin-top:6px;width:280px}