@section('title', $uuid ? 'Formulário Editar Aplicação' : 'Formulário Cadastrar Aplicação - ZEINER')
<div class="bg-gray-100">

    <livewire:dashboard.client.header />
    <x-dashboard.admin-side-bar />

    <!-- OVERLAY -->
    <div id="overlay" class="hidden fixed inset-0 bg-black bg-opacity-40 z-40 lg:hidden"></div>

    <!-- CONTEÚDO PRINCIPAL -->
    <main class="lg:ml-64 pt-15 p-6">

        <h1 class="text-3xl font-bold text-gray-700 mb-6">
            Adicionar Aplicação
        </h1>

        <!-- FORMULÁRIO -->
        <div class="bg-white rounded-xl shadow-md p-6 max-w-4xl">

             <x-dashboard.form :uuid="$uuid ?? '' ">
                <!-- GRID -->
                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">

                    <!-- NOME -->
                    <div>
                        <label class="block text-sm font-medium text-gray-600 mb-1">
                            Nome do Aplicativo
                        </label>
                        <input type="text"
                               wire:model='app_name'
                               class="w-full px-3 py-2 rounded-md border border-gray-300
                                focus:outline-none focus:border-blue-400"
                               placeholder="Ex: ZEINER Manager" 
                        />
                        @error('app_name')<span class="text-red-400">{{ $message }}</span>@enderror
                    </div>

                    <!-- VERSÃO -->
                    <div>
                        <label class="block text-sm font-medium text-gray-600 mb-1">
                            Versão
                        </label>
                        <input type="text"
                                wire:model='app_version'
                               class="w-full px-3 py-2 rounded-md border border-gray-300
                                focus:outline-none focus:border-blue-400"
                               placeholder="Ex: 1.0.0"
                        />
                        @error('app_version')<span class="text-red-400">{{ $message }}</span>@enderror
                    </div>

                    <!-- LINGUAGEM -->
                    <div>
                        <label class="block text-sm font-medium text-gray-600 mb-1">
                            Formato
                        </label>
                   
                            <select wire:model='app_format_type' class="w-full px-3 bg-white py-2 rounded-md border border-gray-300                                
                            focus:outline-none focus:border-blue-400" >
                                <option value="">Selecionar</option>
                                <option value="zip">zip</option>
                                <option value="exe">exe</option>
                                <option value="apk">apk</option>
                                <option value="msi">msi</option>
                                <option value="dmg">dmg</option>
                                <option value="deb">deb</option>
                                <option value="rpm">rpm</option>                              
                                <option value="gz">gz</option>
                                <option value="7z">7z</option>
                            </select>
                        @error('app_format_type')<span class="text-red-400">{{ $message }}</span>@enderror
                    </div>

                    <!-- TAMANHO -->
                    <div>
                        <label class="block text-sm font-medium text-gray-600 mb-1">
                            Tamanho (MB)
                        </label>
                        <input type="number"
                               wire:model='app_size'
                               min="0"
                               class="w-full px-3 py-2 rounded-md border border-gray-300
                                      focus:outline-none focus:border-blue-400"
                               placeholder="Ex: 150"
                        />
                       @error('app_size')<span class="text-red-400">{{ $message }}</span>@enderror
                    </div>

                </div>
                
                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">

                    <!-- NOME -->
                    <div>
                        <label class="block text-sm font-medium text-gray-600 mb-1">
                            Preço
                        </label>
                        <input type="number"
                               min="0"
                               wire:model='app_price'
                               class="w-full px-3 py-2 rounded-md border border-gray-300
                                focus:outline-none focus:border-blue-400"
                               placeholder="Ex: 1.000.000" 
                        />
                        @error('app_price')<span class="text-red-400">{{ $message }}</span>@enderror
                    </div>

                    <!-- VERSÃO -->
                    <div>
                        <label class="block text-sm font-medium text-gray-600 mb-1">
                            Tempo de duraçao de teste 
                        </label>
                        <select class="w-full px-3 bg-white py-2 rounded-md border border-gray-300                                
                            focus:outline-none focus:border-blue-400" wire:model="app_test_duration" id="">
                            <option value="">Selecionar</option>
                            <option value="7">Semanal</option>
                            <option value="30">Mensal</option>
                            <option value="365">Anual</option>
                        </select>
                        @error('app_test_duration')<span class="text-red-400">{{ $message }}</span>@enderror
                    </div>

               

                </div>

                <!-- DESCRIÇÃO -->
                <div>
                    <label class="block text-sm font-medium text-gray-600 mb-1">
                        Descrição
                    </label>
                    <textarea rows="4"
                              wire:model='app_description'
                              class="w-full px-3 py-2 rounded-md border border-gray-300
                                     focus:outline-none focus:border-blue-400"
                              placeholder="Descrição da aplicação...">
                    </textarea>
                    @error('app_description') <span class="text-red-400">{{ $message }}</span> @enderror
                </div>

                 <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                     <!-- DOWNLOAD -->
                     <div>
                         <label class="block text-sm font-medium text-gray-600 mb-1">
                             Logotipo da aplicação
                         </label>
     
                         <input
                             type="file"
                             wire:model='app_logo'
                             accept="image/*"
                             class="w-full px-3 py-2 rounded-md border border-gray-300
                             focus:outline-none focus:border-blue-400"
                         />
                         @error('app_logo') <span class="text-red-400">{{ $message }}</span> @enderror                    
                     </div> 
                     
                     
                     <div>
                         <label class="block text-sm font-medium text-gray-600 mb-1">
                             Ficheiro de Download
                         </label>
                         <input
                                type="file"
                                wire:model="app_address_link_to_download"
                                class="w-full px-3 py-2 rounded-md border border-gray-300 focus:outline-none focus:border-blue-400"
                            />

                                                
                         @error('app_address_link_to_download') <span class="text-red-400">{{ $message }}</span> @enderror                    
                     </div>    

                 </div>
                          

            </x-dashboard.form>
        </div>

    </main>

    <x-home.whatsapp-floating-button />

</div>
