/*
 * account-appstore.css — the app-store pieces (account-appstore.js): Settings › Delete account,
 * the review-account password form on the sign-in page, and Kevin's console card.
 * Its own file: the shared portal stylesheets are owned elsewhere. Uses the portal's tokens only.
 */
.aas-card{margin-bottom:14px}
.aas-h{font-size:16px;margin:0 0 4px}
.aas-h2{margin-top:18px}
.aas-p{margin:4px 0 10px}
.aas-lead{margin:10px 0 6px;font-size:14px;color:var(--t1)}
.aas-list{margin:0 0 10px;padding-left:20px;font-size:14px;color:var(--t2)}
.aas-list li{margin:0 0 4px}
.aas-owed{margin:8px 0 6px}
.aas-label{display:block;font-size:13px;color:var(--t2);margin:12px 0 6px}
.aas-input{width:100%;max-width:320px;box-sizing:border-box;padding:10px 12px;font-size:16px;border-radius:10px;
  border:1px solid var(--line2,var(--line));background:var(--card2,var(--card));color:var(--t1);letter-spacing:.08em}
.aas-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 6px}
.btn-s.aas-danger{background:var(--red,#c43a33);border-color:var(--red,#c43a33);color:#fff}
.btn-s.aas-danger[disabled]{opacity:.45;cursor:not-allowed}
.btn-s.aas-danger-ghost{border-color:var(--red,#c43a33);color:var(--red,#c43a33)}
.aas-row{flex-wrap:wrap}
.aas-row .row-act{display:flex;gap:6px;flex-wrap:wrap}
.aas-pw{margin:-4px 0 12px;word-break:break-all}
.aas-code{font:600 15px ui-monospace,SFMono-Regular,Menlo,monospace;padding:2px 6px;border-radius:6px;background:var(--card)}
@media (max-width:759.98px){
  .aas-row .row-act{width:100%}
  .aas-actions .btn-s{flex:1 1 100%}
}

/* Sign-in page: the review-account link and form (login.html). */
.pw-toggle{all:unset;display:block;margin:16px auto 0;font-size:13px;color:var(--muted,var(--t2));text-decoration:underline;cursor:pointer;text-align:center}
.pw-toggle:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
#pw-form{margin-top:12px}
#pw-form label{display:block;font-size:13px;color:var(--muted,var(--t2));margin:10px 0 6px}
#pw-form input{width:100%;box-sizing:border-box;padding:12px 14px;font-size:16px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:inherit}
#pw-msg{margin-top:10px;font-size:14px;line-height:1.5}
#pw-msg.err{color:var(--amber,#f0b429)}
/* The "or continue with" divider is display:flex in login.html, which beats the hidden attribute:
   with no providers (always, inside the app) it drew a divider above nothing. */
.login-or[hidden]{display:none}