<script lang="ts">
	import * as Tabs from '$lib/components/ui/tabs';
	import { Input } from '$lib/components/ui/input';
	import { Label } from '$lib/components/ui/label';
	import { Checkbox } from '$lib/components/ui/checkbox';
	import { Textarea } from '$lib/components/ui/textarea';
	import { RadioGroup, RadioGroupItem } from '$lib/components/ui/radio-group';
	import { Button } from '$lib/components/ui/button';

	let {
		formData = $bindable(),
		activeSystem = 'ssisgen'
	}: {
		formData: any;
		activeSystem?: 'ssisgen' | 'qsisgen';
	} = $props();

	const defaultFormData = {
		DecimalesPeso: null,
		DecimalesCant: null,
		DecimalesValor: null,
		DecimalesCosto: null,
		CantLimiteMin: null,
		PesoLimiteMin: null,
		ValorLimiteMin: null,
		ValorLimiteParMin: null,
		CantLimite: null,
		PesoLimite: null,
		ValorLimite: null,
		ValorLimitePar: null,
		RestringeImpoPT: false,
		ActualizarPartePartida: false,
		LocAPOrigen: false,
		SolicitarContrasenaAdministrador: false,
		
		// SCAF specific
		pagoimpuesto: 'no',
		formapago: '',

		// Mexicana
		PorParteClaseMex: 'parte',
		NumParteMex: false,
		PaisOrigenMex: false,
		PerPagRenglon: false,
		UMEquivalenteMex: false,
		UMAlternaMex: false,
		FraccionImp: false,
		TasaFraccMex: false,
		ImpOrdenCom: false,
		ParteComplementariaMex: false,
		ParteCompleMexPartida: false,
		ImprimirLote: false,
		ImprimirNumEntrada: false,
		CodigoBarras: false,
		UMAuxiliarMex: false,
		AgregarVAenProdTerminados: false,
		OcultarFechaHora: false,
		FirmaFMex: '',

		// Americana
		PorParteClaseAMe: 'parte',
		NumParteAme: false,
		FraccionAme: false,
		PaisOrigenAme: false,
		UMEquivalenteAme: false,
		LeyendaFacAme: '',
		FirmaFAme: '',

		// Packing list
		PackingPedClave: false,
		PackingOrdenCompra: false,
		PorOrdenPorOCPack: 'captura',
		IncluirLineaDelPO: false
	};

	if (!formData) {
		formData = { ...defaultFormData };
	}

	$effect.pre(() => {
		if (formData) {
			for (const key in defaultFormData) {
				if (formData[key] === undefined) {
					formData[key] = defaultFormData[key as keyof typeof defaultFormData];
				}
			}
		}
	});

	let activeSubTab = $state('general');
</script>

<div class="w-full">
	<Tabs.Root bind:value={activeSubTab} class="flex flex-col">
		<div class="w-full overflow-x-auto pb-2 mb-4">
			<Tabs.List class="inline-flex md:flex w-full bg-muted/60 p-1 rounded-md">
				<Tabs.Trigger value="general" class="flex-1">General</Tabs.Trigger>
				<Tabs.Trigger value="mexicana" class="flex-1">Factura Mexicana y Bilingüe</Tabs.Trigger>
				<Tabs.Trigger value="americana" class="flex-1">Factura Americana</Tabs.Trigger>
				<Tabs.Trigger value="packing" class="flex-1">Packing List</Tabs.Trigger>
			</Tabs.List>
		</div>

		<!-- GENERAL TAB -->
		<Tabs.Content value="general" class="space-y-6">
			{#if activeSystem === 'qsisgen'}
				<!-- SCAF General Tab -->
				<div class="space-y-6">
					<!-- Se Pago Impuesto (Partidas) -->
					<div class="space-y-4 rounded-md border bg-muted/10 p-4">
						<h4 class="border-b pb-2 text-sm font-semibold text-muted-foreground uppercase">Partidas</h4>
						<div class="flex flex-col gap-2">
							<Label class="text-xs font-semibold text-muted-foreground uppercase">
								¿Se pagó el impuesto?
							</Label>
							<RadioGroup
								value={formData.pagoimpuesto}
								onValueChange={(v) => (formData.pagoimpuesto = v)}
								class="flex gap-6"
							>
								<div class="flex items-center gap-2">
									<RadioGroupItem value="si" id="def_pago_si" />
									<Label for="def_pago_si" class="text-sm">Sí</Label>
								</div>
								<div class="flex items-center gap-2">
									<RadioGroupItem value="no" id="def_pago_no" />
									<Label for="def_pago_no" class="text-sm">No</Label>
								</div>
							</RadioGroup>
						</div>
					</div>

					<!-- Formas de Pago -->
					<div class="space-y-4 rounded-md border bg-muted/10 p-4">
						<h4 class="border-b pb-2 text-sm font-semibold text-muted-foreground uppercase">
							Formas de Pago
						</h4>
						<div class="flex items-end gap-3">
							<div class="flex-1 space-y-2">
								<Label for="def_formapago" class="text-xs font-semibold text-muted-foreground uppercase">
									SisImp: FormaPago
								</Label>
								<Input id="def_formapago" bind:value={formData.formapago} class="h-9" readonly />
							</div>
							<Button variant="outline" class="h-9 px-4 uppercase text-xs font-bold tracking-tight">
								Catálogo...
							</Button>
						</div>
					</div>

					<!-- Otras Opciones (SCAF) -->
					<div class="space-y-4 rounded-md border bg-muted/10 p-4">
						<h4 class="border-b pb-2 text-sm font-semibold text-muted-foreground uppercase">
							Otras Opciones
						</h4>
						<div class="grid grid-cols-1 md:grid-cols-2 gap-4 pt-2">
							<div class="flex items-center gap-2">
								<Checkbox id="def_ActualizarParte_scaf" bind:checked={formData.ActualizarPartePartida} />
								<Label for="def_ActualizarParte_scaf" class="text-sm">Actualizar datos del número de parte en base de a la captura de las partidas</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_SolicitarAuth_scaf" bind:checked={formData.SolicitarContrasenaAdministrador} />
								<Label for="def_SolicitarAuth_scaf" class="text-sm font-bold">
									Solicitar autorizacion para pasar por alto la validacion de tipo de cambio de fecha de pago de pedimento
								</Label>
							</div>
						</div>
					</div>
				</div>
			{:else}
				<!-- SCAII General Tab (Legacy) -->
				<div class="space-y-6">
					<!-- Configuración de Decimales -->
					<div class="space-y-4 border rounded-md p-4 bg-muted/10">
						<h4 class="text-sm font-semibold text-muted-foreground uppercase">Configuración de Decimales</h4>
						<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
							<div class="space-y-1.5">
								<Label class="text-xs">Decimales (Peso Neto y Bruto)</Label>
								<Input type="number" bind:value={formData.DecimalesPeso} class="h-8 text-sm" />
							</div>
							<div class="space-y-1.5">
								<Label class="text-xs">Decimales (Cantidades)</Label>
								<Input type="number" bind:value={formData.DecimalesCant} class="h-8 text-sm" />
							</div>
							<div class="space-y-1.5">
								<Label class="text-xs">Decimales (Valores)</Label>
								<Input type="number" bind:value={formData.DecimalesValor} class="h-8 text-sm" />
							</div>
							<div class="space-y-1.5">
								<Label class="text-xs">Decimales (Costos Unitarios)</Label>
								<Input type="number" bind:value={formData.DecimalesCosto} class="h-8 text-sm" />
							</div>
						</div>
					</div>

					<!-- Limites Minimos -->
					<div class="space-y-4 border rounded-md p-4 bg-muted/10">
						<h4 class="text-sm font-semibold text-muted-foreground uppercase border-b pb-2">Mínimos límites para actualizar las facturas</h4>
						<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 pt-2">
							<div class="space-y-1.5">
								<Label class="text-xs">Cantidad Mínima</Label>
								<Input type="number" bind:value={formData.CantLimiteMin} class="h-8 text-sm" />
							</div>
							<div class="space-y-1.5">
								<Label class="text-xs">Peso Mínimo</Label>
								<Input type="number" bind:value={formData.PesoLimiteMin} class="h-8 text-sm" />
							</div>
							<div class="space-y-1.5">
								<Label class="text-xs">Valor Mínimo</Label>
								<Input type="number" bind:value={formData.ValorLimiteMin} class="h-8 text-sm" />
							</div>
							<div class="space-y-1.5">
								<Label class="text-xs">Valor Mínimo por Partida</Label>
								<Input type="number" bind:value={formData.ValorLimiteParMin} class="h-8 text-sm" />
							</div>
						</div>
					</div>

					<!-- Limites Maximos -->
					<div class="space-y-4 border rounded-md p-4 bg-muted/10">
						<h4 class="text-sm font-semibold text-muted-foreground uppercase border-b pb-2">Máximos límites para actualizar las facturas</h4>
						<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 pt-2">
							<div class="space-y-1.5">
								<Label class="text-xs">Cantidad Máxima</Label>
								<Input type="number" bind:value={formData.CantLimite} class="h-8 text-sm" />
							</div>
							<div class="space-y-1.5">
								<Label class="text-xs">Peso Máximo</Label>
								<Input type="number" bind:value={formData.PesoLimite} class="h-8 text-sm" />
							</div>
							<div class="space-y-1.5">
								<Label class="text-xs">Valor Máximo</Label>
								<Input type="number" bind:value={formData.ValorLimite} class="h-8 text-sm" />
							</div>
							<div class="space-y-1.5">
								<Label class="text-xs">Valor Máximo por Partida</Label>
								<Input type="number" bind:value={formData.ValorLimitePar} class="h-8 text-sm" />
							</div>
						</div>
					</div>

					<!-- Otras Opciones (Footer) -->
					<div class="space-y-4 border rounded-md p-4 bg-muted/10">
						<h4 class="text-sm font-semibold text-muted-foreground uppercase border-b pb-2">Otras Opciones</h4>
						<div class="grid grid-cols-1 md:grid-cols-2 gap-4 pt-2">
							<div class="flex items-center gap-2">
								<Checkbox id="def_RestringeImpoPT" bind:checked={formData.RestringeImpoPT} />
								<Label for="def_RestringeImpoPT" class="text-sm">Restringe la importación de Productos Terminados</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_ActualizarPartePartida" bind:checked={formData.ActualizarPartePartida} />
								<Label for="def_ActualizarPartePartida" class="text-sm">Actualiza datos del número de parte en base a captura de partidas</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_LocAPOrigen" bind:checked={formData.LocAPOrigen} />
								<Label for="def_LocAPOrigen" class="text-sm">Advertencia País de Origen</Label>
							</div>
							<div class="flex items-center gap-2 md:col-span-2">
								<Checkbox id="def_SolicitarContrasenaAdministrador" bind:checked={formData.SolicitarContrasenaAdministrador} />
								<Label for="def_SolicitarContrasenaAdministrador" class="text-sm">Solicitar Autorización para Pasar por Alto la Validacion de Temporalidad en Base a Fecha de Pago de Pedimento</Label>
							</div>
						</div>
					</div>
				</div>
			{/if}
		</Tabs.Content>

		<!-- MEXICANA TAB -->
		<Tabs.Content value="mexicana" class="space-y-6">
			{#if activeSystem === 'qsisgen'}
				<!-- SCAF Mexicana (Modern Grid) -->
				<div class="space-y-6">
					<div class="space-y-4 rounded-md border bg-muted/10 p-4">
						<h4 class="border-b pb-2 text-sm font-semibold text-muted-foreground uppercase">
							Opciones de Impresión
						</h4>
						<div class="flex items-center gap-2 py-2">
							<Checkbox id="def_CodigoBarras_scaf" bind:checked={formData.CodigoBarras} />
							<Label for="def_CodigoBarras_scaf" class="text-sm font-semibold">
								Imprimir código de barras en la parte inferior de la factura
							</Label>
						</div>

						<div class="space-y-4 pt-2">
							<h5 class="flex items-center gap-2 text-xs font-bold tracking-wider text-primary uppercase">
								<span class="h-px flex-1 bg-border"></span>
								Incluir en la columna de descripción
								<span class="h-px flex-1 bg-border"></span>
							</h5>

							<div class="grid grid-cols-1 gap-x-8 gap-y-4 md:grid-cols-2 lg:grid-cols-3">
								<div class="flex items-center gap-2">
									<Checkbox id="def_PaisOrigenMex_scaf" bind:checked={formData.PaisOrigenMex} />
									<Label for="def_PaisOrigenMex_scaf" class="text-sm">El país de origen</Label>
								</div>
								<div class="flex items-center gap-2">
									<Checkbox id="def_PerPagRenglon_scaf" bind:checked={formData.PerPagRenglon} />
									<Label for="def_PerPagRenglon_scaf" class="text-sm">Permiso y la Página - Renglón</Label>
								</div>
								<div class="flex items-center gap-2">
									<Checkbox id="def_ImpOrdenCom_scaf" bind:checked={formData.ImpOrdenCom} />
									<Label for="def_ImpOrdenCom_scaf" class="text-sm">Orden de compra (Facturas y Packing List)</Label>
								</div>
								<div class="flex items-center gap-2">
									<Checkbox id="def_FraccionImp_scaf" bind:checked={formData.FraccionImp} />
									<Label for="def_FraccionImp_scaf" class="text-sm">Fracción arancelaria</Label>
								</div>
								<div class="flex items-center gap-2">
									<Checkbox id="def_TasaFraccMex_scaf" bind:checked={formData.TasaFraccMex} />
									<Label for="def_TasaFraccMex_scaf" class="text-sm">Tasa de la fracción</Label>
								</div>
								<div class="flex items-center gap-2">
									<Checkbox id="def_ImprimirLote_scaf" bind:checked={formData.ImprimirLote} />
									<Label for="def_ImprimirLote_scaf" class="text-sm font-bold text-primary">Lote</Label>
								</div>
							</div>
						</div>
					</div>

					<!-- Firma (SCAF Mexicana) -->
					<div class="space-y-4 rounded-md border bg-muted/10 p-4">
						<h4 class="border-b pb-2 text-sm font-semibold text-muted-foreground uppercase">Firma</h4>
						<div class="space-y-2">
							<Label for="def_FirmaFMex_scaf" class="text-xs font-semibold text-muted-foreground uppercase">Firma en factura mexicana</Label>
							<Textarea id="def_FirmaFMex_scaf" bind:value={formData.FirmaFMex} class="h-24 resize-y" />
						</div>
					</div>
				</div>
			{:else}
				<!-- SCAII Mexicana (Legacy) -->
				<div class="space-y-6">
					<!-- Imprimir por -->
					<div class="space-y-4 border rounded-md p-4 bg-muted/10">
						<h4 class="text-sm font-semibold text-muted-foreground uppercase">Imprimir por</h4>
						<RadioGroup value={formData.PorParteClaseMex} onValueChange={(v) => formData.PorParteClaseMex = v} class="flex gap-4">
							<div class="flex items-center gap-2">
								<RadioGroupItem value="parte" id="def_mex_imprimir_parte" />
								<Label for="def_mex_imprimir_parte" class="text-sm">Parte</Label>
							</div>
							<div class="flex items-center gap-2">
								<RadioGroupItem value="clase" id="def_mex_imprimir_clase" />
								<Label for="def_mex_imprimir_clase" class="text-sm">Clase</Label>
							</div>
						</RadioGroup>
					</div>

					<!-- Incluir en la columna de descripción -->
					<div class="space-y-4 border rounded-md p-4 bg-muted/10">
						<h4 class="text-sm font-semibold text-muted-foreground uppercase border-b pb-2">Incluir en la columna de descripción</h4>
						<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 pt-2">
							<div class="flex items-center gap-2">
								<Checkbox id="def_NumParteMex" bind:checked={formData.NumParteMex} />
								<Label for="def_NumParteMex" class="text-sm">El número de parte</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_PaisOrigenMex" bind:checked={formData.PaisOrigenMex} />
								<Label for="def_PaisOrigenMex" class="text-sm">El país de origen</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_PerPagRenglon" bind:checked={formData.PerPagRenglon} />
								<Label for="def_PerPagRenglon" class="text-sm">Permiso y la Página - Renglón</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_UMEquivalenteMex" bind:checked={formData.UMEquivalenteMex} />
								<Label for="def_UMEquivalenteMex" class="text-sm">La U.M. Equivalente</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_UMAlternaMex" bind:checked={formData.UMAlternaMex} />
								<Label for="def_UMAlternaMex" class="text-sm">Cantidad Alterna</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_FraccionImp" bind:checked={formData.FraccionImp} />
								<Label for="def_FraccionImp" class="text-sm">Fracción Arancelaria</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_TasaFraccMex" bind:checked={formData.TasaFraccMex} />
								<Label for="def_TasaFraccMex" class="text-sm">Tasa de la Fracción Arancelaria</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_ImpOrdenCom" bind:checked={formData.ImpOrdenCom} />
								<Label for="def_ImpOrdenCom" class="text-sm">Orden de Compra (Solo OC)</Label>
							</div>
						</div>

						<!-- Parte Complementaria -->
						<div class="mt-4 pt-4 border-t space-y-2">
							<h5 class="text-xs font-semibold text-muted-foreground uppercase mb-2">Parte Complementaria de:</h5>
							<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 pl-2">
								<div class="flex items-center gap-2">
									<Checkbox id="def_ParteComplementariaMex" bind:checked={formData.ParteComplementariaMex} />
									<Label for="def_ParteComplementariaMex" class="text-sm">Número de parte</Label>
								</div>
								<div class="flex items-center gap-2">
									<Checkbox id="def_ParteCompleMexPartida" bind:checked={formData.ParteCompleMexPartida} />
									<Label for="def_ParteCompleMexPartida" class="text-sm">La partida</Label>
								</div>
							</div>
						</div>

						<!-- Más opciones -->
						<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 pt-4 border-t mt-4">
							<div class="flex items-center gap-2">
								<Checkbox id="def_ImprimirLote" bind:checked={formData.ImprimirLote} />
								<Label for="def_ImprimirLote" class="text-sm">Lote</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_ImprimirNumEntrada" bind:checked={formData.ImprimirNumEntrada} />
								<Label for="def_ImprimirNumEntrada" class="text-sm">Núm. Entrada</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_CodigoBarras" bind:checked={formData.CodigoBarras} />
								<Label for="def_CodigoBarras" class="text-sm">Imprimir Código de Barras en parte inferior</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_UMAuxiliarMex" bind:checked={formData.UMAuxiliarMex} />
								<Label for="def_UMAuxiliarMex" class="text-sm">Muestra UM Auxiliar por UM Comercial</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_AgregarVAenProdTerminados" bind:checked={formData.AgregarVAenProdTerminados} />
								<Label for="def_AgregarVAenProdTerminados" class="text-sm">Agregar VA en Prod. Terminados</Label>
							</div>
							<div class="flex items-center gap-2">
								<Checkbox id="def_OcultarFechaHora" bind:checked={formData.OcultarFechaHora} />
								<Label for="def_OcultarFechaHora" class="text-sm">Ocultar Fecha y Hora</Label>
							</div>
						</div>
					</div>

					<!-- Firma (SCAII Moderna) -->
					<div class="space-y-4 border rounded-md p-4 bg-muted/10">
						<h4 class="text-sm font-semibold text-muted-foreground uppercase border-b pb-2">Firmas</h4>
						<div class="space-y-2 pt-2">
							<Label for="def_FirmaFMex" class="text-sm uppercase text-xs font-bold text-muted-foreground">Firma en Factura Mexicana:</Label>
							<Textarea id="def_FirmaFMex" bind:value={formData.FirmaFMex} class="h-24 resize-y" />
						</div>
					</div>
				</div>
			{/if}
		</Tabs.Content>

		<!-- AMERICANA TAB -->
		<Tabs.Content value="americana" class="space-y-6">
			<!-- Opciones Compartidas -->
			<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
				<!-- Imprimir por -->
				<div class="space-y-4 border rounded-md p-4 bg-muted/10 h-full">
					<h4 class="text-sm font-semibold text-muted-foreground uppercase">Imprimir por</h4>
					<RadioGroup value={formData.PorParteClaseAMe} onValueChange={(v) => formData.PorParteClaseAMe = v} class="flex gap-4">
						<div class="flex items-center gap-2">
							<RadioGroupItem value="parte" id="def_ame_imprimir_parte" />
							<Label for="def_ame_imprimir_parte" class="text-sm">Parte</Label>
						</div>
						<div class="flex items-center gap-2">
							<RadioGroupItem value="clase" id="def_ame_imprimir_clase" />
							<Label for="def_ame_imprimir_clase" class="text-sm">Clase</Label>
						</div>
					</RadioGroup>
				</div>

				<!-- Incluir en la descripción -->
				<div class="space-y-4 border rounded-md p-4 bg-muted/10 h-full">
					<h4 class="text-sm font-semibold text-muted-foreground uppercase border-b pb-2">Incluir en la descripción</h4>
					<div class="grid grid-cols-1 md:grid-cols-2 gap-4 pt-2">
						<div class="flex items-center gap-2">
							<Checkbox id="def_NumParteAme" bind:checked={formData.NumParteAme} />
							<Label for="def_NumParteAme" class="text-sm">El número de parte</Label>
						</div>
						<div class="flex items-center gap-2">
							<Checkbox id="def_FraccionAme" bind:checked={formData.FraccionAme} />
							<Label for="def_FraccionAme" class="text-sm">La fracción americana</Label>
						</div>
						<div class="flex items-center gap-2">
							<Checkbox id="def_PaisOrigenAme" bind:checked={formData.PaisOrigenAme} />
							<Label for="def_PaisOrigenAme" class="text-sm">El país de origen</Label>
						</div>
						<div class="flex items-center gap-2">
							<Checkbox id="def_UMEquivalenteAme" bind:checked={formData.UMEquivalenteAme} />
							<Label for="def_UMEquivalenteAme" class="text-sm">La U.M. N. Equivalente</Label>
						</div>
					</div>
				</div>
			</div>

			<!-- Firma y Notas -->
			<div class="space-y-4 border rounded-md p-4 bg-muted/10">
				<h4 class="text-sm font-semibold text-muted-foreground uppercase border-b pb-2">Firma y Notas</h4>
				<div class="space-y-2">
					<Label for="def_FirmaFAme" class="text-xs font-semibold text-muted-foreground uppercase">Firma en factura americana</Label>
					<Textarea id="def_FirmaFAme" bind:value={formData.FirmaFAme} class="h-24 resize-y" />
				</div>
				<div class="space-y-2 pt-2">
					<Label for="def_LeyendaFacAme" class="text-xs font-semibold text-muted-foreground uppercase">Leyenda factura</Label>
					<Textarea id="def_LeyendaFacAme" bind:value={formData.LeyendaFacAme} class="h-20 resize-y" />
				</div>
			</div>
		</Tabs.Content>

		<!-- PACKING LIST TAB -->
		<Tabs.Content value="packing" class="space-y-6">
			<!-- Opciones de Packing List -->
			<div class="space-y-4 border rounded-md p-4 bg-muted/10">
				<h4 class="text-sm font-semibold text-muted-foreground uppercase border-b pb-2">Opciones de Packing List</h4>
				<div class="grid grid-cols-1 md:grid-cols-2 gap-4 pt-2">
					<div class="flex items-center gap-2">
						<Checkbox id="def_PackingPedClave" bind:checked={formData.PackingPedClave} />
						<Label for="def_PackingPedClave" class="text-sm">Muestra el número de pedimento y su clave de pedimento en el Packing List</Label>
					</div>
					<div class="flex items-center gap-2">
						<Checkbox id="def_PackingOrdenCompra" bind:checked={formData.PackingOrdenCompra} />
						<Label for="def_PackingOrdenCompra" class="text-sm">Imprimir orden de compra</Label>
					</div>
					<div class="flex items-center gap-2">
						<Checkbox id="def_IncluirLineaDelPO" bind:checked={formData.IncluirLineaDelPO} />
						<Label for="def_IncluirLineaDelPO" class="text-sm">Incluir línea de PO</Label>
					</div>
				</div>
			</div>

			<!-- Imprimir por -->
			<div class="space-y-4 border rounded-md p-4 bg-muted/10">
				<h4 class="text-sm font-semibold text-muted-foreground uppercase">Imprimir por</h4>
				<RadioGroup value={formData.PorOrdenPorOCPack} onValueChange={(v) => formData.PorOrdenPorOCPack = v} class="flex gap-4">
					<div class="flex items-center gap-2">
						<RadioGroupItem value="captura" id="def_pack_imprimir_captura" />
						<Label for="def_pack_imprimir_captura" class="text-sm">Orden de captura</Label>
					</div>
					<div class="flex items-center gap-2">
						<RadioGroupItem value="compra" id="def_pack_imprimir_compra" />
						<Label for="def_pack_imprimir_compra" class="text-sm">Orden de compra</Label>
					</div>
				</RadioGroup>
			</div>
		</Tabs.Content>
	</Tabs.Root>
</div>
