{{--
 *
 * @version     1.0.$Revision:$
 * @version     SVN: $Id:$
 * @package     bplan-base/globals
 * @subpackage  Views
 * @author      Emilio Cannarozzo <emilio.cannarozzo@bplan-solutions.de>
 * @author      Wassilios Meletiadis <wassilios.meletiadis@bplan-solutions.de>
 * @copyright   Copyright (C) 2025, 2026 bplan-solutions GmbH & Co. KG <https://www.bplan-solutions.de/>
 * /Δ\
 --}}

<div class="grid gap-4 mb-4 sm:grid-cols-2">

    <!-- Zeile 1: company | short_name -->
    <div>
        <label for="edit-tenant-record-company" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.company')
        </label>
        <input type="text" id="edit-tenant-record-company" wire:model="company"
            placeholder="{{ __('globals::tenant-records.placeholder.company') }}"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        @error('company') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <div>
        <label for="edit-tenant-record-short-name" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.short_name')
        </label>
        <input type="text" id="edit-tenant-record-short-name" wire:model="short_name"
            placeholder="{{ __('globals::tenant-records.placeholder.short_name') }}"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        @error('short_name') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <!-- Zeile 2: street | house_number -->
    <div>
        <label for="edit-tenant-record-street" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.street')
        </label>
        <input type="text" id="edit-tenant-record-street" wire:model="street"
            placeholder="{{ __('globals::tenant-records.placeholder.street') }}"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        @error('street') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <div>
        <label for="edit-tenant-record-house-number" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.house_number')
        </label>
        <input type="text" id="edit-tenant-record-house-number" wire:model="house_number"
            placeholder="{{ __('globals::tenant-records.placeholder.house_number') }}"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        @error('house_number') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <!-- Zeile 3: zip_code | city -->
    <div>
        <label for="edit-tenant-record-zip-code" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.zip_code')
        </label>
        <input type="text" id="edit-tenant-record-zip-code" wire:model="zip_code"
            placeholder="{{ __('globals::tenant-records.placeholder.zip_code') }}"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        @error('zip_code') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <div>
        <label for="edit-tenant-record-city" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.city')
        </label>
        <input type="text" id="edit-tenant-record-city" wire:model="city"
            placeholder="{{ __('globals::tenant-records.placeholder.city') }}"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        @error('city') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <!-- Zeile 4: country_id | home_page -->
    <div>
        <label for="edit-tenant-record-country" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.country_id')
        </label>
        <select id="edit-tenant-record-country" wire:model="country_id"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500">
            <option value="">-</option>
            @foreach ($countries as $id => $name)
                <option value="{{ $id }}">{{ $name }}</option>
            @endforeach
        </select>
        @error('country_id') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <div>
        <label for="edit-tenant-record-home-page" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.home_page')
        </label>
        <input type="url" id="edit-tenant-record-home-page" wire:model="home_page"
            placeholder="{{ __('globals::tenant-records.placeholder.home_page') }}"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        @error('home_page') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <!-- Zeile 5: phone_number | mobile_phone_number (intl-tel-input) -->
    <div>
        <div wire:ignore>
            <label for="edit-tenant-record-phone-number" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
                @lang('globals::tenant-records.label.phone_number')
            </label>
            <input type="tel" id="edit-tenant-record-phone-number"
                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        </div>
        <input type="hidden" wire:model="phone_number" />
        @error('phone_number') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <div>
        <div wire:ignore>
            <label for="edit-tenant-record-mobile-phone-number" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
                @lang('globals::tenant-records.label.mobile_phone_number')
            </label>
            <input type="tel" id="edit-tenant-record-mobile-phone-number"
                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        </div>
        <input type="hidden" wire:model="mobile_phone_number" />
        @error('mobile_phone_number') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <!-- Zeile 6: email (Spalte 1) -->
    <div>
        <label for="edit-tenant-record-email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.email')
        </label>
        <input type="email" id="edit-tenant-record-email" wire:model="email"
            placeholder="{{ __('globals::tenant-records.placeholder.email') }}"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500" />
        @error('email') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

    <!-- Zeile 7: description (fullwidth) -->
    <div class="sm:col-span-2">
        <label for="edit-tenant-record-description" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
            @lang('globals::tenant-records.label.description')
        </label>
        <textarea id="edit-tenant-record-description" wire:model="description" rows="3"
            placeholder="{{ __('globals::tenant-records.placeholder.description') }}"
            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"></textarea>
        @error('description') <p class="mt-1 text-xs text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
    </div>

</div>
