/* ---------- Data Staging / Product Import ---------- */
  .import-mode-tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
  .import-mode-tabs .btn.active{background:var(--accent);color:#fff;border-color:var(--accent-dark)}
  .stg-session-list{display:flex;flex-direction:column;gap:8px;margin:12px 0}
  .stg-session{
    border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);
    /* overflow:hidden breaks position:sticky for .stg-batch-bar — keep visible */
    overflow:visible;
  }
  .stg-session-body{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:0;
    min-width:0;
  }
  .stg-session-scroll{
    display:flex;
    flex-direction:column;
    min-width:0;
  }
  .stg-session-head{
    display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;background:var(--surface);
    border-bottom:1px solid var(--line-soft);cursor:pointer;
  }
  .stg-session-head:hover{background:var(--accent-tint)}
  .stg-session-head .stg-name{font-weight:700;font-size:13px;flex:1;min-width:120px}
  .stg-tree{padding:8px 10px 12px}
  .stg-month{margin-bottom:14px}
  .stg-month-head{font-weight:700;font-size:12.5px;color:var(--accent-dark);padding:6px 0;display:flex;align-items:center;gap:8px}
  .stg-period{margin-left:4px;border-left:1px solid #e5e7eb;padding-left:12px;margin-bottom:12px}
  .stg-period-head{font-size:12px;color:var(--ink-soft);padding:4px 0 8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}

  /* ===== Staging tables — MUST match working monolith (auto layout) =====
     table-layout:fixed + colgroup + overflow:hidden caused blank white header cells.
     Force auto even if an older stylesheet or cached rule tries fixed. */
  .stg-table,.staging-table{
    width:100%;
    table-layout:auto !important;
    border-collapse:collapse;
    font-size:12px;
    margin-top:0;
    background:var(--surface);
  }
  /* Neutralize leftover <colgroup> from older builds */
  .stg-table > colgroup col,
  .stg-table col.stg-col-check,
  .stg-table col.stg-col-name,
  .stg-table col.stg-col-doc,
  .stg-table col.stg-col-num,
  .stg-table col.stg-col-actions{
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
  }
  .stg-table th,.stg-table td,
  .staging-table th,.staging-table td{
    border:1px solid #e5e7eb;
    padding:4px 6px;
    vertical-align:middle;
  }
  .stg-table thead th,.staging-table thead th{
    background:var(--paper);
    font-weight:600;
    color:var(--ink-soft) !important;
    font-size:11px !important;
    line-height:1.35 !important;
    position:sticky;top:0;z-index:2;
    box-shadow:0 1px 0 var(--line);
    white-space:nowrap;
    overflow:visible !important;
    text-overflow:clip !important;
    opacity:1 !important;
    visibility:visible !important;
  }
  .stg-table tfoot td,.staging-table tfoot td{
    position:sticky;bottom:0;z-index:3;background:var(--paper);font-weight:700;
    box-shadow:0 -1px 0 var(--line);padding:5px 6px;
  }
  .stg-table .stg-num,.stg-table th.stg-num{
    text-align:center;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap;
  }
  .stg-table .stg-check,.stg-table th.stg-check{width:1%;text-align:center;vertical-align:middle}
  .stg-table .stg-name,.stg-table th.stg-name{text-align:left}
  .stg-table .stg-actions,.stg-table th.stg-actions{white-space:nowrap}
  .stg-table th.stg-doc,.stg-table td.stg-doc{
    white-space:nowrap;font-size:12px;font-family:var(--mono);font-variant-numeric:tabular-nums;
  }
  .stg-table td.stg-doc-empty{color:var(--ink-soft);font-family:var(--sans)}

  .stg-table input.stg-cell-input{
    width:100%;min-width:0;max-width:100%;box-sizing:border-box;
    height:28px;border:1px solid var(--line);border-radius:4px;
    padding:0 6px;background:var(--paper);font:inherit;
  }
  .stg-table input.stg-cell-input:focus{
    outline:2px solid var(--accent);background:#fff;border-color:var(--accent);
  }
  .stg-table input.stg-cell-input.stg-doc-input{font-family:var(--mono);font-size:12px;min-width:72px}
  .stg-table input.stg-cell-input.stg-num-input{font-family:var(--mono);text-align:right;min-width:56px}
  .stg-table input.stg-cell-input.stg-name-input{min-width:100px}
  .stg-table input.stg-cell-input[list]{
    background-image:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),
                     linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%);
    background-position:calc(100% - 9px) calc(50% + 1px),calc(100% - 5px) calc(50% + 1px);
    background-size:4px 4px,4px 4px;background-repeat:no-repeat;
    padding-right:16px;
  }

  .stg-table tr.stg-row-selected td{background:#DCEAE6}
  .stg-table tr.stg-row-picked td{background:var(--accent-tint)}
  .stg-table tr.stg-row-known > td,
  .stg-table tr.stg-row-done > td,
  .stg-table tr.matched-item > td,
  .staging-table tr.matched-item > td{
    background-color:#f0fdf4 !important;
    opacity:1;
  }
  .stg-table tr.stg-row-known.stg-row-selected > td,
  .stg-table tr.stg-row-done.stg-row-selected > td{
    background-color:#dcfce7 !important;
  }
  .stg-table tr.stg-row-unknown > td{
    background-color:#f3f4f6 !important;
    box-shadow:none !important;
  }
  .stg-table tr.stg-row-unknown.stg-row-selected > td{
    background-color:#e5e7eb !important;
  }
  .stg-table tr.stg-row-partial > td{background:#f9fafb}
  .stg-table tr.stg-row-hum > td{background:#FBF2DE}
  .stg-table tbody tr.stg-row-done:hover > td{background-color:#e7f8ec !important}
  tr.stg-row-manual > td{background:#F8FBF9}

  .stg-view-tabs{display:flex;flex-wrap:nowrap;gap:4px;margin:0;align-items:center}
  .stg-view-tabs .btn.active{background:var(--accent);color:#fff;border-color:var(--accent-dark)}
  .stg-wo-cat{font-size:11.5px;color:var(--ink-soft);margin-left:6px}

  /* matched accordion */
  .stg-matched-block{
    border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);
    margin-top:10px;overflow:hidden;
  }
  .stg-matched-head-row{
    display:flex;align-items:center;justify-content:flex-start;gap:10px;
    flex-wrap:nowrap;width:100%;min-width:0;
  }
  .stg-matched-head-row .stg-matched-toggle{flex:1;min-width:200px}
  .stg-matched-toggle{
    display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:100%;
    padding:8px 10px;border:none;background:var(--accent-tint);cursor:pointer;
    font:inherit;color:var(--accent-dark);text-align:left;font-weight:600;font-size:12.5px;
  }
  .stg-matched-toggle:hover{background:#dceae6}
  .stg-matched-body{padding:0 6px 8px;background:var(--surface)}
  .stg-matched-body table.stg-table{margin-top:0}
  .stg-acc-arrow{font-size:11px;width:14px;flex-shrink:0;color:var(--accent-dark)}
  .stg-matched-toggle:focus-visible,
  .stg-matched-head-row .btn:focus-visible,
  table.stg-table th.sortable:focus-visible{
    outline:2px solid var(--accent);outline-offset:-2px;
  }
  table.stg-table th.sortable{cursor:pointer;user-select:none}
  table.stg-table th.sortable:hover{color:var(--accent-dark)}
  table.stg-table th.sorted{color:var(--accent-dark)}

  .stg-vtable-scroll{
    max-height:none;overflow:visible;
    border:1px solid var(--line);border-radius:var(--radius);
    background:var(--surface);position:relative;
  }
  .stg-vtable-scroll.stg-vtable-scroll--contained{max-height:min(60vh,520px);overflow:auto}
  .stg-vtable-scroll > table.stg-table{margin-top:0}
  .stg-vtable-scroll thead th{
    position:sticky;top:0;z-index:10;
    background-color:var(--paper,#F7F6F2);background:var(--paper,#F7F6F2);
    box-shadow:0 1px 0 var(--line,#DEDAD0);
    color:var(--ink-soft) !important;font-size:11px !important;
  }
  .stg-vtable-scroll tr.stg-vspacer > td{
    padding:0 !important;border:none !important;height:0;
    line-height:0;font-size:0;background:transparent !important;
  }
  .stg-vtable-meta{font-size:11px;color:var(--ink-soft);padding:4px 8px 0;text-align:right}
  .stg-matched-body .stg-vtable-scroll{margin-top:0}
  .stg-inv-group-head td{
    background:#E8F2EF !important;
    font-size:15px !important;
    color:var(--accent-dark) !important;
    font-weight:800 !important;
    padding:10px 14px !important;
    border-top:2px solid var(--accent) !important;
    border-bottom:1px solid var(--line) !important;
    letter-spacing:.02em;line-height:1.4;
  }
  .stg-inv-group-label{font-weight:800;opacity:1;margin-right:4px;font-size:15px}
  .stg-inv-group-nums{font-family:var(--mono);font-weight:800;font-size:15px}
  .stg-inv-group-dates,.stg-inv-group-dog{font-weight:800;opacity:1;font-size:15px}
  .stg-inv-group-sep{opacity:.5;margin:0 2px}
  .stg-inv-group-contractor{
    font-weight:600;font-size:13.5px;color:var(--accent-dark);
    margin-left:12px;opacity:.95;white-space:nowrap;
  }
  .stg-inv-group-inner{
    display:inline-flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px 10px;
    width:100%;
  }
  .stg-inv-group-apply{
    flex:0 0 auto;
    margin:0;
    margin-right:4px;
    vertical-align:middle;
  }


  /* Matched name cell: name left, status badges (✓ розподілено / ручна) flushed right */
  .stg-table-matched td.stg-name-matched{
    min-width:0;
  }
  .stg-table-matched td.stg-name-matched .stg-name-matched-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    width:100%;
    min-width:0;
  }
  .stg-table-matched td.stg-name-matched .stg-name-text{
    flex:1 1 auto;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .stg-table-matched td.stg-name-matched .stg-name-badges{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-left:auto;
  }
  .stg-table-matched td.stg-name-matched .stg-name-badges .badge{
    white-space:nowrap;
  }

  /* Підібрані: блок «№, дата, договір» + окремо к-сть/ціна/сума */
  .stg-table-matched td.stg-inv-meta{
    white-space:nowrap;vertical-align:middle;min-width:14rem;max-width:28rem;
  }
  .stg-inv-meta-block{
    display:inline-flex;align-items:center;flex-wrap:nowrap;gap:4px;
    min-width:0;max-width:100%;
  }
  .stg-inv-meta-sep{color:var(--ink-soft);font-weight:600;flex-shrink:0;user-select:none}
  .stg-inv-meta-row{display:inline-flex;align-items:center;min-width:0}
  .stg-inv-meta-no input.stg-inv-no-input,
  .stg-inv-meta-no .stg-inv-no-text{
    font-family:var(--mono);font-weight:700;font-size:13px;color:var(--ink);
    white-space:nowrap;min-width:5.5rem;max-width:12rem;
  }
  .stg-inv-meta-date input.stg-inv-date-input,
  .stg-inv-meta-date .stg-inv-date-text{
    font-family:var(--mono);font-size:12px;color:var(--ink-soft);
    white-space:nowrap;min-width:5.5rem;max-width:9rem;
  }
  .stg-inv-meta-dog input.stg-inv-dog-input,
  .stg-inv-meta-dog .stg-inv-dog-text{
    font-family:var(--mono);font-size:12px;color:var(--ink);
    white-space:nowrap;min-width:3.5rem;max-width:8rem;
  }
  .stg-inv-meta-dog-label{font-size:11px;color:var(--ink-soft);font-weight:600;margin-right:2px}
  .stg-table-matched th.stg-th-inv-meta{min-width:14rem;white-space:nowrap}
  .stg-matched-toggle{font-size:13.5px}
  .stg-row-matched > td{background:#F4FAF7}
  /* Flex only on non-td containers / inner bars — never on <td class="stg-actions"> */
  .stg-actions:not(td){display:flex;flex-wrap:wrap;gap:4px;align-items:center}
  td.stg-actions,
  td.stg-actions-matched{display:table-cell !important}
  .stg-k-label{
    display:inline;font-size:12px;font-weight:600;color:var(--accent-dark);
    background:none;border:none;padding:0;margin-left:4px;
  }
  .stg-datalist-host{
    position:absolute;width:0;height:0;overflow:hidden;clip:rect(0,0,0,0);pointer-events:none;
  }
  @media (max-width:900px){
    .stg-matched-head-row{flex-wrap:wrap}
    .stg-matched-head-row .stg-matched-toggle{flex:1 1 100%;min-width:0}
  }
  body.focus-mode-active .stg-matched-toggle{padding:5px 8px;font-size:12px}
  body.focus-mode-active .stg-vtable-meta{padding:2px 6px 0}


/* ===== Header visibility hard-fix (blank white thead band) =====
   Sticky thead under period toolbar used top:52px; matched tables also
   inherited it and left a blank paper strip. Matched body thead sticks at 0.
   Force readable text regardless of earlier rules. */
.stg-table thead th,
.stg-vtable-scroll thead th,
.stg-matched-body table.stg-table thead th{
  color: var(--ink-soft, #5B6460) !important;
  background: var(--paper, #F7F6F2) !important;
  background-color: var(--paper, #F7F6F2) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
  text-indent: 0 !important;
  min-height: 28px;
}
/* Matched accordion table is nested; period sticky offset must not apply here */
.stg-matched-body table.stg-table thead th,
.stg-matched-body .stg-vtable-scroll thead th{
  top: 0 !important;
  z-index: 4;
}
.stg-period.stg-period-locked .stg-matched-body table.stg-table thead th,
.stg-period:has(> .stg-period-head-row.is-sticky-match) .stg-matched-body table.stg-table thead th,
.stg-period.stg-period-locked .stg-matched-body .stg-vtable-scroll thead th,
.stg-period:has(> .stg-period-head-row.is-sticky-match) .stg-matched-body .stg-vtable-scroll thead th{
  top: 0 !important;
}

/* ===== Contractor validators (period balance) — production table ===== */
.stg-val-card{
  background: var(--paper, #fff);
  border: 1px solid var(--border, #e4e7ec);
  border-radius: 10px;
  padding: 12px 14px;
  margin: 0 0 12px;
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
}
.stg-val-card.is-ok{ border-color: #abefc6; background: #f6fef9; }
.stg-val-card.is-warn{ border-color: #fecd89; background: #fffcf5; }
.stg-val-card.is-fix{ border-color: #fcd34d; background: #fffbeb; }

.stg-val-header{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 8px;
}
.stg-val-identity{ min-width: 160px; flex: 1 1 180px; }
.stg-val-name{
  font-size: 14px;
  font-weight: 650;
  color: var(--ink, #1a1d1a);
  line-height: 1.3;
  word-break: break-word;
}
.stg-val-edrpou{
  display: inline-block;
  margin-top: 2px;
  font-size: 11px;
  color: var(--ink-soft, #667085);
  font-variant-numeric: tabular-nums;
}

.stg-val-totals{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: center;
  font-variant-numeric: tabular-nums;
}
.stg-val-metric{
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 72px;
}
.stg-val-metric-label{
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--ink-soft, #667085);
}
.stg-val-metric-value{
  font-size: 13px;
  font-weight: 650;
  color: var(--ink, #1a1d1a);
}
.stg-val-metric-value.is-ok{ color: #027a48; }
.stg-val-metric-value.is-warn{ color: #b54708; }
.stg-val-metric-value.is-bad{ color: #b42318; }
.stg-val-status-hint{
  font-weight: 500;
  font-size: 11px;
  color: var(--ink-soft, #667085);
}
.stg-val-actions{ margin-left: 4px; }
.stg-val-batch-btn{ white-space: nowrap; }

.stg-val-alert{
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 6px;
  margin-bottom: 8px;
}
.stg-val-alert.is-warn{ background: #fff4e5; color: #b54708; }
.stg-val-alert.is-ok{ background: #ecfdf3; color: #027a48; }

.stg-val-table-wrap{
  /* Grow into available space next to «За договорами»; no artificial max-width */
  overflow-x: auto; /* fallback only on very narrow viewports */
  margin: 0;
  border-radius: 8px;
  border: 1px solid var(--border, #e4e7ec);
  max-width: none;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.stg-val-table{
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
/* Flexible columns — fill wrap width, avoid forced horizontal scroll */
.stg-val-cg-no{ width: 14%; min-width: 64px; }
.stg-val-cg-date{ width: 12%; min-width: 72px; }
.stg-val-cg-dog{ width: 12%; min-width: 48px; }
.stg-val-cg-s{ width: 14%; min-width: 64px; }
.stg-val-cg-db{ width: 14%; min-width: 64px; }
.stg-val-cg-delta{ width: 14%; min-width: 64px; }
.stg-val-cg-status{ width: 20%; min-width: 80px; }
.stg-val-col-dog{
  font-family: var(--mono, ui-monospace, monospace);
  font-weight: 600;
  white-space: nowrap;
  color: var(--accent-dark, #1a4d3e);
}

.stg-val-table thead th{
  background: var(--paper-2, #f9fafb) !important;
  color: var(--ink-soft, #5B6460) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  text-align: left;
  padding: 5px 8px;
  border-bottom: 1px solid var(--border, #e4e7ec);
  white-space: nowrap;
}
.stg-val-table thead th.stg-num{ text-align: right; }
.stg-val-table tbody td{
  padding: 4px 8px;
  border-bottom: 1px solid var(--border-subtle, #f2f4f7);
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stg-val-table tbody tr:last-child td{ border-bottom: none; }
.stg-val-table tbody tr:hover{ background: rgba(0,0,0,.02); }
.stg-val-row-fix{ background: #fffbeb; }
.stg-val-row-fix:hover{ background: #fef3c7 !important; }

.stg-val-col-no{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stg-val-inv-num{ font-weight: 600; color: var(--ink, #1a1d1a); }
.stg-val-col-date{
  white-space: nowrap;
  color: var(--ink-soft, #667085);
  font-size: 11px;
}
.stg-val-col-s,
.stg-val-col-db,
.stg-val-col-delta{
  text-align: right;
  white-space: nowrap;
}
.stg-val-col-status{
  white-space: nowrap;
  text-align: left;
}

.stg-val-table .stg-num.is-ok{ color: #027a48; }
.stg-val-table .stg-num.is-warn{ color: #b54708; font-weight: 600; }
.stg-val-table .stg-num.is-bad{ color: #b42318; font-weight: 600; }

.stg-inv-badge{
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 999px;
  background: #eef2f6;
  color: #344054;
  white-space: nowrap;
}
.stg-inv-badge.warn{ background: #fff4e5; color: #b54708; }
.stg-inv-badge.ok{ background: #ecfdf3; color: #027a48; }
.stg-inv-badge.muted{ background: #f2f4f7; color: #667085; }
.stg-inv-badge.fix{ background: #fef3c7; color: #92400e; }

/* Legacy (kept for any residual markup) */
.stg-val-invoices{margin-top:6px;padding-top:4px;border-top:1px dashed var(--border, #d0d5dd);font-size:11px;}
.stg-val-inv-head{margin-bottom:2px;font-weight:600;}
.stg-val-inv-row{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;padding:2px 0;}
.stg-val-inv-sums{display:inline-flex;gap:8px;font-variant-numeric:tabular-nums;}


  /* Token (213_10.02.2025_6) for matched invoice block */
  .stg-inv-token-view{
    display:inline-block;font-family:var(--mono);font-weight:800;font-size:14px;
    color:var(--accent-dark);white-space:nowrap;letter-spacing:.02em;
    background:#E8F2EF;border:1px solid var(--accent);border-radius:6px;
    padding:3px 10px;line-height:1.35;
  }
  .stg-table-matched td.stg-inv-meta{min-width:11rem;max-width:22rem}


/* Підібрані: без колонки №/дата/дог. — назва + суми на всю ширину */
.stg-table-matched{width:100%;table-layout:auto}

.stg-table-matched th.stg-num,
.stg-table-matched td.stg-num{width:1%;white-space:nowrap;padding-left:12px;padding-right:12px}
.stg-table-matched th.stg-actions,
.stg-table-matched td.stg-actions{width:1%;white-space:nowrap}
.stg-table-matched .stg-check{width:1%}


/* Matched row actions in one horizontal line.
   NEVER set display:flex/inline-flex on <td> — it breaks table-cell
   background fill and leaves white gaps. Flex lives on the inner bar. */
.stg-actions.stg-actions-inline{
  display:inline-flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center;
  gap:4px;
  white-space:nowrap;
  vertical-align:middle;
}
.stg-table-matched td.stg-actions,
.stg-table-matched td.stg-actions-matched{
  display:table-cell !important;
  vertical-align:middle !important;
  white-space:nowrap;
  text-align:right;
}
.stg-table-matched .stg-act-btn{
  height:26px;min-height:26px;padding:0 8px;font-size:12px;line-height:24px;
  flex-shrink:0;
}
.stg-table-matched{
  width:100%;
  table-layout:fixed;
  border-collapse:collapse;
}
.stg-table-matched col.stg-col-check{width:2.5%}
.stg-table-matched th.stg-check,
.stg-table-matched td.stg-check{width:2.5%;padding:6px 4px}
.stg-table-matched th.stg-name,
.stg-table-matched td.stg-name,
.stg-table-matched tbody tr.stg-row-matched > td:nth-child(2){
  width:42%;min-width:0;text-align:left;
}
.stg-table-matched th.stg-num,
.stg-table-matched td.stg-num{
  width:9%;text-align:right;white-space:nowrap;
  font-variant-numeric:tabular-nums;padding:6px 10px;
}
.stg-table-matched th.stg-actions,
.stg-table-matched td.stg-actions{width:14%;text-align:right}
.stg-table-matched thead th{
  font-size:12px;font-weight:600;padding:8px 10px;
}
.stg-table-matched tbody td{padding:8px 10px;vertical-align:middle}
.stg-row-matched > td{background:#F4FAF7}


/* ========== Підібрані позиції — layout & actions ========== */
.stg-table-matched{
  width:100% !important;
  table-layout:fixed !important;
  border-collapse:collapse !important;
}
.stg-table-matched col.stg-m-check{width:36px}
.stg-table-matched col.stg-m-name{width:auto}
.stg-table-matched col.stg-m-num{width:96px}
.stg-table-matched col.stg-m-act{width:250px}

.stg-table-matched thead th{
  font-size:12px !important;
  font-weight:600 !important;
  color:var(--ink-soft) !important;
  background:#EEF6F3 !important;
  border-bottom:1px solid #C5D9D2 !important;
  padding:9px 12px !important;
  text-align:left;
}
.stg-table-matched thead th.stg-num{text-align:right}
.stg-table-matched thead th.stg-actions,
.stg-table-matched thead th:last-child{
  width:250px !important;
  text-align:right !important;
  background:#EEF6F3 !important;
}

/* uniform row tint — including actions cell */
.stg-table-matched tbody tr.stg-row-matched > td,
.stg-table-matched tbody tr.stg-row-done > td,
.stg-table-matched tbody tr.matched-item > td{
  background:#F4FAF7 !important;
  border-bottom:1px solid #D7E6E0 !important;
  padding:10px 12px !important;
  vertical-align:middle !important;
}
.stg-table-matched tbody tr.stg-row-matched:hover > td,
.stg-table-matched tbody tr.stg-row-done:hover > td{
  background:#EAF5F0 !important;
}

.stg-table-matched td.stg-check,
.stg-table-matched th.stg-check{width:36px !important}

.stg-table-matched td.stg-name,
.stg-table-matched th.stg-name{
  width:auto !important;
  text-align:left !important;
}

.stg-table-matched td.stg-num,
.stg-table-matched th.stg-num{
  width:96px !important;
  text-align:right !important;
  white-space:nowrap !important;
  font-family:var(--mono, ui-monospace, monospace);
  font-variant-numeric:tabular-nums;
  font-size:13px;
}

/* actions: table-cell keeps bg; inner bar is flex row.
   display MUST stay table-cell so background paints the full cell
   (no white strip next to the buttons). */
.stg-table-matched td.stg-actions,
.stg-table-matched td.stg-actions-matched{
  display:table-cell !important;
  width:250px !important;
  min-width:250px !important;
  background:#F4FAF7 !important;
  background-color:#F4FAF7 !important;
  text-align:right !important;
  white-space:nowrap !important;
  vertical-align:middle !important;
  padding:10px 12px !important;
  box-sizing:border-box !important;
}
.stg-table-matched tbody tr.stg-row-matched > td.stg-actions,
.stg-table-matched tbody tr.stg-row-matched > td.stg-actions-matched,
.stg-table-matched tbody tr.stg-row-done > td.stg-actions,
.stg-table-matched tbody tr.stg-row-done > td.stg-actions-matched,
.stg-table-matched tbody tr.matched-item > td.stg-actions,
.stg-table-matched tbody tr.matched-item > td.stg-actions-matched{
  background:#F4FAF7 !important;
  background-color:#F4FAF7 !important;
}
.stg-table-matched tbody tr.stg-row-matched:hover > td.stg-actions,
.stg-table-matched tbody tr.stg-row-matched:hover > td.stg-actions-matched,
.stg-table-matched tbody tr.stg-row-done:hover > td.stg-actions,
.stg-table-matched tbody tr.stg-row-done:hover > td.stg-actions-matched{
  background:#EAF5F0 !important;
  background-color:#EAF5F0 !important;
}
.stg-actions-bar{
  display:inline-flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:6px !important;
  vertical-align:middle;
  width:100%;
  box-sizing:border-box;
}

/* chip buttons */
.stg-chip{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  height:28px !important;
  min-height:28px !important;
  padding:0 11px !important;
  margin:0 !important;
  border-radius:8px !important;
  font-size:12px !important;
  font-weight:600 !important;
  line-height:1 !important;
  cursor:pointer;
  border:1px solid transparent;
  box-sizing:border-box;
  white-space:nowrap;
  font-family:inherit;
}
.stg-chip-primary{
  background:#1F6B57 !important;
  color:#fff !important;
  border-color:#175445 !important;
}
.stg-chip-primary:hover{background:#175445 !important}
.stg-chip-ghost{
  background:#fff !important;
  color:#1F6B57 !important;
  border-color:#A8C9BE !important;
}
.stg-chip-ghost:hover{background:#E8F2EF !important}
.stg-chip-danger{
  background:#fff !important;
  color:#B42318 !important;
  border-color:#F0B0A8 !important;
}
.stg-chip-danger:hover{background:#FEF3F2 !important}

.stg-inv-group-head td{
  background:#E8F2EF !important;
  font-size:14px !important;
  font-weight:800 !important;
  color:var(--accent-dark, #1F6B57) !important;
  padding:10px 14px !important;
  border-top:2px solid var(--accent, #1F6B57) !important;
  border-bottom:1px solid #C5D9D2 !important;
}


/* Invoice + contract aggregation side by side */
.stg-val-tables-row{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 16px 24px;
  margin-top: 4px;
}
.stg-val-tables-row > .stg-val-table-wrap{
  flex: 1 1 0; /* take all free space beside dog table */
  min-width: 0;
  max-width: none;
}
.stg-val-dog-wrap{
  flex: 0 0 auto;
  margin-top: 0;
  min-width: 160px;
  max-width: 260px;
}
.stg-val-dog-caption{
  font-size: 12px;
  font-weight: 700;
  color: var(--ink-soft, #5c6b66);
  margin: 0 0 6px 2px;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.stg-val-dog-table{
  width: 100%;
}
.stg-val-cg-dog-no{ width: 60%; }
.stg-val-cg-dog-sum{ width: 40%; }
.stg-val-col-dog-no{
  font-family: var(--mono, ui-monospace, monospace);
  font-weight: 700;
  white-space: nowrap;
}
.stg-val-dog-num{ font-weight: 700; }
.stg-val-dog-count{ font-weight: 500; font-size: 11px; margin-left: 2px; }
.stg-val-col-dog-sum{ font-weight: 600; }


/* Contract aggregation status colors */
.stg-val-dog-row.is-matched td{
  background: #ecfdf3 !important;
  color: #027a48;
  font-weight: 700;
}
.stg-val-dog-row.is-matched .stg-val-dog-num{
  color: #027a48;
}
.stg-val-dog-row.is-partial td{
  background: #fffbeb !important;
  color: #b54708;
  font-weight: 600;
}
.stg-val-dog-row.is-pending td{
  background: transparent;
  color: var(--ink-soft, #5c6b66);
  font-weight: 500;
}
.stg-val-dog-row.is-pending .stg-val-dog-num{
  opacity: .85;
}