/* CELLMIND local reference rebuild — generated from website/cellmind-rebuild/src/styles. Do not edit output. */
/* ---- designs/signature/pages/pepfame-account.css ---- */
/* ==========================================================================
   PepFame account (templates/pepfame-account.njk, brand-js/commerce/account.js; Release B2a, RELEASE-B2-PLAN.md §6).
   One centred card: sign-in by e-mail code, or the credit (available large, pending, on hold, next to expire), a
   progress bar to US$100 (available solid, pending lighter), the orders, the account actions; the explainer below.
   ========================================================================== */
.pfa { padding: clamp(28px, 5vw, 64px) var(--pf-gutter) clamp(40px, 6vw, 88px); background: var(--pf-bg); }
.pfa__inner { max-width: 640px; margin: 0 auto; display: grid; gap: 24px; }
.pfa__card { padding: clamp(22px, 4vw, 36px); background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: var(--pf-r-lg); box-shadow: var(--pf-shadow-1); display: grid; gap: 14px; }
.pfa__card[hidden], .pfa__form[hidden], .pfa__confirm[hidden], .pfa__status[hidden] { display: none; }
.pfa__title { margin: 0; font-family: var(--pf-font-display); font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem); font-weight: 500; line-height: 1.1; color: var(--pf-ink); text-wrap: balance; }
.pfa__h2 { margin: 10px 0 0; font-size: var(--pf-fs-md); font-weight: 700; color: var(--pf-ink); }
.pfa__form { display: grid; gap: 10px; }
.pfa__label { font-size: var(--pf-fs-sm); font-weight: 600; color: var(--pf-ink); }
.pfa__intro { margin: 0; color: var(--pf-ink-2); overflow-wrap: anywhere; }
.pfa__input { width: 100%; min-height: 48px; padding: 0 14px; border: 1px solid var(--pf-line-strong); border-radius: var(--pf-r-sm); background: var(--pf-surface); color: var(--pf-ink); font: inherit; }
.pfa__input:focus-visible { outline: 2px solid var(--pf-focus); outline-offset: 1px; border-color: var(--pf-ink); }
.pfa__input--code { max-width: 220px; font-family: var(--pf-font-mono); font-size: 1.4rem; letter-spacing: 0.3em; }
.pfa__btn { justify-self: start; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px; border: 1.5px solid var(--pf-gold-dark); border-radius: var(--pf-pill); background: var(--pf-gold-dark); color: rgb(var(--pf-white-rgb)); font: inherit; font-weight: 700; cursor: pointer; }
.pfa__btn:hover { background: var(--pf-ink); border-color: var(--pf-ink); }
.pfa__btn--ghost { background: transparent; border-color: var(--pf-ink); color: var(--pf-ink); font-weight: 600; }
.pfa__btn--ghost:hover { background: var(--pf-surface-2); color: var(--pf-ink); }
.pfa__btn--danger { background: var(--pf-bad); border-color: var(--pf-bad); }
.pfa__link { min-height: 44px; padding: 0; border: 0; background: none; color: var(--pf-gold-ink); font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pfa__link:disabled { color: var(--pf-ink-3); cursor: default; text-decoration: none; }
.pfa__link--danger { color: var(--pf-bad); }
.pfa__btn:focus-visible, .pfa__link:focus-visible, .pfa__legal a:focus-visible { outline: 2px solid var(--pf-focus); outline-offset: 2px; }
.pfa__row { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; }
.pfa__msg { margin: 0; min-height: 1.5em; color: var(--pf-bad); font-weight: 600; }
.pfa__terms, .pfa__legal { margin: 0; font-size: var(--pf-fs-xs); color: var(--pf-ink-3); }
.pfa__legal a { color: var(--pf-ink-2); }
.pfa__status { margin: 0; text-align: center; color: var(--pf-ink-3); }

.pfa__amounts { display: grid; gap: 10px; }
.pfa__amount-row { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--pf-line); }
.pfa__amount-row--main .pfa__amount strong { font-family: var(--pf-font-display); font-size: clamp(1.8rem, 1.4rem + 1.4vw, 2.4rem); font-weight: 500; color: var(--pf-ink); }
.pfa__amount-label { font-weight: 600; color: var(--pf-ink); }
.pfa__amount { display: grid; justify-items: end; font-variant-numeric: tabular-nums; color: var(--pf-ink); }
.pfa__amount small { color: var(--pf-ink-3); font-size: var(--pf-fs-xs); }
.pfa__note { grid-column: 1 / -1; color: var(--pf-ink-3); font-size: var(--pf-fs-xs); }
.pfa__negative { margin: 0; padding: 10px 12px; border-radius: var(--pf-r-sm); background: var(--pf-warn-bg); color: var(--pf-ink); font-size: var(--pf-fs-sm); }
.pfa__progress { display: grid; gap: 8px; }
.pfa__progress-text { margin: 0; font-size: var(--pf-fs-sm); color: var(--pf-ink-2); }
.pfa__orders { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.pfa__order { display: grid; gap: 4px; padding: 12px 14px; border: 1px solid var(--pf-line); border-radius: var(--pf-r-sm); }
.pfa__order-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; font-variant-numeric: tabular-nums; }
.pfa__order-head span { color: var(--pf-ink-3); font-size: var(--pf-fs-sm); }
.pfa__order-credit { font-size: var(--pf-fs-sm); color: var(--pf-ink-2); }
.pfa__order-credit--available, .pfa__order-credit--partly { color: var(--pf-verdigris-ink); font-weight: 600; }
.pfa__orders-empty { color: var(--pf-ink-3); }
.pfa__email { margin: 0; color: var(--pf-ink); overflow-wrap: anywhere; }
.pfa__delete { display: grid; gap: 10px; padding-top: 8px; border-top: 1px solid var(--pf-line); }
.pfa__confirm { display: grid; gap: 10px; padding: 14px; border: 1px solid var(--pf-bad); border-radius: var(--pf-r-sm); background: var(--pf-bad-bg); color: var(--pf-ink); }
.pfa__confirm p { margin: 0; }

.pfa__how { padding: clamp(18px, 3vw, 28px); border-radius: var(--pf-r-lg); background: var(--pf-surface-2); }
.pfa__how-list { margin: 10px 0 0; padding-left: 1.2em; display: grid; gap: 8px; color: var(--pf-ink-2); }

/* Release C — "Your subscriptions" on the account page */
.pfa__subs { display: grid; gap: .75rem; margin-top: 1.5rem; }
.pfa__sub { display: grid; gap: .35rem; padding: .9rem 1rem; border: 1px solid var(--line, #d9d9d9); border-radius: 12px; }
.pfa__sub-head { font-weight: 600; margin: 0; }
.pfa__sub-line { margin: 0; font-size: .925rem; }
.pfa__sub-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .25rem; }
.pfa__sub--cancelled { opacity: .75; }
