@extends('admin.layouts.admin')

@section('title', 'Edit Module')
@section('page_title', 'Edit Module: ' . $module->title)

@section('content')
    <div class="max-w-5xl mx-auto pb-20">
        <form action="{{ route('admin.modules.update', $module) }}" method="POST" class="space-y-6">
            @csrf
            @method('PUT')

            <!-- Header & Meta -->
            <div class="bg-white p-6 rounded-lg shadow-sm border border-slate-200 flex items-center justify-between">
                <div>
                    <h2 class="text-xl font-bold text-[#404e67]">Edit Module: {{ $module->title }}</h2>
                    <p class="text-xs text-slate-400 mt-1">
                        Type: <span
                            class="text-primary font-bold uppercase tracking-widest text-[10px]">{{ $module->type }}</span>
                        <span class="mx-2 text-slate-200">|</span>
                        Key: <span class="font-mono text-[10px] font-bold text-slate-500">#{{ $module->key }}</span>
                    </p>
                </div>
                <div class="flex items-center space-x-3">
                    <a href="{{ route('admin.modules.index') }}"
                        class="text-slate-400 hover:text-slate-600 font-bold text-xs transition">Discard</a>
                    <button type="submit"
                        class="bg-primary text-white px-5 py-2.5 rounded-md font-bold text-xs shadow-lg shadow-blue-500/20 hover:bg-primary-hover transition-all">
                        Save Changes
                    </button>
                </div>
            </div>

            <!-- Basic Settings -->
            <div class="bg-white rounded-lg shadow-sm border border-slate-200 overflow-hidden">
                <div class="px-6 py-4 border-b border-slate-100 bg-slate-50/50">
                    <h3 class="text-[10px] font-black text-slate-400 uppercase tracking-widest">Base Configuration</h3>
                </div>
                <div class="p-6">
                    <div class="space-y-2 max-w-2xl">
                        <label class="text-[10px] font-bold text-slate-500 uppercase tracking-wider pl-1">Module Title
                            (Internal Only)</label>
                        <input type="text" name="title" value="{{ old('title', $module->title) }}" required
                            class="w-full bg-slate-50 border-slate-200 rounded-lg px-4 py-2.5 font-bold text-slate-800 transition-all focus:ring-4 focus:ring-blue-500/10 border text-sm">
                    </div>
                </div>
            </div>

            <!-- Dynamic Content Section -->
            <div class="bg-white rounded-lg shadow-sm border border-slate-200 overflow-hidden">
                <div class="px-6 py-4 border-b border-slate-100 bg-slate-50/50">
                    <h4 class="text-[10px] font-black text-[#404e67] uppercase tracking-widest">Default Content
                        Configuration</h4>
                </div>

                <div class="p-6">
                    @php
                        $partialPath = "admin.modules.partials." . $module->type;
                    @endphp

                    @if(view()->exists($partialPath))
                        @include($partialPath, ['content' => $module->content])
                    @else
                        <div class="p-6 bg-amber-50 rounded-xl border border-amber-100 text-amber-700 flex items-start">
                            <i class="fas fa-exclamation-triangle mt-1 mr-4"></i>
                            <div>
                                <p class="font-bold text-sm">Partial Not Found</p>
                                <p class="text-xs">The default editor for type "{{ $module->type }}" has not been implemented
                                    yet.</p>
                            </div>
                        </div>
                    @endif
                </div>
            </div>
        </form>
    </div>
@endsection