@extends('admin.layouts.app')
@section('title', 'Configuración')
@section('icon', 'gear-fill')
@section('page-title', 'Configuración del Sitio')

@section('content')
<div class="page-header">
    <div class="page-header-left">
        <h1><i class="bi bi-gear-fill"></i> Configuración del Sitio</h1>
        <div class="breadcrumb"><a href="{{ route('admin.dashboard') }}">Dashboard</a> <span class="breadcrumb-sep">/</span> <span>Configuración</span></div>
    </div>
</div>

<form action="{{ route('admin.configuracion.update') }}" method="POST">
    @csrf @method('POST')

    @php $configs = $configuraciones->flatten()->keyBy('clave'); @endphp

    <div style="display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;">

        <!-- Empresa -->
        <div class="card">
            <div class="card-header">
                <div class="card-title"><i class="bi bi-building-fill"></i> Datos de la Empresa</div>
            </div>
            <div class="card-body">
                @foreach(['empresa_nombre'=>'Nombre de la Empresa','empresa_ruc'=>'RUC','empresa_telefono'=>'Teléfono','empresa_email'=>'Email de Contacto','empresa_direccion'=>'Dirección','empresa_horario'=>'Horario de Atención'] as $key => $label)
                <div class="form-group">
                    <label class="form-label">{{ $label }}</label>
                    <input type="text" name="{{ $key }}" class="form-control"
                           value="{{ old($key, $configs[$key]->valor ?? '') }}">
                </div>
                @endforeach
            </div>
        </div>

        <!-- Redes Sociales -->
        <div class="card">
            <div class="card-header">
                <div class="card-title"><i class="bi bi-share-fill"></i> Redes Sociales</div>
            </div>
            <div class="card-body">
                @foreach(['social_facebook'=>['Facebook','bi-facebook'],'social_instagram'=>['Instagram','bi-instagram'],'social_youtube'=>['YouTube','bi-youtube'],'social_whatsapp'=>['WhatsApp (solo números)','bi-whatsapp']] as $key => [$label, $icon])
                <div class="form-group">
                    <label class="form-label"><i class="bi {{ $icon }}"></i> {{ $label }}</label>
                    <input type="text" name="{{ $key }}" class="form-control"
                           value="{{ old($key, $configs[$key]->valor ?? '') }}">
                </div>
                @endforeach
            </div>
        </div>

        <!-- Hero -->
        <div class="card">
            <div class="card-header">
                <div class="card-title"><i class="bi bi-stars"></i> Textos del Hero</div>
            </div>
            <div class="card-body">
                <div class="form-group">
                    <label class="form-label">Título Principal</label>
                    <input type="text" name="hero_titulo" class="form-control" value="{{ old('hero_titulo', $configs['hero_titulo']->valor ?? '') }}">
                </div>
                <div class="form-group">
                    <label class="form-label">Subtítulo</label>
                    <input type="text" name="hero_subtitulo" class="form-control" value="{{ old('hero_subtitulo', $configs['hero_subtitulo']->valor ?? '') }}">
                </div>
            </div>
        </div>

        <!-- SEO -->
        <div class="card">
            <div class="card-header">
                <div class="card-title"><i class="bi bi-search"></i> SEO y Footer</div>
            </div>
            <div class="card-body">
                <div class="form-group">
                    <label class="form-label">Meta Descripción (SEO)</label>
                    <textarea name="meta_descripcion" class="form-control" rows="3">{{ old('meta_descripcion', $configs['meta_descripcion']->valor ?? '') }}</textarea>
                </div>
                <div class="form-group">
                    <label class="form-label">Descripción del Footer</label>
                    <textarea name="footer_descripcion" class="form-control" rows="3">{{ old('footer_descripcion', $configs['footer_descripcion']->valor ?? '') }}</textarea>
                </div>
            </div>
        </div>
    </div>

    <div style="display:flex;justify-content:flex-end;margin-top:1.5rem;">
        <button type="submit" class="btn btn-primary btn-lg">
            <i class="bi bi-save-fill"></i> Guardar Configuración
        </button>
    </div>
</form>
@endsection