/* Small shared widgets: the confirm dialog (confirm-dialog.js) and the password eye (password-toggle.js).
   Plain CSS file instead of <style> tags injected by the scripts, so the strict CSP (style-src 'self') allows it. Tokens only. */

/* ---------- confirm dialog ---------- */
.nd-dlg-backdrop { position: fixed; inset: 0; z-index: 3000; display: flex; align-items: center; justify-content: center; padding: 1rem; background: rgba(var(--nd-ink-rgb), .55); opacity: 0; transition: opacity .2s ease; backdrop-filter: blur(2px); }
.nd-dlg-backdrop.show { opacity: 1; }
.nd-dlg { background: var(--nd-card); color: var(--nd-ink); width: 100%; max-width: 420px; border-radius: var(--nd-r); overflow: hidden; box-shadow: 0 24px 60px rgba(var(--nd-ink-rgb), .28); transform: translateY(14px) scale(.97); opacity: 0; transition: transform .22s var(--nd-ease), opacity .22s ease; font-family: inherit; }
.nd-dlg-backdrop.show .nd-dlg { transform: none; opacity: 1; }
.nd-dlg__body { padding: 1.6rem 1.5rem .6rem; text-align: center; }
.nd-dlg__icon { width: 60px; height: 60px; border-radius: 50%; display: grid; place-items: center; margin: 0 auto 1rem; font-size: 1.7rem; background: var(--nd-surface-alt); color: var(--nd-blue); }
.nd-dlg--danger .nd-dlg__icon { background: color-mix(in srgb, var(--nd-red) 10%, var(--nd-white)); color: var(--nd-red-600); }
.nd-dlg__title { font-size: 1.15rem; font-weight: 700; margin: 0 0 .4rem; }
.nd-dlg__msg { font-size: .95rem; color: var(--nd-ink-2); margin: 0; line-height: 1.55; }
.nd-dlg__actions { display: flex; gap: .6rem; padding: 1.2rem 1.5rem 1.5rem; }
.nd-dlg__btn { flex: 1; min-height: 44px; border: 0; border-radius: var(--nd-r-sm); padding: .7rem 1rem; font-size: .95rem; font-weight: 600; cursor: pointer; font-family: inherit; transition: filter .15s ease, background .15s ease; }
.nd-dlg__btn--cancel { background: var(--nd-surface-alt); color: var(--nd-ink-2); }
.nd-dlg__btn--cancel:hover { background: var(--nd-line); }
.nd-dlg__btn--ok { background: var(--nd-blue); color: var(--nd-white); }
.nd-dlg--danger .nd-dlg__btn--ok { background: var(--nd-red-600); }
.nd-dlg__btn--ok:hover { filter: brightness(1.07); }
@media (prefers-reduced-motion: reduce) { .nd-dlg-backdrop, .nd-dlg { transition: opacity .15s ease; } .nd-dlg { transform: none; } }

/* ---------- password eye ---------- */
.pw-field { position: relative; display: block; }
.pw-field > input { padding-right: 2.7rem !important; }
.pw-toggle { position: absolute; top: 0; right: 0; height: 100%; width: 2.7rem; border: 0; background: transparent; display: grid; place-items: center; cursor: pointer; color: var(--nd-muted); font-size: 1.05rem; padding: 0; z-index: 3; }
.pw-toggle:hover, .pw-toggle:focus-visible { color: var(--nd-blue); outline: none; }