@extends('layouts.admin')

@section('content')
    <div class="row mb-3 align-items-center">
        <div class="col-md-6">
            <h1 class="m-0 font-weight-bold text-dark" style="font-size: 1.8rem;">
                <i class="bi bi-gear-fill text-primary mr-2"></i> Configuración de Facturación Electrónica
            </h1>
            <p class="text-muted mb-0">Parámetros tributarios, certificado digital y conexión ante el SRI</p>
        </div>
        <div class="col-md-6 text-md-right mt-3 mt-md-0">
            <a href="{{ route('admin.facturas.index') }}" class="btn btn-outline-secondary shadow-sm mr-2">
                <i class="bi bi-receipt mr-1"></i> Facturas
            </a>
            <a href="{{ route('admin.puntos_emision.index') }}" class="btn btn-outline-primary shadow-sm">
                <i class="bi bi-geo-alt-fill mr-1"></i> Puntos de Emisión
            </a>
        </div>
    </div>

    @if($errors->any())
        <div class="alert alert-danger alert-dismissible fade show shadow-sm" role="alert">
            <h6 class="font-weight-bold"><i class="fas fa-exclamation-circle mr-2"></i> Por favor verifique los siguientes errores:</h6>
            <ul class="mb-0 pl-3">
                @foreach($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    @endif

    <form action="{{ route('admin.facturacion.configuracion.update') }}" method="POST" enctype="multipart/form-data">
        @csrf
        @method('PUT')

        <div class="row">
            <!-- COLUMNA IZQUIERDA: DATOS FISCALES DEL EMISOR -->
            <div class="col-lg-8">
                <!-- Tarjeta 1: Datos Generales y Tributarios -->
                <div class="card card-outline card-primary shadow-sm mb-4">
                    <div class="card-header py-3 bg-light">
                        <h5 class="card-title font-weight-bold text-dark m-0">
                            <i class="fas fa-building text-primary mr-2"></i> Datos Fiscales del Emisor (RUC)
                        </h5>
                    </div>

                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-8">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Razón Social: <span class="text-danger">*</span></label>
                                    <input type="text" name="razon_social" class="form-control font-weight-bold" value="{{ old('razon_social', $config->razon_social) }}" required placeholder="Nombre legal de la clínica o profesional">
                                    <small class="text-muted">Exactamente como consta en su Registro Único de Contribuyentes (RUC).</small>
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">R.U.C. (13 dígitos): <span class="text-danger">*</span></label>
                                    <div class="input-group">
                                        <div class="input-group-prepend">
                                            <span class="input-group-text font-weight-bold"><i class="fas fa-id-card"></i></span>
                                        </div>
                                        <input type="text" name="ruc" class="form-control font-weight-bold text-primary" maxlength="13" value="{{ old('ruc', $config->ruc) }}" required placeholder="Ej: 1790012345001">
                                    </div>
                                    <small class="text-muted">Debe terminar en 001.</small>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Nombre Comercial:</label>
                                    <input type="text" name="nombre_comercial" class="form-control" value="{{ old('nombre_comercial', $config->nombre_comercial) }}" placeholder="Nombre de fantasía o consultorio">
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Régimen Tributario SRI: <span class="text-danger">*</span></label>
                                    <select name="regimen" class="form-control font-weight-bold" required>
                                        <option value="GENERAL" {{ old('regimen', $config->regimen) == 'GENERAL' ? 'selected' : '' }}>Régimen General</option>
                                        <option value="RIMPE_EMPRENDEDOR" {{ old('regimen', $config->regimen) == 'RIMPE_EMPRENDEDOR' ? 'selected' : '' }}>Régimen RIMPE - Negocio Emprendedor</option>
                                        <option value="RIMPE_POPULAR" {{ old('regimen', $config->regimen) == 'RIMPE_POPULAR' ? 'selected' : '' }}>Régimen RIMPE - Negocio Popular</option>
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Dirección Matriz: <span class="text-danger">*</span></label>
                                    <input type="text" name="dir_matriz" class="form-control" value="{{ old('dir_matriz', $config->dir_matriz) }}" required placeholder="Dirección legal matriz del RUC">
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Dirección Sucursal / Establecimiento:</label>
                                    <input type="text" name="dir_establecimiento" class="form-control" value="{{ old('dir_establecimiento', $config->dir_establecimiento) }}" placeholder="Si es la misma matriz puede dejar igual">
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Obligado a llevar Contabilidad: <span class="text-danger">*</span></label>
                                    <select name="obligado_contabilidad" class="form-control font-weight-bold" required>
                                        <option value="NO" {{ old('obligado_contabilidad', $config->obligado_contabilidad) == 'NO' ? 'selected' : '' }}>NO</option>
                                        <option value="SI" {{ old('obligado_contabilidad', $config->obligado_contabilidad) == 'SI' ? 'selected' : '' }}>SI</option>
                                    </select>
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Contribuyente Especial N°:</label>
                                    <input type="text" name="contribuyente_especial" class="form-control" value="{{ old('contribuyente_especial', $config->contribuyente_especial) }}" placeholder="Nro Resolución si aplica">
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Porcentaje IVA Predeterminado: <span class="text-danger">*</span></label>
                                    <div class="input-group">
                                        <input type="number" step="0.01" min="0" max="100" name="iva_porcentaje" class="form-control font-weight-bold text-primary" value="{{ old('iva_porcentaje', $config->iva_porcentaje) }}" required>
                                        <div class="input-group-append">
                                            <span class="input-group-text font-weight-bold">%</span>
                                        </div>
                                    </div>
                                    <small class="text-muted">Tarifa vigente en Ecuador: 15%</small>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Correo para Facturación:</label>
                                    <div class="input-group">
                                        <div class="input-group-prepend"><span class="input-group-text"><i class="fas fa-envelope"></i></span></div>
                                        <input type="email" name="correo" class="form-control" value="{{ old('correo', $config->correo) }}" placeholder="facturacion@clinica.com">
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="font-weight-bold small text-muted text-uppercase">Teléfono de Contacto:</label>
                                    <div class="input-group">
                                        <div class="input-group-prepend"><span class="input-group-text"><i class="fas fa-phone"></i></span></div>
                                        <input type="text" name="telefono" class="form-control" value="{{ old('telefono', $config->telefono) }}" placeholder="0991234567">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="form-group mb-0">
                            <label class="font-weight-bold small text-muted text-uppercase">Leyenda o Nota Legal al pie de las Facturas:</label>
                            <textarea name="leyenda" class="form-control" rows="2" placeholder="Ej: Contribuyente Régimen RIMPE - Documento emitido electrónicamente...">{{ old('leyenda', $config->leyenda) }}</textarea>
                            <small class="text-muted">Este texto aparecerá en la sección de información adicional de todos los RIDE impresos y XML.</small>
                        </div>
                    </div>
                </div>
            </div>

            <!-- COLUMNA DERECHA: PARÁMETROS SRI Y CERTIFICADO DIGITAL -->
            <div class="col-lg-4">
                <!-- Tarjeta 2: Conexión y Ambiente SRI -->
                <div class="card card-outline card-info shadow-sm mb-4">
                    <div class="card-header py-3 bg-light">
                        <h5 class="card-title font-weight-bold text-dark m-0">
                            <i class="fas fa-server text-info mr-2"></i> Ambiente SRI
                        </h5>
                    </div>

                    <div class="card-body">
                        <div class="form-group">
                            <label class="font-weight-bold small text-muted text-uppercase">Tipo de Ambiente: <span class="text-danger">*</span></label>
                            <select name="ambiente" class="form-control font-weight-bold" required>
                                <option value="1" {{ old('ambiente', $config->ambiente) == '1' ? 'selected' : '' }}>
                                    1 - Pruebas / Sandbox (Certificación)
                                </option>
                                <option value="2" {{ old('ambiente', $config->ambiente) == '2' ? 'selected' : '' }}>
                                    2 - Producción (Facturación Oficial SRI)
                                </option>
                            </select>
                            <small class="text-muted">Use Pruebas para capacitar y verificar; Producción para comprobantes tributarios reales.</small>
                        </div>

                        <div class="form-group">
                            <label class="font-weight-bold small text-muted text-uppercase">Tipo de Emisión: <span class="text-danger">*</span></label>
                            <select name="tipo_emision" class="form-control" required>
                                <option value="1" selected>1 - Emisión Normal</option>
                            </select>
                        </div>

                        <div class="form-group mb-0">
                            <label class="font-weight-bold small text-muted text-uppercase">Moneda:</label>
                            <input type="text" name="moneda" class="form-control font-weight-bold" value="{{ old('moneda', $config->moneda ?: 'DOLAR') }}" readonly>
                        </div>
                    </div>
                </div>

                <!-- Tarjeta 3: Certificado Digital / Firma Electrónica -->
                <div class="card card-outline card-success shadow-sm mb-4">
                    <div class="card-header py-3 bg-light">
                        <h5 class="card-title font-weight-bold text-dark m-0">
                            <i class="fas fa-file-signature text-success mr-2"></i> Firma Electrónica (.p12 / .pfx)
                        </h5>
                    </div>

                    <div class="card-body">
                        @if($config->firma_path)
                            <div class="alert alert-success py-2 px-3 mb-3 small d-flex align-items-center">
                                <i class="fas fa-check-circle fa-2x mr-2"></i>
                                <div>
                                    <b>Certificado Digital Cargado:</b><br>
                                    <span class="text-truncate d-inline-block" style="max-width: 220px;">{{ basename($config->firma_path) }}</span>
                                </div>
                            </div>
                        @else
                            <div class="alert alert-warning py-2 px-3 mb-3 small d-flex align-items-center">
                                <i class="fas fa-exclamation-triangle fa-2x mr-2"></i>
                                <div>
                                    <b>Sin Certificado Digital:</b><br>
                                    El sistema emitirá y autorizará comprobantes en modo simulación formal hasta que cargue su archivo .p12.
                                </div>
                            </div>
                        @endif

                        <div class="form-group">
                            <label class="font-weight-bold small text-muted text-uppercase">Archivo de Firma (.p12 / .pfx):</label>
                            <div class="custom-file">
                                <input type="file" name="firma_electronica" class="custom-file-input" id="customFirma" accept=".p12,.pfx" onchange="actualizarNombreArchivo(this)">
                                <label class="custom-file-label small" for="customFirma" id="labelFirma">Seleccionar .p12...</label>
                            </div>
                            <small class="text-muted">Proporcionado por Banco Central, Security Data, Consejo de la Judicatura, etc.</small>
                        </div>

                        <div class="form-group mb-0">
                            <label class="font-weight-bold small text-muted text-uppercase">Contraseña de la Firma:</label>
                            <div class="input-group">
                                <input type="password" name="firma_password" id="inputFirmaPassword" class="form-control" placeholder="{{ $config->firma_password ? '••••••••••••' : 'Ingrese clave de la firma' }}">
                                <div class="input-group-append">
                                    <button type="button" class="btn btn-outline-secondary" onclick="togglePasswordVisibility()">
                                        <i class="fas fa-eye" id="togglePassIcon"></i>
                                    </button>
                                </div>
                            </div>
                            <small class="text-muted">Clave de desbloqueo de su token o archivo de firma digital.</small>
                        </div>
                    </div>
                </div>

                <!-- Tarjeta 4: Resumen de Puntos de Emisión -->
                <div class="card card-outline card-secondary shadow-sm mb-4">
                    <div class="card-header py-2 bg-light d-flex justify-content-between align-items-center">
                        <h6 class="font-weight-bold text-dark m-0 small text-uppercase">
                            <i class="bi bi-geo-alt-fill text-primary mr-1"></i> Puntos de Emisión Activos
                        </h6>
                        <a href="{{ route('admin.puntos_emision.index') }}" class="btn btn-xs btn-outline-primary font-weight-bold">
                            Gestionar
                        </a>
                    </div>
                    <div class="card-body p-0">
                        <ul class="list-group list-group-flush small">
                            @forelse($puntos as $pto)
                                <li class="list-group-item d-flex justify-content-between align-items-center py-2">
                                    <div>
                                        <b class="text-primary">{{ $pto->serie_completa }}</b> - {{ $pto->nombre }}
                                        @if($pto->es_principal)
                                            <span class="badge badge-success px-1">Principal</span>
                                        @endif
                                    </div>
                                    <span class="badge badge-light border font-weight-bold font-family-monospace">
                                        Nro: {{ $pto->getProximoSecuencialFormateado() }}
                                    </span>
                                </li>
                            @empty
                                <li class="list-group-item text-center text-muted py-3">No hay puntos registrados</li>
                            @endforelse
                        </ul>
                    </div>
                </div>

                <!-- Botón Guardar -->
                <div class="card shadow-sm border-0 mb-4">
                    <div class="card-body p-3">
                        <button type="submit" class="btn btn-primary btn-block btn-lg font-weight-bold shadow-sm">
                            <i class="fas fa-save mr-2"></i> Guardar Configuración
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </form>

    <script>
        function actualizarNombreArchivo(input) {
            const label = document.getElementById('labelFirma');
            if (input.files && input.files.length > 0) {
                label.textContent = input.files[0].name;
            } else {
                label.textContent = 'Seleccionar .p12...';
            }
        }

        function togglePasswordVisibility() {
            const input = document.getElementById('inputFirmaPassword');
            const icon = document.getElementById('togglePassIcon');
            if (input.type === 'password') {
                input.type = 'text';
                icon.classList.remove('fa-eye');
                icon.classList.add('fa-eye-slash');
            } else {
                input.type = 'password';
                icon.classList.remove('fa-eye-slash');
                icon.classList.add('fa-eye');
            }
        }
    </script>
@endsection