<div id="contactForm" class="contact-form">

<div class="col-2">
<div class="input-group">
<label for="first_name">Emri:</label>[text* first_name id:first_name placeholder "Adena"]
</div>

<div class="input-group">
<label for="last_name">Mbiemri:</label>[text* last_name id:last_name placeholder "Kastrati"]
</div>
</div>

<div class="input-group">
<label for="email">Email:</label>[email* email id:email placeholder "info@kompania.com"]
</div>

<div class="input-group">
<label for="phone">Numri i telefonit:</label>[tel phone id:phone placeholder "+355..."]
</div>

<div class="input-group">
<label for="company_type">Lloji i biznesit tuaj:</label>
<div class="radio-btns">
<div class="radio-btn">
[radio company_type use_label_element default:1 "Hospitality & Turizëm"
"Restorante & Bare"
"Hotele & Resorte"
"Healthcare & Klinikë"
"Beauty & Wellness"
"Retail & Dyqane"
"Real Estate & Ndërtim"
"Teknologji"
"Financë & Sigurime"
"Fashion"
"Media & Entertainment"
"Organizata"
"Industri & Prodhim"
"Logjistikë & Transport"
"Tjetër"]
</div>
</div>
</div>

<div class="input-group">
<label for="service_type">Çfarë shërbimi ju nevojitet?</label>
<div class="checkbox-btns">

<div class="checkbox-btn">
[checkbox service_type id:digital_marketing "Digital Marketing"]
<span class="checkbox-label">Digital Marketing</span>
</div>

<div class="checkbox-btn">
[checkbox service_type id:social_media "Menaxhim Rrjetesh Sociale"]
<span class="checkbox-label">Branding</span>
</div>

<div class="checkbox-btn">
[checkbox service_type id:branding "Branding"]
<span class="checkbox-label">Website Development</span>
</div>

<div class="checkbox-btn">
[checkbox service_type id:web_development "Web Development"]
<span class="checkbox-label">Web Development</span>
</div>

<div class="checkbox-btn">
[checkbox service_type id:event_marketing "Event Marketing"]
<span class="checkbox-label">Event Marketing</span>
</div>

<div class="checkbox-btn">
[checkbox service_type id:other "Tjetër"]
<span class="checkbox-label">Tjetër</span>
</div>

</div>
</div>

<div class="input-group">
    <label for="budget">Buxheti i përafërt:</label>

    <div class="input-group-budget">
        [range budget id:budget min:500 max:10000 step:500 default:5000]

        <div class="budget-values d-flex align-items-center justify-content-between w-full">
            <div class="left-value">€500</div>
            <div class="right-value">€<span id="budget-value">5000</span></div>
        </div>
    </div>
</div>

<div class="input-group">
<label for="message">Na tregoni më shumë për projektin tuaj:</label>
[textarea* message id:message placeholder "Përshkruani idenë, nevojën ose objektivin tuaj..."]
</div>

<div class="input-group">
<div class="single-checkbox checkbox-btn">
[acceptance terms_condition id:condition default:off]
<span class="checkbox-label">Jam dakord që the marketing. të më kontaktojë në lidhje me kërkesën time.</span>
[/acceptance]
</div>
</div>

<div class="input-group">
<button type="submit" class="theme-btn">Dërgo Kërkesën</button>
</div>

<div id="result"></div>

</div>

<script>
document.addEventListener('DOMContentLoaded', function () {
    const budget = document.getElementById('budget');
    const output = document.getElementById('budget-value');

    if (budget && output) {
        output.textContent = budget.value;

        budget.addEventListener('input', function () {
            output.textContent = this.value;
        });
    }
});
</script>