@extends('layouts.app', ['title' => 'AR ' . $invoice->invoice_nr])
@section('content')

{{-- Modal: Kostenstelle --}}
<div class="modal fade" id="cost-centre-item" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content border-0 shadow">
            <form action="{{ route('accounting.outgoing-invoice.costcentre') }}" method="POST">
                @csrf
                <input id="editid" name="editid" value="" hidden>
                <div class="modal-header border-0 pb-0">
                    <h5 class="modal-title fw-semibold"><i class="bi bi-diagram-2 me-2 text-primary"></i>Kostenstelle zuweisen</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Rechnungs-Nr.</label>
                            <input type="text" class="form-control bg-light" id="editinvoice_nr" name="editinvoice_nr" disabled>
                        </div>
                        <div class="col-md-8">
                            <label class="form-label fw-semibold">Kostenstelle <span class="text-danger">*</span></label>
                            <select class="select-search form-select" id="cost_center" name="cost_center">
                                <option value="" disabled selected>— bitte auswählen —</option>
                                @foreach ($cost_centers as $itemc)
                                    <option value="{{ $itemc->id }}">{{ $itemc->old_number ?? $itemc->number }} – {{ $itemc->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-semibold">Betreff</label>
                            <input type="text" class="form-control bg-light" id="edittitle" name="edittitle" disabled>
                        </div>
                    </div>
                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-outline-secondary rounded-pill px-4" data-bs-dismiss="modal">Abbrechen</button>
                    <button type="submit" class="btn btn-primary rounded-pill px-4"><i class="bi bi-check-lg me-1"></i>Speichern</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Modal: Zahlungsdaten --}}
<div class="modal fade" id="paid-item" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <form action="{{ route('accounting.outgoing-invoice.paid') }}" method="POST">
                @csrf
                <input id="paidid" name="paidid" value="" hidden>
                <div class="modal-header border-0 pb-0">
                    <h5 class="modal-title fw-semibold"><i class="bi bi-calendar-check me-2 text-success"></i>Zahlungsdaten</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="row g-3">
                        <div class="col-md-5">
                            <label class="form-label fw-semibold">Rechnungs-Nr.</label>
                            <input type="text" class="form-control bg-light" id="paidinvoice_nr" name="paidinvoice_nr" disabled>
                        </div>
                        <div class="col-md-7">
                            <label class="form-label fw-semibold">Betreff</label>
                            <input type="text" class="form-control bg-light" id="paidtitle" name="paidtitle" disabled>
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-semibold">Bezahlt am <span class="text-danger">*</span></label>
                            <input type="date" class="form-control" id="paid_date" name="paid_date" value="{{ \Carbon\Carbon::today()->format('Y-m-d') }}" required>
                        </div>
                    </div>
                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-outline-secondary rounded-pill px-4" data-bs-dismiss="modal">Abbrechen</button>
                    <button type="submit" class="btn btn-success rounded-pill px-4"><i class="bi bi-check-lg me-1"></i>Speichern</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Modal: Konto --}}
<div class="modal fade" id="konto-item" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content border-0 shadow">
            <form action="{{ route('accounting.outgoing-invoice.konto') }}" method="POST">
                @csrf
                <input id="invid" name="invid" value="" hidden>
                <div class="modal-header border-0 pb-0">
                    <h5 class="modal-title fw-semibold"><i class="bi bi-journal-text me-2 text-primary"></i>Konto zuweisen</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Rechnungs-Nr.</label>
                            <input type="text" class="form-control bg-light" id="kontoinvoice_nr" name="kontoinvoice_nr" disabled>
                        </div>
                        <div class="col-md-8">
                            <label class="form-label fw-semibold">Betreff</label>
                            <input type="text" class="form-control bg-light" id="kontotitle" name="kontotitle" disabled>
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-semibold">Konto <span class="text-danger">*</span></label>
                            <select class="select-search form-select" id="konto" name="konto" required>
                                <option value="" disabled selected>— bitte auswählen —</option>
                                @foreach ($kontos as $itemc)
                                    <option value="{{ $itemc->id }}" @selected($itemc->id == $invoice->fk_konto_id)>
                                        {{ $itemc->konto }} – {{ $itemc->name }}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-outline-secondary rounded-pill px-4" data-bs-dismiss="modal">Abbrechen</button>
                    <button type="submit" class="btn btn-primary rounded-pill px-4"><i class="bi bi-check-lg me-1"></i>Speichern</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Modal: Neue Mahnung --}}
<div class="modal fade" id="invoice-warning" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content border-0 shadow">
            <form action="{{ route('accounting.outgoing-invoice.warning.create') }}" method="POST" enctype="multipart/form-data">
                @csrf
                <input id="rid" name="rid" value="{{ $invoice->id }}" hidden>
                <div class="modal-header border-0 pb-0">
                    <h5 class="modal-title fw-semibold"><i class="bi bi-exclamation-triangle me-2 text-warning"></i>Neue Mahnung</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Rechnungsnummer <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="wnumber" name="wnumber" required>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Ausgangsdatum <span class="text-danger">*</span></label>
                            <input type="date" class="form-control" id="woutgoing_date" name="woutgoing_date" value="{{ \Carbon\Carbon::today()->format('Y-m-d') }}" required>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Zahlungsfrist bis <span class="text-danger">*</span></label>
                            <input type="date" class="form-control" id="wexpiry_date" name="wexpiry_date" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Mahngebühr <span class="text-danger">*</span></label>
                            <input type="number" class="form-control" id="wtotal" name="wtotal" step="0.01" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Mahnung (PDF) <span class="text-danger">*</span></label>
                            <input class="form-control" type="file" id="wfile_pdf" name="wfile_pdf" accept=".pdf" required>
                        </div>
                    </div>
                    <p class="text-muted small mt-3 mb-0"><i class="bi bi-info-circle me-1"></i>Mit <span class="text-danger">*</span> markierte Felder sind Pflichtfelder.</p>
                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-outline-secondary rounded-pill px-4" data-bs-dismiss="modal">Abbrechen</button>
                    <button type="submit" class="btn btn-warning rounded-pill px-4"><i class="bi bi-check-lg me-1"></i>Speichern</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Modal: Mahnung löschen --}}
<div class="modal fade" id="delete-warning" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <form action="{{ route('accounting.outgoing-invoice.warning.delete') }}" method="POST">
                @csrf
                <input id="wid" name="wid" value="" hidden>
                <div class="modal-header border-0 pb-0">
                    <h5 class="modal-title fw-semibold text-danger"><i class="bi bi-trash me-2"></i>Mahnung löschen</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body text-center py-4">
                    <i class="bi bi-exclamation-triangle-fill text-warning fs-1 d-block mb-3"></i>
                    <p class="mb-0">Möchten Sie diese Mahnung wirklich löschen?</p>
                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-outline-secondary rounded-pill px-4" data-bs-dismiss="modal">Abbrechen</button>
                    <button type="submit" class="btn btn-danger rounded-pill px-4"><i class="bi bi-trash me-1"></i>Löschen</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Modal: Neue Zahlung --}}
<div class="modal fade" id="paymentModal" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <form action="{{ route('accounting.outgoing-invoice.payment.new') }}" method="POST" enctype="multipart/form-data">
                @csrf
                <input id="invoice_id" name="invoice_id" value="{{ $invoice->id }}" hidden>
                <div class="modal-header border-0 pb-0">
                    <h5 class="modal-title fw-semibold"><i class="bi bi-cash me-2 text-success"></i>Neuer Zahlungseingang</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="row g-3">
                        <div class="col-12">
                            <label class="form-label fw-semibold">Betrag <span class="text-danger">*</span></label>
                            <input type="number" class="form-control" id="amount" name="amount" step="0.01" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Zahlungsdatum <span class="text-danger">*</span></label>
                            <input type="date" class="form-control" id="payment_date" name="payment_date" required>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Zahlungsmethode <span class="text-danger">*</span></label>
                            <select name="payment_method" id="payment_method" class="form-select" required>
                                @foreach ($payment_methods as $pitem)
                                    <option value="{{ $pitem->id }}">{{ $pitem->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-semibold">Notiz</label>
                            <textarea class="form-control" id="note" name="note" rows="2"></textarea>
                        </div>
                    </div>
                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-outline-secondary rounded-pill px-4" data-bs-dismiss="modal">Abbrechen</button>
                    <button type="submit" class="btn btn-success rounded-pill px-4"><i class="bi bi-check-lg me-1"></i>Speichern</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Modal: Zahlung löschen --}}
<div class="modal fade" id="delete-payment" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <form action="{{ route('accounting.outgoing-invoice.payment.delete') }}" method="POST">
                @csrf
                <input id="pid" name="pid" value="" hidden>
                <div class="modal-header border-0 pb-0">
                    <h5 class="modal-title fw-semibold text-danger"><i class="bi bi-trash me-2"></i>Zahlung löschen</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body text-center py-4">
                    <i class="bi bi-exclamation-triangle-fill text-warning fs-1 d-block mb-3"></i>
                    <p class="mb-0">Möchten Sie diese Zahlung wirklich löschen?</p>
                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-outline-secondary rounded-pill px-4" data-bs-dismiss="modal">Abbrechen</button>
                    <button type="submit" class="btn btn-danger rounded-pill px-4"><i class="bi bi-trash me-1"></i>Löschen</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Modal: Skonto bestätigen --}}
<div class="modal fade" id="skonto-modal" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <form action="{{ route('accounting.outgoing-invoice.statusincompany') }}" method="POST">
                @csrf
                <input id="skontoinvid" name="skontoinvid" value="" hidden>
                <input type="hidden" id="sid_skonto" name="sid" value="1">
                <div class="modal-header border-0 pb-0">
                    <h5 class="modal-title fw-semibold"><i class="bi bi-percent me-2 text-success"></i>Skonto – Rechnung bezahlt</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <label class="form-label fw-semibold">Rechnungs-Nr.</label>
                            <input type="text" class="form-control bg-light" id="skontoinvoice_nr" name="skontoinvoice_nr" disabled>
                        </div>
                        <div class="col-md-8">
                            <label class="form-label fw-semibold">Betreff</label>
                            <input type="text" class="form-control bg-light" id="skontoinvoicetitle" name="skontoinvoicetitle" disabled>
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-semibold">Skontofrist bis</label>
                            <input type="text" class="form-control bg-light" id="skontoduedate" name="skontoduedate" disabled>
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-semibold">Skontofrist eingehalten?</label>
                            <div class="d-flex gap-4">
                                <div class="form-check">
                                    <input class="form-check-input" type="radio" name="skonto_option" id="skonto_ja" value="1" checked>
                                    <label class="form-check-label" for="skonto_ja">Ja</label>
                                </div>
                                <div class="form-check">
                                    <input class="form-check-input" type="radio" name="skonto_option" id="skonto_nein" value="0">
                                    <label class="form-check-label" for="skonto_nein">Nein</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer border-0">
                    <button type="button" class="btn btn-outline-secondary rounded-pill px-4" data-bs-dismiss="modal">Abbrechen</button>
                    <button type="submit" class="btn btn-success rounded-pill px-4"><i class="bi bi-check-lg me-1"></i>Bestätigen</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- Hauptinhalt --}}
<div class="container-fluid py-4" style="max-width:1600px;">

    {{-- Alerts --}}
    @if(session('msg'))
        <div class="alert alert-success alert-dismissible fade show mb-3">
            <i class="bi bi-check-circle me-2"></i>{{ session('msg') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif
    @if(session('error'))
        <div class="alert alert-danger alert-dismissible fade show mb-3">
            <i class="bi bi-x-circle me-2"></i>{{ session('error') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    {{-- Header --}}
    <div class="d-flex align-items-center gap-3 mb-4 flex-wrap">
        <a href="{{ route('accounting.outgoing-invoice.index') }}" class="btn btn-outline-secondary btn-sm rounded-pill px-3">
            <i class="bi bi-arrow-left me-1"></i>Zurück
        </a>
        <div class="flex-grow-1">
            <h4 class="fw-bold mb-0">
                <i class="bi bi-send-fill me-2 text-success"></i>
                {{ $invoice->invoice_nr }}
                @if($invoice->customer)
                    <span class="text-muted fw-normal fs-6 ms-2">{{ $invoice->customer->name }}</span>
                @endif
            </h4>
        </div>
        <div class="d-flex gap-2">
            @if($previous_invoice)
                <a href="{{ route('accounting.outgoing-invoice.show', ['id' => $previous_invoice->id]) }}"
                    class="btn btn-outline-secondary btn-sm rounded-pill px-3">
                    <i class="bi bi-chevron-left me-1"></i>Vorherige
                </a>
            @endif
            @if($next_invoice)
                <a href="{{ route('accounting.outgoing-invoice.show', ['id' => $next_invoice->id]) }}"
                    class="btn btn-outline-secondary btn-sm rounded-pill px-3">
                    Nächste<i class="bi bi-chevron-right ms-1"></i>
                </a>
            @endif
        </div>
    </div>

    {{-- Status-Zeile --}}
    @if(Auth::user()->get_employee->is_mgt or Auth::user()->get_employee->get_department->department_id == '9')
        <div class="card border-0 shadow-sm mb-4">
            <div class="card-body py-2 px-3">
                <div class="small text-muted mb-2 fw-semibold">Hauptstatus</div>
                <div class="btn-group w-100" role="group">
                    <form action="{{ route('accounting.outgoing-invoice.statusincompany') }}" method="POST" class="flex-fill m-0">
                        @csrf
                        <input type="hidden" name="sid" value="0">
                        <input type="hidden" name="id" value="{{ $invoice->id }}">
                        <button type="submit"
                            class="btn btn-sm w-100 rounded-0 {{ $invoice->is_paid == '0' ? 'btn-danger' : 'btn-outline-danger' }}"
                            {{ $invoice->is_paid == '0' ? 'disabled' : '' }}>
                            <i class="bi bi-clock me-1"></i>offen
                        </button>
                    </form>
                    <form action="{{ route('accounting.outgoing-invoice.statusincompany') }}" method="POST" class="flex-fill m-0">
                        @csrf
                        <input type="hidden" name="sid" value="1">
                        <input type="hidden" name="id" value="{{ $invoice->id }}">
                        @if($invoice->is_discount_period_adhered)
                            <button type="button"
                                class="btn btn-sm w-100 rounded-0 {{ $invoice->is_paid == '1' ? 'btn-success' : 'btn-outline-success' }}"
                                onclick="skontomodal({{ $invoice->id }})"
                                {{ $invoice->is_paid == '1' ? 'disabled' : '' }}>
                                <i class="bi bi-check-circle me-1"></i>bezahlt
                            </button>
                        @else
                            <button type="submit"
                                class="btn btn-sm w-100 rounded-0 {{ $invoice->is_paid == '1' ? 'btn-success' : 'btn-outline-success' }}"
                                {{ $invoice->is_paid == '1' ? 'disabled' : '' }}>
                                <i class="bi bi-check-circle me-1"></i>bezahlt
                            </button>
                        @endif
                    </form>
                </div>
            </div>
        </div>
    @endif

    {{-- Layout: 2 Spalten --}}
    <div class="row g-4">

        {{-- Linke Spalte: Tabs --}}
        <div class="col-lg-8">
            <div class="card border-0 shadow-sm">
                <div class="card-header bg-white border-0 pb-0 pt-3">
                    <ul class="nav nav-tabs border-0" id="nav-tab">
                        <li class="nav-item">
                            <button class="nav-link active fw-semibold" data-bs-toggle="tab" data-bs-target="#tab-data" type="button">
                                <i class="bi bi-file-text me-1"></i>Rechnungsdaten
                            </button>
                        </li>
                        <li class="nav-item">
                            <button class="nav-link fw-semibold" data-bs-toggle="tab" data-bs-target="#tab-warnings" type="button">
                                <i class="bi bi-exclamation-triangle me-1 text-danger"></i>Mahnungen
                                @if($invoice->get_warning->count() > 0)
                                    <span class="badge bg-danger rounded-pill ms-1">{{ $invoice->get_warning->count() }}</span>
                                @endif
                            </button>
                        </li>
                        <li class="nav-item">
                            <button class="nav-link fw-semibold" data-bs-toggle="tab" data-bs-target="#tab-payments" type="button">
                                <i class="bi bi-cash me-1 text-success"></i>Zahlungseingänge
                                @if($invoice->get_payments->count() > 0)
                                    <span class="badge bg-success rounded-pill ms-1">{{ $invoice->get_payments->count() }}</span>
                                @endif
                            </button>
                        </li>
                        <li class="nav-item">
                            <button class="nav-link fw-semibold" data-bs-toggle="tab" data-bs-target="#tab-pdf" type="button">
                                <i class="bi bi-file-earmark-pdf me-1 text-danger"></i>PDF
                            </button>
                        </li>
                    </ul>
                </div>
                <div class="card-body p-0 tab-content">

                    {{-- Tab: Rechnungsdaten --}}
                    <div class="tab-pane fade show active p-4" id="tab-data">

                        {{-- Felder --}}
                        <div class="row g-3 mb-3">
                            <div class="col-md-8">
                                <div class="text-muted small">Kunde</div>
                                <div class="fw-semibold">{{ $invoice->customer->name }}</div>
                            </div>
                            <div class="col-md-4">
                                <a href="{{ route('accounting.outgoing-invoice.file.download', ['id' => $invoice->id]) }}"
                                    class="btn btn-outline-secondary btn-sm w-100">
                                    <i class="bi bi-file-earmark-pdf-fill text-danger me-1"></i>
                                    <i class="bi bi-download me-1"></i>{{ $invoice->invoice_nr }}
                                </a>
                            </div>
                        </div>

                        <div class="row g-3 mb-3">
                            <div class="col-md-3">
                                <div class="text-muted small">Rechnungs-Nr.</div>
                                <div class="fw-semibold">{{ $invoice->invoice_nr }}</div>
                            </div>
                            <div class="col-md-3">
                                <div class="text-muted small">Rechnungsdatum</div>
                                <div>{{ $invoice->invoice_date ? date('d.m.Y', strtotime($invoice->invoice_date)) : '–' }}</div>
                            </div>
                            <div class="col-md-3">
                                <div class="text-muted small">Zahlungsfrist bis</div>
                                @php $exp = strtotime($invoice->expiry_date); @endphp
                                <div class="{{ $exp < strtotime('today') && !$invoice->is_paid ? 'text-danger fw-bold' : '' }}">
                                    {{ date('d.m.Y', $exp) }}
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="text-muted small">Bezahlung</div>
                                <div>{{ $invoice->is_prepayment ? 'VORKASSE' : 'NACH ERHALT' }}</div>
                            </div>
                        </div>

                        <div class="row g-3 mb-3">
                            <div class="col-12">
                                <div class="text-muted small">Betreff</div>
                                <div class="fw-semibold">{{ $invoice->title }}</div>
                            </div>
                            @if($invoice->info)
                                <div class="col-12">
                                    <div class="text-muted small">Info / Hinweise</div>
                                    <div>{{ $invoice->info }}</div>
                                </div>
                            @endif
                        </div>

                        <hr>

                        {{-- Kostenstelle --}}
                        <div class="card border-0 bg-light rounded-3 mb-3 p-3">
                            <div class="d-flex align-items-center justify-content-between">
                                <div>
                                    <div class="text-muted small mb-1">Kostenstelle</div>
                                    <div class="fw-semibold">
                                        @if(isset($invoice->get_cost_center))
                                            {{ $invoice->get_cost_center->old_number ?? $invoice->get_cost_center->number }}
                                            – {{ $invoice->get_cost_center->name }}
                                        @else
                                            <span class="text-muted">nicht zugewiesen</span>
                                        @endif
                                    </div>
                                </div>
                                <button type="button" class="btn btn-outline-primary btn-sm rounded-pill"
                                    onclick="CostItem({{ $invoice->id }})">
                                    <i class="bi bi-pencil me-1"></i>Ändern
                                </button>
                            </div>
                        </div>

                        {{-- Buchhaltung --}}
                        <div class="card border-0 bg-light rounded-3 mb-3 p-3">
                            <h6 class="fw-semibold mb-3"><i class="bi bi-building me-2 text-primary"></i>Buchhaltung</h6>
                            <div class="row g-3">
                                <div class="col-md-6">
                                    <div class="d-flex align-items-center justify-content-between">
                                        <div>
                                            <div class="text-muted small mb-1">Bezahlt am</div>
                                            <div class="{{ $invoice->paid_date ? 'text-success fw-semibold' : 'text-muted' }}">
                                                {{ $invoice->paid_date ? date('d.m.Y', strtotime($invoice->paid_date)) : 'noch unbezahlt' }}
                                            </div>
                                        </div>
                                        @if(Auth::user()->get_employee->is_acc)
                                            <button type="button" class="btn btn-outline-primary btn-sm rounded-pill"
                                                onclick="paidItem({{ $invoice->id }})">
                                                <i class="bi bi-pencil"></i>
                                            </button>
                                        @endif
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="d-flex align-items-center justify-content-between">
                                        <div>
                                            <div class="text-muted small mb-1">Konto</div>
                                            <div>
                                                @if($invoice->fk_konto_id)
                                                    {{ $invoice->konto->konto }} – {{ $invoice->konto->name }}
                                                @else
                                                    <span class="text-muted">nicht zugewiesen</span>
                                                @endif
                                            </div>
                                        </div>
                                        @if(Auth::user()->get_employee->is_acc)
                                            <button type="button" class="btn btn-outline-primary btn-sm rounded-pill"
                                                onclick="kontoItem({{ $invoice->id }})">
                                                <i class="bi bi-pencil"></i>
                                            </button>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>

                        {{-- Beträge --}}
                        <div class="card border-0 border-start border-3 border-success bg-light rounded-3 p-3">
                            <h6 class="fw-semibold mb-3"><i class="bi bi-calculator me-2 text-success"></i>Beträge</h6>
                            @if($invoice->is_discount_period_adhered)
                                <div class="alert alert-{{ now() < $invoice->discount_due_date ? 'success' : 'danger' }} py-2 mb-3">
                                    <i class="bi bi-percent me-1"></i>
                                    Skonto {{ $invoice->discount_rate * 100 }}% bis {{ date('d.m.Y', strtotime($invoice->discount_due_date)) }}
                                </div>
                            @endif
                            <div class="d-flex justify-content-between small mb-1">
                                <span class="text-muted">Netto</span>
                                <span>{{ number_format($invoice->subtotal, 2, ',', '.') }} €</span>
                            </div>
                            <div class="d-flex justify-content-between small mb-1">
                                <span class="text-muted">MwSt. {{ $invoice->tax_percent * 100 }}%</span>
                                <span>{{ number_format($invoice->tax, 2, ',', '.') }} €</span>
                            </div>
                            <div class="d-flex justify-content-between small mb-2 pb-2 border-bottom">
                                <span class="fw-semibold">Brutto</span>
                                <span class="fw-semibold">{{ number_format($invoice->total, 2, ',', '.') }} €</span>
                            </div>
                            @if($invoice->is_discount_period_adhered)
                                <div class="d-flex justify-content-between small mb-1">
                                    <span class="text-muted">Skonto ({{ $invoice->discount_rate * 100 }}%)</span>
                                    <span class="text-success">– {{ number_format($invoice->discount_amount, 2, ',', '.') }} €</span>
                                </div>
                                <div class="d-flex justify-content-between small mb-2 pb-2 border-bottom">
                                    <span class="fw-semibold {{ now() < $invoice->discount_due_date ? 'text-success' : 'text-danger' }}">Zahlbetrag mit Skonto</span>
                                    <span class="fw-semibold {{ now() < $invoice->discount_due_date ? 'text-success' : 'text-danger' }}">{{ number_format($invoice->amount_due_with_discount, 2, ',', '.') }} €</span>
                                </div>
                            @endif
                            @if($invoice->get_warning->count() > 0)
                                <div class="d-flex justify-content-between small mb-1">
                                    <span class="text-danger">Mahngebühren</span>
                                    <span class="text-danger">+ {{ number_format($invoice->get_warning->sum('total'), 2, ',', '.') }} €</span>
                                </div>
                            @endif
                            @if($invoice->get_payments->count() > 0)
                                <div class="d-flex justify-content-between small mb-1">
                                    <span class="text-success">Zahlungseingänge</span>
                                    <span class="text-success">– {{ number_format($invoice->get_payments->sum('amount'), 2, ',', '.') }} €</span>
                                </div>
                            @endif
                            <div class="d-flex justify-content-between pt-2 border-top mt-1">
                                <span class="fw-bold">Offener Betrag</span>
                                <span class="fw-bold fs-5">
                                    {{ number_format($invoice->total + $invoice->get_warning->sum('total') - $invoice->get_payments->sum('amount'), 2, ',', '.') }} €
                                </span>
                            </div>
                        </div>
                    </div>

                    {{-- Tab: Mahnungen --}}
                    <div class="tab-pane fade" id="tab-warnings">
                        <div class="p-3 d-flex justify-content-between align-items-center border-bottom">
                            <span class="fw-semibold">Mahnungen</span>
                            @if(Auth::user()->get_employee->is_mgt or Auth::user()->get_employee->is_sec or Auth::user()->get_employee->is_acc)
                                <button type="button" class="btn btn-warning btn-sm rounded-pill px-3" data-bs-toggle="modal" data-bs-target="#invoice-warning">
                                    <i class="bi bi-plus-lg me-1"></i>Neue Mahnung
                                </button>
                            @endif
                        </div>
                        <div class="table-responsive">
                            <table class="table table-hover align-middle mb-0" style="font-size:0.85rem;">
                                <thead class="table-light">
                                    <tr>
                                        <th class="ps-4">Nr.</th>
                                        <th>Ausgangsdatum</th>
                                        <th>Frist bis</th>
                                        <th class="text-end">Mahngebühr</th>
                                        <th>PDF</th>
                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($invoice->get_warning as $witem)
                                        <tr>
                                            <td class="ps-4">{{ $witem->number }}</td>
                                            <td>{{ date('d.m.Y', strtotime($witem->income_date)) }}</td>
                                            <td>{{ date('d.m.Y', strtotime($witem->expiry_date)) }}</td>
                                            <td class="text-end text-danger fw-semibold">{{ number_format($witem->total, 2, ',', '.') }} €</td>
                                            <td>
                                                <a href="{{ route('dms.file.download', ['id' => $witem->file_id]) }}" target="_blank"
                                                    class="btn btn-outline-secondary btn-sm">
                                                    <i class="bi bi-file-earmark-pdf text-danger me-1"></i>{{ $witem->number }}-Mahnung
                                                </a>
                                            </td>
                                            <td>
                                                <button type="button" class="btn btn-outline-danger btn-sm rounded-circle delete_btn"
                                                    data-id="{{ $witem->id }}" style="width:30px;height:30px;padding:0;">
                                                    <i class="bi bi-trash" style="font-size:.75rem;"></i>
                                                </button>
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="6" class="text-center py-4 text-muted">
                                                <i class="bi bi-inbox d-block fs-3 opacity-25 mb-1"></i>Keine Mahnungen
                                            </td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>

                    {{-- Tab: Zahlungseingänge --}}
                    <div class="tab-pane fade" id="tab-payments">
                        <div class="p-3 d-flex justify-content-between align-items-center border-bottom">
                            <span class="fw-semibold">Zahlungseingänge</span>
                            @if(Auth::user()->get_employee->is_mgt or Auth::user()->get_employee->is_sec or Auth::user()->get_employee->is_acc)
                                <button type="button" class="btn btn-success btn-sm rounded-pill px-3" data-bs-toggle="modal" data-bs-target="#paymentModal">
                                    <i class="bi bi-plus-lg me-1"></i>Neuer Eingang
                                </button>
                            @endif
                        </div>
                        <div class="table-responsive">
                            <table class="table table-hover align-middle mb-0" style="font-size:0.85rem;">
                                <thead class="table-light">
                                    <tr>
                                        <th class="ps-4">#</th>
                                        <th class="text-end">Betrag</th>
                                        <th>Zahlungsdatum</th>
                                        <th>Methode</th>
                                        <th>Notiz</th>
                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($invoice->get_payments as $pitem)
                                        <tr>
                                            <td class="ps-4 text-muted">{{ $pitem->id }}</td>
                                            <td class="text-end text-success fw-semibold">{{ number_format($pitem->amount, 2, ',', '.') }} €</td>
                                            <td>{{ date('d.m.Y', strtotime($pitem->payment_date)) }}</td>
                                            <td>{{ $pitem->get_payment_method->name }}</td>
                                            <td class="text-muted small">{{ $pitem->note }}</td>
                                            <td>
                                                <button type="button" class="btn btn-outline-danger btn-sm rounded-circle delete_payment"
                                                    data-id="{{ $pitem->id }}" style="width:30px;height:30px;padding:0;">
                                                    <i class="bi bi-trash" style="font-size:.75rem;"></i>
                                                </button>
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="6" class="text-center py-4 text-muted">
                                                <i class="bi bi-inbox d-block fs-3 opacity-25 mb-1"></i>Keine Zahlungseingänge
                                            </td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>

                    {{-- Tab: PDF --}}
                    <div class="tab-pane fade" id="tab-pdf">
                        <iframe src="{{ route('accounting.outgoing-invoice.file.get', ['id' => $invoice->id]) }}"
                            width="100%" style="height:80vh; border:0;"></iframe>
                    </div>

                </div>
            </div>
        </div>

        {{-- Rechte Spalte: Timeline --}}
        <div class="col-lg-4">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body p-3">

                    @if($invoice->id != 6)
                    <form action="{{ route('accounting.outgoing-invoice.timeline') }}" method="POST"
                        onsubmit="syncTextarea()" novalidate>
                        @csrf
                        <input type="hidden" name="pid" value="{{ $invoice->id }}">

                        <div class="d-flex gap-1 mb-2">
                            @foreach([
                                ['4','notes','bi-info-square-fill','Info','text-info'],
                                ['0','call','bi-telephone-fill','Anruf','text-success'],
                                ['1','mail','bi-envelope-fill','E-Mail','text-primary'],
                                ['2','poste','bi-mailbox2','Post','text-secondary'],
                                ['3','personally','bi-people-fill','Persönlich','text-warning'],
                            ] as [$val,$rid,$ico,$lbl,$col])
                            <label class="tl-type-label flex-fill text-center rounded py-1 px-0"
                                   title="{{ $lbl }}" style="cursor:pointer; font-size:11px;">
                                <input class="d-none tl-type-radio" onclick="contact_checked(this);"
                                       type="radio" name="contact_type" value="{{ $val }}" id="{{ $rid }}"
                                       {{ $val==='4' ? 'checked' : '' }}>
                                <i class="bi {{ $ico }} d-block {{ $col }}" style="font-size:17px;"></i>
                                <span class="d-block" style="line-height:1.1;">{{ $lbl }}</span>
                            </label>
                            @endforeach
                        </div>

                        <div id="contact-with" class="mb-2" style="display:none;">
                            <input type="text" name="contact_dst" class="form-control form-control-sm"
                                placeholder="Kontakt mit …" list="contact-dst-list">
                            <datalist id="contact-dst-list">
                                <option value="Kunde: {{ $invoice->customer->name }}">
                            </datalist>
                        </div>

                        <textarea id="msg" name="msg" style="display:none;" required></textarea>
                        <div id="editor-container" class="mb-2"></div>

                        <button type="submit" class="btn btn-primary btn-sm rounded-pill px-3 w-100">
                            <i class="bi bi-send me-1"></i>Speichern
                        </button>
                    </form>
                    <hr class="my-3">
                    @endif

                    {{-- Filter --}}
                    <div class="d-flex align-items-center gap-1 mb-3 flex-wrap">
                        <span class="text-muted small me-1">Filter:</span>
                        @foreach([
                            ['0','all','bi-list-ul','Alle'],
                            ['1','fnotes','bi-info-square-fill','Info'],
                            ['2','fcall','bi-telephone-fill','Anruf'],
                            ['3','fmail','bi-envelope-fill','E-Mail'],
                            ['4','fposte','bi-mailbox2','Post'],
                            ['5','fpersonally','bi-people-fill','Person'],
                        ] as [$val,$fid,$ico,$lbl])
                        <label class="tl-filter-label rounded px-1 py-0" title="{{ $lbl }}"
                               style="cursor:pointer; font-size:10px; line-height:1.8;">
                            <input class="d-none tl-filter-radio" onclick="filter_checked(this);"
                                   type="radio" name="note_type" value="{{ $val }}" id="{{ $fid }}"
                                   {{ $val==='0' ? 'checked' : '' }}>
                            <i class="bi {{ $ico }}"></i> {{ $lbl }}
                        </label>
                        @endforeach
                    </div>

                    {{-- Einträge --}}
                    @forelse($invoice->timelines->sortByDesc('created_at') as $tt)
                        @if($tt->is_event or $tt->is_email or $tt->is_note or $tt->is_call or $tt->is_post or $tt->is_personally)
                            @php
                                $isEvent      = (bool) $tt->is_event;
                                $isNote       = $tt->is_note && !$tt->is_event;
                                $isCall       = (bool) $tt->is_call;
                                $isEmail      = (bool) $tt->is_email;
                                $isPost       = (bool) $tt->is_post;
                                $isPersonally = (bool) $tt->is_personally;
                                if ($isEvent)        { $tlIcon = 'bi-robot';            $tlColor = '#6c757d'; }
                                elseif ($isNote)     { $tlIcon = 'bi-info-square-fill'; $tlColor = '#0dcaf0'; }
                                elseif ($isCall)     { $tlIcon = 'bi-telephone-fill';   $tlColor = '#198754'; }
                                elseif ($isEmail)    { $tlIcon = 'bi-envelope-fill';    $tlColor = '#0d6efd'; }
                                elseif ($isPost)     { $tlIcon = 'bi-mailbox2';         $tlColor = '#6c757d'; }
                                else                 { $tlIcon = 'bi-people-fill';      $tlColor = '#ffc107'; }
                            @endphp
                            <div class="note0 {{ $isNote || $isEvent ? 'note1' : '' }} {{ $isCall ? 'note2' : '' }} {{ $isEmail ? 'note3' : '' }} {{ $isPost ? 'note4' : '' }} {{ $isPersonally ? 'note5' : '' }} mb-2">
                                <div class="rounded border" style="border-left: 3px solid {{ $tlColor }} !important; background:#fff;">
                                    <div class="d-flex align-items-center gap-2 px-2 pt-2 pb-1 border-bottom"
                                         style="background:#f8f9fa; border-radius:.375rem .375rem 0 0;">
                                        <i class="bi {{ $tlIcon }}" style="color:{{ $tlColor }}; font-size:14px;"></i>
                                        <span class="ms-auto text-muted" style="font-size:10px;">
                                            <i class="bi bi-clock me-1"></i>{{ $tt->created_at ? \Carbon\Carbon::parse($tt->created_at)->format('d.m.Y - H:i') : '—' }}
                                        </span>
                                    </div>
                                    <div class="px-2 py-2">
                                        <div class="small mb-1" style="white-space:pre-line;">{!! $tt->event_msg !!}</div>
                                        <div class="text-muted" style="font-size:10px;">
                                            <i class="bi bi-person me-1"></i>{{ $tt->get_employee?->first_name }} {{ $tt->get_employee?->last_name }}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endif
                    @empty
                        <div class="text-center text-muted py-4">
                            <i class="bi bi-chat-left-dots d-block fs-2 mb-1 opacity-25"></i>
                            <small>Noch keine Einträge.</small>
                        </div>
                    @endforelse

                </div>
            </div>
        </div>

    </div>
</div>

<script>
$(document).on('click', '.delete_btn', function () {
    $('#wid').val($(this).data('id'));
    new bootstrap.Modal(document.getElementById('delete-warning')).show();
});
$(document).on('click', '.delete_payment', function () {
    $('#pid').val($(this).data('id'));
    new bootstrap.Modal(document.getElementById('delete-payment')).show();
});

function CostItem(id) {
    var url = "{{ route('accounting.outgoing-invoice.get', ':id') }}".replace(':id', id);
    $.get(url, function (item) {
        $('#editid').val(item.id);
        $('#editinvoice_nr').val(item.invoice_nr);
        $('#edittitle').val(item.title);
        var sel = $('#cost_center').selectize();
        sel[0].selectize.setValue(item.fk_cost_centre_id);
        new bootstrap.Modal(document.getElementById('cost-centre-item')).show();
    });
}

function paidItem(id) {
    var url = "{{ route('accounting.outgoing-invoice.get', ':id') }}".replace(':id', id);
    $.get(url, function (item) {
        $('#paidid').val(item.id);
        $('#paidinvoice_nr').val(item.invoice_nr);
        $('#paidtitle').val(item.title);
        if (item.paid_date) $('#paid_date').val(item.paid_date);
        new bootstrap.Modal(document.getElementById('paid-item')).show();
    });
}

function kontoItem(id) {
    var url = "{{ route('accounting.outgoing-invoice.get', ':id') }}".replace(':id', id);
    $.get(url, function (item) {
        $('#invid').val(item.id);
        $('#kontoinvoice_nr').val(item.invoice_nr);
        $('#kontotitle').val(item.title);
        new bootstrap.Modal(document.getElementById('konto-item')).show();
    });
}

function skontomodal(id) {
    var url = "{{ route('accounting.outgoing-invoice.get', ':id') }}".replace(':id', id);
    $.get(url, function (item) {
        $('#skontoinvid').val(item.id);
        $('#skontoinvoice_nr').val(item.invoice_nr);
        $('#skontoinvoicetitle').val(item.title);
        const d = new Date(item.discount_due_date);
        $('#skontoduedate').val(new Intl.DateTimeFormat('de-DE').format(d));
        new bootstrap.Modal(document.getElementById('skonto-modal')).show();
    });
}

function contact_checked() {
    if (document.getElementById('notes').checked) {
        document.getElementById('contact-with').style.display = 'none';
    } else {
        document.getElementById('contact-with').style.display = 'block';
    }
}
$(document).ready(function () { contact_checked(); });

</script>

@endsection