@section('css')

    <!-- Daterange picker -->
    {{-- <link rel="stylesheet" href="{{ asset('adminlte/plugins/daterangepicker/daterangepicker.css') }}"> --}}



      {{-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tempusdominus-bootstrap-4/5.39.0/css/tempusdominus-bootstrap-4.min.css" integrity="sha512-3JRrEUwaCkFUBLK1N8HehwQgu8e23jTH4np5NHOmQOobuC4ROQxFwFgBLTnhcnQRMs84muMh0PnnwXlPq5MGjg==" crossorigin="anonymous" />       --}}

    <!-- Tempusdominus Bootstrap 4 -->
    {{-- <link rel="stylesheet" href="{{ asset('adminlte/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css') }}"> --}}

    <!-- Theme style -->
    {{-- <link rel="stylesheet" href="{{ asset('adminlte/dist/css/adminlte.min.css') }}"> --}}

    {{-- <style>
    .tempus-dominus-widget,
        .bootstrap-datetimepicker-widget {
          z-index: 9999 !important; /* ou 9999, dependendo do seu layout */
        }
    </style> --}}



@endsection

@section('scripts')


{{-- <script src="{{ asset('adminlte/dist/js/adminlte.js') }}"></script>  --}}
{{-- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> --}}
{{-- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.0/moment.min.js"></script> --}}
{{-- <script src="https://cdnjs.cloudflare.com/ajax/libs/tempusdominus-bootstrap-4/5.39.0/js/tempusdominus-bootstrap-4.min.js" integrity="sha512-k6/Bkb8Fxf/c1Tkyl39yJwcOZ1P4cRrJu77p83zJjN2Z55prbFHxPs9vN7q3l3+tSMGPDdoH51AEU8Vgo1cgAA==" crossorigin="anonymous"></script> --}}


        <!-- jQuery -->
        {{-- <script src="{{ asset('adminlte/plugins/jquery/jquery.min.js') }}"></script>  --}}
        <!-- jQuery UI 1.11.4 -->
        {{-- <script src="{{ asset('adminlte/plugins/jquery-ui/jquery-ui.min.js') }}"></script>         --}}
       <!-- Bootstrap 4 -->
        {{-- <script src="{{ asset('adminlte/plugins/bootstrap/js/bootstrap.bundle.min.js') }}"></script>     --}}

        {{-- <script src="{{ asset('adminlte/plugins/moment/moment.min.js') }}"></script>
        <script src="{{ asset('adminlte/plugins/moment/locale/pt-br.js') }}"></script>              --}}


        <!-- Tempusdominus Bootstrap 4 -->
        {{-- <script src="{{ asset('adminlte/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js') }}"></script> --}}
        <!-- AdminLTE App -->
        {{-- <script src="{{ asset('adminlte/dist/js/adminlte.js') }}"></script>         --}}
         

<script>

    // $(function () {
 
    //   //Date and time picker
    //   $('#reservationdatetime').datetimepicker({ 
    //     icons: { time: 'far fa-clock' },
    //     format: 'DD/MM/YYYY HH:mm:ss' // Ex: 21/04/2025 14:30
    
    //    });

    // })      
</script>

@endsection


<x-appadminlte-layout>

    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">CRIAR CULTO</h1>
                </div><!-- /.col -->
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{ url('/principal') }}">Principal</a></li>
                        <li class="breadcrumb-item active">CRIAR CULTO</li>
                    </ol>
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->

    {{-- ACESSO RÁPIDO --}}
    @include('events.partials.fastaccessevents')

    {{-- MENSAGEM DE ALERTA --}}
        <div class="my-1 mx-2 mb-1">
            @include('flash::message')
        </div>


        <div class="card my-1 mx-2 mb-2">
            <div class="card-header">
              <h3 class="card-title">Criar culto</h3>
    
              <div class="card-tools">
                <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                  <i class="fas fa-minus"></i>
                </button>
                <button type="button" class="btn btn-tool" data-card-widget="remove" title="Remove">
                  <i class="fas fa-times"></i>
                </button>
              </div>
            </div>
            <div class="card-body p-2" style="display: block;">
                <form method="post" action="{{ route('events.store') }}" class="">
                    @csrf
                    @method('post')

                    <div class="row">
                        <div class="form-group col-sm-3">
                            <label for="name">Nome</label>
                            <input type="text"
                                class="form-control @error('name') is-invalid @enderror" name="name"
                                id="name" value="{{ old('name') }}" required autofocus
                                autocomplete class="mt-1"
                                placeholder="Digite o nome">
                            <x-input-error class="mt-2" :messages="$errors->get('name')" />
                        </div>
                    

                        <div class="form-group col-sm-7">
                            <label for="description">Descrição</label>
                            <input type="text"
                                class="form-control @error('description') is-invalid @enderror" name="description"
                                id="name" value="{{ old('description') }}" required autofocus
                                autocomplete class="mt-1"
                                placeholder="Digite a descrição">
                            <x-input-error class="mt-2" :messages="$errors->get('description')" />
                        </div>

                        <!-- number_volunteers -->
                        <div class="form-group col-sm-2">
                            <label for="number_volunteers">Nº Voluntários</label>
                            <input type="text"
                                class="form-control @error('number_volunteers') is-invalid @enderror" name="number_volunteers"
                                id="number_volunteers" value="{{ old('number_volunteers') }}" required autofocus
                                autocomplete class="mt-1"
                                placeholder="Digite numero">
                            <x-input-error class="mt-2" :messages="$errors->get('number_volunteers')" />
                        </div> 


                    </div>
                    <div class="row">

                        <!-- date -->
                        <div class="form-group col-sm-3">
                            {{-- <label for="data_nascimento" class="block text-sm font-medium text-gray-700">Data de Nascimento</label> --}}
                            {{-- <x-input-label for="date_of_birth" :value="__('Data de Nascimento:')" /> --}}
                            <label>Data e hora chegada</label>
                            <input 
                                type="text" 
                                name="date" 
                                id="date"
                                {{-- class="datepicker mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:ring focus:ring-indigo-200 focus:ring-opacity-50" --}}
                                class="form-control datetimepicker"
                                x-data 
                                placeholder="dd/mm/aaaa hh:mm:ss"
                                value="{{ old('date') }}"
                                required>
                        
                                <x-input-error :messages="$errors->get('date')" class="mt-2" />    
                        </div>

                        <!-- start_registration -->
                        <div class="form-group col-sm-3">
                            {{-- <label for="data_nascimento" class="block text-sm font-medium text-gray-700">Data de Nascimento</label> --}}
                            {{-- <x-input-label for="date_of_birth" :value="__('Data de Nascimento:')" /> --}}
                            <label>Inicio da Inscrição</label>
                            <input 
                                type="text" 
                                name="start_registration" 
                                id="date"
                                {{-- class="datepicker mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:ring focus:ring-indigo-200 focus:ring-opacity-50" --}}
                                class="form-control datetimepicker"
                                x-data 
                                placeholder="dd/mm/aaaa hh:mm:ss"
                                value="{{ old('start_registration') }}"
                                required>
                        
                                <x-input-error :messages="$errors->get('start_registration')" class="mt-2" />    
                        </div>
                        
                        <!-- end_registration -->
                        <div class="form-group col-sm-3">
                            {{-- <label for="data_nascimento" class="block text-sm font-medium text-gray-700">Data de Nascimento</label> --}}
                            {{-- <x-input-label for="date_of_birth" :value="__('Data de Nascimento:')" /> --}}
                            <label>Fim da Inscrição</label>
                            <input 
                                type="text" 
                                name="end_registration" 
                                id="date"
                                {{-- class="datepicker mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:ring focus:ring-indigo-200 focus:ring-opacity-50" --}}
                                class="form-control datetimepicker"
                                x-data 
                                placeholder="dd/mm/aaaa hh:mm:ss"
                                value="{{ old('end_registration') }}"
                                required>
                        
                                <x-input-error :messages="$errors->get('end_registration')" class="mt-2" />    
                        </div>
                        
                        
                        <!-- duration -->
                        <div class="form-group col-sm-2">
                            {{-- <label for="data_nascimento" class="block text-sm font-medium text-gray-700">Data de Nascimento</label> --}}
                            {{-- <x-input-label for="date_of_birth" :value="__('Data de Nascimento:')" /> --}}
                            <label>Duração</label>
                            <input 
                                type="text" 
                                name="duration" 
                                id="date"
                                {{-- class="datepicker mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:ring focus:ring-indigo-200 focus:ring-opacity-50" --}}
                                class="form-control timepicker"
                                x-data 
                                placeholder="hh:mm:ss"
                                value="{{ old('duration')  ?? '02:00:00' }}"
                                required>
                        
                                <x-input-error :messages="$errors->get('duration')" class="mt-2" />    
                        </div>                         






                    </div>
                    <div class="mb-2">
                        <button type="submit" class="btn btn-primary">Salvar</button>
                </div>                    
                </form>




            </div>
            <!-- /.card-body -->
          </div>


   

</x-appadminlte-layout>