/* ==========================================================================
   pf-ask.css — 2026-09-11

   FOUNDER: "It should ask if it has no idea, not assume." / "Removed stays
   removed." Two surfaces, one voice:

   · the import review's QUESTION rows — a heading the parser cannot name is a
     question with no answer filled in, and the review says so until it has one;
   · the sheet's "Use as" control and the "Restore removed rows" line.

   Tokens only (tokens.css). No new hues. Loaded last so it can settle on top of
   r5.css's classify row and pf-portfolio.css's panel without editing either.
   ========================================================================== */

/* ------------------------------------------------- THE QUESTION, IN REVIEW */
.folio-v5 .import-group .import-classify-row.import-classify-ask {
  grid-template-columns: minmax(0, 1fr);
  gap: var(--cx-s3);
  align-items: start;
}
.folio-v5 .import-classify-row[data-needs-answer] {
  border-left: 2px solid var(--cx-cons-vermilion);
  padding-left: var(--cx-s4);
}
.folio-v5 .import-ask-set {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}
.folio-v5 .import-ask-set > legend {
  padding: 0;
  color: var(--cx-ink);
  font: 600 13px/1.4 var(--cx-font-ui);
}
.folio-v5 .import-ask-choices {
  display: flex;
  flex-wrap: wrap;
  gap: var(--cx-s2);
  margin-top: var(--cx-s3);
}
.folio-v5 .import-ask-choice {
  display: inline-flex;
  align-items: center;
  gap: var(--cx-s2);
  min-height: 40px;
  padding: 0 var(--cx-s4);
  border: 1px solid var(--cx-line-strong);
  border-radius: var(--cx-r-pill);
  background: var(--cx-paper);
  color: var(--cx-ink);
  font: 500 13px/1.2 var(--cx-font-ui);
  cursor: pointer;
}
.folio-v5 .import-ask-choice:hover { border-color: var(--cx-ink); }
.folio-v5 .import-ask-choice input { margin: 0; accent-color: var(--cx-ink); }
.folio-v5 .import-ask-choice:has(input:checked) {
  border-color: var(--cx-ink);
  background: var(--cx-mist);
}
.folio-v5 .import-ask-choice:has(input:focus-visible) {
  outline: 2px solid var(--cx-accent-ring);
  outline-offset: 2px;
}
.folio-v5 .import-ask-reason,
.folio-v5 .import-ask-needed {
  max-width: 72ch;
  margin: var(--cx-s3) 0 0;
  font: 400 13px/1.55 var(--cx-font-ui);
  color: var(--cx-ink60);
}
.folio-v5 .import-ask-needed {
  color: var(--cx-cons-vermilion);
  font-weight: 600;
}
.folio-v5 .import-ask-block {
  max-width: 62ch;
  margin: var(--cx-s3) 0 0;
  font: 400 13px/1.6 var(--cx-font-ui);
  color: var(--cx-ink60);
}
.folio-v5 .import-ask-block > b { color: var(--cx-cons-vermilion); font-weight: 600; }
.folio-v5 .import-ask-block .text-link { font: inherit; }
.folio-v5 .resume-import-actions .button[disabled] { opacity: .5; cursor: not-allowed; }

/* ------------------------------------------- THE SAME QUESTION, ON THE SHEET */
.cxs-useas {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--cx-s2);
  min-width: 0;
}
.cxs-useas-label {
  color: var(--cx-ink60);
  font: 500 11px/1 var(--cx-font-mono);
  letter-spacing: .06em;
  text-transform: uppercase;
}
.cxs-useas button {
  min-height: 40px;
  padding: 0 var(--cx-s3);
  border: 1px solid var(--cx-line-strong);
  border-radius: var(--cx-r-pill);
  background: var(--cx-paper);
  color: var(--cx-ink);
  font: 500 13px/1.2 var(--cx-font-ui);
  cursor: pointer;
}
.cxs-useas button:hover:not([disabled]) { border-color: var(--cx-ink); }
.cxs-useas button[aria-pressed="true"] { border-color: var(--cx-ink); background: var(--cx-mist); }
.cxs-useas button[disabled] { opacity: .45; cursor: not-allowed; }
.cxs-panel-help {
  max-width: 72ch;
  margin: var(--cx-s3) 0 0;
  color: var(--cx-ink60);
  font: 400 13px/1.55 var(--cx-font-ui);
}

/* ------------------------------------------------------------- THE WAY BACK */
.cxs-restore { margin: var(--cx-s2) 0 0; }
.cxs-restore button {
  min-height: 40px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--cx-ink60);
  font: 400 13px/1.4 var(--cx-font-ui);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.cxs-restore button:hover { color: var(--cx-ink); }

@media (max-width: 767px) {
  .folio-v5 .import-classify-row.import-classify-ask { gap: var(--cx-s2); }
  .folio-v5 .import-ask-choice { width: 100%; }
  .cxs-useas { width: 100%; }
  .cxs-useas button { flex: 1 1 44%; }
}
