/*
 * BUDGET-UI-1 — «تعديل موازنة إنشاءات» on the HOMEi design system.
 *
 * Scope: body.homei-budgets (create + edit) for the grid; body.homei-budget-edit
 * for the page chrome (header, KPI strip, pill tabs, the «بيانات الموازنة»
 * drawer). Every colour is a --ho-* token, so dark mode follows tokens.css.
 *
 * The ruling this sheet serves (Kamal, 25-9): the item and ALL its figures
 * side by side with no sideways scroll, and every item on ONE page — the
 * grid scrolls inside its card with the header row and the totals row pinned.
 */

:is(.homei-budget-edit, .homei-budget-list) {
  --hb-ink: var(--ho-brand-ink);
  --hb-muted: var(--ho-brand-ink-muted);
  --hb-line: var(--ho-brand-line);
  --hb-soft: var(--ho-brand-soft);
  --hb-card: var(--ho-brand-card);
  --hb-page: var(--ho-brand-page);
  --hb-accent: var(--ho-brand-accent);
  --hb-accent-ink: var(--ho-brand-accent-ink);
  --hb-accent-soft: var(--ho-brand-accent-soft);
  --hb-info: var(--ho-info-ink);
  --hb-shadow: color-mix(in srgb, var(--ho-brand-ink) 14%, transparent);
}

/* ── Page header ─────────────────────────────────────────────── */
:is(.homei-budget-edit, .homei-budget-list) .fi-header { align-items: flex-start; gap: 12px; margin-bottom: 4px; }
:is(.homei-budget-edit, .homei-budget-list) .fi-header-heading { font-size: 24px; font-weight: 800; color: var(--hb-ink); line-height: 1.25; }
:is(.homei-budget-edit, .homei-budget-list) .fi-header-subheading { color: var(--hb-muted); font-size: 13px; margin-top: 2px; }
:is(.homei-budget-edit, .homei-budget-list) .fi-header .fi-btn { min-height: 38px; border-radius: 10px; font-weight: 700; }
.homei-budget-edit .fi-header [data-hb-save] { background: var(--hb-accent); color: var(--ho-brand-on-accent); }
/* Vertical rhythm tightened so the grid gets the screen (Filament's 24–32px gaps → 12px). */
:is(.homei-budget-edit, .homei-budget-list) .fi-page-header-main-ctn { row-gap: 12px; padding-top: 16px; padding-bottom: 12px; }
:is(.homei-budget-edit, .homei-budget-list) :is(.fi-page-content, .fi-page-main) { row-gap: 12px; }
.homei-budget-edit .fi-sc-form, .homei-budget-edit .fi-page-content > .fi-sc, .homei-budget-edit .fi-sc-form .fi-sc.fi-sc-has-gap { gap: 12px; }
.homei-budget-edit .hb-section .fi-section-content.fi-sc-has-gap { gap: 0; }
.homei-budget-edit .fi-in-entry-content-col, .homei-budget-edit .fi-in-entry { row-gap: 0; }

.hb-unsaved {
  display: none; align-items: center; gap: 6px; border-radius: 999px; padding: 3px 11px;
  font-size: var(--ho-text-xs); font-weight: 700; white-space: nowrap;
  background: var(--ho-warning-soft); color: var(--ho-warning-ink); border: 1px solid var(--ho-warning-line);
}
.hb-unsaved.is-on { display: inline-flex; }

/* ── KPI strip ───────────────────────────────────────────────── */
.hb-kpis {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
  background: var(--hb-card); border: 1px solid var(--hb-line); border-radius: 14px; overflow: hidden;
}
.hb-kpi { padding: 10px 16px; border-inline-start: 1px solid var(--hb-line); min-width: 0; }
.hb-kpi:first-child { border-inline-start: 0; }
.hb-kpi-l { font-size: var(--ho-text-xs); font-weight: 600; color: var(--hb-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-kpi-v { font-size: 21px; font-weight: 800; color: var(--hb-ink); font-variant-numeric: tabular-nums; line-height: 1.35; white-space: nowrap; }
.hb-kpi-v small { font-size: 13px; font-weight: 800; color: inherit; margin-inline-start: 4px; }
.hb-i { font-style: normal; margin-inline-end: 4px; opacity: .7; }
.hb-kpi-c { font-size: var(--ho-text-xs); color: var(--hb-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-kpi-na { font-size: 17px; font-weight: 600; font-style: italic; color: var(--hb-muted); line-height: 1.6; }
.hb-kpi--accent .hb-kpi-v { color: var(--hb-accent-ink); }
.hb-kpi--info .hb-kpi-v { color: var(--hb-info); }
.hb-kpi--success .hb-kpi-v { color: var(--ho-success-ink); }

/* ── «بيانات الموازنة» drawer (edit page only) ───────────────── */
.homei-budget-edit .hb-meta {
  position: fixed; top: 0; bottom: 0; inset-inline-end: 0; z-index: 60; width: min(440px, 92vw);
  margin: 0; border-radius: 0; overflow-y: auto; background: var(--hb-card);
  border-inline-start: 1px solid var(--hb-line); box-shadow: 0 0 40px var(--hb-shadow);
  transform: translateX(-100%); visibility: hidden; transition: transform .2s ease, visibility .2s;
}
[dir="ltr"] .homei-budget-edit .hb-meta, .homei-budget-edit[dir="ltr"] .hb-meta { transform: translateX(100%); }
.homei-budget-edit.hb-meta-open .hb-meta { transform: none; visibility: visible; }
.homei-budget-edit.hb-meta-open .hb-meta { box-shadow: 0 0 0 100vmax var(--hb-shadow), 0 0 40px var(--hb-shadow); }
.homei-budget-edit .hb-meta > .fi-section { border: 0; box-shadow: none; border-radius: 0; }
.homei-budget-edit .hb-meta .fi-section-content { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.homei-budget-edit .hb-meta .fi-section-content > .fi-grid-col { grid-column: span 1 / span 1 !important; }
.homei-budget-edit .hb-meta .fi-section-content > .fi-grid-col:last-child { grid-column: 1 / -1 !important; }
.hb-btn { border: 1px solid var(--hb-line); background: var(--hb-card); color: var(--hb-ink); border-radius: 10px; padding: 7px 18px; font-weight: 700; font-size: 13px; cursor: pointer; }
.hb-btn--navy { background: var(--hb-ink); border-color: var(--hb-ink); color: var(--hb-card); width: 100%; }

/* ── Pill tabs board ─────────────────────────────────────────── */
.homei-budget-edit .hb-board {
  border: 1px solid var(--hb-line); border-top: 3px solid var(--hb-info); border-radius: 14px;
  background: var(--hb-card); box-shadow: none; overflow: hidden;
}
.homei-budget-edit .hb-board > .fi-tabs, .homei-budget-edit .hb-board .fi-sc-tabs-tabs, .homei-budget-edit .hb-board nav.fi-tabs {
  display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 14px; margin: 0; border: 0; border-bottom: 1px solid var(--hb-line);
  background: transparent; box-shadow: none; border-radius: 0; max-width: none;
}
.homei-budget-edit .hb-board .fi-tabs-item {
  border: 1px solid var(--hb-line); border-radius: 999px; padding: 4px 13px; min-height: 0; gap: 7px;
  background: var(--hb-card); color: var(--hb-ink); font-weight: 700; font-size: 13px;
}
.homei-budget-edit .hb-board .fi-tabs-item .fi-tabs-item-label { color: inherit; }
.homei-budget-edit .hb-board .fi-tabs-item[aria-selected="true"], .homei-budget-edit .hb-board .fi-tabs-item.fi-active {
  background: var(--hb-ink); border-color: var(--hb-ink); color: var(--hb-card);
}
.homei-budget-edit .hb-board .fi-tabs-item .fi-badge { font-size: var(--ho-text-xs); padding: 0 7px; min-width: 0; }
.homei-budget-edit .hb-board .fi-sc-tabs-tab, .homei-budget-edit .hb-board [role="tabpanel"] { padding: 0; }
.homei-budget-edit .hb-section, .homei-budget-edit .hb-section .fi-section-content-ctn, .homei-budget-edit .hb-section .fi-section-content {
  border: 0; box-shadow: none; background: transparent; padding: 0; border-radius: 0;
}
.homei-budget-edit .hb-section .fi-section-content > .fi-sc { gap: 0; }

/* ── Section toolbar + chips ─────────────────────────────────── */
.hb-toolbar { padding: 8px 14px 6px; display: grid; gap: 6px; }
.hb-toolbar-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.hb-toolbar-row--pad { padding: 8px 14px; border-bottom: 1px solid var(--hb-line); }
.hb-toolbar-title { font-size: 15px; font-weight: 800; color: var(--hb-ink); display: flex; align-items: center; gap: 6px; }
.hb-toolbar-title small { font-size: var(--ho-text-xs); color: var(--hb-muted); font-weight: 700; }
.hb-toolbar-total { color: var(--hb-accent-ink); font-variant-numeric: tabular-nums; }
.hb-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.hb-dot--license { background: var(--ho-info-ink); } .hb-dot--construction { background: var(--ho-warning-ink); } .hb-dot--finishing { background: var(--ho-success-ink); }
.hb-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.hb-chip {
  border: 0; background: var(--hb-soft); color: var(--hb-muted); border-radius: 8px; padding: 3px 10px;
  font-size: var(--ho-text-xs); font-weight: 600; cursor: pointer; display: inline-flex; gap: 5px; align-items: center;
}
.hb-chip b { color: var(--hb-ink); font-variant-numeric: tabular-nums; }
.hb-chip.is-on { background: var(--ho-info-soft); color: var(--ho-info-ink); box-shadow: inset 0 0 0 1px var(--ho-info-line); }
.hb-chip.is-on b { color: var(--ho-info-ink); }
.hb-chip--danger b { color: var(--ho-danger-ink); }
.hb-legend { display: flex; gap: 12px; font-size: var(--ho-text-xs); color: var(--hb-muted); }
.hb-legend i { display: inline-block; width: 14px; height: 3px; border-radius: 2px; vertical-align: middle; margin-inline-end: 5px; }
.hb-legend-boq { background: var(--hb-accent); } .hb-legend-mat { background: var(--ho-info-line); }
.hb-tools { display: flex; gap: 8px; align-items: center; }
.hb-search { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--hb-line); border-radius: 9px; padding: 0 10px; background: var(--hb-card); color: var(--hb-muted); }
.hb-search input { border: 0; background: transparent; outline: 0; font-size: 13px; padding: 5px 0; width: 190px; color: var(--hb-ink); box-shadow: none; }
.hb-select { border: 1px solid var(--hb-line); border-radius: 9px; padding: 5px 30px 5px 10px; font-size: 13px; background-color: var(--hb-card); color: var(--hb-ink); }

/* The bulk «add items» picker: one compact line under the toolbar (its
   placeholder already says what it does). */
.homei-budgets .hb-section .fi-section-content > .fi-grid-col:nth-child(2) { padding: 0 14px 8px; }
.homei-budgets .hb-section .fi-section-content > .fi-grid-col:nth-child(2) .fi-fo-field-label-col,
.homei-budgets .hb-section .fi-section-content > .fi-grid-col:nth-child(2) .fi-sc.fi-inline { display: none; }
.homei-budgets .hb-section .fi-section-content > .fi-grid-col:nth-child(2) .fi-fo-field { row-gap: 0; }
.homei-budgets .hb-section .fi-section-content > .fi-grid-col:nth-child(2) .fi-input-wrp { min-height: 36px; }
.homei-budgets .hb-section .fi-section-content > .fi-grid-col:nth-child(2) .fi-select-input { min-height: 34px; padding-block: 2px; }
.homei-budgets .hb-section .fi-section-content > .fi-grid-col:nth-child(2) .fi-btn { min-height: 36px; background: var(--ho-brand-accent); color: var(--ho-brand-on-accent); }

/* ── The grid: one row per item, every figure visible ────────── */
.homei-budgets .homei-budget-items {
  display: block; overflow: auto; max-width: 100%; padding: 0; isolation: isolate;
  max-height: calc(100vh - var(--hb-grid-top, 330px)); min-height: 240px;
  border-top: 1px solid var(--ho-brand-line); scrollbar-gutter: stable;
}
.homei-budgets .homei-budget-items > table { display: table; width: 100%; min-width: 0; table-layout: fixed; border-collapse: separate; border-spacing: 0; }
.homei-budgets .homei-budget-items > table > thead > tr > th {
  position: sticky; top: 0; z-index: 3; background: var(--ho-brand-soft); color: var(--ho-brand-ink-muted);
  font-size: var(--ho-text-xs); font-weight: 700; padding: 7px 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  border-bottom: 1px solid var(--ho-brand-line); text-align: start;
}
.homei-budgets .homei-budget-items > table > thead > tr > th:first-of-type { padding-inline-start: 14px; min-width: 0; inset-inline-start: auto; box-shadow: none; }
/* The two figure groups: BOQ (area × price = cost) and raw material (name, qty, cost). */
.homei-budgets .homei-budget-items > table > thead > tr > th:nth-child(4),
.homei-budgets .homei-budget-items > table > thead > tr > th:nth-child(5),
.homei-budgets .homei-budget-items > table > thead > tr > th:nth-child(6) { box-shadow: inset 0 -2px 0 var(--ho-brand-accent); }
.homei-budgets .homei-budget-items > table > thead > tr > th:nth-child(8),
.homei-budgets .homei-budget-items > table > thead > tr > th:nth-child(9),
.homei-budgets .homei-budget-items > table > thead > tr > th:nth-child(10) { box-shadow: inset 0 -2px 0 var(--ho-info-line); }
.homei-budgets .homei-budget-items > table > thead > tr > th:last-child { width: 34px; }
.homei-budgets .homei-budget-items > table > tbody > tr > td:not(.fi-hidden) {
  display: table-cell; min-width: 0; padding: 3px 3px; vertical-align: middle; border-bottom: 1px solid var(--ho-brand-line);
}
.homei-budgets .homei-budget-items :is(td, th):first-of-type { position: static; min-width: 0; max-width: none; box-shadow: none; background: transparent; }
.homei-budgets .homei-budget-items > table > thead > tr > th:first-of-type { position: sticky; background: var(--ho-brand-soft); }
.homei-budgets .homei-budget-items > table > tbody > tr > td:first-of-type { padding-inline-start: 12px; }
.homei-budgets .homei-budget-items > table > tbody > tr:hover > td { background: color-mix(in srgb, var(--ho-brand-soft) 45%, transparent); }
.homei-budgets .homei-budget-items > table > tbody > tr[hidden] { display: none; }

.homei-budgets .homei-budget-items .fi-input-wrp { min-height: 0; border-radius: 7px; box-shadow: 0 0 0 1px var(--ho-brand-line); }
.homei-budgets .homei-budget-items .fi-input-wrp:focus-within { box-shadow: 0 0 0 2px var(--ho-brand-accent); }
.homei-budgets .homei-budget-items .fi-input { padding: 4px 6px; font-size: 13px; line-height: 20px; font-variant-numeric: tabular-nums; font-weight: 600; }
.homei-budgets .homei-budget-items .fi-input::placeholder { font-weight: 500; }
.homei-budgets .homei-budget-items .fi-input-wrp-suffix, .homei-budgets .homei-budget-items .fi-input-wrp-prefix { padding-inline: 4px; }
.homei-budgets .homei-budget-items .fi-input-wrp-suffix:has(.fi-dictation-btn), .homei-budgets .homei-budget-items .fi-input-wrp-suffix:empty { display: none; }
.homei-budgets .homei-budget-items input[type="date"] { padding-inline: 4px; font-size: 12.5px; }
.homei-budgets .homei-budget-items .fi-select-input { padding-block: 0; min-height: 0; }
.homei-budgets .homei-budget-items .fi-select-input > div { min-height: 0; }
.homei-budgets .homei-budget-items .fi-select-input-btn { padding-block: 4px; padding-inline: 8px 26px; min-height: 30px; font-size: 13px; font-weight: 700; }
.homei-budgets .homei-budget-items .fi-select-input-value-remove-btn { display: none; }
.homei-budgets .homei-budget-items .fi-fo-field-wrp-error-message { font-size: var(--ho-text-xs); }
.homei-budgets .homei-budget-items .fi-select-input, .homei-budgets .homei-budget-items .fi-select-input * { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.homei-budgets .homei-budget-items .fi-fo-field-label-col { display: none; }
.homei-budgets .homei-budget-items .fi-fo-field { row-gap: 0; }

/* Changed and not saved yet · a quantity without a price · a due date passed with no confirmed completion. */
.homei-budgets .homei-budget-items .fi-input-wrp.hb-changed { background: var(--ho-warning-soft); box-shadow: 0 0 0 1px var(--ho-warning-line); }
.homei-budgets .homei-budget-items .fi-input-wrp.hb-missing { background: var(--ho-danger-soft); box-shadow: 0 0 0 1px var(--ho-danger-line); }
.homei-budgets .homei-budget-items .fi-input-wrp.hb-missing .fi-input { color: var(--ho-danger-ink); }
.homei-budgets .homei-budget-items .fi-input-wrp.hb-overdue .fi-input { color: var(--ho-danger-ink); font-weight: 700; }

.hb-row-total { display: block; font-weight: 800; color: var(--ho-brand-ink); font-variant-numeric: tabular-nums; white-space: nowrap; text-align: end; font-size: 13px; }

/* Media: two thumbnails and «+N»; no-file warnings shrink to their icon. */
.hb-media { display: flex; align-items: center; gap: 3px; min-width: 0; overflow: hidden; }
.hb-media > div { gap: 3px !important; flex-wrap: nowrap; }
.hb-media > div > a { flex: none; }
.hb-media > div > a:nth-of-type(n + 3), .hb-media > div > span { display: none !important; }
.hb-media img, .hb-media > div > a { height: 24px !important; width: 24px !important; border-radius: 6px !important; }
.hb-media .fi-badge { font-size: 0; padding: 2px; gap: 0; }
.hb-media .fi-badge .fi-icon { margin: 0; }
.hb-media-more, .hb-media--none { font-size: var(--ho-text-xs); color: var(--ho-brand-ink-muted); font-weight: 700; }

/* Pinned totals row, built live by construction-budget.js (beats the static first-cell rule above). */
.homei-budgets .homei-budget-items .hb-tfoot td, .hb-tfoot td {
  position: sticky; bottom: 0; z-index: 3; background: var(--ho-brand-soft); font-weight: 800; color: var(--ho-brand-ink);
  font-variant-numeric: tabular-nums; padding: 7px 5px; white-space: nowrap; font-size: 13px; border-top: 1px solid var(--ho-brand-line);
}
.hb-tfoot td.hb-end { text-align: end; }
.homei-budgets .homei-budget-items .hb-tfoot td:first-of-type { position: sticky; background: var(--ho-brand-soft); padding-inline-start: 14px; }
.hb-tfoot td.hb-accent { color: var(--ho-brand-accent-ink); }

/* ── Timeline + change log boards ────────────────────────────── */
.hb-board-panel { display: flex; flex-direction: column; }
.hb-scroll { overflow: auto; max-height: calc(100vh - var(--hb-grid-top, 330px)); min-height: 240px; scrollbar-gutter: stable; }
.hb-table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 13px; color: var(--ho-brand-ink); }
.hb-table th { position: sticky; top: 0; z-index: 2; background: var(--ho-brand-soft); color: var(--ho-brand-ink-muted); font-size: var(--ho-text-xs); font-weight: 700; padding: 7px 8px; text-align: start; white-space: nowrap; border-bottom: 1px solid var(--ho-brand-line); }
.hb-table td { padding: 0 8px; height: 36px; border-bottom: 1px solid var(--ho-brand-line); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-table th:first-child, .hb-table td:first-child { padding-inline-start: 14px; }
.hb-table .hb-end { text-align: end; }
.hb-num { font-variant-numeric: tabular-nums; }
.hb-strong { font-weight: 800; }
.hb-name { font-weight: 700; }
.hb-late { color: var(--ho-danger-ink); font-weight: 700; }
.hb-mat small { color: var(--ho-brand-ink-muted); font-size: var(--ho-text-xs); }
.hb-month td { height: 26px; background: color-mix(in srgb, var(--ho-brand-soft) 55%, transparent); font-size: var(--ho-text-xs); font-weight: 800; color: var(--ho-brand-ink-muted); }
.hb-tag { font-size: var(--ho-text-xs); font-weight: 700; border-radius: 999px; padding: 1px 9px; display: inline-block; }
.hb-tag--license { background: var(--ho-info-soft); color: var(--ho-info-ink); }
.hb-tag--construction { background: var(--ho-warning-soft); color: var(--ho-warning-ink); }
.hb-tag--finishing { background: var(--ho-success-soft); color: var(--ho-success-ink); }
.hb-foot { padding: 7px 14px; font-size: var(--ho-text-xs); color: var(--ho-brand-ink-muted); border-top: 1px solid var(--ho-brand-line); }
.hb-empty { padding: 28px; text-align: center; color: var(--ho-brand-ink-muted); }

.hb-log { list-style: none; margin: 0; padding: 0; }
.hb-log > li[data-hb-row] {
  display: grid; grid-template-columns: 56px 170px 70px minmax(0, 1fr) 190px; gap: 10px; align-items: center;
  padding: 0 14px; min-height: 42px; border-bottom: 1px solid var(--ho-brand-line); font-size: 13px; color: var(--ho-brand-ink);
}
.hb-log > li[hidden] { display: none !important; }
.hb-day { padding: 5px 14px; background: color-mix(in srgb, var(--ho-brand-soft) 55%, transparent); border-bottom: 1px solid var(--ho-brand-line); font-size: var(--ho-text-xs); font-weight: 800; color: var(--ho-brand-ink-muted); position: sticky; top: 0; z-index: 1; }
.hb-log-t { font-variant-numeric: tabular-nums; color: var(--ho-brand-ink-muted); font-size: 12px; }
.hb-log-u { display: flex; align-items: center; gap: 7px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-log-u i { width: 24px; height: 24px; border-radius: 50%; background: var(--ho-brand-soft); display: grid; place-items: center; font-style: normal; font-size: var(--ho-text-xs); font-weight: 800; flex: none; }
.hb-log-x { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-log-x:hover { white-space: normal; }
.hb-log-s { font-size: var(--ho-text-xs); color: var(--ho-brand-ink-muted); text-align: end; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-act { font-size: var(--ho-text-xs); font-weight: 800; border-radius: 999px; padding: 2px 9px; width: fit-content; }
.hb-act--edit { background: var(--ho-info-soft); color: var(--ho-info-ink); }
.hb-act--add { background: var(--ho-success-soft); color: var(--ho-success-ink); }
.hb-act--delete { background: var(--ho-danger-soft); color: var(--ho-danger-ink); }
.hb-act--view, .hb-act--action { background: var(--ho-brand-soft); color: var(--ho-brand-ink-muted); }
.hb-old { color: var(--ho-brand-ink-muted); text-decoration: line-through; unicode-bidi: isolate; }
.hb-new { font-weight: 800; unicode-bidi: isolate; }
.hb-arrow { color: var(--ho-brand-ink-muted); margin: 0 5px; }


/* ── Approved v5 layout details (25-9 review) ───────────────── */
/* Card header: the active panel's title on one side, the pills on the other. */
.homei-budget-edit .hb-board { position: relative; }
.homei-budget-edit .hb-board .fi-sc-tabs-tab, .homei-budget-edit .hb-board [role="tabpanel"], .homei-budget-edit .hb-board .fi-section,
.homei-budget-edit .hb-board .fi-grid-col, .homei-budget-edit .hb-board .fi-sc-component { position: static; }
.homei-budget-edit .hb-board > .fi-tabs, .homei-budget-edit .hb-board nav.fi-tabs { justify-content: flex-end; min-height: 52px; align-items: center; }
.hb-board-title {
  margin: 0; font-size: 18px; font-weight: 800; color: var(--hb-ink); display: flex; align-items: baseline; gap: 6px; white-space: nowrap;
}
.homei-budget-edit .hb-board .hb-board-title { position: absolute; top: 12px; inset-inline-start: 16px; z-index: 1; }
.hb-board-sub { font-size: var(--ho-text-xs); color: var(--hb-muted); font-weight: 600; }
.hb-board-sub b { color: var(--hb-muted); font-variant-numeric: tabular-nums; }
/* Pills: a section dot, the name, the count in bold — no bubble. */
.homei-budget-edit .hb-board .fi-tabs-item .fi-badge { background: transparent !important; color: inherit !important; box-shadow: none !important; padding: 0; font-weight: 800; font-size: 12px; }
.homei-budget-edit .hb-board .fi-tabs-item:nth-child(-n + 3)::before { content: ""; width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.homei-budget-edit .hb-board .fi-tabs-item:nth-child(1)::before { background: var(--ho-info-ink); }
.homei-budget-edit .hb-board .fi-tabs-item:nth-child(2)::before { background: var(--ho-warning-ink); }
.homei-budget-edit .hb-board .fi-tabs-item:nth-child(3)::before { background: var(--ho-success-ink); }
/* Chips + legend + the add-items search share one row. */
.homei-budgets .hb-section .fi-section-content { display: grid !important; grid-template-columns: minmax(0, 1fr) 380px; align-items: center; }
.homei-budgets .hb-section .fi-section-content > .fi-grid-col { grid-column: 1 / -1; }
.homei-budgets .hb-section .fi-section-content > .fi-grid-col:nth-child(1) { grid-column: 1; }
.homei-budgets .hb-section .fi-section-content > .fi-grid-col:nth-child(2) { grid-column: 2; padding: 8px 14px 8px 0 !important; }
.homei-budgets .hb-toolbar { padding: 8px 14px; }
/* Dates: the value only — no picker glyph; an empty date reads «—» until focused. */
.homei-budgets .homei-budget-items input[type="date"]::-webkit-calendar-picker-indicator { display: none; }
.homei-budgets .homei-budget-items .fi-input-wrp.hb-date-empty { position: relative; }
.homei-budgets .homei-budget-items .fi-input-wrp.hb-date-empty input { color: transparent; }
.homei-budgets .homei-budget-items .fi-input-wrp.hb-date-empty::after { content: "—"; position: absolute; inset: 0; display: grid; place-items: center; color: var(--ho-brand-ink-muted); pointer-events: none; }
/* The line under the grid. */
.hb-grid-hint { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 14px; font-size: var(--ho-text-xs); color: var(--ho-brand-ink-muted); border-top: 1px solid var(--ho-brand-line); }
.hb-grid-hint .hb-chip { cursor: default; }
/* Row delete: the design's quiet grey bin, red only on hover. */
.homei-budgets .homei-budget-items td:last-child .fi-icon-btn { color: var(--ho-brand-ink-muted); opacity: .75; }
.homei-budgets .homei-budget-items td:last-child .fi-icon-btn:hover { color: var(--ho-danger-ink); opacity: 1; }
/* ── The budgets list (BUDGET-LIST-1) ────────────────────────── */
.homei-budget-list .fi-header .fi-ac .fi-btn.fi-color-primary { background: var(--hb-accent); color: var(--ho-brand-on-accent); }
.homei-budget-list .fi-page-content > .fi-sc, .homei-budget-list .fi-page-content .fi-sc.fi-sc-has-gap { gap: 12px; }
.homei-budget-list .fi-tabs {
  display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0; border: 0; background: transparent; box-shadow: none; max-width: none; justify-content: flex-start;
}
.homei-budget-list .fi-tabs-item {
  border: 1px solid var(--hb-line); border-radius: 999px; padding: 4px 13px; min-height: 0; gap: 7px;
  background: var(--hb-card); color: var(--hb-ink); font-weight: 700; font-size: 13px;
}
.homei-budget-list .fi-tabs-item.fi-active, .homei-budget-list .fi-tabs-item[aria-selected="true"] { background: var(--hb-ink); border-color: var(--hb-ink); color: var(--hb-card); border-bottom-color: var(--hb-ink); }
.homei-budget-list .fi-tabs-item .fi-tabs-item-label { color: inherit; }
.homei-budget-list .fi-ta-ctn { border: 1px solid var(--hb-line); border-top: 3px solid var(--hb-info); border-radius: 14px; box-shadow: none; }
.homei-budget-list .fi-ta-content-ctn { overflow-y: auto; overflow-x: hidden; max-height: calc(100vh - var(--hb-grid-top, 380px)); min-height: 200px; }
.homei-budget-list .fi-ta-table { table-layout: auto; width: 100%; }
.homei-budget-list .fi-ta-table thead th { position: sticky; top: 0; z-index: 2; background: var(--hb-soft); }
.homei-budget-list .fi-ta-header-cell { padding: 9px 6px; font-size: var(--ho-text-xs); white-space: nowrap; line-height: 1.3; color: var(--hb-muted); vertical-align: bottom; }
.homei-budget-list .fi-ta-header-cell-label, .homei-budget-list .fi-ta-header-cell button { font-size: var(--ho-text-xs); white-space: normal; text-align: start; }
.homei-budget-list .fi-ta-cell { padding: 0; }
.homei-budget-list .fi-ta-col { padding: 0; }
.homei-budget-list .fi-ta-text, .homei-budget-list .fi-ta-col > div { padding: 6px 5px !important; }
.homei-budget-list .fi-ta-text-item, .homei-budget-list .fi-ta-text-item-label { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.homei-budget-list .fi-ta-text-description, .homei-budget-list .fi-ta-col-description { font-size: var(--ho-text-xs); }
.homei-budget-list .fi-ta-summary-row, .homei-budget-list tr.fi-ta-summary-row-ctn, .homei-budget-list .fi-ta-summary-header-row { background: var(--hb-soft); }
.homei-budget-list .fi-ta-table tbody tr:last-child td, .homei-budget-list .fi-ta-summary-row td { font-weight: 800; }
.homei-budget-list .fi-ta-summary-row td, .homei-budget-list .fi-ta-row.fi-ta-summary-row td { position: sticky; bottom: 0; z-index: 2; background: var(--hb-soft); }
.hb-exec { min-width: 92px; }
.hb-exec-bar { height: 6px; border-radius: 6px; background: var(--hb-soft); overflow: hidden; }
.hb-exec-bar i { display: block; height: 100%; background: var(--ho-success-ink); border-radius: 6px; }
.hb-exec small { font-size: var(--ho-text-xs); color: var(--hb-muted); white-space: nowrap; }


/* Approved list design (26-9 review): one card — title + pills, legend + search, the table. */
.homei-budget-list .hb-list-tabs {
  display: flex !important; flex-direction: row !important; flex-wrap: nowrap; align-items: center; text-align: start; gap: 8px; background: var(--hb-card); border: 1px solid var(--hb-line); border-top: 3px solid var(--hb-info);
  border-bottom: 0; border-radius: 14px 14px 0 0; padding: 10px 16px; margin-bottom: -12px;
}
.homei-budget-list .hb-list-tabs::before { content: attr(data-hb-title); font-size: 18px; font-weight: 800; color: var(--hb-ink); order: 0; }
.homei-budget-list .hb-list-tabs::after { content: attr(data-hb-sub); font-size: var(--ho-text-xs); font-weight: 600; color: var(--hb-muted); order: 1; }
.homei-budget-list .hb-list-tabs > * { order: 2; margin-inline-start: auto; }
.homei-budget-list .fi-tabs-item .fi-badge { background: transparent !important; color: inherit !important; box-shadow: none !important; padding: 0; font-weight: 800; font-size: 12px; }
.homei-budget-list .fi-ta-ctn { border-top: 1px solid var(--hb-line); border-radius: 0 0 14px 14px; }
.homei-budget-list .fi-ta-header-ctn { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.homei-budget-list .fi-ta-header { padding: 8px 16px; border: 0; }
.homei-budget-list .fi-ta-header-toolbar { border: 0; padding-block: 8px; }
.hb-legend-license { background: var(--ho-info-ink); } .hb-legend-construction { background: var(--ho-warning-ink); } .hb-legend-finishing { background: var(--ho-success-ink); }
.homei-budget-list :is(.fi-ta-cell-license-est-sum, .fi-ta-cell-construction-est-sum, .fi-ta-cell-finishing-est-sum) .fi-ta-text-item::after {
  content: ""; display: inline-block; width: 3px; height: 14px; border-radius: 2px; vertical-align: middle; margin-inline-start: 6px; opacity: .85;
}
.homei-budget-list .fi-ta-cell-license-est-sum .fi-ta-text-item::after { background: var(--ho-info-ink); }
.homei-budget-list .fi-ta-cell-construction-est-sum .fi-ta-text-item::after { background: var(--ho-warning-ink); }
.homei-budget-list .fi-ta-cell-finishing-est-sum .fi-ta-text-item::after { background: var(--ho-success-ink); }
.homei-budget-list :is(.fi-ta-header-cell-license-est-sum, .fi-ta-header-cell-construction-est-sum, .fi-ta-header-cell-finishing-est-sum) { box-shadow: inset 0 -2px 0 var(--hb-accent); }
.homei-budget-list .fi-ta-summary-row-heading-cell { font-size: 0 !important; }
.homei-budget-list .fi-ta-summary-row-heading-cell * { font-size: 0 !important; }
html[lang="ar"] .homei-budget-list .fi-ta-summary-row-heading-cell::after { content: "الإجمالي"; }
html:not([lang="ar"]) .homei-budget-list .fi-ta-summary-row-heading-cell::after { content: "Total"; }
.homei-budget-list .fi-ta-summary-row-heading-cell::after { font-size: 14px; font-weight: 800; color: var(--hb-ink); padding-inline-start: 5px; }
.homei-budget-list .fi-ta-summary-row td:nth-last-child(2) .fi-ta-text-summary { color: var(--hb-accent-ink); }
.homei-budget-list .fi-ta-table tbody tr td { height: 46px; }
.homei-budget-list .fi-ta-text-has-descriptions { gap: 0 !important; line-height: 1.3; }
.homei-budget-list .fi-ta-text-description { margin: 0; }

/* Narrow screens: the strip wraps, the grid keeps its own scroll. */
@media (max-width: 1100px) {
  .hb-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hb-kpi:nth-child(4) { border-inline-start: 0; }
  .hb-kpi:nth-child(n + 4) { border-top: 1px solid var(--hb-line); }
  .homei-budgets .homei-budget-items > table { min-width: 1080px; }
  .hb-table { min-width: 900px; }
  .hb-log > li[data-hb-row] { grid-template-columns: 48px 130px 64px minmax(0, 1fr); }
  .hb-log-s { display: none; }
}