@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])

    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">

                @include('components.alert')

                {{-- Card Top Action (Kembali & Simpan) --}}
                <div class="card shadow-lg mx-1 mb-4">
                    <div class="card-body p-4">
                        <div class="row gx-4">
                            <div class="col-lg">
                                <div class="nav-wrapper">
                                    <a href="{{ url('/kontak-master?open=' . $key) }}" class="btn btn-secondary mb-0"><i class="fas fa-circle-left me-1"></i><span class="font-weight-bold">Kembali</span></a>
                                    <button class="btn btn-primary mb-0" onclick="event.preventDefault(); document.getElementById('kontakEditForm').submit();"><i class="fas fa-floppy-disk me-1"></i><span class="font-weight-bold">Simpan</span></button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="card shadow-sm border-0 mb-4 mx-1">
                    <div class="card-header pb-0 border-bottom">
                        <h5 class="mb-0 font-weight-bolder text-dark">Edit {{ $section['label'] }}</h5>
                    </div>
                    <div class="card-body p-4">
                        <form id="kontakEditForm" action="{{ route('kontak.update') }}" method="POST" enctype="multipart/form-data">
                            @csrf
                            <input type="hidden" name="section_key" value="{{ $key }}">

                            @if($key === 'info')
                                {{-- 1. Informasi Kontak Utama & Alamat --}}
                                <div class="row">
                                    <div class="col-md-6 mb-3">
                                        <label class="form-control-label fw-bold">Nomor Telepon</label>
                                        <input type="text" name="telepon" class="form-control" value="{{ old('telepon', $item->telepon ?? '') }}" placeholder="Contoh: +62 811-3010-4059">
                                    </div>
                                    <div class="col-md-6 mb-3">
                                        <label class="form-control-label fw-bold">Nomor WhatsApp (Tanpa + atau spasi)</label>
                                        <input type="text" name="whatsapp" class="form-control" value="{{ old('whatsapp', $item->whatsapp ?? '') }}" placeholder="Contoh: 6281130104059">
                                    </div>
                                    <div class="col-md-6 mb-3">
                                        <label class="form-control-label fw-bold">Email Perusahaan</label>
                                        <input type="email" name="email" class="form-control" value="{{ old('email', $item->email ?? '') }}" placeholder="Contoh: intisolveofficial@gmail.com">
                                    </div>
                                    <div class="col-md-6 mb-3">
                                        <label class="form-control-label fw-bold">Alamat Lengkap</label>
                                        <textarea name="alamat" class="form-control" rows="3" placeholder="Masukkan alamat lengkap">{{ old('alamat', $item->alamat ?? '') }}</textarea>
                                    </div>
                                    <div class="col-md-12 mb-3">
                                        <label class="form-control-label fw-bold">Link Embed Google Maps (URL / Tag iframe)</label>
                                        <input type="text" name="link_maps" class="form-control" value="{{ old('link_maps', $item->link_maps ?? '') }}" placeholder="https://www.google.com/maps/embed?pb=...">
                                        <small class="text-muted d-block mt-1"><i class="fas fa-info-circle text-primary me-1"></i> Buka Google Maps &rarr; Bagikan &rarr; Sempatkan Peta &rarr; Salin URL embed</small>
                                    </div>
                                    <div class="col-md-12 mb-3">
                                        <label class="form-control-label fw-bold">Gambar Peta Alternatif (Opsional)</label>
                                        @if($item && $item->gambar_peta)
                                            <div class="mb-2">
                                                <img src="{{ asset('storage/' . $item->gambar_peta) }}" class="img-thumbnail" style="max-height: 140px;">
                                            </div>
                                        @endif
                                        <input type="file" name="gambar_peta" class="form-control" accept="image/*">
                                        <small class="text-muted d-block mt-1"><i class="fas fa-info-circle text-primary me-1"></i> Upload gambar peta maksimal <b>4 MB</b>. Rasio yang direkomendasikan: <code>16:9 Landscape</code> atau <code>4:3</code> (Format: JPG/PNG/WebP).</small>
                                    </div>
                                </div>

                            @elseif($key === 'floating')
                                {{-- 2. Floating Action Buttons --}}
                                <div class="row mb-4">
                                    <div class="col-md-6 mb-3">
                                        <div class="card border p-3">
                                            <div class="form-check form-switch mb-0">
                                                <input class="form-check-input" type="checkbox" name="floating_wa_isactive" id="floatingWaCheck" {{ old('floating_wa_isactive', $item->floating_wa_isactive ?? 1) ? 'checked' : '' }}>
                                                <label class="form-check-label fw-bold text-dark" for="floatingWaCheck">Aktifkan Floating WhatsApp</label>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-md-6 mb-3">
                                        <div class="card border p-3">
                                            <div class="form-check form-switch mb-0">
                                                <input class="form-check-input" type="checkbox" name="floating_email_isactive" id="floatingEmailCheck" {{ old('floating_email_isactive', $item->floating_email_isactive ?? 1) ? 'checked' : '' }}>
                                                <label class="form-check-label fw-bold text-dark" for="floatingEmailCheck">Aktifkan Floating Email</label>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-md-12 mb-2">
                                        <label class="form-control-label fw-bold">Posisi Floating Button Pada Layar</label>
                                        <select name="floating_position" class="form-select">
                                            <option value="bottom-right" {{ old('floating_position', $item->floating_position ?? '') == 'bottom-right' ? 'selected' : '' }}>Bottom Right (Kanan Bawah)</option>
                                            <option value="bottom-left" {{ old('floating_position', $item->floating_position ?? '') == 'bottom-left' ? 'selected' : '' }}>Bottom Left (Kiri Bawah)</option>
                                        </select>
                                    </div>
                                </div>

                                {{-- Multi-Language Floating Tooltip Texts --}}
                                <div class="row">
                                    <div class="col-md-6 mb-4">
                                        <div class="card border">
                                            <div class="card-header bg-light fw-bold text-dark">🇮🇩 Teks Tooltip Bahasa Indonesia</div>
                                            <div class="card-body">
                                                <div class="mb-3">
                                                    <label class="form-control-label fw-bold">Teks Tooltip WhatsApp (ID)</label>
                                                    <input type="text" name="floating_wa_text_id" class="form-control" value="{{ old('floating_wa_text_id', $langId->floating_wa_text ?? ($item->floating_wa_text ?? 'Hubungi Kami via WhatsApp')) }}" placeholder="Hubungi Kami via WhatsApp">
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-control-label fw-bold">Teks Tooltip Email (ID)</label>
                                                    <input type="text" name="floating_email_text_id" class="form-control" value="{{ old('floating_email_text_id', $langId->floating_email_text ?? ($item->floating_email_text ?? 'Kirim Email Ke Kami')) }}" placeholder="Kirim Email Ke Kami">
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-md-6 mb-4">
                                        <div class="card border">
                                            <div class="card-header bg-light fw-bold text-dark">🇬🇧 English Tooltip Content</div>
                                            <div class="card-body">
                                                <div class="mb-3">
                                                    <label class="form-control-label fw-bold">WhatsApp Tooltip Text (EN)</label>
                                                    <input type="text" name="floating_wa_text_en" class="form-control" value="{{ old('floating_wa_text_en', $langEn->floating_wa_text ?? 'Contact Us via WhatsApp') }}" placeholder="Contact Us via WhatsApp">
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-control-label fw-bold">Email Tooltip Text (EN)</label>
                                                    <input type="text" name="floating_email_text_en" class="form-control" value="{{ old('floating_email_text_en', $langEn->floating_email_text ?? 'Send Us an Email') }}" placeholder="Send Us an Email">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            @elseif($key === 'halaman')
                                {{-- 3. Teks Halaman Multi-Bahasa --}}
                                <div class="row">
                                    <div class="col-md-6 mb-4">
                                        <div class="card border">
                                            <div class="card-header bg-light fw-bold text-dark">🇮🇩 Bahasa Indonesia</div>
                                            <div class="card-body">
                                                <div class="mb-3">
                                                    <label class="form-control-label fw-bold">Judul Halaman (ID)</label>
                                                    <input type="text" name="judul_halaman_id" class="form-control" value="{{ old('judul_halaman_id', $langId->judul_halaman ?? 'Hubungi Kami') }}" required>
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-control-label fw-bold">Subjudul Halaman (ID)</label>
                                                    <input type="text" name="subjudul_halaman_id" class="form-control" value="{{ old('subjudul_halaman_id', $langId->subjudul_halaman ?? '') }}">
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-control-label">Meta Title (ID)</label>
                                                    <input type="text" name="meta_title_id" class="form-control" value="{{ old('meta_title_id', $langId->meta_title ?? '') }}">
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-control-label">Meta Description (ID)</label>
                                                    <textarea name="meta_description_id" class="form-control" rows="2">{{ old('meta_description_id', $langId->meta_description ?? '') }}</textarea>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-md-6 mb-4">
                                        <div class="card border">
                                            <div class="card-header bg-light fw-bold text-dark">🇬🇧 English</div>
                                            <div class="card-body">
                                                <div class="mb-3">
                                                    <label class="form-control-label fw-bold">Judul Halaman (EN)</label>
                                                    <input type="text" name="judul_halaman_en" class="form-control" value="{{ old('judul_halaman_en', $langEn->judul_halaman ?? 'Contact Us') }}" required>
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-control-label fw-bold">Subjudul Halaman (EN)</label>
                                                    <input type="text" name="subjudul_halaman_en" class="form-control" value="{{ old('subjudul_halaman_en', $langEn->subjudul_halaman ?? '') }}">
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-control-label">Meta Title (EN)</label>
                                                    <input type="text" name="meta_title_en" class="form-control" value="{{ old('meta_title_en', $langEn->meta_title ?? '') }}">
                                                </div>
                                                <div class="mb-3">
                                                    <label class="form-control-label">Meta Description (EN)</label>
                                                    <textarea name="meta_description_en" class="form-control" rows="2">{{ old('meta_description_en', $langEn->meta_description ?? '') }}</textarea>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @endif

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

            </div>
        </div>
    </div>
@endsection