// Twój istniejący kod JavaScript tutaj document.addEventListener(’DOMContentLoaded’, funkcja () { // Pobierz elementy wejściowe var dorośliInput = document.getElementById(’adults’); var kidsInput = document.getElementById(’children’); var niemowlętaInput = document.getElementById(’niemowlęta’); var totalAmountInput = document.getElementById(’całkowita-kwota’);

        // Add event listeners to the input fields
        adultsInput.addEventListener('input', updateTotalAmount);
        childrenInput.addEventListener('input', updateTotalAmount);
        infantsInput.addEventListener('input', updateTotalAmount);

        // Function to update the total amount
        function updateTotalAmount() {
            // Get the values from input fields
            var adultsCount = parseInt(adultsInput.value) || 0;
            var childrenCount = parseInt(childrenInput.value) || 0;
            var infantsCount = parseInt(infantsInput.value) || 0;

            // Calculate the total amount (you can adjust the pricing logic as needed)
            var totalAmount = adultsCount * 50 + childrenCount * 30 + infantsCount * 10;

            // Update the total amount input field
            totalAmountInput.value = totalAmount.toFixed(2); // Assuming you want two decimal places

            // Update the hidden total amount input field
            document.getElementById('hidden-total-amount').value = totalAmount.toFixed(2);
        }
    });
</script>


    form {
        max-width: 600px;
        margin: 20px auto;
        padding: 20px;
        border-radius: 8px;
    }

    .options-section {
        width: 313px;
        /*height: 173px;*/
        padding-bottom: 26px;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 16px;
        display: flex;
    }

    label {
        /*display: block;*/
        margin-bottom: 8px;
        width: 100%;
    }

    select,
    input {
        width: 100%;
        padding: 8px;
        margin-bottom: 16px;
        box-sizing: border-box;
    }

    button {
        background-color: #004d4d;
        color: #ffffff;
        padding: 10px 15px;
        border: 0;
        cursor: pointer;
    }

    button:hover {
        background-color: #003333;
    }

    .options-section {
        width: 313px;
        /*height: 173px;*/
        padding-bottom: 26px;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 16px;
        display: flex;
    }

    .date-section {
        width: 280px;
        align-self: stretch;
        padding: 16px;
        border: 1px #006666 solid;
        justify-content: space-between;
        align-items: center;
        display: inline-flex;
    }

    .adults-count {
        width: 280px;
        align-self: stretch;
        padding: 16px;
        border: 1px #006666 solid;
        justify-content: space-between;
        align-items: center;
        display: inline-flex;
    }

    .children-count {
        width: 280px;
        align-self: stretch;
        padding: 16px;
        border: 1px #006666 solid;
        justify-content: space-between;
        align-items: center;
        display: inline-flex;
    }

    .infants-count {
        width: 280px;
        align-self: stretch;
        padding: 16px;
        border: 1px #006666 solid;
        justify-content: space-between;
        align-items: center;
        display: inline-flex;
    }
    
    #p-code {
        width: 172px;
        height: 57px;
        gap: 10px;
        padding: 10px;
        border: 0.8px #006666 solid;
    }

    .total-amount {
        width: 313px;
    }

    hr {
        width: 313px;
        text-align: left;
        margin-left: 0;
    }

    #book-button {
        width: 313px;
        height: 58px;
        text-align: center;
        padding: 10px;
        cursor: pointer;
        align-self: stretch;
    }

    #apply-button {
        width: 130px;
        height: 52px;
        gap: 12px;
        cursor: pointer;
        justify-content: center;
        align-items: center;
        align-self: stretch;
    }

    #out-of-places {
        text-align: center;
        width: 313px;
        color: #006666;
        font-family: Work Sans;
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
        letter-spacing: 0.16px;
    }

    #line-1 {
        width: 313px;
        color: #292929;
        font-family: Work Sans;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 0.14px;
    }

    #line-2 {
        width: 313px;
        color: #292929;
        font-family: Work Sans;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 0.14px;
    }

<div class="section-1">
    <div class="options-section">
        <label for="tour-type">Select an option:</label>
        <select name="tour-type" id="tour-type">
            <option value="group">Group Tour</option>
            <option value="private">Private Tour</option>
        </select>
    </div>
</div>

<div class="section-2">
    <div class="date-section">
        <label for="tour-date">Tour Date:</label>
        <input type="date" name="tour-date" id="tour-date" required>
    </div><br><br>

    <div class="adults-count">
        <label for="adults">Adults:<br>Over 12 Years</label>
        <input type="number" name="adults" id="adults" min="1" required>
    </div><br><br>

    <div class="children-count">
        <label for="children">Children:<br>4 - 10 Years</label>
        <input type="number" name="children" id="children" min="0">
    </div><br><br>

    <div class="infants-count">
        <label for="infants">Infants:<br>Below 10 Years</label>
        <input type="number" name="infants" id="infants" min="0">
    </div><br><br>
</div>

<div class="section-3">
    <div class="total-amount">
        <label for="total-amount">Total</label>
        <input type="text" name="total-amount" id="total-amount" readonly>
    </div>
</div>

<hr>

<div class="section-4">
    <div class="promo-code">
        <p>Promo Code</p>

        <div class="code-and-apply">
            <input type="text" name="p-code" id="p-code" placeholder="25SL7643">
            <button type="submit" id="apply-button" name="submit">Apply</button>
        </div>

        <p id="out-of-places">Left 10 out of 15 places</p>
    </div>

    <div class="book-button">
        <button type="submit" id="book-button" name="submit">Book Now</button>
    </div>

    <div class="more-detail">
        <p id="line-1">For any inquiries Call +94 77 278 3976</p>
        <p id="line-2">This tour regularly sells out... We highly recommend booking as soon as possible to avoid missing out.</p>
    </div>
</div>

// Dodaj ukryte pole do kasy dla łącznej kwoty funkcja add_tour_total_amount_to_checkout() { echo ”; } add_action(’woocommerce_before_checkout_form’, 'add_tour_total_amount_to_checkout’);

// Ustaw cenę produktu przed obliczeniem sumy funkcja set_tour_product_price($cart) { if (is_admin() && !definiowane(’DOING_AJAX’)) return;

// Sprawdź czy produkt znajduje się w koszyku $product_id = 8036; // Zmień na rzeczywisty identyfikator produktu

foreach ($cart->get_cart() as $cart_item_key => $cart_item) { if ($cart_item[’product_id’] === $product_id) { // Uzyskaj całkowitą kwotę z danych pozycji w koszyku $total_amount = $cart_item[’data’]->get_cena();

    // Update the product price
    $cart_item['data']->set_price($total_amount);
}

}

} add_action(’woocommerce_before_calculate_totals’, 'set_tour_product_price’);

// Obsługa przesyłania formularza add_action(’admin_post’, 'handle_tour_booking_form’); add_action(’admin_post_nopriv’, 'handle_tour_booking_form’);

funkcja handle_tour_booking_form() { // Sprawdź, czy formularz został przesłany if (isset($_POST[’submit’])) { // Tutaj znajdziesz logikę przetwarzania formularza

// Calculate total amount (adjust the logic based on your needs)
$total_amount = floatval($_POST['tour_total_amount']);

// Get the product ID from your WooCommerce product
$product_id = 8036; // Change to your actual product ID

// Get the cart instance
$cart = WC()->cart;

// Remove existing items from the cart
$cart->empty_cart();

// Add the product to the cart with the calculated total amount
$cart->add_to_cart($product_id, 1, 0, array(), array('tour_total_amount' => $total_amount));

// Redirect to the WooCommerce cart page
$cart_url = wc_get_cart_url();
wp_redirect($cart_url);
exit();

}

} ?>