@extends('layouts.app')
@section('title', 'Passwort-Check – Stärke analysieren & verbessern | kotsch.tech')
@section('meta_description', 'Passwort-Stärke live prüfen: Entropie, Crack-Zeiten, Pattern-Erkennung (Wörterbuch, Tastaturmuster, Sequenzen). Lokal im Browser, keine Übertragung.')
@section('meta_extra')
<meta name="keywords" content="Passwort Stärke prüfen, Passwort Check, Passwort Sicherheit, Passwort Analyse, Entropie, Passwort testen">
@endsection
@section('content')
@include('tools._tool_base')
<style>
.pw-input-wrap { display:flex; gap:8px; }
.pw-input-wrap input { flex:1; }
.entropy-ring { width:100px; height:100px; border-radius:50%; display:grid; place-items:center; flex-shrink:0; }
.entropy-inner { width:76px; height:76px; border-radius:50%; background:var(--card); display:grid; place-items:center; border:1px solid var(--line); text-align:center; }
.finding-item { display:flex; gap:10px; align-items:flex-start; padding:10px; background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-sm); margin-bottom:8px; }
.finding-icon { width:24px; height:24px; border-radius:50%; background:#fee2e2; color:#dc2626; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:0.75rem; flex-shrink:0; }
.pattern-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.pattern-chip { padding:4px 10px; border-radius:999px; background:var(--bg); border:1px solid var(--line); font-size:0.75rem; font-weight:700; color:var(--muted); }
</style>

<div class="tool-page">
<div class="tool-container">
    <div class="tool-header">
        <span class="t-tag"><i class="fas fa-shield-alt"></i> Sicherheit</span>
        <h1 class="tool-h1">Passwort<span>check.</span></h1>
        <p class="tool-sub">Lokale Analyse: Entropie, Crack-Zeiten, Pattern-Erkennung. Dein Passwort verlässt nie den Browser.</p>
    </div>

    <div class="t-panel">
        <div style="background:var(--accent-soft);border:1px solid rgba(16,185,129,0.2);border-radius:var(--radius-sm);padding:10px 14px;font-size:0.82rem;font-weight:700;color:#065f46;margin-bottom:14px">
            <i class="fas fa-lock"></i> Privat: Alles läuft nur in deinem Browser. Keine Übertragung, keine Speicherung.
        </div>
        <div class="pw-input-wrap">
            <input type="password" class="t-input" id="pw" autocomplete="off" spellcheck="false" placeholder="Passwort eingeben…" oninput="analyze()">
            <button class="t-btn ghost" id="toggle-vis" onclick="toggleVis()"><i class="fas fa-eye"></i></button>
        </div>

        <div style="display:flex;gap:16px;align-items:center;margin-top:16px;flex-wrap:wrap">
            <div style="flex:1;min-width:200px">
                <div style="display:flex;justify-content:space-between;margin-bottom:6px">
                    <strong id="rating" style="font-size:1.1rem">–</strong>
                    <span style="color:var(--muted);font-weight:700" id="score-lbl">0 / 100</span>
                </div>
                <div class="t-strength-bar"><div class="t-strength-fill" id="strength-fill"></div></div>
                <p style="color:var(--muted);font-size:0.82rem;margin-top:8px" id="summary"></p>
            </div>
            <div class="entropy-ring" id="entropy-ring" style="background:conic-gradient(#e2e8f0 0deg,#e2e8f0 360deg)">
                <div class="entropy-inner">
                    <strong id="entropy-bits" style="font-size:1.4rem;line-height:1">0</strong>
                    <span style="font-size:0.65rem;color:var(--muted);font-weight:900;text-transform:uppercase">Bit</span>
                </div>
            </div>
        </div>
    </div>

    <div class="t-grid-4">
        <div class="t-stat-card"><div class="t-stat-num" id="m-len">0</div><div class="t-stat-lbl">Zeichen</div></div>
        <div class="t-stat-card"><div class="t-stat-num" id="m-charset">0</div><div class="t-stat-lbl">Zeichensatz</div></div>
        <div class="t-stat-card"><div class="t-stat-num" id="m-guesses">0</div><div class="t-stat-lbl">Versuche</div></div>
        <div class="t-stat-card"><div class="t-stat-num" id="m-mode" style="font-size:0.85rem;letter-spacing:0">–</div><div class="t-stat-lbl">Angriffstyp</div></div>
    </div>

    <div class="t-panel">
        <div class="t-panel-title"><i class="fas fa-hourglass"></i> Crack-Zeiten</div>
        <div class="t-row"><span class="t-row-lbl">Online (100/Stunde)</span><span class="t-row-val" id="t-slow">–</span></div>
        <div class="t-row"><span class="t-row-lbl">Online (100/Sekunde)</span><span class="t-row-val" id="t-fast">–</span></div>
        <div class="t-row"><span class="t-row-lbl">CPU-Hashcrack (100M/s)</span><span class="t-row-val" id="t-cpu">–</span></div>
        <div class="t-row"><span class="t-row-lbl">GPU-Cluster (1B/s)</span><span class="t-row-val" id="t-gpu">–</span></div>
    </div>

    <div class="t-grid-2">
        <div class="t-panel">
            <div class="t-panel-title"><i class="fas fa-exclamation-triangle"></i> Befunde</div>
            <div id="findings"><p style="color:var(--muted);font-size:0.85rem">Passwort eingeben…</p></div>
            <div class="pattern-chips" id="patterns"></div>
        </div>
        <div class="t-panel">
            <div class="t-panel-title"><i class="fas fa-magic"></i> Passphrase Generator</div>
            <p class="t-info" style="margin-bottom:12px">4 zufällige Wörter – merkbar und sicher.</p>
            <div style="background:var(--accent-soft);border:1px solid rgba(16,185,129,0.2);border-radius:var(--radius-sm);padding:12px;font-weight:900;word-break:break-all;min-height:48px" id="generated">–</div>
            <div style="display:flex;gap:8px;margin-top:10px">
                <button class="t-btn sm ghost" onclick="genPassphrase()"><i class="fas fa-sync"></i> Neu</button>
                <button class="t-btn sm ghost" onclick="useGenerated()"><i class="fas fa-arrow-up"></i> Einsetzen</button>
            </div>
        </div>
    </div>
</div>
@include('tools._ads_banner')
</div>

<script>
const COMMON=['123456','123456789','password','passwort','qwerty','qwertz','admin','letmein','welcome','iloveyou','monkey','dragon','master','sunshine','abc123','111111','000000','password1','hallo123'];
const WORDS_DB=['sommer','winter','liebe','schatz','computer','internet','berlin','hamburg','hallo','test','login','secret','security','apple','windows','android','firma','schule','sachsen','technik'];
const KBD_ROWS=['qwertzuiop','asdfghjkl','yxcvbnm','qwertyuiop','1234567890'];
const LEET={'0':'o','1':'i','3':'e','4':'a','5':'s','7':'t','@':'a','$':'s','!':'i'};
const WORDS=['anker','wolke','matrix','kaffee','silber','orbit','fokus','pixel','garten','kompass','nord','signal','atlas','fluss','zukunft','kabel','tiger','nacht','stern','welle'];

const rates={slow:100/3600,fast:100,cpu:1e8,gpu:1e12};

function normLeet(s){return s.toLowerCase().split('').map(c=>LEET[c]||c).join('');}
function charsetSize(s){let n=0;if(/[a-z]/.test(s))n+=26;if(/[A-Z]/.test(s))n+=26;if(/[0-9]/.test(s))n+=10;if(/[^a-zA-Z0-9]/.test(s))n+=33;return n;}
function hasKbd(s){const l=s.toLowerCase();return KBD_ROWS.some(r=>{for(let i=0;i<=r.length-4;i++)if(l.includes(r.slice(i,i+4)))return true;return false;});}
function hasSeq(s){let run=1;for(let i=1;i<s.length;i++){if(Math.abs(s.charCodeAt(i)-s.charCodeAt(i-1))===1)run++;else run=1;if(run>=4)return true;}return false;}
function fmtNum(n){if(!isFinite(n)||n<=0)return'0';if(n<1e6)return Math.round(n).toLocaleString('de-DE');return n.toExponential(1).replace('e+','×10^');}
function fmtDur(s){if(!isFinite(s)||s<=0)return'sofort';if(s<1)return'< 1 Sek.';const u=[['Jahr',31557600],['Tag',86400],['Stunde',3600],['Minute',60],['Sekunde',1]];for(const[unit,size]of u)if(s>=size){const a=s/size;return(a>=100?Math.round(a):a.toFixed(1)).toString().replace('.',',')+' '+unit+(a>=2&&unit!=='Sekunde'?'e':'');}return'sofort';}

function analyze(){
    const pw=document.getElementById('pw').value;
    const len=pw.length,cs=charsetSize(pw),lower=pw.toLowerCase(),leet=normLeet(pw);
    const findings=[],patterns=[];
    let penalty=0;
    let entropy=cs>0?Math.log2(Math.pow(cs,len)):0;

    if(!pw){reset();return;}
    if(len<8){penalty+=32;findings.push({t:'Sehr kurz',d:'Unter 8 Zeichen – sehr leicht zu knacken.'});}
    else if(len<12){penalty+=18;findings.push({t:'Kurz',d:'12–16 Zeichen sind deutlich besser.'});}
    else if(len>=16)patterns.push('gute Länge');

    if(COMMON.some(w=>lower.includes(w)||leet.includes(w))){penalty+=45;patterns.push('Blocklist!');findings.push({t:'Bekanntes Muster',d:'Enthält ein sehr häufiges Passwort.'});}
    const hits=WORDS_DB.filter(w=>lower.includes(w)||leet.includes(w));
    if(hits.length){penalty+=Math.min(24,hits.length*10);patterns.push('Wörterbuch');findings.push({t:'Wörterbuch-Wörter',d:'Angreifer testen häufige Wörter zuerst.'});}
    if(/(.)\1{2,}/.test(pw)){penalty+=18;patterns.push('Wiederholung');findings.push({t:'Wiederholungen',d:'Zeichenfolgen wie aaa reduzieren den Suchraum.'});}
    if(hasSeq(pw)){penalty+=18;patterns.push('Sequenz');findings.push({t:'Sequenz',d:'Abfolgen wie abcd oder 7890 – klassische Crack-Regel.'});}
    if(hasKbd(pw)){penalty+=22;patterns.push('Tastaturmuster');findings.push({t:'Tastaturmuster',d:'QWERTZ/QWERTY-Läufe gezielt getestet.'});}
    if(/(19|20)\d{2}/.test(pw)){penalty+=16;patterns.push('Jahr');findings.push({t:'Jahreszahl',d:'Jahre und Geburtstage sind leicht zu erraten.'});}

    const adj=Math.max(0,entropy-penalty);
    const guesses=Math.max(1,Math.pow(2,adj));
    const score=Math.min(100,Math.round((adj/90)*100));
    const label=score>=88?'Exzellent':score>=72?'Stark':score>=48?'Okay':score>=25?'Schwach':'Sehr schwach';
    const color=score>=72?'var(--accent)':score>=48?'#f59e0b':'#ef4444';
    const mode=findings.length?'Pattern-Angriff':'Bruteforce';

    document.getElementById('rating').textContent=label;
    document.getElementById('rating').style.color=color;
    document.getElementById('score-lbl').textContent=score+' / 100';
    document.getElementById('strength-fill').style.width=score+'%';
    document.getElementById('strength-fill').style.background=color;
    document.getElementById('entropy-bits').textContent=Math.round(adj);
    const deg=Math.round(score*3.6);
    document.getElementById('entropy-ring').style.background=`conic-gradient(${color} ${deg}deg, #e2e8f0 ${deg}deg)`;
    document.getElementById('summary').textContent=`~${fmtNum(guesses)} Versuche nötig.`;
    document.getElementById('m-len').textContent=len;
    document.getElementById('m-charset').textContent=cs;
    document.getElementById('m-guesses').textContent=fmtNum(guesses);
    document.getElementById('m-mode').textContent=mode;
    document.getElementById('t-slow').textContent=fmtDur(guesses/rates.slow);
    document.getElementById('t-fast').textContent=fmtDur(guesses/rates.fast);
    document.getElementById('t-cpu').textContent=fmtDur(guesses/rates.cpu);
    document.getElementById('t-gpu').textContent=fmtDur(guesses/rates.gpu);
    document.getElementById('findings').innerHTML=findings.length?findings.map(f=>`<div class="finding-item"><div class="finding-icon">!</div><div><strong>${f.t}</strong><br><span style="font-size:0.8rem;color:var(--muted)">${f.d}</span></div></div>`).join(''):'<p style="color:var(--accent);font-weight:700">Keine kritischen Muster erkannt.</p>';
    document.getElementById('patterns').innerHTML=patterns.map(p=>`<span class="pattern-chip">${p}</span>`).join('');
}

function reset(){
    document.getElementById('rating').textContent='–';
    document.getElementById('strength-fill').style.width='0';
    document.getElementById('entropy-bits').textContent='0';
    document.getElementById('entropy-ring').style.background='conic-gradient(#e2e8f0 0deg,#e2e8f0 360deg)';
    document.getElementById('summary').textContent='';
    ['m-len','m-charset','m-guesses'].forEach(id=>document.getElementById(id).textContent='0');
    document.getElementById('m-mode').textContent='–';
    ['t-slow','t-fast','t-cpu','t-gpu'].forEach(id=>document.getElementById(id).textContent='–');
    document.getElementById('findings').innerHTML='<p style="color:var(--muted);font-size:0.85rem">Passwort eingeben…</p>';
    document.getElementById('patterns').innerHTML='';
}

function toggleVis(){
    const inp=document.getElementById('pw');
    const vis=inp.type==='text';
    inp.type=vis?'password':'text';
    document.getElementById('toggle-vis').innerHTML=vis?'<i class="fas fa-eye"></i>':'<i class="fas fa-eye-slash"></i>';
}

function genPassphrase(){
    const rw=()=>WORDS[Math.floor(Math.random()*WORDS.length)];
    const num=String(Math.floor(10+Math.random()*90));
    const syms=['!','?','#','+',':'];
    const sym=syms[Math.floor(Math.random()*syms.length)];
    document.getElementById('generated').textContent=`${rw()}-${rw()}-${rw()}-${rw()}${sym}${num}`;
}

function useGenerated(){
    const gen=document.getElementById('generated').textContent;
    if(gen==='–')return;
    document.getElementById('pw').value=gen;
    analyze();
}

genPassphrase();
</script>

@include('tools._seo_content', ['toolSlug' => 'password-check', 'toolName' => 'Passwort-Check'])

@endsection