<!DOCTYPE html><html class="scroll-smooth" lang="ro" style=""><head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>Programări Online | Dr. Mihail Cojocaru</title>
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet">
<script id="tailwind-config">
tailwind.config = {
darkMode: "class",
theme: {
extend: {
"colors": {
"primary": "#3f5f77",
"surface-warm": "#FAF9F7",
"on-tertiary-container": "#fafdff",
"secondary": "#4e616c",
"background": "#faf9f7",
"on-background": "#1a1c1b",
"on-secondary-fixed-variant": "#364954",
"on-primary-fixed": "#001e2f",
"secondary-fixed": "#d1e5f3",
"on-primary-container": "#fcfcff",
"inverse-surface": "#2f3130",
"secondary-fixed-dim": "#b5c9d7",
"error-container": "#ffdad6",
"tertiary-fixed": "#dce4e8",
"on-secondary-container": "#546773",
"inverse-on-surface": "#f1f1ef",
"surface-container-high": "#e9e8e6",
"surface-container-lowest": "#ffffff",
"primary-fixed": "#c9e6ff",
"on-tertiary": "#ffffff",
"on-error-container": "#93000a",
"tertiary-container": "#6e7679",
"on-surface": "#1a1c1b",
"surface-variant": "#e3e2e0",
"error": "#ba1a1a",
"outline-variant": "#c2c7cd",
"tertiary": "#555d61",
"accent-sage": "#B2C2B9",
"text-heading": "#2D3436",
"surface-container-highest": "#e3e2e0",
"primary-fixed-dim": "#aacbe6",
"outline": "#72787d",
"on-tertiary-fixed": "#151d20",
"surface": "#faf9f7",
"on-tertiary-fixed-variant": "#40484b",
"on-secondary-fixed": "#0a1e27",
"on-error": "#ffffff",
"text-body": "#5D6466",
"surface-container-low": "#f4f3f1",
"secondary-container": "#d1e5f3",
"primary-container": "#587890",
"inverse-primary": "#aacbe6",
"surface-bright": "#faf9f7",
"surface-dim": "#dadad8",
"on-surface-variant": "#42474c",
"on-primary": "#ffffff",
"on-primary-fixed-variant": "#294a61",
"on-secondary": "#ffffff",
"tertiary-fixed-dim": "#c0c8cc",
"surface-tint": "#426279",
"surface-container": "#efeeec"
},
"borderRadius": {
"DEFAULT": "0.25rem",
"lg": "0.5rem",
"xl": "0.75rem",
"full": "9999px"
},
"spacing": {
"margin-mobile": "20px",
"container-max": "1200px",
"section-gap-sm": "64px",
"unit": "8px",
"section-gap-lg": "120px",
"gutter": "24px"
},
"fontFamily": {
"headline-md": ["Playfair Display"],
"body-lg": ["Inter"],
"headline-sm": ["Playfair Display"],
"label-caps": ["Inter"],
"display-lg": ["Playfair Display"],
"body-md": ["Inter"],
"display-lg-mobile": ["Playfair Display"]
},
"fontSize": {
"headline-md": ["32px", {"lineHeight": "1.3", "fontWeight": "600"}],
"body-lg": ["18px", {"lineHeight": "1.6", "fontWeight": "400"}],
"headline-sm": ["24px", {"lineHeight": "1.4", "fontWeight": "600"}],
"label-caps": ["12px", {"lineHeight": "1.0", "letterSpacing": "0.08em", "fontWeight": "600"}],
"display-lg": ["48px", {"lineHeight": "1.1", "letterSpacing": "-0.02em", "fontWeight": "700"}],
"body-md": ["16px", {"lineHeight": "1.6", "fontWeight": "400"}],
"display-lg-mobile": ["36px", {"lineHeight": "1.2", "fontWeight": "700"}]
}
},
},
}
</script>
<style>
.material-symbols-outlined {
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
display: inline-block;
vertical-align: middle;
}
.step-active { color: #3f5f77; font-weight: 600; border-bottom: 2px solid #3f5f77; }
.step-inactive { color: #555d61; opacity: 0.6; }
.custom-shadow { box-shadow: 0px 20px 40px rgba(107, 139, 164, 0.08); }
.backdrop-blur-nav { backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
</style>
</head>
<body class="bg-background text-on-background font-body-md text-body-md overflow-x-hidden">
<header class="fixed top-0 w-full z-50 bg-surface-warm/80 backdrop-blur-nav shadow-[0px_20px_40px_rgba(107,139,164,0.08)]">
<nav class="flex justify-between items-center w-full px-gutter max-w-container-max mx-auto h-20">
<a class="font-headline-sm text-headline-sm text-text-heading tracking-tight" href="#">Dr. Mihail Cojocaru</a>
<div class="hidden md:flex items-center gap-8">
<a class="text-secondary hover:text-primary transition-colors font-body-md text-body-md" href="#">Home</a>
<a class="text-secondary hover:text-primary transition-colors font-body-md text-body-md" href="#">Despre Mine</a>
<a class="text-secondary hover:text-primary transition-colors font-body-md text-body-md" href="#">Servicii</a>
<a class="text-secondary hover:text-primary transition-colors font-body-md text-body-md" href="#">Prețuri</a>
<a class="text-secondary hover:text-primary transition-colors font-body-md text-body-md" href="#">Contact</a>
</div>
<div class="flex items-center gap-4">
<button class="bg-primary text-on-primary px-6 py-2.5 rounded-full font-body-md text-body-md hover:opacity-90 transition-all active:scale-95">
Book Appointment
</button>
</div>
</nav>
</header>
<main class="pt-32 pb-24 px-4 sm:px-gutter max-w-container-max mx-auto">
<div class="flex flex-col lg:grid lg:grid-cols-12 gap-gutter">
<section class="lg:col-span-8">
<div class="mb-12">
<h1 class="font-display-lg text-display-lg-mobile md:text-display-lg text-text-heading mb-4">Programări Online</h1>
<p class="text-text-body font-body-lg text-body-lg max-w-2xl">Planificați vizita dumneavoastră rapid și sigur. Vă rugăm să urmați pașii de mai jos pentru a selecta serviciul și intervalul orar dorit.</p>
</div>
<div class="bg-surface-container-lowest rounded-xl p-6 md:p-10 custom-shadow border border-surface-container-high relative overflow-hidden">
<div class="flex border-b border-surface-container-high mb-10 overflow-x-auto whitespace-nowrap scrollbar-hide">
<button class="step-active pb-4 px-4 flex items-center gap-2 transition-all" id="step-btn-1" onclick="switchStep(1)">
<span class="w-6 h-6 rounded-full bg-primary/20 flex items-center justify-center text-xs text-primary font-bold">1</span>
Servicii
</button>
<button class="step-inactive pb-4 px-4 flex items-center gap-2 transition-all border-b-2 border-transparent" id="step-btn-2" onclick="switchStep(2)">
<span class="w-6 h-6 rounded-full bg-secondary/10 flex items-center justify-center text-xs">2</span>
Specialist
</button>
<button class="step-inactive pb-4 px-4 flex items-center gap-2 transition-all border-b-2 border-transparent" id="step-btn-3" onclick="switchStep(3)">
<span class="w-6 h-6 rounded-full bg-secondary/10 flex items-center justify-center text-xs">3</span>
Dată & Oră
</button>
<button class="step-inactive pb-4 px-4 flex items-center gap-2 transition-all border-b-2 border-transparent" id="step-btn-4" onclick="switchStep(4)">
<span class="w-6 h-6 rounded-full bg-secondary/10 flex items-center justify-center text-xs">4</span>
Pacient
</button>
</div>
<div class="step-content space-y-6" id="step-1">
<h3 class="font-headline-sm text-headline-sm text-text-heading mb-6">Alegeți categoria de servicii</h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<label class="relative group cursor-pointer">
<input class="peer hidden" name="service" type="radio" value="estetica">
<div class="p-6 rounded-xl border border-surface-container-high bg-surface-warm transition-all peer-checked:border-primary peer-checked:bg-primary/5 hover:border-accent-sage">
<span class="material-symbols-outlined text-primary mb-3">face_6</span>
<h4 class="font-headline-sm text-headline-sm text-text-heading">Chirurgie Estetică</h4>
<p class="text-sm text-text-body mt-2">Proceduri premium de întinerire și remodelare facială sau corporală.</p>
</div>
</label>
<label class="relative group cursor-pointer">
<input class="peer hidden" name="service" type="radio" value="ginecologie">
<div class="p-6 rounded-xl border border-surface-container-high bg-surface-warm transition-all peer-checked:border-primary peer-checked:bg-primary/5 hover:border-accent-sage">
<span class="material-symbols-outlined text-primary mb-3">female</span>
<h4 class="font-headline-sm text-headline-sm text-text-heading">Ginecologie</h4>
<p class="text-sm text-text-body mt-2">Consultații specializate și servicii de sănătate pentru femei.</p>
</div>
</label>
</div>
</div>
<div class="step-content hidden space-y-6" id="step-2">
<h3 class="font-headline-sm text-headline-sm text-text-heading mb-6">Selectați Specialistul</h3>
<div class="p-4 rounded-xl border-2 border-primary bg-primary/5 flex items-center gap-4">
<div class="w-16 h-16 rounded-full bg-primary/20 flex items-center justify-center">
<span class="material-symbols-outlined text-primary text-3xl">medical_services</span>
</div>
<div>
<h4 class="font-headline-sm text-headline-sm text-text-heading">Dr. Mihail Cojocaru</h4>
<p class="text-sm text-text-body">Medic Primar Chirurgie Plastică & Estetică</p>
</div>
<div class="ml-auto">
<span class="material-symbols-outlined text-primary" style="font-variation-settings: 'FILL' 1;">check_circle</span>
</div>
</div>
</div>
<div class="step-content hidden space-y-8" id="step-3">
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<h3 class="font-headline-sm text-headline-sm text-text-heading mb-4">Selectați Data</h3>
<div class="bg-surface-container-low p-4 rounded-xl">
<div class="flex justify-between items-center mb-4">
<span class="font-semibold text-text-heading">Iunie 2024</span>
<div class="flex gap-2">
<button class="p-1 hover:text-primary transition-colors"><span class="material-symbols-outlined">chevron_left</span></button>
<button class="p-1 hover:text-primary transition-colors"><span class="material-symbols-outlined">chevron_right</span></button>
</div>
</div>
<div class="grid grid-cols-7 gap-2 text-center text-xs text-secondary mb-2">
<span class="">L</span><span class="">M</span><span class="">M</span><span class="">J</span><span class="">V</span><span class="">S</span><span class="">D</span>
</div>
<div class="grid grid-cols-7 gap-1">
<div class="h-10 flex items-center justify-center opacity-20">27</div>
<div class="h-10 flex items-center justify-center opacity-20">28</div>
<div class="h-10 flex items-center justify-center opacity-20">29</div>
<div class="h-10 flex items-center justify-center opacity-20">30</div>
<div class="h-10 flex items-center justify-center opacity-20">31</div>
<button class="h-10 rounded-lg hover:bg-primary/10 transition-colors flex items-center justify-center">1</button>
<button class="h-10 rounded-lg hover:bg-primary/10 transition-colors flex items-center justify-center">2</button>
<button class="h-10 rounded-lg bg-primary text-white flex items-center justify-center font-bold">3</button>
<button class="h-10 rounded-lg hover:bg-primary/10 transition-colors flex items-center justify-center">4</button>
<button class="h-10 rounded-lg hover:bg-primary/10 transition-colors flex items-center justify-center">5</button>
<button class="h-10 rounded-lg hover:bg-primary/10 transition-colors flex items-center justify-center">6</button>
<button class="h-10 rounded-lg hover:bg-primary/10 transition-colors flex items-center justify-center">7</button>
<button class="h-10 rounded-lg hover:bg-primary/10 transition-colors flex items-center justify-center">8</button>
<button class="h-10 rounded-lg hover:bg-primary/10 transition-colors flex items-center justify-center">9</button>
</div>
</div>
</div>
<div>
<h3 class="font-headline-sm text-headline-sm text-text-heading mb-4">Interval Orar</h3>
<div class="grid grid-cols-3 gap-2"><button class="py-3 px-2 border border-surface-container-high rounded-lg text-sm hover:border-primary transition-all">10:00</button><button class="py-3 px-2 border border-surface-container-high rounded-lg text-sm hover:border-primary transition-all">11:30</button><button class="py-3 px-2 border border-surface-container-high rounded-lg text-sm hover:border-primary transition-all">13:00</button><button class="py-3 px-2 border border-primary bg-primary/5 text-primary rounded-lg text-sm font-semibold">15:00</button><button class="py-3 px-2 border border-surface-container-high rounded-lg text-sm hover:border-primary transition-all">16:30</button><button class="py-3 px-2 border border-surface-container-high rounded-lg text-sm hover:border-primary transition-all">18:00</button></div><p class="text-[10px] text-text-body mt-4 italic">* Intervalele afișate sunt condiționate de specialitatea aleasă (Ginecologie: 10-18 | Estetică: 15-19 | Sâmbătă: 09-13).</p>
</div>
</div>
</div>
<div class="step-content hidden space-y-6" id="step-4">
<h3 class="font-headline-sm text-headline-sm text-text-heading mb-6">Informații Pacient</h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="space-y-1">
<label class="text-xs font-semibold text-secondary uppercase tracking-wider">Nume *</label>
<input class="w-full h-12 bg-tertiary/10 border-none rounded-lg px-4 focus:ring-2 focus:ring-primary/20 focus:bg-surface-container-low transition-all" placeholder="Popescu" type="text">
</div>
<div class="space-y-1">
<label class="text-xs font-semibold text-secondary uppercase tracking-wider">Prenume *</label>
<input class="w-full h-12 bg-tertiary/10 border-none rounded-lg px-4 focus:ring-2 focus:ring-primary/20 focus:bg-surface-container-low transition-all" placeholder="Ion" type="text">
</div>
<div class="space-y-1">
<label class="text-xs font-semibold text-secondary uppercase tracking-wider">Telefon *</label>
<input class="w-full h-12 bg-tertiary/10 border-none rounded-lg px-4 focus:ring-2 focus:ring-primary/20 focus:bg-surface-container-low transition-all" placeholder="07xx xxx xxx" type="tel">
</div>
<div class="space-y-1">
<label class="text-xs font-semibold text-secondary uppercase tracking-wider">Email *</label>
<input class="w-full h-12 bg-tertiary/10 border-none rounded-lg px-4 focus:ring-2 focus:ring-primary/20 focus:bg-surface-container-low transition-all" placeholder="ion.popescu@exemplu.ro" type="email">
</div>
<div class="space-y-1 md:col-span-2">
<label class="text-xs font-semibold text-secondary uppercase tracking-wider">CNP *</label>
<input class="w-full h-12 bg-tertiary/10 border-none rounded-lg px-4 focus:ring-2 focus:ring-primary/20 focus:bg-surface-container-low transition-all" placeholder="185xxxxxxxxxx" type="text">
</div>
<div class="space-y-1 md:col-span-2">
<label class="text-xs font-semibold text-secondary uppercase tracking-wider">Observații</label>
<textarea class="w-full bg-tertiary/10 border-none rounded-lg px-4 py-3 focus:ring-2 focus:ring-primary/20 focus:bg-surface-container-low transition-all" placeholder="Detalii suplimentare..." rows="3"></textarea>
</div>
</div>
<div class="flex items-start gap-3 pt-4">
<input class="mt-1 rounded text-primary focus:ring-primary" id="terms" type="checkbox">
<label class="text-sm text-text-body" for="terms">Sunt de acord cu prelucrarea datelor cu caracter personal în scopul programării medicale.</label>
</div>
</div>
<div class="mt-12 flex justify-between items-center pt-8 border-t border-surface-container-high">
<button class="hidden text-secondary hover:text-primary transition-colors flex items-center gap-2" id="prev-btn" onclick="prevStep()" style="display: none;">
<span class="material-symbols-outlined">arrow_back</span> Înapoi
</button>
<div class="flex-grow"></div>
<button class="bg-primary text-on-primary px-10 py-3 rounded-full font-bold hover:bg-opacity-90 transition-all flex items-center gap-2" id="next-btn" onclick="nextStep()" style="display: flex;">
Pasul următor <span class="material-symbols-outlined">arrow_forward</span>
</button>
<button class="hidden bg-primary text-on-primary px-10 py-3 rounded-full font-bold hover:bg-opacity-90 transition-all" id="submit-btn" style="display: none;">
Confirmă Programarea
</button>
</div>
</div>
</section>
<aside class="lg:col-span-4 space-y-gutter">
<div class="bg-surface-warm p-8 rounded-xl border border-surface-container-high custom-shadow">
<h3 class="font-headline-sm text-headline-sm text-text-heading mb-6 flex items-center gap-2">
<span class="material-symbols-outlined text-primary">info</span>
Instrucțiuni
</h3>
<ul class="space-y-6">
<li class="flex gap-4">
<span class="w-6 h-6 rounded-full bg-accent-sage/20 text-accent-sage flex items-center justify-center flex-shrink-0">
<span class="material-symbols-outlined text-sm" style="font-variation-settings: 'wght' 700;">check</span>
</span>
<p class="text-sm text-text-body">Vă rugăm să selectați categoria corectă. Orar: Ginecologie (10:00 - 18:00), Chirurgie Estetică (15:00 - 19:00), Sâmbătă (09:00 - 13:00).</p>
</li>
<li class="flex gap-4">
<span class="w-6 h-6 rounded-full bg-accent-sage/20 text-accent-sage flex items-center justify-center flex-shrink-0">
<span class="material-symbols-outlined text-sm" style="font-variation-settings: 'wght' 700;">check</span>
</span>
<p class="text-sm text-text-body">Toate câmpurile marcate cu asterisc (*) sunt obligatorii pentru validarea programării în sistemul ESTET GYN.</p>
</li>
<li class="flex gap-4">
<span class="w-6 h-6 rounded-full bg-accent-sage/20 text-accent-sage flex items-center justify-center flex-shrink-0">
<span class="material-symbols-outlined text-sm" style="font-variation-settings: 'wght' 700;">check</span>
</span>
<p class="text-sm text-text-body">După confirmare, veți primi un e-mail cu detaliile vizitei dumneavoastră.</p>
</li>
</ul>
<div class="mt-8 p-4 bg-primary-fixed/30 rounded-lg border border-primary-fixed-dim">
<p class="text-sm font-medium text-on-primary-fixed-variant leading-relaxed">Aveți nevoie de ajutor? Contactați-ne prin telefon sau WhatsApp: <br class="">
<span class="text-primary font-bold text-lg">+40 728 724 999</span></p>
</div>
</div>
<div class="relative rounded-xl overflow-hidden aspect-[4/3] custom-shadow">
<img alt="Interior Clinică" class="w-full h-full object-cover" data-alt="A serene, high-end medical clinic interior with soft, warm lighting. The decor features minimalist aesthetic with cream-colored walls, soft fabric textures, and elegant curved wooden accents. A large window lets in soft daylight, highlighting a clean, professional medical consultation room. The atmosphere is calming, luxurious, and pristine, reflecting the Boutique Medical identity." src="https://lh3.googleusercontent.com/aida-public/AB6AXuAc8efIDwRtyNIn0dL6Ey77xGtAJccVYwpQGkzSln4qzVVj6jAqtKxeb1fDjpbVn73CFSQZNRoBNerQve2ypz-Qenm9gx660-6VNgWG581yJT0VrUoQe5m6Kjtisn2TM-ky8vwHhaQhy_SFWwQzAdFhYlcl2dKfIyhVCdO5eDC6fUSOaCvICClRMcEwjIR8oiExIPQC-2IcXuETlfYUpI4e9TR__yMZHcR-JCHmddaDrHohelyCcDY9HEf00fu7wqr3_yBdEvktHnw">
<div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent flex items-end p-6">
<p class="text-white text-sm italic">„Siguranța și confortul dumneavoastră sunt prioritățile noastre absolute.”</p>
</div>
</div>
</aside>
</div>
</main>
<footer class="bg-surface-container dark:bg-surface-container-highest w-full py-section-gap-sm">
<div class="grid grid-cols-1 md:grid-cols-3 gap-gutter max-w-container-max mx-auto px-gutter">
<div class="space-y-4">
<h2 class="font-headline-sm text-headline-sm text-text-heading dark:text-on-surface">Dr. Mihail Cojocaru</h2>
<p class="text-on-surface-variant dark:text-on-secondary-container max-w-xs">Clinică de Chirurgie Plastică și Estetică dedicată excelenței și îngrijirii personalizate.</p>
</div>
<div class="space-y-4">
<h4 class="font-semibold text-text-heading uppercase text-xs tracking-widest">Link-uri Utile</h4>
<div class="grid grid-cols-1 gap-2">
<a class="text-on-surface-variant hover:text-primary transition-colors" href="#">Politica de Confidențialitate</a>
<a class="text-on-surface-variant hover:text-primary transition-colors" href="#">Termeni și Condiții</a>
<a class="text-on-surface-variant hover:text-primary transition-colors" href="#">Drepturile Pacientului</a>
<a class="text-on-surface-variant hover:text-primary transition-colors" href="#">Setări Cookie</a>
</div>
</div>
<div class="space-y-4">
<h4 class="font-semibold text-text-heading uppercase text-xs tracking-widest">Contact Clinică</h4>
<p class="text-on-surface-variant">Str. Gloria nr.7/A, Giroc,jud:Timiş,Romania, 300720</p>
<p class="text-on-surface-variant">Email: estetgyn@gmail.com</p><p class="text-on-surface-variant">WhatsApp: +40 728 724 999</p>
<div class="flex gap-4">
<span class="material-symbols-outlined text-secondary hover:text-primary transition-all cursor-pointer">social_leaderboard</span>
<span class="material-symbols-outlined text-secondary hover:text-primary transition-all cursor-pointer">retweet</span>
</div>
</div>
</div>
<div class="mt-12 pt-8 border-t border-surface-container-high max-w-container-max mx-auto px-gutter text-center text-sm text-on-surface-variant">
© 2026Dr. Mihail Cojocaru. All rights reserved. Plastic & Aesthetic Surgery Clinic ESTET & GYN.
</div>
</footer>
<script>
let currentStep = 1;
function updateStepUI() {
document.querySelectorAll('.step-content').forEach(c => c.classList.add('hidden'));
document.getElementById(`step-${currentStep}`).classList.remove('hidden');
for (let i = 1; i <= 4; i++) {
const btn = document.getElementById(`step-btn-${i}`);
if (i === currentStep) {
btn.className = "step-active pb-4 px-4 flex items-center gap-2 transition-all";
btn.querySelector('span').className = "w-6 h-6 rounded-full bg-primary/20 flex items-center justify-center text-xs text-primary font-bold";
} else if (i < currentStep) {
btn.className = "text-accent-sage pb-4 px-4 flex items-center gap-2 transition-all border-b-2 border-accent-sage";
btn.querySelector('span').innerHTML = '<span class="material-symbols-outlined text-xs">check</span>';
btn.querySelector('span').className = "w-6 h-6 rounded-full bg-accent-sage/10 flex items-center justify-center text-xs";
} else {
btn.className = "step-inactive pb-4 px-4 flex items-center gap-2 transition-all border-b-2 border-transparent";
btn.querySelector('span').innerText = i;
btn.querySelector('span').className = "w-6 h-6 rounded-full bg-secondary/10 flex items-center justify-center text-xs";
}
}
const nextBtn = document.getElementById('next-btn');
const prevBtn = document.getElementById('prev-btn');
const submitBtn = document.getElementById('submit-btn');
prevBtn.style.display = currentStep === 1 ? 'none' : 'flex';
if (currentStep === 4) {
nextBtn.style.display = 'none';
submitBtn.style.display = 'flex';
} else {
nextBtn.style.display = 'flex';
submitBtn.style.display = 'none';
}
}
function nextStep() {
if (currentStep < 4) {
currentStep++;
updateStepUI();
window.scrollTo({ top: 0, behavior: 'smooth' });
}
}
function prevStep() {
if (currentStep > 1) {
currentStep--;
updateStepUI();
}
}
function switchStep(step) {
if (step < currentStep) {
currentStep = step;
updateStepUI();
}
}
updateStepUI();
</script>
<a href="https://wa.me/40728724999" target="_blank" class="fixed bottom-8 right-8 z-[60] bg-primary text-on-primary w-14 h-14 rounded-full flex items-center justify-center shadow-lg hover:scale-110 transition-transform active:scale-95 group" title="Contact via WhatsApp">
<span class="material-symbols-outlined text-3xl">chat</span>
<span class="absolute right-full mr-3 bg-white text-primary px-3 py-1 rounded-lg text-sm font-medium shadow-sm opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap pointer-events-none border border-surface-container-high">WhatsApp</span>
</a></body></html>
0749276189
dr.mihail.cojocaru@gmail.com
