/**
 * Plan Builder — Step 4 (level rating) + Step 5 (review lessons) styles.
 *
 * Scarcity recast, increment 2. Scoped under .asm-modal (the Add Student shell), where the
 * .pbm-* CSS vars don't resolve — so colors are the mock's exact hexes
 * (frontend/plan-builder-recast-mock.html), matching add-student-modal.css's approach.
 */

/* ── Step 4: level rating rows ─────────────────────────────────── */
.asm-modal .pbm-srow-desc { font-size: 12px; color: #5b6b5c; padding: 0 13px 12px 37px; }
.asm-modal .pbm-intake-note {
  font-size: 12px; color: #5b6b5c; background: #F7F9F7; border: 1px solid #E6EAE6;
  border-radius: 9px; padding: 9px 12px; margin: 0 0 14px;
}
.asm-modal .pbm-intake-note b { color: #1A2718; }

/* ── Step 5: queue punchline banner ────────────────────────────── */
.asm-modal .pbm-punch {
  display: flex; align-items: center; gap: 12px;
  background: linear-gradient(to right, #EAF5EA, #fff);
  border: 1px solid #cfe6cf; border-radius: 12px; padding: 14px 16px; margin-bottom: 8px;
}
.asm-modal .pbm-punch .pbm-big { font-size: 16px; font-weight: 800; color: #1A2718; }
.asm-modal .pbm-punch .pbm-sub { font-size: 12px; color: #5b6b5c; margin-top: 2px; }
.asm-modal .pbm-tally {
  margin-left: auto; flex-shrink: 0; font-size: 12.5px; font-weight: 800; color: #fff;
  background: #44A148; border-radius: 20px; padding: 7px 14px;
}
.asm-modal .pbm-qsum { font-size: 12px; color: #5b6b5c; margin: 0 0 16px 2px; }
.asm-modal .pbm-qsum b { color: #1A2718; }

/* group headers with a trailing rule */
.asm-modal .pbm-grouphead {
  display: flex; align-items: center; gap: 10px; font-size: 11px; font-weight: 800;
  letter-spacing: .05em; text-transform: uppercase; color: #2D6A2F; margin: 4px 0 10px;
}
.asm-modal .pbm-grouphead.pbm-horizon { color: #5b6b5c; margin-top: 22px; }
.asm-modal .pbm-grouphead .pbm-ln { flex: 1; height: 1px; background: #E6EAE6; }

/* ready-suite card + read-only level tag */
.asm-modal .pbm-srow.pbm-ready { border-color: #cfe6cf; }
.asm-modal .pbm-lvltag {
  margin-left: auto; font-size: 10.5px; font-weight: 800; letter-spacing: .02em;
  text-transform: uppercase; border-radius: 20px; padding: 3px 10px;
}
.asm-modal .pbm-lvltag.pbm-l1 { background: #DCEFDD; color: #246b28; }
.asm-modal .pbm-lvltag.pbm-l2 { background: #79BC7D; color: #0e3a10; }
.asm-modal .pbm-lvltag.pbm-l3 { background: #2F7A33; color: #fff; }

/* queue lesson rows (self-contained — does not reuse .pbm-lrow) */
.asm-modal .pbm-qrow { display: flex; align-items: center; gap: 9px; font-size: 13px; padding: 5px 0; color: #3f4a3e; }
.asm-modal .pbm-qrow .pbm-ltitle { flex: 1; min-width: 0; }
.asm-modal .pbm-lseq {
  flex-shrink: 0; width: 18px; height: 18px; border-radius: 50%; background: #EFF2EF;
  color: #929d92; font-size: 10.5px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
.asm-modal .pbm-qrow.pbm-removed .pbm-ltitle { text-decoration: line-through; text-decoration-color: #d6dad6; color: #929d92; }
.asm-modal .pbm-qrow.pbm-completed .pbm-ltitle { color: #929d92; }

/* ── added lessons + "add a specific lesson" ───────────────────── */
.asm-modal .pbm-addlesson {
  display: inline-flex; align-items: center; gap: 7px; margin-top: 8px;
  border: 1.5px solid #44A148; background: #EAF5EA; color: #2D6A2F;
  font: inherit; font-weight: 700; font-size: 12.5px; border-radius: 9px; padding: 8px 13px; cursor: pointer;
}
.asm-modal .pbm-addlesson:hover { background: #44A148; color: #fff; }
.asm-modal .pbm-findwrap { margin-top: 10px; }

/* ── roadmap strip ─────────────────────────────────────────────── */
.asm-modal .pbm-horizon-note { font-size: 12px; color: #5b6b5c; margin: 0 0 11px; }
.asm-modal .pbm-horizon-strip { display: flex; flex-wrap: wrap; gap: 8px; }
.asm-modal .pbm-hchip {
  display: inline-flex; align-items: center; gap: 8px; border: 1px dashed #cdd8cd;
  border-radius: 30px; padding: 8px 14px; background: #fbfcfb; font-size: 13px; font-weight: 600; color: #4a564a;
}
.asm-modal .pbm-hchip .pbm-hsw { width: 9px; height: 9px; border-radius: 3px; background: #c3cec3; }