on search error "Cannot read properties of null (reading 'value')" – Html

I created a search similar to the one on booking that I want to integrate into the site and I get the following error… after choosing a checkin, checkout, select the number of rooms, adults and children respectively their age and press the button de search throws me the following error in the console "Cannot read properties of null (reading ‘value’)". And I can’t figure out where I’m going wrong. I am attaching the code below.
COD HTML

                <form id="booking-search-form" action="https://www.booking.com/searchresults.ro.html" method="get"
                    target="_blank" style="display: flex; justify-content: center;">
                    <div class="container">
                        <div class="hakolal-search-row-bk">
                            <div class="col-sm hakolal-search-conf">
                                <input type="date" id="checkin" name="checkin">
                            </div>
                            <div class="col-sm hakolal-search-conf">
                                <input type="date" id="checkout" name="checkout">
                            </div>
                            <div class="col-sm hakolal-search-conf">
                                <div class="dropdown">
                                    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1"
                                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                                        Number of guests</button>
                                    <div id="content" class="content dropdown-menu" aria-labelledby="dropdownMenu1">
                                        <div class="list">
                                            <label for="rooms" class="list">Choose how many rooms</label>
                                            <input type="number" class="list quantity" value="0" />
                                        </div>
                                        <div class="list">
                                            <label for="adults" class="list">Choose the number of adults</label>
                                            <input type="number" class="list quantity" value="1" />
                                        </div>
                                        <div class="list" id="children-list">
                                            <label for="children" class="list">Choose the number of children</label>
                                            <input type="number" class="list quantity" value="0" />
                                            <div id="children-ages"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm hakolal-search-conf">
                                <button type="submit" class="btn btn-info hakolal-search-bk">Search</button>
                            </div>
                        </div>
                    </div>
                </form>

COD JavaScript

const form = document.getElementById("booking-search-form");
console.log("Formular:", form);

// Add event listener to children quantity input
const childrenQuantityInput = document.querySelector("#children-list input.quantity");
childrenQuantityInput.addEventListener("change", () => {
    const childrenAgesDiv = document.querySelector("#children-ages");
    childrenAgesDiv.innerHTML = ""; // Clear children ages list

    // Add input for each child age
    for (let i = 1; i <= childrenQuantityInput.value; i++) {
        const label = document.createElement("label");
        label.setAttribute("for", `child-${i}-age`);
        label.classList.add("list");
        label.innerText = `Child ${i} age:`;

        const input = document.createElement("input");
        input.setAttribute("id", `child-${i}-age`);
        input.setAttribute("name", `age-${i}`);
        input.setAttribute("type", "number");
        input.setAttribute("min", "0");
        input.setAttribute("max", "17");
        input.classList.add("list");
        input.value = "0";

        const div = document.createElement("div");
        div.appendChild(label);
        div.appendChild(input);
        childrenAgesDiv.appendChild(div);
    }

});
console.log("Input numar copii:", childrenQuantityInput);

const checkinInput = document.getElementById("checkin");
const checkoutInput = document.getElementById("checkout");

form.addEventListener("submit", (event) => {
    event.preventDefault();

    console.log(checkinInput); // check if element exists
    console.log(checkoutInput); // check if element exists
    const checkinValue = checkinInput.value;
    console.log(checkinValue); // display selected value in console log
    const checkoutValue = checkoutInput.value;
    console.log(checkoutValue); // display selected value in console log
    if (!checkinValue || !checkoutValue) {
        alert("Please enter check-in and check-out dates");
        return;
    }

    // check if is selectet an room
    const numberOfRooms = document.querySelector("#content input:nth-of-type(1)").value;
    if (numberOfRooms < 1) {
        alert("Please select at least one room");
        return;
    }
    console.log("Numarul de camere selectat:", numberOfRooms);

    // check if is selected an adult 
    const numberOfAdults = document.querySelector("#adults-list input.list.quantity").value;
    if (numberOfAdults < 1) {
        alert("Please select at least one adult");
        return;
    }
    console.log("Numarul de adulti:", numberOfAdults); // Valoarea nu se adauga, nu afiseaza nimic in consola

    const numberOfChildren = document.querySelector("#children-list input.list.quantity").value;
    const childrenAges = Array.from(document.querySelectorAll("#children-ages input"))
        .map((input) => input.value)
        .join(",");
    for (let i = 1; i <= numberOfChildren; i++) {
        const childAgeInput = document.querySelector(`#child-${i}-age`);
        if (childAgeInput.value < 1) {
            alert(`Please enter a valid age for child ${i}`);
            return;
        }
    }
    console.log("Numarul de copii:", numberOfChildren); // Valoarea nu se adauga, nu afiseaza nimic in consola
    console.log("Varsta copiilor:", childrenAges); // Valoarea nu se adauga, nu se afiseaza nimic in consola

    // Value of parametter ss is harcoded
    // ss parameter represent a location
    const url =
        `https://www.booking.com/searchresults.ro.html?ss=Romania&checkin=${checkinValue}&checkout=${checkoutValue}&nr_rooms=${numberOfRooms}&nr_adults=${numberOfAdults}&nr_children=${numberOfChildren}&group_children=${childrenAges}`;
    window.open(url, "_blank");
});

I tend to think that the problem is that the dropdown does not take the value from the number of rooms, adults and children of the respective age for each. But I’m not really sure.
The code, after selecting all the values in the form, creates a URL and makes a search in booking based on the parameters sent by the form.
Can you help me solve the problem? I can’t figure out where I’m going wrong.