/* ===========================================================================
   v062 - empty states and session gating on the dashboard
   ---------------------------------------------------------------------------
   Layered above v027..v061; nothing here edits an older file.

   Two ideas from the redesign (4.2 (2) and 4.2 (3)):
     * a brand-new account should see an empty slate, not a zero score;
     * a session entry that cannot produce anything yet should say so, rather
       than opening onto an empty list.
   =========================================================================== */

/* ---------- a session you cannot start yet -------------------------------- */

.quick.quickLocked {
  opacity: .6;
  cursor: not-allowed;
  /* drained, but still legible - it must read as "not yet", not "broken" */
  filter: saturate(.35);
}

/* the one entry a new visitor should pick */
.quick.quickRecommended {
  border-color: #315efb;
  box-shadow: inset 0 0 0 1px #315efb, 0 6px 18px rgba(49, 94, 251, .13);
}

/* amber, not red: nothing is wrong, something is simply not unlocked */
.quick .quickHint {
  margin: 7px 0 0;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.35;
  color: #9b6708;
}

.quick .quickHint[hidden] { display: none; }

/* ---------- the hero heading got longer (it is now a value statement) ----- */

/* The old heading was four words ("Get closer to A* today"); this one carries
   the actual proposition, so it needs a tighter lead and a cap on the measure
   or it runs the full width of a 1440px screen. */
#heroGreeting {
  font-size: clamp(21px, 2.1vw, 30px);
  line-height: 1.25;
  max-width: 30ch;
}

.hero.commercialHero > div > p {
  max-width: 62ch;
}

/* ---------- first-run prompt for the exam series -------------------------- */

/* Light and skippable, at the top of the first screen (redesign 4.2 (1)) -
   the setting itself already existed but sat in the side panel where nobody
   noticed it. */
.examSetupNudge {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin: 0 0 14px;
  padding: 12px 16px;
  border: 1px solid #c7ddff;
  border-radius: 12px;
  background: #eef4ff;
  color: #274b8f;
  font-size: 13.5px;
  line-height: 1.5;
}

/* `display:flex` above would otherwise beat the `hidden` attribute */
.examSetupNudge[hidden] { display: none; }

.examSetupNudge b { color: #1b3a75; }
.examSetupNudge .btn { flex: 0 0 auto; }
