/* App adaptations over the September 2026 Clearspace kit. Component source stays
   in clearspace-components.css; this file bridges the existing financial pages. */
html { background: var(--bg-app, #f9fafb); }
body { font-family: var(--font-primary, 'DM Sans', sans-serif); }
.main, .content { min-width: 0; }
.content { padding: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid #1976b9; outline-offset: 3px; }
::selection { background: #c9e8ff; color: #16191a; }
input, textarea { caret-color: #1976b9; }
.cv-table-sort { display: none; }
.cv-drawer-close { position:absolute !important; top:calc(8px + env(safe-area-inset-top,0px)); right:8px; z-index:1; color:var(--cs-light-blue) !important; }
.cv-connection { position:fixed; top:0; left:0; right:0; z-index:220; padding:10px 16px; background:#323d4c; color:#fff; text-align:center; font-size:14px; }
.cv-update { position:fixed; bottom:calc(16px + env(safe-area-inset-bottom,0px)); left:50%; transform:translateX(-50%); z-index:220; width:min(500px,calc(100% - 32px)); display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:16px; border-radius:14px; background:#323d4c; color:#fff; box-shadow:0 8px 32px #16191a33; }
.cv-update span { flex:1 1 180px; }
.cv-update button { color:#fff; min-height:44px; }
.cv-install { margin:auto; width:min(420px,calc(100% - 32px)); padding:28px; border:0; border-radius:14px; color:#323d4c; }
.cv-install::backdrop { background:#16191a66; }
.cv-install form { float:right; }
.cv-install form button { display:flex; width:44px; height:44px; align-items:center; justify-content:center; background:none; border:0; }
.cv-install form svg { width:24px; }
.cv-install h2 { margin:20px 0 12px; font-size:24px; }
.cv-install-note { margin-top:16px; font-size:14px; color:#4b5563; }
.cv-install p { line-height:1.6; }
.cv-sheet-close { display:none; }
@media (min-width:768px) and (max-width:1023.98px) {
  .content > .page-content, .content > .mf-content, .content > .px-8 { padding:24px; }
  .kpi-grid, .settings-pod-grid, .grid-cols-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mf-header, .pd-header-financials { flex-wrap:wrap; }
  .mf-toolbar, .pd-toolbar { flex-wrap:wrap; }
}
@media (max-width:767.98px) {
  html { font-size:16px; height:auto; }
  body { height:auto; min-height:100dvh; overflow:auto; }
  .app { height:auto; min-height:100dvh; overflow:visible; flex-direction:column; }
  .sidebar { display:none !important; }
  .main { width:100%; min-height:100dvh; overflow:visible; }
  .content { overflow:visible; padding:calc(52px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) calc(28px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px)); }
  .content > .page-content, .content > .mf-content, .content > .px-8 { padding:20px 0; width:100%; max-width:100%; }
  .content > * { min-width:0; }
  .page-header, .mf-header, .pd-header-financials, .content > .px-8 > .flex:first-child { flex-direction:column; align-items:stretch; gap:14px; }
  .page-header h1, .page-header h2, .mf-header h1, .pd-header h1 { font-size:24px; line-height:1.25; overflow-wrap:anywhere; }
  .page-header .subtitle, .page-subtitle, .mf-header .sub { font-size:14px; line-height:1.5; }
  .refresh-area, .mf-header-actions, .pd-toolbar, .pd-source-wrap { flex-wrap:wrap; gap:8px; }
  .mf-header-actions > *, .refresh-area { min-width:0; }
  .kpi-grid, .grid-cols-4, .mf-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px; }
  .kpi-card, .stat-card, .mf-stat { min-width:0; padding:14px; }
  .kpi-value, .stat-value, .mf-stat .value { font-size:24px; overflow-wrap:anywhere; }
  .kpi-title, .stat-label, .mf-stat .label { color:#4b5563; font-size:12px; }
  .settings-pod-grid { grid-template-columns:minmax(0,1fr) !important; }
  .filter-bar, .mf-toolbar, .table-toolbar { display:flex; flex-wrap:wrap; align-items:stretch; gap:8px; }
  .filter-bar > *, .mf-toolbar > *, .table-toolbar > * { min-width:0 !important; max-width:100%; }
  .filter-bar > input, .filter-bar > select, .filter-bar > .ts-wrapper, .mf-toolbar > .grow, .toolbar-search { flex:1 1 100%; width:100% !important; }
  .filter-bar > .multi-select-wrapper { flex:1 1 40%; }
  .filter-bar .multi-select-btn { width:100%; min-width:0; }
  .mf-toolbar > select { width:100% !important; }
  .filter-bar > label { align-self:center; }
  .filter-bar > span { margin-left:0 !important; }
  input:not([type=checkbox]):not([type=radio]), select, textarea { font-size:16px !important; max-width:100%; min-height:44px; }
  button, .btn, .btn-secondary, .detail-tab, .budget-tab, .tab-btn, .chip, .link-badge, .pd-back { min-height:44px; }
  button, .btn-secondary { white-space:normal; }
  .btn-sm { min-height:44px; }
  button:has(> svg:only-child), .modal-close, .close { min-width:44px; }
  .detail-tabs, .budget-tabs, .tabs, .seg, .content .border-b:has(> .tab-btn) { display:flex; max-width:100%; overflow-x:auto; flex-wrap:nowrap; gap:8px; scrollbar-width:thin; }
  .detail-tabs > *, .budget-tabs > *, .tabs > *, .seg > *, .tab-btn { flex-shrink:0; white-space:nowrap; }
  .cv-table-sort { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:8px 0 12px; font-size:14px; }
  .cv-table-sort select { flex:1; min-width:0; background:#fff; border:1px solid #d1d5db; border-radius:8px; padding:8px; }
  .cv-table-sort button { padding:8px 12px; background:#fff; border:1px solid #d1d5db; border-radius:8px; }
  /* The same cells reflow in place: source selectors, signoffs and editors keep
     their handlers. Multi-row headings are combined into each data-label. */
  .table-container, .table-wrap, .pd-table-wrap, .overflow-x-auto, .mf-group-body, div:has(> table.table-card-reflow) { overflow:visible !important; min-width:0; max-width:100%; }
  table.table-card-reflow { display:block; width:100% !important; min-width:0 !important; table-layout:auto; border:0; background:transparent; }
  .table-card-reflow colgroup, .table-card-reflow thead { display:none; }
  .table-card-reflow tbody, .table-card-reflow tfoot { display:block; width:100%; }
  .table-card-reflow tr { display:block; margin:0 0 12px; padding:12px 14px; border:1px solid #e5e7eb; border-radius:14px; background:#fff; }
  .table-card-reflow tr[style*="display: none"], .table-card-reflow tr[style*="display:none"], .table-card-reflow tr.is-hidden { display:none !important; }
  .table-card-reflow td, .table-card-reflow tbody th { display:flex; position:static !important; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:4px 12px; width:auto !important; min-width:0 !important; max-width:100% !important; height:auto; padding:9px 0 !important; text-align:right; white-space:normal !important; overflow-wrap:anywhere; border:0 !important; font-size:14px; background:transparent !important; }
  .table-card-reflow td::before { content:attr(data-label); flex:1 1 42%; min-width:0; text-align:left; color:#4b5563; font-size:12px; font-weight:400; letter-spacing:0; text-transform:none; }
  .table-card-reflow td > * { max-width:100%; min-width:0; }
  .table-card-reflow td input:not([type=checkbox]), .table-card-reflow td select { width:100% !important; }
  .table-card-reflow td:first-child { font-size:16px; font-weight:500; }
  .table-card-reflow td[colspan]:not([colspan="1"])::before { content:none; }
  .table-card-reflow td.col-hidden, .table-card-reflow th.col-hidden { display:none !important; }
  .table-card-reflow .truncate, .table-card-reflow .project-link { white-space:normal; max-width:100%; overflow:visible; text-overflow:clip; }
  .table-card-reflow .totals-row, .table-card-reflow tfoot tr { background:#f0f4f7; }
  .table-card-reflow .group-header, .table-card-reflow .group-row { background:#eef2f5; }
  .table-card-reflow [onclick], .table-card-reflow .editable-cell, .table-card-reflow .pct-clickable { min-height:44px; }
  /* Filters and field pickers use the supplied sheet geometry. */
  .multi-select-panel, .col-picker-panel, .filter-menu, .mf-menu { position:fixed !important; inset:auto 0 0 !important; width:100%; min-width:0 !important; max-height:72dvh; overflow-y:auto; padding:12px 16px calc(20px + env(safe-area-inset-bottom,0px)); border-radius:20px 20px 0 0; z-index:205; box-shadow:0 -8px 40px #16191a33; }
  .dropdown-item { min-height:44px; font-size:16px; }
  .cv-sheet-close { display:flex; margin:0 0 10px auto; padding:8px 16px; border:0; border-radius:8px; background:#eef2f5; color:#323d4c; }
  .modal-overlay { z-index:200; padding:12px !important; align-items:center; }
  .modal-content, .unmatched-modal { width:100% !important; max-width:100% !important; max-height:calc(100dvh - 32px); display:flex; flex-direction:column; }
  .modal-body, .unmatched-body { min-height:0; overflow-y:auto; max-height:75dvh !important; }
  .modal-header { flex-shrink:0; }
  .mf-modal { top:auto; bottom:0; left:0; transform:none; width:100%; max-height:92dvh; border-radius:20px 20px 0 0; }
  .mf-modal-body { padding:20px 16px; }
  .mf-modal-foot { padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px)); flex-wrap:wrap; }
  .mf-drawer { width:100%; max-width:100%; }
  .mf-group-head { padding:14px; gap:8px; }
  .mf-group-summary { flex-wrap:wrap; width:100%; gap:8px; }
  .mf-group-body { padding:8px; }
  .pd-meta-row { gap:16px; }
  .pd-toolbar { align-items:stretch; }
  .pd-source-wrap { width:100%; }
  .pd-header-financials .pd-meta-links { flex-wrap:wrap; }
  .map-frame { min-height:280px; height:48dvh; }
  .rail { min-height:0; height:auto; max-height:60dvh; }
  .leaflet-control-zoom a { width:44px !important; height:44px !important; line-height:44px !important; }
  .leaflet-popup-content { max-width:calc(100vw - 90px); }
  canvas { max-width:100%; }
  .text-gray-400, .text-muted, .rail-item .meta, .rail-count { color:#4b5563; }
  .login-body { display:flex; align-items:center; overflow:auto; padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px); }
  .login-container { width:100%; padding:24px 16px; }
  .login-card { width:100%; max-width:420px; margin:auto; padding:24px; }
  .login-field input, .login-btn, .login-btn-microsoft { min-height:48px; font-size:16px; }
  .cv-connection { top:calc(52px + env(safe-area-inset-top,0px)); }
  .cv-offline .content { padding-top:calc(122px + env(safe-area-inset-top,0px)); }
  .cv-projects-desktop { display:none; }
  .cs-rl-card { min-width:0; }
  .cs-rl-title { white-space:normal; }
  .cs-rl-facts { flex-wrap:wrap; }
  .cs-rl-fact { min-width:0; }
  .cs-rl-side .stage-badge { max-width:110px; white-space:normal; text-align:right; }
  .cs-rl-btn { height:44px; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:0.01ms !important; transition-duration:0.01ms !important; }
}
.cv-record-stack { display:flex; flex-direction:column; gap:8px; }
@media (max-width:767.98px) {
  #mobile-projects { margin:16px 0; }
  #mobile-project-sort { width:auto; border:0; background:transparent; max-width:130px; }
  #mobile-projects .cs-rl-meta { align-items:center; gap:8px; }
  #mobile-project-reverse { width:44px; justify-content:center; }
  .pd-title { overflow-wrap:anywhere; }
}
.cv-native-sheet { width:100%; max-width:none; height:100%; max-height:none; padding:0; border:0; margin:0; background:transparent; }
.cv-native-sheet[open] { display:block; }
.cv-native-sheet::backdrop { background:transparent; }
.cv-field-choice { display:flex; flex-direction:column; gap:8px; margin:16px 8px; font-size:14px; }
.cv-field-choice select { min-height:44px; padding:8px; border:1px solid #d1d5db; border-radius:8px; }
.cv-field-hint { margin:8px; color:#4b5563; font-size:14px; }
.cv-filter-summary { color:#4b5563; font-size:12px; line-height:1.5; }
@media (max-width:767.98px) {
  .cv-mobile-project-tools { position:sticky; top:calc(52px + env(safe-area-inset-top,0px)); background:var(--bg-app); z-index:35; padding-bottom:8px; }
  #mobile-search-slot input { width:100%; max-width:100%; }
  body:has(#mobile-projects) #filter-bar { display:none; }
  #mobile-filter-slot { padding:8px; flex-direction:column; }
  #mobile-filter-slot > * { width:100%; }
  #mobile-filter-slot .multi-select-panel { position:static !important; max-height:none; border-radius:8px; box-shadow:none; padding:8px; margin:8px 0; }
  .mf-stats { grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:8px; }
  .mf-stat { padding:12px 10px; }
  .mf-stat .value { font-size:21px; margin-top:12px; }
  .mf-stat .label { font-size:11px; }
  .mf-stat .value .of-total { font-size:14px; }
  .mf-header .eyebrow, .pd-header > .eyebrow { display:none; }
  #pod-summary-cards { grid-template-columns:1fr !important; }
  .mf-toolbar .seg:has(button.disabled) { display:none; }
}
@media (max-width:767.98px) {
  .cs-comments, .cs-comments-drawer { width:100% !important; max-width:100%; }
  .cs-comments-subtitle { max-width:calc(100vw - 100px); white-space:normal; }
  .cs-comments-head, .cs-comments-thread, .cs-composer { padding:16px; }
  .cs-comment-head { flex-wrap:wrap; }
  .cs-comment-actions { opacity:1; }
  .cs-comments-close { width:44px; height:44px; }
  .bonus-panel { padding:16px; }
  .bonus-row-label { flex-shrink:1; min-width:0; }
  .bonus-row { flex-wrap:wrap; }
  .cv-table-sort label { flex:1; display:flex; align-items:center; gap:8px; min-width:0; }
  .table-card-reflow td[data-label=""] { font-size:14px; }
}
.cv-chart-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
@media (max-width:767.98px) {
  .cv-chart-grid { grid-template-columns:minmax(0,1fr); }
  .cv-api .cv-meta { grid-template-columns:minmax(0,1fr); }
  .cv-api .cv-meta .cell { border-left:0; border-bottom:1px solid #e5e7eb; padding:14px 0; }
  .cv-api .cv-meta .val { overflow-wrap:anywhere; }
  .cv-api .cv-section-head, .cv-api .cv-toolbar { flex-wrap:wrap; gap:8px; }
  .cv-api .cv-section-head .d { text-align:left; }
  .cv-api .cv-op-row { grid-template-columns:44px minmax(0,1fr) 20px; gap:8px; }
  .cv-api .cv-op-row > * { min-width:0; overflow-wrap:anywhere; }
  .cv-api .cv-op-row > :nth-child(3) { grid-column:2; }
  .cv-api pre { max-width:100%; overflow-x:auto; }
}
@media (max-width:767.98px) {
  /* The report header now includes the shared weekly refresh action. */
  .content > .px-8 > .flex:first-child > .flex { flex-wrap:wrap; }
}
