/*
  MR. GOLFCART V2 — CANONICAL OPERATIONAL DESIGN SYSTEM
  Functional baseline: Patch 2U.
  Scope: presentation only. Admin/Financial is intentionally excluded.

  Visual contract:
  - Apple-like, mobile-first, light surfaces.
  - One typography scale, one control geometry, one card geometry.
  - Operational actions are soft/light; no dark-green interior blocks.
  - Module color is identity/accent, not a separate component design.
  - Numbers and money align right where they are presented as values.
*/
:root{
  --ui-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,Helvetica,sans-serif;
  --ui-ink:#26312d;
  --ui-muted:#68736d;
  --ui-green:#174f36;
  --ui-gold:#c8a94b;
  --ui-bg:#f4f6f5;
  --ui-card:#ffffff;
  --ui-soft:#f3f5f4;
  --ui-soft-2:#eef1ef;
  --ui-line:#cbd3cf;
  --ui-line-soft:#dce2df;
  --ui-danger:#a33a3a;
  --ui-danger-bg:#fff8f8;

  --ui-lithium:#c8a94b;
  --ui-lithium-ink:#6e5816;
  --ui-lithium-soft:#fff8e6;
  --ui-lithium-line:#dfc878;

  --ui-repair:#d98279;
  --ui-repair-ink:#87423d;
  --ui-repair-soft:#fff1f0;
  --ui-repair-line:#e4aaa5;

  --ui-inventory:#4f8064;
  --ui-inventory-ink:#275e41;
  --ui-inventory-soft:#edf6f0;
  --ui-inventory-line:#9fc2aa;

  --ui-buyer:#4d86b8;
  --ui-buyer-ink:#285f8d;
  --ui-buyer-soft:#eef6fd;
  --ui-buyer-line:#a9c8e1;

  --ui-font-page:20px;
  --ui-font-card:18px;
  --ui-font-value:16px;
  --ui-font-button:14px;
  --ui-font-body:14px;
  --ui-font-meta:13px;
  --ui-font-label:12px;
  --ui-font-small:11px;

  --ui-card-radius:12px;
  --ui-control-radius:10px;
  --ui-control-height:46px;
  --ui-button-height:44px;
  --ui-gap:10px;
}

html,body,button,input,select,textarea{font-family:var(--ui-font)}
body{color:var(--ui-ink);background:var(--ui-bg)}

/* ---------- Operational scope / typography ---------- */
#app :where(
  .my-day-screen,.calendar-screen,.job-list-screen,.work-detail-shell,
  .lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.vendors-screen,.accounts-screen,.messages-screen,.tasks-screen,
  .ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
){
  color:var(--ui-ink);
  font-family:var(--ui-font);
}

#app :where(
  .job-list-heading,.buyers-heading,.inventory-heading,.calendar-heading,
  .messages-heading,.tasks-heading,.vendors-heading,.accounts-heading,.ads-heading,
  .receipts-heading,.work-detail-name,.lead-detail-name
){font-size:var(--ui-font-page);line-height:1.15;font-weight:900;letter-spacing:-.01em}

#app :where(
  .job-list-card-name,.inventory-main-identity>strong,.work-card .customer-name,
  .account-name,.vendor-name
){font-size:var(--ui-font-card);line-height:1.15;font-weight:900;letter-spacing:-.01em}

#app :where(
  .job-list-card-contact,.job-list-card-cart,.inventory-card-cart,.inventory-main-meta,
  .work-card .meta,.work-card .submeta,.work-cost-item span,.inventory-cost small,
  .global-search-helper
){font-size:var(--ui-font-meta);line-height:1.32;color:var(--ui-muted);font-weight:650}

#app :where(
  .work-detail-info-grid label>span,.work-detail-long>span,.work-core-edit-form label>span,
  .new-lead-form label>span,.buyer-profile-grid label>span,.operational-cost-grid>label>span,
  .operational-cost-total span,.inventory-fin-grid span,.work-cost-total span,
  .cost-receipt-title,.receipt-label
){font-size:var(--ui-font-label);line-height:1.2;font-weight:800;letter-spacing:.025em;text-transform:uppercase;color:#56625c}

/* ---------- Canonical card / section geometry ---------- */
#app :where(
  .job-list-card,.work-card,.work-detail-section,.work-more-group,.work-detail-disclosure,
  .inventory-main-card,.inventory-detail-section,.inventory-cost,.buyer-card,.buyer-profile-card,
  .account-card,.vendor-card,.message-card,.task-card,.calendar-agenda-card,
  .new-lead-section,.global-search-panel,.global-search-result
){border-radius:var(--ui-card-radius);box-shadow:0 1px 2px rgba(31,41,55,.04)}

/* ---------- Inputs: same control everywhere ---------- */
#app :where(
  .work-detail-shell,.lead-detail-screen,.new-lead-screen,.inventory-screen,
  .inventory-detail-screen,.buyers-screen,.job-list-screen,.calendar-screen,
  .messages-screen,.tasks-screen,.vendors-screen,.accounts-screen,.ads-screen,
  .ad-detail,.global-search-screen,.search-screen,.receipts-screen
) :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  width:100%;min-width:0;box-sizing:border-box;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-control-radius);
  background:#fff;
  color:var(--ui-ink);
  -webkit-text-fill-color:var(--ui-ink);
  box-shadow:none;
  font-family:var(--ui-font);
  font-size:var(--ui-font-value);
  line-height:1.25;
}
#app :where(
  .work-detail-shell,.lead-detail-screen,.new-lead-screen,.inventory-screen,
  .inventory-detail-screen,.buyers-screen,.job-list-screen,.calendar-screen,
  .messages-screen,.tasks-screen,.vendors-screen,.accounts-screen,.ads-screen,
  .ad-detail,.global-search-screen,.search-screen,.receipts-screen
) :where(input:not([type="checkbox"]):not([type="radio"]),select){min-height:var(--ui-control-height);padding:10px 12px}
#app :where(
  .work-detail-shell,.lead-detail-screen,.new-lead-screen,.inventory-screen,
  .inventory-detail-screen,.buyers-screen,.job-list-screen,.calendar-screen,
  .messages-screen,.tasks-screen,.vendors-screen,.accounts-screen,.ads-screen,
  .ad-detail,.global-search-screen,.search-screen,.receipts-screen
) textarea{min-height:96px;padding:10px 12px;resize:vertical}

/* ---------- Default operational button contract ---------- */
#app :where(
  .my-day-screen,.calendar-screen,.job-list-screen,.work-detail-shell,
  .lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.vendors-screen,.accounts-screen,.messages-screen,.tasks-screen,
  .ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) button:not(.financial-screen *),
#app :where(
  .my-day-screen,.calendar-screen,.job-list-screen,.work-detail-shell,
  .lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.vendors-screen,.accounts-screen,.messages-screen,.tasks-screen,
  .ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) a.button{
  border-radius:var(--ui-control-radius);
  font-family:var(--ui-font);
}

#app :where(
  .work-detail-contact-actions,.job-list-contact-actions,.card-actions,.inventory-road-actions,
  .inventory-main-actions,.work-core-edit-actions,.work-note-actions,.review-actions,
  .transport-v2-actions,.new-lead-actions,.buyer-card-actions,.vendor-form-actions,
  .account-form-actions,.task-form-actions,.message-compose-actions,.inventory-cost-actions
) :where(button,a){
  min-height:var(--ui-button-height);
  padding:9px 12px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-control-radius);
  background:var(--ui-soft);
  color:#3e4944;
  -webkit-text-fill-color:#3e4944;
  box-shadow:none;
  font-size:var(--ui-font-button);
  line-height:1.15;
  font-weight:800;
}

/* Generic primary/secondary inside operational screens: both light. */
#app :where(
  .my-day-screen,.calendar-screen,.job-list-screen,.work-detail-shell,
  .lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.vendors-screen,.accounts-screen,.messages-screen,.tasks-screen,
  .ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) :where(button.primary,button.secondary,.primary.button,.secondary.button){
  min-height:var(--ui-button-height);
  padding:9px 12px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-control-radius);
  background:var(--ui-soft);
  color:#3e4944;
  -webkit-text-fill-color:#3e4944;
  box-shadow:none;
  font-size:var(--ui-font-button);
  line-height:1.15;
  font-weight:800;
}
#app :where(
  .my-day-screen,.calendar-screen,.job-list-screen,.work-detail-shell,
  .lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.vendors-screen,.accounts-screen,.messages-screen,.tasks-screen,
  .ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) button.secondary{background:#fff}

/* ---------- Module identity ---------- */
#app .type-lithium{--module-accent:var(--ui-lithium);--module-ink:var(--ui-lithium-ink);--module-soft:var(--ui-lithium-soft);--module-line:var(--ui-lithium-line)}
#app .type-repair{--module-accent:var(--ui-repair);--module-ink:var(--ui-repair-ink);--module-soft:var(--ui-repair-soft);--module-line:var(--ui-repair-line)}
#app .inventory-screen,#app .inventory-detail-screen{--module-accent:var(--ui-inventory);--module-ink:var(--ui-inventory-ink);--module-soft:var(--ui-inventory-soft);--module-line:var(--ui-inventory-line)}
#app .buyers-screen{--module-accent:var(--ui-buyer);--module-ink:var(--ui-buyer-ink);--module-soft:var(--ui-buyer-soft);--module-line:var(--ui-buyer-line)}
#app .job-list-screen[data-job-list-type="Lithium"]{--module-accent:var(--ui-lithium);--module-ink:var(--ui-lithium-ink);--module-soft:var(--ui-lithium-soft);--module-line:var(--ui-lithium-line)}
#app .job-list-screen[data-job-list-type="Repair"]{--module-accent:var(--ui-repair);--module-ink:var(--ui-repair-ink);--module-soft:var(--ui-repair-soft);--module-line:var(--ui-repair-line)}

/* Module primary means soft module tint, never a dark block. */
#app :where(.type-lithium,.type-repair,.inventory-screen,.inventory-detail-screen,.buyers-screen,.job-list-screen) button.primary,
#app :where(.type-lithium,.type-repair,.inventory-screen,.inventory-detail-screen,.buyers-screen,.job-list-screen) .primary.button{
  background:var(--module-soft,var(--ui-soft));
  border-color:var(--module-line,var(--ui-line));
  color:var(--module-ink,var(--ui-green));
  -webkit-text-fill-color:var(--module-ink,var(--ui-green));
}

/* ---------- Filters: identical geometry; only module accent differs ---------- */
#app :where(.job-entry-filter-btn,.buyers-filter-btn,.inventory-filter-btn,.schedule-filter-btn,.ads-filter-btn){
  min-height:44px;
  padding:8px 10px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-control-radius);
  background:#fff;
  color:#52605a;
  box-shadow:none;
  font-size:13px;
  font-weight:800;
}
#app :where(.job-entry-filter-btn,.buyers-filter-btn,.inventory-filter-btn,.schedule-filter-btn,.ads-filter-btn) strong{font-size:12px;font-weight:900}
#app :where(.job-list-screen,.buyers-screen,.inventory-screen) :where(.job-entry-filter-btn,.buyers-filter-btn,.inventory-filter-btn).active{
  background:var(--module-soft,var(--ui-soft));
  border-color:var(--module-line,var(--ui-line));
  color:var(--module-ink,var(--ui-green));
  -webkit-text-fill-color:var(--module-ink,var(--ui-green));
}

/* ---------- Cost editor: ONE COMPONENT for Repair / Lithium / Inventory ---------- */
#app .operational-cost-editor{
  --cost-accent:#7b8580;--cost-ink:#46514c;--cost-soft:var(--ui-soft);--cost-line:var(--ui-line);
  display:grid;gap:10px;
  margin:10px 0;padding:12px;
  border:1px solid var(--ui-line);
  border-left:4px solid var(--cost-accent);
  border-radius:var(--ui-card-radius);
  background:#fff;box-shadow:none;
}
#app .operational-cost-editor.module-lithium{--cost-accent:var(--ui-lithium);--cost-ink:var(--ui-lithium-ink);--cost-soft:var(--ui-lithium-soft);--cost-line:var(--ui-lithium-line)}
#app .operational-cost-editor.module-repair{--cost-accent:var(--ui-repair);--cost-ink:var(--ui-repair-ink);--cost-soft:var(--ui-repair-soft);--cost-line:var(--ui-repair-line)}
#app .operational-cost-editor.module-inventory{--cost-accent:var(--ui-inventory);--cost-ink:var(--ui-inventory-ink);--cost-soft:var(--ui-inventory-soft);--cost-line:var(--ui-inventory-line)}
#app .operational-cost-editor .operational-cost-editor-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:0 0 10px;border-bottom:1px solid var(--ui-line-soft)}
#app .operational-cost-editor .operational-cost-editor-head strong{font-size:18px;font-weight:900;color:var(--ui-ink)}
#app .operational-cost-editor .operational-cost-editor-head span{font-size:11px;font-weight:850;color:var(--cost-ink);letter-spacing:.035em;text-transform:uppercase}
#app .operational-cost-editor .operational-cost-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0}
#app .operational-cost-editor .operational-cost-grid>label{min-width:0;margin:0;padding:0;border:0;background:transparent;color:#56625c;font-size:var(--ui-font-label);font-weight:800;line-height:1.2}
#app .operational-cost-editor .operational-cost-grid>label>span{display:block;margin:0 0 5px;font-size:var(--ui-font-label);font-weight:800;color:#56625c;letter-spacing:0;text-transform:none}
#app .operational-cost-editor .operational-cost-grid>label.operational-cost-wide{grid-column:1/-1}
#app .operational-cost-editor :where(input,select,textarea){border:1px solid var(--ui-line);border-radius:var(--ui-control-radius);background:#fff;color:var(--ui-ink);-webkit-text-fill-color:var(--ui-ink);box-shadow:none;font-size:var(--ui-font-value)}
#app .operational-cost-editor :where(input,select){min-height:var(--ui-control-height);padding:10px 12px}
#app .operational-cost-editor textarea{min-height:96px;padding:10px 12px}
#app .operational-cost-editor .operational-cost-total{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;margin:0;padding:10px 12px;border:1px solid var(--ui-line);border-radius:var(--ui-control-radius);background:var(--ui-soft)}
#app .operational-cost-editor .operational-cost-total span{font-size:var(--ui-font-label);font-weight:800;color:#56625c;letter-spacing:.02em;text-transform:uppercase}
#app .operational-cost-editor .operational-cost-total strong{margin-left:auto;text-align:right;font-size:18px;font-weight:900;color:var(--ui-ink);font-variant-numeric:tabular-nums}
#app .operational-cost-editor .cost-receipt-controls{margin:0;border:1px solid var(--ui-line);border-radius:var(--ui-card-radius);background:var(--ui-soft)}
#app .operational-cost-editor .cost-receipt-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#app .operational-cost-editor .cost-receipt-actions button,
#app .operational-cost-editor .cost-receipt-row :where(a,button){min-height:var(--ui-button-height);padding:9px 12px;border:1px solid var(--ui-line);border-radius:var(--ui-control-radius);background:#fff;color:#46514c;-webkit-text-fill-color:#46514c;box-shadow:none;font-size:var(--ui-font-button);font-weight:800}
#app .operational-cost-editor .operational-cost-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:2px 0 0}
#app .operational-cost-editor .operational-cost-actions button{width:100%;min-height:48px;margin:0;padding:10px 12px;border-radius:var(--ui-control-radius);box-shadow:none;font-size:var(--ui-font-button);font-weight:850}
#app .operational-cost-editor .operational-cost-actions .cost-save-main{order:2;background:var(--cost-soft);border:1px solid var(--cost-line);color:var(--cost-ink);-webkit-text-fill-color:var(--cost-ink)}
#app .operational-cost-editor .operational-cost-actions .cost-cancel{order:1;background:#fff;border:1px solid var(--ui-line);color:#46514c;-webkit-text-fill-color:#46514c}
#app .operational-cost-editor .cost-receipt-submit-row{display:flex;justify-content:flex-end;margin-top:8px}
#app .operational-cost-editor .cost-receipt-submit-row[hidden]{display:none}
#app .operational-cost-editor .cost-receipt-submit-row .cost-submit-receipt{min-width:132px;min-height:40px;padding:8px 12px;border:1px solid var(--ui-line);border-radius:var(--ui-control-radius);background:#fff;color:#46514c;-webkit-text-fill-color:#46514c;font-size:13px;font-weight:800}

/* ---------- Cost detail lists: compact, right-aligned money, compact Edit/Delete ---------- */
#app .work-cost-total,#app .inventory-fin-grid>div{
  border:0;border-radius:var(--ui-control-radius);background:var(--ui-soft);box-shadow:none
}
#app .work-cost-total strong,#app .inventory-fin-grid strong{margin-left:auto;text-align:right;font-size:18px;font-weight:900;color:var(--ui-ink);font-variant-numeric:tabular-nums}
#app .work-cost-list,#app .inventory-cost-list{display:grid;gap:0;margin-top:10px}
#app .work-cost-item,#app .inventory-cost{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 12px;
  align-items:start;padding:12px 0;margin:0;
  border:0;border-bottom:1px solid var(--ui-line-soft);border-radius:0;
  background:#fff;box-shadow:none
}
#app .work-cost-item:last-child,#app .inventory-cost:last-child{border-bottom:0}
#app .work-cost-item>div:first-child,#app .inventory-cost>div:first-child{min-width:0}
#app .work-cost-item>div:first-child>strong,#app .inventory-cost>div:first-child>strong{display:block;font-size:16px;line-height:1.2;font-weight:850;color:var(--ui-ink)}
#app .work-cost-item>strong,#app .inventory-cost>div:last-child>strong{grid-column:2;grid-row:1;min-width:88px;text-align:right;font-size:16px;line-height:1.2;font-weight:900;color:var(--ui-ink);font-variant-numeric:tabular-nums}
#app .work-cost-item>div:last-child,#app .inventory-cost-actions{grid-column:2;display:flex;justify-content:flex-end;gap:6px;margin-top:6px}
#app .work-cost-item>div:last-child button,#app .inventory-cost-actions button{
  width:auto;min-width:64px;min-height:40px;padding:8px 10px;
  border:1px solid var(--ui-line);border-radius:var(--ui-control-radius);
  background:#fff;color:#46514c;-webkit-text-fill-color:#46514c;
  box-shadow:none;font-size:13px;font-weight:800
}
#app .work-cost-item>div:last-child button[data-delete-work-cost],#app .inventory-cost-actions button[data-delete-cost-row]{color:var(--ui-danger);-webkit-text-fill-color:var(--ui-danger);border-color:#e0b2b2;background:var(--ui-danger-bg)}

/* ---------- Destructive actions ---------- */
#app :where([data-delete-work-cost],[data-delete-cost-row],[data-delete-cost],.danger,.delete-button){
  color:var(--ui-danger);-webkit-text-fill-color:var(--ui-danger);
  border-color:#e0b2b2;background:var(--ui-danger-bg)
}

/* ---------- Money / numeric alignment ---------- */
#app :where(.money,.amount,.price,.total,.work-cost-total strong,.inventory-fin-grid strong,.inventory-card-money strong,.financial-value):not(.financial-screen *){font-variant-numeric:tabular-nums;text-align:right}
#app input[type="number"]{font-variant-numeric:tabular-nums}

/* ---------- Mobile ---------- */
@media(max-width:700px){
  #app .operational-cost-editor{padding:11px;gap:10px}
  #app .operational-cost-editor .operational-cost-grid{grid-template-columns:1fr 1fr;gap:9px}
  #app .operational-cost-editor .operational-cost-grid>label:nth-last-child(1){grid-column:1/-1}
  #app .work-cost-item,#app .inventory-cost{grid-template-columns:minmax(0,1fr) auto}
}
@media(max-width:430px){
  #app .operational-cost-editor .operational-cost-grid{grid-template-columns:1fr}
  #app .operational-cost-editor .operational-cost-grid>label,#app .operational-cost-editor .operational-cost-grid>label.operational-cost-wide{grid-column:1}
  #app .operational-cost-editor .operational-cost-actions{grid-template-columns:1fr 1.25fr}
}

/* ---------- Specificity locks against legacy module overrides ---------- */
#app .operational-cost-editor.module-lithium .operational-cost-actions .cost-save-main{
  min-height:48px;padding:10px 12px;
  background:var(--ui-lithium-soft);border:1px solid var(--ui-lithium-line);
  color:var(--ui-lithium-ink);-webkit-text-fill-color:var(--ui-lithium-ink);
  border-radius:var(--ui-control-radius);font-size:var(--ui-font-button);font-weight:850
}
#app .operational-cost-editor.module-repair .operational-cost-actions .cost-save-main{
  min-height:48px;padding:10px 12px;
  background:var(--ui-repair-soft);border:1px solid var(--ui-repair-line);
  color:var(--ui-repair-ink);-webkit-text-fill-color:var(--ui-repair-ink);
  border-radius:var(--ui-control-radius);font-size:var(--ui-font-button);font-weight:850
}
#app .operational-cost-editor.module-inventory .operational-cost-actions .cost-save-main{
  min-height:48px;padding:10px 12px;
  background:var(--ui-inventory-soft);border:1px solid var(--ui-inventory-line);
  color:var(--ui-inventory-ink);-webkit-text-fill-color:var(--ui-inventory-ink);
  border-radius:var(--ui-control-radius);font-size:var(--ui-font-button);font-weight:850
}
#app .operational-cost-editor.module-lithium .operational-cost-actions .cost-cancel,
#app .operational-cost-editor.module-repair .operational-cost-actions .cost-cancel,
#app .operational-cost-editor.module-inventory .operational-cost-actions .cost-cancel{
  min-height:48px;padding:10px 12px;background:#fff;
  border:1px solid var(--ui-line);color:#46514c;-webkit-text-fill-color:#46514c;
  border-radius:var(--ui-control-radius);font-size:var(--ui-font-button);font-weight:800
}
#app .job-list-screen[data-job-list-type="Lithium"] .job-entry-filter-btn,
#app .job-list-screen[data-job-list-type="Repair"] .job-entry-filter-btn,
#app .buyers-screen .buyers-filter-btn{
  min-height:44px;padding:8px 10px;border:1px solid var(--ui-line);
  border-radius:var(--ui-control-radius);background:#fff;color:#52605a;
  font-size:13px;font-weight:800;box-shadow:none
}
#app .job-list-screen[data-job-list-type="Lithium"] .job-entry-filter-btn strong,
#app .job-list-screen[data-job-list-type="Repair"] .job-entry-filter-btn strong,
#app .buyers-screen .buyers-filter-btn strong{font-size:12px;font-weight:900}
#app .job-list-screen[data-job-list-type="Lithium"] .job-entry-filter-btn.active{
  background:var(--ui-lithium-soft);border-color:var(--ui-lithium-line);color:var(--ui-lithium-ink);-webkit-text-fill-color:var(--ui-lithium-ink)
}
#app .job-list-screen[data-job-list-type="Repair"] .job-entry-filter-btn.active{
  background:var(--ui-repair-soft);border-color:var(--ui-repair-line);color:var(--ui-repair-ink);-webkit-text-fill-color:var(--ui-repair-ink)
}
#app .buyers-screen .buyers-filter-btn.active{
  background:var(--ui-buyer-soft);border-color:var(--ui-buyer-line);color:var(--ui-buyer-ink);-webkit-text-fill-color:var(--ui-buyer-ink)
}

/* All three cost editors use identical control geometry. */
#app .operational-cost-editor.module-lithium :where(input,select),
#app .operational-cost-editor.module-repair :where(input,select),
#app .operational-cost-editor.module-inventory :where(input,select){
  min-height:var(--ui-control-height);padding:10px 12px;
  border:1px solid var(--ui-line);border-radius:var(--ui-control-radius);
  background:#fff;color:var(--ui-ink);-webkit-text-fill-color:var(--ui-ink);
  font-size:var(--ui-font-value);font-weight:600;line-height:1.25;box-shadow:none
}
#app .operational-cost-editor.module-lithium textarea,
#app .operational-cost-editor.module-repair textarea,
#app .operational-cost-editor.module-inventory textarea{
  min-height:96px;padding:10px 12px;border:1px solid var(--ui-line);
  border-radius:var(--ui-control-radius);background:#fff;color:var(--ui-ink);
  -webkit-text-fill-color:var(--ui-ink);font-size:var(--ui-font-value);font-weight:600;box-shadow:none
}

/* ======================================================================
   HARD LOCK
   Two-ID specificity is intentional: this is the single authoritative
   presentation contract and prevents legacy one-off  rules from
   silently changing equivalent operational components.
   ====================================================================== */
#app#app :where(
  .work-detail-shell,.lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.job-list-screen,.my-day-screen,.calendar-screen,.messages-screen,.tasks-screen,
  .vendors-screen,.accounts-screen,.ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) :where(button,input,select,textarea){font-family:var(--ui-font)}

#app#app :where(
  .work-detail-shell,.lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.job-list-screen,.calendar-screen,.messages-screen,.tasks-screen,.vendors-screen,
  .accounts-screen,.ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) :where(input:not([type="checkbox"]):not([type="radio"]),select){
  min-height:var(--ui-control-height);border-radius:var(--ui-control-radius);
  font-size:var(--ui-font-value);line-height:1.25
}

#app#app :where(
  .work-detail-shell,.lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.job-list-screen,.calendar-screen,.messages-screen,.tasks-screen,.vendors-screen,
  .accounts-screen,.ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) textarea{border-radius:var(--ui-control-radius);font-size:var(--ui-font-value);line-height:1.3}

#app#app .operational-cost-editor.module-lithium .operational-cost-actions .cost-save-main{
  min-height:48px;background:var(--ui-lithium-soft);border:1px solid var(--ui-lithium-line);
  color:var(--ui-lithium-ink);-webkit-text-fill-color:var(--ui-lithium-ink);
  border-radius:var(--ui-control-radius);font-size:var(--ui-font-button)
}
#app#app .operational-cost-editor.module-repair .operational-cost-actions .cost-save-main{
  min-height:48px;background:var(--ui-repair-soft);border:1px solid var(--ui-repair-line);
  color:var(--ui-repair-ink);-webkit-text-fill-color:var(--ui-repair-ink);
  border-radius:var(--ui-control-radius);font-size:var(--ui-font-button)
}
#app#app .operational-cost-editor.module-inventory .operational-cost-actions .cost-save-main{
  min-height:48px;background:var(--ui-inventory-soft);border:1px solid var(--ui-inventory-line);
  color:var(--ui-inventory-ink);-webkit-text-fill-color:var(--ui-inventory-ink);
  border-radius:var(--ui-control-radius);font-size:var(--ui-font-button)
}
#app#app .operational-cost-editor :where(.cost-cancel,.cost-submit-receipt){
  background:#fff;border:1px solid var(--ui-line);color:#46514c;
  -webkit-text-fill-color:#46514c;border-radius:var(--ui-control-radius)
}
#app#app .operational-cost-editor :where(input,select){
  min-height:var(--ui-control-height);padding:10px 12px;border:1px solid var(--ui-line);
  border-radius:var(--ui-control-radius);background:#fff;color:var(--ui-ink);
  -webkit-text-fill-color:var(--ui-ink);font-size:var(--ui-font-value);font-weight:600
}
#app#app .operational-cost-editor textarea{
  min-height:96px;padding:10px 12px;border:1px solid var(--ui-line);
  border-radius:var(--ui-control-radius);background:#fff;color:var(--ui-ink);
  -webkit-text-fill-color:var(--ui-ink);font-size:var(--ui-font-value);font-weight:600
}
#app#app .operational-cost-editor .operational-cost-grid>label{
  padding:0;border:0;background:transparent;font-size:var(--ui-font-label)
}
#app#app .operational-cost-editor .operational-cost-grid>label>span{
  margin-bottom:5px;font-size:var(--ui-font-label);font-weight:800;
  letter-spacing:0;text-transform:none;color:#56625c
}

#app#app .job-list-screen[data-job-list-type="Lithium"] .job-entry-filter-btn,
#app#app .job-list-screen[data-job-list-type="Repair"] .job-entry-filter-btn,
#app#app .buyers-screen .buyers-filter-btn{
  min-height:44px;padding:8px 10px;border:1px solid var(--ui-line);
  border-radius:var(--ui-control-radius);background:#fff;color:#52605a;
  font-size:13px;font-weight:800;box-shadow:none
}
#app#app .job-list-screen[data-job-list-type="Lithium"] .job-entry-filter-btn.active{
  background:var(--ui-lithium-soft);border-color:var(--ui-lithium-line);color:var(--ui-lithium-ink);-webkit-text-fill-color:var(--ui-lithium-ink)
}
#app#app .job-list-screen[data-job-list-type="Repair"] .job-entry-filter-btn.active{
  background:var(--ui-repair-soft);border-color:var(--ui-repair-line);color:var(--ui-repair-ink);-webkit-text-fill-color:var(--ui-repair-ink)
}
#app#app .buyers-screen .buyers-filter-btn.active{
  background:var(--ui-buyer-soft);border-color:var(--ui-buyer-line);color:var(--ui-buyer-ink);-webkit-text-fill-color:var(--ui-buyer-ink)
}

#app#app .work-cost-item>div:last-child button,
#app#app .inventory-cost-actions button{
  width:auto;min-width:64px;min-height:40px;padding:8px 10px;
  border:1px solid var(--ui-line);border-radius:var(--ui-control-radius);background:#fff;
  color:#46514c;-webkit-text-fill-color:#46514c;font-size:13px;font-weight:800
}
#app#app .work-cost-item>div:last-child button[data-delete-work-cost],
#app#app .inventory-cost-actions button[data-delete-cost-row]{
  border-color:#e0b2b2;background:var(--ui-danger-bg);color:var(--ui-danger);-webkit-text-fill-color:var(--ui-danger)
}

/* Equivalent normal actions have one neutral style unless a module-specific rule above applies. */
#app#app :where(
  .work-detail-shell,.lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.job-list-screen,.my-day-screen,.calendar-screen,.messages-screen,.tasks-screen,
  .vendors-screen,.accounts-screen,.ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) :where(button.primary,button.secondary){
  min-height:var(--ui-button-height);border-radius:var(--ui-control-radius);
  font-size:var(--ui-font-button);line-height:1.15;font-weight:800;box-shadow:none
}
#app#app :where(
  .lead-detail-screen,.new-lead-screen,.my-day-screen,.calendar-screen,.messages-screen,.tasks-screen,
  .vendors-screen,.accounts-screen,.ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) button.primary{
  background:var(--ui-soft-2);border:1px solid #bcc8c1;color:#3e4944;-webkit-text-fill-color:#3e4944
}

/* ---------- Hard-lock typography and geometry (no !important required) ---------- */
#app#app :where(
  .job-list-heading,.buyers-heading,.inventory-heading,.calendar-heading,.messages-heading,
  .tasks-heading,.vendors-heading,.accounts-heading,.ads-heading,.receipts-heading,
  .work-detail-name,.lead-detail-name
){font-size:var(--ui-font-page);line-height:1.15;font-weight:900;letter-spacing:-.01em}

#app#app :where(
  .job-list-card-name,.inventory-main-identity>strong,.work-card .customer-name,
  .account-name,.vendor-name
){font-size:var(--ui-font-card);line-height:1.15;font-weight:900;letter-spacing:-.01em}

#app#app :where(
  .job-list-card-contact,.job-list-card-cart,.inventory-card-cart,.inventory-main-meta,
  .work-card .meta,.work-card .submeta,.work-cost-item span,.inventory-cost small,
  .global-search-helper
){font-size:var(--ui-font-meta);line-height:1.32;color:var(--ui-muted);font-weight:650}

#app#app :where(
  .work-detail-info-grid label>span,.work-detail-long>span,.work-core-edit-form label>span,
  .new-lead-form label>span,.buyer-profile-grid label>span,.operational-cost-grid>label>span,
  .operational-cost-total span,.inventory-fin-grid span,.work-cost-total span,
  .cost-receipt-title,.receipt-label
){font-size:var(--ui-font-label);line-height:1.2;font-weight:800;letter-spacing:.025em;color:#56625c}

#app#app :where(
  .job-list-card,.work-card,.work-detail-section,.work-more-group,.work-detail-disclosure,
  .inventory-main-card,.inventory-detail-section,.inventory-cost,.buyer-card,.buyer-profile-card,
  .account-card,.vendor-card,.message-card,.task-card,.calendar-agenda-card,
  .new-lead-section,.global-search-panel,.global-search-result
){border-radius:var(--ui-card-radius)}

#app#app :where(
  .work-detail-shell,.lead-detail-screen,.new-lead-screen,.inventory-screen,.inventory-detail-screen,
  .buyers-screen,.job-list-screen,.my-day-screen,.calendar-screen,.messages-screen,.tasks-screen,
  .vendors-screen,.accounts-screen,.ads-screen,.ad-detail,.global-search-screen,.search-screen,.receipts-screen
) :where(button.primary,button.secondary){
  min-height:var(--ui-button-height);border-radius:var(--ui-control-radius);
  font-size:var(--ui-font-button);line-height:1.15;font-weight:800;box-shadow:none
}

/* PATCH 2X — authoritative operational/admin action lock.
   This block intentionally wins over all legacy module/button rules. */
body #app .operational-cost-editor .operational-cost-actions .cost-save-main,
body #app .operational-cost-editor.module-lithium .operational-cost-actions .cost-save-main,
body #app .operational-cost-editor.module-repair .operational-cost-actions .cost-save-main,
body #app .operational-cost-editor.module-inventory .operational-cost-actions .cost-save-main {
  min-height: 46px !important;
  padding: 9px 12px !important;
  border-radius: var(--ui-control-radius) !important;
  background: var(--cost-soft, var(--ui-soft)) !important;
  border: 1px solid var(--cost-line, var(--ui-line)) !important;
  color: var(--cost-ink, var(--ui-green)) !important;
  -webkit-text-fill-color: var(--cost-ink, var(--ui-green)) !important;
  box-shadow: none !important;
  font-size: var(--ui-font-button) !important;
  font-weight: 850 !important;
}
body #app .operational-cost-editor .operational-cost-actions .cost-cancel {
  min-height: 46px !important;
  padding: 9px 12px !important;
  border-radius: var(--ui-control-radius) !important;
  background: #fff !important;
  border: 1px solid var(--ui-line) !important;
  color: #46514c !important;
  -webkit-text-fill-color: #46514c !important;
  box-shadow: none !important;
  font-size: var(--ui-font-button) !important;
  font-weight: 800 !important;
}

/* Admin cost correction: same action geometry; destructive remains red but not undersized. */
body #app .financial-cost-editor-secondary > button.fin-link.danger[data-delete-fin-cost],
body #app .financial-cost-form-actions .fin-btn {
  min-height: 44px !important;
  border-radius: var(--ui-control-radius, 9px) !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}
body #app .financial-cost-editor-secondary > button.fin-link.danger[data-delete-fin-cost] {
  min-width: 118px !important;
  border: 1px solid #ddb7b7 !important;
  background: #fff !important;
  color: #9b3d3d !important;
  -webkit-text-fill-color: #9b3d3d !important;
}
body #app .financial-cost-form-actions {
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}
body #app .financial-cost-form-actions .fin-btn:not(.primary) {
  background: #fff !important;
  border: 1px solid var(--ui-line, #c7d2cc) !important;
  color: #46514c !important;
  -webkit-text-fill-color: #46514c !important;
}
body #app .financial-cost-form-actions .fin-btn.primary {
  background: var(--ui-soft, #f2f5f3) !important;
  border: 1px solid var(--ui-green-line, #9fb5a9) !important;
  color: var(--ui-green, #175c3d) !important;
  -webkit-text-fill-color: var(--ui-green, #175c3d) !important;
}

/* 2026-10-04 — Operational action symmetry audit.
   Keep action rows visually balanced across the app: one action fills the row;
   multiple sibling actions divide the available width evenly. Context menus,
   navigation controls, status buttons, and destructive menu items are excluded. */
#app .transport-v2-actions,
#app .review-actions,
#app .inspection-email-actions,
#app .inventory-editor-actions,
#app .inventory-interest-actions,
#app .message-form-actions,
#app .task-actions{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(110px,1fr));
  gap:8px;
  width:100%;
}

#app .transport-v2-actions > :where(button,a),
#app .review-actions > :where(button,a),
#app .inspection-email-actions > :where(button,a),
#app .inventory-editor-actions > :where(button,a),
#app .inventory-interest-actions > :where(button,a),
#app .message-form-actions > :where(button,a),
#app .task-actions > :where(button,a){
  width:100%;
  min-width:0;
  margin:0;
  box-sizing:border-box;
}

/* Upload/intake-style single actions should not look like undersized pills. */
#app .attachments-upload{
  display:grid;
  grid-template-columns:1fr;
  width:100%;
}
#app .attachments-upload > button{
  width:100%;
  min-width:0;
  margin:0;
  box-sizing:border-box;
}

/* Composer pairs are deliberately equal-width rather than 1fr + content width. */
#app .inspection-email-actions,
#app .review-actions{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

@media(max-width:430px){
  #app .transport-v2-actions,
  #app .inventory-editor-actions,
  #app .inventory-interest-actions,
  #app .message-form-actions,
  #app .task-actions{
    grid-template-columns:repeat(auto-fit,minmax(100px,1fr));
    gap:7px;
  }
}

/* 2026-10-06 — Step 6B authoritative list-card action fill.
   Final-loaded stylesheet intentionally wins over legacy Inventory/module button rules. */
body #app .job-list-card .standard-card-primary-actions > a,
body #app .job-list-card .standard-card-primary-actions > button,
body #app .job-list-card .standard-card-secondary-actions > a,
body #app .job-list-card .standard-card-secondary-actions > button,
body #app .inventory-main-card .standard-card-primary-actions > a,
body #app .inventory-main-card .standard-card-primary-actions > button,
body #app .inventory-main-card .standard-card-secondary-actions > a,
body #app .inventory-main-card .standard-card-secondary-actions > button {
  background:#fff!important;
}