/* =============================================================================
   Deal detail — ultra polish
   -----------------------------------------------------------------------------
   Sibling of contact-detail-ultra-polish.css. Additive, dark-theme finish pass
   for the single-deal workspace (#dealWorkspaceMount). Scoped to the deal mount
   so it can't leak into contact / quick-add chrome. Loaded last in index.html.

   NOTE: The deal workspace already ships a comprehensive, deliberate dark theme
   (styles-dark-deals.css) plus deferred deal-page.css — cards, titles, labels,
   values and tabs are already themed with !important. So unlike the contact
   pass, this layer intentionally does NOT restyle cards / titles / labels /
   value links / tabs (those rules would either be dead against !important or
   fight the established design, e.g. shrink the deliberate 20px card radius or
   widen the display-font title tracking). It contributes only the transferable
   wins: the calm flat section-header rhythm, a crisper row hover, the + Add
   field accent, focus rings, and text smoothing. Purely visual finish — no
   field-grid geometry. See /polishit for the shared recipe.
   ============================================================================= */

html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ── Section headers (RECORD & OWNERSHIP / DEAL CONTEXT / CUSTOM / …) ───────
   The visible deal section labels are the flat field-arrange headers (the
   source .deal-details-stack-eyebrow markup is hidden on desktop simple mode).
   Trade the filled grey pill for a quiet, well-tracked caption above a hairline
   rule — the calmer, more premium rhythm shared with the contact detail page. */
html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount
  .deal-detail-fields-layout .contact-detail-field-row--section-header {
  background: transparent;
  border-radius: 0;
  margin: 20px 4px 6px;
  padding: 12px 2px 6px;
  border-top: 1px solid rgba(240, 240, 240, 0.09);
}

html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount
  .deal-detail-fields-layout > .contact-detail-field-row--section-header:first-child {
  margin-top: 2px;
  padding-top: 2px;
  border-top: none;
}

html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount
  .deal-detail-fields-layout
  .contact-detail-field-row--section-header .contact-detail-field-row__section-title {
  color: rgba(240, 240, 240, 0.82);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.09em;
}

/* ── Field rows ───────────────────────────────────────────────────────────
   Slightly deeper, crisply outlined hover so a row reads as one tap target.
   Refines the base rgba(255,255,255,.04) hover; excludes section headers and
   multi-entry cards (the base intentionally keeps those transparent). */
html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount
  .deal-detail-fields-layout
  .contact-detail-field-row:not(.contact-detail-field-row--section-header):not(:has(.cf-field-wrapper--multi-entry)):hover {
  background: rgba(255, 255, 255, 0.05);
  box-shadow: inset 0 0 0 1px rgba(240, 240, 240, 0.06);
  border-radius: 9px;
}

/* ── "+ Add field" ───────────────────────────────────────────────────────── */
html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount
  .deal-detail-fields-layout .contact-detail-add-field {
  transition: color 0.12s ease, background 0.12s ease;
}

html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount
  .deal-detail-fields-layout .contact-detail-add-field:hover {
  color: #a3c1dc !important;
}

/* ── Focus visibility (a11y + finish) ─────────────────────────────────────── */
html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount a:focus-visible,
html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount button:focus-visible,
html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount .inline-input:focus-visible,
html[data-theme="dark"] body[data-theme="momentum"] #dealWorkspaceMount .deal-modal-input:focus-visible {
  outline: 2px solid rgba(143, 179, 209, 0.7);
  outline-offset: 2px;
  border-radius: 6px;
}