| <!DOCTYPE html> |
| <html lang="ro"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Dear DiDi | Ajutor și Resurse pentru Tineri Vulnerabili în România</title> |
| <meta name="description" content="Dear DiDi oferă suport, resurse și ghidare pentru tinerii vulnerabili din România, inclusiv ajutor legal, sprijin financiar, locuri de muncă și formare profesională."> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
| <link href="https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&family=Open+Sans:wght@400;600&display=swap" rel="stylesheet"> |
| <style> |
| .dear-didi { |
| font-family: 'Dancing Script', cursive; |
| } |
| body { |
| font-family: 'Open Sans', sans-serif; |
| background-color: #FFF9F5; |
| } |
| |
| .romanian-red-bg { background-color: #CE1126; } |
| .romanian-yellow-bg { background-color: #FCD116; } |
| .romanian-blue-bg { background-color: #002B7F; } |
| |
| .warm-orange-bg { background-color: #FF8C42; } |
| .warm-peach-bg { background-color: #FFD3B6; } |
| |
| |
| .text-romanian-custom-blue { color: #002B7F; } |
| .text-romanian-custom-red { color: #CE1126; } |
| .text-romanian-custom-yellow { color: #FCD116; } |
| .text-warm-orange { color: #FF8C42;} |
| .text-warm-peach-darker { color: #E5A074; } |
| |
| |
| .chatbot-container { |
| transition: all 0.3s ease; |
| } |
| .chatbot-hidden { |
| transform: translateY(100%); |
| opacity: 0; |
| } |
| .step-card:hover { |
| transform: translateY(-5px); |
| box-shadow: 0 10px 20px rgba(0,0,0,0.1); |
| } |
| </style> |
| </head> |
| <body class="text-gray-800"> |
| <header class="romanian-red-bg text-white py-6 shadow-md"> |
| <div class="container mx-auto px-4"> |
| <div class="flex justify-between items-center"> |
| <h1 class="dear-didi text-4xl md:text-5xl">Dear DiDi<span class="text-romanian-custom-yellow">💖</span></h1> |
| <button id="chatbotToggle" class="warm-orange-bg hover:bg-yellow-600 text-white font-bold py-2 px-4 rounded-full flex items-center"> |
| <img src="https://i.ibb.co/9kkWq2HY/Didi3.jpg" alt="DiDi Chat" class="w-8 h-8 rounded-full mr-2 border-2 border-white object-cover"> |
| Ajutor Chat |
| </button> |
| </div> |
| <p class="mt-2 text-warm-peach-darker">Suport și resurse pentru tineri vulnerabili</p> |
| </div> |
| </header> |
|
|
| <section id="about-didi" class="py-12 bg-warm-peach bg-opacity-20"> |
| <div class="container mx-auto px-4 flex flex-col md:flex-row items-center"> |
| <div class="md:w-1/3 mb-6 md:mb-0 md:mr-8 flex justify-center"> |
| <img src="https://i.ibb.co/WvqCRsVH/an-anime-style-futuristic-ai-innovator-your-name-standing-with-confidence-in-a-neon-lit-cyber-citys.webp" alt="an-anime-style-futuristic-ai-innovator-your-name-standing-with-confidence-in-a-neon-lit-cyber-citys-" border="0"> |
| </div> |
| <div class="md:w-2/3 text-center md:text-left"> |
| <h2 class="text-3xl font-bold romanian-blue mb-3">💖 You'll be ok 🤗</h2> |
| <p class="text-lg text-gray-700 mb-4"> |
| I'm sorry if the site is not true or if there's anything insulting... I just asked my AI agents to research and make sure it's in Romanian 🤣. I don't know what anything says... |
| </p> |
| <p class="text-lg text-gray-700 mb-4"> |
| You are a BEATIFUL GIRL, who any guy will be lucky to have.. or come to Australia and we'll make 💰🫰💵 somehow 😎 - 💖 Kev |
| </p> |
| </div> |
| </div> |
| </section> |
|
|
|
|
| <section class="warm-peach-bg py-12"> |
| <div class="container mx-auto px-4 text-center"> |
| <h2 class="text-3xl md:text-4xl font-bold mb-4 text-romanian-custom-blue">Ai nevoie de ajutor urgent?</h2> |
| <p class="text-xl mb-8 max-w-2xl mx-auto text-gray-700">Dacă ești în pericol de evacuare sau ai nevoie de sprijin rapid, următorii pași te pot ajuta să obții soluții practice.</p> |
| <div class="flex flex-wrap justify-center gap-4"> |
| <a href="#legal" class="romanian-red-bg hover:bg-red-800 text-white font-bold py-3 px-6 rounded-full">Ajutor Legal</a> |
| <a href="#financial" class="romanian-blue-bg hover:bg-blue-900 text-white font-bold py-3 px-6 rounded-full">Sprijin Financiar</a> |
| <a href="#jobs" class="warm-orange-bg hover:bg-orange-700 text-white font-bold py-3 px-6 rounded-full">Locuri de Muncă</a> |
| </div> |
| </div> |
| </section> |
|
|
| <main class="container mx-auto px-4 py-12"> |
| <section id="legal" class="mb-16"> |
| <div class="flex items-center mb-6"> |
| <div class="romanian-red-bg text-white font-bold text-2xl rounded-full w-12 h-12 flex items-center justify-center mr-4">1</div> |
| <h2 class="text-2xl md:text-3xl font-bold text-romanian-custom-blue">Obține ajutor juridic gratuit</h2> |
| </div> |
| |
| <div class="grid md:grid-cols-2 gap-6"> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300"> |
| <div class="romanian-blue-bg text-white px-6 py-4"> |
| <h3 class="font-bold text-xl flex items-center"> |
| <i class="fas fa-balance-scale mr-3"></i> Baroul București |
| </h3> |
| </div> |
| <div class="p-6"> |
| <p class="mb-4">Serviciul de asistență juridică gratuită pentru persoanele vulnerabile.</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"> |
| <i class="fas fa-phone-alt text-romanian-custom-red mr-3 mt-1"></i> |
| <span><strong>Telefon:</strong> <a href="tel:0213142023" class="text-romanian-custom-blue hover:underline">021.314.20.23</a></span> |
| </li> |
| <li class="flex items-start"> |
| <i class="fas fa-envelope text-romanian-custom-red mr-3 mt-1"></i> |
| <span><strong>Email:</strong> <a href="mailto:saj@baroul-bucuresti.ro" class="text-romanian-custom-blue hover:underline">saj@baroul-bucuresti.ro</a></span> |
| </li> |
| <li class="flex items-start"> |
| <i class="fas fa-map-marker-alt text-romanian-custom-red mr-3 mt-1"></i> |
| <span><strong>Adresă:</strong> CAMERA P100 (marți și joi 12–14)</span> |
| </li> |
| </ul> |
| <div class="mt-4 p-3 warm-peach-bg rounded"> |
| <i class="fas fa-lightbulb text-romanian-custom-blue mr-2"></i> |
| <strong>Sfat:</strong> Explică că ești fără venit și riști să fii evacuată. Cere consultanță pentru suspendarea evacuării. |
| </div> |
| </div> |
| </div> |
| |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300"> |
| <div class="romanian-blue-bg text-white px-6 py-4"> |
| <h3 class="font-bold text-xl flex items-center"> |
| <i class="fas fa-gavel mr-3"></i> Acte necesare |
| </h3> |
| </div> |
| <div class="p-6"> |
| <p class="mb-4">Documente pe care ar trebui să le ai pentru a-ți apăra drepturile:</p> |
| <ul class="space-y-2"> |
| <li class="flex items-start"> |
| <i class="fas fa-check-circle text-green-500 mr-3 mt-1"></i> |
| <span>Contractul de închiriere (dacă există)</span> |
| </li> |
| <li class="flex items-start"> |
| <i class="fas fa-check-circle text-green-500 mr-3 mt-1"></i> |
| <span>Orice notificare primită de la proprietar</span> |
| </li> |
| <li class="flex items-start"> |
| <i class="fas fa-check-circle text-green-500 mr-3 mt-1"></i> |
| <span>Dovada veniturilor (dacă ai)</span> |
| </li> |
| <li class="flex items-start"> |
| <i class="fas fa-check-circle text-green-500 mr-3 mt-1"></i> |
| <span>Carte de identitate</span> |
| </li> |
| </ul> |
| <div class="mt-4 p-3 warm-peach-bg rounded"> |
| <i class="fas fa-exclamation-triangle text-romanian-custom-red mr-2"></i> |
| <strong>Important:</strong> Dacă nu ai acte, contactează DGASPC pentru asistență în obținerea lor. |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="financial" class="mb-16"> |
| <div class="flex items-center mb-6"> |
| <div class="romanian-red-bg text-white font-bold text-2xl rounded-full w-12 h-12 flex items-center justify-center mr-4">2</div> |
| <h2 class="text-2xl md:text-3xl font-bold text-romanian-custom-blue">Aplică pentru sprijin financiar</h2> |
| </div> |
| <div class="grid md:grid-cols-2 gap-6"> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300"> |
| <div class="romanian-blue-bg text-white px-6 py-4"> |
| <h3 class="font-bold text-xl flex items-center"><i class="fas fa-hand-holding-usd mr-3"></i> DGASPC Sector 1</h3> |
| </div> |
| <div class="p-6"> |
| <p class="mb-4">Program de prevenire a marginalizării pentru tineri care au fost în sistemul de protecție.</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"><i class="fas fa-envelope text-romanian-custom-red mr-3 mt-1"></i><span><strong>Email:</strong> <a href="mailto:preveniremarginalizare@dgaspc-sectorul1.ro" class="text-romanian-custom-blue hover:underline">preveniremarginalizare@dgaspc-sectorul1.ro</a></span></li> |
| <li class="flex items-start"><i class="fas fa-phone-alt text-romanian-custom-red mr-3 mt-1"></i><span><strong>Telefon:</strong> <a href="tel:0212221440" class="text-romanian-custom-blue hover:underline">021.222.14.40</a></span></li> |
| <li class="flex items-start"><i class="fas fa-map-marker-alt text-romanian-custom-red mr-3 mt-1"></i><span><strong>Adresă:</strong> Bd. Mareşal Averescu, nr.17, pavilionul E, Sector 1</span></li> |
| </ul> |
| <div class="mt-4 p-3 warm-peach-bg rounded"><i class="fas fa-lightbulb text-romanian-custom-blue mr-2"></i><strong>Eligibilitate:</strong> Ai dreptul la ajutor dacă ai fost în sistemul de protecție și ai un contract de închiriere valid.</div> |
| </div> |
| </div> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300"> |
| <div class="romanian-blue-bg text-white px-6 py-4"> |
| <h3 class="font-bold text-xl flex items-center"><i class="fas fa-first-aid mr-3"></i> Ajutor de urgență Sector 6</h3> |
| </div> |
| <div class="p-6"> |
| <p class="mb-4">Asistență socială pentru persoane cu venituri sub 2.053 lei/lună.</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"><i class="fas fa-envelope text-romanian-custom-red mr-3 mt-1"></i><span><strong>Email:</strong> <a href="mailto:ajutorsocial@dgaspc6.com" class="text-romanian-custom-blue hover:underline">ajutorsocial@dgaspc6.com</a></span></li> |
| <li class="flex items-start"><i class="fas fa-map-marker-alt text-romanian-custom-red mr-3 mt-1"></i><span><strong>Adresă:</strong> Str. Floare Roșie nr. 7A, Sector 6</span></li> |
| </ul> |
| <div class="mt-4"> |
| <h4 class="font-bold mb-2">Documente necesare:</h4> |
| <ul class="space-y-2"> |
| <li class="flex items-start"><i class="fas fa-file-alt text-gray-500 mr-3 mt-1"></i><span>Copie CI</span></li> |
| <li class="flex items-start"><i class="fas fa-file-alt text-gray-500 mr-3 mt-1"></i><span>Dovadă venituri (dacă există)</span></li> |
| <li class="flex items-start"><i class="fas fa-file-alt text-gray-500 mr-3 mt-1"></i><span>Contract de închiriere</span></li> |
| </ul> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="jobs" class="mb-16"> |
| <div class="flex items-center mb-6"> |
| <div class="romanian-red-bg text-white font-bold text-2xl rounded-full w-12 h-12 flex items-center justify-center mr-4">3</div> |
| <h2 class="text-2xl md:text-3xl font-bold text-romanian-custom-blue">Caută muncă rapidă</h2> |
| </div> |
| <div class="grid md:grid-cols-3 gap-6"> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300"> |
| <div class="warm-orange-bg text-white px-6 py-4"><h3 class="font-bold text-xl flex items-center"><i class="fas fa-motorcycle mr-3"></i> Livrări</h3></div> |
| <div class="p-6"> |
| <p class="mb-4">Locuri de muncă flexibile în domeniul livrărilor:</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"><i class="fas fa-bolt text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Bolt Food:</strong> <a href="https://bolt.eu/ro/" target="_blank" rel="noopener noreferrer" class="text-romanian-custom-blue hover:underline">www.bolt.eu</a></span></li> |
| <li class="flex items-start"><i class="fas fa-truck text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Glovo:</strong> <a href="https://glovoapp.com" target="_blank" rel="noopener noreferrer" class="text-romanian-custom-blue hover:underline">www.glovoapp.com</a></span></li> |
| <li class="flex items-start"><i class="fas fa-hamburger text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Tazz:</strong> <a href="https://tazz.ro" target="_blank" rel="noopener noreferrer" class="text-romanian-custom-blue hover:underline">www.tazz.ro</a></span></li> |
| </ul> |
| <div class="mt-4 p-3 warm-peach-bg rounded"><i class="fas fa-money-bill-wave text-romanian-custom-blue mr-2"></i><strong>Câștig:</strong> 30+ RON/oră + bacșișuri. Ai nevoie de smartphone și bicicletă/trotinetă.</div> |
| </div> |
| </div> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300"> |
| <div class="warm-orange-bg text-white px-6 py-4"><h3 class="font-bold text-xl flex items-center"><i class="fas fa-broom mr-3"></i> Curățenie</h3></div> |
| <div class="p-6"> |
| <p class="mb-4">Locuri de muncă în domeniul curățeniei:</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"><i class="fas fa-hands-helping text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Helperz:</strong> <a href="https://helperz.ro" target="_blank" rel="noopener noreferrer" class="text-romanian-custom-blue hover:underline">www.helperz.ro</a></span></li> |
| <li class="flex items-start"><i class="fas fa-search text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Jooble:</strong> <a href="https://ro.jooble.org" target="_blank" rel="noopener noreferrer" class="text-romanian-custom-blue hover:underline">www.jooble.org</a></span></li> |
| </ul> |
| <div class="mt-4 p-3 warm-peach-bg rounded"><i class="fas fa-money-bill-wave text-romanian-custom-blue mr-2"></i><strong>Câștig:</strong> 40-100 RON/oră. Ai nevoie de atenție la detalii și fiabilitate.</div> |
| </div> |
| </div> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300"> |
| <div class="warm-orange-bg text-white px-6 py-4"><h3 class="font-bold text-xl flex items-center"><i class="fas fa-newspaper mr-3"></i> Distribuire pliante</h3></div> |
| <div class="p-6"> |
| <p class="mb-4">Locuri de muncă în distribuire materiale promoționale:</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"><i class="fas fa-briefcase text-romanian-custom-blue mr-3 mt-1"></i><span><strong>eJobs:</strong> <a href="https://www.ejobs.ro" target="_blank" rel="noopener noreferrer" class="text-romanian-custom-blue hover:underline">www.ejobs.ro</a></span></li> |
| <li class="flex items-start"><i class="fas fa-ad text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Anunțul:</strong> <a href="https://www.anuntul.ro" target="_blank" rel="noopener noreferrer" class="text-romanian-custom-blue hover:underline">www.anuntul.ro</a></span></li> |
| </ul> |
| <div class="mt-4 p-3 warm-peach-bg rounded"><i class="fas fa-money-bill-wave text-romanian-custom-blue mr-2"></i><strong>Câștig:</strong> Proiecte part-time (ex: 800 RON pentru 2 săptămâni de distribuție).</div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="training" class="mb-16"> |
| <div class="flex items-center mb-6"> |
| <div class="romanian-red-bg text-white font-bold text-2xl rounded-full w-12 h-12 flex items-center justify-center mr-4">4</div> |
| <h2 class="text-2xl md:text-3xl font-bold text-romanian-custom-blue">Învăță o meserie nouă</h2> |
| </div> |
| <div class="grid md:grid-cols-2 gap-6"> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300"> |
| <div class="romanian-blue-bg text-white px-6 py-4"><h3 class="font-bold text-xl flex items-center"><i class="fas fa-laptop-code mr-3"></i> Cursuri gratuite ANOFM</h3></div> |
| <div class="p-6"> |
| <p class="mb-4">Programe de formare profesională finanțate de stat:</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"><i class="fas fa-globe text-romanian-custom-red mr-3 mt-1"></i><span><strong>Website:</strong> <a href="https://www.anofm.ro" target="_blank" rel="noopener noreferrer" class="text-romanian-custom-blue hover:underline">www.anofm.ro</a></span></li> |
| <li class="flex items-start"><i class="fas fa-graduation-cap text-romanian-custom-red mr-3 mt-1"></i><span><strong>Cursuri disponibile:</strong> Electrician, Instalator, Asistent IT, Introducere date</span></li> |
| </ul> |
| <div class="mt-4 p-3 warm-peach-bg rounded"><i class="fas fa-file-alt text-romanian-custom-blue mr-2"></i><strong>Documente necesare:</strong> CI, adeverință medicală, diplome (dacă ai). Primești alocație lunară în timpul cursului.</div> |
| </div> |
| </div> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300"> |
| <div class="romanian-blue-bg text-white px-6 py-4"><h3 class="font-bold text-xl flex items-center"><i class="fas fa-hands-helping mr-3"></i> The Social Incubator</h3></div> |
| <div class="p-6"> |
| <p class="mb-4">Ghidare profesională și dezvoltare abilități pentru tineri vulnerabili:</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"><i class="fas fa-envelope text-romanian-custom-red mr-3 mt-1"></i><span><strong>Email:</strong> <a href="mailto:office@asociatiasocialincubator.org" class="text-romanian-custom-blue hover:underline">office@asociatiasocialincubator.org</a></span></li> |
| <li class="flex items-start"><i class="fas fa-phone-alt text-romanian-custom-red mr-3 mt-1"></i><span><strong>Telefon:</strong> <a href="tel:0790599908" class="text-romanian-custom-blue hover:underline">0790 599 908</a></span></li> |
| <li class="flex items-start"><i class="fas fa-tools text-romanian-custom-red mr-3 mt-1"></i><span><strong>Servicii:</strong> Abilități digitale, pregătire interviu, stagii de practică</span></li> |
| </ul> |
| <div class="mt-4 p-3 warm-peach-bg rounded"><i class="fas fa-users text-romanian-custom-blue mr-2"></i><strong>Beneficii:</strong> Programe personalizate, mentorat, conexiuni cu angajatori.</div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="documents" class="mb-16"> |
| <div class="flex items-center mb-6"> |
| <div class="romanian-red-bg text-white font-bold text-2xl rounded-full w-12 h-12 flex items-center justify-center mr-4">5</div> |
| <h2 class="text-2xl md:text-3xl font-bold text-romanian-custom-blue">Asigură-ți actele</h2> |
| </div> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden step-card transition duration-300 max-w-3xl mx-auto"> |
| <div class="romanian-blue-bg text-white px-6 py-4"><h3 class="font-bold text-xl flex items-center"><i class="fas fa-id-card mr-3"></i> Acte de identitate și documente</h3></div> |
| <div class="p-6"> |
| <p class="mb-4">Dacă nu ai acte de identitate sau alte documente importante, următorii pași te pot ajuta:</p> |
| <div class="space-y-4"> |
| <div class="flex items-start"> |
| <div class="romanian-red-bg text-white font-bold rounded-full w-8 h-8 flex items-center justify-center mr-4 mt-1 flex-shrink-0">1</div> |
| <div><h4 class="font-bold">Carte de identitate</h4><p class="text-sm">Dacă nu ai CI, mergi la Direcția Generală de Evidență a Persoanelor (DGE) cu:</p><ul class="list-disc list-inside text-sm ml-4 mt-1"><li>Certificat de naștere</li><li>Dovadă că ai fost în sistemul de protecție (dacă e cazul)</li></ul></div> |
| </div> |
| <div class="flex items-start"> |
| <div class="romanian-red-bg text-white font-bold rounded-full w-8 h-8 flex items-center justify-center mr-4 mt-1 flex-shrink-0">2</div> |
| <div><h4 class="font-bold">Asistență DGASPC</h4><p class="text-sm">Contactează serviciile sociale locale pentru ajutor în obținerea actelor:</p><ul class="list-disc list-inside text-sm ml-4 mt-1"><li>Cerere scrisă pentru asistență în obținerea actelor</li><li>Orice documente pe care le ai (ex: copie veche de CI)</li></ul></div> |
| </div> |
| <div class="flex items-start"> |
| <div class="romanian-red-bg text-white font-bold rounded-full w-8 h-8 flex items-center justify-center mr-4 mt-1 flex-shrink-0">3</div> |
| <div><h4 class="font-bold">Casa Ioana</h4><p class="text-sm">Pentru femei în situații vulnerabile:</p><ul class="list-disc list-inside text-sm ml-4 mt-1"><li>Telefon: <a href="tel:0800500333" class="text-romanian-custom-blue hover:underline">0800 500 333</a></li><li>Pot ajuta cu orientare și sprijin în procesul de obținere a actelor</li></ul></div> |
| </div> |
| </div> |
| <div class="mt-6 p-4 warm-peach-bg rounded"><h4 class="font-bold mb-2 flex items-center"><i class="fas fa-lightbulb text-romanian-custom-blue mr-2"></i>Sfaturi utile:</h4><ul class="list-disc list-inside space-y-1"><li>Păstrează copii ale tuturor documentelor într-un loc sigur</li><li>Notează numerele de caz și persoanele de contact</li><li>Dacă primești refuzuri, cere explicații scrise</li></ul></div> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="last-resort" class="mb-16"> |
| <div class="bg-red-50 border-l-4 border-romanian-custom-red p-6 rounded"> <h2 class="text-2xl font-bold text-romanian-custom-red mb-4 flex items-center"> |
| <i class="fas fa-exclamation-triangle mr-3"></i> Ultima soluție - 🤔😮 WTF, Stupid AI! You call Kev and come live in Australia first! |
| </h2> |
| <p class="mb-4">Dacă nu reușești să rezolvi situația cu ajutorul pașilor de mai sus și riști să ajungi pe stradă:</p> |
| <div class="grid md:grid-cols-2 gap-6 mt-6"> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden"> |
| <div class="romanian-red-bg text-white px-6 py-4"><h3 class="font-bold text-xl flex items-center"><i class="fas fa-home mr-3"></i> Casa Ioana</h3></div> |
| <div class="p-6"> |
| <p class="mb-4">Adăpost pentru femei în situații de urgență:</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"><i class="fas fa-phone-alt text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Telefon de urgență:</strong> <a href="tel:0800500333" class="text-romanian-custom-blue hover:underline">0800 500 333</a></span></li> |
| <li class="flex items-start"><i class="fas fa-info-circle text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Servicii:</strong> Cazare temporară, consiliere, sprijin juridic</span></li> |
| </ul> |
| </div> |
| </div> |
| <div class="bg-white rounded-lg shadow-md overflow-hidden"> |
| <div class="romanian-red-bg text-white px-6 py-4"><h3 class="font-bold text-xl flex items-center"><i class="fas fa-utensils mr-3"></i> Banca de Alimente Sector 6</h3></div> |
| <div class="p-6"> |
| <p class="mb-4">Ajutor alimentar pentru persoane în dificultate:</p> |
| <ul class="space-y-3"> |
| <li class="flex items-start"><i class="fas fa-envelope text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Email:</strong> <a href="mailto:contact@foodbank6.ro" class="text-romanian-custom-blue hover:underline">contact@foodbank6.ro</a></span></li> |
| <li class="flex items-start"><i class="fas fa-map-marker-alt text-romanian-custom-blue mr-3 mt-1"></i><span><strong>Adresă:</strong> 236 Calea Giulești, Sector 6</span></li> |
| </ul> |
| </div> |
| </div> |
| </div> |
| <div class="mt-6 p-4 warm-peach-bg rounded"> |
| <h4 class="font-bold mb-2 flex items-center"><i class="fas fa-heart text-romanian-custom-red mr-2"></i>Nu renunța!</h4> |
| <p>În ciuda dificultăților, există soluții și oameni care te pot ajuta. Continuă să cauți ajutor și să apelezi la resursele disponibile.</p> |
| </div> |
| </div> |
| </div> |
| </section> |
| </main> |
|
|
| <div id="chatbotContainer" class="fixed bottom-0 right-0 mb-6 mr-6 w-96 max-w-full chatbot-container chatbot-hidden z-50"> |
| <div class="bg-white rounded-t-lg shadow-xl overflow-hidden"> |
| <div class="romanian-blue-bg text-white px-4 py-3 flex justify-between items-center"> |
| <h3 class="font-bold">Chat de ajutor</h3> |
| <button id="closeChatbot" class="text-white hover:text-yellow-300"> |
| <i class="fas fa-times"></i> |
| </button> |
| </div> |
| <div id="chatbotMessages" class="p-4 h-64 overflow-y-auto bg-gray-50"> |
| <div class="chatbot-message mb-4 flex justify-start items-start"> |
| <img src="https://i.ibb.co/9kkWq2HY/Didi3.jpg" alt="DiDi Avatar" class="w-10 h-10 rounded-full mr-3 object-cover self-start flex-shrink-0"> |
| <div class="warm-peach-bg rounded-lg p-3 max-w-xs"> |
| <p>Bună! Sunt DiDi și sunt aici să te ajut. Cu ce ai nevoie astăzi?</p> |
| </div> |
| </div> |
| </div> |
| <div class="p-4 border-t"> |
| <div class="flex"> |
| <input id="chatbotInput" type="text" placeholder="Scrie mesajul tău..." class="flex-1 border rounded-l-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-romanian-custom-blue"> |
| <button id="sendChatbotMessage" class="romanian-red-bg text-white px-4 py-2 rounded-r-lg hover:bg-red-700"> |
| <i class="fas fa-paper-plane"></i> |
| </button> |
| </div> |
| <div class="mt-2 flex flex-wrap gap-2"> |
| <button class="quick-chat-option bg-gray-200 hover:bg-gray-300 text-sm px-3 py-1 rounded-full">Ajutor legal</button> |
| <button class="quick-chat-option bg-gray-200 hover:bg-gray-300 text-sm px-3 py-1 rounded-full">Locuri de muncă</button> |
| <button class="quick-chat-option bg-gray-200 hover:bg-gray-300 text-sm px-3 py-1 rounded-full">Sprijin financiar</button> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| <footer class="romanian-blue-bg text-white py-8"> |
| <div class="container mx-auto px-4"> |
| <div class="flex flex-col md:flex-row justify-between"> |
| <div class="mb-6 md:mb-0"> |
| <h2 class="dear-didi text-4xl mb-2">Dear DiDi<span class="text-romanian-custom-yellow">💖</span></h2> |
| <p>Resurse și suport pentru tineri vulnerabili</p> |
| </div> |
| <div class="grid grid-cols-2 md:grid-cols-3 gap-8"> |
| <div> |
| <h3 class="font-bold mb-3 text-warm-orange">Link-uri utile</h3> |
| <ul class="space-y-2"> |
| <li><a href="https://www.anofm.ro" target="_blank" rel="noopener noreferrer" class="hover:underline">ANOFM</a></li> |
| <li><a href="https://www.ejobs.ro" target="_blank" rel="noopener noreferrer" class="hover:underline">eJobs</a></li> |
| <li><a href="https://helperz.ro" target="_blank" rel="noopener noreferrer" class="hover:underline">Helperz</a></li> |
| </ul> |
| </div> |
| <div> |
| <h3 class="font-bold mb-3 text-warm-orange">Contact Kev</h3> |
| <ul class="space-y-2"> |
| <li class="flex items-start"><i class="fas fa-envelope mr-2 mt-1"></i><span>kevinktg@outlook.com</span></li> |
| </ul> |
| </div> |
| <div> |
| <h3 class="font-bold mb-3 text-warm-orange">Urgență</h3> |
| <ul class="space-y-2"> |
| <li class="flex items-start"><i class="fas fa-phone-alt mr-2 mt-1"></i><span>112</span></li> |
| <li class="flex items-start"><i class="fas fa-phone-alt mr-2 mt-1"></i><span>0800 500 333</span></li> |
| </ul> |
| </div> |
| </div> |
| </div> |
| <div class="border-t border-blue-800 mt-8 pt-6 text-center text-sm"> |
| <p>© 2025 Dear DiDi. Toate drepturile rezervate.</p> |
| </div> |
| </div> |
| </footer> |
|
|
| <script> |
| document.addEventListener('DOMContentLoaded', () => { |
| |
| const chatbotToggle = document.getElementById('chatbotToggle'); |
| const closeChatbotBtn = document.getElementById('closeChatbot'); |
| const chatbotContainer = document.getElementById('chatbotContainer'); |
| const chatbotMessages = document.getElementById('chatbotMessages'); |
| const chatbotInput = document.getElementById('chatbotInput'); |
| const sendChatbotMessageBtn = document.getElementById('sendChatbotMessage'); |
| const quickChatOptions = document.querySelectorAll('.quick-chat-option'); |
| |
| function addMessage(text, isUser = false) { |
| const messageDiv = document.createElement('div'); |
| messageDiv.className = `chatbot-message mb-4 flex ${isUser ? 'justify-end' : 'justify-start items-start'}`; |
| |
| let messageContentHtml = ''; |
| if (isUser) { |
| messageContentHtml = ` |
| <div class="rounded-lg p-3 max-w-xs bg-romanian-blue-bg text-white ml-auto"> |
| <p>${text}</p> |
| </div>`; |
| } else { |
| messageContentHtml = ` |
| <img src="https://i.ibb.co/9kkWq2HY/Didi3.jpg" alt="DiDi Avatar" class="w-10 h-10 rounded-full mr-3 object-cover self-start flex-shrink-0"> |
| <div class="warm-peach-bg rounded-lg p-3 max-w-xs"> |
| ${text} |
| </div>`; |
| } |
| messageDiv.innerHTML = messageContentHtml; |
| chatbotMessages.appendChild(messageDiv); |
| chatbotMessages.scrollTop = chatbotMessages.scrollHeight; |
| } |
| |
| function closeChatbotAndScroll(targetId) { |
| if (chatbotContainer) { |
| chatbotContainer.classList.add('chatbot-hidden'); |
| } |
| const targetElement = document.querySelector(targetId); |
| if (targetElement) { |
| |
| setTimeout(() => { |
| targetElement.scrollIntoView({ behavior: 'smooth' }); |
| }, 50); |
| } |
| } |
| |
| function sendMessage() { |
| const messageText = chatbotInput.value.trim(); |
| if (!messageText) return; |
| |
| addMessage(messageText, true); |
| chatbotInput.value = ''; |
| |
| setTimeout(() => { |
| const lowerMessage = messageText.toLowerCase(); |
| let botResponse = `<p>Nu am înțeles exact. Poți reformula sau alege una dintre opțiunile rapide? Pentru probleme complexe, te rog să folosești datele de contact de pe site.</p>`; |
| |
| const responsesMap = { |
| "legal": "<p>Pentru ajutor legal, poți consulta secțiunea <a href='#legal' class='text-romanian-custom-red hover:underline'>Ajutor Legal</a>. Acolo găsești informații despre Baroul București și actele necesare.</p>", |
| "avocat": "<p>Pentru ajutor legal, poți consulta secțiunea <a href='#legal' class='text-romanian-custom-red hover:underline'>Ajutor Legal</a>. Acolo găsești informații despre Baroul București și actele necesare.</p>", |
| "drepturi": "<p>Pentru ajutor legal, poți consulta secțiunea <a href='#legal' class='text-romanian-custom-red hover:underline'>Ajutor Legal</a>. Acolo găsești informații despre Baroul București și actele necesare.</p>", |
| "bani": "<p>Pentru sprijin financiar, vezi secțiunea <a href='#financial' class='text-romanian-custom-red hover:underline'>Sprijin Financiar</a>. Găsești detalii despre DGASPC.</p>", |
| "financiar": "<p>Pentru sprijin financiar, vezi secțiunea <a href='#financial' class='text-romanian-custom-red hover:underline'>Sprijin Financiar</a>. Găsești detalii despre DGASPC.</p>", |
| "social": "<p>Pentru sprijin financiar, vezi secțiunea <a href='#financial' class='text-romanian-custom-red hover:underline'>Sprijin Financiar</a>. Găsești detalii despre DGASPC.</p>", |
| "muncă": "<p>Cauți un loc de muncă rapid? Mergi la secțiunea <a href='#jobs' class='text-romanian-custom-red hover:underline'>Caută muncă rapidă</a> pentru opțiuni de livrări sau curățenie.</p>", |
| "job": "<p>Cauți un loc de muncă rapid? Mergi la secțiunea <a href='#jobs' class='text-romanian-custom-red hover:underline'>Caută muncă rapidă</a> pentru opțiuni de livrări sau curățenie.</p>", |
| "angajare": "<p>Cauți un loc de muncă rapid? Mergi la secțiunea <a href='#jobs' class='text-romanian-custom-red hover:underline'>Caută muncă rapidă</a> pentru opțiuni de livrări sau curățenie.</p>", |
| "cursuri": "<p>Vrei să înveți o meserie nouă? Secțiunea <a href='#training' class='text-romanian-custom-red hover:underline'>Învăță o meserie nouă</a> are informații despre ANOFM și The Social Incubator.</p>", |
| "meserie": "<p>Vrei să înveți o meserie nouă? Secțiunea <a href='#training' class='text-romanian-custom-red hover:underline'>Învăță o meserie nouă</a> are informații despre ANOFM și The Social Incubator.</p>", |
| "training": "<p>Vrei să înveți o meserie nouă? Secțiunea <a href='#training' class='text-romanian-custom-red hover:underline'>Învăță o meserie nouă</a> are informații despre ANOFM și The Social Incubator.</p>", |
| "acte": "<p>Dacă ai nevoie de ajutor cu actele, consultă secțiunea <a href='#documents' class='text-romanian-custom-red hover:underline'>Asigură-ți actele</a>.</p>", |
| "documente": "<p>Dacă ai nevoie de ajutor cu actele, consultă secțiunea <a href='#documents' class='text-romanian-custom-red hover:underline'>Asigură-ți actele</a>.</p>", |
| "identitate": "<p>Dacă ai nevoie de ajutor cu actele, consultă secțiunea <a href='#documents' class='text-romanian-custom-red hover:underline'>Asigură-ți actele</a>.</p>", |
| "salut": "<p>Bună! Cum te pot ajuta astăzi? Poți întreba despre ajutor legal, sprijin financiar, locuri de muncă, cursuri sau acte.</p>", |
| "bună": "<p>Bună! Cum te pot ajuta astăzi? Poți întreba despre ajutor legal, sprijin financiar, locuri de muncă, cursuri sau acte.</p>", |
| "ajutor": "<p>Sigur! Despre ce anume ai nevoie de ajutor? Poți scrie 'legal', 'financiar', 'muncă', 'cursuri' sau 'acte'.</p>" |
| }; |
| |
| let foundResponse = false; |
| for (const keyword in responsesMap) { |
| if (lowerMessage.includes(keyword)) { |
| botResponse = responsesMap[keyword]; |
| foundResponse = true; |
| break; |
| } |
| } |
| addMessage(botResponse); |
| }, 1000); |
| } |
| |
| if (chatbotToggle) { |
| chatbotToggle.addEventListener('click', () => { |
| chatbotContainer.classList.remove('chatbot-hidden'); |
| }); |
| } |
| if (closeChatbotBtn) { |
| closeChatbotBtn.addEventListener('click', () => { |
| chatbotContainer.classList.add('chatbot-hidden'); |
| }); |
| } |
| if (sendChatbotMessageBtn) { |
| sendChatbotMessageBtn.addEventListener('click', sendMessage); |
| } |
| if (chatbotInput) { |
| chatbotInput.addEventListener('keypress', (e) => { |
| if (e.key === 'Enter') { |
| sendMessage(); |
| } |
| }); |
| } |
| quickChatOptions.forEach(option => { |
| option.addEventListener('click', () => { |
| const text = option.textContent; |
| if (chatbotInput) { |
| chatbotInput.value = text; |
| } |
| sendMessage(); |
| }); |
| }); |
| |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
| anchor.addEventListener('click', function (e) { |
| const href = this.getAttribute('href'); |
| if (!this.closest('#chatbotMessages')) { |
| e.preventDefault(); |
| const targetElement = document.querySelector(href); |
| if (targetElement) { |
| targetElement.scrollIntoView({ behavior: 'smooth' }); |
| } |
| } |
| }); |
| }); |
| |
| if (chatbotMessages) { |
| chatbotMessages.addEventListener('click', function(event) { |
| const targetLink = event.target.closest('a[href^="#"]'); |
| if (targetLink && chatbotMessages.contains(targetLink)) { |
| event.preventDefault(); |
| const targetId = targetLink.getAttribute('href'); |
| closeChatbotAndScroll(targetId); |
| } |
| }); |
| } |
| }); |
| </script> |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=kevinktg/deardidi" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
| </html> |
