{{-- Horario laboral primero; transporte opcional con interruptores; dieta dinámica. --}}
@php
    $r = $registro ?? null;

    $filled = static fn ($v) => $v !== null && $v !== '';

    $oldEm = old('entrada_manana', $r?->entrada_manana ? substr($r->entrada_manana, 0, 5) : '');
    $oldSm = old('salida_manana', $r?->salida_manana ? substr($r->salida_manana, 0, 5) : '');
    $oldEt = old('entrada_tarde', $r?->entrada_tarde ? substr($r->entrada_tarde, 0, 5) : '');
    $oldSt = old('salida_tarde', $r?->salida_tarde ? substr($r->salida_tarde, 0, 5) : '');

    $t1a = old('entrada_transporte_1', $r?->entrada_transporte_1 ? substr($r->entrada_transporte_1, 0, 5) : '');
    $t1b = old('salida_transporte_1', $r?->salida_transporte_1 ? substr($r->salida_transporte_1, 0, 5) : '');
    $t2a = old('entrada_transporte_2', $r?->entrada_transporte_2 ? substr($r->entrada_transporte_2, 0, 5) : '');
    $t2b = old('salida_transporte_2', $r?->salida_transporte_2 ? substr($r->salida_transporte_2, 0, 5) : '');

    $hayT1 = $filled($t1a) || $filled($t1b);
    $hayT2 = $filled($t2a) || $filled($t2b);
    $hayTrans = $hayT1 || $hayT2;

    $usarTransBool = old('usar_transporte', $hayTrans ? '1' : '0') === '1';
    $segManBool = old('transporte_seg_manana', $hayT1 ? '1' : '0') === '1';
    $segTarBool = old('transporte_seg_tarde', $hayT2 ? '1' : '0') === '1';

    $tieneTicketPrevio = (bool) ($r?->ticket_dieta_path);
    $paroComerIni = (bool) old('paro_comer', $r?->paro_comer);
    $mostrarBloqueTicket = $tieneTicketPrevio || $paroComerIni;

    $aplicaTopeDietaTicket = Auth::user()->aplicaTopeDietaPorTicketEnRegistro();
    $dietaMaxUsuario = $aplicaTopeDietaTicket ? Auth::user()->dieta_max_importe_dia : null;
    $dietaMaxNum = $dietaMaxUsuario !== null && $dietaMaxUsuario !== '' ? (float) $dietaMaxUsuario : null;
    $dietaFijaMensual = Auth::user()->dieta_fija_mensual_euros;
@endphp

{{-- Vacaciones primero: al marcarla se oculta el detalle de obra (JS + ids registro-*) --}}
@if (Auth::user()->hasAnyRole(['oficina', 'gestor', 'admin']))
    <div class="card border-secondary mb-3" id="bloque-vacaciones-card">
        <div class="card-body py-3">
            <div class="form-check form-switch mb-0">
                <input type="hidden" name="es_vacaciones" value="0">
                <input type="checkbox" class="form-check-input js-registro-horario js-toggle-vacaciones" name="es_vacaciones" value="1" id="es_vacaciones"
                    @checked(old('es_vacaciones', $r?->es_vacaciones))>
                <label class="form-check-label fw-semibold" for="es_vacaciones">Vacaciones</label>
            </div>
            <p class="small text-muted mb-0 mt-2">Día de vacaciones del trabajador: se ocultan horarios, lugar, descripción de obra, materiales y dietas. Use observaciones si necesita una nota.</p>
        </div>
    </div>
@endif

<div id="registro-detalle-jornada">
<div class="mb-3">
    <h6 class="text-muted mb-2">Horas de trabajo</h6>
    <div class="row g-2 mb-1 small text-muted fw-semibold d-none d-lg-flex">
        <div class="col-lg-6">Mañana</div>
        <div class="col-lg-6">Tarde</div>
    </div>
    <div class="row g-2 align-items-end">
        <div class="col-12 col-lg-6">
            <div class="row g-1">
                <div class="col-6">
                    <label class="form-label small mb-0">Entrada mañana</label>
                    <input type="time" name="entrada_manana" class="form-control js-registro-horario" value="{{ $oldEm }}">
                </div>
                <div class="col-6">
                    <label class="form-label small mb-0">Salida mañana</label>
                    <input type="time" name="salida_manana" class="form-control js-registro-horario" value="{{ $oldSm }}">
                </div>
            </div>
        </div>
        <div class="col-12 col-lg-6">
            <div class="row g-1">
                <div class="col-6">
                    <label class="form-label small mb-0">Entrada tarde</label>
                    <input type="time" name="entrada_tarde" class="form-control js-registro-horario" value="{{ $oldEt }}">
                </div>
                <div class="col-6">
                    <label class="form-label small mb-0">Salida tarde</label>
                    <input type="time" name="salida_tarde" class="form-control js-registro-horario" value="{{ $oldSt }}">
                </div>
            </div>
        </div>
    </div>
    <p class="small text-muted mb-0 mt-2">Con mañana y tarde partidos, la pausa es el hueco entre salida mañana y entrada tarde (no use el interruptor de «hora de comida» de abajo).</p>
</div>

{{-- Paro para comer + ticket de dieta en la misma tarjeta --}}
<div class="card border-secondary mb-3" id="bloque-paro-comer-card">
    <div class="card-body py-3">
        <div class="form-check form-switch mb-0">
            <input type="hidden" name="paro_comer" value="0">
            <input type="checkbox" class="form-check-input js-registro-horario" name="paro_comer" value="1" id="paro_comer"
                @checked(old('paro_comer', $r?->paro_comer))>
            <label class="form-check-label fw-semibold" for="paro_comer">¿Hora de comida?</label>
        </div>
        <p class="small text-muted mb-0 mt-2">Marque la casilla si utilizo la hora de comida. Si no la utilizo, no marque la casilla.</p>

        <div id="ticket-dieta-wrapper" class="row g-3 mt-3 pt-3 border-top{{ $mostrarBloqueTicket ? '' : ' d-none' }}" data-ticket-previo="{{ $tieneTicketPrevio ? '1' : '0' }}">
            <div class="col-12 col-md-6">
                <label class="form-label" for="ticket_dieta">Ticket de dieta (PDF/imagen)</label>
                <p class="form-text small text-muted mb-1">Opcional: puede adjuntarlo al guardar el registro o más tarde al editarlo.</p>
                <input type="file" name="ticket_dieta" id="ticket_dieta" class="form-control @error('ticket_dieta') is-invalid @enderror" accept=".pdf,.jpg,.jpeg,.png">
                @error('ticket_dieta')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
                @if($r?->ticket_dieta_path)
                    <div class="form-text">Archivo actual: <a href="{{ route('trabajo.registro.ticket-dieta', $r) }}">descargar</a></div>
                    <div class="form-check mt-1">
                        <input type="checkbox" class="form-check-input" id="eliminar_ticket_dieta" name="eliminar_ticket_dieta" value="1">
                        <label class="form-check-label" for="eliminar_ticket_dieta">Eliminar ticket actual</label>
                    </div>
                @endif
                <div class="form-text text-muted mt-1 mb-0">El servidor solo admite el fichero si la jornada cumple las reglas de pausa de comida.</div>
            </div>
            <div class="col-12 col-md-6">
                <label class="form-label" for="importe_dieta">Valor (€)</label>
                <p class="form-text small text-muted mb-1">Obligatorio (mayor que 0) si marca «Hora de comida», aunque aún no adjunte el ticket.</p>
                <input type="number" name="importe_dieta" id="importe_dieta" class="form-control @error('importe_dieta') is-invalid @enderror" step="0.01" min="0.01"
                    value="{{ old('importe_dieta', $r?->importe_dieta !== null && $r?->importe_dieta !== '' ? number_format((float) $r->importe_dieta, 2, '.', '') : '') }}"
                    @if($dietaMaxNum !== null && $dietaMaxNum > 0) max="{{ number_format($dietaMaxNum, 2, '.', '') }}" @endif>
                @if($dietaMaxNum !== null && $dietaMaxNum > 0)
                    <p class="form-text small text-muted mb-0">Máximo permitido en su cuenta: {{ number_format($dietaMaxNum, 2, ',', '.') }}&nbsp;€</p>
                @elseif($dietaFijaMensual !== null && (float) $dietaFijaMensual > 0)
                    <p class="form-text small text-muted mb-0">Tiene dietas fijas mensuales pactadas ({{ number_format((float) $dietaFijaMensual, 2, ',', '.') }}&nbsp;€/mes); no se aplica tope por ticket en este campo.</p>
                @endif
                @error('importe_dieta')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>
        </div>
    </div>
</div>

<p class="small text-muted mb-3">Los festivos (domingos y fechas dadas de alta por oficina/gestión) se aplican solos según la fecha del trabajo.</p>

<div class="card border-secondary mb-3" id="bloque-transporte-card">
    <div class="card-body py-3">
        <div class="form-check form-switch mb-0">
            <input type="hidden" name="usar_transporte" value="0">
            <input type="checkbox" class="form-check-input" name="usar_transporte" value="1" id="usar_transporte"
                @checked($usarTransBool)>
            <label class="form-check-label fw-semibold" for="usar_transporte">¿Registró tiempo de transporte (ida/vuelta no laboral)?</label>
        </div>

        <div id="bloque-transporte-detalles" class="mt-3{{ $usarTransBool ? '' : ' d-none' }}">
            <p class="small text-muted mb-3">Fuera del tiempo en obra / cliente.</p>

            <div class="row g-3">
                <div class="col-12 col-md-6">
                    <div class="form-check mb-2">
                        <input type="hidden" name="transporte_seg_manana" value="0">
                        <input type="checkbox" class="form-check-input js-toggle-transporte-manana" name="transporte_seg_manana" value="1" id="transporte_seg_manana"
                            @checked($segManBool)>
                        <label class="form-check-label" for="transporte_seg_manana">Transporte mañana (ida)</label>
                    </div>
                    <div id="fila-transporte-manana" class="row g-1{{ $usarTransBool && $segManBool ? '' : ' d-none' }}">
                        <div class="col-6">
                            <label class="form-label small mb-0">Inicio</label>
                            <input type="time" name="entrada_transporte_1" id="entrada_transporte_1" class="form-control form-control-sm js-registro-horario js-transporte-input"
                                value="{{ $t1a }}">
                        </div>
                        <div class="col-6">
                            <label class="form-label small mb-0">Fin</label>
                            <input type="time" name="salida_transporte_1" id="salida_transporte_1" class="form-control form-control-sm js-registro-horario js-transporte-input"
                                value="{{ $t1b }}">
                        </div>
                    </div>
                </div>
                <div class="col-12 col-md-6">
                    <div class="form-check mb-2">
                        <input type="hidden" name="transporte_seg_tarde" value="0">
                        <input type="checkbox" class="form-check-input js-toggle-transporte-tarde" name="transporte_seg_tarde" value="1" id="transporte_seg_tarde"
                            @checked($segTarBool)>
                        <label class="form-check-label" for="transporte_seg_tarde">Transporte tarde (vuelta)</label>
                    </div>
                    <div id="fila-transporte-tarde" class="row g-1{{ $usarTransBool && $segTarBool ? '' : ' d-none' }}">
                        <div class="col-6">
                            <label class="form-label small mb-0">Inicio</label>
                            <input type="time" name="entrada_transporte_2" id="entrada_transporte_2" class="form-control form-control-sm js-registro-horario js-transporte-input"
                                value="{{ $t2a }}">
                        </div>
                        <div class="col-6">
                            <label class="form-label small mb-0">Fin</label>
                            <input type="time" name="salida_transporte_2" id="salida_transporte_2" class="form-control form-control-sm js-registro-horario js-transporte-input"
                                value="{{ $t2b }}">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
{{-- /#registro-detalle-jornada --}}

@once
    @push('css')
        <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
        <link href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.min.css" rel="stylesheet" />
    @endpush
    @push('scripts')
        <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/i18n/es.js"></script>
        <script>
(function () {
    const form = document.getElementById('registroForm');
    if (!form) return;

    const usar = document.getElementById('usar_transporte');
    const detalles = document.getElementById('bloque-transporte-detalles');
    const segM = document.getElementById('transporte_seg_manana');
    const segT = document.getElementById('transporte_seg_tarde');
    const filaM = document.getElementById('fila-transporte-manana');
    const filaT = document.getElementById('fila-transporte-tarde');
    const inT1 = document.getElementById('entrada_transporte_1');
    const fiT1 = document.getElementById('salida_transporte_1');
    const inT2 = document.getElementById('entrada_transporte_2');
    const fiT2 = document.getElementById('salida_transporte_2');

    function clearPair(a, b) {
        if (a) a.value = '';
        if (b) b.value = '';
    }

    function syncTransporteUi() {
        const on = usar && usar.checked;
        if (detalles) detalles.classList.toggle('d-none', !on);

        if (!on) {
            if (segM) segM.checked = false;
            if (segT) segT.checked = false;
            clearPair(inT1, fiT1);
            clearPair(inT2, fiT2);
        }

        const mOn = on && segM && segM.checked;
        const tOn = on && segT && segT.checked;
        if (filaM) filaM.classList.toggle('d-none', !mOn);
        if (filaT) filaT.classList.toggle('d-none', !tOn);

        if (!mOn) clearPair(inT1, fiT1);
        if (!tOn) clearPair(inT2, fiT2);
    }

    usar?.addEventListener('change', syncTransporteUi);
    segM?.addEventListener('change', syncTransporteUi);
    segT?.addEventListener('change', syncTransporteUi);

    /**
     * Si «Vacaciones» está activo, oculta lugar, jornada/transporte/dieta y descripción+materiales.
     * Ajusta required de descripción y lugar (solo cuando existe el control de vacaciones).
     */
    function syncVistaVacaciones() {
        const vac = document.getElementById('es_vacaciones');
        const desc = document.getElementById('descripcion_trabajo');
        const lug = document.getElementById('lugar_id');

        if (!vac) {
            if (desc) desc.required = true;
            if (lug) lug.required = true;
            return;
        }

        const on = vac.checked;
        ['registro-bloque-lugar', 'registro-detalle-jornada', 'registro-bloque-descripcion-materiales'].forEach(function (id) {
            const el = document.getElementById(id);
            if (el) el.classList.toggle('d-none', on);
        });

        if (desc) desc.required = !on;
        if (lug) lug.required = !on;

        if (on && usar) {
            usar.checked = false;
            syncTransporteUi();
        }
    }

    /**
     * Ticket de dieta: visible si «¿Hora de comida?» está marcado, o en edición si ya había ticket.
     * En vacaciones el bloque va oculto con el resto de la jornada.
     */
    function syncImporteDietaRequired() {
        const imp = document.getElementById('importe_dieta');
        const vac = document.getElementById('es_vacaciones');
        const paro = document.getElementById('paro_comer');
        if (!imp) return;
        const exige = !!(paro?.checked && !(vac && vac.checked));
        imp.required = exige;
        imp.setAttribute('min', exige ? '0.01' : '0');
    }

    function actualizarTicketDieta() {
        const wrap = document.getElementById('ticket-dieta-wrapper');
        const input = document.getElementById('ticket_dieta');
        if (!wrap) return;

        const vac = document.getElementById('es_vacaciones');
        if (vac && vac.checked) {
            wrap.classList.add('d-none');
            if (input) input.value = '';
            const imp = document.getElementById('importe_dieta');
            if (imp) imp.value = '';
            syncImporteDietaRequired();
            return;
        }

        const teniaTicket = wrap.dataset.ticketPrevio === '1';
        const paroComer = document.getElementById('paro_comer')?.checked;
        const mostrar = !!paroComer || teniaTicket;

        wrap.classList.toggle('d-none', !mostrar);

        if (!mostrar && input) {
            input.value = '';
        }
        const imp = document.getElementById('importe_dieta');
        if (imp && !mostrar) {
            imp.value = '';
        }
        syncImporteDietaRequired();
    }

    document.querySelectorAll('.js-registro-horario').forEach(function (el) {
        el.addEventListener('change', actualizarTicketDieta);
        el.addEventListener('input', actualizarTicketDieta);
    });

    const importeDietaInput = document.getElementById('importe_dieta');
    importeDietaInput?.addEventListener('input', function () {
        const max = importeDietaInput.getAttribute('max');
        if (!max) return;
        const m = parseFloat(max);
        let v = parseFloat(String(importeDietaInput.value).replace(',', '.'));
        if (!Number.isNaN(v) && !Number.isNaN(m) && v > m) {
            importeDietaInput.value = m.toFixed(2);
        }
    });

    const lugarSelect = document.getElementById('lugar_id');
    if (lugarSelect && window.jQuery && window.jQuery.fn.select2) {
        const url = lugarSelect.dataset.buscarUrl;
        window.jQuery(lugarSelect).select2({
            theme: 'bootstrap-5',
            width: '100%',
            placeholder: lugarSelect.dataset.placeholder || 'Buscar lugar…',
            allowClear: true,
            language: 'es',
            ajax: {
                url: url,
                delay: 250,
                data: function (params) {
                    return { q: params.term || '' };
                },
                processResults: function (data) {
                    return data;
                },
                cache: true
            },
            minimumInputLength: 0
        });
    }

    const vac = document.getElementById('es_vacaciones');
    if (vac?.checked && usar) {
        usar.checked = false;
    }
    syncTransporteUi();
    syncVistaVacaciones();
    actualizarTicketDieta();

    vac?.addEventListener('change', function () {
        syncVistaVacaciones();
        actualizarTicketDieta();
    });
})();
        </script>
    @endpush
@endonce