/* ==========================================================================
   PASSWORD-HASH.CSS — Shared styles for bcrypt, PBKDF2, scrypt, Argon2id
   ========================================================================== */
.mode-toggle{display:flex;gap:var(--space-2);margin-bottom:var(--space-4);flex-wrap:wrap}
.mode-toggle button{padding:8px 16px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;font-size:14px;transition:all .15s}
.mode-toggle button.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.ph-safety{background:var(--bg-secondary);border-left:4px solid var(--color-primary);padding:12px 16px;border-radius:6px;margin-bottom:var(--space-4);font-size:13px;color:var(--text-secondary)}
.ph-params{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-3);margin-bottom:var(--space-4)}
.ph-params label{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:500;color:var(--text-primary)}
.ph-params label small{font-weight:400;color:var(--text-secondary)}
.ph-params input,.ph-params select{padding:8px 12px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-primary);color:var(--text-primary);font-size:14px}
.ph-params input[readonly]{background:var(--bg-secondary);color:var(--text-secondary)}
.ph-diag{display:flex;gap:var(--space-3);flex-wrap:wrap;font-size:12px;color:var(--text-secondary);margin-bottom:var(--space-3)}
.ph-diag span{white-space:nowrap}
.ph-warn{background:#fffbeb;border:1px solid #fde68a;border-radius:6px;padding:8px 12px;font-size:13px;color:#92400e;margin-bottom:var(--space-3);display:none}
.ph-warn.visible{display:block}
.ph-err{background:#fef2f2;border:1px solid #fecaca;border-radius:6px;padding:8px 12px;font-size:13px;color:#dc2626;margin-bottom:var(--space-3);display:none}
.ph-err.visible{display:block}
.ph-ok{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:6px;padding:8px 12px;font-size:13px;color:#166534;margin-bottom:var(--space-3);display:none}
.ph-ok.visible{display:block}
.ph-inspect-grid{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;font-size:13px;margin-bottom:var(--space-3)}
.ph-inspect-label{color:var(--text-secondary);font-weight:500}
.ph-inspect-value{font-family:var(--font-mono);word-break:break-all}
.ph-val-ok{color:#166534;font-weight:700}
.ph-val-err{color:#dc2626;font-weight:700}
.ph-faq{margin-bottom:var(--space-3)}
.ph-faq summary{cursor:pointer;font-weight:600;font-size:14px;color:var(--text-primary);padding:4px 0}
.ph-faq p{margin:4px 0 0 0;font-size:13px;color:var(--text-secondary)}