/* bl-profile.css - "About you" (includes/account/profile.php, assets/js/bl-profile.js). The card, chips and buttons are
   onboarding's (bl-onboard.css, .ob); this adds the fields. A field that needs attention is said in the plans page's
   warm accent (gold ring and text, as .pl-need), never red, and never by colour alone (the words sit beside it). */
.pf-step{display:none}
html.pf-on .pf-step{display:block;margin:0 0 22px}
html.pf-on .ob-step{display:none}   /* "What are you studying?" comes next, once this is answered or put off */
.pf[data-pf="edit"]{background:none;box-shadow:none;padding:0;border-radius:0}
.pf-f{margin:0 0 16px;max-width:420px}
/* account.php gives every .ac label a block margin; these lay out themselves */
.ac .pf label{margin:0}
.ac .pf .pf-l{margin:0 0 8px}
.pf .pf-l{display:block;margin:0 0 8px;font:600 17px/1.3 var(--f-display);color:var(--ink)}
.pf .pf-l small{font:500 14px/1.3 var(--f-body);color:var(--ink-3);margin-inline-start:4px}
.pf .input,.pf .select{width:100%;min-height:48px;box-sizing:border-box;font-size:16px}
.pf-dobf{display:flex;flex-wrap:wrap;gap:12px}
.pf .pf-dl{display:flex;flex-direction:column;gap:6px;margin:0}
.pf .pf-dl > span{font-size:14px;font-weight:700;color:var(--ink-2);margin:0}
.pf .pf-dl .input{width:4.2em;text-align:center;font-variant-numeric:tabular-nums}
.pf .pf-dl .pf-year{width:5.6em}
.pf-note{margin:10px 0 0;color:var(--ink-3);font-size:14.5px}
.pf-need{margin:8px 0 0;color:var(--gold-ink);font-size:14.5px;font-weight:700;line-height:1.4}
.pf-need[hidden]{display:none}
.pf .input[aria-invalid="true"]{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold);background:var(--gold-tint)}
.pf .input[aria-invalid="true"]:focus{outline:2px solid var(--gold-ink);outline-offset:2px}
.pf-yg[hidden],.pf-dob[hidden],.pf-bornrow[hidden]{display:none}
.pf-born{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin:0;color:var(--ink);font-weight:600}
.pf-chg{min-height:44px;padding:0;border:0;background:none;color:var(--study-ink);font:700 15px/1 var(--f-body);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;cursor:pointer}
.pf-chg:focus-visible{outline:3px solid var(--study-ink);outline-offset:2px}
.pf .ob-done[aria-busy="true"]{cursor:progress}
/* under 13 at sign-up: the account was not kept; only the message and the way to the tools remain on the page */
html.pf-closed .pf-step{display:block;margin:0 0 22px}
html.pf-closed .acd-nav,html.pf-closed .acd-main > :not(.pf-step){display:none}
.pf-u13{margin:0;font-size:17px;line-height:1.5;color:var(--ink);max-width:60ch;outline:none}
.pf-u13-go{margin:18px 0 0}
@media (max-width:600px){.pf-f{max-width:none}}