import PageHeader from « @/components/common/PageHeader »;
import ContactForm from « @/components/common/ContactForm »;
import { Mail, Phone, MapPin, Clock } from « lucide-react »;
const Contattaci = () => {
return (
<section className="section-padding">
<div className="container mx-auto px-4">
<div className="grid grid-cols-1 lg:grid-cols-2 gap-10">
{/* Contact Info */}
<div>
<h2 className="text-3xl font-bold mb-6 font-playfair">Come Raggiungerci</h2>
<div className="space-y-6 mb-8">
<div className="flex items-start">
<div className="bg-tunisia-blue p-3 rounded-full mr-4">
<MapPin className="text-gray-700" />
</div>
<div>
<h3 className="text-xl font-bold mb-1">Indirizzo</h3>
<p>Via Roma 123, 20123 Milano, Italia</p>
</div>
</div>
<div className="flex items-start">
<div className="bg-tunisia-blue p-3 rounded-full mr-4">
<Phone className="text-gray-700" />
</div>
<div>
<h3 className="text-xl font-bold mb-1">Telefono</h3>
<p>+39 02 1234567</p>
<p>+39 333 9876543 (WhatsApp disponibile)</p>
</div>
</div>
<div className="flex items-start">
<div className="bg-tunisia-blue p-3 rounded-full mr-4">
<Mail className="text-gray-700" />
</div>
<div>
<h3 className="text-xl font-bold mb-1">Email</h3>
<p>info@dolcevitatunisia.com</p>
<p>prenotazioni@dolcevitatunisia.com</p>
</div>
</div>
<div className="flex items-start">
<div className="bg-tunisia-blue p-3 rounded-full mr-4">
<Clock className="text-gray-700" />
</div>
<div>
<h3 className="text-xl font-bold mb-1">Orari</h3>
<p>Lunedì - Venerdì: 9:00 - 18:00</p>
<p>Sabato: 9:00 - 12:00</p>
<p>Domenica: Chiuso</p>
</div>
</div>
</div>
<h3 className="text-2xl font-bold mb-4 font-playfair">Seguici sui Social</h3>
<div className="flex space-x-4">
<a
href="https://facebook.com"
target="_blank"
rel="noopener noreferrer"
className="bg-tunisia-sand hover:bg-tunisia-terracotta hover:text-white transition-colors duration-300 p-3 rounded-full"
aria-label="Facebook"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path>
</svg>
</a>
<a
href="https://instagram.com"
target="_blank"
rel="noopener noreferrer"
className="bg-tunisia-sand hover:bg-tunisia-terracotta hover:text-white transition-colors duration-300 p-3 rounded-full"
aria-label="Instagram"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect>
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path>
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5"></line>
</svg>
</a>
<a
href="https://youtube.com"
target="_blank"
rel="noopener noreferrer"
className="bg-tunisia-sand hover:bg-tunisia-terracotta hover:text-white transition-colors duration-300 p-3 rounded-full"
aria-label="YouTube"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<path d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z"></path>
<polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"></polygon>
</svg>
</a>
<a
href="https://whatsapp.com"
target="_blank"
rel="noopener noreferrer"
className="bg-tunisia-sand hover:bg-tunisia-terracotta hover:text-white transition-colors duration-300 p-3 rounded-full"
aria-label="WhatsApp"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"></path>
</svg>
</a>
</div>
</div>
{/* Contact Form */}
<div>
<ContactForm />
</div>
</div>
</div>
</section>
{/* Map Section */}
<section className="pb-16">
<div className="container mx-auto px-4">
<h2 className="text-3xl font-bold mb-6 font-playfair text-center">La Nostra Posizione</h2>
<div className="rounded-lg overflow-hidden shadow-lg h-[400px]">
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2798.1744204448815!2d9.181869115534489!3d45.46366677910085!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4786c1493a4492ff%3A0x499ffd746fb73636!2sVia%20Roma%2C%20Milano%20MI!5e0!3m2!1sit!2sit!4v1619775477663!5m2!1sit!2sit"
width="100%"
height="100%"
style={{ border: 0 }}
allowFullScreen={true}
loading="lazy"
title="Mappa della nostra sede"
></iframe>
</div>
</div>
</section>
{/* FAQ Section */}
<section className="py-16 bg-tunisia-sand">
<div className="container mx-auto px-4">
<h2 className="text-3xl font-bold mb-10 font-playfair text-center">Domande Frequenti</h2>
<div className="max-w-3xl mx-auto space-y-6">
<div className="bg-white p-6 rounded-lg shadow-md">
<h3 className="text-xl font-bold mb-2">Come posso prenotare una vacanza?</h3>
<p>
Puoi prenotare la tua vacanza compilando il nostro modulo di contatto, chiamandoci al numero indicato
o inviando un'email a prenotazioni@dolcevitatunisia.com. Un nostro consulente ti contatterà entro 24 ore.
</p>
</div>
<div className="bg-white p-6 rounded-lg shadow-md">
<h3 className="text-xl font-bold mb-2">Quali documenti servono per viaggiare in Tunisia?</h3>
<p>
Per i cittadini italiani è sufficiente la carta d'identità valida per l'espatrio con validità residua
di almeno 3 mesi. È comunque consigliato viaggiare con il passaporto, soprattutto se si prevede di
effettuare escursioni in altri paesi nordafricani.
</p>
</div>
<div className="bg-white p-6 rounded-lg shadow-md">
<h3 className="text-xl font-bold mb-2">È necessaria un'assicurazione di viaggio?</h3>
<p>
Consigliamo vivamente di sottoscrivere un'assicurazione di viaggio che copra spese mediche,
smarrimento bagaglio e annullamento. Possiamo offrire diverse opzioni assicurative da valutare
in fase di prenotazione.
</p>
</div>
<div className="bg-white p-6 rounded-lg shadow-md">
<h3 className="text-xl font-bold mb-2">In quale periodo è consigliabile visitare la Tunisia?</h3>
<p>
La Tunisia è una destinazione ideale da visitare tutto l'anno. La primavera (aprile-giugno) e
l'autunno (settembre-novembre) offrono temperature miti perfette per visite culturali ed escursioni.
L'estate è ideale per chi cerca sole e mare, mentre l'inverno è particolarmente apprezzato da chi
desidera fuggire dal freddo italiano, con temperature che raramente scendono sotto i 15°C nelle zone costiere.
</p>
</div>
<div className="bg-white p-6 rounded-lg shadow-md">
<h3 className="text-xl font-bold mb-2">Le strutture sono adatte a persone con mobilità ridotta?</h3>
<p>
Molte delle nostre strutture selezionate sono attrezzate per ospiti con mobilità ridotta, con camere
accessibili e servizi dedicati. Ti invitiamo a specificare le tue esigenze in fase di prenotazione,
così da poterti consigliare la sistemazione più adatta.
</p>
</div>
</div>
</div>
</section>
{/* Newsletter Section */}
<section className="py-16 bg-tunisia-terracotta text-white">
<div className="container mx-auto px-4 text-center">
<h2 className="text-3xl font-bold mb-4 font-playfair">Resta Aggiornato</h2>
<p className="text-xl max-w-3xl mx-auto mb-8">
Iscriviti alla nostra newsletter per ricevere offerte esclusive, consigli di viaggio e novità sulla Tunisia.
</p>
<form className="max-w-md mx-auto">
<div className="flex flex-col md:flex-row gap-3">
<input
type="email"
placeholder="Inserisci la tua email"
className="flex-grow px-4 py-3 rounded-md text-gray-800 focus:outline-none"
required
/>
<button
type="submit"
className="bg-white text-tunisia-terracotta font-bold py-3 px-6 rounded-md hover:bg-gray-100 transition-colors"
>
Iscriviti
</button>
</div>
</form>
</div>
</section>
</div>);
};
export default Contattaci;