@extends('layouts.app')

@section('title', 'Configuración General')

@section('content')
<div class="page-header">
    <h1 class="page-title">Ajustes del Sistema de Licencias</h1>
</div>

@if(session('success'))
    <div style="background: rgba(35, 134, 54, 0.2); color: #3fb950; padding: 12px; border-radius: 8px; margin-bottom: 20px; border: 1px solid rgba(35, 134, 54, 0.4);">
        <i class="fa-solid fa-check-circle"></i> {{ session('success') }}
    </div>
@endif

<div class="card" style="max-width: 800px;">
    <form action="{{ route('configuracion.store') }}" method="POST">
        @csrf
        
        <h3 style="margin-bottom: 15px; font-size: 1.1rem; color: var(--text-main); border-bottom: 1px solid var(--border-color); padding-bottom: 10px;">Perfil Institucional</h3>
        
        <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px;">
            <div>
                <label style="display: block; margin-bottom: 8px; color: var(--text-muted); font-size: 0.9rem;">Nombre del Proveedor (Tu Empresa) *</label>
                <input type="text" name="nombre_proveedor" value="{{ $configuracion->nombre_proveedor ?? '' }}" required style="width: 100%; padding: 12px; border-radius: 6px; border: 1px solid var(--border-color); background: var(--bg-body); color: var(--text-main);">
            </div>
            <div>
                <label style="display: block; margin-bottom: 8px; color: var(--text-muted); font-size: 0.9rem;">Teléfono de Soporte</label>
                <input type="text" name="telefono_contacto" value="{{ $configuracion->telefono_contacto ?? '' }}" style="width: 100%; padding: 12px; border-radius: 6px; border: 1px solid var(--border-color); background: var(--bg-body); color: var(--text-main);">
            </div>
        </div>
        
        <div style="margin-bottom: 30px;">
            <label style="display: block; margin-bottom: 8px; color: var(--text-muted); font-size: 0.9rem;">Email de Contacto</label>
            <input type="email" name="email_contacto" value="{{ $configuracion->email_contacto ?? '' }}" style="width: 100%; padding: 12px; border-radius: 6px; border: 1px solid var(--border-color); background: var(--bg-body); color: var(--text-main);">
        </div>

        <h3 style="margin-bottom: 15px; font-size: 1.1rem; color: var(--text-main); border-bottom: 1px solid var(--border-color); padding-bottom: 10px;">Criptografía (HMAC-SHA256)</h3>
        
        <div style="background: rgba(210, 153, 34, 0.1); border-left: 4px solid var(--warning); padding: 15px; border-radius: 4px; margin-bottom: 20px; font-size: 0.85rem; color: var(--text-muted);">
            <i class="fa-solid fa-triangle-exclamation" style="color: var(--warning);"></i> <strong>ALERTA PELIGRO:</strong> Modificar el <code style="color: #e6edf3;">Secret_Key</code> invalidará automáticamente todas las licencias que tus clientes hayan instalado, dado que el sistema local de ellos no podrá descifrar los hashes. Solo cámbialo en caso de vulnerabilidad grave.
        </div>

        <div style="margin-bottom: 30px;">
            <label style="display: block; margin-bottom: 8px; color: var(--text-muted); font-size: 0.9rem;">Llave Secreta Maestra (Secret Key) *</label>
            <input type="text" name="secret_key" value="{{ $configuracion->secret_key ?? '' }}" required style="width: 100%; padding: 12px; border-radius: 6px; border: 1px solid var(--border-color); background: var(--bg-body); color: var(--text-main); font-family: monospace;">
        </div>

        <h3 style="margin-bottom: 15px; font-size: 1.1rem; color: var(--text-main); border-bottom: 1px solid var(--border-color); padding-bottom: 10px;">Seguridad del Panel</h3>

        <div style="margin-bottom: 25px;">
            <label style="display: block; margin-bottom: 8px; color: var(--text-muted); font-size: 0.9rem;">Nueva Contraseña de Administrador <small>(Ojar en blanco para no cambiar)</small></label>
            <input type="password" name="new_password" style="width: 100%; padding: 12px; border-radius: 6px; border: 1px solid var(--border-color); background: var(--bg-body); color: var(--text-main);">
        </div>

        <div style="display: flex; justify-content: flex-end;">
            <button type="submit" class="btn btn-primary"><i class="fa-solid fa-save"></i> Guardar Cambios</button>
        </div>
    </form>
</div>
@endsection