@extends('layouts.app')
@section('titulo','Configuración')
@section('contenido')
<h4><i class="fa fa-gear"></i> Configuración del sistema</h4>
<p class="text-muted small">Personaliza identidad, apariencia y operación. Todos los valores son administrables.</p>
<form method="POST" action="{{ route('configuracion.update') }}" enctype="multipart/form-data">
  @csrf
  <ul class="nav nav-tabs mb-3" role="tablist">
    @foreach($items as $grupo => $_)
      <li class="nav-item"><a class="nav-link @if($loop->first) active @endif" data-bs-toggle="tab" href="#tab-{{ $grupo }}">{{ ucfirst($grupo) }}</a></li>
    @endforeach
  </ul>
  <div class="tab-content">
    @foreach($items as $grupo => $confs)
      <div id="tab-{{ $grupo }}" class="tab-pane fade @if($loop->first) show active @endif">
        <div class="row g-3">
          @foreach($confs as $c)
            <div class="col-md-6">
              <label class="form-label small fw-bold">{{ $c->etiqueta }}</label>
              @switch($c->tipo)
                @case('booleano')
                  <div class="form-check form-switch">
                    <input type="hidden" name="config[{{ $c->clave }}]" value="0">
                    <input type="checkbox" name="config[{{ $c->clave }}]" value="1"
                           class="form-check-input" {{ $c->valor=='1'?'checked':'' }}>
                    <label class="form-check-label">Activo</label>
                  </div>
                  @break
                @case('color')
                  <input type="color" name="config[{{ $c->clave }}]" value="{{ $c->valor ?: '#000000' }}" class="form-control form-control-color">
                  @break
                @case('numero')
                  <input type="number" step="any" name="config[{{ $c->clave }}]" value="{{ $c->valor }}" class="form-control">
                  @break
                @case('textarea')
                  <textarea name="config[{{ $c->clave }}]" class="form-control" rows="8" style="font-family: monospace;">{{ $c->valor }}</textarea>
                  @break
                @case('archivo')
                  <input type="file" name="archivo[{{ $c->clave }}]" class="form-control" accept="image/*">
                  @if($c->valor)
                    <img src="{{ asset(str_replace('storage/','storage/',$c->valor)) }}" class="mt-2" style="max-height:60px;">
                    <input type="hidden" name="config[{{ $c->clave }}]" value="{{ $c->valor }}">
                  @endif
                  @break
                @default
                  <input type="text" name="config[{{ $c->clave }}]" value="{{ $c->valor }}" class="form-control">
              @endswitch
              @if($c->descripcion)<small class="text-muted">{{ $c->descripcion }}</small>@endif
            </div>
          @endforeach
        </div>
      </div>
    @endforeach
  </div>
  <div class="mt-3 text-end">
    <button class="btn btn-primario"><i class="fa fa-save"></i> Guardar</button>
  </div>
</form>
@endsection