/* ─── Controladoria › Budget ─────────────────────────────────────────────── */

/* Cards do índice — mesmo padrão do Financeiro (reusa .painel-item global +
   modificadores "big" scoped no root, que não existem no style.css global). */
#controladoriaRoot a.painel-item { text-decoration: none; color: inherit; }
#controladoriaRoot .ctrl-item-big {
    align-items: flex-start;
    padding: 18px 20px;
}
#controladoriaRoot .ctrl-item-icon {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    color: var(--accent-dark, var(--accent));
}
#controladoriaRoot .ctrl-item-icon svg { width: 100%; height: 100%; }
#controladoriaRoot .ctrl-item-content { flex: 1; min-width: 0; }
#controladoriaRoot .ctrl-item-desc {
    font-size: 12px;
    color: var(--text-secondary);
    line-height: 1.5;
    margin-top: 4px;
}

/* página do Budget */
.ctrl-budget { padding: 4px 2px 40px; }
.ctrl-budget .back-btn {
    display: inline-block; margin-bottom: 14px; color: #6b6b6b;
    font-size: 13px; text-decoration: none;
}
.ctrl-budget .back-btn:hover { color: #222; }

.ctrl-flash {
    padding: 10px 14px; border-radius: 8px; margin-bottom: 14px; font-size: 13px;
}
.ctrl-flash-err { background: #fbeaea; color: #a12626; border: 1px solid #efc7c7; }

/* toolbar */
.ctrl-toolbar {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; flex-wrap: wrap; margin-bottom: 16px;
    background: #fff; border: 1px solid #ececec; border-radius: 10px; padding: 12px 14px;
}
.ctrl-emp { display: flex; align-items: center; gap: 8px; margin: 0; }
.ctrl-emp label { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #8a8a8a; }
.ctrl-emp select {
    min-width: 280px; padding: 7px 10px; border: 1px solid #d9d9d9; border-radius: 7px;
    font-size: 13px; background: #fff;
}
.ctrl-toolbar-right { display: flex; align-items: center; gap: 8px; }
.ctrl-toggle {
    display: inline-flex; align-items: center; gap: 4px; padding: 7px 12px;
    border: 1px solid #d9d9d9; border-radius: 7px; background: #fff; color: #444;
    font-size: 13px; text-decoration: none; cursor: pointer;
}
.ctrl-toggle:hover { border-color: #bdbdbd; }
.ctrl-toggle.active { background: #b9762f; border-color: #b9762f; color: #fff; }

.ctrl-empty {
    padding: 48px; text-align: center; color: #999; font-size: 14px;
    background: #fff; border: 1px solid #ececec; border-radius: 10px;
}

/* KPIs */
.ctrl-kpis {
    display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 18px;
}
.ctrl-kpi {
    background: #fff; border: 1px solid #ececec; border-radius: 10px; padding: 12px 14px;
    display: flex; flex-direction: column; gap: 6px;
}
.ctrl-kpi span { font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: #8a8a8a; }
.ctrl-kpi strong { font-size: 18px; color: #222; }
.ctrl-kpi-hl { background: #fbf6ec; border-color: #ecdcbf; }
.ctrl-kpi-hl strong { color: #8a5a1a; }

/* tabela */
.ctrl-table-wrap { overflow-x: auto; background: #fff; border: 1px solid #ececec; border-radius: 10px; }
.ctrl-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ctrl-table thead th {
    text-align: left; padding: 10px 12px; font-size: 11px; text-transform: uppercase;
    letter-spacing: .03em; color: #8a8a8a; border-bottom: 1px solid #ececec; white-space: nowrap;
}
.ctrl-table td { padding: 8px 12px; border-bottom: 1px solid #f4f4f4; vertical-align: middle; }
.ctrl-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ctrl-av { color: #999; font-size: 12px; }
.ctrl-col-conta { min-width: 280px; }
.ctrl-col-acoes { width: 1%; }

.ctrl-acc-root td { background: #faf6ec; }
.ctrl-acc-root .ctrl-acc-num { color: #8a5a1a; }
.ctrl-acc-sint td { background: #fafafa; }
.ctrl-acc-num {
    display: inline-block; min-width: 34px; color: #999; font-variant-numeric: tabular-nums;
}
.ctrl-line td:first-child { color: #333; }

.ctrl-fv {
    display: inline-flex; width: 20px; height: 20px; align-items: center; justify-content: center;
    border-radius: 5px; font-size: 11px; font-weight: 600;
}
.ctrl-fv-fixa { background: #e8eefb; color: #2b5bba; }
.ctrl-fv-variavel { background: #efe8fb; color: #6b3fba; }

.ctrl-actions { display: flex; gap: 8px; align-items: center; white-space: nowrap; }
.ctrl-actions a, .ctrl-actions button {
    color: #8a8a8a; text-decoration: none; font-size: 13px; background: none; border: none;
    cursor: pointer; padding: 2px 4px;
}
.ctrl-actions a:hover, .ctrl-actions button:hover { color: #222; }
.ctrl-add-line { color: #b9762f !important; font-size: 12px !important; }
.ctrl-inline-form { display: inline; margin: 0; }

/* modal */
.ctrl-modal-backdrop {
    position: fixed; inset: 0; background: rgba(20, 20, 20, .42);
    display: flex; align-items: center; justify-content: center; z-index: 1000; padding: 40px 16px;
    overflow-y: auto;
}
.ctrl-modal-close-bg { position: absolute; inset: 0; }
.ctrl-modal {
    position: relative; background: #fff; border-radius: 12px; width: 640px; max-width: 100%;
    padding: 22px 24px; box-shadow: 0 18px 50px rgba(0,0,0,.22); z-index: 1;
    margin: auto; /* centraliza e mantém modais altos roláveis sem cortar o topo */
}
.ctrl-modal-sm { width: 420px; }
.ctrl-modal h2 { margin: 0 0 16px; font-size: 17px; color: #222; }
.ctrl-modal-x { position: absolute; top: 12px; right: 14px; border: none; background: none; font-size: 20px; line-height: 1; color: #999; cursor: pointer; padding: 2px 6px; }
.ctrl-modal-x:hover { color: #333; }
.ctrl-form label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #6b6b6b; margin-bottom: 12px; }
.ctrl-form input, .ctrl-form select {
    padding: 8px 10px; border: 1px solid #d9d9d9; border-radius: 7px; font-size: 13px; color: #222;
}
.ctrl-form-row { display: flex; gap: 12px; }
.ctrl-form-row > label { flex: 1; }
.ctrl-fieldset { border: 1px solid #ececec; border-radius: 8px; padding: 10px 12px; margin: 6px 0 14px; }
.ctrl-fieldset legend { font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: #8a8a8a; padding: 0 6px; }
.ctrl-alloc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ctrl-alloc { margin-bottom: 0 !important; }
/* meses (sazonalidade): lista vertical rótulo+input, como o protótipo (evita o
   estouro do grid de 6 colunas, em que o input forçava 190px por coluna) */
.ctrl-months-grid { display: flex; flex-direction: column; gap: 4px; }
.ctrl-month { flex-direction: row !important; align-items: center; gap: 10px; margin-bottom: 0 !important; font-size: 12.5px !important; }
.ctrl-month-label { width: 110px; flex-shrink: 0; color: #222; }
.ctrl-month input { flex: 1; min-width: 0; text-align: right; font-variant-numeric: tabular-nums; }
.ctrl-base-grid { display: flex; flex-direction: column; gap: 6px; }
.ctrl-base { flex-direction: row !important; align-items: center; gap: 6px; margin-bottom: 0 !important; }
.ctrl-muted { color: #aaa; font-size: 12px; }
.ctrl-form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 6px; }
.btn-primary {
    background: #b9762f; color: #fff; border: none; border-radius: 7px; padding: 9px 18px;
    font-size: 13px; cursor: pointer;
}
.btn-primary:hover { background: #a3651f; }
.btn-secondary {
    background: #f1f1f1; color: #444; border-radius: 7px; padding: 9px 18px; font-size: 13px;
    text-decoration: none; display: inline-flex; align-items: center;
}

/* cronograma (projeção 12 meses) */
.ctrl-crono-table th, .ctrl-crono-table td { white-space: nowrap; }
.ctrl-crono-net td { background: #faf6ec; border-top: 2px solid #ecdcbf; }
.ctrl-crono-net td:first-child { color: #8a5a1a; }

/* aviso de rateio */
.ctrl-warn {
    display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 10px;
    background: #fbeaea; color: #a12626; font-size: 11px; font-weight: 600; white-space: nowrap;
}

/* colunas de BU */
.ctrl-bu-col { background: #fbfaf7; }
.ctrl-acc-root .ctrl-bu-col { background: #f6f1e4; }
.ctrl-acc-sint .ctrl-bu-col { background: #f6f6f3; }

/* modal seletor de BUs */
.ctrl-bus-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.ctrl-bus-pick {
    display: flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid #e4e4e4;
    border-radius: 8px; text-decoration: none; color: #444; font-size: 13px;
}
.ctrl-bus-pick:hover { border-color: #c9c9c9; }
.ctrl-bus-pick.on { border-color: #b9762f; background: #fbf6ec; color: #8a5a1a; }
.ctrl-bus-check {
    display: inline-flex; width: 18px; height: 18px; align-items: center; justify-content: center;
    border: 1px solid #cfcfcf; border-radius: 5px; font-size: 12px; color: #b9762f; background: #fff;
}
.ctrl-bus-pick.on .ctrl-bus-check { border-color: #b9762f; }

@media (max-width: 900px) {
    .ctrl-kpis { grid-template-columns: repeat(2, 1fr); }
    .ctrl-emp select { min-width: 180px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Budget — grid inline "planilha viva" (escopado em #ctrlBudgetRoot).
   Os modais reutilizam as classes .ctrl-modal/.ctrl-form/.ctrl-fieldset acima.
   ═══════════════════════════════════════════════════════════════════════════ */
/* a área de dados do Budget usa sans-serif (como o protótipo); o título "Budget"
   fica fora do #ctrlBudgetRoot, então continua em Georgia (serif) */
#ctrlBudgetRoot { font-family: "Helvetica Neue", Arial, sans-serif; }
#ctrlBudgetRoot.budget-page { padding: 4px 2px 40px; }
#ctrlBudgetRoot .back-btn { display: inline-block; margin-bottom: 14px; color: #6b6b6b; font-size: 13px; text-decoration: none; }
#ctrlBudgetRoot .back-btn:hover { color: #222; }

/* toolbar */
#ctrlBudgetRoot .budget-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; background: #fff; border: 1px solid #ececec; border-radius: 10px; padding: 10px 12px; }
#ctrlBudgetRoot .budget-toolbar-left { display: flex; align-items: center; gap: 8px; }
#ctrlBudgetRoot .budget-toolbar-label { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #8a8a8a; }
#ctrlBudgetRoot .budget-empresa-select { min-width: 230px; max-width: 280px; padding: 7px 10px; border: 1px solid #d9d9d9; border-radius: 7px; font-size: 13px; background: #fff; }
#ctrlBudgetRoot .budget-toolbar-tabs { display: flex; gap: 6px; }
#ctrlBudgetRoot .budget-tab { padding: 7px 14px; border: 1px solid #d9d9d9; border-radius: 7px; background: #fff; color: #444; font-size: 13px; text-decoration: none; cursor: pointer; }
#ctrlBudgetRoot .budget-tab:hover { border-color: #bdbdbd; }
#ctrlBudgetRoot .budget-tab.active { background: #b9762f; border-color: #b9762f; color: #fff; }
#ctrlBudgetRoot .budget-toolbar-right { display: flex; align-items: center; gap: 8px; }
#ctrlBudgetRoot .budget-icon-btn { width: 34px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #d9d9d9; border-radius: 7px; background: #fff; color: #666; cursor: pointer; font-size: 14px; }
#ctrlBudgetRoot .budget-icon-btn:hover { border-color: #b9762f; color: #b9762f; }
#ctrlBudgetRoot .budget-icon-btn.on { background: #b9762f; border-color: #b9762f; color: #fff; }
#ctrlBudgetRoot .budget-av-toggle,
#ctrlBudgetRoot .budget-moeda-toggle,
#ctrlBudgetRoot .budget-add-bu-btn { padding: 7px 12px; border: 1px solid #d9d9d9; border-radius: 7px; background: #fff; color: #444; font-size: 13px; text-decoration: none; cursor: pointer; }
#ctrlBudgetRoot .budget-av-toggle:hover,
#ctrlBudgetRoot .budget-moeda-toggle:hover,
#ctrlBudgetRoot .budget-add-bu-btn:hover { border-color: #b9762f; }
#ctrlBudgetRoot .budget-av-toggle.on { background: #b9762f; border-color: #b9762f; color: #fff; }
#ctrlBudgetRoot .budget-add-bu-btn { border-style: dashed; color: #b9762f; }

/* KPIs */
/* auto-fit: os cards quebram para a próxima linha em vez de espremer (evita o
   valor "R$ 124.000,00" quebrar em duas linhas em telas estreitas) */
#ctrlBudgetRoot .budget-pe-panel { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 10px; margin-bottom: 18px; }
#ctrlBudgetRoot .budget-pe-kpi { background: #fff; border: 1px solid #ececec; border-radius: 10px; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; }
#ctrlBudgetRoot .budget-pe-label { font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: #8a8a8a; }
#ctrlBudgetRoot .budget-pe-value { font-size: 18px; color: #222; font-variant-numeric: tabular-nums; white-space: nowrap; }
#ctrlBudgetRoot .budget-pe-kpi-highlight { background: #fbf6ec; border-color: #ecdcbf; }
#ctrlBudgetRoot .budget-pe-kpi-highlight .budget-pe-value { color: #8a5a1a; }
#ctrlBudgetRoot .budget-pe-sub { font-size: 11px; color: #a9854f; font-variant-numeric: tabular-nums; }
#ctrlBudgetRoot .budget-empty-state { padding: 48px; text-align: center; color: #999; font-size: 14px; background: #fff; border: 1px solid #ececec; border-radius: 10px; }

/* tabela */
#ctrlBudgetRoot .budget-table-wrap { overflow-x: auto; background: #fff; border: 1px solid #ececec; border-radius: 10px; }
#ctrlBudgetRoot .budget-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
#ctrlBudgetRoot .budget-table thead th { text-align: left; padding: 8px 10px; font-size: 10.5px; text-transform: uppercase; letter-spacing: .03em; color: #8a8a8a; border-bottom: 1px solid #ececec; white-space: nowrap; }
#ctrlBudgetRoot .budget-th-pessoa,
#ctrlBudgetRoot .budget-th-meses { text-align: center; }
#ctrlBudgetRoot .budget-table td { padding: 4px 10px; border-bottom: 1px solid #f0eee5; vertical-align: middle; }
#ctrlBudgetRoot .budget-td-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
#ctrlBudgetRoot .budget-th-av { text-align: left; color: #8a5a1a; width: 52px; }
#ctrlBudgetRoot .budget-td-av { text-align: left; color: #8a5a1a; font-size: 10.5px; font-variant-numeric: tabular-nums; }
#ctrlBudgetRoot .budget-th-conta { min-width: 260px; }
#ctrlBudgetRoot .budget-th-bu,
#ctrlBudgetRoot .budget-td-bu { background: #fbfaf7; text-align: right; }

/* linhas de conta */
#ctrlBudgetRoot .budget-row-raiz td { background: #f3eed8; }
#ctrlBudgetRoot .budget-row-raiz .budget-td-bu { background: #eee6cd; }
#ctrlBudgetRoot .budget-row-sintetica td { background: #fafaf7; }
/* inline-flex p/ encolher ao conteúdo (chevron+nº+nome) e ancorar o "＋ linha"
   absoluto logo após o nome, sem alargar a coluna nem empurrar as demais */
#ctrlBudgetRoot .budget-conta-inner { display: inline-flex; align-items: center; gap: 4px; position: relative; }
#ctrlBudgetRoot .budget-conta-numero { display: inline-block; min-width: 30px; color: #999; font-variant-numeric: tabular-nums; }
#ctrlBudgetRoot .budget-conta-nome { color: #222; }
/* analítica com linhas = negrito; vazia = peso normal (igual ao protótipo) */
#ctrlBudgetRoot .budget-row-analitica-sub .budget-conta-numero,
#ctrlBudgetRoot .budget-row-analitica-sub .budget-conta-nome { font-weight: 700; }
#ctrlBudgetRoot .budget-row-analitica-sub.budget-row-vazia .budget-conta-numero,
#ctrlBudgetRoot .budget-row-analitica-sub.budget-row-vazia .budget-conta-nome { font-weight: 400; }
#ctrlBudgetRoot .budget-add-linha-inline { position: absolute; left: 100%; top: 50%; transform: translateY(-50%); margin-left: 8px; padding: 1px 8px; border: 1px dashed #d9d9d9; background: transparent; color: #8a8a8a; cursor: pointer; font-size: 11px; border-radius: 4px; white-space: nowrap; display: none; }
#ctrlBudgetRoot .budget-row:hover .budget-add-linha-inline { display: inline-flex; align-items: center; }
#ctrlBudgetRoot .budget-add-linha-inline:hover { border-color: #b9762f; color: #b9762f; }

/* células editáveis inline */
#ctrlBudgetRoot .budget-rotulo-input { border: 1px solid transparent; background: transparent; font: inherit; font-size: 12px; color: #222; padding: 2px 5px; border-radius: 4px; width: 100%; max-width: 230px; }
#ctrlBudgetRoot .budget-rotulo-input::placeholder { color: #bbb; font-style: italic; }
#ctrlBudgetRoot .budget-rotulo-input:hover { border-color: #e0e0e0; }
#ctrlBudgetRoot .budget-rotulo-input:focus { outline: none; border-color: #b9762f; background: #fff; }
#ctrlBudgetRoot .budget-td-pessoa,
#ctrlBudgetRoot .budget-td-meses { text-align: center; }
#ctrlBudgetRoot .budget-pessoa-pick-icon,
#ctrlBudgetRoot .budget-meses-btn { border: 1px solid transparent; background: transparent; color: #8a8a8a; cursor: pointer; padding: 2px 5px; border-radius: 5px; font-size: 13px; }
#ctrlBudgetRoot .budget-pessoa-pick-icon:hover,
#ctrlBudgetRoot .budget-meses-btn:hover { border-color: #b9762f; color: #b9762f; }
#ctrlBudgetRoot .budget-pessoa-pick-icon.pendente { color: #c0392b; }
#ctrlBudgetRoot .budget-pessoa-plus { font-weight: 700; }
#ctrlBudgetRoot .budget-tipo-btn { width: 20px; height: 20px; border-radius: 50%; border: 1px solid #d9d9d9; background: #fff; font-size: 10px; font-weight: 700; cursor: pointer; padding: 0; }
#ctrlBudgetRoot .budget-tipo-btn.fixa { background: #e8eefb; color: #2b5bba; border-color: #aacbe0; }
#ctrlBudgetRoot .budget-tipo-btn.variavel { background: #efe8fb; color: #6b3fba; border-color: #cfb6e2; }
#ctrlBudgetRoot .budget-valor-wrap { display: inline-flex; align-items: center; border: 1px solid #d9d9d9; border-radius: 5px; background: #fff; }
#ctrlBudgetRoot .budget-valor-wrap:focus-within { border-color: #b9762f; }
#ctrlBudgetRoot .budget-valor-wrap.pendente { border-color: #e3b6b6; }
#ctrlBudgetRoot .budget-moeda-flag,
#ctrlBudgetRoot .budget-var-base-btn { background: transparent; border: none; border-right: 1px solid #e0e0e0; cursor: pointer; padding: 2px 6px; font-size: 12px; color: #8a8a8a; }
#ctrlBudgetRoot .budget-var-base-btn.pendente { color: #c0392b; }
#ctrlBudgetRoot .budget-valor-input,
#ctrlBudgetRoot .budget-pct-input { border: none; outline: none; padding: 2px 6px; width: 84px; font-size: 12px; text-align: right; font-variant-numeric: tabular-nums; background: transparent; font: inherit; }
#ctrlBudgetRoot .budget-recur-btn,
#ctrlBudgetRoot .budget-empresa-pick-btn { padding: 2px 7px; border: 1px solid transparent; background: #f6f6f3; color: #333; cursor: pointer; border-radius: 5px; font-size: 11.5px; text-align: left; width: 100%; }
#ctrlBudgetRoot .budget-recur-btn:hover,
#ctrlBudgetRoot .budget-empresa-pick-btn:hover { border-color: #b9762f; background: #fff; }
#ctrlBudgetRoot .budget-empresa-pendente { border-color: #e3b6b6; background: #fff; }
#ctrlBudgetRoot .budget-empresa-pendente em { color: #aaa; font-style: italic; }
#ctrlBudgetRoot .budget-emp-pill { display: inline-block; padding: 1px 8px; border-radius: 10px; background: #f1f1f1; border: 1px solid #e0e0e0; font-size: 10.5px; }
#ctrlBudgetRoot .budget-bu-alloc-input { width: 100%; border: 1px solid transparent; background: transparent; padding: 3px 6px; font-size: 11.5px; text-align: right; font-variant-numeric: tabular-nums; border-radius: 4px; font: inherit; }
#ctrlBudgetRoot .budget-bu-alloc-input:focus { outline: none; border-color: #b9762f; background: #fff; }
#ctrlBudgetRoot .budget-warn-pill { display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 10px; background: #fbeaea; color: #a12626; font-size: 11px; font-weight: 600; white-space: nowrap; }
#ctrlBudgetRoot .budget-linha-row.budget-row-warn td:first-child { box-shadow: inset 3px 0 0 #c0392b; }
#ctrlBudgetRoot .budget-acoes { white-space: nowrap; }
#ctrlBudgetRoot .budget-acoes a,
#ctrlBudgetRoot .budget-acoes button { color: #8a8a8a; text-decoration: none; font-size: 13px; background: none; border: none; cursor: pointer; padding: 2px 4px; }
#ctrlBudgetRoot .budget-acoes a:hover,
#ctrlBudgetRoot .budget-acoes button:hover { color: #222; }

/* toggles client-side: ocultar colunas de detalhe / recolher linhas */
#ctrlBudgetRoot .budget-table.budget-cols-hidden .budget-col-detail { display: none; }
#ctrlBudgetRoot .budget-table.budget-lines-hidden .budget-linha-row { display: none; }

/* tooltips data-label */
#ctrlBudgetRoot [data-label] { position: relative; }
#ctrlBudgetRoot .budget-toolbar [data-label]:hover::after,
#ctrlBudgetRoot .budget-table thead th[data-label]:hover::after,
#ctrlBudgetRoot .budget-conta-inner[data-label]:hover::after {
    content: attr(data-label); position: absolute; top: 100%; left: 0; margin-top: 5px;
    padding: 4px 8px; background: #222; color: #fff; font-size: 11px; border-radius: 4px;
    white-space: nowrap; pointer-events: none; z-index: 60; text-transform: none; letter-spacing: 0; font-weight: 500;
}

/* ── paridade com o protótipo: ícones SVG, abas-ícone, ＋BUs no header ── */
/* SVGs herdam currentColor; tamanho padrão dentro de botões/células */
#ctrlBudgetRoot .budget-icon-btn svg,
#ctrlBudgetRoot .budget-tab-icon svg { width: 16px; height: 16px; display: block; }
#ctrlBudgetRoot .budget-th-pessoa svg,
#ctrlBudgetRoot .budget-th-meses svg,
#ctrlBudgetRoot .budget-pessoa-pick-icon svg,
#ctrlBudgetRoot .budget-meses-btn svg { width: 15px; height: 15px; display: inline-block; vertical-align: middle; }
#ctrlBudgetRoot .budget-var-base-btn svg { width: 14px; height: 14px; display: block; }
#ctrlBudgetRoot .budget-av-toggle svg { vertical-align: middle; opacity: .8; }

/* abas como botões só-ícone (gráfico / calendário) */
#ctrlBudgetRoot .budget-tab-icon { padding: 0; width: 34px; height: 32px; display: inline-flex; align-items: center; justify-content: center; color: #666; }
#ctrlBudgetRoot .budget-tab-icon:hover { border-color: #b9762f; color: #b9762f; }
#ctrlBudgetRoot .budget-tab-icon.active { background: #b9762f; border-color: #b9762f; color: #fff; }

/* ＋BUs no cabeçalho da tabela (última coluna) */
#ctrlBudgetRoot .budget-th-add-bu { text-align: right; width: 1%; white-space: nowrap; }
#ctrlBudgetRoot .budget-th-add-bu .budget-add-bu-btn {
    display: inline-block; padding: 4px 10px; border: 1px dashed #d9c3a4; border-radius: 7px;
    background: #fff; color: #b9762f; font-size: 11px; text-transform: none; letter-spacing: 0;
    text-decoration: none; cursor: pointer;
}
#ctrlBudgetRoot .budget-th-add-bu .budget-add-bu-btn:hover { border-color: #b9762f; background: #fbf6ec; }

/* chevron de colapso por conta */
#ctrlBudgetRoot .budget-chevron { display: inline-block; width: 12px; margin-right: 1px; color: #b9762f; cursor: pointer; font-size: 9px; line-height: 1; text-align: center; user-select: none; }
#ctrlBudgetRoot .budget-chevron:hover { color: #8a5a1a; }

/* modal "Empresa pagadora": lista clicável com bandeira (réplica do protótipo,
   clique aplica e fecha — sem dropdown nem botão Salvar) */
#ctrlBudgetRoot .budget-emp-pick-list { display: flex; flex-direction: column; gap: 4px; max-height: 360px; overflow-y: auto; }
#ctrlBudgetRoot .budget-emp-pick-row { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid #d9d9d9; border-radius: 6px; background: #fff; cursor: pointer; text-align: left; font: inherit; font-size: 13px; color: #222; }
#ctrlBudgetRoot .budget-emp-pick-row:hover { border-color: #b9762f; background: #fbf6ec; }
#ctrlBudgetRoot .budget-emp-pick-row.selected { border-color: #b9762f; background: #f3eee0; font-weight: 600; }
#ctrlBudgetRoot .budget-emp-pick-flag { font-size: 13px; line-height: 1; flex-shrink: 0; }
#ctrlBudgetRoot .budget-emp-pick-name { flex: 1; }
#ctrlBudgetRoot .budget-emp-pick-check { margin-left: auto; color: #8a5a1a; font-weight: 700; }

/* picker "Pessoa, fornecedor ou BU": busca + grupos + cadastrar (réplica do protótipo) */
#ctrlBudgetRoot .budget-pick-search { width: 100%; padding: 8px 10px; border: 1px solid #d9d9d9; border-radius: 7px; font: inherit; font-size: 13px; color: #222; }
#ctrlBudgetRoot .budget-pick-search:focus { outline: none; border-color: #b9762f; }
#ctrlBudgetRoot .budget-pick-group-label { font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; color: #8a8a8a; padding: 6px 2px 2px; }
#ctrlBudgetRoot .budget-pick-empty { padding: 10px 4px; color: #999; font-size: 12px; }
#ctrlBudgetRoot .budget-pick-create { margin-top: 10px; width: 100%; padding: 8px 12px; border: 1px dashed #d9c3a4; border-radius: 7px; background: #fff; color: #b9762f; font: inherit; font-size: 13px; cursor: pointer; }
#ctrlBudgetRoot .budget-pick-create:hover { border-color: #b9762f; background: #fbf6ec; }

/* modal "Despesa variável": árvore Receitas-base (contas + linhas, trava em cascata) */
#ctrlBudgetRoot .budget-var-pct-wrap { display: inline-flex; align-items: center; gap: 6px; }
#ctrlBudgetRoot .budget-var-pct-wrap input { width: 120px; text-align: right; }
#ctrlBudgetRoot .budget-var-tree { border: 1px solid #e0ddd0; border-radius: 5px; max-height: 340px; overflow-y: auto; background: #fff; margin-bottom: 14px; }
#ctrlBudgetRoot .budget-var-tree-row { display: flex; flex-direction: row; align-items: center; gap: 8px; padding: 4px 10px; border-bottom: 1px solid #f3f1e8; font-size: 12.5px; color: #222; cursor: pointer; margin: 0; }
#ctrlBudgetRoot .budget-var-tree-row:last-child { border-bottom: none; }
#ctrlBudgetRoot .budget-var-tree-row:hover { background: #fbf6ec; }
#ctrlBudgetRoot .budget-var-tree-row.locked { opacity: .6; cursor: not-allowed; background: #fafaf7; }
#ctrlBudgetRoot .budget-var-tree-row.linha { font-size: 11.5px; color: #8a8a8a; }
#ctrlBudgetRoot .budget-var-tree-row.linha .budget-var-tree-linha-label { color: #222; }
#ctrlBudgetRoot .budget-var-tree-num { min-width: 56px; color: #8a8a8a; font-variant-numeric: tabular-nums; font-size: 11px; }
#ctrlBudgetRoot .budget-var-tree-row small { margin-left: auto; color: #8a8a8a; font-size: 10.5px; }
#ctrlBudgetRoot .budget-var-tree-row input[type=checkbox] { flex-shrink: 0; margin: 0; }

/* editor de recorrência completo (réplica do picker do Calendário) */
#ctrlBudgetRoot #budgetRecurEditor { margin-bottom: 6px; }
#ctrlBudgetRoot .ctrl-recur-sect { margin-bottom: 14px; }
#ctrlBudgetRoot .ctrl-recur-label { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: #8a8a8a; margin-bottom: 6px; }
#ctrlBudgetRoot .ctrl-recur-select { width: 100%; padding: 8px 10px; border: 1px solid #d9d9d9; border-radius: 7px; font: inherit; font-size: 13px; color: #222; background: #fff; }
#ctrlBudgetRoot .ctrl-recur-inline { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: #444; }
#ctrlBudgetRoot .ctrl-recur-inline input { width: 80px; padding: 7px 8px; border: 1px solid #d9d9d9; border-radius: 7px; font: inherit; text-align: right; }
#ctrlBudgetRoot .ctrl-recur-inline-input { padding: 6px 8px; border: 1px solid #d9d9d9; border-radius: 6px; font: inherit; font-size: 13px; color: #222; background: #fff; }
#ctrlBudgetRoot input.ctrl-recur-inline-input { width: 64px; text-align: right; }
#ctrlBudgetRoot .ctrl-recur-radio { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 7px; font-size: 13px; color: #333; padding: 4px 0; }
#ctrlBudgetRoot .ctrl-recur-radio input[type=radio] { margin: 0; }
#ctrlBudgetRoot .ctrl-recur-radio input[type=number], #ctrlBudgetRoot .ctrl-recur-radio input[type=date] { width: 64px; }
#ctrlBudgetRoot .ctrl-recur-radio input[type=date] { width: auto; }
#ctrlBudgetRoot .ctrl-weekday-picker { display: flex; gap: 6px; flex-wrap: wrap; }
#ctrlBudgetRoot .ctrl-weekday-btn { width: 38px; height: 32px; border: 1px solid #d9d9d9; border-radius: 7px; background: #fff; color: #555; cursor: pointer; font: inherit; font-size: 12px; }
#ctrlBudgetRoot .ctrl-weekday-btn:hover { border-color: #b9762f; }
#ctrlBudgetRoot .ctrl-weekday-btn.on { background: #b9762f; border-color: #b9762f; color: #fff; }
#ctrlBudgetRoot .ctrl-recur-preview { background: #fbf6ec; border: 1px solid #ecdcbf; border-radius: 7px; padding: 8px 12px; font-size: 12.5px; color: #6b4a17; margin-bottom: 6px; }

/* cabeçalhos R$/mês e R$/ano clicáveis (toggle de moeda) */
#ctrlBudgetRoot .budget-th-moeda { cursor: pointer; }
#ctrlBudgetRoot .budget-th-moeda a { color: inherit; text-decoration: none; }
#ctrlBudgetRoot .budget-th-moeda:hover a { color: #b9762f; }

/* em telas estreitas a toolbar pode quebrar; o grupo da direita continua alinhado
   à direita (margin-left:auto) em vez de abrir um vão grande com space-between */
@media (max-width: 1024px) {
    #ctrlBudgetRoot .budget-toolbar { justify-content: flex-start; }
    #ctrlBudgetRoot .budget-toolbar-right { margin-left: auto; }
    #ctrlBudgetRoot .budget-empresa-select { min-width: 180px; }
}