@extends('agency.layouts.app')

@section('title', 'Vergi Oranları')

@section('content')
<div class="container-fluid py-4">
    <!-- Header Section -->
    <div class="row mb-5">
        <div class="col-12">
            <div class="d-flex align-items-center gap-3 mb-2">
                <a href="{{ route('agency.settings') }}" class="btn btn-outline-secondary btn-sm px-3 py-2" style="border-radius: 12px; border-color: #e2e8f0; font-weight: 600;">
                    <i class="fas fa-arrow-left me-1"></i> Ayarlara Dön
                </a>
                <div class="settings-icon-wrapper ms-2">
                    <i class="fas fa-percent text-success"></i>
                </div>
                <div>
                    <h1 class="h3 fw-800 text-dark mb-0">Vergi Oranları</h1>
                    <p class="text-muted mb-0">Vergileri tiplere ayırıp her tipin altına istediğiniz kadar oran tanımlayın. Formlardaki vergi alanları yalnızca kendi tipinin oranlarını listeler.</p>
                </div>
            </div>
            <div class="header-divider mt-4"></div>
        </div>
    </div>

    <div class="d-flex justify-content-between align-items-center mb-3">
        <h4 class="fw-bold text-dark mb-0">Vergi Tipleri</h4>
        <div class="d-flex gap-2">
            <button type="button" class="btn btn-sm btn-outline-primary fw-bold py-2 px-3" data-bs-toggle="modal" data-bs-target="#addTaxTypeModal" style="border-radius: 10px;">
                <i class="fas fa-layer-group me-1"></i> Yeni Vergi Tipi
            </button>
            <button type="button" class="btn btn-sm btn-primary fw-bold py-2 px-3 shadow-sm" data-bs-toggle="modal" data-bs-target="#addTaxRateModal" style="border-radius: 10px; background: linear-gradient(135deg, #4f46e5, #3730a3); border: none;">
                <i class="fas fa-plus me-1"></i> Yeni Oran Ekle
            </button>
        </div>
    </div>

    <form action="{{ route('agency.settings.tax-rates.bulk-update') }}" method="POST">
        @csrf
        <div class="row g-4">
            @forelse($taxTypes as $type)
                <div class="col-12">
                    <div class="settings-card shadow-sm" style="background: white; border-radius: 20px; border: 1px solid rgba(0,0,0,0.03);">
                        <div class="card-body p-4">
                            <div class="d-flex justify-content-between align-items-center mb-3">
                                <div class="d-flex align-items-center gap-2">
                                    <h5 class="fw-bold text-dark mb-0">{{ $type->name }}</h5>
                                    <code class="small text-muted">{{ $type->code }}</code>
                                    @if($type->is_system)
                                        <span class="badge fw-bold px-2 py-1" style="font-size: 0.65rem; border-radius: 6px; color: #4f46e5; background-color: rgba(79, 70, 229, 0.1);">Sistem Tipi</span>
                                    @endif
                                    @unless($type->is_active)
                                        <span class="badge bg-secondary fw-bold px-2 py-1" style="font-size: 0.65rem; border-radius: 6px;">Pasif</span>
                                    @endunless
                                </div>
                                @unless($type->is_system)
                                    <button type="button" class="btn btn-link btn-sm text-danger p-0 shadow-none border-0" onclick="deleteTaxType({{ $type->id }}, '{{ addslashes($type->name) }}')" title="Tipi sil">
                                        <i class="fas fa-trash me-1"></i> Tipi Sil
                                    </button>
                                @endunless
                            </div>

                            <div class="table-responsive">
                                <table class="table align-middle table-hover mb-0">
                                    <thead class="table-light">
                                        <tr style="font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 700;">
                                            <th>Oran Adı</th>
                                            <th style="width: 220px;">Oran (%)</th>
                                            <th style="width: 120px;" class="text-center">Varsayılan</th>
                                            <th style="width: 120px;" class="text-center">Aktif</th>
                                            <th style="width: 100px;" class="text-end">İşlemler</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @forelse($type->rates as $tax)
                                            <tr>
                                                <td class="fw-bold text-dark" style="font-size: 0.95rem;">{{ $tax->name }}</td>
                                                <td>
                                                    <div class="input-group input-group-sm" style="max-width: 180px;">
                                                        <input type="number" name="rates[{{ $tax->id }}]" step="0.01" min="0" max="100" class="form-control fw-bold" value="{{ (float) $tax->rate }}" required style="border-radius: 6px 0 0 6px;">
                                                        <span class="input-group-text small text-muted" style="border-radius: 0 6px 6px 0;">%</span>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="form-check d-inline-block">
                                                        <input class="form-check-input" type="radio" name="default[{{ $type->id }}]" value="{{ $tax->id }}" {{ $tax->is_default ? 'checked' : '' }} title="Bu tipin formlarında önseçili gelir">
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="form-check form-switch d-inline-block">
                                                        <input class="form-check-input" type="checkbox" name="active[]" value="{{ $tax->id }}" {{ $tax->is_active ? 'checked' : '' }} {{ $tax->is_default ? 'disabled' : '' }}>
                                                    </div>
                                                </td>
                                                <td class="text-end">
                                                    @if(!$tax->is_default)
                                                        <button type="button" class="btn btn-link btn-sm text-danger p-0 shadow-none border-0" onclick="deleteTaxRate({{ $tax->id }})" title="Sil">
                                                            <i class="fas fa-trash"></i>
                                                        </button>
                                                    @else
                                                        <span class="text-muted small">—</span>
                                                    @endif
                                                </td>
                                            </tr>
                                        @empty
                                            <tr>
                                                <td colspan="5" class="text-center text-muted py-4">
                                                    Bu tipin altında oran yok. "Yeni Oran Ekle" ile başlayın.
                                                </td>
                                            </tr>
                                        @endforelse
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            @empty
                <div class="col-12">
                    <div class="settings-card shadow-sm" style="background: white; border-radius: 20px;">
                        <div class="card-body p-5 text-center text-muted">Vergi tipi tanımlanmamış.</div>
                    </div>
                </div>
            @endforelse
        </div>

        <div class="alert alert-light border mt-4 mb-0 small text-muted" style="border-radius: 10px;">
            <i class="fas fa-circle-info me-1 text-primary"></i>
            Bir oranı değiştirmek yalnızca yeni kayıtları etkiler; mevcut satış ve fiyat kayıtları oluşturuldukları andaki oranı korur.
            Her tipin varsayılan oranı formlarda önseçili gelir ve her zaman aktiftir.
        </div>

        @if($taxTypes->isNotEmpty())
            <div class="d-flex justify-content-end mt-3">
                <button type="submit" class="btn btn-sm btn-warning text-white fw-bold py-2 px-4 shadow-sm" style="border-radius: 10px; background: linear-gradient(135deg, #d97706, #b45309); border: none;">
                    <i class="fas fa-save me-1"></i> Vergi Oranlarını Güncelle
                </button>
            </div>
        @endif
    </form>
</div>

<!-- Add Tax Type Modal -->
<div class="modal fade" id="addTaxTypeModal" tabindex="-1" aria-hidden="true" style="z-index: 1060;">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content" style="border-radius: 20px; border: none; box-shadow: 0 10px 30px rgba(0,0,0,0.15);">
            <div class="modal-header border-0 bg-light py-3" style="border-radius: 20px 20px 0 0;">
                <h5 class="modal-title fw-bold text-dark"><i class="fas fa-layer-group text-primary me-2"></i>Yeni Vergi Tipi</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form action="{{ route('agency.settings.tax-types.store') }}" method="POST">
                @csrf
                <div class="modal-body p-4">
                    <div class="mb-3">
                        <label class="form-label small fw-bold text-muted mb-1" style="font-size:0.75rem; text-transform:uppercase;">Tip Adı *</label>
                        <input type="text" name="name" class="form-control" placeholder="Örn: Konaklama Vergisi" required maxlength="50" style="border-radius: 8px;">
                        <div class="form-text" style="font-size:0.72rem;">Tipi ekledikten sonra altına istediğiniz kadar oran tanımlayabilirsiniz.</div>
                    </div>
                </div>
                <div class="modal-footer border-0 bg-light py-3" style="border-radius: 0 0 20px 20px;">
                    <button type="button" class="btn btn-sm btn-light fw-bold px-3 py-2" data-bs-dismiss="modal" style="border-radius: 8px;">Vazgeç</button>
                    <button type="submit" class="btn btn-sm btn-primary fw-bold px-4 py-2" style="border-radius: 8px; background: linear-gradient(135deg, #4f46e5, #3730a3); border: none;">Kaydet</button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Add Tax Rate Modal -->
<div class="modal fade" id="addTaxRateModal" tabindex="-1" aria-hidden="true" style="z-index: 1060;">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content" style="border-radius: 20px; border: none; box-shadow: 0 10px 30px rgba(0,0,0,0.15);">
            <div class="modal-header border-0 bg-light py-3" style="border-radius: 20px 20px 0 0;">
                <h5 class="modal-title fw-bold text-dark"><i class="fas fa-plus-circle text-primary me-2"></i>Yeni Oran Ekle</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form action="{{ route('agency.settings.tax-rates.store') }}" method="POST">
                @csrf
                <div class="modal-body p-4">
                    <div class="mb-3">
                        <label class="form-label small fw-bold text-muted mb-1" style="font-size:0.75rem; text-transform:uppercase;">Vergi Tipi *</label>
                        <select name="tax_type_id" class="form-select" required style="border-radius: 8px;">
                            @foreach($taxTypes as $type)
                                <option value="{{ $type->id }}">{{ $type->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="mb-3">
                        <label class="form-label small fw-bold text-muted mb-1" style="font-size:0.75rem; text-transform:uppercase;">Oran Adı (örn: KDV %20) *</label>
                        <input type="text" name="name" class="form-control" placeholder="KDV %20" required maxlength="50" style="border-radius: 8px;">
                        <div class="form-text" style="font-size:0.72rem;">Aynı tip altında aynı adla kayıt varsa oranı güncellenir.</div>
                    </div>
                    <div class="mb-3">
                        <label class="form-label small fw-bold text-muted mb-1" style="font-size:0.75rem; text-transform:uppercase;">Oran (%) *</label>
                        <input type="number" name="rate" step="0.01" min="0" max="100" class="form-control" placeholder="20" required style="border-radius: 8px;">
                    </div>
                    <div class="mb-3 form-check form-switch">
                        <input class="form-check-input" type="checkbox" name="is_active" id="tax_active" checked value="1">
                        <label class="form-check-label small fw-bold text-muted" for="tax_active">Aktif</label>
                    </div>
                    <div class="form-check form-switch">
                        <input class="form-check-input" type="checkbox" name="is_default" id="tax_default" value="1">
                        <label class="form-check-label small fw-bold text-muted" for="tax_default">Bu tipin varsayılanı (formlarda önseçili gelir)</label>
                    </div>
                </div>
                <div class="modal-footer border-0 bg-light py-3" style="border-radius: 0 0 20px 20px;">
                    <button type="button" class="btn btn-sm btn-light fw-bold px-3 py-2" data-bs-dismiss="modal" style="border-radius: 8px;">Vazgeç</button>
                    <button type="submit" class="btn btn-sm btn-primary fw-bold px-4 py-2" style="border-radius: 8px; background: linear-gradient(135deg, #4f46e5, #3730a3); border: none;">Kaydet</button>
                </div>
            </form>
        </div>
    </div>
</div>

<form id="delete-tax-rate-form" action="" method="POST" style="display: none;">
    @csrf
    @method('DELETE')
</form>

<form id="delete-tax-type-form" action="" method="POST" style="display: none;">
    @csrf
    @method('DELETE')
</form>

<script>
    function deleteTaxRate(id) {
        Swal.fire({
            title: 'Emin misiniz?',
            text: "Bu oranı silmek istediğinize emin misiniz? Mevcut kayıtların vergi oranları değişmez.",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#d33',
            cancelButtonColor: '#3085d6',
            confirmButtonText: 'Evet, Sil!',
            cancelButtonText: 'Vazgeç'
        }).then((result) => {
            if (result.isConfirmed) {
                const form = document.getElementById('delete-tax-rate-form');
                form.action = '{{ route('agency.settings.tax-rates.destroy', ['taxRate' => '__ID__']) }}'.replace('__ID__', id);
                form.submit();
            }
        });
    }

    function deleteTaxType(id, name) {
        Swal.fire({
            title: name + ' silinsin mi?',
            text: "Bu tip ve altındaki TÜM oranlar silinecek. Mevcut kayıtların vergi oranları değişmez.",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#d33',
            cancelButtonColor: '#3085d6',
            confirmButtonText: 'Evet, Sil!',
            cancelButtonText: 'Vazgeç'
        }).then((result) => {
            if (result.isConfirmed) {
                const form = document.getElementById('delete-tax-type-form');
                form.action = '{{ route('agency.settings.tax-types.destroy', ['taxType' => '__ID__']) }}'.replace('__ID__', id);
                form.submit();
            }
        });
    }
</script>

<style>
    .settings-icon-wrapper {
        width: 54px;
        height: 54px;
        background: white;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.8rem;
        box-shadow: 0 10px 25px rgba(99, 102, 241, 0.1);
    }
    .fw-800 { font-weight: 800; }
    .header-divider {
        height: 3px;
        width: 60px;
        background: linear-gradient(to right, var(--bs-primary), transparent);
        border-radius: 10px;
    }
</style>
@endsection