diff --git a/modules/customer-invoices/src/api/application/helpers/format-date-dto.ts b/modules/customer-invoices/src/api/application/helpers/format-date-dto.ts
new file mode 100644
index 00000000..f4d6a720
--- /dev/null
+++ b/modules/customer-invoices/src/api/application/helpers/format-date-dto.ts
@@ -0,0 +1,7 @@
+import { UtcDate } from "@repo/rdx-ddd";
+
+export function formatDateDTO(dateString: string) {
+  const result = UtcDate.createFromISO(dateString).data;
+
+  return result.toDateString();
+}
diff --git a/modules/customer-invoices/src/api/application/helpers/format-money-dto.ts b/modules/customer-invoices/src/api/application/helpers/format-money-dto.ts
index ce5d39a8..3a84ea1a 100644
--- a/modules/customer-invoices/src/api/application/helpers/format-money-dto.ts
+++ b/modules/customer-invoices/src/api/application/helpers/format-money-dto.ts
@@ -2,6 +2,10 @@ import { MoneyDTO } from "@erp/core";
 import { MoneyValue } from "@repo/rdx-ddd";
 
 export function formatMoneyDTO(amount: MoneyDTO, locale: string) {
+  if (amount.value === "") {
+    return "";
+  }
+
   const money = MoneyValue.create({
     value: Number(amount.value),
     currency_code: amount.currency_code,
diff --git a/modules/customer-invoices/src/api/application/helpers/format-percentage-dto.ts b/modules/customer-invoices/src/api/application/helpers/format-percentage-dto.ts
index 4d72baad..dee79061 100644
--- a/modules/customer-invoices/src/api/application/helpers/format-percentage-dto.ts
+++ b/modules/customer-invoices/src/api/application/helpers/format-percentage-dto.ts
@@ -1,11 +1,11 @@
 import { PercentageDTO } from "@erp/core";
 import { Percentage } from "@repo/rdx-ddd";
 
-export function formatPercentageDTO(Percentage_value: PercentageDTO) {
+export function formatPercentageDTO(Percentage_value: PercentageDTO, locale: string) {
   const value = Percentage.create({
     value: Number(Percentage_value.value),
     scale: Number(Percentage_value.scale),
   }).data;
 
-  return value.toNumber;
+  return value.format(locale);
 }
diff --git a/modules/customer-invoices/src/api/application/helpers/format-quantity-dto.ts b/modules/customer-invoices/src/api/application/helpers/format-quantity-dto.ts
index 5ca23026..3a662b16 100644
--- a/modules/customer-invoices/src/api/application/helpers/format-quantity-dto.ts
+++ b/modules/customer-invoices/src/api/application/helpers/format-quantity-dto.ts
@@ -2,10 +2,14 @@ import { QuantityDTO } from "@erp/core";
 import { Quantity } from "@repo/rdx-ddd";
 
 export function formatQuantityDTO(quantity_value: QuantityDTO) {
+  if (quantity_value.value === "") {
+    return "";
+  }
+
   const value = Quantity.create({
     value: Number(quantity_value.value),
     scale: Number(quantity_value.scale),
   }).data;
 
-  return value.toNumber;
+  return value.format();
 }
diff --git a/modules/customer-invoices/src/api/application/helpers/index.ts b/modules/customer-invoices/src/api/application/helpers/index.ts
index a8286fff..789c112f 100644
--- a/modules/customer-invoices/src/api/application/helpers/index.ts
+++ b/modules/customer-invoices/src/api/application/helpers/index.ts
@@ -1,3 +1,4 @@
+export * from "./format-date-dto";
 export * from "./format-money-dto";
 export * from "./format-percentage-dto";
 export * from "./format-quantity-dto";
diff --git a/modules/customer-invoices/src/api/application/presenters/domain/customer-invoice-items.full.presenter.ts b/modules/customer-invoices/src/api/application/presenters/domain/customer-invoice-items.full.presenter.ts
index e3573bd5..fe9be325 100644
--- a/modules/customer-invoices/src/api/application/presenters/domain/customer-invoice-items.full.presenter.ts
+++ b/modules/customer-invoices/src/api/application/presenters/domain/customer-invoice-items.full.presenter.ts
@@ -17,6 +17,7 @@ export class CustomerInvoiceItemsFullPresenter extends Presenter {
 
     return {
       id: invoiceItem.id.toPrimitive(),
+      isNonValued: String(invoiceItem.isNonValued),
       position: String(index),
       description: toEmptyString(invoiceItem.description, (value) => value.toPrimitive()),
 
diff --git a/modules/customer-invoices/src/api/application/presenters/queries/customer-invoice-items.report.presenter.ts b/modules/customer-invoices/src/api/application/presenters/queries/customer-invoice-items.report.presenter.ts
index bb4a417a..97e53116 100644
--- a/modules/customer-invoices/src/api/application/presenters/queries/customer-invoice-items.report.presenter.ts
+++ b/modules/customer-invoices/src/api/application/presenters/queries/customer-invoice-items.report.presenter.ts
@@ -1,7 +1,7 @@
 import { IPresenterOutputParams, Presenter } from "@erp/core/api";
 import { GetCustomerInvoiceByIdResponseDTO } from "@erp/customer-invoices/common";
 import { ArrayElement } from "@repo/rdx-utils";
-import { formatMoneyDTO, formatPercentageDTO, formatQuantityDTO } from "../../helpers";
+import { formatMoneyDTO, formatQuantityDTO } from "../../helpers";
 
 type CustomerInvoiceItemsDTO = GetCustomerInvoiceByIdResponseDTO["items"];
 type CustomerInvoiceItemDTO = ArrayElement<CustomerInvoiceItemsDTO>;
@@ -20,8 +20,9 @@ export class CustomerInvoiceItemsReportPersenter extends Presenter<
       unit_amount: formatMoneyDTO(invoiceItem.unit_amount, this._locale),
 
       subtotal_amount: formatMoneyDTO(invoiceItem.subtotal_amount, this._locale),
-      discount_percetage: formatPercentageDTO(invoiceItem.discount_percentage),
+      //      discount_percetage: formatPercentageDTO(invoiceItem.discount_percentage, this._locale),
       discount_amount: formatMoneyDTO(invoiceItem.discount_amount, this._locale),
+      taxable_amount: formatMoneyDTO(invoiceItem.taxable_amount, this._locale),
       taxes_amount: formatMoneyDTO(invoiceItem.taxes_amount, this._locale),
       total_amount: formatMoneyDTO(invoiceItem.total_amount, this._locale),
     };
diff --git a/modules/customer-invoices/src/api/application/presenters/queries/customer-invoice.report.presenter.ts b/modules/customer-invoices/src/api/application/presenters/queries/customer-invoice.report.presenter.ts
index 3f91607c..ae4e1967 100644
--- a/modules/customer-invoices/src/api/application/presenters/queries/customer-invoice.report.presenter.ts
+++ b/modules/customer-invoices/src/api/application/presenters/queries/customer-invoice.report.presenter.ts
@@ -1,6 +1,6 @@
 import { Presenter } from "@erp/core/api";
 import { GetCustomerInvoiceByIdResponseDTO } from "../../../../common/dto";
-import { formatMoneyDTO, formatPercentageDTO } from "../../helpers";
+import { formatDateDTO, formatMoneyDTO, formatPercentageDTO } from "../../helpers";
 
 export class CustomerInvoiceReportPresenter extends Presenter<
   GetCustomerInvoiceByIdResponseDTO,
@@ -21,9 +21,12 @@ export class CustomerInvoiceReportPresenter extends Presenter<
     return {
       ...invoiceDTO,
       items: itemsDTO,
+
+      invoice_date: formatDateDTO(invoiceDTO.invoice_date),
       subtotal_amount: formatMoneyDTO(invoiceDTO.subtotal_amount, locale),
-      discount_percetage: formatPercentageDTO(invoiceDTO.discount_percentage),
+      discount_percetage: formatPercentageDTO(invoiceDTO.discount_percentage, locale),
       discount_amount: formatMoneyDTO(invoiceDTO.discount_amount, locale),
+      taxable_amount: formatMoneyDTO(invoiceDTO.taxable_amount, locale),
       taxes_amount: formatMoneyDTO(invoiceDTO.taxes_amount, locale),
       total_amount: formatMoneyDTO(invoiceDTO.total_amount, locale),
     };
diff --git a/modules/customer-invoices/src/api/application/use-cases/report/reporter/customer-invoice.report.pdf.ts b/modules/customer-invoices/src/api/application/use-cases/report/reporter/customer-invoice.report.pdf.ts
index 62addfac..f6c62700 100644
--- a/modules/customer-invoices/src/api/application/use-cases/report/reporter/customer-invoice.report.pdf.ts
+++ b/modules/customer-invoices/src/api/application/use-cases/report/reporter/customer-invoice.report.pdf.ts
@@ -20,6 +20,8 @@ export class CustomerInvoiceReportPDFPresenter extends Presenter<
 
       const htmlData = htmlPresenter.toOutput(customerInvoice);
 
+      console.log(htmlData);
+
       // Generar el PDF con Puppeteer
       const browser = await puppeteer.launch({
         args: [
@@ -44,6 +46,10 @@ export class CustomerInvoiceReportPDFPresenter extends Presenter<
           right: "10mm",
           top: "10mm",
         },
+        landscape: false,
+        preferCSSPageSize: true,
+        omitBackground: false,
+        printBackground: true,
       });
 
       await browser.close();
diff --git a/modules/customer-invoices/src/api/application/use-cases/report/reporter/templates/customer-invoice/template.hbs b/modules/customer-invoices/src/api/application/use-cases/report/reporter/templates/customer-invoice/template.hbs
index 0331e031..c28c4e7b 100644
--- a/modules/customer-invoices/src/api/application/use-cases/report/reporter/templates/customer-invoice/template.hbs
+++ b/modules/customer-invoices/src/api/application/use-cases/report/reporter/templates/customer-invoice/template.hbs
@@ -3,7 +3,7 @@
 
 <head>
   <meta charset="UTF-8">
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css"
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.css"
     referrerpolicy="no-referrer" />
   <title>Factura F26200</title>
   <style>
@@ -23,6 +23,10 @@
       padding-bottom: 0;
     }
 
+    .accent-color {
+      background-color: #F08119;
+    }
+
     .company-info,
     .invoice-meta {
       width: 48%;
@@ -52,7 +56,7 @@
     table th,
     table td {
       border: 0px solid #ccc;
-      padding: 10px;
+      padding: 3px 10px;
       text-align: left;
       vertical-align: top;
     }
@@ -84,7 +88,15 @@
       background-color: #eef;
     }
 
+    .accent-color {
+      background-color: #F08119;
+    }
+
     @media print {
+      * {
+        -webkit-print-color-adjust: exact;
+      }
+
       thead {
         display: table-header-group;
       }
@@ -106,7 +118,7 @@
         <div class="flex w-full">
           <div class="p-1 ">
             <p>Factura nº:<strong>&nbsp;{{invoice_number}}</strong></p>
-            <p><span>Fecha:<strong>&nbsp;{{operation_date}}</strong></p>
+            <p><span>Fecha:<strong>&nbsp;{{invoice_date}}</strong></p>
             <p><span>Página:</span>1 / 1</p>
           </div>
           <div class="p-1 ml-9">
@@ -133,13 +145,16 @@
   </header>
 
   <main id="main">
-    <section id="details">
+    <section id="details" class="border-b border-black ">
 
       <div class="relative pt-0 border-b border-black">
-        <!-- Badge TOTAL superpuesto -->
-        <div class="absolute -top-7 right-0">
-          <div class="relative bg-[#f08119] text-white text-sm font-semibold px-3 py-1 shadow">
-            TOTAL: {{total_amount}} €
+        <!-- Badge TOTAL decorado con imagen -->
+        <div class="absolute -top-9 right-0">
+
+          <div class="relative text-sm font-semibold text-black pr-2 pl-10 py-2 justify-center bg-red-900"
+            style="background-image: url('https://rodax-software.com/images/img-total2.jpg'); background-size: cover; background-position: left;">
+            <!-- Texto del total -->
+            <span>TOTAL: {{total_amount}}</span>
           </div>
         </div>
       </div>
@@ -159,9 +174,9 @@
           {{#each items}}
           <tr>
             <td>{{description}}</td>
-            <td class="text-right">{{quantity.value}}</td>
-            <td class="text-right">{{unit_amount.value}} €</td>
-            <td class="text-right">{{total_amount.value}} €</td>
+            <td class="text-right">{{quantity}}</td>
+            <td class="text-right">{{unit_amount}}</td>
+            <td class="text-right">{{total_amount}}</td>
           </tr>
           {{/each}}
         </tbody>
@@ -179,32 +194,40 @@
         </div>
       </div>
 
-      <div class="grow">
+      <div class="relative pt-10 grow">
         <table class="table-header min-w-full bg-transparent">
           <tbody>
             {{#if percentage}}
             <tr>
-              <td class="px-4 py-2 text-right">Importe&nbsp;neto</td>
-              <td class="px-4 py-2 text-right">761,14 €</td>
+              <td class="px-4 text-right">Importe&nbsp;neto</td>
+              <td class="w-5">&nbsp;</td>
+              <td class="px-4 text-right">{{subtotal_amount}}</td>
             </tr>
             <tr>
-              <td class="px-4 py-2 text-right">Descuento&nbsp;0%</td>
-              <td class="px-4 py-2 text-right">{{discount_amount.value}}</td>
+              <td class="px-4 text-right">Descuento&nbsp;0%</td>
+              <td class="w-5">&nbsp;</td>
+              <td class="px-4 text-right">{{discount_amount.value}}</td>
             </tr>
             {{else}}
             <!-- dto 0-->
             {{/if}}
             <tr>
-              <td class="px-4 py-2 text-right">Base&nbsp;imponible</td>
-              <td class="px-4 py-2 text-right">{{subtotal_amount}}</td>
+              <td class="px-4 text-right">Base&nbsp;imponible</td>
+              <td class="w-5">&nbsp;</td>
+              <td class="px-4 text-right">{{taxable_amount}}</td>
             </tr>
             <tr>
-              <td class="px-4 py-2 text-right">IVA&nbsp;21%</td>
-              <td class="px-4 py-2 text-right">{{taxes_amount}}</td>
+              <td class="px-4 text-right">IVA&nbsp;21%</td>
+              <td class="w-5">&nbsp;</td>
+              <td class="px-4 text-right">{{taxes_amount}}</td>
             </tr>
-            <tr class="bg-[#f08119] text-white font-semibold">
-              <td class="px-4 py-2 text-right bg-amber-700">Total&nbsp;factura</td>
-              <td class="px-4 py-2 text-right">{{total_amount}}</td>
+            <tr class="">
+              <td class="px-4 text-right accent-color">
+                Total&nbsp;factura
+              </td>
+              <td class="w-5">&nbsp;</td>
+              <td class="px-4 text-right accent-color">
+                {{total_amount}}</td>
             </tr>
           </tbody>
         </table>
diff --git a/modules/customer-invoices/src/api/domain/entities/customer-invoice-items/customer-invoice-item.ts b/modules/customer-invoices/src/api/domain/entities/customer-invoice-items/customer-invoice-item.ts
index b8977891..43f7fe04 100644
--- a/modules/customer-invoices/src/api/domain/entities/customer-invoice-items/customer-invoice-item.ts
+++ b/modules/customer-invoices/src/api/domain/entities/customer-invoice-items/customer-invoice-item.ts
@@ -22,6 +22,8 @@ export interface CustomerInvoiceItemProps {
 }
 
 export interface ICustomerInvoiceItem {
+  isNonValued: boolean;
+
   description: Maybe<CustomerInvoiceItemDescription>;
 
   quantity: Maybe<ItemQuantity>; // Cantidad de unidades
@@ -46,6 +48,8 @@ export class CustomerInvoiceItem
   extends DomainEntity<CustomerInvoiceItemProps>
   implements ICustomerInvoiceItem
 {
+  protected _isNonValued!: boolean;
+
   public static create(
     props: CustomerInvoiceItemProps,
     id?: UniqueID
@@ -59,6 +63,16 @@ export class CustomerInvoiceItem
     return Result.ok(item);
   }
 
+  protected constructor(props: CustomerInvoiceItemProps, id?: UniqueID) {
+    super(props, id);
+
+    this._isNonValued = this.quantity.isNone() || this.unitAmount.isNone();
+  }
+
+  get isNonValued(): boolean {
+    return this._isNonValued;
+  }
+
   get description(): Maybe<CustomerInvoiceItemDescription> {
     return this.props.description;
   }
diff --git a/modules/customer-invoices/src/common/dto/response/get-customer-invoice-by-id.response.dto.ts b/modules/customer-invoices/src/common/dto/response/get-customer-invoice-by-id.response.dto.ts
index 52df31e1..8ca0cc1c 100644
--- a/modules/customer-invoices/src/common/dto/response/get-customer-invoice-by-id.response.dto.ts
+++ b/modules/customer-invoices/src/common/dto/response/get-customer-invoice-by-id.response.dto.ts
@@ -42,6 +42,7 @@ export const GetCustomerInvoiceByIdResponseSchema = z.object({
   items: z.array(
     z.object({
       id: z.uuid(),
+      isNonValued: z.string(),
       position: z.string(),
       description: z.string(),
       quantity: QuantitySchema,
diff --git a/modules/customers/src/web/pages/update/customer-edit-form.tsx b/modules/customers/src/web/pages/update/customer-edit-form.tsx
index 89f5d8ec..45eb8857 100644
--- a/modules/customers/src/web/pages/update/customer-edit-form.tsx
+++ b/modules/customers/src/web/pages/update/customer-edit-form.tsx
@@ -14,21 +14,25 @@ import { CustomerContactFields } from "./customer-contact-fields";
 
 interface CustomerFormProps {
   formId: string;
-  data?: CustomerData;
+  defaultValues: CustomerData; // ✅ ya no recibe DTO
   isPending?: boolean;
-  /**
-   * Callback function to handle form submission.
-   * @param data - The customer data submitted by the form.
-   */
-  onSubmit?: (data: CustomerUpdateData) => void;
+  onSubmit: (data: CustomerData) => void;
+  onError: (errors: FieldErrors<CustomerUpdateData>) => void;
+  errorMessage?: string; // ✅ prop nueva para mostrar error global
 }
 
-export const CustomerEditForm = ({ formId, data, onSubmit, isPending }: CustomerFormProps) => {
+export const CustomerEditForm = ({
+  formId,
+  defaultValues,
+  onSubmit,
+  isPending,
+  errorMessage,
+}: CustomerFormProps) => {
   const { t } = useTranslation();
 
   const form = useForm<CustomerUpdateData>({
     resolver: zodResolver(CustomerUpdateSchema),
-    defaultValues: data,
+    defaultValues,
     disabled: isPending,
   });
 
@@ -36,24 +40,10 @@ export const CustomerEditForm = ({ formId, data, onSubmit, isPending }: Customer
     isDirty: form.formState.isDirty,
   });
 
-  const handleSubmit = (data: CustomerUpdateData) => {
-    console.log("Datos del formulario:", data);
-    onSubmit?.(data);
-  };
-
-  const handleError = (errors: FieldErrors<CustomerUpdateData>) => {
-    console.error("Errores en el formulario:", errors);
-    // Aquí puedes manejar los errores, por ejemplo, mostrar un mensaje al usuario
-  };
-
-  const handleCancel = () => {
-    form.reset(data);
-  };
-
   return (
     <Form {...form}>
       <FormDebug form={form} />
-      <form id={formId} onSubmit={form.handleSubmit(handleSubmit, handleError)}>
+      <form id={formId} onSubmit={form.handleSubmit(onSubmit, oError)}>
         <div className='w-full grid grid-cols-1 space-y-8 space-x-8 xl:grid-cols-2'>
           <CustomerBasicInfoFields control={form.control} />
           <CustomerAddressFields control={form.control} />
diff --git a/modules/customers/src/web/pages/update/update.tsx b/modules/customers/src/web/pages/update/update.tsx
index 82490e63..da23a87b 100644
--- a/modules/customers/src/web/pages/update/update.tsx
+++ b/modules/customers/src/web/pages/update/update.tsx
@@ -4,6 +4,7 @@ import { useNavigate } from "react-router-dom";
 
 import { useUrlParamId } from "@erp/core/hooks";
 import { showErrorToast, showSuccessToast } from "@repo/shadcn-ui/lib/utils";
+import { FieldErrors } from "react-hook-form";
 import { CustomerEditorSkeleton, ErrorAlert, NotFoundCard } from "../../components";
 import { useCustomerQuery, useUpdateCustomerMutation } from "../../hooks";
 import { useTranslation } from "../../i18n";
@@ -46,6 +47,11 @@ export const CustomerUpdate = () => {
     }
   };
 
+  const handleError = (errors: FieldErrors<CustomerUpdateData>) => {
+    console.error("Errores en el formulario:", errors);
+    // Aquí puedes manejar los errores, por ejemplo, mostrar un mensaje al usuario
+  };
+
   if (isLoadingCustomer) {
     return <CustomerEditorSkeleton />;
   }
@@ -127,9 +133,10 @@ export const CustomerUpdate = () => {
           {/* Importante: proveemos un formId para que el botón del header pueda hacer submit */}
           <CustomerEditForm
             formId='customer-edit-form'
-            data={customerData}
+            defaultValues={defaultValues}
             onSubmit={handleSubmit}
             isPending={isUpdating}
+            errorMessage={isUpdateError ? getErrorMessage(updateError) : undefined}
           />
         </div>
       </AppContent>
diff --git a/packages/rdx-ddd/src/value-objects/money-value.ts b/packages/rdx-ddd/src/value-objects/money-value.ts
index fd1500b9..cd6ef900 100644
--- a/packages/rdx-ddd/src/value-objects/money-value.ts
+++ b/packages/rdx-ddd/src/value-objects/money-value.ts
@@ -212,7 +212,6 @@ export class MoneyValue extends ValueObject<MoneyValueProps> implements IMoneyVa
    * @returns Importe formateado
    */
   format(locale: string): string {
-    const value = this.value;
     const currencyCode = this.currencyCode;
     const scale = this.scale;
 
diff --git a/packages/rdx-ddd/src/value-objects/percentage.ts b/packages/rdx-ddd/src/value-objects/percentage.ts
index 5ef67113..62169b4c 100644
--- a/packages/rdx-ddd/src/value-objects/percentage.ts
+++ b/packages/rdx-ddd/src/value-objects/percentage.ts
@@ -92,4 +92,14 @@ export class Percentage extends ValueObject<PercentageProps> {
       scale: String(this.scale),
     };
   }
+
+  format(locale: string): string {
+    const scale = this.scale;
+
+    return this.toNumber().toLocaleString(locale, {
+      style: "percent",
+      minimumFractionDigits: scale,
+      maximumSignificantDigits: scale,
+    });
+  }
 }
diff --git a/packages/rdx-ddd/src/value-objects/quantity.ts b/packages/rdx-ddd/src/value-objects/quantity.ts
index 27c18770..e38bce17 100644
--- a/packages/rdx-ddd/src/value-objects/quantity.ts
+++ b/packages/rdx-ddd/src/value-objects/quantity.ts
@@ -135,4 +135,8 @@ export class Quantity extends ValueObject<QuantityProps> {
 
     return Quantity.create({ value: newValue, scale: newScale });
   }
+
+  format(): string {
+    return this.toNumber().toLocaleString();
+  }
 }