/* Neuropsych attention profile (NEU-495 step 2): the ADHD check's profile in
   the founder's treatment V2 "Report preview". The frame (paper sheet, ruled
   running head, result line, limits, the chart of three areas against three
   zones, the tail) is the dyscalculia check's V2 markup from NEU-489, styled
   in /shared/neuropsych-dyscheck.css (dc-v2 ...). This file adds only what the
   attention profile has on top: the questionnaire count, a described area's
   chart row, the task rows, the report line, the attribution, and the
   attribution under each question. Tokens come from the check page
   (platform/adhd/check/index.html). Light only, as the site. */
.ap{--zone2:#e1e5eb;--rule:rgba(17,24,39,.12)}

/* the questionnaire count: leads, never a verdict */
.ap-asrs{border:1px solid var(--rule);border-radius:10px;padding:10px 12px 12px;background:var(--surface,#fff)}
.ap-asrs-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.ap .ap-asrs-h h2,.ap .ap-asrs-h h4{font:700 13.5px/1.2 var(--head);color:var(--text);margin:0}
.ap-asrs-h span{font:500 10.5px var(--mono);color:var(--text3);white-space:nowrap}
.ap-asrs-row{display:flex;align-items:center;gap:14px;margin:8px 0 6px}
.ap .ap-asrs-n{font:800 26px/1 var(--head);letter-spacing:-.02em;color:var(--text);white-space:nowrap}
.ap-meter{flex:1;min-width:0;position:relative;padding-bottom:16px}
.ap-meter-cells{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px}
.ap-meter-cells i{display:block;height:12px;border-radius:2px;background:var(--zone2)}
.ap-meter-cells i.on{background:var(--accent,#0f4c5c)}
/* the threshold: a rule at the left edge of the fourth cell, labelled below it */
.ap-meter-cells i.thr{position:relative}
.ap-meter-cells i.thr::before{content:"";position:absolute;left:-2.5px;top:-4px;bottom:-4px;width:2px;background:var(--text);border-radius:1px}
.ap-meter-thr{position:absolute;left:calc(50% - 2px);bottom:0;font:500 10.5px/1.2 var(--mono);color:var(--text3);white-space:nowrap}
.ap .ap-asrs-line{font-size:12.5px;line-height:1.45;color:var(--text2)}

/* a described area (no comparison yet) spans the three zones */
.dc-cell.ap-none{grid-column:span 3;font:500 11px/1.2 var(--sans);color:var(--text3);padding-left:2px}

/* what the tasks measured: the person's own numbers in plain words */
.ap .ap-saws h2{font:600 11px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--text3);margin:4px 0 2px}
.ap-saws ul{list-style:none;margin:0;padding:0}
.ap-saw{padding:8px 0 6px;border-top:1px solid var(--border)}
.ap-saw-h{display:flex;align-items:baseline;gap:8px;font-size:12.5px;color:var(--text)}
.ap-saw-h b{font-weight:600}
.ap-saw-a{font-size:11.5px;color:var(--text3);flex:1;min-width:0}
.ap .ap-saw p{font-size:13px;color:var(--text2);line-height:1.5;margin:2px 0 0}

/* the report line, in the offer card's place until the attention product exists */
.ap .ap-coming{font-size:13px;line-height:1.45;color:var(--text2)}

/* NEU-496: the Attention report card is the shared one (.dc-offer in
   neuropsych-dyscheck.css); while the product is off it keeps the frame,
   the drawing and the title with one line (.dc-offer-coming). */
.dc-offer.dc-offer-coming .dc-offer-line{margin-top:2px}

/* NEU-496: the attention section of /results/ (.ap-embed in .dc-embed):
   the card sits under the chart in the main column, its heading an h4 */
.ap-embed .ap-asrs{margin:0 0 12px}
.ap-embed .ap-offer-slot{margin:16px 0 0}
.dc-embed.ap-embed .dc-offer h4{font:800 18px/1.2 var(--head);letter-spacing:-.015em;color:var(--text);margin:0}
.ap-embed .dc-acts .dc-btn-secondary{display:flex;align-items:center;justify-content:center;min-height:44px;text-decoration:none}

/* the ASRS attribution under every question */
.ap-qattr{font-size:10.5px;line-height:1.45;text-align:left;margin:14px 0 0}

@media(min-width:760px){
  .ap-asrs{padding:16px 20px 14px}
  .ap .ap-asrs-h h2{font-size:16px}
  .ap-asrs-h span{font-size:12px}
  .ap .ap-asrs-n{font-size:34px}
  .ap-meter{max-width:360px}
  .ap-meter-cells i{height:16px}
  .ap .ap-asrs-line{font-size:14px}
  .dc-v2 .dc-cell.ap-none{font-size:13px}
  .ap-saws ul{display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
  .ap-saw-h{font-size:13.5px}
  .ap .ap-coming{font-size:14px}
  .ap-embed .ap-asrs .ap-asrs-n{font-size:28px}
  .dc-embed.ap-embed .dc-offer h4{font-size:24px}
}