/* accounts v4 (assets/acct.js): 2FA, delete account, idle warning, Turnstile slot, admin security settings.
   Colours only from the app's tokens + the two danger tokens below (light + dark, AA contrast). */
:root{--ac-danger:#B42318;--ac-danger-fg:#FFFFFF;--ac-danger-bg:color-mix(in srgb,#B42318 7%,transparent)}
:root[data-theme="dark"]{--ac-danger:#FF7A72;--ac-danger-fg:#16080A;--ac-danger-bg:color-mix(in srgb,#FF7A72 10%,transparent)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--ac-danger:#FF7A72;--ac-danger-fg:#16080A;--ac-danger-bg:color-mix(in srgb,#FF7A72 10%,transparent)}}

.dlgwrap.acwrap{z-index:94}
.dlgwrap.acwrap.acidle{z-index:96}
.acdlg{width:min(460px,100%);display:flex;flex-direction:column;gap:14px}
.acdlg .dh{margin-bottom:0}
.acdlg p{margin:0;line-height:1.55;text-wrap:pretty}
.acdlg .row2{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.acdlg .fset{gap:12px}
#acEnrD,#acDelDlgD{display:flex;flex-direction:column;gap:12px}
#acDelDlgD p,#acDelDlgD ul{margin:0}
.acmsg{margin:0;font-size:14px;line-height:1.5;border-radius:var(--r-sm);padding:8px 10px;border:1px solid var(--line2);background:var(--surface);color:var(--ink);unicode-bidi:plaintext}
.acmsg[hidden]{display:none}
.acmsg.err{border-color:color-mix(in srgb,var(--ac-danger) 55%,var(--line2));background:var(--ac-danger-bg)}
.acmsg.ok{border-color:color-mix(in srgb,var(--ok) 55%,var(--line2))}
.acmsg.warn{border-color:color-mix(in srgb,var(--warn) 65%,var(--line2))}
.acmsg.info{border-color:var(--line2)}
.acmsg a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.acotp{letter-spacing:.35em;font-family:var(--mono,ui-monospace,monospace);font-size:20px!important;text-align:center;max-width:220px}
/* the QR needs a light quiet zone to scan, in both themes */
.acqr{display:grid;place-items:center;padding:12px;border:1px solid var(--line2);border-radius:var(--r-md);background:#FFFFFF;width:max-content;max-width:100%;margin-inline:auto}
.acqr img{display:block;width:180px;height:180px;image-rendering:pixelated}
.acdlg .fld .row2 input{flex:1;min-width:0}
.acdel-list{margin:6px 0 0;padding-inline-start:20px;display:flex;flex-direction:column;gap:4px;font-size:14px}
.acalt{margin:-4px 0 0}
.acalt .lnk{font-size:13px}

/* account panel */
.acbox{display:flex;flex-direction:column;gap:10px}
.acbox .snote.on{color:var(--ink)}
.acbox .snote.on::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ok);margin-inline-end:8px;vertical-align:middle}
.acfac{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.acfac[hidden]{display:none}
.acfac li{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;border:1px solid var(--line2);border-radius:var(--r-sm);padding:8px 10px;font-size:14px}
.acout{display:flex;flex-wrap:wrap;gap:10px}
.acdanger{border:1px solid color-mix(in srgb,var(--ac-danger) 45%,var(--line2));border-radius:var(--r-md);padding:14px;display:flex;flex-direction:column;gap:8px;background:var(--ac-danger-bg)}
.acdanger h4{margin:0;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ac-danger)}
.acdanger p{margin:0}
.btn.acdanger-btn{background:var(--ac-danger);border-color:var(--ac-danger);color:var(--ac-danger-fg)}
.btn.acdanger-btn:hover:not([disabled]){background:color-mix(in srgb,var(--ac-danger) 85%,var(--ink));border-color:color-mix(in srgb,var(--ac-danger) 85%,var(--ink))}
.btn.acdanger-btn[disabled]{opacity:.6}
.acud{margin-top:22px;align-items:flex-start}
.acud[hidden]{display:none}

/* Turnstile slot: empty (and invisible) unless the check needs an interaction */
.accap{display:flex;justify-content:center;min-height:0}
.accap[hidden]{display:none}
.accap:empty{display:none}
#acCapAu{margin:4px 0 0}

/* admin */
.acban{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--warn) 65%,var(--line2));border-inline-start:4px solid var(--warn);border-radius:var(--r-sm);background:var(--surface);font-size:14px}
.acban[hidden]{display:none}
.acsec .fld input[type=number]{max-width:200px}
.acwords{display:flex;flex-direction:column;gap:12px}
.acwords[hidden],#acSec .bhead[hidden]{display:none}
.acwadd{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.acwadd input{flex:1 1 200px;min-width:0;padding:9px 11px;font-size:15px;border:1px solid var(--field-bd);border-radius:var(--r-sm);background:var(--field);color:var(--ink)}
.acwlist{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;max-height:260px;overflow:auto}
.acwlist li{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line2);border-radius:var(--r-pill);padding:2px 4px 2px 10px;font-size:13px;background:var(--surface)}
.acwx{border:0;background:none;color:var(--muted);width:26px;height:26px;border-radius:50%;font-size:16px;line-height:1;padding:0;display:grid;place-items:center}
.acwx:hover{background:var(--btn-hover);color:var(--ink)}
@media (max-width:520px){.acdlg{padding:22px 16px 18px}.acotp{max-width:100%}.acdlg .row2 .btn{flex:1 1 auto}}
