@extends('layouts.publicador.default')

@section('content')
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <link rel="stylesheet" href="{{ asset('css/fontawesome/css/all.min.css') }}">
    <link rel="stylesheet" href="{{ asset('css/fontawesome/css/fontawesome.min.css') }}">
    <link href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.4/moment.min.js"></script>



    <div class="container">
        <div class="content-wrapper">
            <div class="form-header">
                <h4>
                    @lang('labels.agenda')
                    <small class="text-muted">
                        {{ empty($model->id) ? __('labels.acoes.adicionar') : __('labels.acoes.alterar') }}
                    </small>
                </h4>
            </div>

            @if ($errors->any())
                <div class="alert alert-danger">
                    <i class="fas fa-exclamation-circle"></i>
                    <div>@lang('labels.msg.verifique')</div>
                </div>
            @endif

            @if (empty($model))
                {!! Form::open(['route' => ['publicador.agenda_2.salvar'], 'class' => 'form form-edit', 'files' => true]) !!}
            @else
                {!! Form::model($model, [
                    'route' => ['publicador.agenda_2.salvar'],
                    'class' => 'form form-edit',
                    'method' => 'post',
                    'files' => true,
                ]) !!}
                {{ Form::hidden('id') }}
            @endif

            <div class="row">
{{--                 <div class="col-sm-4">
                    <div class="form-group">
                        {{ Form::label('tipo', 'Tipo de Evento') }}
                        {{ Form::select(
                            'tipo',
                            [
                                'Audiência Pública' => 'Audiência Pública',
                                'Capacitação' => 'Capacitação',
                                'Culto' => 'Culto',
                                'Encontro' => 'Encontro',
                                'Entrega de Título' => 'Entrega de Título',
                                'Exposição' => 'Exposição',
                                'Fórum' => 'Fórum',
                                'Grande Expediente' => 'Grande Expediente',
                                'Jornada' => 'Jornada',
                                'Lançamento' => 'Lançamento',
                                'Palestra' => 'Palestra',
                                'Pequeno Expediente' => 'Pequeno Expediente',
                                'Posse' => 'Posse',
                                'Recepção' => 'Recepção',
                                'Reunião' => 'Reunião',
                                'Reunião da Comissão de Constituição e Justiça/CCJ' => 'Reunião da Comissão de Constituição e Justiça/CCJ',
                                'Reunião Extraordinária' => 'Reunião Extraordinária',
                                'Reunião Ordinária' => 'Reunião Ordinária',
                                'Santa Missa' => 'Santa Missa',
                                'Seminário' => 'Seminário',
                                'Sessão Plenária' => 'Sessão Plenária',
                                'Sessão Pública Licitatória' => 'Sessão Pública Licitatória',
                                'Sessão Solene' => 'Sessão Solene',
                                'Solenidade' => 'Solenidade',
                                'Visita' => 'Visita',
                            ],
                            null,
                            [
                                'class' => 'form-control ' . ($errors->has('tipo') ? 'is-invalid' : ''),
                                'placeholder' => 'Selecione o tipo de evento',
                            ],
                        ) }}
                        @if ($errors->has('tipo_evento'))
                            <div class="invalid-feedback">
                                {{ $errors->first('tipo_evento') }}
                            </div>
                        @endif
                    </div>
                </div> --}}
                <div class="col-sm-12">
                    <div class="form-group">
                        {{ Form::label('titulo', __('labels.titulo')) }}
                        {{ Form::text('titulo', null, [
                            'class' => 'form-control ' . ($errors->has('titulo') ? 'is-invalid' : ''),
                            'placeholder' => __('labels.titulo'),
                            'autocomplete' => 'off',
                        ]) }}
                        @if ($errors->has('titulo'))
                            <div class="invalid-feedback">
                                {{ $errors->first('titulo') }}
                            </div>
                        @endif
                    </div>
                </div>

                <div class="col-sm-3">
                    <div class="form-group">
                        {{ Form::label('local_id', __('labels.local')) }}
                        {{ Form::select('local_id', $locais, null, [
                            'class' => 'form-control ' . ($errors->has('local_id') ? 'is-invalid' : ''),
                            'placeholder' => __('labels.acoes.selecione'),
                            'autocomplete' => 'off',
                        ]) }}
                        @if ($errors->has('local_id'))
                            <div class="invalid-feedback">
                                {{ $errors->first('local_id') }}
                            </div>
                        @endif
                    </div>
                </div>

                <div class="col-sm-3">
                    <div class="form-group">
                        {{ Form::label('local', __('labels.endereco')) }}
                        {{ Form::text('local', null, [
                            'class' => 'form-control ' . ($errors->has('local') ? 'is-invalid' : ''),
                            'maxlength' => 150,
                            'placeholder' => __('labels.endereco'),
                            'autocomplete' => 'off',
                        ]) }}
                        @if ($errors->has('local'))
                            <div class="invalid-feedback">
                                {{ $errors->first('local') }}
                            </div>
                        @endif
                    </div>
                </div>

                <div class="col-sm-3">
                    <div class="form-group">
                        <label for="data_evento">Data do Evento</label>
                        <input type="datetime-local" id="data_evento" name="data_evento"
                            class="form-control {{ $errors->has('data_evento') ? 'is-invalid' : '' }}"
                            placeholder="Data do Evento" autocomplete="off"
                            value="{{ !empty($model->data_evento) && is_object($model->data_evento) && $model->data_evento->year > 2
                                ? $model->data_evento->format('Y-m-d\TH:i')
                                : '' }}">
                        @if ($errors->has('data_evento'))
                            @if ($errors->first('data_evento') == 'validation.checar_disponibilidade_local')
                                <div class="form-check form-check-inline">
                                    <label class="form-check-label py-1 text-danger">
                                        <input type="checkbox" name="alerta" value="1" class="form-check-input">
                                        @lang('validation.evento_conflito')
                                    </label>
                                </div>
                            @else
                                <div class="invalid-feedback">
                                    {{ $errors->first('data_evento') }}
                                </div>
                            @endif
                        @endif
                    </div>
                </div>

                                <div class="col-sm-3">
                    <div class="form-group">
                        <label for="DataTermino">Data Término</label>
                        <input type="datetime-local" id="DataTermino" name="DataTermino" class="form-control"
                            placeholder="Data Término" autocomplete="off"
                            value="{{ !empty(old('DataTermino')) && strpos(old('DataTermino'), '/') !== false
                                ? \Carbon\Carbon::createFromFormat('d/m/Y H:i', old('DataTermino'))->format('Y-m-d\TH:i')
                                : old('DataTermino', '') }}">
                    </div>
                </div>
                
                <div class="col-sm-2">
                    <div class="form-group">
                        <label for="ocultar_data">Ocultar data/hora</label>
                        <select name="ocultar_data" class="form-control">
                            <option value="0">Não</option>
                            <option value="1"
                                {{ !empty($model->ocultar_data) && $model->ocultar_data == 1 ? 'selected' : '' }}>Sim
                            </option>
                        </select>
                    </div>
                </div>

                <div class="col-sm-3">
                    <div class="form-group">
                        {{ Form::label('status', __('labels.status')) }}
                        {{ Form::select('status', Config::get('constants.status_eventos'), null, [
                            'class' => 'form-control ' . ($errors->has('status') ? 'is-invalid' : ''),
                            'placeholder' => __('labels.acoes.selecione'),
                            'autocomplete' => 'off',
                        ]) }}
                        @if ($errors->has('status'))
                            <div class="invalid-feedback">
                                {{ $errors->first('status') }}
                            </div>
                        @endif
                    </div>
                </div>

                <div class="col-sm-2">
                    <div class="form-group">
                        {{ Form::label('publicado', __('labels.publicado_site')) }}
                        {{ Form::select('publicado', Config::get('constants.boolean'), null, [
                            'class' => 'form-control ' . ($errors->has('publicado') ? 'is-invalid' : ''),
                            'placeholder' => __('labels.acoes.selecione'),
                            'autocomplete' => 'off',
                        ]) }}
                        @if ($errors->has('publicado'))
                            <div class="invalid-feedback">
                                {{ $errors->first('publicado') }}
                            </div>
                        @endif
                    </div>
                </div>

                <div class="col-sm-3">
                    <div class="form-group">
                        {{ Form::label('proposicao', __('labels.proposicao')) }}
                        {{ Form::text('proposicao', null, [
                            'class' => 'form-control ' . ($errors->has('proposicao') ? 'is-invalid' : ''),
                            'placeholder' => __('labels.proposicao'),
                            'autocomplete' => 'off',
                        ]) }}
                        @if ($errors->has('proposicao'))
                            <div class="invalid-feedback">
                                {{ $errors->first('proposicao') }}
                            </div>
                        @endif
                    </div>
                </div>

                <div class="col-sm-2">
                    <div class="form-group">
                        {{ Form::label('transmissao', __('labels.transmissao')) }}
                        {{ Form::select('transmissao', Config::get('constants.boolean'), null, [
                            'class' => 'form-control ' . ($errors->has('transmissao') ? 'is-invalid' : ''),
                            'placeholder' => __('labels.acoes.selecione'),
                            'autocomplete' => 'off',
                        ]) }}
                        @if ($errors->has('transmissao'))
                            <div class="invalid-feedback">
                                {{ $errors->first('transmissao') }}
                            </div>
                        @endif
                    </div>
                </div>
                <div class="col-sm-12 mb-4">
                    <div class="checkbox-wrapper">
                        <div class="row">
                            <div class="col-12 mb-3">
                                <h5 class="mb-3">Recorrência do Evento</h5>
                                <div class="form-check mb-2">
                                    <label class="form-check-label">
                                        {{ Form::checkbox('is_recurring', 1, null, ['class' => 'form-check-input', 'id' => 'is_recurring']) }}
                                        <span>Este é um evento recorrente</span>
                                    </label>
                                </div>
                            </div>

                            <div class="col-12" id="recurrence_options" style="display: none;">
                                <div class="row">
                                    <div class="col-sm-4">
                                        <div class="form-group">
                                            {{ Form::label('recurrence_type', 'Tipo de Recorrência') }}
                                            {{ Form::select(
                                                'recurrence_type',
                                                [
                                                    '1' => 'Diária',
                                                    '2' => 'Semanal',
                                                    '3' => 'Mensal',
                                                ],
                                                null,
                                                [
                                                    'class' => 'form-control',
                                                    'placeholder' => 'Selecione o tipo',
                                                ],
                                            ) }}
                                        </div>
                                    </div>

                                    <div class="col-sm-4">
                                        <div class="form-group">
                                            <label for="recurrence_start">Início da Recorrência</label>
                                            <input type="date" id="recurrence_start" name="recurrence_start"
                                                class="form-control" placeholder="Data de início" autocomplete="off"
                                                value="{{ old('recurrence_start') ?? (isset($model->recurrence_start) ? $model->recurrence_start->format('Y-m-d') : '') }}">
                                        </div>
                                    </div>

                                    <div class="col-sm-4">
                                        <div class="form-group">
                                            <label for="recurrence_end">Fim da Recorrência</label>
                                            <input type="date" id="recurrence_end" name="recurrence_end"
                                                class="form-control" placeholder="Data de término" autocomplete="off"
                                                value="{{ old('recurrence_end') ?? (isset($model->recurrence_end) ? $model->recurrence_end->format('Y-m-d') : '') }}">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-sm-12">
                    <div class="form-group">
                        {{ Form::label('descricao', __('labels.descricao')) }}
                        {{ Form::textarea('descricao', null, [
                            'class' => 'form-control ' . ($errors->has('descricao') ? 'is-invalid' : ''),
                            'placeholder' => __('labels.descricao'),
                        ]) }}
                        @if ($errors->has('descricao'))
                            <div class="invalid-feedback">
                                {{ $errors->first('descricao') }}
                            </div>
                        @endif
                    </div>
                </div>

                <div class="col-sm-12 mb-3">
                    <hr>
                    <div class="section-title text-center mb-4">
                        <h5>@lang('labels.informacoes_internas')</h5>
                    </div>

                    <div class="checkbox-wrapper {{ $errors->has('responsaveis') ? 'has-error' : '' }}">
                        <h5 class="mb-3">@choice('labels.responsaveis', 0)</h5>
                        @if ($errors->has('responsaveis'))
                            <div class="invalid-feedback d-block mb-2">
                                {{ $errors->first('responsaveis') }}
                            </div>
                        @endif

                        <div class="row">
                            @if ($responsaveis->count() > 0)
                                @foreach ($responsaveis as $responsavel)
                                    <div class="col-6 col-md-3">
                                        <div class="form-check">
                                            <label class="form-check-label">
                                                {{ Form::checkbox('responsaveis[]', $responsavel->id, null, ['class' => 'form-check-input']) }}
                                                <span>{{ $responsavel->name }}</span>
                                            </label>
                                        </div>
                                    </div>
                                @endforeach
                            @else
                                <div class="col-12">
                                    <p class="text-muted">Nenhum usuário cadastrado</p>
                                </div>
                            @endif
                        </div>
                    </div>
                </div>

                <div class="col-sm-12">
                    <div class="form-group">
                        {{ Form::label('observacoes', __('Observações')) }}
                        {{ Form::textarea('observacoes', null, [
                            'class' => 'form-control',
                            'placeholder' => __('Observações'),
                        ]) }}
                    </div>
                </div>
                <div class="col-sm-12">
                    <div class="form-group">
                        {{ Form::label('comentarios', __('labels.comentarios')) }}
                        {{ Form::textarea('comentarios', null, [
                            'class' => 'form-control',
                            'placeholder' => __('labels.comentarios'),
                        ]) }}
                    </div>
                </div>
            </div>

            <div class="text-center mt-4">
                <a href="{{ route('publicador.agenda_2.index') }}" class="btn btn-danger cancel-edit">
                    <i class="fas fa-times"></i>
                    @lang('labels.acoes.cancelar')
                </a>
                {{ Form::button('<i class="fas fa-save"></i> ' . __('labels.acoes.salvar'), [
                    'type' => 'submit',
                    'class' => 'btn btn-success',
                ]) }}
            </div>

            {!! Form::close() !!}
        </div>
    </div>

    @if (session('show-conflito-modal'))
        <div class="modal fade" id="conflito-modal" tabindex="-1" role="dialog">
            <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">
                            <i class="fas fa-exclamation-triangle"></i>
                            Conflito de Agendamento Detectado
                        </h5>
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="row">
                            <div class="col-12">
                                <div class="comparison-container">
                                    <div class="event-details">
                                        <div class="event-card current-event">
                                            <h6 class="card-title">
                                                <i class="fas fa-calendar-plus"></i>
                                                Evento que você está tentando agendar
                                            </h6>
                                            <div class="card-body">
                                                <ul class="event-info-list">
                                                    <li>
                                                        <i class="fas fa-heading"></i>
                                                        <span class="label">Título:</span>
                                                        <span class="value">{{ old('titulo') }}</span>
                                                    </li>
                                                    <li>
                                                        <i class="fas fa-map-marker-alt"></i>
                                                        <span class="label">Local:</span>
                                                        <span class="value">{{ session('evento-conflito.local') }}</span>
                                                    </li>
                                                    <li>
                                                        <i class="fas fa-clock"></i>
                                                        <span class="label">Início:</span>
                                                        <span
                                                            class="value">{{ !empty(old('data_evento')) ? \Carbon\Carbon::parse(old('data_evento'))->format('d/m/Y H:i') : '' }}</span>
                                                    </li>
                                                    <li>
                                                        <i class="fas fa-clock"></i>
                                                        <span class="label">Término:</span>
                                                        <span
                                                            class="value">{{ !empty(old('DataTermino')) ? \Carbon\Carbon::parse(old('DataTermino'))->format('d/m/Y H:i') : '' }}</span>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>

                                        <div class="conflict-icon">
                                            <i class="fas fa-exchange-alt"></i>
                                        </div>

                                        <div class="event-card existing-event">
                                            <h6 class="card-title">
                                                <i class="fas fa-calendar-check"></i>
                                                Evento já agendado
                                            </h6>
                                            <div class="card-body">
                                                <ul class="event-info-list">
                                                    <li>
                                                        <i class="fas fa-heading"></i>
                                                        <span class="label">Título:</span>
                                                        <span
                                                            class="value">{{ session('evento-conflito.titulo') }}</span>
                                                    </li>
                                                    <li>
                                                        <i class="fas fa-map-marker-alt"></i>
                                                        <span class="label">Local:</span>
                                                        <span class="value">{{ session('evento-conflito.local') }}</span>
                                                    </li>
                                                    <li>
                                                        <i class="fas fa-clock"></i>
                                                        <span class="label">Início:</span>
                                                        <span
                                                            class="value">{{ !empty(session('evento-conflito.data_evento'))
                                                                ? \Carbon\Carbon::parse(session('evento-conflito.data_evento'))->format('d/m/Y H:i')
                                                                : '' }}</span>
                                                    </li>
                                                    <li>
                                                        <i class="fas fa-clock"></i>
                                                        <span class="label">Término:</span>
                                                        <span class="value">
                                                            @if (session('evento-conflito.DataTermino'))
                                                                {{ \Carbon\Carbon::parse(session('evento-conflito.DataTermino'))->format('d/m/Y H:i') }}
                                                            @else
                                                                {{ \Carbon\Carbon::parse(session('evento-conflito.data_evento'))->addHour()->format('d/m/Y H:i') }}
                                                            @endif
                                                        </span>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>

                                    @if (session('evento-conflito.recorrente'))
                                        <div class="recurrence-info">
                                            <i class="fas fa-sync-alt"></i>
                                            <strong>Evento Recorrente:</strong>
                                            <span>Data da Recorrência:
                                                {{ session('evento-conflito.data_recorrencia') }}</span>
                                        </div>
                                    @endif

                                    <div class="confirmation-message">
                                        <i class="fas fa-question-circle"></i>
                                        <p>
                                            Foi detectado um conflito de horário entre os eventos.
                                            Deseja prosseguir com o agendamento mesmo assim?
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">
                            <i class="fas fa-times"></i>
                            Cancelar
                        </button>
                        <form method="POST" action="{{ route('publicador.agenda_2.salvar') }}" class="d-inline">
                            @csrf
                            @if (request()->isMethod('put'))
                                @method('PUT')
                            @endif
                            @foreach (old() as $key => $value)
                                @if (is_array($value))
                                    @foreach ($value as $item)
                                        <input type="hidden" name="{{ $key }}[]" value="{{ $item }}">
                                    @endforeach
                                @else
                                    <input type="hidden" name="{{ $key }}" value="{{ $value }}">
                                @endif
                            @endforeach
                            <input type="hidden" name="ignorar_conflito" value="1">
                            <button type="submit" class="btn btn-warning">
                                <i class="fas fa-exclamation-triangle"></i>
                                Prosseguir Mesmo Assim
                            </button>
                        </form>
                    </div>
                </div>
            </div>
        </div>

        <style>
            #conflito-modal .modal-content {
                border: none;
                border-radius: 1rem;
                box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
            }

            #conflito-modal .modal-header {
                background: #f8f9fa;
                border-bottom: 1px solid #edf2f7;
                border-radius: 1rem 1rem 0 0;
                padding: 1.5rem;
            }

            #conflito-modal .modal-title {
                font-size: 1.25rem;
                color: #2d3748;
                display: flex;
                align-items: center;
                gap: 0.75rem;
            }

            #conflito-modal .modal-title i {
                color: #eab308;
                font-size: 1.5rem;
            }

            #conflito-modal .modal-body {
                padding: 2rem;
                background: #ffffff;
            }

            .comparison-container {
                background: #f8fafc;
                border-radius: 0.75rem;
                padding: 2rem;
            }

            .event-details {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 1.5rem;
                margin-bottom: 2rem;
            }

            .event-card {
                flex: 1;
                background: white;
                border-radius: 0.75rem;
                box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
                overflow: hidden;
            }

            .event-card .card-title {
                margin: 0;
                padding: 1rem;
                background: #f1f5f9;
                color: #475569;
                font-size: 1rem;
                display: flex;
                align-items: center;
                gap: 0.5rem;
            }

            .current-event .card-title {
                background: #0ea5e9;
                color: white;
            }

            .existing-event .card-title {
                background: #f97316;
                color: white;
            }

            .event-card .card-body {
                padding: 1.5rem;
            }

            .event-info-list {
                list-style: none;
                padding: 0;
                margin: 0;
            }

            .event-info-list li {
                display: flex;
                align-items: flex-start;
                margin-bottom: 1rem;
                padding-bottom: 1rem;
                border-bottom: 1px solid #e2e8f0;
            }

            .event-info-list li:last-child {
                margin-bottom: 0;
                padding-bottom: 0;
                border-bottom: none;
            }

            .event-info-list i {
                width: 20px;
                margin-right: 0.75rem;
                color: #64748b;
            }

            .event-info-list .label {
                font-weight: 600;
                color: #475569;
                margin-right: 0.5rem;
            }

            .event-info-list .value {
                color: #64748b;
            }

            .conflict-icon {
                display: flex;
                align-items: center;
                justify-content: center;
                width: 40px;
                height: 40px;
                background: #fee2e2;
                border-radius: 50%;
            }

            .conflict-icon i {
                color: #ef4444;
                font-size: 1.25rem;
            }

            .recurrence-info {
                background: #eff6ff;
                padding: 1rem;
                border-radius: 0.5rem;
                margin-bottom: 1.5rem;
                display: flex;
                align-items: center;
                gap: 0.75rem;
            }

            .recurrence-info i {
                color: #3b82f6;
            }

            .confirmation-message {
                background: #fff7ed;
                padding: 1.5rem;
                border-radius: 0.5rem;
                display: flex;
                align-items: flex-start;
                gap: 1rem;
            }

            .confirmation-message i {
                color: #f97316;
                font-size: 1.25rem;
                margin-top: 0.25rem;
            }

            .confirmation-message p {
                margin: 0;
                color: #7c2d12;
            }

            #conflito-modal .modal-footer {
                background: #f8f9fa;
                border-top: 1px solid #edf2f7;
                border-radius: 0 0 1rem 1rem;
                padding: 1.5rem;
            }

            #conflito-modal .btn {
                padding: 0.75rem 1.5rem;
                font-weight: 500;
                display: inline-flex;
                align-items: center;
                gap: 0.5rem;
            }

            #conflito-modal .btn i {
                font-size: 1rem;
            }

            #conflito-modal .btn-warning {
                background: #eab308;
                border-color: #eab308;
                color: white;
            }

            #conflito-modal .btn-warning:hover {
                background: #ca8a04;
                border-color: #ca8a04;
            }

            @media (max-width: 768px) {
                .event-details {
                    flex-direction: column;
                }

                .event-card {
                    width: 100%;
                }

                .conflict-icon {
                    transform: rotate(90deg);
                    margin: 1rem 0;
                }
            }
        </style>

        <script>
            $(document).ready(function() {
                @if (session('show-conflito-modal'))
                    $('#conflito-modal').modal({
                        backdrop: 'static',
                        keyboard: false,
                        show: true
                    });
                @endif
            });
        </script>
    @endif

    @include('layouts.publicador.tinymce')
    <style>
        :root {
            --primary-color: #2563eb;
            --primary-hover: #1d4ed8;
            --secondary-color: #64748b;
            --success-color: #22c55e;
            --warning-color: #eab308;
            --info-color: #0ea5e9;
            --danger-color: #ef4444;
            --border-radius: 0.5rem;
            --box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
            --transition: all 0.3s ease;
        }

        .content-wrapper {
            background: #fff;
            border-radius: var(--border-radius);
            box-shadow: var(--box-shadow);
            padding: 2rem;
            margin: 2rem auto;
            animation: fadeIn 0.5s ease-out;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(10px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .form-header {
            margin-bottom: 2rem;
            padding-bottom: 1rem;
            border-bottom: 2px solid #f1f5f9;
            position: relative;
        }

        .form-header::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 0;
            width: 100px;
            height: 2px;
            background: var(--primary-color);
            animation: slideRight 0.5s ease-out forwards;
        }

        @keyframes slideRight {
            from {
                width: 0;
            }

            to {
                width: 100px;
            }
        }

        .form-header h4 {
            color: #1e293b;
            font-weight: 600;
            margin: 0;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .form-header small {
            color: var(--secondary-color);
            font-size: 0.875rem;
            margin-left: 0.5rem;
            opacity: 0.8;
        }

        .form-group {
            margin-bottom: 1.5rem;
        }

        .form-group label {
            display: block;
            margin-bottom: 0.5rem;
            color: #1e293b;
            font-weight: 500;
            font-size: 0.9rem;
        }

        .form-control {
            display: block;
            width: 100%;
            padding: 0rem 1rem;
            font-size: 0.9rem;
            line-height: 1.5;
            color: #1e293b;
            background-color: #fff;
            border: 1px solid #e2e8f0;
            border-radius: var(--border-radius);
            transition: var(--transition);
        }

        .form-control:focus {
            border-color: var(--primary-color);
            box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
            outline: none;
        }

        .form-control.is-invalid {
            border-color: var(--danger-color);
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ef4444' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ef4444' stroke='none'/%3e%3c/svg%3e");
            background-repeat: no-repeat;
            background-position: right 0.75rem center;
            background-size: 1rem;
            padding-right: 2.5rem;
        }

        .invalid-feedback {
            display: block;
            margin-top: 0.25rem;
            font-size: 0.875rem;
            color: var(--danger-color);
        }

        /* Select Fields */
        select.form-control {
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
            background-repeat: no-repeat;
            background-position: right 0.75rem center;
            background-size: 16px 12px;
            padding-right: 2.5rem;
            appearance: none;
        }

        /* Date Fields */
        .data-hora {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23666'%3E%3Cpath fill-rule='evenodd' d='M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z' clip-rule='evenodd'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 0.75rem center;
            background-size: 1.25rem;
            padding-right: 2.5rem;
        }

        /* Checkboxes */
        .checkbox-wrapper {
            background: #f8fafc;
            border-radius: var(--border-radius);
            padding: 1.5rem;
            margin: 1rem 0;
            border: 1px solid #e2e8f0;
        }

        .checkbox-wrapper.has-error {
            border-color: var(--danger-color);
            background-color: rgba(239, 68, 68, 0.05);
        }

        .form-check-label {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.5rem;
            margin: 0;
            cursor: pointer;
            transition: var(--transition);
            border-radius: 0.375rem;
        }

        .form-check-label:hover {
            background-color: rgba(0, 0, 0, 0.02);
        }

        input[type="checkbox"] {
            width: 1.125rem;
            height: 1.125rem;
            border-radius: 0.25rem;
            border: 2px solid #cbd5e1;
            transition: var(--transition);
            cursor: pointer;
        }

        input[type="checkbox"]:checked {
            background-color: var(--primary-color);
            border-color: var(--primary-color);
        }

        /* Botões */
        .btn {
            padding: 0.625rem 1.5rem;
            font-weight: 500;
            border-radius: 0.375rem;
            transition: var(--transition);
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
        }

        .btn:hover {
            transform: translateY(-1px);
        }

        .btn-success {
            background-color: var(--success-color);
            border-color: var(--success-color);
            color: white;
        }

        .btn-success:hover {
            background-color: #16a34a;
            border-color: #16a34a;
            box-shadow: 0 4px 6px -1px rgba(34, 197, 94, 0.1), 0 2px 4px -1px rgba(34, 197, 94, 0.06);
        }

        .btn-danger {
            background-color: var(--danger-color);
            border-color: var(--danger-color);
            color: white;
        }

        .btn-danger:hover {
            background-color: #dc2626;
            border-color: #dc2626;
            box-shadow: 0 4px 6px -1px rgba(239, 68, 68, 0.1), 0 2px 4px -1px rgba(239, 68, 68, 0.06);
        }

        /* Separadores */
        hr {
            margin: 2rem 0;
            border: 0;
            border-top: 1px solid #e2e8f0;
        }

        /* Alertas */
        .alert {
            border: none;
            border-radius: var(--border-radius);
            padding: 1rem 1.5rem;
            margin-bottom: 1.5rem;
            display: flex;
            align-items: center;
            gap: 1rem;
            animation: slideDown 0.3s ease-out;
        }

        @keyframes slideDown {
            from {
                opacity: 0;
                transform: translateY(-10px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .alert-danger {
            background-color: rgba(239, 68, 68, 0.15);
            color: var(--danger-color);
            border-left: 4px solid var(--danger-color);
        }

        /* Responsividade */
        @media (max-width: 768px) {
            .content-wrapper {
                padding: 1.5rem;
                margin: 1rem;
            }

            .form-check-label {
                font-size: 0.875rem;
            }

            .btn {
                width: 100%;
                justify-content: center;
                margin: 0.5rem 0;
            }
        }

        /* Editor TinyMCE */
        .tox-tinymce {
            border-radius: var(--border-radius) !important;
            border-color: #e2e8f0 !important;
        }

        .tox .tox-toolbar__group {
            padding: 0 4px !important;
        }

        .tox .tox-tbtn {
            border-radius: 0.25rem !important;
            transition: var(--transition) !important;
        }

        .tox .tox-tbtn:hover {
            background-color: #f1f5f9 !important;
        }

        .tox .tox-tbtn--enabled,
        .tox .tox-tbtn--enabled:hover {
            background-color: var(--primary-color) !important;
            color: white !important;
        }
    </style>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const dataEventoInput = document.querySelector('input[name="data_evento"]');
            const dataTerminoInput = document.querySelector('input[name="DataTermino"]');

            function validateAndSyncDateTime() {
                if (!dataEventoInput.value) return;

                // Converter o valor do datetime-local para um objeto moment
                const startDateTime = moment(dataEventoInput.value); // Formato ISO
                if (!startDateTime.isValid()) return;

                let endDateTime;
                if (!dataTerminoInput.value) {
                    // Se não houver valor final, define como 1 hora após o início
                    endDateTime = moment(startDateTime).add(1, 'hour');
                } else {
                    const endValue = moment(dataTerminoInput.value);
                    const endHour = endValue.hour();
                    const endMinute = endValue.minute();

                    endDateTime = moment(startDateTime)
                        .hour(endHour)
                        .minute(endMinute);

                    if (endDateTime.isBefore(startDateTime)) {
                        endDateTime = moment(startDateTime).add(1, 'hour');
                        Swal.fire({
                            icon: 'warning',
                            title: 'Ajuste automático',
                            text: 'O horário de término deve ser posterior ao horário de início. Foi ajustado automaticamente para 1 hora após o início.',
                            confirmButtonText: 'Ok',
                            confirmButtonColor: '#3085d6'
                        });
                    }
                }

                dataTerminoInput.value = endDateTime.format('YYYY-MM-DD[T]HH:mm');
            }

            if (dataEventoInput && dataTerminoInput) {
                dataEventoInput.addEventListener('change', validateAndSyncDateTime);

                dataTerminoInput.addEventListener('change', function() {
                    validateAndSyncDateTime();
                });

                dataTerminoInput.addEventListener('input', function() {
                    validateAndSyncDateTime();
                });

                if (dataEventoInput.value) {
                    validateAndSyncDateTime();
                }
            }
        });
        document.addEventListener('DOMContentLoaded', function() {
            tinymce.init({
                selector: 'textarea:not([name="observacoes"])',
                language: 'pt_BR',
                menubar: false,
                branding: false,
                plugins: [
                    'advlist autolink lists link charmap anchor',
                    'visualblocks code paste help wordcount'
                ],
                toolbar: [
                    'undo redo | formatselect | bold italic underline | alignleft aligncenter alignright alignjustify',
                    'link unlink | bullist numlist | outdent indent | removeformat help'
                ],
                content_style: `
                    body {
                        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
                        font-size: 14px;
                        line-height: 1.5;
                    }
                `,
                height: 300,
                paste_retain_style_properties: 'color font-size font-weight font-style',
                valid_elements: 'a[href|target],ul,ol,li,strike,strong/b,em/i,u,br,p[style],hr[width|size|noshade],span[style|id]',
                skin: 'oxide',
                paste_word_valid_elements: 'b,strong,i,em,h1,h2,h3,p,br',
                browser_spellcheck: true,
                contextmenu: false,
                setup: function(editor) {
                    editor.on('change', function() {
                        editor.save();
                    });
                }
            });

            function validarDatasEvento(dataEvento, dataTermino) {
                if (dataEvento && dataTermino) {
                    const inicio = moment(dataEvento, 'DD/MM/YYYY HH:mm');
                    const fim = moment(dataTermino, 'DD/MM/YYYY HH:mm');

                    if (inicio.isValid() && fim.isValid() && inicio > fim) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro na data!',
                            text: 'A data de início do evento não pode ser posterior à data de término do evento!',
                            confirmButtonText: 'Ok',
                            confirmButtonColor: '#3085d6'
                        });
                        return false;
                    }
                }
                return true;
            }

            function validarDatasRecorrencia(inicioRec, fimRec) {
                if (inicioRec && fimRec) {
                    const inicio = moment(inicioRec); // Formato YYYY-MM-DD
                    const fim = moment(fimRec); // Formato YYYY-MM-DD
                    const dataEvento = moment(document.querySelector('input[name="data_evento"]')
                        .value); // Formato YYYY-MM-DDTHH:mm

                    console.log('Início Rec:', inicio.format('YYYY-MM-DD'));
                    console.log('Fim Rec:', fim.format('YYYY-MM-DD'));
                    console.log('Data Evento:', dataEvento.format('YYYY-MM-DD'));

                    if (!inicio.isValid() || !fim.isValid() || !dataEvento.isValid()) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro na data!',
                            text: 'Datas inválidas!',
                            confirmButtonText: 'Ok',
                            confirmButtonColor: '#3085d6'
                        });
                        return false;
                    }

                    // Compara apenas as datas, ignorando as horas
                    if (inicio.isBefore(dataEvento, 'day')) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro na data!',
                            text: 'A data de início da recorrência não pode ser anterior à data do evento!',
                            confirmButtonText: 'Ok',
                            confirmButtonColor: '#3085d6'
                        });
                        // Ajusta a data de início para ser igual à data do evento
                        document.querySelector('#recurrence_start').value = dataEvento.format('YYYY-MM-DD');
                        return false;
                    }

                    if (fim.isBefore(dataEvento, 'day')) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro na data!',
                            text: 'A data de fim da recorrência não pode ser anterior à data do evento!',
                            confirmButtonText: 'Ok',
                            confirmButtonColor: '#3085d6'
                        });
                        // Ajusta a data de fim para ser igual à data do evento
                        document.querySelector('#recurrence_end').value = dataEvento.format('YYYY-MM-DD');
                        return false;
                    }

                    if (inicio.isAfter(fim)) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro na data!',
                            text: 'A data de início da recorrência não pode ser posterior à data de fim da recorrência!',
                            confirmButtonText: 'Ok',
                            confirmButtonColor: '#3085d6'
                        });
                        // Ajusta a data de fim para ser igual à data de início
                        document.querySelector('#recurrence_end').value = inicio.format('YYYY-MM-DD');
                        return false;
                    }
                }
                return true;
            }

            // Adicionar evento para quando a data do evento mudar
            document.querySelector('input[name="data_evento"]').addEventListener('change', function() {
                const isRecurringCheckbox = document.getElementById('is_recurring');
                if (isRecurringCheckbox && isRecurringCheckbox.checked) {
                    const recurrenceStart = document.querySelector('#recurrence_start');
                    const recurrenceEnd = document.querySelector('#recurrence_end');

                    // Quando a data do evento mudar, ajusta as datas de recorrência se necessário
                    const dataEvento = moment(this.value);
                    if (dataEvento.isValid()) {
                        const dataEventoStr = dataEvento.format('YYYY-MM-DD');
                        recurrenceStart.min = dataEventoStr;
                        recurrenceEnd.min = dataEventoStr;

                        // Se as datas de recorrência forem anteriores à nova data do evento, ajusta-as
                        if (moment(recurrenceStart.value).isBefore(dataEvento, 'day')) {
                            recurrenceStart.value = dataEventoStr;
                        }
                        if (moment(recurrenceEnd.value).isBefore(dataEvento, 'day')) {
                            recurrenceEnd.value = dataEventoStr;
                        }
                    }
                }
            });
            const isRecurringCheckbox = document.getElementById('is_recurring');
            const recurrenceOptions = document.getElementById('recurrence_options');

            if (isRecurringCheckbox && recurrenceOptions) {
                const recurrenceStart = document.querySelector('#recurrence_start');
                const recurrenceEnd = document.querySelector('#recurrence_end');
                const dataEvento = document.querySelector('input[name="data_evento"]');

                // Validar quando a data do evento mudar
                dataEvento.addEventListener('change', function() {
                    if (isRecurringCheckbox.checked) {
                        validarDatasRecorrencia(recurrenceStart.value, recurrenceEnd.value);
                    }
                });

                // Validar quando as datas de recorrência mudarem
                recurrenceStart.addEventListener('change', function() {
                    if (isRecurringCheckbox.checked) {
                        validarDatasRecorrencia(recurrenceStart.value, recurrenceEnd.value);
                    }
                });

                recurrenceEnd.addEventListener('change', function() {
                    if (isRecurringCheckbox.checked) {
                        validarDatasRecorrencia(recurrenceStart.value, recurrenceEnd.value);
                    }
                });

                isRecurringCheckbox.addEventListener('change', function() {
                    if (this.checked) {
                        recurrenceOptions.style.display = 'block';
                        recurrenceOptions.style.opacity = '0';
                        setTimeout(() => {
                            recurrenceOptions.style.transition = 'opacity 0.3s ease';
                            recurrenceOptions.style.opacity = '1';
                            $('.menu-lateral nav').height($(document).height());
                        }, 10);
                    } else {
                        recurrenceOptions.style.transition = 'opacity 0.3s ease';
                        recurrenceOptions.style.opacity = '0';
                        setTimeout(() => {
                            $('.menu-lateral nav').height($(document).height());
                            recurrenceOptions.style.display = 'none';
                        }, 300);
                    }
                });

                if (isRecurringCheckbox.checked) {
                    recurrenceOptions.style.display = 'block';
                    recurrenceOptions.style.opacity = '1';
                }
            }

            const localSelect = document.querySelector('#local_id');
            const localInput = document.querySelector('#local');

            if (localSelect) {
                function updateLocalInput() {
                    if (localInput) {
                        localInput.disabled = !(localSelect.value === '12' || localSelect.value === '15' ||
                            localSelect.value === '16');
                    }
                }
                localSelect.addEventListener('change', updateLocalInput);
                updateLocalInput();
            }

            const dataTermino = document.querySelector('input#DataTermino');
            if (dataTermino && dataTermino.value === '30/11/-0001 00:00') {
                dataTermino.value = '';
            }

            if (window.jQuery) {
                $(document).ready(function() {
                    if (typeof session !== 'undefined' && session('show-conflito-modal')) {
                        $('#conflito-modal').modal({
                            backdrop: 'static',
                            keyboard: false,
                            show: true
                        });
                    }
                });
            }

            const form = document.querySelector('.form-edit');
            if (form) {
                form.addEventListener('submit', function(e) {
                    e.preventDefault();

                    const dataEvento = document.querySelector('input[name="data_evento"]').value;
                    const dataTermino = document.querySelector('input[name="DataTermino"]').value;
                    const inicioRec = document.querySelector('input[name="recurrence_start"]').value;
                    const fimRec = document.querySelector('input[name="recurrence_end"]').value;

                    if (!validarDatasEvento(dataEvento, dataTermino)) {
                        return false;
                    }

                    if (isRecurringCheckbox && isRecurringCheckbox.checked) {
                        if (!validarDatasRecorrencia(inicioRec, fimRec)) {
                            return false;
                        }
                    }

                    const publicado = this.querySelector('#publicado');
                    if (publicado && publicado.value === '1') {
                        if (!confirm('@lang('labels.msg.deseja_publicar_site')')) {
                            return false;
                        }
                    }

                    this.submit();
                });
            }
        });
    </script>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const tipoSelect = document.querySelector('select[name="tipo"]');
            const tituloInput = document.querySelector('input[name="titulo"]');

            tipoSelect.addEventListener('change', function() {
                const selectedValue = this.value;
                const currentTitulo = tituloInput.value;

                if (selectedValue) {
                    const cleanTitulo = currentTitulo.replace(/^.*? - /, '').trim();
                    if (!cleanTitulo) {
                        tituloInput.value = `${selectedValue} - `;
                    } else {
                        tituloInput.value = `${selectedValue} - ${cleanTitulo}`;
                    }
                }
            });
        });

        document.addEventListener('DOMContentLoaded', function() {
            const WARNING_TIME = 25 * 60 * 1000; // 25 minutos
            const MAX_TIME = 30 * 60 * 1000; // 30 minutos
            const INACTIVITY_TIME = 2 * 60 * 1000; // 2 minutos
            const REFRESH_INTERVAL = 5000; // 5 segundos
            const eventId = '{{ $model->id ?? 0 }}';
            let lastActivity = Date.now();
            let timeoutWarning, timeoutExpire, inactivityCheck;

            // Função para destruir o TinyMCE antes de sair
            function destroyTinyMCE() {
                if (window.tinymce) {
                    try {
                        tinymce.remove();
                    } catch (e) {
                        console.error('Erro ao destruir TinyMCE:', e);
                    }
                }
            }

            // Sistema de refresh periódico do lock
            const refreshInterval = setInterval(() => {
                if (eventId !== '0') {
                    fetch('{{ route('publicador.agenda_2.refresh-edit-lock', ['id' => '__ID__']) }}'
                        .replace('__ID__', eventId), {
                            method: 'POST',
                            headers: {
                                'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')
                                    .content
                            }
                        }).catch(error => {
                        console.error('Erro ao atualizar lock:', error);
                        clearInterval(refreshInterval);
                    });
                }
            }, REFRESH_INTERVAL);

            // Monitoramento de atividade do usuário
            document.addEventListener('mousemove', resetTimers);
            document.addEventListener('keypress', resetTimers);
            document.addEventListener('click', resetTimers);
            document.addEventListener('scroll', resetTimers);

            function resetTimers() {
                lastActivity = Date.now();
                clearTimeout(inactivityCheck);
                inactivityCheck = setTimeout(checkInactivity, INACTIVITY_TIME);
            }

            function checkInactivity() {
                if (eventId === '0') return;

                Swal.fire({
                    title: 'Sessão Inativa',
                    text: 'Sua sessão será encerrada por inatividade',
                    icon: 'warning',
                    confirmButtonText: 'Continuar',
                    allowOutsideClick: false,
                    allowEscapeKey: false
                }).then((result) => {
                    if (result.isConfirmed) {
                        resetTimers();
                        fetch('{{ route('publicador.agenda_2.refresh-edit-lock', ['id' => '__ID__']) }}'
                            .replace('__ID__', eventId), {
                                method: 'POST',
                                headers: {
                                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')
                                        .content
                                }
                            }).catch(error => {
                            console.error('Erro ao atualizar lock após inatividade:', error);
                            cleanupAndRedirect();
                        });
                    }
                });
            }

            // Controle do tempo de edição
            if (eventId !== '0') {
                timeoutWarning = setTimeout(showTimeWarning, WARNING_TIME);
                timeoutExpire = setTimeout(expireSession, MAX_TIME);
            }

            function showTimeWarning() {
                Swal.fire({
                    title: 'Tempo Restante',
                    html: 'Você tem 5 minutos restantes.<br>Deseja estender o tempo?',
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonText: 'Sim, continuar',
                    cancelButtonText: 'Sair',
                    allowOutsideClick: false,
                    allowEscapeKey: false
                }).then((result) => {
                    if (result.isConfirmed) {
                        fetch('{{ route('publicador.agenda_2.extend-edit-lock', ['id' => '__ID__']) }}'
                            .replace('__ID__', eventId), {
                                method: 'POST',
                                headers: {
                                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')
                                        .content
                                }
                            }).then(response => {
                            if (response.ok) {
                                clearTimeout(timeoutWarning);
                                clearTimeout(timeoutExpire);
                                timeoutWarning = setTimeout(showTimeWarning, WARNING_TIME);
                                timeoutExpire = setTimeout(expireSession, MAX_TIME);
                            } else {
                                throw new Error('Falha ao estender o tempo');
                            }
                        }).catch(error => {
                            console.error('Erro ao estender tempo:', error);
                            cleanupAndRedirect();
                        });
                    } else {
                        releaseLockAndRedirect();
                    }
                });
            }

            function expireSession() {
                Swal.fire({
                    title: 'Tempo Esgotado',
                    text: 'Seu tempo de edição acabou',
                    icon: 'error',
                    allowOutsideClick: false,
                    allowEscapeKey: false
                }).then(() => {
                    releaseLockAndRedirect();
                });
            }

            // Gerenciamento do botão cancelar
            const cancelButtons = document.querySelectorAll('.cancel-edit');
            cancelButtons.forEach(button => {
                button.addEventListener('click', function(e) {
                    e.preventDefault();
                    button.disabled = true; // Previne múltiplos clicks

                    if (eventId !== '0') {
                        destroyTinyMCE();
                        cleanup();

                        const formData = new FormData();
                        formData.append('_token', document.querySelector('meta[name="csrf-token"]')
                            .content);

                        fetch('{{ route('publicador.agenda_2.release-edit-lock', ['id' => '__ID__']) }}'
                                .replace('__ID__', eventId), {
                                    method: 'POST',
                                    body: formData
                                })
                            .then(() => {
                                window.location.href =
                                    '{{ route('publicador.agenda_2.index') }}';
                            })
                            .catch((error) => {
                                console.error('Erro ao liberar lock:', error);
                                window.location.href =
                                    '{{ route('publicador.agenda_2.index') }}';
                            });
                    } else {
                        window.location.href = '{{ route('publicador.agenda_2.index') }}';
                    }
                });
            });

            // Função para limpar todos os timers e intervalos
            function cleanup() {
                clearInterval(refreshInterval);
                clearTimeout(timeoutWarning);
                clearTimeout(timeoutExpire);
                clearTimeout(inactivityCheck);
            }

            // Função para limpar e redirecionar
            function cleanupAndRedirect() {
                destroyTinyMCE();
                cleanup();
                window.location.href = '{{ route('publicador.agenda_2.index') }}';
            }

            // Liberar lock ao sair da página
            window.addEventListener('beforeunload', function(e) {
                if (eventId !== '0') {
                    destroyTinyMCE();
                    cleanup();

                    const formData = new FormData();
                    formData.append('_token', document.querySelector('meta[name="csrf-token"]').content);

                    navigator.sendBeacon(
                        '{{ route('publicador.agenda_2.release-edit-lock', ['id' => '__ID__']) }}'
                        .replace('__ID__', eventId),
                        formData
                    );
                }
            });

            // Cleanup final
            window.addEventListener('unload', () => {
                cleanup();
            });
        });
    </script>
@endsection