/* referral.css -- Phase 5 Contractor invite + PO acceptance cards. Uses the platform PO-green accent. */
.npca-v2-referral-invite, .npca-v2-referral-accept { margin: 0 0 1.25rem; }
.npca-v2-referral-invite__title, .npca-v2-referral-accept__title { margin: 0 0 .5rem; font-size: 1.02rem; font-weight: 700; }
.npca-v2-referral-invite__form { display: flex; flex-direction: column; gap: .6rem; margin-top: .75rem; max-width: 32rem; }
.npca-v2-referral-invite__field { display: flex; flex-direction: column; gap: .25rem; font-size: .88rem; }
.npca-v2-referral-invite__field input, .npca-v2-referral-invite__field textarea {
  padding: .5rem .6rem; border: 1px solid rgba(0,0,0,.2); border-radius: 6px; font: inherit; }
.npca-v2-referral-invite__actions, .npca-v2-referral-accept__actions { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: .35rem; }
.npca-v2-referral-invite__result { margin-top: .85rem; padding: .75rem; background: rgba(3,104,54,.06); border-radius: 6px; font-size: .9rem; }
.npca-v2-referral-invite__url { width: 100%; margin-top: .4rem; padding: .45rem .55rem; border: 1px solid rgba(0,0,0,.2); border-radius: 6px; font: inherit; }
.npca-v2-referral-invite__error, .npca-v2-referral-accept__error { margin: .6rem 0 0; color: #b3261e; font-size: .85rem; }
.npca-v2-referral-accept { border-left: 4px solid #036836; padding-left: .9rem; }
.npca-v2-referral-accept__note { font-style: italic; }
/* Dark-mode block REMOVED in 0.17.99 (CSS isolation Phase B): the host Bricks site is permanently
   light, so this only fired for a viewer with OS dark mode -- giving these inputs a near-invisible
   light border (rgba(255,255,255,.25)) on the site's white surface. NPCA commits to light (see
   platform-shell.css .npca-v2-shell{color-scheme:light}); the light-mode input border stays. */

/* ================================================================================================
   Phase 8: Contractor Referral Toolkit (durable link + QR + website embed + rotate) and the PO durable
   acceptance card. CSS-isolation Option A (0.17.99): every rule is scoped to a `.npca-v2-*` class (never
   a bare element / global selector), colours come from the emitted --match-* tokens with the same
   literal fallbacks the rest of the plugin uses, and there is NO `@media (prefers-color-scheme: dark)`
   block -- the host Bricks site is permanently light and .npca-v2-shell owns color-scheme:light.
   ================================================================================================ */
.npca-v2-referral-toolkit { margin: 0 0 1.25rem; }
.npca-v2-referral-toolkit__title { margin: 0 0 .5rem; font-size: 1.02rem; font-weight: 700; color: var(--match-ink, #272F3D); }
.npca-v2-referral-toolkit__intro { margin: 0 0 1rem; }
.npca-v2-referral-toolkit__body { display: flex; flex-direction: column; gap: 1rem; max-width: 36rem; }
/* [hidden] guard (0.17.108): an author `display:flex` above beats the UA stylesheet's
   `[hidden]{display:none}` by cascade ORIGIN, so WITHOUT this the toolkit body stayed VISIBLE (empty
   boxes) whenever the template/JS set `hidden` -- the server-unavailable fallback and pre-load states
   were supposed to show ONLY the "Show my referral link" button, not blank fields. This 2-class-plus-attr
   selector out-specifies the display rules above and restores the attribute for every toolkit element
   that uses it (body / feedback / error / fallback). Same class of fix as the select-modal[hidden] guard
   (selection.css) -- no !important, per the NPCA CSS-isolation architecture. */
.npca-v2-referral-toolkit [hidden] { display: none; }
.npca-v2-referral-toolkit__field { display: flex; flex-direction: column; gap: .3rem; font-size: .88rem; }
.npca-v2-referral-toolkit__label { font-weight: 600; color: var(--match-ink, #272F3D); }
.npca-v2-referral-toolkit__linkrow, .npca-v2-referral-toolkit__embedrow { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.npca-v2-referral-toolkit__url {
  flex: 1 1 16rem; min-width: 0; padding: .5rem .6rem; font: inherit;
  border: 1px solid var(--match-border, #E2E8EE); border-radius: 6px;
  background: var(--match-surface, #FFFFFF); color: var(--match-ink, #272F3D);
}
.npca-v2-referral-toolkit__embed {
  width: 100%; padding: .5rem .6rem; font: inherit; resize: vertical;
  border: 1px solid var(--match-border, #E2E8EE); border-radius: 6px;
  background: var(--match-surface, #FFFFFF); color: var(--match-ink, #272F3D);
}
.npca-v2-referral-toolkit__qr { display: flex; flex-direction: column; gap: .3rem; }
.npca-v2-referral-toolkit__qrbox {
  width: 168px; height: 168px; padding: 8px; border: 1px solid var(--match-border, #E2E8EE);
  border-radius: 8px; background: var(--match-surface, #FFFFFF);
}
.npca-v2-referral-toolkit__qrbox svg { display: block; width: 100%; height: 100%; }
.npca-v2-referral-toolkit__qrhint, .npca-v2-referral-toolkit__embedhint, .npca-v2-referral-toolkit__rotatehint {
  font-size: .82rem; color: var(--match-ink-muted, #5A6577);
}
.npca-v2-referral-toolkit__rotate { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: .25rem; }
.npca-v2-referral-toolkit__fallback { margin-top: .5rem; }
.npca-v2-referral-toolkit__feedback { margin: .75rem 0 0; font-size: .85rem; color: var(--match-accent, #1F6F4A); }
.npca-v2-referral-toolkit__error { margin: .6rem 0 0; font-size: .85rem; color: var(--match-danger, #B3261E); }

/* PO durable acceptance card -- shares the Phase 5 accept card's green left rule via its base class;
   this modifier exists only as a JS/CSS hook and for any future durable-specific treatment. */
.npca-v2-referral-accept--durable { /* inherits .npca-v2-referral-accept */ }

/* Public pre-login referral landing (shortcode [npca_referral_welcome]). */
.npca-v2-referral-welcome { margin: 0 0 1.25rem; border-left: 4px solid var(--match-accent, #1F6F4A); padding-left: .9rem; }
.npca-v2-referral-welcome__title { margin: 0 0 .5rem; font-size: 1.1rem; font-weight: 700; color: var(--match-ink, #272F3D); }
.npca-v2-referral-welcome__actions { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: .85rem; }
.npca-v2-referral-welcome__note { margin: .75rem 0 0; font-size: .85rem; color: var(--match-ink-muted, #5A6577); }

/* Phase 6: Contractor per-scope willingness ("Not performing this work") on a Matched card. */
.npca-v2-match-willingness { margin-top: 1rem; padding-top: 0.85rem; border-top: 1px solid rgba(0,0,0,0.08); }
.npca-v2-match-willingness__title { margin: 0 0 0.25rem; font-size: 0.95rem; font-weight: 600; }
.npca-v2-match-willingness__hint { margin: 0 0 0.6rem; font-size: 0.82rem; opacity: 0.72; }
.npca-v2-match-willingness__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.4rem; }
.npca-v2-match-willingness__item { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap; }
.npca-v2-match-willingness__scope { font-weight: 500; }
.npca-v2-match-willingness__item.is-declined .npca-v2-match-willingness__scope { text-decoration: line-through; opacity: 0.6; }
.npca-v2-match-willingness__declined-note { font-size: 0.8rem; opacity: 0.75; }
.npca-v2-match-willingness__feedback { margin: 0.6rem 0 0; font-size: 0.85rem; }
