@extends('layouts.app', ['title' => 'Firmendaten'])
@section('content')

{{-- Edit Modal (nur für MGT) --}}
@if (Auth::user()->get_employee->is_mgt)
<div class="modal fade" id="edit-company-modal" data-bs-backdrop="static" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable">
        <div class="modal-content border-0 shadow-lg" style="border-radius:12px; overflow:hidden;">
            <form action="{{ route('system.company.update') }}" method="POST" enctype="multipart/form-data" class="needs-validation" novalidate
                  style="display:flex; flex-direction:column; overflow:hidden; min-height:0; flex:1 1 auto;">
                @csrf

                {{-- Header --}}
                <div class="modal-header border-0 px-4 pt-4 pb-3" style="background:#f8f9fb;">
                    <div>
                        <h5 class="modal-title fw-bold mb-0">
                            <i class="bi bi-building-fill me-2 text-primary"></i>Firmendaten bearbeiten
                        </h5>
                        <div class="text-muted small mt-1">Allgemeine Stammdaten der Firma</div>
                    </div>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>

                {{-- Body --}}
                <div class="modal-body px-4 py-3">

                    {{-- Abschnitt: Allgemein --}}
                    <div class="d-flex align-items-center gap-2 mb-3 mt-1">
                        <span class="badge rounded-pill text-bg-primary px-2 py-1" style="font-size:10px; letter-spacing:.05em;">ALLGEMEIN</span>
                        <hr class="flex-grow-1 m-0">
                    </div>
                    <div class="row g-3 mb-4">
                        <div class="col-md-7">
                            <label class="form-label fw-semibold small">Firmenname <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" name="name" value="{{ old('name', $company->name) }}" required placeholder="z.B. Muster GmbH">
                            @error('name') <div class="text-danger small mt-1">{{ $message }}</div> @enderror
                        </div>
                        <div class="col-md-5">
                            <label class="form-label fw-semibold small">App-Name</label>
                            <input type="text" class="form-control" name="app_name" value="{{ old('app_name', $company->app_name) }}" placeholder="z.B. Muster MGT">
                            <div class="form-text">Anzeige in Browser-Tab &amp; Menü</div>
                        </div>
                    </div>

                    {{-- Abschnitt: Adresse --}}
                    <div class="d-flex align-items-center gap-2 mb-3">
                        <span class="badge rounded-pill text-bg-secondary px-2 py-1" style="font-size:10px; letter-spacing:.05em;">ADRESSE</span>
                        <hr class="flex-grow-1 m-0">
                    </div>
                    <div class="row g-3 mb-4">
                        <div class="col-md-8">
                            <label class="form-label fw-semibold small">Straße</label>
                            <input type="text" class="form-control" name="str" value="{{ old('str', $company->str) }}" placeholder="Musterstraße">
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold small">Hausnummer</label>
                            <input type="text" class="form-control" name="hn" value="{{ old('hn', $company->hn) }}" placeholder="12a">
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold small">PLZ</label>
                            <input type="text" class="form-control" name="plz" value="{{ old('plz', $company->plz) }}" placeholder="12345">
                        </div>
                        <div class="col-md-8">
                            <label class="form-label fw-semibold small">Ort</label>
                            <input type="text" class="form-control" name="ort" value="{{ old('ort', $company->ort) }}" placeholder="Berlin">
                        </div>
                    </div>

                    {{-- Abschnitt: Kontakt --}}
                    <div class="d-flex align-items-center gap-2 mb-3">
                        <span class="badge rounded-pill text-bg-secondary px-2 py-1" style="font-size:10px; letter-spacing:.05em;">KONTAKT</span>
                        <hr class="flex-grow-1 m-0">
                    </div>
                    <div class="row g-3 mb-4">
                        <div class="col-md-4">
                            <label class="form-label fw-semibold small">Telefon</label>
                            <div class="input-group">
                                <span class="input-group-text"><i class="bi bi-telephone"></i></span>
                                <input type="text" class="form-control" name="tel" value="{{ old('tel', $company->tel) }}" placeholder="+49 30 123456">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label fw-semibold small">Fax</label>
                            <div class="input-group">
                                <span class="input-group-text"><i class="bi bi-printer"></i></span>
                                <input type="text" class="form-control" name="fax" value="{{ old('fax', $company->fax) }}" placeholder="+49 30 123457">
                            </div>
                        </div>
                       
                        <div class="col-md-6">
                            <label class="form-label fw-semibold small">Webseite</label>
                            <div class="input-group">
                                <span class="input-group-text"><i class="bi bi-globe"></i></span>
                                <input type="text" class="form-control" name="webseite" value="{{ old('webseite', $company->webseite) }}" placeholder="www.firma.de">
                            </div>
                        </div>
                         <div class="col-md-6">
                            <label class="form-label fw-semibold small">E-Mail</label>
                            <div class="input-group">
                                <span class="input-group-text"><i class="bi bi-envelope"></i></span>
                                <input type="email" class="form-control" name="email" value="{{ old('email', $company->email) }}" placeholder="info@firma.de">
                            </div>
                        </div>
                    </div>

                    {{-- Abschnitt: Steuer --}}
                    <div class="d-flex align-items-center gap-2 mb-3">
                        <span class="badge rounded-pill text-bg-secondary px-2 py-1" style="font-size:10px; letter-spacing:.05em;">STEUER</span>
                        <hr class="flex-grow-1 m-0">
                    </div>
                    <div class="row g-3 mb-4">
                        <div class="col-md-6">
                            <label class="form-label fw-semibold small">Steuernummer</label>
                            <input type="text" class="form-control" name="steuer_nr" value="{{ old('steuer_nr', $company->steuer_nr) }}" placeholder="046/159/12345">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold small">USt-IdNr.</label>
                            <input type="text" class="form-control" name="ust_id" value="{{ old('ust_id', $company->ust_id) }}" placeholder="DE123456789">
                        </div>
                    </div>

                    {{-- Abschnitt: Bankdaten --}}
                    <div class="d-flex align-items-center gap-2 mb-3">
                        <span class="badge rounded-pill text-bg-secondary px-2 py-1" style="font-size:10px; letter-spacing:.05em;">BANKDATEN</span>
                        <hr class="flex-grow-1 m-0">
                    </div>
                    <div class="row g-3 mb-4">
                        <div class="col-md-6">
                            <label class="form-label fw-semibold small">Bank</label>
                            <div class="input-group">
                                <span class="input-group-text"><i class="bi bi-bank"></i></span>
                                <input type="text" class="form-control" name="bank_name" value="{{ old('bank_name', $company->bank_name) }}" placeholder="z.B. Sparkasse Potsdam">
                            </div>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold small">Kontoinhaber</label>
                            <div class="input-group">
                                <span class="input-group-text"><i class="bi bi-person"></i></span>
                                <input type="text" class="form-control" name="bank_inhaber" value="{{ old('bank_inhaber', $company->bank_inhaber) }}" placeholder="Firmenname GmbH">
                            </div>
                        </div>
                        <div class="col-md-7">
                            <label class="form-label fw-semibold small">IBAN</label>
                            <input type="text" class="form-control font-monospace" name="bank_iban" value="{{ old('bank_iban', $company->bank_iban) }}" placeholder="DE12 3456 7890 1234 5678 90" style="letter-spacing:.05em;">
                        </div>
                        <div class="col-md-5">
                            <label class="form-label fw-semibold small">BIC</label>
                            <input type="text" class="form-control font-monospace" name="bank_bic" value="{{ old('bank_bic', $company->bank_bic) }}" placeholder="BELADEBEXXX">
                        </div>
                    </div>

                    {{-- Abschnitt: Logo --}}
                    <div class="d-flex align-items-center gap-2 mb-3">
                        <span class="badge rounded-pill text-bg-secondary px-2 py-1" style="font-size:10px; letter-spacing:.05em;">LOGO</span>
                        <hr class="flex-grow-1 m-0">
                    </div>
                    <div class="row g-3">
                        <div class="col-12">
                            @if ($company->logo)
                            <div class="d-flex align-items-center gap-3 p-3 rounded mb-3" style="background:#f8f9fb; border:1px dashed #dee2e6;">
                                <img src="{{ asset('assets/images/logo/' . $company->logo) }}" alt="Logo" style="max-height:60px; max-width:180px; object-fit:contain;">
                                <div>
                                    <div class="fw-semibold small">Aktuelles Logo</div>
                                    <div class="text-muted small">{{ $company->logo }}</div>
                                </div>
                            </div>
                            @endif
                            <input type="file" class="form-control" name="logo" accept=".png,.jpg,.jpeg">
                            <div class="form-text">PNG oder JPG, max. 2 MB. Leer lassen = Logo unverändert.</div>
                        </div>
                    </div>

                </div>

                {{-- Footer --}}
                <div class="modal-footer border-0 px-4 py-3" style="background:#f8f9fb;">
                    <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-floppy me-1"></i> Speichern
                    </button>
                </div>

            </form>
        </div>
    </div>
</div>
@endif

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

    {{-- Header --}}
    <div class="d-flex align-items-center justify-content-between mb-4">
        <div>
            <h4 class="fw-bold mb-0">Firmendaten</h4>
            <small class="text-muted">Stammdaten &amp; Kontaktinformationen</small>
        </div>
        @if(Auth::user()->get_employee->is_mgt)
        <button class="btn btn-primary rounded-pill px-3" data-bs-toggle="modal" data-bs-target="#edit-company-modal">
            <i class="bi bi-pencil me-1"></i>Bearbeiten
        </button>
        @endif
    </div>

    @if(session('msg'))
        <div class="alert alert-success alert-dismissible fade show border-0 shadow-sm py-2 mb-4">
            <i class="bi bi-check-circle me-2"></i>{{ session('msg') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    {{-- Firmen-Header-Card --}}
    <div class="card border-0 shadow-sm mb-4">
        <div class="card-body px-4 py-3 d-flex align-items-center gap-4">
            <div class="flex-shrink-0">
                @if($company->logo)
                    <img src="{{ asset('assets/images/logo/' . $company->logo) }}"
                         alt="Logo" style="max-height:64px; max-width:180px; object-fit:contain;">
                @else
                    <span class="bg-primary bg-opacity-10 text-primary rounded d-flex align-items-center justify-content-center"
                          style="width:64px; height:64px; font-size:28px;">
                        <i class="bi bi-building"></i>
                    </span>
                @endif
            </div>
            <div>
                <h5 class="fw-bold mb-0">{{ $company->name ?? '—' }}</h5>
                @if($company->app_name)
                    <span class="text-muted small">{{ $company->app_name }}</span>
                @endif
                <div class="mt-1">
                    @if($company->webseite)
                        <span class="text-muted small"><i class="bi bi-globe me-1"></i>{{ $company->webseite }}</span>
                    @endif
                </div>
            </div>
        </div>
    </div>

    <div class="row g-3">

        {{-- Adresse --}}
        <div class="col-md-6">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body px-4 py-3">
                    <div class="d-flex align-items-center gap-2 mb-3">
                        <span class="bg-secondary bg-opacity-10 text-secondary rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
                              style="width:32px; height:32px;">
                            <i class="bi bi-geo-alt" style="font-size:14px;"></i>
                        </span>
                        <span class="fw-semibold small text-uppercase" style="letter-spacing:.05em;">Adresse</span>
                    </div>
                    <div class="text-muted small">Straße</div>
                    <div class="mb-2">{{ $company->str ?? '—' }} {{ $company->hn }}</div>
                    <div class="text-muted small">PLZ / Ort</div>
                    <div>{{ $company->plz ?? '—' }} {{ $company->ort }}</div>
                </div>
            </div>
        </div>

        {{-- Kontakt --}}
        <div class="col-md-6">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body px-4 py-3">
                    <div class="d-flex align-items-center gap-2 mb-3">
                        <span class="bg-primary bg-opacity-10 text-primary rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
                              style="width:32px; height:32px;">
                            <i class="bi bi-telephone" style="font-size:14px;"></i>
                        </span>
                        <span class="fw-semibold small text-uppercase" style="letter-spacing:.05em;">Kontakt</span>
                    </div>
                    @if($company->tel)
                        <div class="d-flex align-items-center gap-2 mb-2">
                            <i class="bi bi-telephone text-muted" style="width:16px;"></i>
                            <span class="small">{{ $company->tel }}</span>
                        </div>
                    @endif
                    @if($company->fax)
                        <div class="d-flex align-items-center gap-2 mb-2">
                            <i class="bi bi-printer text-muted" style="width:16px;"></i>
                            <span class="small">{{ $company->fax }}</span>
                        </div>
                    @endif
                    @if($company->email)
                        <div class="d-flex align-items-center gap-2 mb-2">
                            <i class="bi bi-envelope text-muted" style="width:16px;"></i>
                            <span class="small">{{ $company->email }}</span>
                        </div>
                    @endif
                    @if($company->webseite)
                        <div class="d-flex align-items-center gap-2">
                            <i class="bi bi-globe text-muted" style="width:16px;"></i>
                            <span class="small">{{ $company->webseite }}</span>
                        </div>
                    @endif
                    @if(!$company->tel && !$company->fax && !$company->email && !$company->webseite)
                        <span class="text-muted small">—</span>
                    @endif
                </div>
            </div>
        </div>

        {{-- Steuer --}}
        <div class="col-md-6">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body px-4 py-3">
                    <div class="d-flex align-items-center gap-2 mb-3">
                        <span class="bg-warning bg-opacity-10 text-warning rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
                              style="width:32px; height:32px;">
                            <i class="bi bi-receipt" style="font-size:14px;"></i>
                        </span>
                        <span class="fw-semibold small text-uppercase" style="letter-spacing:.05em;">Steuer</span>
                    </div>
                    <div class="row g-2">
                        <div class="col-12">
                            <div class="text-muted small">Steuernummer</div>
                            <div class="font-monospace">{{ $company->steuer_nr ?? '—' }}</div>
                        </div>
                        <div class="col-12 mt-2">
                            <div class="text-muted small">USt-IdNr.</div>
                            <div class="font-monospace">{{ $company->ust_id ?? '—' }}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        {{-- Bankdaten --}}
        <div class="col-md-6">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body px-4 py-3">
                    <div class="d-flex align-items-center gap-2 mb-3">
                        <span class="bg-success bg-opacity-10 text-success rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
                              style="width:32px; height:32px;">
                            <i class="bi bi-bank" style="font-size:14px;"></i>
                        </span>
                        <span class="fw-semibold small text-uppercase" style="letter-spacing:.05em;">Bankdaten</span>
                    </div>
                    <div class="text-muted small">Bank</div>
                    <div class="mb-2">{{ $company->bank_name ?? '—' }}</div>
                    <div class="text-muted small">Kontoinhaber</div>
                    <div class="mb-2">{{ $company->bank_inhaber ?? '—' }}</div>
                    <div class="text-muted small">IBAN</div>
                    <div class="font-monospace mb-2" style="letter-spacing:.04em;">{{ $company->bank_iban ?? '—' }}</div>
                    <div class="text-muted small">BIC</div>
                    <div class="font-monospace">{{ $company->bank_bic ?? '—' }}</div>
                </div>
            </div>
        </div>

    </div>
</div>

<script>
    (function () {
        'use strict';
        var forms = document.querySelectorAll('.needs-validation');
        Array.prototype.slice.call(forms).forEach(function (form) {
            form.addEventListener('submit', function (event) {
                if (!form.checkValidity()) {
                    event.preventDefault();
                    event.stopPropagation();
                }
                form.classList.add('was-validated');
            }, false);
        });
    })();

    @if($errors->any())
        var modal = new bootstrap.Modal(document.getElementById('edit-company-modal'));
        modal.show();
    @endif
</script>

@endsection