/**
 * measured — Affordance Pattern 5 (spike/notebook-stream-design-bets v31).
 *
 * Caitlin direct: "are you sure that notion has drift? it does not seem that
 * way to me ... this is solveable - we need to get it right." She was right.
 *
 * Inspection of saved Notion HTML revealed they use a SINGLE floating overlay
 * positioned by JS measurement (getBoundingClientRect). This variant ports
 * that architecture.
 *
 * Composition: like focus-toolbar, "measured" builds ON TOP of narrative.
 * JS in stream-variant.js sets body to BOTH stream-variant="narrative" and
 * affordance-pattern="measured" — so all narrative typography / H-cascade /
 * Fibonacci breathing / left-boundary alignment continues. Only the
 * affordance mechanism changes.
 *
 * What this file does:
 *   1. Hide the per-cell __margin gutter (the affordances now live in the
 *      single floating overlay, not in each cell)
 *   2. Hide band-head chev + add (same reason)
 *   3. Style the floating overlay (.notebook-stream-affordance-overlay)
 *      — a 3-button strip that gets transformed into position by JS
 *
 * The JS module (stream-affordance-overlay.js) handles measurement +
 * positioning + click delegation.
 */

/* ── Hide per-cell + per-band affordances under measured ────────────────
 * Each of the `` rules below defeats a higher-specificity
 * `body[data-notebook-stream-variant="narrative"] .X { display: ... }`
 * declaration in notebook-stream-variant-narrative.css (lines 391/438/635
 * for margin/kebab/chev respectively). Without ``, the narrative
 * variant rules win at (0,3,1) vs our (0,2,1). Caitlin direct 2026-06-07
 * — B audit unjustified- pass. */

body[data-notebook-affordance-pattern="measured"] .notebook-cell__margin {
  display: none;
}

body[data-notebook-affordance-pattern="measured"] .nb-group__chev,
body[data-notebook-affordance-pattern="measured"] .notebook-shell__group-chev,
body[data-notebook-affordance-pattern="measured"] .nb-group__add,
body[data-notebook-affordance-pattern="measured"] .notebook-shell__group-add {
  display: none;
}

/* Cell kebab TRIGGER button hidden under measured — its function (open
 * menu) is delegated to the overlay's drag button. The kebab WRAP stays
 * so the menu can still render when triggered programmatically (the wrap
 * holds both trigger + menu DOM). */
body[data-notebook-affordance-pattern="measured"] .notebook-cell__kebab-trigger {
  display: none;
}

/* ── Floating affordance overlay (one per stream, JS-positioned) ─────── */

.notebook-stream-affordance-overlay {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  /* No background, border, or shadow — the buttons stand alone */
  background: transparent;
  border: 0;
  box-shadow: none;
  /* Padding-right extends the overlay's bounding box INTO the cell area
   * so hover transits from cell → buttons don't pass through a gap.
   * Tightened from 96px to 24px after the gap dropped from 8px → 3px
   * (Caitlin direct 2026-06-06: "padding on the right still feels off").
   * 24px still bridges the new tiny gap reliably without over-reaching. */
  padding: 0 24px 0 0;
  /* Container itself is non-interactive; buttons inside are auto. This
   * lets clicks pass through the transparent extension to cell content
   * underneath while the buttons remain clickable. */
  pointer-events: none;
  will-change: transform, opacity;
}

.notebook-stream-affordance-overlay__btn {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: var(--s-color-fg-tertiary);
  cursor: pointer;
  border-radius: 3px;
  padding: 0;
  /* Buttons are interactive even though container is pointer-events:none. */
  pointer-events: auto;
  transition: background 100ms ease, color 100ms ease;
  /* iPad — suppress the OS text/share callout on long-press so our own
   * 500ms long-press selection gesture can land cleanly. */
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  touch-action: manipulation;
}

.notebook-stream-affordance-overlay__btn:hover {
  background: var(--s-color-bg-subtle);
  color: var(--s-color-fg-primary);
}

.notebook-stream-affordance-overlay__btn:focus-visible {
  outline: 2px solid var(--s-color-accent-active);
  outline-offset: 1px;
}

/* In non-measured variants, the overlay is hidden — only visible when
 * the JS module activates it via opacity. The DOM stays mounted to allow
 * smooth transitions when the variant flips. */
body:not([data-notebook-affordance-pattern="measured"]) .notebook-stream-affordance-overlay,
body:not([data-notebook-affordance-pattern="measured"]) .notebook-rail-affordance-overlay {
  display: none;
}

/* ════════════════════════════════════════════════════════════════════════
 * v42 — Collapse override for project-presets under narrative
 *
 * Evidence from v41 computed-style log: data-collapsed='true' is set,
 * but body's computed display is 'flex'. The narrative rule at line 40
 * of notebook-stream-variant-narrative.css sets display:flex with
 * higher specificity (0,4,0) than the base collapse rule
 * `.notebook-cell[data-collapsed="true"] .__body { display: none }` (0,3,0).
 *
 * Fix: override here with even higher specificity (0,4,1 — adds an
 * attribute selector). Lives in the measured variant because that's
 * where the overlay's chev toggles cells directly; non-measured
 * variants don't have this collapse-via-overlay path yet.
 * ═══════════════════════════════════════════════════════════════════════ */

body[data-notebook-stream-variant="narrative"]
  .notebook-cell--project-presets[data-collapsed="true"]
  .notebook-cell__body--project-presets,
body[data-notebook-stream-variant="narrative"]
  .notebook-cell:has(.notebook-cell__body--project-presets)[data-collapsed="true"]
  .notebook-cell__body--project-presets {
  display: none;
}

/* Same for cas-sar widget bodies and any other widget body that has a
 * narrative-specific display rule overriding base collapse. */
body[data-notebook-stream-variant="narrative"]
  .notebook-cell[data-collapsed="true"] .notebook-cell__body {
  display: none;
}

/* ── Rail affordance overlay (v36) — tighter sibling for outline rail ── */

.notebook-rail-affordance-overlay {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0 8px 0 32px; /* left-padding gives transit zone from row content */
  pointer-events: none;
  will-change: transform, opacity;
}

.notebook-rail-affordance-overlay__btn {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: var(--s-color-fg-tertiary);
  cursor: pointer;
  border-radius: 3px;
  padding: 0;
  pointer-events: auto;
  transition: background 100ms ease, color 100ms ease;
}

.notebook-rail-affordance-overlay__btn:hover {
  background: var(--s-color-bg-subtle);
  color: var(--s-color-fg-primary);
}

.notebook-rail-affordance-overlay__btn:focus-visible {
  outline: 2px solid var(--s-color-accent-active);
  outline-offset: 1px;
}
