/* Stylized PDF first-page thumbnails. Pure SVG, sized to fit .doc-thumb (1:√2). */

function ThumbFrame({ children, tint = "#FFFCF6" }) {
  return (
    <svg viewBox="0 0 210 297" preserveAspectRatio="xMidYMid meet"
      xmlns="http://www.w3.org/2000/svg"
      style={{ width: "100%", height: "100%", display: "block", background: tint }}>
      {children}
    </svg>
  );
}

function L({ x = 16, y, w = 178, h = 2.2, c = "#D9D3C2" }) {
  return <rect x={x} y={y} width={w} height={h} rx={1} fill={c} />;
}

/* French tax notice · DGFiP-style monochrome */
function ThumbAvisImpot({ year = "2024", revenuRef = "", who = "" }) {
  return (
    <ThumbFrame>
      <rect x="0" y="0" width="210" height="32" fill="#1F2A3E" />
      <text x="14" y="14" fill="#F6F1E7" fontFamily="Geist, sans-serif" fontSize="6" fontWeight="600" letterSpacing="0.5">RÉPUBLIQUE FRANÇAISE</text>
      <text x="14" y="22" fill="#D9B97A" fontFamily="Newsreader, serif" fontSize="9" fontStyle="italic">Direction générale des Finances publiques</text>
      <text x="14" y="28" fill="#F6F1E7" fontFamily="Geist Mono, monospace" fontSize="4.5" opacity=".75">Avis d'impôt {parseInt(year)+1} · revenus {year}</text>

      <text x="16" y="50" fill="#171C26" fontFamily="Newsreader, serif" fontSize="11">Avis d'impôt</text>
      <text x="16" y="58" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="5">Impôt sur les revenus de l'année {year}</text>

      <rect x="14" y="68" width="182" height="46" fill="#F0EBDC" stroke="#D9D3C2" />
      <text x="20" y="78" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6" letterSpacing="0.5">DÉCLARANT</text>
      <text x="20" y="86" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="5.5" fontWeight="600">{who || "SAHBI Mohamed"}</text>
      <text x="20" y="93" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6" letterSpacing="0.5">N° FISCAL</text>
      <text x="20" y="101" fill="#171C26" fontFamily="Geist Mono, monospace" fontSize="5">•••• •••• •••• 7240</text>
      <text x="118" y="78" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6" letterSpacing="0.5">REVENU FISCAL DE RÉF.</text>
      <text x="118" y="89" fill="#171C26" fontFamily="Newsreader, serif" fontSize="10">{revenuRef}</text>
      <text x="118" y="99" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="3.8">€ / an</text>

      <L y="124" /><L y="132" /><L y="140" w={140}/>
      <L y="156" w={70}/>
      <L y="168" /><L y="176" /><L y="184" w={150}/>
      <L y="200" w={90}/>
      <L y="212" /><L y="220" /><L y="228" w={120}/>

      <rect x="14" y="248" width="182" height="32" fill="#F8F4E8" stroke="#D9D3C2" strokeDasharray="2 2" />
      <text x="20" y="258" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6" letterSpacing="0.5">MONTANT NET À PAYER</text>
      <text x="20" y="272" fill="#171C26" fontFamily="Newsreader, serif" fontSize="14">0,00 €</text>
      <text x="160" y="272" fill="#3F6F4A" fontFamily="Geist Mono, monospace" fontSize="4.5">SOLDE NUL</text>
    </ThumbFrame>
  );
}

/* Avis de situation INSEE */
function ThumbAvisSituation() {
  return (
    <ThumbFrame>
      <rect x="0" y="0" width="210" height="20" fill="#1F2A3E" />
      <text x="14" y="13" fill="#F6F1E7" fontFamily="Geist, sans-serif" fontSize="5.2" fontWeight="600" letterSpacing="0.4">INSEE · SIRENE</text>
      <text x="14" y="34" fill="#171C26" fontFamily="Newsreader, serif" fontSize="10">Avis de situation</text>
      <text x="14" y="42" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="4.5">au répertoire SIRENE</text>

      <rect x="14" y="52" width="182" height="32" fill="#F0EBDC" />
      <text x="20" y="62" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6">SIRET</text>
      <text x="20" y="72" fill="#171C26" fontFamily="Geist Mono, monospace" fontSize="6">934 218 506 00018</text>
      <text x="20" y="80" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="4">Actif · auto-entrepreneur</text>

      <text x="14" y="100" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6">DÉNOMINATION</text>
      <text x="14" y="110" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="6" fontWeight="500">SAHBI MOHAMED</text>

      <text x="14" y="126" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6">ACTIVITÉ PRINCIPALE (NAF)</text>
      <text x="14" y="136" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="5">62.01Z · Programmation informatique</text>

      <L y="152" /><L y="160" /><L y="168" w={130}/>
      <L y="184" w={80}/>
      <L y="196" /><L y="204" /><L y="212" w={150}/>
      <L y="228" w={100}/>
      <L y="240" /><L y="248" w={140}/>
      <L y="264" w={120}/>
      <rect x="14" y="278" width="60" height="10" fill="none" stroke="#D9D3C2" strokeDasharray="2 2"/>
      <text x="17" y="285" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.5">Tampon INSEE</text>
    </ThumbFrame>
  );
}

/* Attestation d'hébergement */
function ThumbHebergement() {
  return (
    <ThumbFrame>
      <text x="105" y="28" textAnchor="middle" fill="#171C26" fontFamily="Newsreader, serif" fontSize="9">Attestation d'hébergement</text>
      <line x1="58" y1="34" x2="152" y2="34" stroke="#B58A3C" strokeWidth="0.4"/>

      <text x="16" y="52" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4">Je soussignée,</text>
      <text x="16" y="60" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4" fontWeight="600">Amira Stolzenberg</text>
      <text x="16" y="68" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4">demeurant au 10 rue du Général Mittelhau,</text>
      <text x="16" y="74" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4">67630 Lauterbourg,</text>

      <text x="16" y="90" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4">atteste héberger à mon domicile,</text>
      <text x="16" y="98" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4">depuis le 5 août 2024,</text>
      <text x="16" y="106" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4" fontWeight="600">M. Mohamed Taieb Sahbi,</text>
      <text x="16" y="114" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4">né le 30 janvier 1990 à Gafsa (Tunisie).</text>

      <L y="130" w={150}/>
      <L y="138" w={170}/>
      <L y="146" w={120}/>
      <L y="160" w={140}/>
      <L y="168" w={90}/>

      <text x="16" y="200" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="4">Fait à Lauterbourg, le 5 mai 2026</text>
      <text x="16" y="216" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6">Signature</text>
      <path d="M16 240 q 8 -14 18 -4 t 18 -2 q 6 -2 10 6 t 14 -2" fill="none" stroke="#1F2A3E" strokeWidth="0.6" strokeLinecap="round"/>
      <line x1="16" y1="252" x2="80" y2="252" stroke="#D9D3C2" strokeWidth="0.4"/>
    </ThumbFrame>
  );
}

/* Geschäftsführervertrag · German managing director contract */
function ThumbContratGerant() {
  return (
    <ThumbFrame>
      <text x="105" y="34" textAnchor="middle" fill="#171C26" fontFamily="Newsreader, serif" fontSize="9">Geschäftsführer­vertrag</text>
      <text x="105" y="42" textAnchor="middle" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="4.2">Managing director agreement</text>
      <line x1="70" y1="48" x2="140" y2="48" stroke="#B58A3C" strokeWidth="0.4"/>

      <text x="16" y="64" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.4">ZWISCHEN</text>
      <text x="16" y="72" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.6" fontWeight="600">TAJ Production UG</text>
      <text x="16" y="78" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="4">Karlsruhe · HRB 738114</text>

      <text x="16" y="92" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.4">UND</text>
      <text x="16" y="100" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.6" fontWeight="600">Herr Justin Stolzenberg</text>
      <text x="16" y="106" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="4">geboren am 02.02.1983 in Eutin</text>

      <text x="16" y="124" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4" fontWeight="500">§ 1 · Aufgaben</text>
      <L y="130" /><L y="136" w={150}/>

      <text x="16" y="150" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4" fontWeight="500">§ 2 · Vergütung</text>
      <L y="156" /><L y="162" /><L y="168" w={130}/>

      <rect x="14" y="180" width="182" height="22" fill="#F0EBDC" stroke="#D9D3C2"/>
      <text x="20" y="190" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6">JAHRESGEHALT BRUTTO</text>
      <text x="20" y="199" fill="#171C26" fontFamily="Newsreader, serif" fontSize="9">131 400,00 €</text>

      <text x="16" y="218" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4" fontWeight="500">§ 3 · Vertragsdauer</text>
      <L y="224" /><L y="230" w={140}/>

      <text x="16" y="260" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="3.8">Karlsruhe, 02.01.2020</text>
      <path d="M16 276 q 10 -10 20 -2 t 20 -4 q 8 0 14 6" fill="none" stroke="#1F2A3E" strokeWidth="0.6" strokeLinecap="round"/>
      <line x1="16" y1="282" x2="80" y2="282" stroke="#D9D3C2" strokeWidth="0.4"/>
    </ThumbFrame>
  );
}

/* Brutto-Netto-Abrechnung · German payslip */
function ThumbPayslip({ month = "Februar 2026", brutto = "10.950,00", netto = "5.842,11" }) {
  return (
    <ThumbFrame>
      <rect x="0" y="0" width="210" height="24" fill="#1F2A3E"/>
      <text x="14" y="11" fill="#F6F1E7" fontFamily="Geist, sans-serif" fontSize="5" fontWeight="600" letterSpacing="0.4">TAJ PRODUCTION UG</text>
      <text x="14" y="18" fill="#D9B97A" fontFamily="Geist Mono, monospace" fontSize="3.8" letterSpacing="0.4">Brutto-Netto-Abrechnung · {month}</text>

      <text x="16" y="38" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.6">ARBEITNEHMER</text>
      <text x="16" y="46" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="5.2" fontWeight="600">Justin Stolzenberg</text>
      <text x="16" y="52" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="3.8">Geschäftsführer · Pers.-Nr. 1001</text>

      {/* table header */}
      <rect x="14" y="64" width="182" height="6" fill="#F0EBDC"/>
      <text x="18" y="68.6" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">BEZÜGE / ABZÜGE</text>
      <text x="158" y="68.6" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">BETRAG €</text>

      {[
        ["Grundgehalt", "10.000,00"],
        ["Sachbezug Firmenwagen", "650,00"],
        ["Internet-Pauschale", "50,00"],
        ["Telefon-Pauschale", "250,00"],
        ["Lohnsteuer", "−2.846,33"],
        ["Solidaritätszuschlag", "−156,55"],
        ["Krankenversicherung", "−632,15"],
        ["Rentenversicherung", "−972,67"],
        ["Arbeitslosenvers.", "−183,40"],
        ["Pflegevers.", "−216,79"],
      ].map(([k,v],i)=>(
        <g key={i}>
          <text x="18" y={78+i*7} fill="#171C26" fontFamily="Geist, sans-serif" fontSize="3.6">{k}</text>
          <text x="192" y={78+i*7} textAnchor="end" fill="#171C26" fontFamily="Geist Mono, monospace" fontSize="3.6">{v}</text>
          <line x1="14" y1={80+i*7} x2="196" y2={80+i*7} stroke="#EAE3D2" strokeWidth="0.2"/>
        </g>
      ))}

      <rect x="14" y="156" width="182" height="14" fill="#F0EBDC"/>
      <text x="18" y="162" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.4">BRUTTO</text>
      <text x="18" y="168.5" fill="#171C26" fontFamily="Newsreader, serif" fontSize="8">{brutto} €</text>
      <text x="120" y="162" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.4">AUSZAHLUNG NETTO</text>
      <text x="120" y="168.5" fill="#3F6F4A" fontFamily="Newsreader, serif" fontSize="8">{netto} €</text>

      <text x="16" y="186" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">SUMMEN SEIT JANUAR</text>
      <L y="192"/><L y="198"/><L y="204" w={140}/>
      <L y="218" w={150}/>
      <L y="232"/><L y="238" w={120}/>

      <text x="16" y="270" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="3.6">Überweisung am 28.{month.split(" ")[0].slice(0,3).toLowerCase()}.2026</text>
      <text x="16" y="278" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.4">IBAN DE89 6605 0101 •••• ••12</text>
    </ThumbFrame>
  );
}

/* Facture eau · SIAEP utility bill */
function ThumbFactureEau() {
  return (
    <ThumbFrame>
      <rect x="0" y="0" width="210" height="26" fill="#2A5F8F"/>
      <text x="14" y="12" fill="#F6F1E7" fontFamily="Geist, sans-serif" fontSize="5.6" fontWeight="600" letterSpacing="0.3">SIAEP de Lauterbourg et environs</text>
      <text x="14" y="19" fill="#BFD8EE" fontFamily="Geist, sans-serif" fontSize="3.8">Service de l'eau potable · Bas-Rhin</text>

      <text x="14" y="40" fill="#171C26" fontFamily="Newsreader, serif" fontSize="9">Facture d'eau</text>
      <text x="14" y="47" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="4">Période du 01/10/2025 au 31/03/2026</text>

      <rect x="14" y="58" width="86" height="34" fill="#F0EBDC"/>
      <text x="18" y="66" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">ABONNÉ</text>
      <text x="18" y="74" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4" fontWeight="600">M. Stolzenberg Justin</text>
      <text x="18" y="80" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="3.8">10 rue du Général Mittelhau</text>
      <text x="18" y="86" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="3.8">67630 Lauterbourg</text>

      <rect x="110" y="58" width="86" height="34" fill="#F0EBDC"/>
      <text x="114" y="66" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">RÉFÉRENCE</text>
      <text x="114" y="74" fill="#171C26" fontFamily="Geist Mono, monospace" fontSize="4.6">FA-2026-04-0428</text>
      <text x="114" y="82" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">N° COMPTEUR · 24A0815</text>

      <rect x="14" y="100" width="182" height="6" fill="#1F2A3E"/>
      <text x="18" y="104.5" fill="#F6F1E7" fontFamily="Geist Mono, monospace" fontSize="3.2">DÉTAIL</text>
      <text x="158" y="104.5" fill="#F6F1E7" fontFamily="Geist Mono, monospace" fontSize="3.2">MONTANT €</text>

      {[
        ["Abonnement compteur · 6 mois", "32,40"],
        ["Consommation 38 m³ × 1,84 €", "69,92"],
        ["Redevance pollution", "12,16"],
        ["Modernisation des réseaux", "5,70"],
        ["TVA 5,5 %", "6,61"],
      ].map(([k,v],i)=>(
        <g key={i}>
          <text x="18" y={116+i*8} fill="#171C26" fontFamily="Geist, sans-serif" fontSize="3.8">{k}</text>
          <text x="192" y={116+i*8} textAnchor="end" fill="#171C26" fontFamily="Geist Mono, monospace" fontSize="3.8">{v}</text>
          <line x1="14" y1={118+i*8} x2="196" y2={118+i*8} stroke="#EAE3D2" strokeWidth="0.2"/>
        </g>
      ))}

      <rect x="14" y="164" width="182" height="14" fill="#F0EBDC" stroke="#D9D3C2"/>
      <text x="18" y="173" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.4">TOTAL À PAYER</text>
      <text x="192" y="174.5" textAnchor="end" fill="#171C26" fontFamily="Newsreader, serif" fontSize="9">126,79 €</text>

      <L y="192"/><L y="200"/><L y="208" w={140}/>
      <L y="222" w={80}/>
      <L y="236"/><L y="244" w={130}/>

      <text x="16" y="276" fill="#6A6B71" fontFamily="Geist, sans-serif" fontSize="3.6">Prélèvement automatique le 15/04/2026</text>
    </ThumbFrame>
  );
}

/* Titre de séjour · French residence permit (recto + verso) */
function ThumbTitreSejour() {
  return (
    <ThumbFrame tint="#F4EFE2">
      <rect x="0" y="0" width="210" height="22" fill="#1F2A3E"/>
      <text x="14" y="10" fill="#F6F1E7" fontFamily="Geist, sans-serif" fontSize="4.6" fontWeight="600" letterSpacing="0.5">RÉPUBLIQUE FRANÇAISE</text>
      <text x="14" y="17" fill="#D9B97A" fontFamily="Geist Mono, monospace" fontSize="3.4" letterSpacing="0.5">TITRE DE SÉJOUR · PASSEPORT TALENT</text>

      <rect x="14" y="34" width="84" height="108" fill="#FFFCF6" stroke="#D9D3C2"/>
      <rect x="22" y="42" width="68" height="76" fill="#E2DCCC"/>
      <circle cx="56" cy="74" r="14" fill="#D2CAB5"/>
      <path d="M40 100 q 16 -16 32 0 v 14 H40 z" fill="#D2CAB5"/>
      <text x="56" y="128" textAnchor="middle" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">PHOTO</text>

      <text x="106" y="42" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">NOM</text>
      <text x="106" y="48" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="5" fontWeight="600">SAHBI</text>
      <text x="106" y="58" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">PRÉNOMS</text>
      <text x="106" y="64" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.4">Mohamed Taieb</text>
      <text x="106" y="74" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">NÉ(E) LE</text>
      <text x="106" y="80" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.2">30.01.1990</text>
      <text x="106" y="90" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">À</text>
      <text x="106" y="96" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.2">Gafsa (Tunisie)</text>
      <text x="106" y="106" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">NATIONALITÉ</text>
      <text x="106" y="112" fill="#171C26" fontFamily="Geist, sans-serif" fontSize="4.2">Tunisienne</text>
      <text x="106" y="122" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">VALABLE JUSQU'AU</text>
      <text x="106" y="128" fill="#171C26" fontFamily="Newsreader, serif" fontSize="6">02.08.2028</text>

      <rect x="14" y="150" width="182" height="6" fill="#F0EBDC"/>
      <text x="18" y="154.5" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">VERSO · ADRESSE</text>
      <L y="164" /><L y="170" /><L y="176" w={130}/>
      <L y="190" w={150}/>
      <L y="202" /><L y="208" w={160}/>

      <text x="14" y="240" fill="#6A6B71" fontFamily="Geist Mono, monospace" fontSize="3.2">MRZ</text>
      <text x="14" y="252" fill="#171C26" fontFamily="Geist Mono, monospace" fontSize="3.6" letterSpacing="0.6">P&lt;FRASAHBI&lt;&lt;MOHAMED&lt;TAIEB&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;&lt;</text>
      <text x="14" y="262" fill="#171C26" fontFamily="Geist Mono, monospace" fontSize="3.6" letterSpacing="0.6">19FR9001302TUN9001302M2808022&lt;&lt;&lt;&lt;</text>

      <rect x="150" y="246" width="42" height="34" fill="none" stroke="#B58A3C" strokeDasharray="2 2" opacity="0.6"/>
      <text x="171" y="266" textAnchor="middle" fill="#B58A3C" fontFamily="Geist Mono, monospace" fontSize="3.4" opacity="0.7">FILIGRANE</text>
    </ThumbFrame>
  );
}

/* Reisepass · German passport */
function ThumbPasseportJustin() {
  return (
    <ThumbFrame tint="#5A2728">
      <rect x="0" y="0" width="210" height="297" fill="#5A2728"/>
      <text x="105" y="60" textAnchor="middle" fill="#E8C97A" fontFamily="Geist, sans-serif" fontSize="6" fontWeight="600" letterSpacing="1.4">EUROPÄISCHE UNION</text>
      <text x="105" y="76" textAnchor="middle" fill="#E8C97A" fontFamily="Geist, sans-serif" fontSize="6" fontWeight="600" letterSpacing="1.4">BUNDESREPUBLIK DEUTSCHLAND</text>
      <line x1="60" y1="86" x2="150" y2="86" stroke="#E8C97A" strokeWidth="0.3"/>

      {/* Bundesadler stylized */}
      <g transform="translate(105 140)" fill="#E8C97A">
        <ellipse cx="0" cy="0" rx="22" ry="16" fill="none" stroke="#E8C97A" strokeWidth="0.6"/>
        <path d="M-18 -2 q 6 -10 18 -10 t 18 10 q -4 10 -18 16 q -14 -6 -18 -16 z" fill="none" stroke="#E8C97A" strokeWidth="0.6"/>
        <circle cx="-6" cy="-2" r="1.4"/>
        <circle cx="6" cy="-2" r="1.4"/>
        <path d="M-2 4 q 2 4 4 0" fill="none" stroke="#E8C97A" strokeWidth="0.5"/>
      </g>

      <text x="105" y="190" textAnchor="middle" fill="#E8C97A" fontFamily="Newsreader, serif" fontSize="11" fontWeight="500" letterSpacing="2">REISEPASS</text>
      <text x="105" y="200" textAnchor="middle" fill="#E8C97A" fontFamily="Geist, sans-serif" fontSize="5" letterSpacing="1.2">PASSPORT · PASSEPORT</text>

      <rect x="60" y="220" width="90" height="20" fill="none" stroke="#E8C97A" strokeWidth="0.4" opacity="0.7"/>
      <text x="105" y="232" textAnchor="middle" fill="#E8C97A" fontFamily="Geist Mono, monospace" fontSize="4" letterSpacing="0.6">STOLZENBERG, JUSTIN</text>

      <text x="105" y="262" textAnchor="middle" fill="#E8C97A" fontFamily="Geist Mono, monospace" fontSize="3.4" opacity="0.75">Gültig bis · Valid until · 08.2028</text>

      <rect x="76" y="270" width="58" height="18" fill="none" stroke="#E8C97A" strokeDasharray="2 2" opacity="0.55"/>
      <text x="105" y="281" textAnchor="middle" fill="#E8C97A" fontFamily="Geist Mono, monospace" fontSize="3.4" opacity="0.7">FILIGRANE</text>
    </ThumbFrame>
  );
}

window.DossierThumbs = {
  AvisImpotLocataire: () => <ThumbAvisImpot year="2024" revenuRef="3 412" who="SAHBI Mohamed Taieb" />,
  AvisImpotGarant:    () => <ThumbAvisImpot year="2024" revenuRef="98 740" who="STOLZENBERG Justin" />,
  AvisSituation:      ThumbAvisSituation,
  Hebergement:        ThumbHebergement,
  ContratGerant:      ThumbContratGerant,
  PayslipFev:         () => <ThumbPayslip month="Februar 2026" brutto="10.950,00" netto="5.842,11" />,
  PayslipMar:         () => <ThumbPayslip month="März 2026"    brutto="10.950,00" netto="5.842,11" />,
  PayslipAvr:         () => <ThumbPayslip month="April 2026"   brutto="10.950,00" netto="5.842,11" />,
  FactureEau:         ThumbFactureEau,
  TitreSejour:        ThumbTitreSejour,
  PasseportJustin:    ThumbPasseportJustin,
};
