<!doctype html>
<html lang="lt">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Florial gėlės Vilniuje didmenos kainomis</title>

    <!-- Bootstrap 5 CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- Bootstrap Icons (social ikonoms) -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css">

    <style>
        :root {
            --primary-color: #2F492F;   /* logotipas */
            --accent-color: #FF6840;
            --secondary-color: #F7EAD2;
            --dark-color: #303030;
        }

        body {
            font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            scroll-behavior: smooth;
            background-color: #fffdf8;
        }

        /* Navbar */
        .navbar {
            background: rgba(247, 234, 210, 0.96);
            box-shadow: 0 2px 10px rgba(0,0,0,0.03);
            backdrop-filter: blur(8px);
        }

        .navbar-brand {
            color: var(--primary-color);
        }

        .navbar-brand span {
            color: var(--accent-color);
            font-weight: 700;
        }

        .nav-link {
            color: #444;
        }

        .nav-link:hover,
        .nav-link:focus {
            color: var(--primary-color);
        }

        /* Hero */
        .hero {
            min-height: 100vh;
            display: flex;
            align-items: center;
            background:
                linear-gradient(120deg, rgba(47,73,47,0.75), rgba(247,234,210,0.85)),
                url("https://images.pexels.com/photos/931162/pexels-photo-931162.jpeg?auto=compress&cs=tinysrgb&w=1600") center/cover no-repeat;
            position: relative;
            color: #fff;
        }

        .hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, rgba(0,0,0,0.25), rgba(0,0,0,0.15));
        }

        .hero-content {
            position: relative;
            z-index: 1;
        }

        .badge-soft {
            background: rgba(247, 234, 210, 0.9);
            color: var(--primary-color);
            border-radius: 999px;
            padding: 0.4rem 0.9rem;
            font-size: 0.8rem;
            text-transform: uppercase;
            letter-spacing: .08em;
        }

        .hero h1 {
            color: #fff;
        }

        .hero p.lead {
            color: #f7ead2;
        }

        /* Buttons */
        .btn-primary {
            background-color: var(--accent-color);
            border-color: var(--accent-color);
            color: #fff;
        }

        .btn-primary:hover {
            background-color: #e05936;
            border-color: #e05936;
        }

        .btn.disabled, .btn:disabled, fieldset:disabled .btn {
            color: var(--bs-btn-disabled-color);
            pointer-events: none;
            background-color: #e05936;
            border-color: #e05936;
            opacity: var(--bs-btn-disabled-opacity);
        }

        .btn-outline-primary {
            border-color: #f7ead2;
            color: #f7ead2;
        }

        .btn-outline-primary:hover {
            background-color: #f7ead2;
            border-color: #f7ead2;
            color: var(--primary-color);
        }

        /* Section titles */
        .section-title {
            text-align: center;
            margin-bottom: 3rem;
        }

        .section-title h2 {
            font-weight: 700;
            color: var(--primary-color);
        }

        .section-title p {
            max-width: 520px;
            margin: 0.5rem auto 0;
            color: #666;
        }

        /* Cards */
        .service-card,
        .testimonial-card {
            border: none;
            border-radius: 1.25rem;
            box-shadow: 0 12px 30px rgba(0,0,0,0.05);
            transition: transform 0.2s ease, box-shadow 0.2s ease;
            background-color: #fffdf8;
        }

        .service-card:hover,
        .testimonial-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 18px 40px rgba(0,0,0,0.08);
        }

        .icon-circle {
            width: 56px;
            height: 56px;
            border-radius: 999px;
            background: var(--secondary-color);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            color: var(--primary-color);
        }

        /* Gallery */
        .gallery-img {
            border-radius: 1.2rem;
            width: 100%;
            height: 300px;
            object-fit: cover;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            box-shadow: 0 12px 30px rgba(0,0,0,0.08);
        }

        .gallery-img:hover {
            transform: translateY(-8px);
            box-shadow: 0 18px 40px rgba(0,0,0,0.12);
        }

        /* Pricing slider */
        .pricing-section {
            background-color: #fff7eb;
        }

        .price-tag {
            font-weight: 700;
            color: var(--accent-color);
        }

        .pricing-card {
            border-radius: 1.2rem;
            overflow: hidden;
            border: none;
            box-shadow: 0 10px 28px rgba(0,0,0,0.06);
            background-color: #fffdf8;
        }

        .pricing-card img {
            height: 220px;
            object-fit: cover;
        }

        .carousel-control-prev-icon,
        .carousel-control-next-icon {
            filter: invert(1);
        }

        /* Contact */
        .contact-section {
            background: #f7ead2;
        }

        .contact-card {
            border-radius: 1.5rem;
            border: none;
            box-shadow: 0 12px 40px rgba(0,0,0,0.07);
            background-color: #fffdf8;
        }

        .contact-box {
            background-color: #fffdf8;
        }

        .social-links a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 38px;
            height: 38px;
            border-radius: 999px;
            border: 1px solid rgba(0,0,0,0.08);
            margin-right: 0.5rem;
            font-size: 1.2rem;
            color: var(--primary-color);
            background-color: #fff;
            transition: background 0.2s ease, transform 0.2s ease, color 0.2s ease;
        }

        .social-links a:hover {
            transform: translateY(-2px);
            background-color: var(--accent-color);
            color: #fff;
        }

        /* Footer */
        footer {
            background: #111;
            color: #eee;
        }

        footer a {
            color: #f7ead2;
            text-decoration: none;
        }

        footer a:hover {
            text-decoration: underline;
        }
        .alert-orange {
            background-color: #FF6840;
            color: #fff;
        }
    </style>
</head>
<body>
@if(session()->has('success'))
<div class="position-fixed bottom-0 start-0 w-100 z-3">
    <div class="alert alert-orange text-center mb-0 rounded-0">
        {{ session()->get('success') }}
    </div>
</div>
@endif
<!-- NAVBAR -->
<nav class="navbar navbar-expand-lg sticky-top">
    <div class="container">
        <a class="navbar-brand fw-bold" href="#">
            <img src="{{ theme()->publicPath('images/logo.png') }}" style="width: 200px;" alt="Logo">
        </a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainNavbar">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="mainNavbar">
            <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
                <li class="nav-item"><a class="nav-link" href="#about">Apie mus</a></li>
                <li class="nav-item"><a class="nav-link" href="#services">Paslaugos</a></li>
                <li class="nav-item"><a class="nav-link" href="#pricing">Kainoraštis</a></li>
                <li class="nav-item"><a class="nav-link" href="#gallery">Galerija</a></li>
                <li class="nav-item"><a class="nav-link" href="#testimonials">Atsiliepimai</a></li>
                <li class="nav-item"><a class="nav-link" href="#contact">Kontaktai</a></li>
            </ul>
            <a href="#contact" class="btn btn-primary ms-lg-3 mt-2 mt-lg-0">Užsisakyti puokštę</a>
        </div>
    </div>
</nav>

<!-- HERO -->
<section class="hero">
    <div class="container hero-content py-5">
        <div class="row align-items-center">
            <div class="col-lg-6">
          <span class="badge-soft mb-3 d-inline-flex align-items-center gap-2">
            🌸 Kasdien šviežios gėlės
          </span>
                <h1 class="display-4 fw-bold mb-3">
                    Išskirtinės puokštės<br>Jūsų ypatingoms akimirkoms
                </h1>
                <p class="lead mb-4">
                    „Florial“ – tai gėlių salonas, kuriame kiekviena kompozicija kuriama su meile,
                    kruopštumu ir dėmesiu detalėms. Nuo subtilių lauko gėlių iki prabangių rožių derinių.
                </p>
                <div class="d-flex flex-wrap gap-3">
                    <a href="#contact" class="btn btn-primary btn-lg px-4">
                        Užsisakyti dabar
                    </a>
                    <a href="#gallery" class="btn btn-outline-primary btn-lg px-4">
                        Peržiūrėti darbus
                    </a>
                </div>
                <div class="mt-4 small">
                    ⏱️ Tą pačią dieną pristatymas Vilniaus mieste • 🎁 Dovaninis įpakavimas nemokamas
                </div>
            </div>
        </div>
    </div>
</section>

<!-- ABOUT -->
<section id="about" class="py-5">
    <div class="container">
        <div class="section-title">
            <h2>Apie gėlių saloną „Florial“</h2>
            <p>
                Mūsų tikslas – paversti kasdienybę švente, o šventes – dar įsimintinesnėmis.
            </p>
        </div>

        <div class="row g-4 align-items-center">
            <div class="col-md-6">
                <p class="fs-5">
                    Jau daugiau nei 15 metų mūsų floristės kuria išskirtines gėlių kompozicijas gimtadieniams, vestuvėms,
                    verslo renginiams ir tiesiog – be progos.
                </p>
                <p>
                    Dirbame tik su kruopščiai atrinktais tiekėjais, todėl galime pasiūlyti šviežias,
                    ilgai išsilaikančias gėles ir individualius sprendimus pagal jūsų poreikius.
                </p>
                <ul class="list-unstyled mt-3">
                    <li>✅ Individualios puokštės pagal jūsų viziją</li>
                    <li>✅ Dekoracijos vestuvėms ir renginiams</li>
                    <li>✅ Pristatymas į namus ar biurą</li>
                    <li>✅ Didmeninės kainos</li>
                </ul>
            </div>
            <div class="col-md-6">
                <div class="row g-3">
                    <div class="col-6">
                        <img src="{{ theme()->publicPath('gallery/5.jpg') }}"
                             alt="Gėlių puokštė" class="img-fluid rounded-4 shadow-sm">
                    </div>
                    <div class="col-6 d-flex flex-column gap-3">
                        <img src="{{ theme()->publicPath('gallery/3.jpg') }}"
                             alt="Gėlių kompozicija" class="img-fluid rounded-4 shadow-sm">
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<!-- SERVICES -->
<section id="services" class="py-5" style="background-color:#fff7eb;">
    <div class="container">
        <div class="section-title">
            <h2>Mūsų paslaugos</h2>
            <p>Pasirūpinsime gėlėmis kiekvienai progai – nuo mažų staigmenų iki didelių švenčių.</p>
        </div>

        <div class="row g-4">
            <div class="col-md-4">
                <div class="card service-card h-100">
                    <div class="card-body p-4">
                        <div class="icon-circle mb-3">
                            💐
                        </div>
                        <h5 class="card-title fw-bold">Puokštės kiekvienai progai</h5>
                        <p class="card-text">
                            Klasikinės rožių, lauko gėlių, sezoninės kompozicijos bei minimalistiniai deriniai.
                        </p>
                        <ul class="small text-muted ps-3">
                            <li>Gimtadieniai ir jubiliejai</li>
                            <li>Padėkos ir sveikinimai</li>
                            <li>„Be progos“ staigmenos</li>
                        </ul>
                    </div>
                </div>
            </div>

            <div class="col-md-4">
                <div class="card service-card h-100">
                    <div class="card-body p-4">
                        <div class="icon-circle mb-3">
                            🎀
                        </div>
                        <h5 class="card-title fw-bold">Vestuvinė floristika</h5>
                        <p class="card-text">
                            Nuotakos puokštės, jaunojo butonjerės, automobilių ir švenčių erdvių dekoras.
                        </p>
                        <ul class="small text-muted ps-3">
                            <li>Stalo ir arkų kompozicijos</li>
                            <li>Fotosesijų gėlių dekoras</li>
                            <li>Stiliaus konsultacijos</li>
                        </ul>
                    </div>
                </div>
            </div>

            <div class="col-md-4">
                <div class="card service-card h-100">
                    <div class="card-body p-4">
                        <div class="icon-circle mb-3">
                            🚚
                        </div>
                        <h5 class="card-title fw-bold">Pristatymas į namus Vilniuje</h5>
                        <p class="card-text">
                            Gėlių pristatymas tą pačią dieną Vilniaus mieste.
                        </p>
                        <ul class="small text-muted ps-3">
                            <li>Asmeninis sveikinimo atvirukas</li>
                            <li>SMS/El. pašto patvirtinimai</li>
                            <li>Lankstus laiko pasirinkimas</li>
                        </ul>
                    </div>
                </div>
            </div>

        </div>

    </div>
</section>

<!-- PRICING SLIDER -->
<section id="pricing" class="py-5 pricing-section">
    <div class="container">
        <div class="section-title">
            <h2>Prekių kainoraštis</h2>
            <p>Keletas populiariausių kompozicijų ir puokščių. Kainos gali kisti priklausomai nuo sezono.</p>
        </div>

        <div id="pricingCarousel" class="carousel slide" data-bs-ride="carousel">
            <div class="carousel-inner">

                @php
                    $i = 0;
                @endphp
                @foreach($geles as $puokste)
                    @php
                        $i++;
                    @endphp
                <div class="carousel-item {{ $i == 1 ? 'active' : '' }}">
                    <div class="row justify-content-center">
                        <div class="col-md-4 col-sm-8">
                            <div class="card pricing-card">
                                <img src="{{ app_route('web.florial.images', ['id' => $puokste['image']]) }}"
                                     class="card-img-top" alt="Klasikinė rožių puokštė">
                                <div class="card-body">
                                    <h5 class="card-title">{{ $puokste['title'] }}</h5>
                                    <p class="mb-2 text-muted small">Florial puokštės, skintos gėlės, dekoratyvus įpakavimas.</p>
                                    <div class="d-flex justify-content-between align-items-center">
                                        <span class="price-tag">Kaina tik {{ (new \ViartasSupport\Number\Number($puokste['price']))->formatAsPrice() }}</span>
                                        <a href="#contact" class="btn btn-sm btn-primary">Užsisakyti</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                @endforeach

            </div>

            <!-- Controls -->
            <button class="carousel-control-prev" type="button" data-bs-target="#pricingCarousel" data-bs-slide="prev">
                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                <span class="visually-hidden">Ankstesnis</span>
            </button>
            <button class="carousel-control-next" type="button" data-bs-target="#pricingCarousel" data-bs-slide="next">
                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                <span class="visually-hidden">Kitas</span>
            </button>
        </div>
    </div>
</section>

<!-- GALLERY -->
<section id="gallery" class="py-5">
    <div class="container">
        <div class="section-title">
            <h2>Galerija</h2>
            <p>Keletas mūsų kurtų puokščių ir kompozicijų pavyzdžių.</p>
        </div>

        <div class="row g-4">
            @foreach($puokstes as $puokste)
            <div class="col-md-4 col-6">
                <img src="{{ app_route('web.florial.images', ['id' => $puokste['image']]) }}" alt="Gėlių puokštė" class="gallery-img">
            </div>
            @endforeach
        </div>
    </div>
</section>

<!-- TESTIMONIALS -->
<section id="testimonials" class="py-5" style="background-color:#fff7eb;">
    <div class="container">
        <div class="section-title">
            <h2>Ką sako klientai</h2>
            <p>Klientų atsiliepimai, kurie mus įkvepia kiekvieną dieną.</p>
        </div>

        <div class="row g-4">
            <div class="col-md-4">
                <div class="card testimonial-card h-100">
                    <div class="card-body p-4">
                        <p class="mb-3">
                            „Puokštė pranoko visus lūkesčius! Gėlės išsilaikė beveik dvi savaites, o įpakavimas buvo nuostabus.“
                        </p>
                        <div class="d-flex align-items-center justify-content-between">
                            <div>
                                <div class="fw-bold">Aistė</div>
                                <div class="small text-muted">Gimtadienio puokštė</div>
                            </div>
                            <div class="small text-warning">
                                ★★★★★
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-4">
                <div class="card testimonial-card h-100">
                    <div class="card-body p-4">
                        <p class="mb-3">
                            „Užsakėme vestuvių dekorą – viskas buvo atlikta laiku, subtiliai ir labai skoningai. Rekomenduoju!“
                        </p>
                        <div class="d-flex align-items-center justify-content-between">
                            <div>
                                <div class="fw-bold">Tomas ir Miglė</div>
                                <div class="small text-muted">Vestuvinė floristika</div>
                            </div>
                            <div class="small text-warning">
                                ★★★★★
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-4">
                <div class="card testimonial-card h-100">
                    <div class="card-body p-4">
                        <p class="mb-3">
                            „Greitas pristatymas, malonus bendravimas ir puikus kainos bei kokybės santykis.“
                        </p>
                        <div class="d-flex align-items-center justify-content-between">
                            <div>
                                <div class="fw-bold">Justina</div>
                                <div class="small text-muted">Pristatymas į namus</div>
                            </div>
                            <div class="small text-warning">
                                ★★★★★
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>
</section>

<!-- CONTACT -->
<section id="contact" class="py-5 contact-section">
    <div class="container">
        <div class="section-title">
            <h2>Susisiekite</h2>
            <p>Parašykite mums ir paruošime puokštę būtent jums.</p>
        </div>

        <div class="row g-4">
            <div class="col-lg-7">
                <div class="card contact-card">
                    <div class="card-body p-4 p-md-5">
                        <h5 class="mb-4 fw-bold">Užsakymo forma</h5>
                        {!! $form->renderForm() !!}
                    </div>
                </div>
            </div>

            <div class="col-lg-5">
                <div class="h-100 d-flex flex-column justify-content-between gap-4">
                    <div class="p-4 rounded-4 shadow-sm contact-box">
                        <h5 class="fw-bold mb-3">Kontaktai</h5>
                        <p class="mb-1"><strong>Adresas:</strong> Rinktinės g. 42, Vilnius (Turgaus ir Rinktinės gatvių sankryža)</p>
                        <p class="mb-1"><strong>Telefonas:</strong> <a href="tel:+37060111560">+370 601 11 560</a></p>
                        <p class="mb-3"><strong>El. paštas:</strong> <a href="mailto:info@florial.lt">info@florial.lt</a></p>

                        <h6 class="fw-bold mb-2">Mus rasite ir socialiniuose tinkluose:</h6>
                        <div class="social-links mb-2">
                            <!-- Pakeisk href į tikras nuorodas -->
                            <a href="https://www.facebook.com/florialgeles" target="_blank" aria-label="Facebook">
                                <i class="bi bi-facebook"></i>
                            </a>
                            <a href="https://www.instagram.com/florial_geles" target="_blank" aria-label="Instagram">
                                <i class="bi bi-instagram"></i>
                            </a>
                            <a href="https://wa.me/37060111560" target="_blank" aria-label="WhatsApp">
                                <i class="bi bi-whatsapp"></i>
                            </a>
                        </div>
                        <p class="small text-muted mb-0">
                            Parašykite mums „Messenger“, „Instagram“ žinute ar „WhatsApp“ – atsakome kaip įmanoma greičiau.
                        </p>
                    </div>

                    <div class="p-4 rounded-4 shadow-sm contact-box">
                        <h5 class="fw-bold mb-3">Darbo laikas</h5>
                        <p class="mb-1">I–V: 7:30 – 20:00</p>
                        <p class="mb-1">VI: 8:00 – 18:00</p>
                        <p class="mb-1">VII: 10:00 – 15:00</p>
                        @if(env('TROUBLESHOOT') == 1)
                        {{--<p class="mb-0">
                            <br />Atsiprašome už laikinus nepatogumus.<br /><br />
                            Informuojame, kad <br />
                            gruodžio 22 d. (pirmadienį) ir <br />
                            gruodžio 23 d. (antradienį) <br /><br />
                            dėl techninių kliūčių parduotuvė dirbs<br />
                            nuo 16:00 iki 20:00 val.<br /><br />
                            Atsiprašome už laikinus nepatogumus.
                        </p>--}}
                        @endif
                    </div>

                    <div class="rounded-4 overflow-hidden shadow-sm" style="min-height: 200px;">
                        <!-- Pakeiskite iframe src į savo Google Maps nuorodą -->
                        <iframe
                            src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d576.3943154638985!2d25.28436323823802!3d54.699466399644486!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x46dd95d2259877f9%3A0xe758acf1e0187a1b!2sFlorial%20G%C4%97li%C5%B3%20Parduotuv%C4%97%20Didmenos%20Kainomis!5e0!3m2!1sru!2slt!4v1765486646801!5m2!1sru!2slt"
                            width="100%" height="230" style="border:0;" allowfullscreen="" loading="lazy"
                            referrerpolicy="no-referrer-when-downgrade"></iframe>
                    </div>
                </div>
            </div>
        </div>

    </div>
</section>

<!-- FOOTER -->
<footer class="py-4">
    <div class="container d-flex flex-wrap justify-content-between align-items-center gap-2">
        <div class="small">
            © <span id="year"></span> Gėlių salonas „Florial“. Visos teisės saugomos.
        </div>
        <div class="small">
            Sukurta su 💐 ir Florial.
        </div>
    </div>
</footer>

<x:core::vite.scripts type="library" />
<!-- Bootstrap 5 JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<x:core::vite.scripts type="module" />
<x:core::vite.scripts type="script" />
<script>
    // Dabartiniai metai footeryje
    document.getElementById("year").textContent = new Date().getFullYear();
</script>

<!-- Meta Pixel Code -->
<script>
    !function(f,b,e,v,n,t,s)
    {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
        n.callMethod.apply(n,arguments):n.queue.push(arguments)};
        if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
        n.queue=[];t=b.createElement(e);t.async=!0;
        t.src=v;s=b.getElementsByTagName(e)[0];
        s.parentNode.insertBefore(t,s)}(window, document,'script',
        'https://connect.facebook.net/en_US/fbevents.js');
    fbq('init', '1743456992988789');
    fbq('track', 'PageView');
</script>
<noscript>
    <img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=1743456992988789&ev=PageView&noscript=1"/>
</noscript>
<!-- End Meta Pixel Code -->
<!--Start of Tawk.to Script-->
<script type="text/javascript">
    var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
    (function(){
        var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
        s1.async=true;
        s1.src='https://embed.tawk.to/69405a77bcb95b197dd4355c/1jchpp1jq';
        s1.charset='UTF-8';
        s1.setAttribute('crossorigin','*');
        s0.parentNode.insertBefore(s1,s0);
    })();
</script>
<!--End of Tawk.to Script-->
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-M46EKK0LY5"></script>
<script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'G-M46EKK0LY5');
</script>
</body>
</html>
