/* partner-form.css (v98): the partner program's forms (assets/js/partner-form.js):
   the application, the profile form (in Profile > Partner, or the team's
   preview of it), changing details, the payout window. Loaded by partner.html
   and account.html, after verapep-ds.css. Tokens only, so both themes come
   from the tokens (Doc 7: no html.vp-dark overrides in components). Gradient:
   the 3px top line of a window and its one primary button, nothing else.
   Also the tier colours both pages use (one place). */

/* the tier metals: dots and bars (--vp-tier-*), and the same hue as readable
   text on the card (--pp-tier-ink-*, 5:1 or better in both themes);
   --pp-info is the info blue (7.5:1 light, 8.1:1 dark) */
:root{
  --vp-tier-bronze:#8A5524; --vp-tier-silver:#A8A8A0; --vp-tier-gold:#C8902A; --vp-tier-platinum:#0C8CCE; --vp-tier-diamond:#6241C2;
  --pp-info:#2E4FA8;
  --pp-tier-ink-bronze:#8A5524; --pp-tier-ink-silver:#6E6E68; --pp-tier-ink-gold:#8A6514; --pp-tier-ink-platinum:#0A72A8; --pp-tier-ink-diamond:#6241C2;
}
html.vp-dark{
  --vp-tier-bronze:#B5763C; --vp-tier-silver:#C3C3BA; --vp-tier-gold:#E0A93C; --vp-tier-platinum:#5EC9E6; --vp-tier-diamond:#9B7BD4;
  --pp-info:#93B0F5;
  --pp-tier-ink-bronze:#B5763C; --pp-tier-ink-silver:#C3C3BA; --pp-tier-ink-gold:#E0A93C; --pp-tier-ink-platinum:#5EC9E6; --pp-tier-ink-diamond:#9B7BD4;
}

/* ── the window ─────────────────────────────────────────────────────────── */
.pf-ov{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(12,12,12,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);font-family:var(--font);}
.pf-ov [hidden],.pf-body [hidden],.pd-gate-need [hidden]{display:none!important;}
.pf-card{position:relative;width:100%;max-width:560px;max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);display:flex;flex-direction:column;
  background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--r-lg);box-shadow:var(--sh-lg);overflow:hidden;
  animation:pfIn .3s var(--ease-out);}
.pf-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;z-index:2;background:var(--grad-wave);background-size:200% 100%;
  background-position:calc(var(--vp-pan,0) * 1%) 50%;}
.pf-card-s{max-width:440px;}
.pf-scroll{position:relative;padding:28px 28px 24px;overflow-y:auto;overscroll-behavior:contain;}
.pf-scroll:focus{outline:none;}
@keyframes pfIn{from{opacity:0;transform:translate3d(0,10px,0);}to{opacity:1;transform:none;}}
.pf-x{position:absolute;top:14px;right:14px;z-index:3;width:34px;height:34px;padding:0;border-radius:50%;border:1px solid var(--c-line);
  background:var(--c-card);color:var(--c-ink);display:grid;place-items:center;cursor:pointer;transition:border-color var(--t) var(--ease);}
.pf-x:hover{border-color:var(--c-ink);}
.pf-x:focus-visible{outline:none;box-shadow:0 0 0 3px var(--c-focus);}
.pf-x svg{width:14px;height:14px;}

/* ── words ──────────────────────────────────────────────────────────────── */
.pf-h{margin:0 0 6px;padding-right:44px;font-size:1.3rem;font-weight:800;letter-spacing:-.025em;line-height:1.2;color:var(--c-ink);}
.pf-p{margin:0 0 18px;font-size:.88rem;line-height:1.55;color:var(--c-ink-2);}
.pf-eb{margin:0 0 8px;font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--c-warn);}
.pf-sec-h.pf-first{margin:0 0 16px;font-size:1.02rem;font-weight:800;letter-spacing:-.015em;text-transform:none;color:var(--c-ink);}

/* ── fields ─────────────────────────────────────────────────────────────── */
.pf-f{margin:0 0 14px;}
.pf-l{display:block;margin:0 0 6px;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--c-ink-2);}
.pf-in,.pf-sel{display:block;width:100%;min-height:44px;margin:0;padding:10px 13px;border:1.5px solid var(--c-line-2);border-radius:var(--r-sm);
  background:var(--c-card);color:var(--c-ink);font:500 .92rem/1.3 var(--font);box-sizing:border-box;
  transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease);}
.pf-in::placeholder{color:var(--c-ink-3);opacity:1;}
.pf-in:hover,.pf-sel:hover{border-color:var(--c-ink-3);}
.pf-in:focus,.pf-sel:focus{outline:none;border-color:var(--c-ink);box-shadow:0 0 0 3px var(--c-focus);}
.pf-in[readonly]{background:var(--c-panel);color:var(--c-ink-2);cursor:default;}
.pf-in[readonly]:focus{box-shadow:none;border-color:var(--c-line-2);}
.pf-sel{cursor:pointer;}
.pf-note{margin:6px 0 0;font-size:.74rem;line-height:1.45;color:var(--c-ink-3);}
.pf-note.ok{color:var(--c-ok);font-weight:700;}
.pf-note.bad{color:var(--c-bad);font-weight:700;}
.pf-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px;}
.pf-code{font-family:'Courier New',monospace;font-weight:700;letter-spacing:.06em;text-transform:uppercase;}
.pf-code::placeholder{text-transform:none;letter-spacing:0;font-family:var(--font);font-weight:500;}

/* where you post: platform + @handle, up to 3 rows */
.pf-hd{display:flex;gap:8px;align-items:center;margin:0 0 8px;}
.pf-hd .pf-sel{flex:0 0 36%;min-width:0;padding-right:6px;}
.pf-at{position:relative;flex:1 1 auto;min-width:0;}
.pf-at>span{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--c-ink-3);font-size:.95rem;pointer-events:none;}
.pf-at .pf-in{padding-left:28px;}
.pf-rm{flex:0 0 auto;width:34px;height:34px;padding:0;border-radius:50%;border:1px solid var(--c-line-2);background:var(--c-card);color:var(--c-ink-2);
  display:grid;place-items:center;cursor:pointer;transition:border-color var(--t) var(--ease),color var(--t) var(--ease);}
.pf-rm:hover{border-color:var(--c-bad);color:var(--c-bad);}
.pf-rm:focus-visible,.pf-add:focus-visible,.pf-tog:focus-visible,.pf-link:focus-visible{outline:none;box-shadow:0 0 0 3px var(--c-focus);border-radius:var(--r-xs);}
.pf-rm:focus-visible{border-radius:50%;}
.pf-rm svg{width:13px;height:13px;}
.pf-add{display:inline-flex;align-items:center;margin:2px 0 0;padding:8px 14px;border-radius:var(--r-sm);border:1.5px dashed var(--c-line-2);
  background:transparent;color:var(--c-ink);font:700 .8rem var(--font);cursor:pointer;transition:border-color var(--t) var(--ease);}
.pf-add:hover{border-color:var(--c-ink);}

/* ── the terms ──────────────────────────────────────────────────────────── */
.pf-sec{margin:18px 0 0;padding:18px 0 0;border-top:1px solid var(--c-line);}
.pf-sec-h{margin:0 0 4px;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--c-ink);}
.pf-sec-p{margin:0 0 14px;font-size:.82rem;line-height:1.5;color:var(--c-ink-2);}
.pf-en{margin-top:-8px;font-style:italic;}
.pf-att{margin:0 0 10px;padding:12px 14px;border:1px solid var(--c-line);border-radius:var(--r-md);background:var(--c-panel);}
.pf-chk{display:flex;gap:10px;align-items:flex-start;cursor:pointer;}
.pf-chk input{flex:0 0 auto;width:18px;height:18px;margin:2px 0 0;accent-color:var(--c-solid);cursor:pointer;}
.pf-chk input:focus-visible{outline:2px solid var(--c-ink);outline-offset:2px;}
.pf-att-t{display:block;font-size:.9rem;font-weight:700;line-height:1.35;color:var(--c-ink);}
.pf-att-s{display:block;margin-top:2px;font-size:.82rem;line-height:1.5;color:var(--c-ink-2);}
.pf-tog{margin:0;padding:6px 0 0 28px;border:0;background:none;color:var(--pp-info);font:700 .78rem var(--font);cursor:pointer;
  text-decoration:underline;text-underline-offset:3px;}
.pf-att-f{padding:8px 0 2px 28px;font-size:.8rem;line-height:1.6;color:var(--c-ink);}
.pf-final{margin:6px 0 0;padding:14px;border-radius:var(--r-md);border:1.5px solid var(--c-line-2);background:var(--c-card);}
.pf-final-t{font-size:.9rem;font-weight:700;line-height:1.4;color:var(--c-ink);}
.pf-final-b{margin:10px 0 0 28px;}
.pf-link{color:var(--pp-info);font-size:.8rem;font-weight:700;text-decoration:underline;text-underline-offset:3px;}
.pf-tt{max-height:170px;overflow-y:auto;margin:8px 0 0;padding:12px 14px;border:1px solid var(--c-line);border-radius:var(--r-sm);background:var(--c-panel);}
.pf-tt:focus-visible{outline:none;box-shadow:0 0 0 3px var(--c-focus);}
.pf-tt p{margin:0;}
.pf-tt-h{font-size:.9rem;font-weight:800;color:var(--c-ink);}
.pf-tt .pf-tt-v{margin:2px 0 8px;font-size:.74rem;font-weight:600;color:var(--c-ink-3);}
.pf-tt-sec{margin:10px 0 0;}
.pf-tt-s{font-size:.8rem;font-weight:700;color:var(--c-ink);}
.pf-tt .pf-tt-b{margin-top:3px;font-size:.78rem;line-height:1.6;color:var(--c-ink-2);}
.pf-esign{margin:14px 0 0;padding:14px;border-radius:var(--r-md);border:1.5px solid var(--c-line-2);background:var(--c-panel);}
.pf-esign .pf-sec-p{margin-bottom:10px;}
.pf-sign{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:1.05rem;}
.pf-signed{margin:0 0 4px;padding:11px 14px;border-radius:var(--r-md);font-size:.84rem;font-weight:600;line-height:1.45;color:var(--c-ink);
  background:color-mix(in srgb,var(--c-ok) 10%,var(--c-card));border:1px solid color-mix(in srgb,var(--c-ok) 34%,transparent);}

/* ── the end of the form ───────────────────────────────────────────────── */
.pf-helper{margin:16px 0 8px;text-align:center;font-size:.8rem;font-weight:600;color:var(--c-warn);}
.pf-submit{width:100%;justify-content:center;margin:8px 0 0;}
.pf-helper:not([hidden])+.pf-submit{margin-top:0;}
.pf-submit:disabled{opacity:.5;cursor:not-allowed;transform:none!important;}
.pf-submit[aria-busy="true"]{cursor:progress;}
.pf-msg{min-height:1.2em;margin:10px 0 0;text-align:center;font-size:.84rem;font-weight:600;color:var(--c-ink-2);}
.pf-msg:empty{min-height:0;margin:0;}
.pf-msg.ok{color:var(--c-ok);} .pf-msg.bad{color:var(--c-bad);}
.pf-acts{display:flex;justify-content:flex-end;gap:10px;margin:8px 0 0;}
.pf-acts .btn{min-width:110px;}

/* ── "Still needed" (beside the form in the profile, or at its top) ─────── */
.pf-need{margin:0 0 12px;padding:12px 14px;border-radius:var(--r-md);border:1px solid var(--c-line);background:var(--c-panel);}
.pf-need-h{margin:0 0 8px;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--c-ink);}
.pf-list{list-style:none;margin:0;padding:0;display:grid;gap:8px;}
.pf-list li{position:relative;padding-left:27px;font-size:.84rem;line-height:1.45;color:var(--c-ink);transition:color var(--t) var(--ease);}
.pf-list li::before{content:"";position:absolute;left:0;top:1px;width:17px;height:17px;border-radius:50%;border:1.5px solid var(--c-ink-3);box-sizing:border-box;
  transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease);}
.pf-list li::after{content:"";position:absolute;left:6px;top:4.5px;width:4px;height:8px;border:solid var(--c-card);border-width:0 2px 2px 0;
  transform:rotate(45deg) scale(0);transition:transform var(--t) var(--spring);}
.pf-list li.done{color:var(--c-ink-3);text-decoration:line-through;text-decoration-color:var(--c-ink-3);}
.pf-list li.done::before{border-color:var(--c-ok);background:var(--c-ok);}
.pf-list li.done::after{transform:rotate(45deg) scale(1);}
.pf-keep{margin:0 0 14px;font-size:.82rem;line-height:1.55;color:var(--c-ink-2);}
.pf-keep b{font-family:'Courier New',monospace;letter-spacing:.06em;color:var(--c-ink);}
.pf-keep strong{color:var(--c-ink);}
.pf-help{margin:14px 0 0;text-align:center;font-size:.78rem;color:var(--c-ink-3);}
.pf-help a,.pf-keep a{color:var(--c-ink);font-weight:700;text-decoration:underline;text-underline-offset:3px;}

@media (max-width:600px){
  .pf-ov{padding:10px;}
  .pf-scroll{padding:22px 18px 20px;}
  .pf-hd .pf-sel{flex-basis:40%;}
  .pf-final-b{margin-left:0;}
  .pf-tog,.pf-att-f{padding-left:0;}
}
@media (prefers-reduced-motion:reduce){
  .pf-card{animation:none;}
  .pf-list li,.pf-list li::before,.pf-list li::after{transition:none;}
}
