/* Scoped cost report: explicit surfaces and contrast in both CRM themes. */
.crm-costing {
  --cost-bg:#0f172a;
  --cost-soft:#172338;
  --cost-border:#3b4b63;
  --cost-text:#f1f5f9;
  --cost-muted:#becbdb;
  --cost-positive:#6ee7b7;
  --cost-expense:#fda4af;
  --cost-focus:#93c5fd;
  display:grid;
  gap:24px;
  min-width:0;
  color:var(--cost-text);
  font-size:15px;
  line-height:1.55;
}
:root[data-theme="light"] .crm-costing {
  --cost-bg:#fff;
  --cost-soft:#f1f5f9;
  --cost-border:#c3cedc;
  --cost-text:#172033;
  --cost-muted:#46566e;
  --cost-positive:#076344;
  --cost-expense:#a91436;
  --cost-focus:#1d4ed8;
}
.crm-costing *, .crm-costing *::before, .crm-costing *::after { box-sizing:border-box; }
.crm-costing h2, .crm-costing h3, .crm-costing p { margin:0; }
.crm-costing h2 { font-size:22px; line-height:1.35; font-weight:700; }
.crm-costing h3 { font-size:17px; line-height:1.4; font-weight:650; }
.crm-costing .cost-muted, .crm-costing .cost-setting > span, .crm-costing .cost-month > span { color:var(--cost-muted); font-size:14px; line-height:1.55; }
.crm-costing .cost-positive { color:var(--cost-positive); }
.crm-costing .cost-expense { color:var(--cost-expense); }
.crm-costing .cost-page-heading { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:20px; }
.crm-costing .cost-page-heading > div { flex:1 1 400px; min-width:0; }
.crm-costing .cost-page-heading p { margin-top:8px; max-width:80ch; }
.crm-costing .cost-access-note { color:var(--cost-muted); padding-left:12px; border-left:3px solid var(--cost-border); font-size:14px; }
.crm-costing .cost-month { display:grid; gap:6px; flex:0 0 196px; min-width:0; }
.crm-costing input { min-height:44px; max-width:100%; min-width:0; border:1px solid var(--cost-border); border-radius:8px; padding:9px 12px; background:var(--cost-bg); color:var(--cost-text); font:inherit; font-size:16px; font-variant-numeric:tabular-nums; }
.crm-costing input:focus-visible, .crm-costing .cost-table-scroll:focus-visible { outline:2px solid var(--cost-focus); outline-offset:3px; }
.crm-costing .cost-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:16px; }
.crm-costing .cost-panel, .crm-costing .cost-metric { min-width:0; border:1px solid var(--cost-border); border-radius:12px; background:var(--cost-bg); }
.crm-costing .cost-metric { padding:20px; }
.crm-costing .cost-metric h3 { font-size:15px; color:var(--cost-muted); }
.crm-costing .cost-metric-value { margin:10px 0 8px; font-size:clamp(23px,2.1vw,32px); line-height:1.3; font-weight:750; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.crm-costing .cost-panel-heading { padding:20px; }
.crm-costing .cost-panel-heading p { margin-top:6px; }
.crm-costing .cost-details { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; }
.crm-costing .cost-table-scroll { max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; border-radius:0 0 12px 12px; scrollbar-color:var(--cost-border) var(--cost-bg); }
.crm-costing .cost-table { width:100%; border-collapse:collapse; table-layout:auto; font-size:15px; line-height:1.5; text-align:left; }
.crm-costing .cost-table th, .crm-costing .cost-table td { padding:14px 20px; vertical-align:top; font-size:15px; line-height:1.5; border-top:1px solid var(--cost-border); }
.crm-costing .cost-table thead { background:var(--cost-soft); color:var(--cost-muted); }
.crm-costing .cost-table thead th { font-size:14px; font-weight:650; }
.crm-costing .cost-table tbody th { font-weight:500; overflow-wrap:anywhere; min-width:140px; }
.crm-costing .cost-table tbody tr:hover { background:var(--cost-soft); }
.crm-costing .cost-table .cost-numeric { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.crm-costing .cost-task-table { table-layout:fixed; }
.crm-costing .cost-task-table th:first-child { width:68%; }
.crm-costing .cost-task-table .cost-task-title { font-weight:600; }
.crm-costing .cost-task-table .cost-task-meta { margin-top:5px; }
.crm-costing .cost-task-table .cost-amount-input { width:100%; max-width:224px; text-align:right; }
.crm-costing .cost-amount { display:inline-block; padding:10px 0; font-weight:600; }
.crm-costing .cost-project-table { table-layout:fixed; }
.crm-costing .cost-project-table th:first-child { width:55%; }
.crm-costing .cost-project-table .cost-numeric { white-space:normal; overflow-wrap:anywhere; }
.crm-costing .cost-payroll-table { min-width:780px; }
.crm-costing .cost-total { background:var(--cost-soft); font-weight:700; }
.crm-costing .cost-total th { text-align:right; font-weight:700 !important; }
.crm-costing .cost-settings { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; padding:0 20px; }
.crm-costing .cost-setting { display:flex; flex-direction:column; gap:6px; min-width:0; }
.crm-costing .cost-setting > strong { padding:9px 12px; border:1px solid var(--cost-border); border-radius:8px; background:var(--cost-soft); font-size:16px; font-variant-numeric:tabular-nums; }
.crm-costing .cost-model-note { padding:16px 20px 20px; }
.crm-costing .cost-empty { color:var(--cost-muted); white-space:normal; }
.crm-costing .cost-scroll-hint { color:var(--cost-muted); font-size:14px; }
.crm-costing .cost-alert { border:1px solid var(--cost-expense); padding:12px 16px; border-radius:8px; color:var(--cost-expense); }
.crm-costing .cost-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(min-width:1280px) {
  .crm-costing .cost-details { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(min-width:1200px) {
  .crm-costing .cost-scroll-hint { display:none; }
}
@media(max-width:620px) {
  .crm-costing { gap:18px; }
  .crm-costing h2 { font-size:20px; }
  .crm-costing .cost-month { flex-basis:100%; }
  .crm-costing .cost-panel-heading, .crm-costing .cost-metric { padding:16px; }
  .crm-costing .cost-table th, .crm-costing .cost-table td { padding:12px 16px; }
  .crm-costing .cost-settings { padding:0 16px; }
  .crm-costing .cost-model-note { padding:16px; }
  .crm-costing .cost-task-table, .crm-costing .cost-task-table tbody { display:block; }
  .crm-costing .cost-task-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .crm-costing .cost-task-table tr { display:grid; border-top:1px solid var(--cost-border); }
  .crm-costing .cost-task-table th:first-child { width:auto; }
  .crm-costing .cost-task-table th, .crm-costing .cost-task-table td { border:0; min-width:0; }
  .crm-costing .cost-task-table td.cost-numeric { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; padding-top:0; }
  .crm-costing .cost-task-table td.cost-numeric::before { content:attr(data-label); color:var(--cost-muted); font-size:14px; }
  .crm-costing .cost-task-table .cost-amount-input { width:168px; }
}
@media(max-width:380px) {
  .crm-costing .cost-settings { grid-template-columns:minmax(0,1fr); }
}
