/* ============================================================
   Parent signup card — Option C "Argos-pure".
   Approved mock: docs/saved threads/MOCK/parent-signup-location-c.html
   ONE accent = near-black. Chips tight (8px) + uniform. Pure-CSS modal.
   Namespaced .ps- / --ps- so nothing leaks into the global k- system.
   Font is inherited from public.css body (self-hosted Atkinson Hyperlegible
   Next) — no font import here (public CSP is style-src/font-src 'self').
   ============================================================ */
.ps-scope{
  --ps-panel:#ffffff;
  --ps-divider:#e4e0da;
  --ps-outline:#d8d4cc;
  --ps-hover:#f5f3ef;
  --ps-text:#1a1a1a;     /* near-black — the single accent */
  --ps-muted:#666666;
  --ps-placeholder:#999999;
  --ps-focus:#1a1a1a;
  --ps-r-input:8px;
  --ps-r-card:16px;
  --ps-chip-r:8px;       /* tight soft-rect, NOT full-pill (radii.md R2 canon as of s317+45) */
}

/* page canvas around the card */
.ps-stage{display:flex;justify-content:center;padding:40px 16px 60px;}

/* ---------- card ---------- */
.ps-card{background:var(--ps-panel);border-radius:var(--ps-r-card);border:1px solid var(--ps-outline);padding:32px 28px;width:100%;max-width:456px;box-shadow:0 1px 3px rgba(26,26,26,.04),0 10px 28px rgba(26,26,26,.05);}
.ps-card h1{font-size:22px;font-weight:700;letter-spacing:-.01em;margin-bottom:14px;color:var(--ps-text);}

/* benefits — plain bullets, no coloured box */
.ps-benefits{list-style:none;margin:0 0 22px;padding:0;}
.ps-benefit{display:flex;align-items:flex-start;gap:8px;font-size:13.5px;color:var(--ps-text);line-height:1.5;margin-bottom:8px;}
.ps-benefit:last-child{margin-bottom:0;}
.ps-benefit svg{width:15px;height:15px;flex-shrink:0;margin-top:2px;color:var(--ps-text);}

/* fields */
.ps-lbl{font-size:13px;font-weight:600;color:var(--ps-text);display:block;margin-bottom:5px;}
.ps-req{font-weight:700;}
.ps-opt{font-size:11px;font-weight:400;color:var(--ps-placeholder);}
.ps-hint{font-size:12px;color:var(--ps-placeholder);margin-top:4px;}
.ps-field{margin-bottom:13px;}
.ps-card input[type=email],.ps-card input[type=text]{width:100%;font-family:inherit;font-size:14px;color:var(--ps-text);padding:11px 12px;border:1px solid var(--ps-outline);border-radius:var(--ps-r-input);background:var(--ps-panel);min-height:44px;}
.ps-card input::placeholder{color:var(--ps-placeholder);}
.ps-card input:focus{outline:2px solid var(--ps-focus);outline-offset:1px;border-color:var(--ps-text);}

/* ---------- location: chip grid + Others modal ---------- */
.ps-loc{margin-bottom:20px;}
.ps-chips{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;}
.ps-chip-in{position:absolute;width:1px;height:1px;opacity:0;margin:0;}
.ps-chip{display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--ps-outline);border-radius:var(--ps-chip-r);font-size:13px;white-space:nowrap;color:var(--ps-text);background:var(--ps-panel);cursor:pointer;transition:background .12s,border-color .12s,color .12s;}
.ps-chip:hover{background:var(--ps-hover);}
.ps-chip-in:checked + .ps-chip{background:var(--ps-text);border-color:var(--ps-text);color:#fff;font-weight:600;}
.ps-chip-in:focus-visible + .ps-chip{outline:2px solid var(--ps-focus);outline-offset:2px;}

/* "Others" trigger — text link by default; morphs to a selected pill via :has() */
.ps-others{display:inline-flex;align-items:center;justify-content:center;gap:5px;width:100%;min-height:40px;padding:8px 12px;font-size:13px;font-weight:600;color:var(--ps-text);cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
.ps-others .ps-chev{width:13px;height:13px;}
.ps-others .ps-tick{display:none;width:14px;height:14px;}
.ps-others .ps-chosen{display:none;}
.ps-loc:has(.ps-modal .ps-chip-in:checked) .ps-others{text-decoration:none;padding:8px 12px;border-radius:var(--ps-chip-r);background:var(--ps-text);border:1px solid var(--ps-text);color:#fff;font-weight:600;}
.ps-loc:has(.ps-modal .ps-chip-in:checked) .ps-others .ps-chev{display:none;}
.ps-loc:has(.ps-modal .ps-chip-in:checked) .ps-others .ps-tick{display:inline;}
.ps-loc:has(.ps-modal .ps-chip-in:checked) .ps-others .ps-default{display:none;}
.ps-loc:has(.ps-modal .ps-chip-in:checked) .ps-others .ps-chosen{display:inline;}
/* echo the chosen state name onto the trigger (11 deterministic rules) */
.ps-loc:has(#ps-m-perak:checked) .ps-chosen::after{content:"Perak";}
.ps-loc:has(#ps-m-perlis:checked) .ps-chosen::after{content:"Perlis";}
.ps-loc:has(#ps-m-kedah:checked) .ps-chosen::after{content:"Kedah";}
.ps-loc:has(#ps-m-kelantan:checked) .ps-chosen::after{content:"Kelantan";}
.ps-loc:has(#ps-m-terengganu:checked) .ps-chosen::after{content:"Terengganu";}
.ps-loc:has(#ps-m-pahang:checked) .ps-chosen::after{content:"Pahang";}
.ps-loc:has(#ps-m-ns:checked) .ps-chosen::after{content:"Negeri Sembilan";}
.ps-loc:has(#ps-m-melaka:checked) .ps-chosen::after{content:"Melaka";}
.ps-loc:has(#ps-m-sabah:checked) .ps-chosen::after{content:"Sabah";}
.ps-loc:has(#ps-m-sarawak:checked) .ps-chosen::after{content:"Sarawak";}
.ps-loc:has(#ps-m-labuan:checked) .ps-chosen::after{content:"Labuan";}

/* modal (pure-CSS: checkbox toggle drives display) */
.ps-modal-toggle{position:absolute;width:1px;height:1px;opacity:0;margin:0;}
.ps-modal-overlay{display:none;position:fixed;inset:0;z-index:1000;padding:20px;align-items:center;justify-content:center;}
.ps-modal-toggle:checked ~ .ps-modal-overlay{display:flex;}
.ps-modal-backdrop{position:absolute;inset:0;background:rgba(26,26,26,.45);cursor:pointer;}
.ps-modal{position:relative;z-index:1;width:100%;max-width:min(700px,calc(100vw - 40px));max-height:calc(100vh - 40px);overflow-y:auto;background:var(--ps-panel);border-radius:var(--ps-r-card);box-shadow:0 20px 60px rgba(26,26,26,.28);padding:22px 22px 20px;opacity:0;transform:translateY(10px) scale(.98);transition:opacity .15s ease,transform .15s ease;}
.ps-modal-toggle:checked ~ .ps-modal-overlay .ps-modal{opacity:1;transform:none;}
.ps-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:4px;}
.ps-modal-head h2{font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--ps-text);}
.ps-modal-sub{font-size:12.5px;color:var(--ps-muted);margin-top:2px;}
.ps-modal-close{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:999px;border:1px solid var(--ps-outline);background:var(--ps-panel);color:var(--ps-text);cursor:pointer;flex-shrink:0;}
.ps-modal-close:hover{background:var(--ps-hover);}
.ps-modal-close svg{width:16px;height:16px;}
.ps-modal-cols{display:grid;grid-template-columns:2.4fr 1fr;gap:18px 22px;margin:16px 0 18px;}
.ps-modal-col h3{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ps-placeholder);margin-bottom:10px;}
.ps-colgrid{display:grid;gap:8px;}
.ps-colgrid.ps-3{grid-template-columns:repeat(3,1fr);}
.ps-colgrid.ps-1{grid-template-columns:1fr;}
.ps-modal-foot{display:flex;align-items:center;justify-content:flex-end;gap:10px;border-top:1px solid var(--ps-divider);padding-top:14px;}
.ps-modal-done{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 22px;border:none;border-radius:12px;background:var(--ps-text);color:#fff;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.ps-modal-done:hover{background:#000;}

/* ---------- consent + CTAs ---------- */
.ps-cbwrap{margin-bottom:20px;}
.ps-cbrow{display:flex;gap:10px;align-items:flex-start;cursor:pointer;min-height:44px;padding:4px 0;}
.ps-cbnative{position:absolute;width:1px;height:1px;opacity:0;margin:0;}
.ps-cbbox{width:20px;height:20px;border-radius:5px;border:1.5px solid var(--ps-outline);background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;transition:all .15s;}
.ps-cbbox svg{width:12px;height:12px;color:#fff;display:none;}
.ps-cbnative:checked + .ps-cbbox{background:var(--ps-text);border-color:var(--ps-text);}
.ps-cbnative:checked + .ps-cbbox svg{display:block;}
.ps-cbnative:focus-visible + .ps-cbbox{outline:2px solid var(--ps-focus);outline-offset:2px;}
.ps-cbtext{font-size:13px;color:var(--ps-muted);line-height:1.6;}
.ps-privlink{color:var(--ps-text);font-weight:600;text-decoration:underline;text-underline-offset:2px;}

.ps-cta{width:100%;border:none;border-radius:12px;padding:15px;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px;font-family:inherit;min-height:52px;transition:background .15s,border-color .15s,color .15s;}
.ps-cta svg{width:16px;height:16px;}
.ps-cta--primary{background:var(--ps-text);color:#fff;}
.ps-cta--primary:hover{background:#000;}
.ps-cta--secondary{background:var(--ps-panel);color:var(--ps-text);border:1.5px solid var(--ps-text);margin-top:11px;font-weight:600;}
.ps-cta--secondary:hover{background:var(--ps-text);color:#fff;}
.ps-cta:focus-visible{outline:2px solid var(--ps-focus);outline-offset:2px;}
.ps-trust{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:14px;}
.ps-trust svg{width:13px;height:13px;color:var(--ps-placeholder);}
.ps-trust p{font-size:12px;color:var(--ps-placeholder);}

/* ---------- form plumbing: honeypot, errors, notices ---------- */
/* Honeypot — off-screen, never shown to people; bots fill it → silent drop. */
.ps-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;}
.ps-sub{font-size:13.5px;color:var(--ps-muted);line-height:1.5;margin:-4px 0 18px;}
.ps-err{font-size:12px;color:#b42318;margin-top:5px;font-weight:600;}
.ps-card input[aria-invalid=true]{border-color:#b42318;}
.ps-notice{font-size:13px;color:var(--ps-text);background:var(--ps-hover);border:1px solid var(--ps-outline);border-radius:var(--ps-r-input);padding:10px 12px;margin-bottom:16px;line-height:1.5;}
.ps-notice--err{background:#fdf2f1;border-color:#f3c9c4;color:#7a1d14;}

/* ---------- confirmation card (check-email / signed-in) ---------- */
.ps-confirm{text-align:center;}
.ps-confirm-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:999px;background:var(--ps-hover);border:1px solid var(--ps-outline);margin:6px auto 16px;}
.ps-confirm-icon svg{width:26px;height:26px;color:var(--ps-text);}
.ps-confirm h1{margin-bottom:10px;}
.ps-confirm-body{font-size:14px;color:var(--ps-muted);line-height:1.6;margin-bottom:22px;}
.ps-confirm .ps-cta--secondary{margin-top:0;}
.ps-confirm form{margin-top:11px;}

@media(max-width:520px){
  .ps-modal-cols{grid-template-columns:1fr;}
  .ps-colgrid.ps-3{grid-template-columns:repeat(2,1fr);}
}