/* css/customer-polish-1028.css: paying-customer polish (2026-10-28). Design tokens only (css/styles.css is frozen).
 * Everything is scoped to body.cp-on, which js/customer-polish-1028.js adds (kill switch: localStorage customer-polish-off=1). */

/* 1. internal review panel folded to one line */
body.cp-on #review-panel.cp-review-fold:not(.cp-review-open) > :not(.cp-review-bar) { display: none !important; }
body.cp-on #review-panel.cp-review-fold:not(.cp-review-open) { padding-top: 10px; padding-bottom: 10px; }
body.cp-on .cp-review-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
body.cp-on #review-panel.cp-review-open .cp-review-bar { margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border-color); }
body.cp-on .cp-review-lab { font-size: 14px; font-weight: 600; color: var(--text); }
body.cp-on .cp-review-btn { font: 600 13px/1 var(--font, inherit); color: var(--primary); background: transparent; border: 1px solid var(--border-color);
  border-radius: 999px; padding: 8px 14px; cursor: pointer; }
body.cp-on .cp-review-btn:hover { border-color: var(--primary); }
body.cp-on .cp-review-btn:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

/* 2. report tab bar sticks below the app top bar (report_nav_plus_v1 has its own rule when it is on) */
body.cp-on:not(.rnp-on) #rl2-bar {
  margin-top: calc(-1 * var(--cp-topoff, 0px)); padding-top: calc(var(--cp-topoff, 0px) + 4px);
  background: linear-gradient(to bottom, transparent var(--cp-topoff, 0px), var(--dark-bg, var(--surface, #f4f4f4)) var(--cp-topoff, 0px));
  z-index: 29; pointer-events: none;
}
body.cp-on:not(.rnp-on) #rl2-bar > * { pointer-events: auto; }

/* 3. Top button: bottom-right, stacked above the report's Sections button (bottom-left sat on top of the sidebar's Settings link) */
#cp-top { position: fixed; right: 18px; bottom: 76px; z-index: 900; font: 600 13px/1 var(--font, inherit); color: var(--text); background: var(--card-bg, #fff);
  border: 1px solid var(--border-color); border-radius: 999px; padding: 10px 15px; cursor: pointer; box-shadow: var(--shadow-md, 0 2px 8px rgba(0,0,0,.12)); }
#cp-top:hover { border-color: var(--primary); }
#cp-top:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
#cp-top[hidden] { display: none; }
#cp-top.cp-top-low { bottom: 18px; }

/* 4. phone: wide report tables as stacked cards */
@media (max-width: 640px) {
  body.cp-on #results-section table.cp-stack, body.cp-on #results-section table.cp-stack tbody,
  body.cp-on #results-section table.cp-stack tr, body.cp-on #results-section table.cp-stack td { display: block; width: auto !important; }
  body.cp-on #results-section table.cp-stack thead { display: none; }
  body.cp-on #results-section table.cp-stack tr { border: 1px solid var(--border-color); border-radius: var(--radius-sm, 8px); padding: 8px 10px; margin: 0 0 10px; background: var(--card-bg, #fff); }
  body.cp-on #results-section table.cp-stack td { border: 0 !important; padding: 4px 0 !important; text-align: left !important; }
  body.cp-on #results-section table.cp-stack td[data-cp-label]:not([data-cp-label=""])::before { content: attr(data-cp-label); display: block; font-size: 11px; font-weight: 600;
    letter-spacing: .03em; text-transform: uppercase; color: var(--text-secondary); margin-bottom: 2px; }
  body.cp-on .cp-review-bar { gap: 8px; }
  body.cp-on .cp-review-lab { font-size: 13px; }
  body.cp-on #subs-section > .dashboard-header .dashboard-actions { width: 100%; }
  body.cp-on #subs-section > .dashboard-header .dashboard-actions > input, body.cp-on #subs-section > .dashboard-header .dashboard-actions > select { width: 100%; min-width: 0; }
}

/* 5. Sub Vault: header tidy + empty state */
body.cp-on #subs-section > .dashboard-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
body.cp-on #subs-section > .dashboard-header .dashboard-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 0 1 auto; }
body.cp-on #subs-section > .dashboard-header .dashboard-actions > * { width: auto; margin: 0; }
body.cp-on #subs-section > .dashboard-header #sub-search { min-width: 220px; }
body.cp-on .cp-empty-h { font-weight: 600; color: var(--text); }
body.cp-on .cp-empty-act { margin-top: 10px; }

/* 6. hidden action-less card */
body.cp-on .kpi-card.cp-hide { display: none !important; }

/* 7. New Analysis title */
body.cp-on .cp-form-title { margin: 4px 0 16px; }
body.cp-on .cp-form-title h2 { margin: 0 0 4px; }
body.cp-on .cp-form-title p { margin: 0; color: var(--text-secondary); font-size: 14px; }

/* 8. phone: KPI cards two per row (four full-width cards filled the whole first screen), and empty tables show their
 *    message inside the screen (it was centred across a 800px-wide table, so half of it was off screen). */
@media (max-width: 640px) {
  body.cp-on .kpi-grid, body.cp-on div:has(> .stat-card + .stat-card) {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  /* display is NOT !important: a stat row the app hides with an inline display:none (the old Receipt Vault totals row,
     replaced by the v2 one) must stay hidden; an !important grid here brought back a contradictory "0 receipts" row. */
  body.cp-on .kpi-grid > .kpi-card, body.cp-on div:has(> .stat-card + .stat-card) > .stat-card { min-width: 0; margin: 0 !important; }
  body.cp-on .kpi-grid .kpi-value { font-size: 1.5rem; }
  body.cp-on table:has(> tbody > tr:only-child > td[colspan]:only-child),
  body.cp-on table:has(> tbody > tr:only-child > td[colspan]:only-child) > tbody,
  body.cp-on table:has(> tbody > tr:only-child > td[colspan]:only-child) > tbody > tr,
  body.cp-on table:has(> tbody > tr:only-child > td[colspan]:only-child) > tbody > tr > td { display: block; min-width: 0 !important; width: auto !important; max-width: 100%; box-sizing: border-box; }
  body.cp-on table:has(> tbody > tr:only-child > td[colspan]:only-child) > thead { display: none; }
  body.cp-on table:has(> tbody > tr:only-child > td[colspan]:only-child) tbody > tr:only-child > td[colspan]:only-child { text-align: left !important; white-space: normal; padding: 18px 14px !important; }
  body.cp-on table:has(> tbody > tr:only-child > td[colspan]:only-child) td[colspan]:only-child, body.cp-on table:has(> tbody > tr:only-child > td[colspan]:only-child) td[colspan]:only-child * { overflow-wrap: anywhere; min-width: 0; }
}

/* 9. Command Center Recent Activity link (was a bracketed "[View]") */
body.cp-on #dashboard-section a.cp-act-link { font-weight: 600; color: var(--primary); text-decoration: none; white-space: nowrap; margin-left: 4px; }
body.cp-on #dashboard-section a.cp-act-link:hover { text-decoration: underline; }

/* 10. Report tab badges counted sections ("Assumptions 1" over 77 rows): hidden; the in-tab chips carry item counts. */
body.cp-on .rl2-tab-n { display: none !important; }
body.cp-on .rl2-chip .cp-miss { margin-left: 6px; font-size: 12px; font-weight: 600; color: var(--text-secondary); }

/* 11. One font for numbers, dates and chips: the app font with tabular (aligned) digits, instead of a monospace mix. */
body.cp-on { --font-mono: var(--font); }
body.cp-on :is(.bid-id-badge, .kpi-card .kpi-value, .stat-value, .sc-value, .activity-time, .file-type, .pa-question-ref, .ct-rfq-trade-code, .rfi-number, .anav-n, .anav-ov-chip, .rl2-chip, .assumptions-count, .rm-table td, .data-table td),
body.cp-on [style*="monospace"]:not(pre):not(code) { font-family: var(--font) !important; font-variant-numeric: tabular-nums; }
body.cp-on :is(.stat-value, .sc-value, .kpi-value) { letter-spacing: -0.01em; }

/* 12. Settings: real primary / secondary buttons (they were tiny outline chips) */
body.cp-on #settings-section .btn.btn-outline.btn-sm { font-size: 14px; font-weight: 600; padding: 9px 16px; line-height: 1.2; border: 1px solid var(--primary);
  color: var(--primary); background: var(--card-bg, #fff); border-radius: var(--radius-sm, 8px); margin-top: 8px; }
body.cp-on #settings-section .btn.btn-outline.btn-sm:hover { background: var(--primary); color: #fff; }

@media (max-width: 640px) {
  /* 13. Report stepper: 8 steps as a tidy 4 x 2 grid (it was squeezed into one row with dash connectors) */
  body.cp-on .bid-lifecycle-stepper { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px 4px; padding: 10px 8px !important; }
  body.cp-on .bid-lifecycle-stepper .lifecycle-connector { display: none !important; }
  body.cp-on .bid-lifecycle-stepper .lifecycle-step { justify-content: flex-start; align-items: center; padding: 4px 2px !important; }
  body.cp-on .bid-lifecycle-stepper .lifecycle-label { font-size: 11px !important; white-space: nowrap; }
  /* 14. Command Center / Jobs tabs wrap onto a second row (they scrolled sideways, hiding Analytics with no hint) */
  body.cp-on .dash-tabs { flex-wrap: wrap !important; overflow-x: visible !important; row-gap: 4px; }
  body.cp-on .dash-tabs .dash-tab { flex: 0 0 auto; }
}

/* 15. Receipt Vault: the legacy rows receipts-v2 replaces stay hidden whatever later layout rules say. */
body.cp-on #receipts-section > [data-rv-legacy] { display: none !important; }

/* 16. phone Receipt Manager: the table already scrolls sideways inside its box; keep dates, people and vendors on one
 *     line instead of breaking "2026-10-27" over two lines. */
@media (max-width: 640px) {
  body.cp-on .rm-table tbody td, body.cp-on .rm-table thead th { white-space: nowrap; }
}
