diff --git a/apps/edr-freight-api/package.json b/apps/edr-freight-api/package.json
index 9edf388b9..a0a119861 100644
--- a/apps/edr-freight-api/package.json
+++ b/apps/edr-freight-api/package.json
@@ -23,6 +23,7 @@
     "seed:import-djibouti-demo": "ts-node -r tsconfig-paths/register src/scripts/seed-import-djibouti-demo.ts",
     "seed:approved-first-lastmile-demo-bookings": "ts-node -r tsconfig-paths/register src/scripts/seed-approved-first-lastmile-demo-bookings.ts",
     "seed:negad-indode-arrived-train": "ts-node -r tsconfig-paths/register src/scripts/seed-negad-indode-arrived-train.ts",
+    "seed:gate-pass-train-scenarios": "ts-node -r tsconfig-paths/register src/scripts/seed-gate-pass-train-scenarios.ts",
     "auto-unload:arrived-import-trains": "ts-node -r tsconfig-paths/register src/scripts/auto-unload-arrived-import-trains.ts",
     "seed:file-upload-settings": "ts-node -r tsconfig-paths/register src/scripts/seed-file-upload-settings.ts",
     "seed:gov-companies": "ts-node -r tsconfig-paths/register src/scripts/seed-gov-companies.ts",
@@ -32,7 +33,8 @@
     "iam:migration:revert": "pnpm run iam:typeorm:cli migration:revert",
     "iam:migration:show": "pnpm run iam:typeorm:cli migration:show",
     "iam:seed:run": "cross-env APP_MODULE_PATH=./dist/app.module dotenv -- node ./node_modules/@tria-plc/iamapi-common/dist/db/seed.cli.js",
-    "migrate": "ts-node -r tsconfig-paths/register src/scripts/run-migrations.ts"
+    "migrate": "ts-node -r tsconfig-paths/register src/scripts/run-migrations.ts",
+    "script": "ts-node -r tsconfig-paths/register src/scripts/main.ts"
   },
   "dependencies": {
     "@edr/api-common": "workspace:*",
@@ -84,13 +86,15 @@
     "@types/node": "^20.14.0",
     "@types/pg": "^8.6.7",
     "@types/supertest": "^6.0.2",
+    "@types/vorpal": "^1.12.8",
     "jest": "^29.7.0",
     "supertest": "^7.0.0",
     "ts-jest": "^29.2.5",
     "ts-loader": "^9.5.1",
     "ts-node": "^10.9.2",
     "tsconfig-paths": "^4.2.0",
-    "typescript": "^5.5.4"
+    "typescript": "^5.5.4",
+    "vorpal": "^1.12.0"
   },
   "jest": {
     "moduleFileExtensions": [
diff --git a/apps/edr-freight-api/src/app.module.ts b/apps/edr-freight-api/src/app.module.ts
index db05ae26f..a81a539ba 100644
--- a/apps/edr-freight-api/src/app.module.ts
+++ b/apps/edr-freight-api/src/app.module.ts
@@ -59,6 +59,7 @@ import { FreightPermissionKeyMigrationSeeder } from "./seed/freight-permission-k
 import { DemoFreightDataSeeder } from "./seed/demo-freight-data.seeder";
 import { GovCompaniesSeeder } from "./seed/gov-companies.seeder";
 import { ApprovedFirstLastMileDemoBookingsSeeder } from "./seed/approved-first-lastmile-demo-bookings.seeder";
+import { PaidIndodeDemoBookingsSeeder } from "./seed/paid-indode-demo-bookings.seeder";
 //New Trains, Wagons, Container and Cargo management modules
 import { TrainsModule } from "./modules/trains/trains.module";
 import { WagonsModule } from './modules/wagons/wagons.module';
@@ -69,6 +70,8 @@ import { WarehousesModule } from './modules/warehouses/warehouses.module';
 import { OverviewModule } from './modules/overview/overview.module';
 import { VehiclesModule } from './modules/vehicles/vehicles.module';
 import { DriversModule } from './modules/drivers/drivers.module';
+import { FuelModule } from './modules/fuel/fuel.module';
+import { MaintenanceModule } from './modules/maintenance/maintenance.module';
 import { FirstMileModule } from './modules/first-mile/first-mile.module';
 import { LastMileModule } from './modules/last-mile/last-mile.module';
 import { InterchangeDocumentsModule } from './modules/interchange-documents/interchange-documents.module';
@@ -133,6 +136,8 @@ import { ImportOperationsModule } from './modules/import-operations/import-opera
     OverviewModule,
     VehiclesModule,
     DriversModule,
+    FuelModule,
+    MaintenanceModule,
     FirstMileModule,
     LastMileModule,
     InterchangeDocumentsModule,
@@ -156,6 +161,7 @@ import { ImportOperationsModule } from './modules/import-operations/import-opera
     ExportDjiboutiInterchangeDemoSeeder,
     MarshallingDemoTrainsSeeder,
     ApprovedFirstLastMileDemoBookingsSeeder,
+    PaidIndodeDemoBookingsSeeder,
   ],
 })
 export class AppModule implements OnApplicationBootstrap {
@@ -174,6 +180,7 @@ export class AppModule implements OnApplicationBootstrap {
     private readonly warehouseDemoSeeder: WarehouseDemoSeeder,
     private readonly exportDjiboutiInterchangeDemoSeeder: ExportDjiboutiInterchangeDemoSeeder,
     private readonly marshallingDemoTrainsSeeder: MarshallingDemoTrainsSeeder,
+    private readonly paidIndodeDemoBookingsSeeder: PaidIndodeDemoBookingsSeeder,
     private readonly freightPermissionKeyMigrationSeeder: FreightPermissionKeyMigrationSeeder,
     private readonly demoFreightDataSeeder: DemoFreightDataSeeder,
     private readonly govCompaniesSeeder: GovCompaniesSeeder,
@@ -195,6 +202,7 @@ export class AppModule implements OnApplicationBootstrap {
     await this.warehouseDemoSeeder.run();
     await this.exportDjiboutiInterchangeDemoSeeder.run();
     await this.marshallingDemoTrainsSeeder.run();
+    await this.paidIndodeDemoBookingsSeeder.run();
     // Idempotent demo data: ≥100 wagons/type, approval chains, 4 staff users.
     // Each block self-guards on an empty-table check, so this is safe every boot.
     // Demo data seeds (DemoBookingsSeeder, PricingDataSeeder,
diff --git a/apps/edr-freight-api/src/config/database.config.ts b/apps/edr-freight-api/src/config/database.config.ts
index 0e7375b19..47d8f5b3c 100644
--- a/apps/edr-freight-api/src/config/database.config.ts
+++ b/apps/edr-freight-api/src/config/database.config.ts
@@ -116,8 +116,10 @@ export default registerAs("database", (): TypeOrmModuleOptions => {
       freightMigrationsGlob,
     ],
     migrationsRun: true,
+    migrationsTransactionMode: "each",
     // Schema changes via migrations only (synchronize breaks ITMLS backfill on existing rows).
     synchronize: false,
-    logging: process.env.NODE_ENV === "development",
+    logging:
+      process.env.TYPEORM_LOGGING === "true" ? true : ["error", "warn"],
   };
 });
diff --git a/apps/edr-freight-api/src/contracts/contract-document-view-model.builder.ts b/apps/edr-freight-api/src/contracts/contract-document-view-model.builder.ts
index caf161614..05061ed9a 100644
--- a/apps/edr-freight-api/src/contracts/contract-document-view-model.builder.ts
+++ b/apps/edr-freight-api/src/contracts/contract-document-view-model.builder.ts
@@ -200,7 +200,9 @@ export class ContractDocumentViewModelBuilder {
       serviceType: this.valueOrDash(
         contract.serviceType?.serviceName ?? contract.serviceType?.code,
       ),
-      scheduledDate: this.formatDate(contract.estimatedShipmentDate),
+      // Estimated shipment date was removed from the contract wizard; the
+      // binding scheduled date is set per-booking, not on the contract.
+      scheduledDate: this.formatDate(null),
       contractType: this.valueOrDash(contract.contractType),
       cargoDescription: this.valueOrDash(cargoName),
       totalWeightVgm: '—',
diff --git a/apps/edr-freight-api/src/migrations/1791000000000-AddWarehouseAllocationAndFeeRules.ts b/apps/edr-freight-api/src/migrations/1791000000000-AddWarehouseAllocationAndFeeRules.ts
index fa6087faa..1cad0fe66 100644
--- a/apps/edr-freight-api/src/migrations/1791000000000-AddWarehouseAllocationAndFeeRules.ts
+++ b/apps/edr-freight-api/src/migrations/1791000000000-AddWarehouseAllocationAndFeeRules.ts
@@ -56,6 +56,7 @@ export class AddWarehouseAllocationAndFeeRules1791000000000 implements Migration
           { name: 'zone_id', type: 'uuid', isNullable: true },
           { name: 'free_days', type: 'int', default: 0 },
           { name: 'rate_per_day', type: 'numeric', precision: 14, scale: 2, default: 0 },
+          { name: 'tiers', type: 'jsonb', default: "'[]'" },
           { name: 'currency', type: 'varchar', length: '8', default: "'USD'" },
           { name: 'is_active', type: 'boolean', default: true },
           { name: 'created_at', type: 'timestamptz', default: 'now()' },
diff --git a/apps/edr-freight-api/src/migrations/1821000000002-CreateInvoices.ts b/apps/edr-freight-api/src/migrations/1821000000002-CreateInvoices.ts
index 65a3e764b..4c2fb5d95 100644
--- a/apps/edr-freight-api/src/migrations/1821000000002-CreateInvoices.ts
+++ b/apps/edr-freight-api/src/migrations/1821000000002-CreateInvoices.ts
@@ -62,20 +62,96 @@ export class CreateInvoices1821000000002 implements MigrationInterface {
     `);
 
     await queryRunner.query(
-      `CREATE INDEX idx_invoices_company ON freight.invoices (company_id);`,
+      `
+      ALTER TABLE freight.invoices
+        ADD COLUMN IF NOT EXISTS id uuid DEFAULT uuid_generate_v4(),
+        ADD COLUMN IF NOT EXISTS invoice_number varchar(64),
+        ADD COLUMN IF NOT EXISTS company_id uuid,
+        ADD COLUMN IF NOT EXISTS company_profile_id uuid,
+        ADD COLUMN IF NOT EXISTS total_amount numeric(14, 2) NOT NULL DEFAULT 0,
+        ADD COLUMN IF NOT EXISTS currency varchar(8) NOT NULL DEFAULT 'ETB',
+        ADD COLUMN IF NOT EXISTS status freight.invoices_status_enum NOT NULL DEFAULT 'DRAFT',
+        ADD COLUMN IF NOT EXISTS source varchar(255),
+        ADD COLUMN IF NOT EXISTS source_id varchar(255),
+        ADD COLUMN IF NOT EXISTS type varchar(255),
+        ADD COLUMN IF NOT EXISTS issued_at timestamptz,
+        ADD COLUMN IF NOT EXISTS payment_id uuid,
+        ADD COLUMN IF NOT EXISTS due_at timestamptz,
+        ADD COLUMN IF NOT EXISTS created_at timestamptz NOT NULL DEFAULT now(),
+        ADD COLUMN IF NOT EXISTS updated_at timestamptz NOT NULL DEFAULT now(),
+        ADD COLUMN IF NOT EXISTS deleted_at timestamptz;
+      `,
+    );
+    await queryRunner.query(`
+      UPDATE freight.invoices
+         SET due_at = COALESCE(due_at, issued_at, created_at, now())
+       WHERE due_at IS NULL;
+    `);
+    await queryRunner.query(`ALTER TABLE freight.invoices ALTER COLUMN due_at SET NOT NULL;`);
+
+    await queryRunner.query(`
+      DO $$
+      BEGIN
+        IF NOT EXISTS (
+          SELECT 1 FROM pg_constraint
+           WHERE contype = 'p'
+             AND conrelid = 'freight.invoices'::regclass
+        ) THEN
+          ALTER TABLE freight.invoices ADD CONSTRAINT pk_invoices PRIMARY KEY (id);
+        END IF;
+
+        IF NOT EXISTS (
+          SELECT 1 FROM pg_constraint
+           WHERE conname = 'uq_invoices_invoice_number'
+             AND conrelid = 'freight.invoices'::regclass
+        ) THEN
+          ALTER TABLE freight.invoices ADD CONSTRAINT uq_invoices_invoice_number UNIQUE (invoice_number);
+        END IF;
+
+        IF NOT EXISTS (
+          SELECT 1 FROM pg_constraint
+           WHERE conname = 'fk_invoices_company'
+             AND conrelid = 'freight.invoices'::regclass
+        ) THEN
+          ALTER TABLE freight.invoices ADD CONSTRAINT fk_invoices_company
+            FOREIGN KEY (company_id) REFERENCES freight.companies (id) ON DELETE RESTRICT;
+        END IF;
+
+        IF NOT EXISTS (
+          SELECT 1 FROM pg_constraint
+           WHERE conname = 'fk_invoices_company_profile'
+             AND conrelid = 'freight.invoices'::regclass
+        ) THEN
+          ALTER TABLE freight.invoices ADD CONSTRAINT fk_invoices_company_profile
+            FOREIGN KEY (company_profile_id) REFERENCES freight.company_profiles (id) ON DELETE RESTRICT;
+        END IF;
+
+        IF NOT EXISTS (
+          SELECT 1 FROM pg_constraint
+           WHERE conname = 'fk_invoices_payment'
+             AND conrelid = 'freight.invoices'::regclass
+        ) THEN
+          ALTER TABLE freight.invoices ADD CONSTRAINT fk_invoices_payment
+            FOREIGN KEY (payment_id) REFERENCES freight.payments (id) ON DELETE SET NULL;
+        END IF;
+      END $$;
+    `);
+
+    await queryRunner.query(
+      `CREATE INDEX IF NOT EXISTS idx_invoices_company ON freight.invoices (company_id);`,
     );
     await queryRunner.query(
-      `CREATE INDEX idx_invoices_company_profile ON freight.invoices (company_profile_id);`,
+      `CREATE INDEX IF NOT EXISTS idx_invoices_company_profile ON freight.invoices (company_profile_id);`,
     );
     await queryRunner.query(
-      `CREATE INDEX idx_invoices_source ON freight.invoices (source, source_id);`,
+      `CREATE INDEX IF NOT EXISTS idx_invoices_source ON freight.invoices (source, source_id);`,
     );
     await queryRunner.query(
-      `CREATE INDEX idx_invoices_status ON freight.invoices (status);`,
+      `CREATE INDEX IF NOT EXISTS idx_invoices_status ON freight.invoices (status);`,
     );
 
     await queryRunner.query(`
-      CREATE TABLE freight.invoice_lines (
+      CREATE TABLE IF NOT EXISTS freight.invoice_lines (
         id uuid NOT NULL DEFAULT uuid_generate_v4(),
         invoice_id uuid NOT NULL,
         charge_type varchar NOT NULL,
@@ -95,7 +171,7 @@ export class CreateInvoices1821000000002 implements MigrationInterface {
     `);
 
     await queryRunner.query(
-      `CREATE INDEX idx_invoice_lines_invoice ON freight.invoice_lines (invoice_id);`,
+      `CREATE INDEX IF NOT EXISTS idx_invoice_lines_invoice ON freight.invoice_lines (invoice_id);`,
     );
   }
 
diff --git a/apps/edr-freight-api/src/migrations/1828000000000-AddBulkHazmatReeferQuantity.ts b/apps/edr-freight-api/src/migrations/1828000000000-AddBulkHazmatReeferQuantity.ts
new file mode 100644
index 000000000..cc9437eaf
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1828000000000-AddBulkHazmatReeferQuantity.ts
@@ -0,0 +1,31 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+/**
+ * Bulk / break-bulk freight can now declare HOW MUCH of the cargo is hazardous
+ * or refrigerated, in the cargo's own unit of measure (tons for PER_TON, item
+ * count for PER_ITEM). These two columns hold that amount on the booking; they
+ * stay 0 for container freight (which tracks it per line on booking_container)
+ * and for bulk cargo with no hazardous/reefer portion. The existing
+ * is_hazardous / is_reefer booleans remain the surcharge trigger.
+ */
+export class AddBulkHazmatReeferQuantity1828000000000 implements MigrationInterface {
+  name = 'AddBulkHazmatReeferQuantity1828000000000';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings ADD COLUMN IF NOT EXISTS bulk_hazardous_quantity NUMERIC(12,3) NOT NULL DEFAULT 0;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings ADD COLUMN IF NOT EXISTS bulk_reefer_quantity NUMERIC(12,3) NOT NULL DEFAULT 0;`,
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings DROP COLUMN IF EXISTS bulk_reefer_quantity;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings DROP COLUMN IF EXISTS bulk_hazardous_quantity;`,
+    );
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1829000000000-CentralizeWarehouseInvoices.ts b/apps/edr-freight-api/src/migrations/1829000000000-CentralizeWarehouseInvoices.ts
index dd246cb7d..75082c5c4 100644
--- a/apps/edr-freight-api/src/migrations/1829000000000-CentralizeWarehouseInvoices.ts
+++ b/apps/edr-freight-api/src/migrations/1829000000000-CentralizeWarehouseInvoices.ts
@@ -19,6 +19,31 @@ export class CentralizeWarehouseInvoices1829000000000 implements MigrationInterf
   name = 'CentralizeWarehouseInvoices1829000000000';
 
   public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      DO $$
+      BEGIN
+        IF EXISTS (
+          SELECT 1
+            FROM information_schema.columns
+           WHERE table_schema = 'freight'
+             AND table_name = 'invoices'
+             AND column_name = 'booking_id'
+        ) THEN
+          ALTER TABLE freight.invoices ALTER COLUMN booking_id DROP NOT NULL;
+        END IF;
+
+        IF EXISTS (
+          SELECT 1
+            FROM information_schema.columns
+           WHERE table_schema = 'freight'
+             AND table_name = 'invoices'
+             AND column_name = 'amount'
+        ) THEN
+          ALTER TABLE freight.invoices ALTER COLUMN amount DROP NOT NULL;
+        END IF;
+      END $$;
+    `);
+
     // 1. Invoice headers. Keep the same id so items still link, and so any
     //    external reference to the invoice id stays valid.
     await queryRunner.query(`
diff --git a/apps/edr-freight-api/src/migrations/1829000000000-PhasedClearanceCycleMeta.ts b/apps/edr-freight-api/src/migrations/1829000000000-PhasedClearanceCycleMeta.ts
new file mode 100644
index 000000000..75288e94c
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1829000000000-PhasedClearanceCycleMeta.ts
@@ -0,0 +1,41 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class PhasedClearanceCycleMeta1829000000000 implements MigrationInterface {
+  name = 'PhasedClearanceCycleMeta1829000000000';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles ADD COLUMN IF NOT EXISTS duty_required BOOLEAN;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles ADD COLUMN IF NOT EXISTS vessel_departure_date DATE;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles ADD COLUMN IF NOT EXISTS ro_amendment_requested_at TIMESTAMPTZ;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles ADD COLUMN IF NOT EXISTS ro_hold_reason TEXT;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles ADD COLUMN IF NOT EXISTS current_phase VARCHAR(40);`,
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles DROP COLUMN IF EXISTS duty_required;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles DROP COLUMN IF EXISTS vessel_departure_date;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles DROP COLUMN IF EXISTS ro_amendment_requested_at;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles DROP COLUMN IF EXISTS ro_hold_reason;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles DROP COLUMN IF EXISTS current_phase;`,
+    );
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1829000000001-SeedRoVesselMinDays.ts b/apps/edr-freight-api/src/migrations/1829000000001-SeedRoVesselMinDays.ts
new file mode 100644
index 000000000..7165ea7a8
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1829000000001-SeedRoVesselMinDays.ts
@@ -0,0 +1,46 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+/** Admin-configurable minimum days between today and export RO vessel departure. */
+export class SeedRoVesselMinDays1829000000001 implements MigrationInterface {
+  name = 'SeedRoVesselMinDays1829000000001';
+  private readonly code = 'ro_vessel_min_days';
+  private readonly options: Array<{ value: string; label: string }> = [
+    { value: '2', label: '2 days' },
+    { value: '3', label: '3 days' },
+  ];
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    const existing = await queryRunner.query(
+      `SELECT id FROM freight.dropdown_settings WHERE code = $1 LIMIT 1;`,
+      [this.code],
+    );
+    if (existing.length > 0) return;
+
+    const inserted = await queryRunner.query(
+      `INSERT INTO freight.dropdown_settings (code, label, description, multiple)
+       VALUES ($1, $2, $3, false)
+       RETURNING id;`,
+      [
+        this.code,
+        'RO vessel minimum lead time (days)',
+        'Minimum days between today and the vessel departure date on an export Release Order.',
+      ],
+    );
+    const settingId = inserted[0].id;
+
+    for (let i = 0; i < this.options.length; i++) {
+      const opt = this.options[i];
+      await queryRunner.query(
+        `INSERT INTO freight.dropdown_options (setting_id, value, label, display_order)
+         VALUES ($1, $2, $3, $4);`,
+        [settingId, opt.value, opt.label, i],
+      );
+    }
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`DELETE FROM freight.dropdown_settings WHERE code = $1;`, [
+      this.code,
+    ]);
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1829000000002-BookingClearanceMeta.ts b/apps/edr-freight-api/src/migrations/1829000000002-BookingClearanceMeta.ts
new file mode 100644
index 000000000..c108b7baa
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1829000000002-BookingClearanceMeta.ts
@@ -0,0 +1,41 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class BookingClearanceMeta1829000000002 implements MigrationInterface {
+  name = 'BookingClearanceMeta1829000000002';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings ADD COLUMN IF NOT EXISTS clearance_current_phase VARCHAR(40);`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings ADD COLUMN IF NOT EXISTS duty_required BOOLEAN;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings ADD COLUMN IF NOT EXISTS vessel_departure_date DATE;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings ADD COLUMN IF NOT EXISTS ro_amendment_requested_at TIMESTAMPTZ;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings ADD COLUMN IF NOT EXISTS ro_hold_reason TEXT;`,
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings DROP COLUMN IF EXISTS clearance_current_phase;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings DROP COLUMN IF EXISTS duty_required;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings DROP COLUMN IF EXISTS vessel_departure_date;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings DROP COLUMN IF EXISTS ro_amendment_requested_at;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings DROP COLUMN IF EXISTS ro_hold_reason;`,
+    );
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1830000000000-AddExpiredInvoiceStatus.ts b/apps/edr-freight-api/src/migrations/1830000000000-AddExpiredInvoiceStatus.ts
new file mode 100644
index 000000000..e4b353b94
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1830000000000-AddExpiredInvoiceStatus.ts
@@ -0,0 +1,27 @@
+import { MigrationInterface, QueryRunner } from "typeorm";
+
+/**
+ * Add the `EXPIRED` invoice status. An invoice expires when its source's pay
+ * window closes before settlement (e.g. a booking whose `paymentDeadline`
+ * lapses) — driven event-style from the domain via `BillingService.expirePayable`,
+ * which emits `${source}.invoice.expired`. Terminal and not settle-able (kept out
+ * of `OPEN_STATUSES`), so it is distinct from `CANCELLED` (manual void) and
+ * `OVERDUE` (still payable).
+ *
+ * Matches Freight.InvoiceStatus in packages/types. ADD VALUE only — additive and
+ * not referenced in this same transaction, so it is PG 12+ safe.
+ */
+export class AddExpiredInvoiceStatus1830000000000 implements MigrationInterface {
+  name = "AddExpiredInvoiceStatus1830000000000";
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TYPE freight.invoices_status_enum ADD VALUE IF NOT EXISTS 'EXPIRED' AFTER 'REFUNDED';`,
+    );
+  }
+
+  public async down(): Promise<void> {
+    // Postgres cannot drop individual enum values; EXPIRED is left on
+    // freight.invoices_status_enum (harmless, unused after down).
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1830000000000-DropCargoTypeShowFreeTextBox.ts b/apps/edr-freight-api/src/migrations/1830000000000-DropCargoTypeShowFreeTextBox.ts
new file mode 100644
index 000000000..5bdfe1f30
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1830000000000-DropCargoTypeShowFreeTextBox.ts
@@ -0,0 +1,19 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class DropCargoTypeShowFreeTextBox1830000000000 implements MigrationInterface {
+  name = 'DropCargoTypeShowFreeTextBox1830000000000';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.cargo_types
+      DROP COLUMN IF EXISTS show_free_text_box
+    `);
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.cargo_types
+      ADD COLUMN IF NOT EXISTS show_free_text_box boolean NOT NULL DEFAULT false
+    `);
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1830000000001-RouteStatusAndSegmentKm.ts b/apps/edr-freight-api/src/migrations/1830000000001-RouteStatusAndSegmentKm.ts
new file mode 100644
index 000000000..701b52c18
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1830000000001-RouteStatusAndSegmentKm.ts
@@ -0,0 +1,72 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class RouteStatusAndSegmentKm1830000000001 implements MigrationInterface {
+  name = 'RouteStatusAndSegmentKm1830000000001';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.routes
+      ADD COLUMN IF NOT EXISTS status varchar(32) NOT NULL DEFAULT 'AVAILABLE'
+    `);
+
+    await queryRunner.query(`
+      UPDATE freight.routes
+      SET status = CASE WHEN is_active = true THEN 'AVAILABLE' ELSE 'STOP_WORKING' END
+    `);
+
+    await queryRunner.query(`
+      DROP INDEX IF EXISTS freight."IDX_routes_name"
+    `);
+    await queryRunner.query(`
+      ALTER TABLE freight.routes DROP COLUMN IF EXISTS name
+    `);
+    await queryRunner.query(`
+      ALTER TABLE freight.routes DROP COLUMN IF EXISTS is_active
+    `);
+
+    await queryRunner.query(`
+      CREATE INDEX IF NOT EXISTS "IDX_routes_status" ON freight.routes (status)
+    `);
+
+    await queryRunner.query(`
+      ALTER TABLE freight.route_milestones
+      ADD COLUMN IF NOT EXISTS distance_km numeric(10,2)
+    `);
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.route_milestones DROP COLUMN IF EXISTS distance_km
+    `);
+
+    await queryRunner.query(`
+      ALTER TABLE freight.routes
+      ADD COLUMN IF NOT EXISTS name varchar(120)
+    `);
+    await queryRunner.query(`
+      UPDATE freight.routes SET name = id::text WHERE name IS NULL
+    `);
+    await queryRunner.query(`
+      ALTER TABLE freight.routes ALTER COLUMN name SET NOT NULL
+    `);
+
+    await queryRunner.query(`
+      ALTER TABLE freight.routes
+      ADD COLUMN IF NOT EXISTS is_active boolean NOT NULL DEFAULT true
+    `);
+    await queryRunner.query(`
+      UPDATE freight.routes
+      SET is_active = CASE WHEN status = 'AVAILABLE' THEN true ELSE false END
+    `);
+
+    await queryRunner.query(`
+      ALTER TABLE freight.routes DROP COLUMN IF EXISTS status
+    `);
+    await queryRunner.query(`
+      DROP INDEX IF EXISTS freight."IDX_routes_status"
+    `);
+    await queryRunner.query(`
+      CREATE UNIQUE INDEX IF NOT EXISTS "IDX_routes_name" ON freight.routes (name)
+    `);
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1830000000002-PreClearanceFinalizedAt.ts b/apps/edr-freight-api/src/migrations/1830000000002-PreClearanceFinalizedAt.ts
new file mode 100644
index 000000000..df57cd828
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1830000000002-PreClearanceFinalizedAt.ts
@@ -0,0 +1,23 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class PreClearanceFinalizedAt1830000000002 implements MigrationInterface {
+  name = 'PreClearanceFinalizedAt1830000000002';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles ADD COLUMN IF NOT EXISTS pre_clearance_finalized_at TIMESTAMPTZ;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings ADD COLUMN IF NOT EXISTS pre_clearance_finalized_at TIMESTAMPTZ;`,
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE freight.contract_clearance_cycles DROP COLUMN IF EXISTS pre_clearance_finalized_at;`,
+    );
+    await queryRunner.query(
+      `ALTER TABLE freight.bookings DROP COLUMN IF EXISTS pre_clearance_finalized_at;`,
+    );
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1831000000000-AddWarehouseFeeRuleTiers.ts b/apps/edr-freight-api/src/migrations/1831000000000-AddWarehouseFeeRuleTiers.ts
new file mode 100644
index 000000000..c6da11cc8
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1831000000000-AddWarehouseFeeRuleTiers.ts
@@ -0,0 +1,19 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class AddWarehouseFeeRuleTiers1831000000000 implements MigrationInterface {
+  name = 'AddWarehouseFeeRuleTiers1831000000000';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.warehouse_fee_rules
+        ADD COLUMN IF NOT EXISTS tiers jsonb NOT NULL DEFAULT '[]';
+    `);
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.warehouse_fee_rules
+        DROP COLUMN IF EXISTS tiers;
+    `);
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1832000000000-AddCustomerTruckAssignmentToBookings.ts b/apps/edr-freight-api/src/migrations/1832000000000-AddCustomerTruckAssignmentToBookings.ts
new file mode 100644
index 000000000..c137ca264
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1832000000000-AddCustomerTruckAssignmentToBookings.ts
@@ -0,0 +1,29 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class AddCustomerTruckAssignmentToBookings1832000000000 implements MigrationInterface {
+  name = 'AddCustomerTruckAssignmentToBookings1832000000000';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.bookings
+        ADD COLUMN IF NOT EXISTS customer_truck_plate_number varchar(32),
+        ADD COLUMN IF NOT EXISTS customer_truck_driver_name varchar(120),
+        ADD COLUMN IF NOT EXISTS customer_truck_type varchar(60),
+        ADD COLUMN IF NOT EXISTS customer_truck_container_number varchar(16),
+        ADD COLUMN IF NOT EXISTS customer_truck_assigned_at timestamptz,
+        ADD COLUMN IF NOT EXISTS customer_truck_arrived_at timestamptz
+    `);
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.bookings
+        DROP COLUMN IF EXISTS customer_truck_arrived_at,
+        DROP COLUMN IF EXISTS customer_truck_assigned_at,
+        DROP COLUMN IF EXISTS customer_truck_container_number,
+        DROP COLUMN IF EXISTS customer_truck_type,
+        DROP COLUMN IF EXISTS customer_truck_driver_name,
+        DROP COLUMN IF EXISTS customer_truck_plate_number
+    `);
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1840000000000-CreateFuelTables.ts b/apps/edr-freight-api/src/migrations/1840000000000-CreateFuelTables.ts
new file mode 100644
index 000000000..a74a58f8e
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1840000000000-CreateFuelTables.ts
@@ -0,0 +1,79 @@
+import { MigrationInterface, QueryRunner } from "typeorm";
+
+export class CreateFuelTables1840000000000 implements MigrationInterface {
+  name = "CreateFuelTables1840000000000";
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    const fuelPurchasesExists = await queryRunner.query(
+      `SELECT 1 FROM information_schema.tables WHERE table_schema = 'freight' AND table_name = 'fuel_purchases';`,
+    );
+
+    if (!fuelPurchasesExists.length) {
+      await queryRunner.query(`
+        CREATE TABLE freight.fuel_purchases (
+          id uuid NOT NULL DEFAULT gen_random_uuid(),
+          vehicle_id uuid NOT NULL,
+          purchase_date timestamptz NOT NULL,
+          liters numeric(10, 2) NOT NULL,
+          cost_per_liter numeric(10, 2) NOT NULL,
+          total_cost numeric(14, 2) NOT NULL,
+          fuel_station varchar(255) NULL,
+          payment_method varchar(50) DEFAULT 'CASH',
+          odometer_reading numeric(10, 2) NULL,
+          driver_id uuid NULL,
+          receipt_number varchar(255) NULL,
+          notes text NULL,
+          created_at timestamptz NOT NULL DEFAULT now(),
+          updated_at timestamptz NOT NULL DEFAULT now(),
+          deleted_at timestamptz NULL,
+          CONSTRAINT pk_fuel_purchases PRIMARY KEY (id),
+          CONSTRAINT fk_fuel_purchases_vehicle FOREIGN KEY (vehicle_id)
+            REFERENCES freight.vehicles (id) ON DELETE CASCADE
+        );
+      `);
+
+      await queryRunner.query(
+        `CREATE INDEX idx_fuel_purchases_vehicle ON freight.fuel_purchases (vehicle_id);`,
+      );
+      await queryRunner.query(
+        `CREATE INDEX idx_fuel_purchases_date ON freight.fuel_purchases (purchase_date);`,
+      );
+    }
+
+    const fuelConsumptionExists = await queryRunner.query(
+      `SELECT 1 FROM information_schema.tables WHERE table_schema = 'freight' AND table_name = 'fuel_consumption';`,
+    );
+
+    if (!fuelConsumptionExists.length) {
+      await queryRunner.query(`
+        CREATE TABLE freight.fuel_consumption (
+          id uuid NOT NULL DEFAULT gen_random_uuid(),
+          vehicle_id uuid NOT NULL,
+          month date NOT NULL,
+          total_liters numeric(10, 2) NOT NULL,
+          total_cost numeric(14, 2) NOT NULL,
+          total_distance_km numeric(10, 2) NOT NULL,
+          fuel_efficiency_km_per_l numeric(10, 2) NULL,
+          number_of_purchases integer DEFAULT 0,
+          average_cost_per_liter numeric(10, 2) NULL,
+          created_at timestamptz NOT NULL DEFAULT now(),
+          updated_at timestamptz NOT NULL DEFAULT now(),
+          deleted_at timestamptz NULL,
+          CONSTRAINT pk_fuel_consumption PRIMARY KEY (id),
+          CONSTRAINT fk_fuel_consumption_vehicle FOREIGN KEY (vehicle_id)
+            REFERENCES freight.vehicles (id) ON DELETE CASCADE,
+          CONSTRAINT uq_fuel_consumption_vehicle_month UNIQUE (vehicle_id, month)
+        );
+      `);
+
+      await queryRunner.query(
+        `CREATE INDEX idx_fuel_consumption_vehicle_month ON freight.fuel_consumption (vehicle_id, month);`,
+      );
+    }
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`DROP TABLE IF EXISTS freight.fuel_consumption;`);
+    await queryRunner.query(`DROP TABLE IF EXISTS freight.fuel_purchases;`);
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1850000000000-CreateMaintenanceTables.ts b/apps/edr-freight-api/src/migrations/1850000000000-CreateMaintenanceTables.ts
new file mode 100644
index 000000000..26d4afe21
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1850000000000-CreateMaintenanceTables.ts
@@ -0,0 +1,82 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class CreateMaintenanceTables1850000000000 implements MigrationInterface {
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    // Create maintenance_schedules table
+    const scheduleTableExists = await queryRunner.query(`
+      SELECT EXISTS(
+        SELECT 1 FROM information_schema.tables
+        WHERE table_schema = 'freight' AND table_name = 'maintenance_schedules'
+      )
+    `);
+
+    if (!scheduleTableExists[0].exists) {
+      await queryRunner.query(`
+        CREATE TABLE "freight"."maintenance_schedules" (
+          "id" uuid NOT NULL DEFAULT gen_random_uuid(),
+          "vehicle_id" uuid NOT NULL,
+          "maintenance_type" varchar NOT NULL,
+          "description" varchar NOT NULL,
+          "scheduled_date" timestamptz NOT NULL,
+          "completed_date" timestamptz,
+          "estimated_cost" numeric(14,2),
+          "actual_cost" numeric(14,2),
+          "status" varchar NOT NULL DEFAULT 'SCHEDULED',
+          "odometer_reading" numeric,
+          "service_provider" varchar,
+          "notes" text,
+          "next_due_km" numeric,
+          "next_due_date" timestamptz,
+          "created_at" timestamptz NOT NULL DEFAULT now(),
+          "updated_at" timestamptz NOT NULL DEFAULT now(),
+          "deleted_at" timestamptz,
+          PRIMARY KEY ("id")
+        )
+      `);
+
+      await queryRunner.query(
+        `CREATE INDEX "idx_maintenance_schedules_vehicle_date" ON "freight"."maintenance_schedules" ("vehicle_id", "scheduled_date")`
+      );
+    }
+
+    // Create maintenance_costs table
+    const costsTableExists = await queryRunner.query(`
+      SELECT EXISTS(
+        SELECT 1 FROM information_schema.tables
+        WHERE table_schema = 'freight' AND table_name = 'maintenance_costs'
+      )
+    `);
+
+    if (!costsTableExists[0].exists) {
+      await queryRunner.query(`
+        CREATE TABLE "freight"."maintenance_costs" (
+          "id" uuid NOT NULL DEFAULT gen_random_uuid(),
+          "vehicle_id" uuid NOT NULL,
+          "maintenance_schedule_id" uuid,
+          "incurred_date" timestamptz NOT NULL,
+          "cost_amount" numeric(14,2) NOT NULL,
+          "cost_type" varchar NOT NULL,
+          "description" varchar NOT NULL,
+          "service_provider" varchar,
+          "invoice_number" varchar,
+          "notes" text,
+          "created_at" timestamptz NOT NULL DEFAULT now(),
+          "updated_at" timestamptz NOT NULL DEFAULT now(),
+          "deleted_at" timestamptz,
+          PRIMARY KEY ("id"),
+          CONSTRAINT "fk_maintenance_schedule" FOREIGN KEY ("maintenance_schedule_id")
+            REFERENCES "freight"."maintenance_schedules" ("id") ON DELETE SET NULL
+        )
+      `);
+
+      await queryRunner.query(
+        `CREATE INDEX "idx_maintenance_costs_vehicle_date" ON "freight"."maintenance_costs" ("vehicle_id", "incurred_date")`
+      );
+    }
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`DROP TABLE IF EXISTS "freight"."maintenance_costs"`);
+    await queryRunner.query(`DROP TABLE IF EXISTS "freight"."maintenance_schedules"`);
+  }
+}
diff --git a/apps/edr-freight-api/src/migrations/1860000000000-AddPaidToFirstAndLastMile.ts b/apps/edr-freight-api/src/migrations/1860000000000-AddPaidToFirstAndLastMile.ts
new file mode 100644
index 000000000..261e16099
--- /dev/null
+++ b/apps/edr-freight-api/src/migrations/1860000000000-AddPaidToFirstAndLastMile.ts
@@ -0,0 +1,34 @@
+import { MigrationInterface, QueryRunner } from "typeorm";
+
+/**
+ * Add paid column to first_mile and last_mile tables to track invoice payment status.
+ */
+export class AddPaidToFirstAndLastMile1860000000000
+  implements MigrationInterface
+{
+  name = "AddPaidToFirstAndLastMile1860000000000";
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.first_mile
+        ADD COLUMN IF NOT EXISTS paid boolean NOT NULL DEFAULT false;
+    `);
+
+    await queryRunner.query(`
+      ALTER TABLE freight.last_mile
+        ADD COLUMN IF NOT EXISTS paid boolean NOT NULL DEFAULT false;
+    `);
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+      ALTER TABLE freight.first_mile
+        DROP COLUMN IF EXISTS paid;
+    `);
+
+    await queryRunner.query(`
+      ALTER TABLE freight.last_mile
+        DROP COLUMN IF EXISTS paid;
+    `);
+  }
+}
diff --git a/apps/edr-freight-api/src/modules/billing/billing.controller.ts b/apps/edr-freight-api/src/modules/billing/billing.controller.ts
index e954b7e1b..7da5e2d66 100644
--- a/apps/edr-freight-api/src/modules/billing/billing.controller.ts
+++ b/apps/edr-freight-api/src/modules/billing/billing.controller.ts
@@ -1,5 +1,6 @@
-import { Controller, Get, Param, ParseUUIDPipe } from "@nestjs/common";
-import { ApiOperation, ApiTags } from "@nestjs/swagger";
+import { Controller, Get, Param, ParseUUIDPipe, Res } from "@nestjs/common";
+import { ApiBearerAuth, ApiOperation, ApiTags } from "@nestjs/swagger";
+import type { Response } from "express";
 
 import { FreightAdmin } from "../../common/booking-guards";
 import { BillingService } from "./billing.service";
@@ -7,6 +8,7 @@ import { BillingService } from "./billing.service";
 @ApiTags("billing")
 @Controller("billing")
 @FreightAdmin()
+@ApiBearerAuth()
 export class BillingController {
   constructor(private readonly billingService: BillingService) { }
 
@@ -21,4 +23,26 @@ export class BillingController {
   findById(@Param("id", ParseUUIDPipe) id: string) {
     return this.billingService.findById(id);
   }
+
+  @Get("invoices/:id/document")
+  @ApiOperation({ summary: "Download the sealed invoice PDF" })
+  async document(@Param("id", ParseUUIDPipe) id: string, @Res() res: Response) {
+    const { filename, buffer } = await this.billingService.document(id);
+    sendPdf(res, filename, buffer);
+  }
+
+  @Get("invoices/:id/receipt")
+  @ApiOperation({ summary: "Download the sealed payment receipt PDF" })
+  async receipt(@Param("id", ParseUUIDPipe) id: string, @Res() res: Response) {
+    const { filename, buffer } = await this.billingService.receipt(id);
+    sendPdf(res, filename, buffer);
+  }
+}
+
+/** Stream a generated PDF as a file download. */
+export function sendPdf(res: Response, filename: string, buffer: Buffer): void {
+  res.setHeader("Content-Type", "application/pdf");
+  res.setHeader("Content-Disposition", `attachment; filename="${filename}"`);
+  res.setHeader("Content-Length", buffer.length);
+  res.send(buffer);
 }
diff --git a/apps/edr-freight-api/src/modules/billing/billing.module.ts b/apps/edr-freight-api/src/modules/billing/billing.module.ts
index dc78cd6e9..771156fd3 100644
--- a/apps/edr-freight-api/src/modules/billing/billing.module.ts
+++ b/apps/edr-freight-api/src/modules/billing/billing.module.ts
@@ -3,6 +3,7 @@ import { TypeOrmModule } from "@nestjs/typeorm";
 
 import { BillingController } from "./billing.controller";
 import { PortalBillingController } from "./portal-billing.controller";
+import { PaymentController } from "./payment.controller";
 import { BillingService } from "./billing.service";
 import { DocumentsModule } from "./documents/documents.module";
 import { Invoice } from "./entities/invoice.entity";
@@ -19,7 +20,7 @@ import { CompaniesModule } from "../companies/companies.module";
     CompaniesModule,
     DocumentsModule,
   ],
-  controllers: [BillingController, PortalBillingController],
+  controllers: [BillingController, PortalBillingController, PaymentController],
   providers: [BillingService, InvoiceRepository, InvoiceLineRepository],
   exports: [BillingService],
 })
diff --git a/apps/edr-freight-api/src/modules/billing/billing.service.spec.ts b/apps/edr-freight-api/src/modules/billing/billing.service.spec.ts
index 61597264b..4df2a0eb3 100644
--- a/apps/edr-freight-api/src/modules/billing/billing.service.spec.ts
+++ b/apps/edr-freight-api/src/modules/billing/billing.service.spec.ts
@@ -116,12 +116,14 @@ describe("BillingService.generateInvoice", () => {
 });
 
 describe("BillingService.markInvoiceAsPaid", () => {
-  it("marks the invoice PAID, links the payment, and emits ${source}.invoice.paid", async () => {
+  it("marks the invoice PAID, stamps amounts/paidAt, links the payment, and emits ${source}.invoice.paid", async () => {
     const open = {
       id: "inv-1",
       status: Freight.InvoiceStatus.Pending,
       source: "booking",
       sourceId: "booking-1",
+      totalAmount: 1500,
+      paidAt: null,
     };
     const mg = {
       findOne: jest.fn().mockResolvedValue(open),
@@ -143,7 +145,22 @@ describe("BillingService.markInvoiceAsPaid", () => {
     expect(mg.update).toHaveBeenCalledWith(
       expect.anything(),
       { id: "inv-1" },
-      { status: Freight.InvoiceStatus.Paid, paymentId: "pay-1" },
+      {
+        status: Freight.InvoiceStatus.Paid,
+        paymentId: "pay-1",
+        paidAt: expect.any(Date),
+        paidAmount: 1500,
+        balanceAmount: 0,
+        payments: [
+          {
+            amount: 1500,
+            method: "GATEWAY",
+            reference: "pay-1",
+            paidAt: expect.any(String),
+            metadata: null,
+          },
+        ],
+      },
     );
     expect(events.emit).toHaveBeenCalledWith(
       "booking.invoice.paid",
@@ -190,8 +207,14 @@ describe("BillingService.recordPayment", () => {
       update: jest.fn().mockResolvedValue(undefined),
     };
     const events = makeEvents();
+    const dataSource = {
+      manager: mg,
+      transaction: jest
+        .fn()
+        .mockImplementation((cb: (mg: unknown) => unknown) => cb(mg)),
+    };
     const service = new BillingService(
-      { manager: mg } as never,
+      dataSource as never,
       {} as never,
       {} as never,
       events as never,
@@ -257,6 +280,14 @@ describe("BillingService.recordPayment", () => {
     expect(mg.update).not.toHaveBeenCalled();
   });
 
+  it("rejects a payment that exceeds the outstanding balance", async () => {
+    const { service, mg } = serviceFor(openInvoice());
+    await expect(
+      service.recordPayment("inv-1", { amount: 1500 }),
+    ).rejects.toThrow();
+    expect(mg.update).not.toHaveBeenCalled();
+  });
+
   it("rejects payment against a cancelled invoice", async () => {
     const { service, mg } = serviceFor(
       openInvoice({ status: Freight.InvoiceStatus.Cancelled }),
@@ -265,74 +296,3 @@ describe("BillingService.recordPayment", () => {
     expect(mg.update).not.toHaveBeenCalled();
   });
 });
-
-describe("BillingService.settlePayable", () => {
-  it("settles the source's open invoice PAID and emits ${source}.invoice.paid", async () => {
-    const open = {
-      id: "inv-1",
-      status: Freight.InvoiceStatus.Pending,
-      source: Freight.InvoiceSource.Booking,
-      sourceId: "booking-1",
-    };
-    const mg = {
-      findOne: jest.fn().mockResolvedValue(open),
-      update: jest.fn().mockResolvedValue(undefined),
-    };
-    const events = makeEvents();
-    const service = new BillingService(
-      { manager: mg } as never,
-      {} as never,
-      {} as never,
-      events as never,
-      {} as never, // payment
-      {} as never, // companies
-      {} as never, // invoiceDocuments
-    );
-
-    const settled = await service.settlePayable(
-      Freight.InvoiceSource.Booking,
-      "booking-1",
-      "pay-1",
-      mg as never,
-    );
-
-    expect(settled?.status).toBe(Freight.InvoiceStatus.Paid);
-    expect(mg.update).toHaveBeenCalledWith(
-      expect.anything(),
-      { id: "inv-1" },
-      { status: Freight.InvoiceStatus.Paid, paymentId: "pay-1" },
-    );
-    expect(events.emit).toHaveBeenCalledWith(
-      "booking.invoice.paid",
-      expect.anything(),
-    );
-  });
-
-  it("is a no-op (returns null) when the source has no open invoice", async () => {
-    const mg = {
-      findOne: jest.fn().mockResolvedValue(null),
-      update: jest.fn().mockResolvedValue(undefined),
-    };
-    const events = makeEvents();
-    const service = new BillingService(
-      { manager: mg } as never,
-      {} as never,
-      {} as never,
-      events as never,
-      {} as never, // payment
-      {} as never, // companies
-      {} as never, // invoiceDocuments
-    );
-
-    const settled = await service.settlePayable(
-      Freight.InvoiceSource.Booking,
-      "booking-1",
-      "pay-1",
-      mg as never,
-    );
-
-    expect(settled).toBeNull();
-    expect(mg.update).not.toHaveBeenCalled();
-    expect(events.emit).not.toHaveBeenCalled();
-  });
-});
diff --git a/apps/edr-freight-api/src/modules/billing/billing.service.ts b/apps/edr-freight-api/src/modules/billing/billing.service.ts
index f1b58ad5e..958279002 100644
--- a/apps/edr-freight-api/src/modules/billing/billing.service.ts
+++ b/apps/edr-freight-api/src/modules/billing/billing.service.ts
@@ -49,7 +49,6 @@ const DEFAULT_DUE_DAYS = 14;
 
 /** Statuses an invoice can still be settled (paid/refunded/cancelled) from. */
 const OPEN_STATUSES: Freight.InvoiceStatus[] = [
-  Freight.InvoiceStatus.Draft,
   Freight.InvoiceStatus.Issued,
   Freight.InvoiceStatus.Pending,
   Freight.InvoiceStatus.PartiallyPaid,
@@ -151,16 +150,22 @@ export class BillingService {
   /** Sealed PDF invoice for any source, rendered by the shared document service. */
   async document(id: string): Promise<{ filename: string; buffer: Buffer }> {
     const invoice = await this.findById(id);
-    return this.invoiceDocuments.render(this.toDocumentModel(invoice, "INVOICE"));
+    return this.invoiceDocuments.render(
+      this.toDocumentModel(invoice, "INVOICE"),
+    );
   }
 
   /** Sealed PDF receipt; available once any payment has been recorded. */
   async receipt(id: string): Promise<{ filename: string; buffer: Buffer }> {
     const invoice = await this.findById(id);
     if (Number(invoice.paidAmount) <= 0) {
-      throw new BadRequestException("A receipt is available only after payment is recorded.");
+      throw new BadRequestException(
+        "A receipt is available only after payment is recorded.",
+      );
     }
-    return this.invoiceDocuments.render(this.toDocumentModel(invoice, "RECEIPT"));
+    return this.invoiceDocuments.render(
+      this.toDocumentModel(invoice, "RECEIPT"),
+    );
   }
 
   /** Map a global invoice (+ lines) onto the source-agnostic document model. */
@@ -177,7 +182,11 @@ export class BillingService {
     if (Number(invoice.taxAmount) > 0) {
       totals.push({ label: "Tax", amount: Number(invoice.taxAmount) });
     }
-    totals.push({ label: "Total", amount: Number(invoice.totalAmount), grand: true });
+    totals.push({
+      label: "Total",
+      amount: Number(invoice.totalAmount),
+      grand: true,
+    });
     totals.push({ label: "Paid", amount: Number(invoice.paidAmount) });
     totals.push({ label: "Balance", amount: Number(invoice.balanceAmount) });
 
@@ -193,8 +202,18 @@ export class BillingService {
         { label: "Type", value: invoice.type },
         { label: "Reference", value: invoice.sourceId },
         { label: "Currency", value: invoice.currency },
-        { label: "Issued", value: invoice.issuedAt ? new Date(invoice.issuedAt).toLocaleDateString("en-GB") : null },
-        { label: "Due", value: invoice.dueAt ? new Date(invoice.dueAt).toLocaleDateString("en-GB") : null },
+        {
+          label: "Issued",
+          value: invoice.issuedAt
+            ? new Date(invoice.issuedAt).toLocaleDateString("en-GB")
+            : null,
+        },
+        {
+          label: "Due",
+          value: invoice.dueAt
+            ? new Date(invoice.dueAt).toLocaleDateString("en-GB")
+            : null,
+        },
       ],
       categoryHeader: "Charge type",
       lines: invoice.lines.map((l) => ({
@@ -221,19 +240,33 @@ export class BillingService {
     }
   }
 
-  /** Every invoice billed to a company, newest first, with billing relations. */
-  findByCompany(companyId: string): Promise<Invoice[]> {
+  /**
+   * Every invoice billed to a company, newest first, with billing relations.
+   * Optionally narrow to a single source record (e.g. a booking's invoices) via
+   * `{ source, sourceId }`.
+   */
+  findByCompany(
+    companyId: string,
+    filter: { source?: string; sourceId?: string } = {},
+  ): Promise<Invoice[]> {
     return this.invoices.findAll({
-      where: { companyId },
+      where: {
+        companyId,
+        ...(filter.source ? { source: filter.source } : {}),
+        ...(filter.sourceId ? { sourceId: filter.sourceId } : {}),
+      },
       relations: { company: true, companyProfile: true },
       order: { createdAt: "DESC" },
     });
   }
 
   /** Invoices for the signed-in customer; empty when they have no company. */
-  async findForUser(userId: string): Promise<Invoice[]> {
+  async findForUser(
+    userId: string,
+    filter: { source?: string; sourceId?: string } = {},
+  ): Promise<Invoice[]> {
     const companyId = await this.resolveCompanyId(userId);
-    return companyId ? this.findByCompany(companyId) : [];
+    return companyId ? this.findByCompany(companyId, filter) : [];
   }
 
   /** Company-scoped invoice detail (+ lines); 404 when not owned by the user. */
@@ -251,27 +284,43 @@ export class BillingService {
 
   /**
    * Initiate gateway payment for one of the customer's own invoices. Verifies
-   * ownership, then charges whichever open invoice the source currently has
-   * (see {@link payInvoice}).
+   * ownership, then charges the invoice directly by ID (see {@link payInvoice}).
    */
   async payInvoiceForUser(
     id: string,
     userId: string,
     opts: PayInvoiceOptions = {},
   ): Promise<InitiateResponseDto> {
-    const invoice = await this.findByIdForUser(id, userId);
-    return this.payInvoice(
-      invoice.source as Freight.InvoiceSource,
-      invoice.sourceId,
-      opts,
-    );
+    await this.findByIdForUser(id, userId);
+    return this.payInvoice(id, opts);
+  }
+
+  /** Sealed invoice PDF for one of the customer's own invoices (ownership-checked). */
+  async documentForUser(
+    id: string,
+    userId: string,
+  ): Promise<{ filename: string; buffer: Buffer }> {
+    await this.findByIdForUser(id, userId);
+    return this.document(id);
+  }
+
+  /** Sealed receipt PDF for one of the customer's own invoices (ownership-checked). */
+  async receiptForUser(
+    id: string,
+    userId: string,
+  ): Promise<{ filename: string; buffer: Buffer }> {
+    await this.findByIdForUser(id, userId);
+    return this.receipt(id);
   }
 
   // ── Generation ───────────────────────────────────────────────────────────────
 
   /** `<CODE>-YYYYMMDD-00001` — sequential per day & prefix, within the active transaction. */
   private nextInvoiceNumber(mg: EntityManager): Promise<string> {
-    return nextDailyInvoiceNumber(mg, { table: "freight.invoices", code:"INV" });
+    return nextDailyInvoiceNumber(mg, {
+      table: "freight.invoices",
+      code: "INV",
+    });
   }
 
   /**
@@ -289,6 +338,7 @@ export class BillingService {
     input: GenerateInvoiceInput,
     manager?: EntityManager,
   ): Promise<Invoice & { lines: InvoiceLine[] }> {
+    console.log("oooooooooo", input);
     const run = (mg: EntityManager) => this.createInvoice(input, mg);
     return manager ? run(manager) : this.dataSource.transaction(run);
   }
@@ -319,8 +369,7 @@ export class BillingService {
       input.subtotalAmount ??
       lines.reduce((sum, l) => sum + Number(l.amount), 0);
     const taxAmount = input.taxAmount ?? 0;
-    const totalAmount =
-      input.totalAmount ?? round2(subtotalAmount + taxAmount);
+    const totalAmount = input.totalAmount ?? round2(subtotalAmount + taxAmount);
 
     const dueAt =
       input.dueAt ??
@@ -368,23 +417,89 @@ export class BillingService {
   // ── State transitions ────────────────────────────────────────────────────────
 
   /**
-   * Mark an invoice paid and link the gateway payment, then emit
-   * `${source}.invoice.paid`. Full-payment only — no partial settlement.
-   * No-op when the invoice is already paid. Pass `manager` to enlist in a
-   * caller's transaction.
+   * Run `fn` inside a transaction and only emit its returned domain event
+   * after commit. When the caller passes their own `manager`, they own commit
+   * timing — `fn`'s event fires inline as soon as it resolves (the outer
+   * transaction may still roll back afterwards; this is the caller's
+   * documented tradeoff). When no `manager` is given, this opens its own
+   * transaction and defers the emit until after that transaction commits, so
+   * listeners (e.g. booking advancement) can never observe an invoice change
+   * that then rolls back.
+   */
+  private async runTransition<T>(
+    manager: EntityManager | undefined,
+    fn: (mg: EntityManager) => Promise<{ result: T; emit?: () => void }>,
+  ): Promise<T> {
+    if (manager) {
+      const { result, emit } = await fn(manager);
+      emit?.();
+      return result;
+    }
+    let pending: (() => void) | undefined;
+    const result = await this.dataSource.transaction(async (mg) => {
+      const out = await fn(mg);
+      pending = out.emit;
+      return out.result;
+    });
+    pending?.();
+    return result;
+  }
+
+  /**
+   * Mark an invoice paid, stamp the paid timestamp, sync paid/balance amounts,
+   * append the settlement to the `payments` ledger, link the gateway payment,
+   * then emit `${source}.invoice.paid`. Full-payment only — no partial
+   * settlement. No-op when the invoice is already paid. Pass `manager` to
+   * enlist in a caller's transaction; otherwise locks the row for update and
+   * emits only after commit (see {@link runTransition}).
    */
   async markInvoiceAsPaid(
     invoiceId: string,
     paymentId: string | null = null,
     manager?: EntityManager,
+    settlement: { providerTxnId?: string; paidAt?: Date } = {},
   ): Promise<Invoice | null> {
-    return this.transition(
-      invoiceId,
-      Freight.InvoiceStatus.Paid,
-      "paid",
-      { paymentId: paymentId ?? undefined },
-      manager,
-    );
+    return this.runTransition(manager, async (mg) => {
+      const invoice = await mg.findOne(Invoice, {
+        where: { id: invoiceId },
+        lock: { mode: "pessimistic_write" },
+      });
+      if (!invoice) {
+        throw new NotFoundException(`Invoice ${invoiceId} not found`);
+      }
+      if (invoice.status === Freight.InvoiceStatus.Paid) {
+        return { result: invoice };
+      }
+
+      const paidAt = invoice.paidAt ?? settlement.paidAt ?? new Date();
+      const settledAmount = round2(
+        Number(invoice.totalAmount) - Number(invoice.paidAmount ?? 0),
+      );
+      const entry: InvoicePayment = {
+        amount: settledAmount,
+        method: "GATEWAY",
+        reference: settlement.providerTxnId ?? paymentId ?? null,
+        paidAt: paidAt.toISOString(),
+        metadata: null,
+      };
+      const payments = [...(invoice.payments ?? []), entry];
+
+      const patch = {
+        status: Freight.InvoiceStatus.Paid,
+        paymentId,
+        paidAt,
+        paidAmount: invoice.totalAmount,
+        balanceAmount: 0,
+        payments,
+      };
+      await mg.update(Invoice, { id: invoiceId }, patch as never);
+
+      const updated = { ...invoice, ...patch } as Invoice;
+      return {
+        result: updated,
+        emit: () => this.emitInvoiceEvent("paid", updated),
+      };
+    });
   }
 
   /**
@@ -396,9 +511,11 @@ export class BillingService {
    * at the warehouse counter); gateway settlement goes through
    * {@link markInvoiceAsPaid}.
    *
-   * Throws when the invoice is missing, cancelled, refunded, already fully paid,
-   * or when `amount` is not positive. Pass `manager` to enlist in a caller's
-   * transaction.
+   * Throws when the invoice is missing, cancelled, refunded, already fully
+   * paid, `amount` is not positive, or `amount` exceeds the outstanding
+   * balance. Pass `manager` to enlist in a caller's transaction; otherwise
+   * locks the row for update and emits only after commit (see
+   * {@link runTransition}).
    */
   async recordPayment(
     invoiceId: string,
@@ -406,69 +523,76 @@ export class BillingService {
     manager?: EntityManager,
   ): Promise<Invoice> {
     if (!(input.amount > 0)) {
-      throw new BadRequestException("Payment amount must be greater than zero.");
+      throw new BadRequestException(
+        "Payment amount must be greater than zero.",
+      );
     }
 
-    const mg = manager ?? this.dataSource.manager;
-    const invoice = await mg.findOne(Invoice, { where: { id: invoiceId } });
-    if (!invoice) throw new NotFoundException(`Invoice ${invoiceId} not found`);
-    if (invoice.status === Freight.InvoiceStatus.Cancelled) {
-      throw new BadRequestException("Cannot pay a cancelled invoice.");
-    }
-    if (invoice.status === Freight.InvoiceStatus.Refunded) {
-      throw new BadRequestException("Cannot pay a refunded invoice.");
-    }
-    if (invoice.status === Freight.InvoiceStatus.Paid) {
-      throw new BadRequestException("Invoice is already fully paid.");
-    }
+    return this.runTransition(manager, async (mg) => {
+      const invoice = await mg.findOne(Invoice, {
+        where: { id: invoiceId },
+        lock: { mode: "pessimistic_write" },
+      });
+      if (!invoice) {
+        throw new NotFoundException(`Invoice ${invoiceId} not found`);
+      }
+      if (invoice.status === Freight.InvoiceStatus.Cancelled) {
+        throw new BadRequestException("Cannot pay a cancelled invoice.");
+      }
+      if (invoice.status === Freight.InvoiceStatus.Refunded) {
+        throw new BadRequestException("Cannot pay a refunded invoice.");
+      }
+      if (invoice.status === Freight.InvoiceStatus.Paid) {
+        throw new BadRequestException("Invoice is already fully paid.");
+      }
+      if (round2(input.amount) > Number(invoice.balanceAmount)) {
+        throw new BadRequestException(
+          `Payment of ${round2(input.amount)} exceeds the outstanding balance of ${Number(invoice.balanceAmount)}.`,
+        );
+      }
 
-    const at = input.paidAt ?? new Date();
-    const { paidAmount, balanceAmount, fullyPaid } = applySettlement(
-      invoice.totalAmount,
-      invoice.paidAmount,
-      input.amount,
-    );
-    const status = fullyPaid
-      ? Freight.InvoiceStatus.Paid
-      : Freight.InvoiceStatus.PartiallyPaid;
+      const at = input.paidAt ?? new Date();
+      const { paidAmount, balanceAmount, fullyPaid } = applySettlement(
+        invoice.totalAmount,
+        invoice.paidAmount,
+        input.amount,
+      );
+      const status = fullyPaid
+        ? Freight.InvoiceStatus.Paid
+        : Freight.InvoiceStatus.PartiallyPaid;
 
-    const entry: InvoicePayment = {
-      amount: round2(input.amount),
-      method: input.method ?? null,
-      reference: input.reference ?? null,
-      paidAt: at.toISOString(),
-      metadata: input.metadata ?? null,
-    };
-    const payments = [...(invoice.payments ?? []), entry];
+      const entry: InvoicePayment = {
+        amount: round2(input.amount),
+        method: input.method ?? null,
+        reference: input.reference ?? null,
+        paidAt: at.toISOString(),
+        metadata: input.metadata ?? null,
+      };
+      const payments = [...(invoice.payments ?? []), entry];
 
-    await mg.update(
-      Invoice,
-      { id: invoice.id },
-      {
+      const patch = {
         paidAmount,
         balanceAmount,
         status,
         payments,
-        paidAt: fullyPaid ? at : invoice.paidAt ?? null,
-      } as never,
-    );
+        paidAt: fullyPaid ? at : (invoice.paidAt ?? null),
+      };
+      await mg.update(Invoice, { id: invoice.id }, patch as never);
 
-    const updated = {
-      ...invoice,
-      paidAmount,
-      balanceAmount,
-      status,
-      payments,
-      paidAt: fullyPaid ? at : invoice.paidAt ?? null,
-    } as Invoice;
-
-    if (fullyPaid) this.emitInvoiceEvent("paid", updated);
-    return updated;
+      const updated = { ...invoice, ...patch } as Invoice;
+      return {
+        result: updated,
+        emit: fullyPaid
+          ? () => this.emitInvoiceEvent("paid", updated)
+          : undefined,
+      };
+    });
   }
 
   /**
    * Mark an invoice refunded and emit `${source}.invoice.refunded`.
-   * No-op when already refunded.
+   * No-op when already refunded. Throws when the invoice has no recorded
+   * payment (nothing to refund).
    */
   async markInvoiceAsRefunded(
     invoiceId: string,
@@ -480,12 +604,20 @@ export class BillingService {
       "refunded",
       {},
       manager,
+      (invoice) => {
+        if (!(Number(invoice.paidAmount) > 0)) {
+          throw new BadRequestException(
+            "Cannot refund an invoice with no recorded payment.",
+          );
+        }
+      },
     );
   }
 
   /**
    * Mark an invoice cancelled and emit `${source}.invoice.cancelled`.
-   * No-op when already cancelled.
+   * No-op when already cancelled. Throws when the invoice has payments
+   * recorded against it (refund it instead).
    */
   async cancelInvoice(
     invoiceId: string,
@@ -497,16 +629,23 @@ export class BillingService {
       "cancelled",
       {},
       manager,
+      (invoice) => {
+        if (Number(invoice.paidAmount) > 0) {
+          throw new BadRequestException(
+            "Cannot cancel an invoice that has payments recorded against it.",
+          );
+        }
+      },
     );
   }
 
   /**
    * Load the invoice, apply the new status (+ extra columns), then emit
-   * `${source}.invoice.<event>`. No-op (returns the invoice) when it is already
-   * in the target status. Throws when the invoice does not exist.
-   *
-   * Note: the event fires in-process synchronously. When a `manager` from an
-   * outer transaction is passed, listeners run before that transaction commits.
+   * `${source}.invoice.<event>`. No-op (returns the invoice, skipping `guard`)
+   * when it is already in the target status. Throws when the invoice does not
+   * exist or `guard` rejects the current state. Pass `manager` to enlist in a
+   * caller's transaction; otherwise locks the row for update and emits only
+   * after commit (see {@link runTransition}).
    */
   private async transition(
     invoiceId: string,
@@ -514,17 +653,27 @@ export class BillingService {
     event: string,
     extra: { paymentId?: string },
     manager?: EntityManager,
+    guard?: (invoice: Invoice) => void,
   ): Promise<Invoice | null> {
-    const mg = manager ?? this.dataSource.manager;
-    const invoice = await mg.findOne(Invoice, { where: { id: invoiceId } });
-    if (!invoice) throw new NotFoundException(`Invoice ${invoiceId} not found`);
-    if (invoice.status === status) return invoice;
+    return this.runTransition(manager, async (mg) => {
+      const invoice = await mg.findOne(Invoice, {
+        where: { id: invoiceId },
+        lock: { mode: "pessimistic_write" },
+      });
+      if (!invoice) {
+        throw new NotFoundException(`Invoice ${invoiceId} not found`);
+      }
+      if (invoice.status === status) return { result: invoice };
+      guard?.(invoice);
 
-    await mg.update(Invoice, { id: invoice.id }, { status, ...extra });
+      await mg.update(Invoice, { id: invoice.id }, { status, ...extra });
 
-    const updated = { ...invoice, ...extra, status } as Invoice;
-    this.emitInvoiceEvent(event, updated);
-    return updated;
+      const updated = { ...invoice, ...extra, status } as Invoice;
+      return {
+        result: updated,
+        emit: () => this.emitInvoiceEvent(event, updated),
+      };
+    });
   }
 
   /** Broadcast `${invoice.source}.invoice.<event>` to in-process listeners. */
@@ -548,16 +697,17 @@ export class BillingService {
   // ── Payment reconciliation (by source) ───────────────────────────────────────
 
   /**
-   * The invoice a gateway payment should settle for a source record, or null if
-   * none. This is the billing document of record for "what is owed" — callers
-   * (e.g. {@link payInvoice}) charge `invoice.totalAmount` against it rather than
-   * recomputing from the source's own total, so discounts/penalties/adjustments
-   * carried on the invoice are honored.
+   * The invoice a source record already has open, or null if it needs a new
+   * one. This is the idempotency check every `ensureInvoiceFor*` (booking,
+   * first-mile, last-mile) runs before generating — it must see DRAFT
+   * invoices too, not just issued ones, otherwise a source that already has
+   * an unissued draft gets a second, duplicate invoice minted alongside it
+   * instead of that draft being reused and then issued.
    *
    * Pass `type` to select a specific invoice when a source carries several (e.g.
    * a booking's up-front vs final charge); omit it to settle whichever single
-   * invoice is currently open. Returns the most recent matching open (unpaid,
-   * non-cancelled) invoice.
+   * invoice is currently open. Returns the most recent matching draft-or-open
+   * (unpaid, non-cancelled) invoice.
    */
   findPayable(
     source: Freight.InvoiceSource,
@@ -568,7 +718,7 @@ export class BillingService {
       where: {
         source,
         sourceId,
-        status: In(OPEN_STATUSES),
+        status: In([Freight.InvoiceStatus.Draft, ...OPEN_STATUSES]),
         ...(type ? { type } : {}),
       },
       order: { issuedAt: "DESC" },
@@ -576,74 +726,130 @@ export class BillingService {
   }
 
   /**
-   * Settle a source's currently-open invoice as paid and link the gateway
-   * payment, then emit `${source}.invoice.paid`. Resolves the open invoice then
-   * delegates to {@link markInvoiceAsPaid}. Full-payment only — no partial
-   * settlement. No-op (returns null) when the source has no open invoice.
-   *
-   * Type-blind by design: settles whichever invoice is due; any per-type reaction
-   * belongs in the `${source}.invoice.paid` handler, which reads `invoice.type`.
-   * Pass the caller's transaction `manager` to enlist in its DB transaction.
-   *
-   * NOTE: the booking flow settles via {@link payInvoice} + the `payment.succeeded`
-   * event ({@link settleByPaymentId}); this source-keyed settle is a generic helper
-   * for callers that settle by source rather than by gateway intent id.
+   * Pass `type` to select a specific invoice when a source carries several (e.g.
+   * a booking's up-front vs final charge); omit it to settle whichever single
+   * invoice is currently open. Returns the most recent matching open (unpaid,
+   * non-cancelled) invoice.
    */
-  async settlePayable(
+  findInvoice(
     source: Freight.InvoiceSource,
     sourceId: string,
-    paymentId: string | null,
-    manager?: EntityManager,
+    type?: string,
   ): Promise<Invoice | null> {
-    const mg = manager ?? this.dataSource.manager;
-    const invoice = await mg.findOne(Invoice, {
-      where: { source, sourceId, status: In(OPEN_STATUSES) },
+    return this.dataSource.getRepository(Invoice).findOne({
+      where: {
+        source,
+        sourceId,
+        ...(type ? { type } : {}),
+      },
       order: { issuedAt: "DESC" },
     });
-    if (!invoice) return null;
-
-    return this.markInvoiceAsPaid(invoice.id, paymentId, mg);
   }
 
   /**
-   * Refund a source's paid invoice, then emit `${source}.invoice.refunded`.
-   * Resolves the paid invoice then delegates to {@link markInvoiceAsRefunded}.
-   * No-op (returns null) when the source has no paid invoice.
+   * Expire a source's currently-open invoice (its pay window closed before
+   * settlement), then emit `${source}.invoice.expired`. Resolves the open invoice
+   * and transitions it to EXPIRED — a terminal, non-payable status (kept out of
+   * `OPEN_STATUSES`). No-op (returns null) when the source has no open invoice
+   * (already paid/cancelled/expired).
    *
-   * Pass the caller's transaction `manager` (e.g. from `payment.service.refund`)
-   * to enlist in its DB transaction.
+   * Pass the caller's transaction `manager` (e.g. the booking pay-window expiry in
+   * the batch engine) to enlist in its DB transaction.
    */
-  async refundPayable(
+  async expirePayable(
     source: Freight.InvoiceSource,
     sourceId: string,
+    type?: string,
     manager?: EntityManager,
   ): Promise<Invoice | null> {
     const mg = manager ?? this.dataSource.manager;
     const invoice = await mg.findOne(Invoice, {
-      where: { source, sourceId, status: Freight.InvoiceStatus.Paid },
+      where: {
+        source,
+        sourceId,
+        status: In(OPEN_STATUSES),
+        ...(type ? { type } : {}),
+      },
       order: { issuedAt: "DESC" },
     });
     if (!invoice) return null;
 
-    return this.markInvoiceAsRefunded(invoice.id, mg);
+    return this.transition(
+      invoice.id,
+      Freight.InvoiceStatus.Expired,
+      "expired",
+      {},
+      mg,
+    );
+  }
+
+  /**
+   * Sync a source's open invoice `dueAt` to its real pay-window deadline. The
+   * booking invoice is generated before the pay window opens (at booking
+   * creation/approval), so its printed due date is refreshed when the batch engine
+   * sets `paymentDeadline`. No-op when the source has no open invoice.
+   */
+  async syncPayableDueDate(
+    source: Freight.InvoiceSource,
+    sourceId: string,
+    dueAt: Date,
+    type?: string,
+    manager?: EntityManager,
+  ): Promise<void> {
+    const mg = manager ?? this.dataSource.manager;
+    const invoice = await mg.findOne(Invoice, {
+      where: {
+        source,
+        sourceId,
+        status: In(OPEN_STATUSES),
+        ...(type ? { type } : {}),
+      },
+      order: { issuedAt: "DESC" },
+    });
+    if (!invoice) return;
+    await mg.update(Invoice, { id: invoice.id }, { dueAt });
+  }
+
+  /**
+   * Force an invoice to `status`, including issuing a still-DRAFT invoice
+   * (stamping `issuedAt`) — unlike the other transitions here, this is a
+   * blunt admin/workflow override, not a settlement. No-op when the invoice
+   * is missing or already terminal (paid/cancelled/refunded/expired).
+   */
+  async updateStatus(
+    invoiceId: string,
+    status: Freight.InvoiceStatus,
+    manager?: EntityManager,
+  ): Promise<void> {
+    const mg = manager ?? this.dataSource.manager;
+    const invoice = await mg.findOne(Invoice, {
+      where: { id: invoiceId, status: In([Freight.InvoiceStatus.Draft, ...OPEN_STATUSES]) },
+    });
+    if (!invoice) return;
+    await mg.update(
+      Invoice,
+      { id: invoice.id },
+      { status, issuedAt: invoice.issuedAt ?? new Date() },
+    );
   }
 
   // ── Payment initiation & settlement (the gateway boundary) ───────────────────
 
   /**
-   * Charge a source's open invoice through the payment gateway. Billing is the
-   * single place that turns "what is owed" (the invoice) into a payment intent —
-   * the domain never talks to the payment service directly. Resolves the open
-   * invoice, opens an intent for `invoice.totalAmount`, records the intent id on
-   * the invoice (the settlement correlation key), and returns the client action.
+   * Charge an invoice through the payment gateway. Billing is the single place
+   * that turns "what is owed" (the invoice) into a payment intent — the domain
+   * never talks to the payment service directly. Resolves the invoice by ID,
+   * opens an intent for `invoice.balanceAmount` (so partial payments are honored),
+   * records the intent id on the invoice (the settlement correlation key), and
+   * returns the client action.
    *
    * When the provider settles synchronously, the invoice is settled inline here —
    * after the intent id is stored — so the `payment.succeeded` correlation can
-   * never fire before the link exists. Throws when the source has no open invoice.
+   * never fire before the link exists. Throws when the invoice is not found or
+   * not in an open/payable status.
    */
   async payInvoice(
-    source: Freight.InvoiceSource,
-    sourceId: string,
+    invoiceId: string,
     opts: {
       method?: string;
       platform?: "web" | "mobile";
@@ -652,13 +858,22 @@ export class BillingService {
       failureUrl?: string;
     } = {},
   ): Promise<InitiateResponseDto> {
-    const invoice = await this.findPayable(source, sourceId);
+    const invoice = await this.dataSource.getRepository(Invoice).findOne({
+      where: { id: invoiceId, status: In(OPEN_STATUSES) },
+    });
     if (!invoice) {
-      throw new NotFoundException(`No open invoice to charge for ${source}:${sourceId}`);
+      throw new NotFoundException(
+        `Invoice ${invoiceId} not found or not in a payable status`,
+      );
+    }
+
+    const amountDue = Number(invoice.balanceAmount ?? invoice.totalAmount);
+    if (!(amountDue > 0)) {
+      throw new BadRequestException("Invoice has no outstanding balance.");
     }
 
     const result = await this.payment.initiate({
-      referenceId: sourceId,
+      referenceId: invoice.sourceId,
       source: invoice.source,
       // Freight payments settle under the generic SHIPMENT reference — how the
       // payment service attributes them to the freight API. The payment ↔ invoice
@@ -667,7 +882,7 @@ export class BillingService {
       // service branches on a domain-specific reference type.
       referenceType: PaymentReferenceType.SHIPMENT,
       orderRef: invoice.invoiceNumber,
-      amountMinor: Math.round(Number(invoice.totalAmount)),
+      amountMinor: Math.round(Number(invoice.balanceAmount)),
       currency: invoice.currency,
       reason: `Payment for invoice ${invoice.invoiceNumber}`,
       method: opts.method ?? "TELEBIRR",
@@ -702,8 +917,8 @@ export class BillingService {
    */
   async settleByPaymentId(
     paymentId: string,
-    _providerTxnId?: string,
-    _paidAt?: Date,
+    providerTxnId?: string,
+    paidAt?: Date,
   ): Promise<Invoice | null> {
     const invoice = await this.dataSource.getRepository(Invoice).findOne({
       where: { paymentId, status: In(OPEN_STATUSES) },
@@ -711,6 +926,9 @@ export class BillingService {
     });
     if (!invoice) return null;
 
-    return this.markInvoiceAsPaid(invoice.id, paymentId);
+    return this.markInvoiceAsPaid(invoice.id, paymentId, undefined, {
+      providerTxnId,
+      paidAt,
+    });
   }
 }
diff --git a/apps/edr-freight-api/src/modules/billing/invoice-numbering.util.ts b/apps/edr-freight-api/src/modules/billing/invoice-numbering.util.ts
index d36788600..d3e6a208f 100644
--- a/apps/edr-freight-api/src/modules/billing/invoice-numbering.util.ts
+++ b/apps/edr-freight-api/src/modules/billing/invoice-numbering.util.ts
@@ -11,7 +11,7 @@
 
 /** Anything exposing TypeORM's `.query` — an `EntityManager` or `DataSource`. */
 export interface SqlRunner {
-  query(sql: string, params?: unknown[]): Promise<Array<{ seq: number | string }>>;
+  query(sql: string, params?: unknown[]): Promise<unknown>;
 }
 
 export interface InvoiceNumberOptions {
@@ -34,11 +34,18 @@ export async function nextDailyInvoiceNumber(
   const prefix = `${opts.code}-${ymd}-`;
   const column = opts.column ?? "invoice_number";
 
-  const [row] = await runner.query(
+  // Serialize concurrent allocation for this exact day+code prefix so two
+  // simultaneous transactions can't both read the same MAX(seq) and mint a
+  // duplicate number. Session-scoped to the caller's transaction — released
+  // automatically on commit/rollback. Different prefixes hash to different
+  // keys and never contend with each other.
+  await runner.query(`SELECT pg_advisory_xact_lock(hashtext($1))`, [prefix]);
+
+  const rows = (await runner.query(
     `SELECT COALESCE(MAX(CAST(split_part(${column}, '-', 3) AS int)), 0) AS seq
        FROM ${opts.table} WHERE ${column} LIKE $1`,
     [`${prefix}%`],
-  );
-  const next = Number(row?.seq ?? 0) + 1;
+  )) as Array<{ seq: number | string }>;
+  const next = Number(rows[0]?.seq ?? 0) + 1;
   return `${prefix}${String(next).padStart(5, "0")}`;
 }
diff --git a/apps/edr-freight-api/src/modules/bookings/booking-payment.controller.ts b/apps/edr-freight-api/src/modules/billing/payment.controller.ts
similarity index 83%
rename from apps/edr-freight-api/src/modules/bookings/booking-payment.controller.ts
rename to apps/edr-freight-api/src/modules/billing/payment.controller.ts
index ae01ebc36..543c84201 100644
--- a/apps/edr-freight-api/src/modules/bookings/booking-payment.controller.ts
+++ b/apps/edr-freight-api/src/modules/billing/payment.controller.ts
@@ -16,9 +16,8 @@ import {
 } from "@nestjs/swagger";
 import { Response } from "express";
 import { Public } from "@edr/api-common";
-import { Freight } from "@edr/types";
 
-import { BillingService } from "../billing/billing.service";
+import { BillingService } from "./billing.service";
 import {
     InitiatePaymentDto,
     InitiateResponseDto,
@@ -27,25 +26,24 @@ import {
 } from "../payment/payments.dto";
 
 /**
- * Booking-payment entrypoints. This is the ONE place that knows a payment is for a
- * booking — it maps the request to {@link Freight.InvoiceSource.Booking} and hands
- * off to billing, which resolves the invoice/amount and drives the gateway. Billing
- * and payment stay source-agnostic; the booking knowledge lives here, in the domain.
+ * Central payment entrypoints. Domain-agnostic — the caller supplies an
+ * invoice ID and the billing service resolves the amount and drives the
+ * gateway. The domain never talks to the payment service directly.
  * Routes are unchanged (`/payments/*`) so the portal is unaffected.
  */
 @ApiTags("Payment")
 @Controller("payments")
-export class BookingPaymentController {
+export class PaymentController {
     constructor(private readonly billing: BillingService) { }
 
     @Post("initiate")
     @ApiOperation({
-        summary: "Initiate payment for a freight booking",
-        description: "Charges the booking's open invoice through the payment gateway.",
+        summary: "Initiate payment for an invoice",
+        description: "Charges the invoice through the payment gateway.",
     })
     @ApiOkResponse({ type: InitiateResponseDto })
     initiate(@Body() dto: InitiatePaymentDto): Promise<InitiateResponseDto> {
-        return this.billing.payInvoice(Freight.InvoiceSource.Booking, dto.bookingId, {
+        return this.billing.payInvoice(dto.invoiceId, {
             method: dto.method,
             platform: dto.platform,
             payerAccount: dto.payerAccount,
@@ -59,23 +57,23 @@ export class BookingPaymentController {
     @ApiOperation({
         summary: "Browser checkout redirect",
         description:
-            "Charges the booking's invoice and returns an HTML page that auto-redirects to the provider checkout URL. Open directly in a browser tab.",
+            "Charges the invoice and returns an HTML page that auto-redirects to the provider checkout URL. Open directly in a browser tab.",
     })
-    @ApiQuery({ name: "bookingId", required: true })
+    @ApiQuery({ name: "invoiceId", required: true })
     @ApiQuery({ name: "method", enum: PaymentMethodTypeEnum, required: true })
     @ApiQuery({ name: "platform", enum: ["web", "mobile"], required: false })
     @ApiProduces("text/html")
     async checkout(
-        @Query("bookingId") bookingId: string,
+        @Query("invoiceId") invoiceId: string,
         @Query("method") method: PaymentMethodTypeEnum,
         @Query("platform") platform: PaymentPlatformDto = "web",
         @Res() res: Response,
     ) {
-        if (!bookingId) {
+        if (!invoiceId) {
             return res
                 .status(HttpStatus.BAD_REQUEST)
                 .type("html")
-                .send(this.buildErrorHtml("Missing required query parameter: bookingId"));
+                .send(this.buildErrorHtml("Missing required query parameter: invoiceId"));
         }
         if (!method || !Object.values(PaymentMethodTypeEnum).includes(method)) {
             return res
@@ -86,8 +84,7 @@ export class BookingPaymentController {
 
         try {
             const result = await this.billing.payInvoice(
-                Freight.InvoiceSource.Booking,
-                bookingId,
+                invoiceId,
                 { method, platform },
             );
             const url =
diff --git a/apps/edr-freight-api/src/modules/billing/portal-billing.controller.ts b/apps/edr-freight-api/src/modules/billing/portal-billing.controller.ts
index 5a007c320..94e917754 100644
--- a/apps/edr-freight-api/src/modules/billing/portal-billing.controller.ts
+++ b/apps/edr-freight-api/src/modules/billing/portal-billing.controller.ts
@@ -5,14 +5,18 @@ import {
   Param,
   ParseUUIDPipe,
   Post,
+  Query,
+  Res,
 } from "@nestjs/common";
 import { ApiBearerAuth, ApiOperation, ApiTags } from "@nestjs/swagger";
+import type { Response } from "express";
 import { CurrentUser } from "@edr/api-common";
 
 import {
   type AuthUserPayload,
   resolveAuthUserId,
 } from "../../common/resolve-auth-user-id";
+import { sendPdf } from "./billing.controller";
 import { BillingService } from "./billing.service";
 import { PayInvoiceDto } from "./dto/pay-invoice.dto";
 
@@ -29,8 +33,15 @@ export class PortalBillingController {
 
   @Get("my-invoices")
   @ApiOperation({ summary: "List the signed-in customer's invoices" })
-  findMine(@CurrentUser() user: AuthUserPayload) {
-    return this.billingService.findForUser(resolveAuthUserId(user));
+  findMine(
+    @CurrentUser() user: AuthUserPayload,
+    @Query("source") source?: string,
+    @Query("sourceId") sourceId?: string,
+  ) {
+    return this.billingService.findForUser(resolveAuthUserId(user), {
+      source,
+      sourceId,
+    });
   }
 
   @Get("my-invoices/:id")
@@ -42,6 +53,34 @@ export class PortalBillingController {
     return this.billingService.findByIdForUser(id, resolveAuthUserId(user));
   }
 
+  @Get("my-invoices/:id/document")
+  @ApiOperation({ summary: "Download one of the customer's invoice PDFs" })
+  async document(
+    @Param("id", ParseUUIDPipe) id: string,
+    @CurrentUser() user: AuthUserPayload,
+    @Res() res: Response,
+  ) {
+    const { filename, buffer } = await this.billingService.documentForUser(
+      id,
+      resolveAuthUserId(user),
+    );
+    sendPdf(res, filename, buffer);
+  }
+
+  @Get("my-invoices/:id/receipt")
+  @ApiOperation({ summary: "Download one of the customer's payment receipt PDFs" })
+  async receipt(
+    @Param("id", ParseUUIDPipe) id: string,
+    @CurrentUser() user: AuthUserPayload,
+    @Res() res: Response,
+  ) {
+    const { filename, buffer } = await this.billingService.receiptForUser(
+      id,
+      resolveAuthUserId(user),
+    );
+    sendPdf(res, filename, buffer);
+  }
+
   @Post("my-invoices/:id/pay")
   @ApiOperation({ summary: "Initiate payment for one of the customer's invoices" })
   pay(
diff --git a/apps/edr-freight-api/src/modules/bookings/booking-invoice.service.ts b/apps/edr-freight-api/src/modules/bookings/booking-invoice.service.ts
index 47338f196..3bfb838b4 100644
--- a/apps/edr-freight-api/src/modules/bookings/booking-invoice.service.ts
+++ b/apps/edr-freight-api/src/modules/bookings/booking-invoice.service.ts
@@ -1,20 +1,26 @@
-import { forwardRef, Inject, Injectable, Logger } from '@nestjs/common';
-import { OnEvent } from '@nestjs/event-emitter';
-import { Freight } from '@edr/types';
-import { DataSource } from 'typeorm';
+import {
+  BadRequestException,
+  forwardRef,
+  Inject,
+  Injectable,
+  Logger,
+} from "@nestjs/common";
+import { OnEvent } from "@nestjs/event-emitter";
+import { Freight } from "@edr/types";
+import { DataSource, EntityManager } from "typeorm";
 
 import {
   BillingService,
   GenerateInvoiceInput,
   InvoiceEventPayload,
   InvoiceLineInput,
-} from '../billing/billing.service';
-import { Invoice } from '../billing/entities/invoice.entity';
-import { FirstMileService } from '../first-mile/first-mile.service';
-import { BookingBatchService } from '../train-scheduling/booking-batch.service';
-import { PriceLineItemDto } from './dto/generate-price-response.dto';
-import { BookingsRepository } from './bookings.repository';
-import { Booking } from './entities/booking.entity';
+} from "../billing/billing.service";
+import { Invoice } from "../billing/entities/invoice.entity";
+import { FirstMileService } from "../first-mile/first-mile.service";
+import { BookingBatchService } from "../train-scheduling/booking-batch.service";
+import { PriceLineItemDto } from "./dto/generate-price-response.dto";
+import { BookingsRepository } from "./bookings.repository";
+import { Booking } from "./entities/booking.entity";
 
 /** Snapshot written onto `booking.pricingBreakdown` by the pricing service. */
 interface StoredPricingBreakdown {
@@ -23,6 +29,12 @@ interface StoredPricingBreakdown {
   currency?: string;
 }
 
+export interface InvoiceOptions {
+  dueDate?: Date;
+  invoiceType?: string;
+  invoiceStatus?: Freight.InvoiceStatus;
+}
+
 /** Round to 2 decimals, avoiding binary float drift. */
 const round2 = (n: number): number => Math.round(n * 100) / 100;
 
@@ -52,32 +64,28 @@ export class BookingInvoiceService {
    * Ensure the booking has its invoice, generating one from the snapshotted
    * pricing breakdown if absent. Called when a booking reaches a billable state.
    * Idempotent — returns the existing open invoice instead of a duplicate.
-   * Returns `null` (and logs) when the booking is not billable: no company to
-   * bill (e.g. government bookings whose `companyId` is null, which the invoices
-   * FK requires), or no priced amount.
+   * Throws `BadRequestException` when the booking is not billable: no company
+   * to bill (e.g. government bookings whose `companyId` is null, which the
+   * invoices FK requires), or no priced amount.
    */
-  async ensureInvoiceForBooking(booking: Booking): Promise<Invoice | null> {
+  async ensureInvoiceForBooking(
+    booking: Booking,
+    invoiceOptions: InvoiceOptions = {},
+  ): Promise<Invoice> {
     const existing = await this.billing.findPayable(
       Freight.InvoiceSource.Booking,
       booking.id,
-      Freight.InvoiceType.Prepaid,
+      "PREPAID",
     );
     if (existing) return existing;
 
     if (!booking.companyId) {
-      this.logger.warn(
-        `Skipping invoice for booking ${booking.reference} (${booking.id}): no company to bill.`,
+      throw new BadRequestException(
+        `Cannot generate invoice for booking ${booking.reference} (${booking.id}): no company to bill.`,
       );
-      return null;
     }
 
-    const input = this.buildInput(booking);
-    if (!input) {
-      this.logger.warn(
-        `Skipping invoice for booking ${booking.reference} (${booking.id}): no priced amount.`,
-      );
-      return null;
-    }
+    const input = this.buildInput(booking, invoiceOptions);
 
     return this.billing.generateInvoice(input);
   }
@@ -87,10 +95,10 @@ export class BookingInvoiceService {
    * reactions live here (not in the payment process): each invoice type advances
    * the booking its own way. Only PREPAID exists today.
    */
-  @OnEvent('booking.invoice.paid')
+  @OnEvent("booking.invoice.paid")
   async onBookingInvoicePaid(payload: InvoiceEventPayload): Promise<void> {
     switch (payload.type) {
-      case Freight.InvoiceType.Prepaid:
+      case "PREPAID":
         await this.advanceBookingOnPayment(payload.sourceId);
         break;
       default:
@@ -100,6 +108,14 @@ export class BookingInvoiceService {
     }
   }
 
+  updateStatus(
+    invoiceId: string,
+    status: Freight.InvoiceStatus,
+    manager?: EntityManager,
+  ): Promise<void> {
+    return this.billing.updateStatus(invoiceId, status, manager);
+  }
+
   /**
    * Advance a booking once its prepaid invoice settles — the domain side-effect
    * of payment, relocated out of the payment service: the booking becomes PAID
@@ -114,16 +130,18 @@ export class BookingInvoiceService {
   private async advanceBookingOnPayment(bookingId: string): Promise<void> {
     const booking = await this.bookingsRepository.findById(bookingId);
     if (!booking) {
-      this.logger.warn(`Cannot advance unknown booking ${bookingId} on payment.`);
+      this.logger.warn(
+        `Cannot advance unknown booking ${bookingId} on payment.`,
+      );
       return;
     }
-    if (booking.paymentStatus === 'PAID') return;
+    if (booking.paymentStatus === "PAID") return;
 
     await this.dataSource.transaction(async (mg) => {
       await mg.update(
         Booking,
         { id: bookingId },
-        { paymentStatus: 'PAID', status: 'PAID' },
+        { paymentStatus: "PAID", status: "PAID" },
       );
       await this.firstMile.acceptBooking(bookingId);
     });
@@ -138,9 +156,13 @@ export class BookingInvoiceService {
   }
 
   /** Map a booking's pricing snapshot into a generic invoice request. */
-  private buildInput(booking: Booking): GenerateInvoiceInput | null {
-    const breakdown = (booking.pricingBreakdown ?? {}) as StoredPricingBreakdown;
-    const currency = breakdown.currency ?? booking.paymentCurrency ?? 'ETB';
+  private buildInput(
+    booking: Booking,
+    invoiceOptions: InvoiceOptions = {},
+  ): GenerateInvoiceInput {
+    const breakdown = (booking.pricingBreakdown ??
+    {}) as StoredPricingBreakdown;
+    const currency = breakdown.currency ?? booking.paymentCurrency ?? "ETB";
 
     const lines: InvoiceLineInput[] = (breakdown.lineItems ?? []).map((l) => ({
       chargeType: l.code,
@@ -155,10 +177,14 @@ export class BookingInvoiceService {
     // Fall back to a single freight line when no breakdown was snapshotted.
     if (lines.length === 0) {
       const amount = Number(booking.totalAmount);
-      if (!Number.isFinite(amount) || amount <= 0) return null;
+      if (!Number.isFinite(amount) || amount <= 0) {
+        throw new BadRequestException(
+          `Cannot generate invoice for booking ${booking.reference} (${booking.id}): no priced amount.`,
+        );
+      }
       lines.push({
-        chargeType: 'FREIGHT',
-        description: 'Rail freight',
+        chargeType: "FREIGHT",
+        description: "Rail freight",
         quantity: 1,
         unitRate: amount,
         amount,
@@ -166,7 +192,9 @@ export class BookingInvoiceService {
       });
     }
 
-    const subtotal = round2(lines.reduce((sum, l) => sum + Number(l.amount), 0));
+    const subtotal = round2(
+      lines.reduce((sum, l) => sum + Number(l.amount), 0),
+    );
     let totalAmount = subtotal;
 
     // Honor a staff price override: bill the adjusted total, recording the delta
@@ -176,8 +204,8 @@ export class BookingInvoiceService {
       const delta = round2(Number(adjusted) - subtotal);
       if (delta !== 0) {
         lines.push({
-          chargeType: 'ADJUSTMENT',
-          description: 'Staff price adjustment',
+          chargeType: "ADJUSTMENT",
+          description: "Staff price adjustment",
           quantity: 1,
           unitRate: delta,
           amount: delta,
@@ -190,12 +218,14 @@ export class BookingInvoiceService {
     return {
       source: Freight.InvoiceSource.Booking,
       sourceId: booking.id,
-      type: Freight.InvoiceType.Prepaid,
       companyId: booking.companyId,
       companyProfileId: booking.companyProfileId,
       currency,
       lines,
       totalAmount,
+      dueAt: invoiceOptions.dueDate,
+      type: invoiceOptions.invoiceType ?? "PREPAID",
+      status: invoiceOptions.invoiceStatus ?? Freight.InvoiceStatus.Draft,
     };
   }
 }
diff --git a/apps/edr-freight-api/src/modules/bookings/booking-payment.service.ts b/apps/edr-freight-api/src/modules/bookings/booking-payment.service.ts
deleted file mode 100644
index 1fbe34e1f..000000000
--- a/apps/edr-freight-api/src/modules/bookings/booking-payment.service.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-import { Injectable, NotFoundException } from '@nestjs/common';
-import { Freight } from '@edr/types';
-import { BookingsRepository } from './bookings.repository';
-import { Booking } from './entities/booking.entity';
-import { assertBookingStatus } from './booking-status.util';
-import { InAppPaymentReceiptDto } from './dto/pay-booking.dto';
-import { BillingService } from '../billing/billing.service';
-import { PaymentMethodTypeEnum } from '../payment/payments.dto';
-export interface InAppPaymentReceipt extends InAppPaymentReceiptDto { }
-
-@Injectable()
-export class BookingPaymentService {
-  constructor(
-    private readonly bookingsRepository: BookingsRepository,
-    private readonly billing: BillingService,
-  ) { }
-
-  /**
-   * Start payment for a booking. The booking never touches the payment gateway
-   * directly — it charges its invoice through billing, which resolves the amount
-   * and drives the provider. Returns the provider redirect URL (empty when none).
-   */
-  async pay(bookingId: string): Promise<{ redirectUrl: string }> {
-    const booking = await this.requireBooking(bookingId);
-    assertBookingStatus(booking, ['FULLY_EXECUTED', 'SELECTED_FOR_BATCH', 'AWAITING_PAYMENT', '']);
-
-    const resp = await this.billing.payInvoice(Freight.InvoiceSource.Booking, bookingId, {
-      method: PaymentMethodTypeEnum.TELEBIRR,
-      platform: 'web',
-    });
-
-    const action = resp.clientAction as { type?: string; url?: string } | undefined;
-    return {
-      redirectUrl: action?.type === 'REDIRECT' ? (action.url ?? '') : '',
-    };
-  }
-
-  private async requireBooking(id: string): Promise<Booking> {
-    const booking = await this.bookingsRepository.findById(id);
-    if (!booking) throw new NotFoundException(`Booking ${id} not found`);
-    return booking;
-  }
-}
diff --git a/apps/edr-freight-api/src/modules/bookings/booking-reference-data.service.ts b/apps/edr-freight-api/src/modules/bookings/booking-reference-data.service.ts
index e15fcba0d..6e96dc6f8 100644
--- a/apps/edr-freight-api/src/modules/bookings/booking-reference-data.service.ts
+++ b/apps/edr-freight-api/src/modules/bookings/booking-reference-data.service.ts
@@ -58,7 +58,6 @@ export function buildCargoTypeTree(
           id: child.id,
           name: child.cargoTypeName,
           code: child.code,
-          show_free_text_box: child.showFreeTextBox,
           unit_of_measure: child.unitOfMeasure ?? null,
         }),
       );
diff --git a/apps/edr-freight-api/src/modules/bookings/booking-transition.accept.spec.ts b/apps/edr-freight-api/src/modules/bookings/booking-transition.accept.spec.ts
index a9806f1f7..f9b160672 100644
--- a/apps/edr-freight-api/src/modules/bookings/booking-transition.accept.spec.ts
+++ b/apps/edr-freight-api/src/modules/bookings/booking-transition.accept.spec.ts
@@ -35,6 +35,8 @@ describe('BookingTransitionService — acceptIntake validity window', () => {
       {} as never, // fileUploadSettingsService
       {} as never, // bookingBatchService
       bookingsService as never,
+      { isPhasedGeneralCustomsBooking: () => false } as never,
+      {} as never,
     );
     return { service, bookingsRepository, ruleEngineService };
   }
diff --git a/apps/edr-freight-api/src/modules/bookings/booking-transition.clearance.spec.ts b/apps/edr-freight-api/src/modules/bookings/booking-transition.clearance.spec.ts
index ff08784a6..d62883d53 100644
--- a/apps/edr-freight-api/src/modules/bookings/booking-transition.clearance.spec.ts
+++ b/apps/edr-freight-api/src/modules/bookings/booking-transition.clearance.spec.ts
@@ -46,6 +46,8 @@ describe('BookingTransitionService — finalizeClearance gate', () => {
       fileUploadSettingsService as never,
       {} as never, // bookingBatchService
       bookingsService as never,
+      { isPhasedGeneralCustomsBooking: () => false } as never,
+      {} as never,
     );
     return { service, bookingsRepository };
   }
@@ -128,6 +130,8 @@ describe('BookingTransitionService — finalizeClearance customs output gate', (
       fileUploadSettingsService as never,
       {} as never,
       bookingsService as never,
+      { isPhasedGeneralCustomsBooking: () => false } as never,
+      {} as never,
     );
     return { service, bookingsRepository };
   }
@@ -196,6 +200,8 @@ describe('BookingTransitionService — submitClearanceDocuments required-fields
       fileUploadSettingsService as never,
       {} as never,
       bookingsService as never,
+      { isPhasedGeneralCustomsBooking: () => false } as never,
+      {} as never,
     );
     return { service, bookingsRepository, filesService };
   }
diff --git a/apps/edr-freight-api/src/modules/bookings/booking-transition.operation.spec.ts b/apps/edr-freight-api/src/modules/bookings/booking-transition.operation.spec.ts
index cc2288963..66df02ac4 100644
--- a/apps/edr-freight-api/src/modules/bookings/booking-transition.operation.spec.ts
+++ b/apps/edr-freight-api/src/modules/bookings/booking-transition.operation.spec.ts
@@ -38,6 +38,8 @@ describe('BookingTransitionService — operation review', () => {
       {} as never, // fileUploadSettingsService
       bookingBatchService as never,
       bookingsService as never,
+      { isPhasedGeneralCustomsBooking: () => false } as never,
+      {} as never,
     );
     return { service, bookingsRepository, bookingBatchService };
   }
diff --git a/apps/edr-freight-api/src/modules/bookings/booking-transition.service.ts b/apps/edr-freight-api/src/modules/bookings/booking-transition.service.ts
index 2ebceeabc..898f78cd5 100644
--- a/apps/edr-freight-api/src/modules/bookings/booking-transition.service.ts
+++ b/apps/edr-freight-api/src/modules/bookings/booking-transition.service.ts
@@ -4,8 +4,8 @@ import {
   Inject,
   Injectable,
   Logger,
-} from '@nestjs/common';
-import type { TCurrentUser } from '@tria-plc/api-common/modules/auth/types/current-user.type';
+} from "@nestjs/common";
+import type { TCurrentUser } from "@tria-plc/api-common/modules/auth/types/current-user.type";
 
 import { assertCanApproveBookingStep } from '../../common/freight-permission.util';
 import { BookingBatchService } from '../train-scheduling/booking-batch.service';
@@ -15,7 +15,6 @@ import { RuleEngineService } from '../rule-engine/rule-engine.service';
 import { FilesService } from '../files/files.service';
 import { FileUploadSettingsService } from '../file-upload-settings/file-upload-settings.service';
 import { BookingContractService } from './booking-contract.service';
-import { BookingInvoiceService } from './booking-invoice.service';
 import { BookingPricingService } from './booking-pricing.service';
 import { BookingsRepository } from './bookings.repository';
 import { assertBookingStatus } from './booking-status.util';
@@ -25,32 +24,47 @@ import { SubmitBookingResponseDto } from './dto/submit-booking-response.dto';
 import { PriceLineItemDto } from './dto/generate-price-response.dto';
 import { Booking } from './entities/booking.entity';
 import { BookingsService } from './bookings.service';
+import { BookingClearanceService } from '../contracts/booking-clearance.service';
+import { ClearanceWorkflowService } from '../contracts/clearance-workflow.service';
+import { ContractDocPhase } from '@edr/types';
+
+
+import { Freight } from "@edr/types";
+import { BookingInvoiceService } from "./booking-invoice.service";
 
 @Injectable()
 export class BookingTransitionService {
   private readonly logger = new Logger(BookingTransitionService.name);
-
   constructor(
     private readonly bookingsRepository: BookingsRepository,
     private readonly ruleEngineService: RuleEngineService,
     private readonly pricingService: BookingPricingService,
     private readonly contractService: BookingContractService,
-    private readonly invoiceService: BookingInvoiceService,
     private readonly filesService: FilesService,
     private readonly fileUploadSettingsService: FileUploadSettingsService,
     @Inject(forwardRef(() => BookingBatchService))
     private readonly bookingBatchService: BookingBatchService,
     @Inject(forwardRef(() => BookingsService))
     private readonly bookingsService: BookingsService,
+    @Inject(forwardRef(() => BookingClearanceService))
+    private readonly bookingClearanceService: BookingClearanceService,
+    @Inject(forwardRef(() => ClearanceWorkflowService))
+    private readonly workflowService: ClearanceWorkflowService,
+        private readonly invoiceService: BookingInvoiceService,
+
   ) {}
 
+  private isPhasedGeneralCustoms(booking: Booking): boolean {
+    return this.bookingClearanceService.isPhasedGeneralCustomsBooking(booking);
+  }
+
   async submit(bookingId: string): Promise<SubmitBookingResponseDto> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['DRAFT', 'CHANGES_REQUESTED']);
+    assertBookingStatus(booking, ["DRAFT", "CHANGES_REQUESTED"]);
 
     if (Number(booking.totalAmount) <= 0) {
       throw new BadRequestException(
-        'Generate a price before submitting (POST /bookings/:id/generate-price)',
+        "Generate a price before submitting (POST /bookings/:id/generate-price)",
       );
     }
 
@@ -69,7 +83,8 @@ export class BookingTransitionService {
       totalAmount?: number;
     } | null;
     const unchanged = this.pricingService.pricesMatch(stored, computed);
-    const priorityScore = await this.pricingService.computeSubmitPriorityScore(booking);
+    const priorityScore =
+      await this.pricingService.computeSubmitPriorityScore(booking);
 
     if (unchanged) {
       await this.pricingService.createPricingSnapshots(
@@ -79,7 +94,7 @@ export class BookingTransitionService {
       );
 
       const updated = await this.bookingsRepository.update(bookingId, {
-        status: 'SUBMITTED',
+        status: "SUBMITTED",
         priorityScore,
       } as never);
 
@@ -109,7 +124,7 @@ export class BookingTransitionService {
         currency: computed.currency,
         generatedAt: new Date().toISOString(),
       },
-      status: 'PRICE_CHANGED_PENDING_CONFIRM',
+      status: "PRICE_CHANGED_PENDING_CONFIRM",
     } as never);
 
     const updatedBooking = await this.bookingsService.findById(bookingId);
@@ -121,16 +136,17 @@ export class BookingTransitionService {
       totalAmount: computed.totalAmount,
       currency: computed.currency,
       lineItems: computed.lineItems,
-      message: 'Price has changed since preview. Confirm to submit with the updated price.',
+      message:
+        "Price has changed since preview. Confirm to submit with the updated price.",
     };
   }
 
   async confirmSubmit(bookingId: string): Promise<SubmitBookingResponseDto> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['PRICE_CHANGED_PENDING_CONFIRM']);
+    assertBookingStatus(booking, ["PRICE_CHANGED_PENDING_CONFIRM"]);
 
     if (Number(booking.totalAmount) <= 0) {
-      throw new BadRequestException('No price to confirm');
+      throw new BadRequestException("No price to confirm");
     }
 
     const computed = await this.pricingService.computePriceForBooking(booking);
@@ -149,9 +165,10 @@ export class BookingTransitionService {
       computed.appliedModifiers,
     );
 
-    const priorityScore = await this.pricingService.computeSubmitPriorityScore(booking);
+    const priorityScore =
+      await this.pricingService.computeSubmitPriorityScore(booking);
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'SUBMITTED',
+      status: "SUBMITTED",
       priorityScore,
       totalAmount: computed.totalAmount,
       pricingBreakdown: {
@@ -173,7 +190,7 @@ export class BookingTransitionService {
       totalAmount: Number(finalBooking.totalAmount),
       currency: finalBooking.paymentCurrency,
       lineItems: computed.lineItems,
-      message: 'Booking submitted with confirmed price.',
+      message: "Booking submitted with confirmed price.",
     };
   }
 
@@ -183,17 +200,17 @@ export class BookingTransitionService {
     actorId: string,
   ): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['SUBMITTED']);
+    assertBookingStatus(booking, ["SUBMITTED"]);
 
     await this.bookingsRepository.createReviewNote(
       bookingId,
       note,
-      'CHANGES_REQUESTED',
+      "CHANGES_REQUESTED",
       actorId,
     );
 
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'CHANGES_REQUESTED',
+      status: "CHANGES_REQUESTED",
     } as never);
     return this.bookingsService.findById(updated!.id);
   }
@@ -203,7 +220,7 @@ export class BookingTransitionService {
     if ((booking.approvalSteps?.length ?? 0) > 0) return;
 
     await this.ruleEngineService.instantiateApprovalSteps(booking.id, {
-      freightType: booking.freightType as 'CONTAINER' | 'BULK',
+      freightType: booking.freightType as "CONTAINER" | "BULK",
       cargoTypeId: booking.cargoTypeId,
     });
   }
@@ -217,14 +234,14 @@ export class BookingTransitionService {
     // Only SUBMITTED bookings are acceptable. A booking that still needs
     // consolidation sits in PENDING_CONSOLIDATION (resolved at submit time) and
     // is therefore never offered for accept until a partner moves it to SUBMITTED.
-    assertBookingStatus(booking, ['SUBMITTED']);
+    assertBookingStatus(booking, ["SUBMITTED"]);
 
     // The backoffice must define how long the accepted contract stays valid.
     // Without a window the contract has no end date and cannot be relied on, so
     // accept is blocked until a positive number of days is supplied.
     if (!Number.isInteger(validityDays) || validityDays < 1) {
       throw new BadRequestException(
-        'A contract validity (in days) is required to accept this booking.',
+        "A contract validity (in days) is required to accept this booking.",
       );
     }
 
@@ -234,12 +251,12 @@ export class BookingTransitionService {
     validUntil.setDate(validUntil.getDate() + validityDays);
 
     await this.ruleEngineService.instantiateApprovalSteps(bookingId, {
-      freightType: booking.freightType as 'CONTAINER' | 'BULK',
+      freightType: booking.freightType as "CONTAINER" | "BULK",
       cargoTypeId: booking.cargoTypeId,
     });
 
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'PENDING_APPROVAL',
+      status: "PENDING_APPROVAL",
       approvedByStaffId: actorId,
       approvedByStaffAt: validFrom,
       contractValidityDays: validityDays,
@@ -255,17 +272,17 @@ export class BookingTransitionService {
     actorId: string,
   ): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['SUBMITTED', 'PENDING_APPROVAL']);
+    assertBookingStatus(booking, ["SUBMITTED", "PENDING_APPROVAL"]);
 
     await this.bookingsRepository.createReviewNote(
       bookingId,
       reason,
-      'REJECTION',
+      "REJECTION",
       actorId,
     );
 
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'REJECTED',
+      status: "REJECTED",
     } as never);
     return this.bookingsService.findById(updated!.id);
   }
@@ -283,8 +300,8 @@ export class BookingTransitionService {
 
     let booking = await this.bookingsService.findById(bookingId);
     assertBookingStatus(booking, [
-      'PENDING_APPROVAL',
-      'APPROVED_PENDING_SIGNATURE',
+      "PENDING_APPROVAL",
+      "APPROVED_PENDING_SIGNATURE",
     ]);
 
     if ((booking.approvalSteps?.length ?? 0) === 0) {
@@ -296,14 +313,17 @@ export class BookingTransitionService {
       bookingId,
       stepId,
     );
-    if (!step || step.status !== 'PENDING') {
-      throw new BadRequestException('Approval step not found or already actioned');
+    if (!step || step.status !== "PENDING") {
+      throw new BadRequestException(
+        "Approval step not found or already actioned",
+      );
     }
 
-    const next = await this.bookingsRepository.findNextPendingApprovalStep(bookingId);
+    const next =
+      await this.bookingsRepository.findNextPendingApprovalStep(bookingId);
     if (!next || next.id !== step.id) {
       throw new BadRequestException(
-        'Approval steps must be completed in order',
+        "Approval steps must be completed in order",
       );
     }
 
@@ -315,29 +335,36 @@ export class BookingTransitionService {
 
     const blocksRole = step.blocksRole;
     if (blocksRole && blocksRole === requiredRole) {
-      throw new BadRequestException(`Role ${requiredRole} is blocked for this step`);
+      throw new BadRequestException(
+        `Role ${requiredRole} is blocked for this step`,
+      );
     }
 
-    await this.bookingsRepository.completeApprovalStep(step.id, actorId, 'APPROVED');
+    await this.bookingsRepository.completeApprovalStep(
+      step.id,
+      actorId,
+      "APPROVED",
+    );
 
     const updates: Record<string, unknown> = {};
     const now = new Date();
 
-    if (requiredRole === 'LINE_STAFF') {
-      updates.status = 'APPROVED_PENDING_SIGNATURE';
+    if (requiredRole === "LINE_STAFF") {
+      updates.status = "APPROVED_PENDING_SIGNATURE";
       updates.approvedByStaffId = actorId;
       updates.approvedByStaffAt = now;
-    } else if (requiredRole === 'DIRECTOR') {
+    } else if (requiredRole === "DIRECTOR") {
       updates.signedByDirectorId = actorId;
       updates.signedByDirectorAt = now;
-    } else if (requiredRole === 'CEO') {
+    } else if (requiredRole === "CEO") {
       updates.signedByCeoId = actorId;
       updates.signedByCeoAt = now;
     }
 
-    const allDone = await this.bookingsRepository.allApprovalStepsComplete(bookingId);
+    const allDone =
+      await this.bookingsRepository.allApprovalStepsComplete(bookingId);
     if (allDone) {
-      updates.status = 'APPROVED';
+      updates.status = "APPROVED";
     }
 
     if (Object.keys(updates).length > 0) {
@@ -359,90 +386,64 @@ export class BookingTransitionService {
     reason: string,
   ): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['PENDING_APPROVAL', 'APPROVED_PENDING_SIGNATURE']);
+    assertBookingStatus(booking, [
+      "PENDING_APPROVAL",
+      "APPROVED_PENDING_SIGNATURE",
+    ]);
 
     const step = await this.bookingsRepository.findApprovalStepById(
       bookingId,
       stepId,
     );
-    if (!step) throw new BadRequestException('Approval step not found');
+    if (!step) throw new BadRequestException("Approval step not found");
 
     await this.bookingsRepository.completeApprovalStep(
       step.id,
       actorId,
-      'REJECTED',
+      "REJECTED",
       reason,
     );
 
     await this.bookingsRepository.createReviewNote(
       bookingId,
       reason,
-      'REJECTION',
+      "REJECTION",
       actorId,
     );
 
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'REJECTED',
+      status: "REJECTED",
     } as never);
     return this.bookingsService.findById(updated!.id);
   }
 
   async customerSign(bookingId: string): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['CONTRACT_READY']);
+    assertBookingStatus(booking, ["CONTRACT_READY"]);
 
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'SIGNED_CUSTOMER',
+      status: "SIGNED_CUSTOMER",
       customerSignedAt: new Date(),
     } as never);
     return this.bookingsService.findById(updated!.id);
   }
 
-  async marketingApprove(bookingId: string, actorId: string): Promise<Booking> {
-    const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['SIGNED_CUSTOMER']);
-
-    const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'FULLY_EXECUTED',
-      fullyExecutedAt: new Date(),
-      marketingApprovedById: actorId,
-      marketingApprovedAt: new Date(),
-      lockedAt: new Date(),
-    } as never);
-
-    const executed = await this.bookingsService.findById(updated!.id);
-
-    // Billable state reached — generate the invoice payment will settle.
-    // Non-blocking: a billing hiccup must not undo the execution.
-    await this.invoiceService
-      .ensureInvoiceForBooking(executed)
-      .catch((err) =>
-        this.logger.error(
-          `Failed to generate invoice for booking ${executed.reference}: ${
-            err instanceof Error ? err.message : String(err)
-          }`,
-        ),
-      );
-
-    return executed;
-  }
-
   async startTransit(bookingId: string): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['PAID']);
+    assertBookingStatus(booking, ["PAID"]);
 
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'IN_TRANSIT',
+      status: "IN_TRANSIT",
     } as never);
     return this.bookingsService.findById(updated!.id);
   }
 
   async complete(bookingId: string): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['IN_TRANSIT']);
+    assertBookingStatus(booking, ["IN_TRANSIT"]);
 
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'COMPLETED',
+      status: "COMPLETED",
       endDate: new Date(),
     } as never);
     return this.bookingsService.findById(updated!.id);
@@ -451,22 +452,23 @@ export class BookingTransitionService {
   async cancel(bookingId: string, reason: string): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
     assertBookingStatus(booking, [
-      'DRAFT',
-      'SUBMITTED',
-      'PRICE_CHANGED_PENDING_CONFIRM',
-      'CHANGES_REQUESTED',
-      'PENDING_APPROVAL',
-      'CONTRACT_READY',
+      "DRAFT",
+      "SUBMITTED",
+      "PRICE_CHANGED_PENDING_CONFIRM",
+      "CHANGES_REQUESTED",
+      "PENDING_APPROVAL",
+      "CONTRACT_READY",
+      "OPERATION_REQUEST_PENDING",
     ]);
 
     await this.bookingsRepository.createReviewNote(
       bookingId,
       reason,
-      'REJECTION',
+      "REJECTION",
     );
 
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'CANCELLED',
+      status: "CANCELLED",
     } as never);
     return this.bookingsService.findById(updated!.id);
   }
@@ -479,20 +481,20 @@ export class BookingTransitionService {
   async reject(bookingId: string, reason?: string): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
     assertBookingStatus(booking, [
-      'DRAFT',
-      'SUBMITTED',
-      'PRICE_CHANGED_PENDING_CONFIRM',
-      'PENDING_CONSOLIDATION',
+      "DRAFT",
+      "SUBMITTED",
+      "PRICE_CHANGED_PENDING_CONFIRM",
+      "PENDING_CONSOLIDATION",
     ]);
 
     await this.bookingsRepository.createReviewNote(
       bookingId,
-      reason?.trim() || 'Customer rejected the price estimate.',
-      'REJECTION',
+      reason?.trim() || "Customer rejected the price estimate.",
+      "REJECTION",
     );
 
     const updated = await this.bookingsRepository.update(bookingId, {
-      status: 'REJECTED',
+      status: "REJECTED",
     } as never);
     return this.bookingsService.findById(updated!.id);
   }
@@ -513,32 +515,44 @@ export class BookingTransitionService {
       fileKey: string;
       label: string;
       required: boolean;
-      uploadedBy: 'customer' | 'gl';
+      uploadedBy: "customer" | "gl";
       settingCode: string;
       file: { id: string; name: string; url: string } | null;
-      reviewStatus: 'PENDING' | 'APPROVED' | 'QUERIED' | null;
+      reviewStatus: "PENDING" | "APPROVED" | "QUERIED" | null;
       note: string | null;
     }>;
     allApproved: boolean;
+    phase?: string | null;
+    milestones?: unknown[];
+    nextAction?: unknown;
+    dutyRequired?: boolean | null;
+    roHold?: boolean;
+    roHoldReason?: string | null;
+    vesselDepartureDate?: string | null;
+    operationReady?: boolean;
   }> {
     const booking = await this.bookingsService.findById(bookingId);
+    if (this.isPhasedGeneralCustoms(booking)) {
+      return this.bookingClearanceService.getClearanceView(bookingId);
+    }
     const { inputCode, outputCode, includesCustoms } =
       clearanceCodesForBooking(booking);
 
-    const files = await this.filesService.findByResource(bookingId, 'bookings');
+    const files = await this.filesService.findByResource(bookingId, "bookings");
     const fileByCode = new Map(files.map((f) => [f.code, f]));
-    const reviews = await this.bookingsRepository.findDocumentReviews(bookingId);
+    const reviews =
+      await this.bookingsRepository.findDocumentReviews(bookingId);
     const reviewByKey = new Map(
       reviews.map((r) => [`${r.settingCode}:${r.fileKey}`, r]),
     );
 
     const documents: Awaited<
-      ReturnType<BookingTransitionService['getClearanceView']>
-    >['documents'] = [];
+      ReturnType<BookingTransitionService["getClearanceView"]>
+    >["documents"] = [];
 
     const pushSetting = async (
       code: string | null,
-      uploadedBy: 'customer' | 'gl',
+      uploadedBy: "customer" | "gl",
     ) => {
       if (!code) return;
       let setting;
@@ -556,28 +570,26 @@ export class BookingTransitionService {
           required: field.isRequired,
           uploadedBy,
           settingCode: code,
-          file: file
-            ? { id: file.id, name: file.name, url: file.url }
-            : null,
+          file: file ? { id: file.id, name: file.name, url: file.url } : null,
           reviewStatus: review?.status ?? null,
           note: review?.note ?? null,
         });
       }
     };
 
-    await pushSetting(inputCode, 'customer');
-    await pushSetting(outputCode, 'gl');
+    await pushSetting(inputCode, "customer");
+    await pushSetting(outputCode, "gl");
 
     // Ad-hoc / unknown documents (code custom_*) appear alongside the seeded set.
     for (const f of files) {
-      if (!f.code?.startsWith('custom_')) continue;
+      if (!f.code?.startsWith("custom_")) continue;
       const review = reviewByKey.get(`custom:${f.code}`) ?? null;
       documents.push({
         fileKey: f.code,
         label: f.name,
         required: false,
-        uploadedBy: 'customer',
-        settingCode: 'custom',
+        uploadedBy: "customer",
+        settingCode: "custom",
         file: { id: f.id, name: f.name, url: f.url },
         reviewStatus: review?.status ?? null,
         note: review?.note ?? null,
@@ -611,13 +623,15 @@ export class BookingTransitionService {
     }
     const required = (setting.fields ?? []).filter((f) => f.isRequired);
     if (required.length === 0) return true;
-    const reviews = await this.bookingsRepository.findDocumentReviews(booking.id);
+    const reviews = await this.bookingsRepository.findDocumentReviews(
+      booking.id,
+    );
     return required.every((field) =>
       reviews.some(
         (r) =>
           r.settingCode === inputCode &&
           r.fileKey === field.fileKey &&
-          r.status === 'APPROVED',
+          r.status === "APPROVED",
       ),
     );
   }
@@ -632,33 +646,38 @@ export class BookingTransitionService {
     files: Express.Multer.File[],
   ): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['AWAITING_DOCUMENTS', 'DOCUMENTS_UNDER_REVIEW']);
+    assertBookingStatus(booking, [
+      "AWAITING_DOCUMENTS",
+      "DOCUMENTS_UNDER_REVIEW",
+    ]);
     const { inputCode } = clearanceCodesForBooking(booking);
     if (!inputCode) {
-      throw new BadRequestException('This booking has no document-clearance step');
+      throw new BadRequestException(
+        "This booking has no document-clearance step",
+      );
     }
     if (files.length === 0) {
-      throw new BadRequestException('No documents uploaded');
+      throw new BadRequestException("No documents uploaded");
     }
 
     // First submission (nothing in review yet): every required input field must
     // be provided. Once review has started (DOCUMENTS_UNDER_REVIEW) the customer
     // is only fixing queried/pending docs, so the already-uploaded required docs
     // stay in place and we don't re-gate on the full required set.
-    if (booking.status === 'AWAITING_DOCUMENTS') {
+    if (booking.status === "AWAITING_DOCUMENTS") {
       await this.assertRequiredInputsPresent(bookingId, inputCode, files);
     }
 
     for (const file of files) {
       const record = await this.filesService.upsertByCode({
         resourceId: bookingId,
-        resource: 'bookings',
+        resource: "bookings",
         code: file.fieldname,
         file,
       });
       // Ad-hoc docs (custom_*) are not part of the required gate; still tracked.
-      const settingCode = file.fieldname.startsWith('custom_')
-        ? 'custom'
+      const settingCode = file.fieldname.startsWith("custom_")
+        ? "custom"
         : inputCode;
       await this.bookingsRepository.upsertDocumentReviewPending({
         bookingId,
@@ -669,8 +688,20 @@ export class BookingTransitionService {
     }
 
     await this.bookingsRepository.update(bookingId, {
-      status: 'DOCUMENTS_UNDER_REVIEW',
+      status: "DOCUMENTS_UNDER_REVIEW",
     } as never);
+
+    if (this.isPhasedGeneralCustoms(booking)) {
+      await this.workflowService.onCustomerDocsUploadedForBooking(
+        bookingId,
+        booking.tradeDirection ?? 'IMPORT',
+      );
+      await this.workflowService.onDocumentReviewReopenedForBooking(bookingId);
+      await this.bookingsRepository.update(bookingId, {
+        clearanceCurrentPhase: ContractDocPhase.GlEtReview,
+      } as never);
+    }
+
     return this.bookingsService.findById(bookingId);
   }
 
@@ -694,7 +725,10 @@ export class BookingTransitionService {
     const required = (setting.fields ?? []).filter((f) => f.isRequired);
     if (required.length === 0) return;
 
-    const existing = await this.filesService.findByResource(bookingId, 'bookings');
+    const existing = await this.filesService.findByResource(
+      bookingId,
+      "bookings",
+    );
     const presentKeys = new Set<string>([
       ...existing.map((f) => f.code),
       ...files.map((f) => f.fieldname),
@@ -702,7 +736,7 @@ export class BookingTransitionService {
 
     const missing = required.filter((f) => !presentKeys.has(f.fileKey));
     if (missing.length > 0) {
-      const labels = missing.map((f) => f.fileLabel).join(', ');
+      const labels = missing.map((f) => f.fileLabel).join(", ");
       throw new BadRequestException(
         `Please upload all required documents before submitting: ${labels}`,
       );
@@ -713,22 +747,36 @@ export class BookingTransitionService {
   async reviewDocument(
     bookingId: string,
     fileKey: string,
-    status: 'APPROVED' | 'QUERIED',
+    status: "APPROVED" | "QUERIED",
     staffId: string,
     note?: string,
   ): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['DOCUMENTS_UNDER_REVIEW']);
+    assertBookingStatus(booking, ["DOCUMENTS_UNDER_REVIEW"]);
     const { inputCode, outputCode } = clearanceCodesForBooking(booking);
 
-    const existing = await this.bookingsRepository.findDocumentReviews(bookingId);
+    const existing =
+      await this.bookingsRepository.findDocumentReviews(bookingId);
     const match = existing.find((r) => r.fileKey === fileKey);
     const settingCode =
       match?.settingCode ??
-      (fileKey.startsWith('custom_') ? 'custom' : (inputCode ?? outputCode ?? 'custom'));
+      (fileKey.startsWith("custom_")
+        ? "custom"
+        : (inputCode ?? outputCode ?? "custom"));
 
-    if (status === 'QUERIED' && !note?.trim()) {
-      throw new BadRequestException('A note is required when querying a document');
+    if (status === "QUERIED" && !note?.trim()) {
+      throw new BadRequestException(
+        "A note is required when querying a document",
+      );
+    }
+    if (
+      status === 'QUERIED' &&
+      this.isPhasedGeneralCustoms(booking) &&
+      booking.preClearanceFinalizedAt
+    ) {
+      throw new BadRequestException(
+        'Customer documents cannot be queried after pre-clearance is finalized.',
+      );
     }
 
     await this.bookingsRepository.setDocumentReviewStatus(
@@ -739,15 +787,37 @@ export class BookingTransitionService {
       staffId,
       note,
     );
-    if (status === 'QUERIED') {
+    if (status === "QUERIED") {
       await this.bookingsRepository.createReviewNote(
         bookingId,
         `Document "${fileKey}" queried: ${note}`,
-        'CHANGES_REQUESTED',
+        "CHANGES_REQUESTED",
         staffId,
       );
+      if (this.isPhasedGeneralCustoms(booking)) {
+        await this.workflowService.onDocumentReviewReopenedForBooking(bookingId);
+        await this.bookingsRepository.update(bookingId, {
+          clearanceCurrentPhase: ContractDocPhase.GlEtReview,
+        } as never);
+      }
     }
-    return this.bookingsService.findById(bookingId);
+
+    const updated = await this.bookingsService.findById(bookingId);
+    if (this.isPhasedGeneralCustoms(updated)) {
+      const allApproved = await this.isClearanceFullyApproved(updated);
+      if (allApproved) {
+        await this.workflowService.onAllDocsApprovedForBooking(bookingId);
+        const phase =
+          updated.tradeDirection === 'EXPORT'
+            ? ContractDocPhase.GlDjCollection
+            : ContractDocPhase.GlEtOutput;
+        await this.bookingsRepository.update(bookingId, {
+          clearanceCurrentPhase: phase,
+        } as never);
+      }
+    }
+
+    return updated;
   }
 
   /** GL uploads the customs output documents (IM4/IM5/EX3/etc.). */
@@ -756,18 +826,20 @@ export class BookingTransitionService {
     files: Express.Multer.File[],
   ): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['DOCUMENTS_UNDER_REVIEW']);
+    assertBookingStatus(booking, ["DOCUMENTS_UNDER_REVIEW"]);
     const { outputCode } = clearanceCodesForBooking(booking);
     if (!outputCode) {
-      throw new BadRequestException('This booking has no customs output documents');
+      throw new BadRequestException(
+        "This booking has no customs output documents",
+      );
     }
     if (files.length === 0) {
-      throw new BadRequestException('No documents uploaded');
+      throw new BadRequestException("No documents uploaded");
     }
     for (const file of files) {
       await this.filesService.upsertByCode({
         resourceId: bookingId,
-        resource: 'bookings',
+        resource: "bookings",
         code: file.fieldname,
         file,
       });
@@ -781,19 +853,28 @@ export class BookingTransitionService {
    */
   async finalizeClearance(bookingId: string): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
+    if (this.isPhasedGeneralCustoms(booking)) {
+      throw new BadRequestException(
+        'General customs bookings use phased clearance — complete milestones via the phased actions instead of finalize.',
+      );
+    }
     assertBookingStatus(booking, ['DOCUMENTS_UNDER_REVIEW']);
 
     const approved = await this.isClearanceFullyApproved(booking);
     if (!approved) {
       throw new BadRequestException(
-        'All required documents must be approved before clearance can be finalized',
+        "All required documents must be approved before clearance can be finalized",
       );
     }
 
     const { outputCode } = clearanceCodesForBooking(booking);
     if (outputCode) {
-      const setting = await this.fileUploadSettingsService.getByCode(outputCode);
-      const files = await this.filesService.findByResource(bookingId, 'bookings');
+      const setting =
+        await this.fileUploadSettingsService.getByCode(outputCode);
+      const files = await this.filesService.findByResource(
+        bookingId,
+        "bookings",
+      );
       const uploaded = new Set(files.map((f) => f.code));
       const missing = (setting.fields ?? []).filter(
         (f) => f.isRequired && !uploaded.has(f.fileKey),
@@ -802,13 +883,13 @@ export class BookingTransitionService {
         throw new BadRequestException(
           `Upload all required customs output documents first: ${missing
             .map((m) => m.fileLabel)
-            .join(', ')}`,
+            .join(", ")}`,
         );
       }
     }
 
     await this.bookingsRepository.update(bookingId, {
-      status: 'CLEARANCE_READY',
+      status: "CLEARANCE_READY",
     } as never);
     return this.bookingsService.findById(bookingId);
   }
@@ -827,11 +908,14 @@ export class BookingTransitionService {
     scheduledDate: string,
   ): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['CLEARANCE_READY', 'OPERATION_CHANGES_REQUESTED']);
+    assertBookingStatus(booking, [
+      "CLEARANCE_READY",
+      "OPERATION_CHANGES_REQUESTED",
+    ]);
 
     const date = new Date(scheduledDate);
     if (Number.isNaN(date.getTime())) {
-      throw new BadRequestException('A valid schedule date is required');
+      throw new BadRequestException("A valid schedule date is required");
     }
 
     // The binding shipment day must have at least one OPEN departure on the
@@ -844,12 +928,12 @@ export class BookingTransitionService {
     );
     if (!hasDeparture) {
       throw new BadRequestException(
-        'No departures available on the selected day for this route',
+        "No departures available on the selected day for this route",
       );
     }
 
     await this.bookingsRepository.update(bookingId, {
-      status: 'OPERATION_REQUEST_PENDING',
+      status: "OPERATION_REQUEST_PENDING",
       scheduledDate: date,
     } as never);
     return this.bookingsService.findById(bookingId);
@@ -865,27 +949,27 @@ export class BookingTransitionService {
    */
   async reviewOperationRequest(
     bookingId: string,
-    decision: 'ACCEPT' | 'REQUEST_CHANGES',
+    decision: "ACCEPT" | "REQUEST_CHANGES",
     actorId: string,
     options: { note?: string } = {},
   ): Promise<Booking> {
     const booking = await this.bookingsService.findById(bookingId);
-    assertBookingStatus(booking, ['OPERATION_REQUEST_PENDING']);
+    assertBookingStatus(booking, ["OPERATION_REQUEST_PENDING"]);
 
-    if (decision === 'REQUEST_CHANGES') {
+    if (decision === "REQUEST_CHANGES") {
       if (!options.note?.trim()) {
         throw new BadRequestException(
-          'A note is required when requesting changes',
+          "A note is required when requesting changes",
         );
       }
       await this.bookingsRepository.createReviewNote(
         bookingId,
         options.note,
-        'CHANGES_REQUESTED',
+        "CHANGES_REQUESTED",
         actorId,
       );
       await this.bookingsRepository.update(bookingId, {
-        status: 'OPERATION_CHANGES_REQUESTED',
+        status: "OPERATION_CHANGES_REQUESTED",
       } as never);
       return this.bookingsService.findById(bookingId);
     }
@@ -907,9 +991,17 @@ export class BookingTransitionService {
   private async acceptOperationRequest(booking: Booking): Promise<Booking> {
     const now = new Date();
 
+    const invoice = await this.invoiceService.ensureInvoiceForBooking(booking);
+    this.logger.log(
+      `Generated invoice ${invoice.invoiceNumber} (${invoice.id}) for ${booking.reference}:${booking.id}`,
+    );
+    await this.invoiceService.updateStatus(
+      invoice.id,
+      Freight.InvoiceStatus.Pending,
+    );
     if (isRoadService(booking.serviceType)) {
       await this.bookingsRepository.update(booking.id, {
-        status: 'ROAD_DISPATCH_PENDING',
+        status: "ROAD_DISPATCH_PENDING",
         fullyExecutedAt: now,
         lockedAt: booking.lockedAt ?? now,
       } as never);
@@ -917,7 +1009,7 @@ export class BookingTransitionService {
     }
 
     await this.bookingsRepository.update(booking.id, {
-      status: 'FULLY_EXECUTED',
+      status: "FULLY_EXECUTED",
       fullyExecutedAt: now,
       lockedAt: booking.lockedAt ?? now,
     } as never);
@@ -932,21 +1024,23 @@ export class BookingTransitionService {
     return this.bookingsService.findById(booking.id);
   }
 
-  async enrichBookingResponse(booking: Booking): Promise<Booking & {
-    latestChangeRequestNote?: string | null;
-    contractSummary?: string | null;
-    nextStep: BookingNextStep | null;
-  }> {
+  async enrichBookingResponse(booking: Booking): Promise<
+    Booking & {
+      latestChangeRequestNote?: string | null;
+      contractSummary?: string | null;
+      nextStep: BookingNextStep | null;
+    }
+  > {
     const note = await this.bookingsRepository.findLatestReviewNote(
       booking.id,
-      'CHANGES_REQUESTED',
+      "CHANGES_REQUESTED",
     );
     const summary =
       booking.contractSummary ??
       this.contractService.buildContractSummary(booking);
     const nextPending =
-      booking.status === 'PENDING_APPROVAL' ||
-      booking.status === 'APPROVED_PENDING_SIGNATURE'
+      booking.status === "PENDING_APPROVAL" ||
+        booking.status === "APPROVED_PENDING_SIGNATURE"
         ? await this.bookingsRepository.findNextPendingApprovalStep(booking.id)
         : null;
     const nextStep = computeNextStep(booking, nextPending);
@@ -957,4 +1051,4 @@ export class BookingTransitionService {
       nextStep,
     };
   }
-}
\ No newline at end of file
+}
diff --git a/apps/edr-freight-api/src/modules/bookings/bookings.controller.ts b/apps/edr-freight-api/src/modules/bookings/bookings.controller.ts
index 0f413199b..688c6ee18 100644
--- a/apps/edr-freight-api/src/modules/bookings/bookings.controller.ts
+++ b/apps/edr-freight-api/src/modules/bookings/bookings.controller.ts
@@ -12,6 +12,7 @@ import {
   Request,
   Res,
   UnauthorizedException,
+  UploadedFile,
   UploadedFiles,
   UseInterceptors,
 } from '@nestjs/common';
@@ -19,7 +20,7 @@ import { CurrentUser } from '@edr/api-common';
 import type { TCurrentUser } from '@tria-plc/api-common/modules/auth/types/current-user.type';
 import { BookingStaff } from '../../common/booking-guards';
 import { FREIGHT_PERMS } from '../../seed/freight-permissions.registry';
-import { AnyFilesInterceptor } from '@nestjs/platform-express';
+import { AnyFilesInterceptor, FileInterceptor } from '@nestjs/platform-express';
 import {
   ApiBearerAuth,
   ApiBody,
@@ -27,12 +28,17 @@ import {
   ApiOkResponse,
   ApiOperation,
   ApiTags,
-} from '@nestjs/swagger';
-import type { Response } from 'express';
+} from "@nestjs/swagger";
+import type { Response } from "express";
 
 import { BookingContractService } from './booking-contract.service';
 import { BookingPricingService } from './booking-pricing.service';
 import { BookingTransitionService } from './booking-transition.service';
+import { BookingClearanceService } from '../contracts/booking-clearance.service';
+import {
+  AdviseContractDutyDto,
+  RoAmendmentDto,
+} from '../contracts/dto/phased-clearance.dto';
 import { BookingReferenceDataService } from './booking-reference-data.service';
 import { BookingsService } from './bookings.service';
 import { BookingReferenceDataDto } from './dto/booking-reference-data.dto';
@@ -54,16 +60,20 @@ import {
   StaffRejectDto,
 } from './dto/request-changes.dto';
 import { ContractViewDto } from './dto/contract-view.dto';
+import { CustomerTruckAssignmentDto } from './dto/customer-truck-assignment.dto';
 import { SignContractDto } from './dto/sign-contract.dto';
 import { UpdateBookingDto } from './dto/update-booking.dto';
 import {
   type AuthUserPayload,
   resolveAuthUserId,
-} from '../../common/resolve-auth-user-id';
-import { assertFreightPermission, hasFreightPermission } from '../../common/freight-permission.util';
+} from "../../common/resolve-auth-user-id";
+import {
+  assertFreightPermission,
+  hasFreightPermission,
+} from "../../common/freight-permission.util";
 
-@ApiTags('bookings')
-@Controller('bookings')
+@ApiTags("bookings")
+@Controller("bookings")
 @ApiBearerAuth()
 export class BookingsController {
   constructor(
@@ -72,12 +82,13 @@ export class BookingsController {
     private readonly pricingService: BookingPricingService,
     private readonly transitionService: BookingTransitionService,
     private readonly contractService: BookingContractService,
+    private readonly bookingClearanceService: BookingClearanceService,
   ) {}
 
   @Post()
   @UseInterceptors(AnyFilesInterceptor())
-  @ApiConsumes('multipart/form-data')
-  @ApiOperation({ summary: 'Create a new freight booking (DRAFT)' })
+  @ApiConsumes("multipart/form-data")
+  @ApiOperation({ summary: "Create a new freight booking (DRAFT)" })
   @ApiBody({ type: CreateBookingDto })
   async create(
     @Body() dto: CreateBookingDto,
@@ -87,15 +98,24 @@ export class BookingsController {
     if (dto.isGovernment) {
       assertFreightPermission(user, FREIGHT_PERMS.bookings.staffAccept);
     }
-    const result = await this.bookingsService.create(dto, files ?? [], user?.id);
+    const result = await this.bookingsService.create(
+      dto,
+      files ?? [],
+      user?.id,
+    );
 
     // Staff-created commercial bookings skip the draft stage: auto generate-price + submit.
-    const isStaff = hasFreightPermission(user, FREIGHT_PERMS.bookings.staffAccept);
+    const isStaff = hasFreightPermission(
+      user,
+      FREIGHT_PERMS.bookings.staffAccept,
+    );
     if (isStaff && !dto.isGovernment) {
       try {
         await this.pricingService.generatePrice(result.booking.id);
         await this.transitionService.submit(result.booking.id);
-        const submitted = await this.bookingsService.findById(result.booking.id);
+        const submitted = await this.bookingsService.findById(
+          result.booking.id,
+        );
         return { booking: submitted, warnings: result.warnings };
       } catch {
         // If auto-pricing/submit fails, fall back to the DRAFT so staff can finish manually.
@@ -105,16 +125,16 @@ export class BookingsController {
     return result;
   }
 
-  @Patch(':id')
+  @Patch(":id")
   @UseInterceptors(AnyFilesInterceptor())
-  @ApiConsumes('multipart/form-data')
+  @ApiConsumes("multipart/form-data")
   @ApiOperation({
-    summary: 'Update booking',
-    description: 'Allowed when status is DRAFT or CHANGES_REQUESTED.',
+    summary: "Update booking",
+    description: "Allowed when status is DRAFT or CHANGES_REQUESTED.",
   })
   @ApiBody({ type: UpdateBookingDto })
   update(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: UpdateBookingDto,
     @UploadedFiles() files: Express.Multer.File[],
   ) {
@@ -122,7 +142,7 @@ export class BookingsController {
   }
 
   @Get()
-  @ApiOperation({ summary: 'List freight bookings (paginated)' })
+  @ApiOperation({ summary: "List freight bookings (paginated)" })
   async findAll(
     @Query() filter: FilterBookingDto,
     @CurrentUser() user: TCurrentUser,
@@ -139,7 +159,7 @@ export class BookingsController {
       return this.bookingsService.findClearanceQueue(filter);
     }
     const userId = user?.id;
-    if (!userId) throw new UnauthorizedException('Authentication required');
+    if (!userId) throw new UnauthorizedException("Authentication required");
     const companyId =
       await this.bookingsService.resolveCustomerCompanyId(userId);
     // No linked company yet → no bookings to show (avoids leaking all bookings).
@@ -165,27 +185,29 @@ export class BookingsController {
     return this.bookingsService.findAll(filter, companyId);
   }
 
-  @Get('by-company/:companyId/customer-view')
-  @ApiOperation({ summary: 'List bookings for a company (customer-view shape, backoffice)' })
+  @Get("by-company/:companyId/customer-view")
+  @ApiOperation({
+    summary: "List bookings for a company (customer-view shape, backoffice)",
+  })
   findByCompanyCustomerView(
-    @Param('companyId', ParseUUIDPipe) companyId: string,
+    @Param("companyId", ParseUUIDPipe) companyId: string,
   ) {
     return this.bookingsService.findCustomerBookings(companyId);
   }
 
-  @Get('list-summary')
-  @ApiOperation({ summary: 'Booking list metrics and tab counts (backoffice)' })
+  @Get("list-summary")
+  @ApiOperation({ summary: "Booking list metrics and tab counts (backoffice)" })
   @ApiOkResponse({ type: BookingListSummaryDto })
   findListSummary(@Query() filter: FilterBookingDto) {
     return this.bookingsService.getListSummary(filter);
   }
 
-  @Get('my')
+  @Get("my")
   @ApiOperation({
     summary: "List the current customer's bookings ready for payment",
     description:
-      'Bookings owned by the authenticated user\'s company that are payable ' +
-      '(FULLY_EXECUTED, SELECTED_FOR_BATCH, AWAITING_PAYMENT) and not yet PAID.',
+      "Bookings owned by the authenticated user's company that are payable " +
+      "(FULLY_EXECUTED, SELECTED_FOR_BATCH, AWAITING_PAYMENT) and not yet PAID.",
   })
   findMyPayable(
     @CurrentUser() user: AuthUserPayload,
@@ -194,32 +216,32 @@ export class BookingsController {
     return this.bookingsService.findMyPayable(resolveAuthUserId(user), filter);
   }
 
-  @Get('queues/:queue')
+  @Get("queues/:queue")
   @ApiOperation({
-    summary: 'List bookings for a dashboard queue',
-    description: 'Queues: intake, approval, signatures, marketing, finance',
+    summary: "List bookings for a dashboard queue",
+    description: "Queues: intake, approval, signatures, marketing, finance",
   })
   findQueue(
-    @Param('queue') queue: string,
+    @Param("queue") queue: string,
     @Query() filter: FilterBookingDto,
-    @Query('excludeBulk') excludeBulk?: string,
+    @Query("excludeBulk") excludeBulk?: string,
   ) {
     return this.bookingsService.findQueue(queue, filter, {
-      excludeBulk: excludeBulk === 'true',
+      excludeBulk: excludeBulk === "true",
     });
   }
 
-  @Get('reference-data')
-  @ApiOperation({ summary: 'Booking form catalog' })
+  @Get("reference-data")
+  @ApiOperation({ summary: "Booking form catalog" })
   @ApiOkResponse({ type: BookingReferenceDataDto })
   getReferenceData(): Promise<BookingReferenceDataDto> {
     return this.bookingReferenceDataService.getReferenceData();
   }
 
-  @Get('by-reference/:reference')
-  @ApiOperation({ summary: 'Get booking by reference' })
+  @Get("by-reference/:reference")
+  @ApiOperation({ summary: "Get booking by reference" })
   async findByReference(
-    @Param('reference') reference: string,
+    @Param("reference") reference: string,
     @CurrentUser() user: TCurrentUser,
   ) {
     const booking = await this.bookingsService.findByReference(reference);
@@ -233,10 +255,10 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Get(':id')
-  @ApiOperation({ summary: 'Get booking by ID' })
+  @Get(":id")
+  @ApiOperation({ summary: "Get booking by ID" })
   async findOne(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @CurrentUser() user: TCurrentUser,
   ) {
     const booking = await this.bookingsService.findById(id);
@@ -254,15 +276,48 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
+  @Post(':id/customer-truck-assignment')
+  @ApiOperation({ summary: 'Customer assigns external truck and driver for terminal pickup' })
+  async assignCustomerTruck(
+    @Param('id', ParseUUIDPipe) id: string,
+    @Body() dto: CustomerTruckAssignmentDto,
+    @CurrentUser() user: TCurrentUser,
+  ) {
+    const booking = await this.bookingsService.findById(id);
+    if (!hasFreightPermission(user, FREIGHT_PERMS.bookings.view)) {
+      await this.bookingsService.assertCustomerCanAccessBooking(user?.id, booking);
+    }
+    const assigned = await this.bookingsService.assignCustomerTruck(id, dto);
+    return this.transitionService.enrichBookingResponse(assigned);
+  }
+
+  @Get(':id/customer-truck-assignment/freight-order')
+  @ApiOperation({ summary: 'Download duplicate freight order copies for customer truck assignment' })
+  async customerTruckFreightOrder(
+    @Param('id', ParseUUIDPipe) id: string,
+    @CurrentUser() user: TCurrentUser,
+    @Res() res: Response,
+  ) {
+    const booking = await this.bookingsService.findById(id);
+    if (!hasFreightPermission(user, FREIGHT_PERMS.bookings.view)) {
+      await this.bookingsService.assertCustomerCanAccessBooking(user?.id, booking);
+    }
+    const { filename, buffer } =
+      await this.bookingsService.customerTruckFreightOrderCopies(id);
+    res.setHeader('Content-Type', 'application/pdf');
+    res.setHeader('Content-Disposition', `attachment; filename="${filename}"`);
+    res.send(buffer);
+  }
+
   @Get(':id/tracking')
   @ApiOperation({
-    summary: 'Shipment tracking timeline for a booking',
+    summary: "Shipment tracking timeline for a booking",
     description:
       "Returns the booking's consignment (once dispatched) and its ordered " +
-      'tracking events. Scoped to the customer\'s own company.',
+      "tracking events. Scoped to the customer's own company.",
   })
   async findTracking(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @CurrentUser() user: TCurrentUser,
   ) {
     const booking = await this.bookingsService.findById(id);
@@ -276,66 +331,66 @@ export class BookingsController {
     return this.bookingsService.getBookingTracking(id);
   }
 
-  @Delete(':id')
+  @Delete(":id")
   @HttpCode(204)
-  @ApiOperation({ summary: 'Soft-delete DRAFT booking' })
-  remove(@Param('id', ParseUUIDPipe) id: string) {
+  @ApiOperation({ summary: "Soft-delete DRAFT booking" })
+  remove(@Param("id", ParseUUIDPipe) id: string) {
     return this.bookingsService.remove(id);
   }
 
-  @Post(':id/documents')
+  @Post(":id/documents")
   @UseInterceptors(AnyFilesInterceptor())
-  @ApiConsumes('multipart/form-data')
-  @ApiOperation({ summary: 'Upload documents for a booking (DRAFT only)' })
+  @ApiConsumes("multipart/form-data")
+  @ApiOperation({ summary: "Upload documents for a booking (DRAFT only)" })
   async uploadDocuments(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @UploadedFiles() files: Express.Multer.File[],
   ) {
     const booking = await this.bookingsService.uploadDocuments(id, files ?? []);
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/generate-price')
+  @Post(":id/generate-price")
   @ApiOperation({
-    summary: 'Generate price preview (DRAFT or CHANGES_REQUESTED)',
+    summary: "Generate price preview (DRAFT or CHANGES_REQUESTED)",
     description:
-      'Computes and stores a price preview on the booking. Does not create rate snapshots.',
+      "Computes and stores a price preview on the booking. Does not create rate snapshots.",
   })
   @ApiOkResponse({ type: GeneratePriceResponseDto })
-  generatePrice(@Param('id', ParseUUIDPipe) id: string) {
+  generatePrice(@Param("id", ParseUUIDPipe) id: string) {
     return this.pricingService.generatePrice(id);
   }
 
-  @Post(':id/submit')
+  @Post(":id/submit")
   @ApiOperation({
-    summary: 'Customer submit booking',
+    summary: "Customer submit booking",
     description:
-      'Recomputes price against live rates. If unchanged, creates rate snapshots and submits. If changed, updates the booking price and returns priceChanged=true for confirmation.',
+      "Recomputes price against live rates. If unchanged, creates rate snapshots and submits. If changed, updates the booking price and returns priceChanged=true for confirmation.",
   })
   @ApiOkResponse({ type: SubmitBookingResponseDto })
-  submit(@Param('id', ParseUUIDPipe) id: string) {
+  submit(@Param("id", ParseUUIDPipe) id: string) {
     return this.transitionService.submit(id);
   }
 
-  @Post(':id/confirm-submit')
+  @Post(":id/confirm-submit")
   @ApiOperation({
-    summary: 'Confirm submit after price change',
+    summary: "Confirm submit after price change",
     description:
-      'Creates rate snapshots for the updated booking price and moves the booking to SUBMITTED.',
+      "Creates rate snapshots for the updated booking price and moves the booking to SUBMITTED.",
   })
   @ApiOkResponse({ type: SubmitBookingResponseDto })
-  confirmSubmit(@Param('id', ParseUUIDPipe) id: string) {
+  confirmSubmit(@Param("id", ParseUUIDPipe) id: string) {
     return this.transitionService.confirmSubmit(id);
   }
 
-  @Post(':id/reject')
+  @Post(":id/reject")
   @ApiOperation({
-    summary: 'Customer reject price estimate',
+    summary: "Customer reject price estimate",
     description:
-      'Customer rejects the priced booking at the confirm step. The booking becomes REJECTED (terminal); the customer must create a new booking.',
+      "Customer rejects the priced booking at the confirm step. The booking becomes REJECTED (terminal); the customer must create a new booking.",
   })
   async reject(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: RejectBookingDto,
   ) {
     const booking = await this.transitionService.reject(id, dto.reason);
@@ -344,22 +399,37 @@ export class BookingsController {
 
   // ── Document clearance (post counter-sign) ────────────────────────────────
 
+  @Get('clearance/et-queue')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @ApiOperation({ summary: 'GL ET queue — general customs bookings awaiting ET action' })
+  getBookingEtClearanceQueue() {
+    return this.bookingClearanceService.etQueue();
+  }
+
+  @Get('clearance/dj-queue')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDjActions)
+  @ApiOperation({ summary: 'GL DJ queue — general customs bookings awaiting DJ action' })
+  getBookingDjClearanceQueue() {
+    return this.bookingClearanceService.djQueue();
+  }
+
   @Get(':id/clearance')
   @ApiOperation({
-    summary: 'Document-clearance grid (required docs + upload + GL review status)',
+    summary:
+      "Document-clearance grid (required docs + upload + GL review status)",
   })
-  getClearance(@Param('id', ParseUUIDPipe) id: string) {
+  getClearance(@Param("id", ParseUUIDPipe) id: string) {
     return this.transitionService.getClearanceView(id);
   }
 
-  @Post(':id/clearance/documents')
+  @Post(":id/clearance/documents")
   @UseInterceptors(AnyFilesInterceptor())
-  @ApiConsumes('multipart/form-data')
+  @ApiConsumes("multipart/form-data")
   @ApiOperation({
-    summary: 'Customer uploads clearance documents (fieldname = document key)',
+    summary: "Customer uploads clearance documents (fieldname = document key)",
   })
   async submitClearanceDocuments(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @UploadedFiles() files: Express.Multer.File[],
   ) {
     const booking = await this.transitionService.submitClearanceDocuments(
@@ -369,14 +439,14 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/clearance/proceed')
+  @Post(":id/clearance/proceed")
   @ApiOperation({
     summary:
-      'Customer requests operation with a schedule day ' +
-      '(CLEARANCE_READY | OPERATION_CHANGES_REQUESTED → OPERATION_REQUEST_PENDING)',
+      "Customer requests operation with a schedule day " +
+      "(CLEARANCE_READY | OPERATION_CHANGES_REQUESTED → OPERATION_REQUEST_PENDING)",
   })
   async proceedToOperation(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: RequestOperationDto,
   ) {
     const booking = await this.transitionService.requestOperation(
@@ -386,15 +456,15 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/operation/review')
+  @Post(":id/operation/review")
   @BookingStaff(FREIGHT_PERMS.bookings.operations)
   @ApiOperation({
     summary:
-      'Operations reviews an operation request: ACCEPT (→ batch pool), ' +
-      'REQUEST_CHANGES (→ back to customer), or ADJUST_PRICE (→ customer re-confirm)',
+      "Operations reviews an operation request: ACCEPT (→ batch pool), " +
+      "REQUEST_CHANGES (→ back to customer), or ADJUST_PRICE (→ customer re-confirm)",
   })
   async reviewOperationRequest(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: OperationReviewDto,
     @CurrentUser() user: AuthUserPayload,
   ) {
@@ -407,11 +477,13 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/clearance/review')
+  @Post(":id/clearance/review")
   @BookingStaff(FREIGHT_PERMS.bookings.reviewDocuments)
-  @ApiOperation({ summary: 'GL reviews a clearance document (Approve | Query)' })
+  @ApiOperation({
+    summary: "GL reviews a clearance document (Approve | Query)",
+  })
   async reviewClearanceDocument(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: ReviewDocumentDto,
     @CurrentUser() user: AuthUserPayload,
   ) {
@@ -425,13 +497,13 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/clearance/output-documents')
+  @Post(":id/clearance/output-documents")
   @BookingStaff(FREIGHT_PERMS.bookings.uploadClearanceOutput)
   @UseInterceptors(AnyFilesInterceptor())
-  @ApiConsumes('multipart/form-data')
-  @ApiOperation({ summary: 'GL uploads customs output documents (IM4/EX3/…)' })
+  @ApiConsumes("multipart/form-data")
+  @ApiOperation({ summary: "GL uploads customs output documents (IM4/EX3/…)" })
   async uploadClearanceOutput(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @UploadedFiles() files: Express.Multer.File[],
   ) {
     const booking = await this.transitionService.uploadClearanceOutputDocuments(
@@ -441,21 +513,176 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/clearance/finalize')
+  @Post(":id/clearance/finalize")
   @BookingStaff(FREIGHT_PERMS.bookings.finalizeClearance)
   @ApiOperation({
-    summary: 'GL finalizes clearance (requires 100% approved) → CLEARANCE_READY',
+    summary:
+      "GL finalizes clearance (requires 100% approved) → CLEARANCE_READY",
   })
-  async finalizeClearance(@Param('id', ParseUUIDPipe) id: string) {
+  async finalizeClearance(@Param("id", ParseUUIDPipe) id: string) {
     const booking = await this.transitionService.finalizeClearance(id);
     return this.transitionService.enrichBookingResponse(booking);
   }
 
+  @Post(':id/clearance/declaration')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @UseInterceptors(AnyFilesInterceptor())
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'GL ET uploads customs declaration on booking (GENERAL customs)' })
+  async uploadBookingDeclaration(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFiles() files: Express.Multer.File[],
+    @CurrentUser() user: TCurrentUser,
+  ) {
+    const booking = await this.bookingClearanceService.uploadDeclaration(
+      id,
+      files ?? [],
+      resolveAuthUserId(user),
+    );
+    return this.transitionService.enrichBookingResponse(booking);
+  }
+
+  @Post(':id/clearance/duty')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDutyAdvise)
+  @UseInterceptors(FileInterceptor('attachment'))
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'GL ET sets duty/tax on booking with notice attachment' })
+  async adviseBookingDuty(
+    @Param('id', ParseUUIDPipe) id: string,
+    @Body('dutyRequired') dutyRequiredRaw: string,
+    @Body('amount') amountRaw: string | undefined,
+    @Body('currency') currency: string | undefined,
+    @Body('declarationSerial') declarationSerial: string | undefined,
+    @UploadedFile() attachment: Express.Multer.File | undefined,
+    @CurrentUser() user: TCurrentUser,
+  ) {
+    const dutyRequired = dutyRequiredRaw === 'true' || dutyRequiredRaw === '1';
+    const dto: AdviseContractDutyDto = {
+      dutyRequired,
+      amount:
+        amountRaw != null && amountRaw !== '' ? Number(amountRaw) : undefined,
+      currency: currency ?? 'ETB',
+      declarationSerial,
+    };
+    const booking = await this.bookingClearanceService.adviseDuty(
+      id,
+      dto,
+      resolveAuthUserId(user),
+      attachment,
+    );
+    return this.transitionService.enrichBookingResponse(booking);
+  }
+
+  @Post(':id/clearance/finalize-pre-clearance')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @ApiOperation({ summary: 'GL ET finalizes import pre-clearance on booking' })
+  async finalizeBookingPreClearance(@Param('id', ParseUUIDPipe) id: string) {
+    const booking = await this.bookingClearanceService.finalizePreClearance(id);
+    return this.transitionService.enrichBookingResponse(booking);
+  }
+
+  @Post(':id/clearance/duty-slip')
+  @UseInterceptors(FileInterceptor('file'))
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'Customer uploads duty/tax payment slip on booking' })
+  async uploadBookingDutySlip(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFile() file: Express.Multer.File,
+  ) {
+    const booking = await this.bookingClearanceService.uploadDutySlip(id, file);
+    return this.transitionService.enrichBookingResponse(booking);
+  }
+
+  @Post(':id/clearance/transit-permit')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @UseInterceptors(AnyFilesInterceptor())
+  @ApiConsumes('multipart/form-data')
+  async uploadBookingTransitPermit(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFiles() files: Express.Multer.File[],
+    @CurrentUser() user: TCurrentUser,
+  ) {
+    const booking = await this.bookingClearanceService.uploadTransitPermit(
+      id,
+      files ?? [],
+      resolveAuthUserId(user),
+    );
+    return this.transitionService.enrichBookingResponse(booking);
+  }
+
+  @Post(':id/clearance/delivery-order')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDjActions)
+  @UseInterceptors(FileInterceptor('file'))
+  @ApiConsumes('multipart/form-data')
+  async uploadBookingDeliveryOrder(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFile() file: Express.Multer.File,
+    @CurrentUser() user: TCurrentUser,
+  ) {
+    const booking = await this.bookingClearanceService.uploadDeliveryOrder(
+      id,
+      file,
+      resolveAuthUserId(user),
+    );
+    return this.transitionService.enrichBookingResponse(booking);
+  }
+
+  @Post(':id/clearance/release-order')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDjActions)
+  @UseInterceptors(FileInterceptor('file'))
+  @ApiConsumes('multipart/form-data')
+  async uploadBookingReleaseOrder(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFile() file: Express.Multer.File,
+    @Body('vesselDepartureDate') vesselDepartureDate: string,
+    @CurrentUser() user: TCurrentUser,
+  ) {
+    const result = await this.bookingClearanceService.uploadReleaseOrder(
+      id,
+      file,
+      vesselDepartureDate,
+      resolveAuthUserId(user),
+    );
+    return {
+      ...this.transitionService.enrichBookingResponse(result.booking),
+      hold: result.hold,
+      holdReason: result.holdReason,
+    };
+  }
+
+  @Post(':id/clearance/ro-amendment')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDjActions)
+  async requestBookingRoAmendment(
+    @Param('id', ParseUUIDPipe) id: string,
+    @Body() dto: RoAmendmentDto,
+    @CurrentUser() user: TCurrentUser,
+  ) {
+    const booking = await this.bookingClearanceService.requestRoAmendment(
+      id,
+      dto.note,
+      resolveAuthUserId(user),
+    );
+    return this.transitionService.enrichBookingResponse(booking);
+  }
+
+  @Post(':id/clearance/export-release')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  async confirmBookingExportRelease(
+    @Param('id', ParseUUIDPipe) id: string,
+    @CurrentUser() user: TCurrentUser,
+  ) {
+    const booking = await this.bookingClearanceService.confirmExportRelease(
+      id,
+      resolveAuthUserId(user),
+    );
+    return this.transitionService.enrichBookingResponse(booking);
+  }
+
   @Post(':id/staff/request-changes')
   @BookingStaff(FREIGHT_PERMS.bookings.requestChanges)
-  @ApiOperation({ summary: 'Staff return booking for customer updates' })
+  @ApiOperation({ summary: "Staff return booking for customer updates" })
   async requestChanges(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: RequestChangesDto,
     @CurrentUser() user: AuthUserPayload,
   ) {
@@ -467,14 +694,14 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/staff/accept')
+  @Post(":id/staff/accept")
   @BookingStaff(FREIGHT_PERMS.bookings.staffAccept)
   @ApiOperation({
     summary:
-      'Staff accept intake → set contract validity window + start approval chain',
+      "Staff accept intake → set contract validity window + start approval chain",
   })
   async acceptIntake(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: AcceptIntakeDto,
     @CurrentUser() user: AuthUserPayload,
   ) {
@@ -486,11 +713,11 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/staff/reject')
+  @Post(":id/staff/reject")
   @BookingStaff(FREIGHT_PERMS.bookings.reject)
-  @ApiOperation({ summary: 'Staff final reject' })
+  @ApiOperation({ summary: "Staff final reject" })
   async staffReject(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: StaffRejectDto,
     @CurrentUser() user: AuthUserPayload,
   ) {
@@ -502,11 +729,13 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/government-expedite')
+  @Post(":id/government-expedite")
   @BookingStaff(FREIGHT_PERMS.bookings.staffAccept)
-  @ApiOperation({ summary: 'Expedite government booking to PAID / ELIGIBLE for scheduling' })
+  @ApiOperation({
+    summary: "Expedite government booking to PAID / ELIGIBLE for scheduling",
+  })
   async governmentExpedite(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @CurrentUser() user: AuthUserPayload,
   ) {
     const booking = await this.bookingsService.governmentExpedite(
@@ -516,16 +745,16 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/approval-steps/:stepId/approve')
+  @Post(":id/approval-steps/:stepId/approve")
   @BookingStaff([
     FREIGHT_PERMS.bookings.approveLineStaff,
     FREIGHT_PERMS.bookings.approveDirector,
     FREIGHT_PERMS.bookings.approveCeo,
   ])
-  @ApiOperation({ summary: 'Approve one approval step in sequence' })
+  @ApiOperation({ summary: "Approve one approval step in sequence" })
   async approveStep(
-    @Param('id', ParseUUIDPipe) id: string,
-    @Param('stepId', ParseUUIDPipe) stepId: string,
+    @Param("id", ParseUUIDPipe) id: string,
+    @Param("stepId", ParseUUIDPipe) stepId: string,
     @Body() dto: ApproveStepDto,
     @CurrentUser() user: TCurrentUser,
   ) {
@@ -539,12 +768,12 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/approval-steps/:stepId/reject')
+  @Post(":id/approval-steps/:stepId/reject")
   @BookingStaff(FREIGHT_PERMS.bookings.rejectApproval)
-  @ApiOperation({ summary: 'Reject at approval step' })
+  @ApiOperation({ summary: "Reject at approval step" })
   async rejectStep(
-    @Param('id', ParseUUIDPipe) id: string,
-    @Param('stepId', ParseUUIDPipe) stepId: string,
+    @Param("id", ParseUUIDPipe) id: string,
+    @Param("stepId", ParseUUIDPipe) stepId: string,
     @Body() dto: RejectStepDto,
     @CurrentUser() user: AuthUserPayload,
   ) {
@@ -557,53 +786,53 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/contract/generate')
+  @Post(":id/contract/generate")
   @BookingStaff(FREIGHT_PERMS.bookings.generateContract)
-  @ApiOperation({ summary: 'Generate contract PDF from template' })
-  async generateContract(@Param('id', ParseUUIDPipe) id: string) {
+  @ApiOperation({ summary: "Generate contract PDF from template" })
+  async generateContract(@Param("id", ParseUUIDPipe) id: string) {
     const booking = await this.contractService.generateContract(id);
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Get(':id/contract/view')
+  @Get(":id/contract/view")
   @ApiOkResponse({ type: ContractViewDto })
-  @ApiOperation({ summary: 'Contract HTML view for portal and backoffice' })
+  @ApiOperation({ summary: "Contract HTML view for portal and backoffice" })
   getContractView(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Request() req: { user?: { id?: string; sub?: string } },
   ) {
     const userId = req.user?.id ?? req.user?.sub;
     return this.contractService.getContractView(id, userId);
   }
 
-  @Get(':id/contract/document')
-  @ApiOperation({ summary: 'Download contract PDF' })
+  @Get(":id/contract/document")
+  @ApiOperation({ summary: "Download contract PDF" })
   async downloadContractDocument(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Res() res: Response,
   ): Promise<void> {
     const { stream, record } = await this.contractService.streamContract(id);
-    res.setHeader('Content-Type', record.mimeType ?? 'application/pdf');
+    res.setHeader("Content-Type", record.mimeType ?? "application/pdf");
     res.setHeader(
-      'Content-Disposition',
+      "Content-Disposition",
       `attachment; filename="${record.name}"`,
     );
     stream.pipe(res);
   }
 
-  @Get(':id/contract')
-  @ApiOperation({ summary: 'Download contract file (alias)' })
+  @Get(":id/contract")
+  @ApiOperation({ summary: "Download contract file (alias)" })
   async downloadContract(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Res() res: Response,
   ): Promise<void> {
     return this.downloadContractDocument(id, res);
   }
 
-  @Post(':id/contract/sign')
-  @ApiOperation({ summary: 'Apply digital signature (customer or staff)' })
+  @Post(":id/contract/sign")
+  @ApiOperation({ summary: "Apply digital signature (customer or staff)" })
   async signContract(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: SignContractDto,
     @Request() req: { user?: { id?: string; sub?: string }; ip?: string },
   ) {
@@ -615,28 +844,28 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Get(':id/contract/signatures')
-  @ApiOperation({ summary: 'List contract signatures' })
-  getContractSignatures(@Param('id', ParseUUIDPipe) id: string) {
+  @Get(":id/contract/signatures")
+  @ApiOperation({ summary: "List contract signatures" })
+  getContractSignatures(@Param("id", ParseUUIDPipe) id: string) {
     return this.contractService.getSignatures(id);
   }
 
-  @Get(':id/summary')
-  @ApiOperation({ summary: 'Contract summary string for dashboard' })
-  getSummary(@Param('id', ParseUUIDPipe) id: string) {
+  @Get(":id/summary")
+  @ApiOperation({ summary: "Contract summary string for dashboard" })
+  getSummary(@Param("id", ParseUUIDPipe) id: string) {
     return this.contractService.getSummary(id);
   }
 
-  @Post(':id/customer/sign')
+  @Post(":id/customer/sign")
   @ApiOperation({
-    summary: 'Customer digital signature (deprecated — use POST contract/sign)',
+    summary: "Customer digital signature (deprecated — use POST contract/sign)",
   })
   async customerSign(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: SignContractDto,
     @Request() req: { user?: { id?: string; sub?: string }; ip?: string },
   ) {
-    const payload: SignContractDto = { ...dto, role: 'CUSTOMER' };
+    const payload: SignContractDto = { ...dto, role: "CUSTOMER" };
     const booking = await this.contractService.signContract(id, payload, {
       signerUserId: req.user?.id ?? req.user?.sub,
       ipAddress: req.ip,
@@ -644,20 +873,21 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/marketing/approve')
+  @Post(":id/marketing/approve")
   @BookingStaff(FREIGHT_PERMS.bookings.signStaff)
   @ApiOperation({
-    summary: 'Staff contract signature and fully execute (use contract/sign STAFF preferred)',
+    summary:
+      "Staff contract signature and fully execute (use contract/sign STAFF preferred)",
   })
   async marketingApprove(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: SignContractDto,
     @CurrentUser() user: AuthUserPayload,
     @Request() req: { ip?: string },
   ) {
     const payload: SignContractDto = {
       ...dto,
-      role: 'STAFF',
+      role: "STAFF",
     };
     const booking = await this.contractService.signContract(id, payload, {
       signerUserId: resolveAuthUserId(user),
@@ -666,48 +896,48 @@ export class BookingsController {
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/operations/start-transit')
+  @Post(":id/operations/start-transit")
   @BookingStaff(FREIGHT_PERMS.bookings.operations)
-  @ApiOperation({ summary: 'Mark in transit' })
-  async startTransit(@Param('id', ParseUUIDPipe) id: string) {
+  @ApiOperation({ summary: "Mark in transit" })
+  async startTransit(@Param("id", ParseUUIDPipe) id: string) {
     const booking = await this.transitionService.startTransit(id);
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/operations/complete')
+  @Post(":id/operations/complete")
   @BookingStaff(FREIGHT_PERMS.bookings.operations)
-  @ApiOperation({ summary: 'Mark completed' })
-  async complete(@Param('id', ParseUUIDPipe) id: string) {
+  @ApiOperation({ summary: "Mark completed" })
+  async complete(@Param("id", ParseUUIDPipe) id: string) {
     const booking = await this.transitionService.complete(id);
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/cancel')
+  @Post(":id/cancel")
   @BookingStaff(FREIGHT_PERMS.bookings.cancel)
-  @ApiOperation({ summary: 'Cancel booking' })
+  @ApiOperation({ summary: "Cancel booking" })
   async cancel(
-    @Param('id', ParseUUIDPipe) id: string,
+    @Param("id", ParseUUIDPipe) id: string,
     @Body() dto: CancelBookingDto,
   ) {
     const booking = await this.transitionService.cancel(id, dto.reason);
     return this.transitionService.enrichBookingResponse(booking);
   }
 
-  @Post(':id/consolidation')
-  @ApiOperation({ summary: 'Request freight consolidation' })
-  requestConsolidation(@Param('id', ParseUUIDPipe) id: string) {
+  @Post(":id/consolidation")
+  @ApiOperation({ summary: "Request freight consolidation" })
+  requestConsolidation(@Param("id", ParseUUIDPipe) id: string) {
     return this.bookingsService.requestConsolidation(id);
   }
 
-  @Delete(':id/consolidation')
-  @ApiOperation({ summary: 'Remove consolidation pairing' })
-  removeConsolidation(@Param('id', ParseUUIDPipe) id: string) {
+  @Delete(":id/consolidation")
+  @ApiOperation({ summary: "Remove consolidation pairing" })
+  removeConsolidation(@Param("id", ParseUUIDPipe) id: string) {
     return this.bookingsService.removeConsolidation(id);
   }
 
-  @Get(':id/consolidation')
-  @ApiOperation({ summary: 'Get consolidation details' })
-  getConsolidationDetails(@Param('id', ParseUUIDPipe) id: string) {
+  @Get(":id/consolidation")
+  @ApiOperation({ summary: "Get consolidation details" })
+  getConsolidationDetails(@Param("id", ParseUUIDPipe) id: string) {
     return this.bookingsService.getConsolidationDetails(id);
   }
 }
diff --git a/apps/edr-freight-api/src/modules/bookings/bookings.module.ts b/apps/edr-freight-api/src/modules/bookings/bookings.module.ts
index 5d7e3b2c9..2cc23b3fa 100644
--- a/apps/edr-freight-api/src/modules/bookings/bookings.module.ts
+++ b/apps/edr-freight-api/src/modules/bookings/bookings.module.ts
@@ -1,7 +1,7 @@
-import { Module, forwardRef } from '@nestjs/common';
-import { ConfigService } from '@nestjs/config';
-import { TypeOrmModule } from '@nestjs/typeorm';
-import { ExchangeModule, ExchangeOptions } from '@edr/api-common';
+import { Module, forwardRef } from "@nestjs/common";
+import { ConfigService } from "@nestjs/config";
+import { TypeOrmModule } from "@nestjs/typeorm";
+import { ExchangeModule, ExchangeOptions } from "@edr/api-common";
 
 // import { CustomersModule } from '../customers/customers.module';
 import { CompaniesModule } from '../companies/companies.module';
@@ -14,13 +14,13 @@ import { BillingModule } from '../billing/billing.module';
 import { FirstMileModule } from '../first-mile/first-mile.module';
 import { BookingContractService } from './booking-contract.service';
 import { BookingInvoiceService } from './booking-invoice.service';
-import { BookingPaymentController } from './booking-payment.controller';
-import { BookingPaymentService } from './booking-payment.service';
+// import { BookingPaymentController } from './booking-payment.controller';
+// import { BookingPaymentService } from './booking-payment.service';
 import { BookingPricingService } from './booking-pricing.service';
 import { BookingReferenceDataService } from './booking-reference-data.service';
 import { BookingTransitionService } from './booking-transition.service';
 import { BookingsController } from './bookings.controller';
-import { PayController } from './pay.controller';
+// import { PayController } from './pay.controller';
 import { BookingsRepository } from './bookings.repository';
 import { ConsolidationService } from './consolidation.service';
 import { BookingsService } from './bookings.service';
@@ -32,13 +32,15 @@ import { BookingRateSnapshot } from './entities/booking-rate-snapshot.entity';
 import { BookingContractSignature } from './entities/booking-contract-signature.entity';
 import { BookingReviewNote } from './entities/booking-review-note.entity';
 import { Booking } from './entities/booking.entity';
-import { BookingContainerAllocation } from './entities/booking-container-allocation.entity';
 import { ContractPdfService } from '../../contracts/contract-pdf.service';
 import { ContractPricingScheduleBuilder } from '../../contracts/contract-pricing-schedule.builder';
 import { ContractRendererService } from '../../contracts/contract-renderer.service';
 import { ContractTemplateResolver } from '../../contracts/contract-template.resolver';
 import { ContractViewModelBuilder } from '../../contracts/contract-view-model.builder';
 import { TrainSchedulingModule } from '../train-scheduling/train-scheduling.module';
+import { ContractsModule } from '../contracts/contracts.module';
+import { BookingContainerAllocation } from "./entities/booking-container-allocation.entity";
+
 
 @Module({
   imports: [
@@ -56,6 +58,8 @@ import { TrainSchedulingModule } from '../train-scheduling/train-scheduling.modu
     BillingModule,
     forwardRef(() => FirstMileModule),
     forwardRef(() => TrainSchedulingModule),
+    forwardRef(() => ContractsModule),
+    forwardRef(() => ContractsModule),
     FilesModule,
     MinioModule,
     CompaniesModule,
@@ -66,10 +70,10 @@ import { TrainSchedulingModule } from '../train-scheduling/train-scheduling.modu
     ExchangeModule.forRootAsync({
       inject: [ConfigService],
       useFactory: (config: ConfigService): ExchangeOptions =>
-        config.get<ExchangeOptions>('app.cbeExchange') ?? {},
+        config.get<ExchangeOptions>("app.cbeExchange") ?? {},
     }),
   ],
-  controllers: [BookingsController, PayController, BookingPaymentController],
+  controllers: [BookingsController],
   providers: [
     BookingsService,
     BookingsRepository,
@@ -79,13 +83,17 @@ import { TrainSchedulingModule } from '../train-scheduling/train-scheduling.modu
     BookingTransitionService,
     BookingContractService,
     BookingInvoiceService,
-    BookingPaymentService,
     ContractTemplateResolver,
     ContractViewModelBuilder,
     ContractPricingScheduleBuilder,
     ContractRendererService,
     ContractPdfService,
   ],
-  exports: [BookingsService, BookingsRepository, BookingPricingService, BookingInvoiceService],
+  exports: [
+    BookingsService,
+    BookingsRepository,
+    BookingPricingService,
+    BookingInvoiceService,
+  ],
 })
-export class BookingsModule {}
+export class BookingsModule { }
diff --git a/apps/edr-freight-api/src/modules/bookings/bookings.repository.ts b/apps/edr-freight-api/src/modules/bookings/bookings.repository.ts
index 57e811e34..b99611c35 100644
--- a/apps/edr-freight-api/src/modules/bookings/bookings.repository.ts
+++ b/apps/edr-freight-api/src/modules/bookings/bookings.repository.ts
@@ -121,6 +121,8 @@ export class BookingsRepository extends BaseRepository<Booking> {
       containerTypeId: string;
       quantity: number;
       vgmPerUnitTons: number;
+      hazardousQuantity?: number;
+      reeferQuantity?: number;
       weightResult: ContainerWeightResult;
     }>,
   ): Promise<BookingContainer[]> {
@@ -133,11 +135,16 @@ export class BookingsRepository extends BaseRepository<Booking> {
       const wagonsPerUnit = ct ? Number(ct.wagonsPerUnit) : 1;
       const totalVgm = item.quantity * item.vgmPerUnitTons;
       const wagonsRequired = Math.ceil(item.quantity * wagonsPerUnit);
+      // A per-line breakdown can never exceed the line's own quantity.
+      const clamp = (v?: number) =>
+        Math.max(0, Math.min(item.quantity, Math.floor(Number(v ?? 0)) || 0));
 
       const row = containerRepo.create({
         bookingId,
         containerTypeId: item.containerTypeId,
         quantity: item.quantity,
+        hazardousQuantity: clamp(item.hazardousQuantity),
+        reeferQuantity: clamp(item.reeferQuantity),
         vgmPerUnitTons: item.vgmPerUnitTons,
         totalVgmTons: totalVgm,
         wagonsRequired,
@@ -483,6 +490,15 @@ export class BookingsRepository extends BaseRepository<Booking> {
     } as never);
   }
 
+  /** Bookings in any of the given statuses (clearance queue helpers). */
+  async findByStatuses(statuses: string[]): Promise<Booking[]> {
+    if (!statuses.length) return [];
+    return this.repository.find({
+      where: { status: In(statuses) },
+      order: { createdAt: 'DESC' },
+    });
+  }
+
   /** Queue listing with optional bulk exclusion for LINE_STAFF. */
   async findQueue(options: {
     status: string | string[];
diff --git a/apps/edr-freight-api/src/modules/bookings/bookings.service.ts b/apps/edr-freight-api/src/modules/bookings/bookings.service.ts
index a4636cbf7..80165cb7e 100644
--- a/apps/edr-freight-api/src/modules/bookings/bookings.service.ts
+++ b/apps/edr-freight-api/src/modules/bookings/bookings.service.ts
@@ -45,6 +45,8 @@ import {
 import { Booking } from './entities/booking.entity';
 import { BookingContainerAllocation } from './entities/booking-container-allocation.entity';
 import { FileRecord } from '../files/entities/file.entity';
+import { CustomerTruckAssignmentDto } from './dto/customer-truck-assignment.dto';
+import { ContractPdfService } from '../../contracts/contract-pdf.service';
 
 /** Paginated booking list: flat `total` (backoffice) + `meta` block (portal). */
 export interface PaginatedBookings {
@@ -67,6 +69,17 @@ const NEEDS_ACTION_STATUSES = [
   'APPROVED_PENDING_SIGNATURE',
 ] as const;
 
+/**
+ * Clamp a bulk hazardous/reefer amount into 0..cargoAmount: it can never exceed
+ * the total cargo it's a portion of, and is never negative.
+ */
+function clampToCargo(value: number | undefined, cargoAmount: number): number {
+  const v = Number(value ?? 0);
+  if (!Number.isFinite(v) || v <= 0) return 0;
+  const cap = Number.isFinite(cargoAmount) && cargoAmount > 0 ? cargoAmount : 0;
+  return Math.min(v, cap);
+}
+
 @Injectable()
 export class BookingsService {
   constructor(
@@ -81,8 +94,62 @@ export class BookingsService {
     private readonly ruleEngineService: RuleEngineService,
     private readonly containerTypesService: ContainerTypesService,
     private readonly consolidationService: ConsolidationService,
+    private readonly contractPdfService: ContractPdfService,
   ) {}
 
+  async assignCustomerTruck(
+    bookingId: string,
+    dto: CustomerTruckAssignmentDto,
+  ): Promise<Booking> {
+    const booking = await this.findById(bookingId);
+    const hasFirstMile = Boolean(booking.firstMilePickupAddress?.trim());
+    const hasLastMile = Boolean(booking.lastMileDeliveryAddress?.trim());
+    const usesMileService =
+      booking.tradeDirection === 'IMPORT'
+        ? hasLastMile
+        : booking.tradeDirection === 'EXPORT'
+          ? hasFirstMile
+          : hasFirstMile || hasLastMile;
+    if (usesMileService) {
+      throw new BadRequestException(
+        'Customer truck assignment is only allowed when first/last mile delivery is not selected',
+      );
+    }
+    if (booking.customerTruckAssignedAt) {
+      throw new ConflictException('Customer truck assignment is already submitted and locked');
+    }
+    if (booking.paymentStatus !== 'PAID') {
+      throw new BadRequestException('Booking must be paid before assigning an external customer truck');
+    }
+
+    await this.bookingsRepository.update(bookingId, {
+      status: 'TRUCK_ASSIGNED',
+      customerTruckPlateNumber: dto.truckPlateNumber.trim().toUpperCase(),
+      customerTruckDriverName: dto.driverName.trim(),
+      customerTruckType: dto.truckType.trim(),
+      customerTruckContainerNumber: dto.containerNumberToLoad.trim().toUpperCase(),
+      customerTruckAssignedAt: new Date(),
+    });
+
+    return this.findById(bookingId);
+  }
+
+  async customerTruckFreightOrderCopies(
+    bookingId: string,
+  ): Promise<{ filename: string; buffer: Buffer }> {
+    const booking = await this.findById(bookingId);
+    if (!booking.customerTruckAssignedAt) {
+      throw new BadRequestException('Customer truck must be assigned before freight order copies can be generated');
+    }
+
+    const html = this.buildCustomerTruckFreightOrderHtml(booking);
+    const buffer = await this.contractPdfService.htmlToPdfBuffer(html);
+    return {
+      filename: `freight-order-${booking.reference.replace(/[^a-zA-Z0-9_-]+/g, '-')}.pdf`,
+      buffer,
+    };
+  }
+
   /** Resolve trade direction from yard countries; reject client mismatch. */
   private async resolveTradeDirectionForBooking(
     originYardId: string,
@@ -120,6 +187,79 @@ export class BookingsService {
     return `BK-${year}-${String(count + 1).padStart(6, '0')}`;
   }
 
+  private buildCustomerTruckFreightOrderHtml(booking: Booking): string {
+    const assignedAt = booking.customerTruckAssignedAt
+      ? new Date(booking.customerTruckAssignedAt).toLocaleString('en-GB')
+      : '-';
+    const rows: Array<[string, string | null | undefined]> = [
+      ['Booking Reference', booking.reference],
+      ['Client Name', booking.company?.name],
+      ['Client ID', booking.companyId],
+      ['Trade Direction', booking.tradeDirection],
+      ['Freight Type', booking.freightType],
+      ['Truck Plate Number', booking.customerTruckPlateNumber],
+      ['Driver Name', booking.customerTruckDriverName],
+      ['Truck Type', booking.customerTruckType],
+      ['Container Number to Load', booking.customerTruckContainerNumber],
+      ['Assigned At', assignedAt],
+      ['Booking Status', booking.status],
+    ];
+    const rowHtml = rows
+      .map(([label, value]) => `<tr><th>${this.escapeHtml(label)}</th><td>${this.escapeHtml(value || '-')}</td></tr>`)
+      .join('');
+    const copy = (watermark: string) => `
+      <section class="copy">
+        <div class="watermark">${this.escapeHtml(watermark)}</div>
+        <header>
+          <div>
+            <h1>Freight Order</h1>
+            <p>Customer external truck assignment</p>
+          </div>
+          <strong>${this.escapeHtml(booking.reference)}</strong>
+        </header>
+        <table>${rowHtml}</table>
+        <div class="signatures">
+          <div>Customer / Carrier Signature</div>
+          <div>Port Operations Verification</div>
+          <div>Gate Security Verification</div>
+        </div>
+      </section>`;
+
+    return `<!doctype html>
+      <html>
+        <head>
+          <meta charset="utf-8" />
+          <style>
+            body { font-family: Arial, sans-serif; color: #10202f; margin: 0; }
+            .copy { position: relative; min-height: 46vh; padding: 28px 32px; page-break-inside: avoid; border-bottom: 1px dashed #94a3b8; }
+            .watermark { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 34px; font-weight: 800; color: rgba(16, 32, 47, 0.08); transform: rotate(-18deg); pointer-events: none; }
+            header { display: flex; justify-content: space-between; align-items: flex-start; border-bottom: 3px solid #0a9f6a; padding-bottom: 14px; margin-bottom: 18px; }
+            h1 { margin: 0; font-size: 28px; letter-spacing: 0; }
+            p { margin: 4px 0 0; color: #64748b; }
+            strong { font-size: 16px; color: #0a9f6a; }
+            table { width: 100%; border-collapse: collapse; position: relative; z-index: 1; }
+            th, td { border: 1px solid #cbd5e1; padding: 9px 10px; text-align: left; font-size: 12px; }
+            th { width: 34%; background: #f1f5f9; }
+            .signatures { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 34px; font-size: 11px; color: #475569; position: relative; z-index: 1; }
+            .signatures div { border-top: 1px solid #334155; padding-top: 8px; min-height: 28px; }
+          </style>
+        </head>
+        <body>
+          ${copy('Copy 1: Port Operations Copy')}
+          ${copy('Copy 2: Gate Security & Carrier Copy')}
+        </body>
+      </html>`;
+  }
+
+  private escapeHtml(value: string): string {
+    return value
+      .replace(/&/g, '&amp;')
+      .replace(/</g, '&lt;')
+      .replace(/>/g, '&gt;')
+      .replace(/"/g, '&quot;')
+      .replace(/'/g, '&#39;');
+  }
+
   /** Build evaluation input from booking freight shape. */
   /**
    * Whether a service type bundles customs clearance. This is the single source
@@ -506,6 +646,16 @@ export class BookingsService {
       // the container type at pricing time, so the booking-level flag stays off
       // for container freight to avoid double-counting.
       isReefer: dto.freightType === 'BULK' ? (dto.isReefer ?? false) : false,
+      // Bulk-only hazardous/reefer amount, clamped to the cargo amount. Container
+      // freight tracks this per line, so these are 0 for CONTAINER.
+      bulkHazardousQuantity:
+        dto.freightType === 'BULK'
+          ? clampToCargo(dto.bulkHazardousQuantity, dto.cargoTotalWeightVgm)
+          : 0,
+      bulkReeferQuantity:
+        dto.freightType === 'BULK'
+          ? clampToCargo(dto.bulkReeferQuantity, dto.cargoTotalWeightVgm)
+          : 0,
       paymentCurrency: dto.paymentCurrency,
       pnrCode: dto.pnrCode,
       financialTerms: dto.financialTerms,
@@ -528,6 +678,8 @@ export class BookingsService {
           containerTypeId: c.containerTypeId,
           quantity: c.quantity,
           vgmPerUnitTons: c.vgmPerUnitTons,
+          hazardousQuantity: c.hazardousQuantity,
+          reeferQuantity: c.reeferQuantity,
           weightResult: ruleResult.containerWeightResults[i],
         })),
       );
@@ -665,6 +817,8 @@ export class BookingsService {
       containers,
     );
 
+    const cargoAmount =
+      dto.cargoTotalWeightVgm ?? Number(existing.cargoTotalWeightVgm ?? 0);
     const updates: Record<string, unknown> = {
       ...dto,
       freightType,
@@ -675,6 +829,22 @@ export class BookingsService {
         freightType === 'BULK'
           ? (dto.isReefer ?? existing.isReefer ?? false)
           : false,
+      // Bulk-only hazardous/reefer amount, clamped to the cargo amount; 0 for
+      // container freight (per-line on the containers instead).
+      bulkHazardousQuantity:
+        freightType === 'BULK'
+          ? clampToCargo(
+              dto.bulkHazardousQuantity ?? Number(existing.bulkHazardousQuantity ?? 0),
+              cargoAmount,
+            )
+          : 0,
+      bulkReeferQuantity:
+        freightType === 'BULK'
+          ? clampToCargo(
+              dto.bulkReeferQuantity ?? Number(existing.bulkReeferQuantity ?? 0),
+              cargoAmount,
+            )
+          : 0,
       priorityScore: ruleResult.priorityScore,
       tradeDirection,
     };
@@ -721,6 +891,8 @@ export class BookingsService {
           containerTypeId: c.containerTypeId,
           quantity: c.quantity,
           vgmPerUnitTons: c.vgmPerUnitTons,
+          hazardousQuantity: c.hazardousQuantity,
+          reeferQuantity: c.reeferQuantity,
           weightResult: ruleResult.containerWeightResults[i],
         })),
       );
diff --git a/apps/edr-freight-api/src/modules/bookings/dto/booking-reference-data.dto.ts b/apps/edr-freight-api/src/modules/bookings/dto/booking-reference-data.dto.ts
index 35df9dcd3..c930d7aa1 100644
--- a/apps/edr-freight-api/src/modules/bookings/dto/booking-reference-data.dto.ts
+++ b/apps/edr-freight-api/src/modules/bookings/dto/booking-reference-data.dto.ts
@@ -72,9 +72,6 @@ export class BookingReferenceCargoTypeChildDto {
   @ApiProperty({ example: 'BULK_COFFEE' })
   code!: string;
 
-  @ApiProperty()
-  show_free_text_box!: boolean;
-
   @ApiProperty({ enum: CargoUnitOfMeasure, nullable: true, required: false })
   unit_of_measure?: CargoUnitOfMeasure | null;
 }
diff --git a/apps/edr-freight-api/src/modules/bookings/dto/create-booking.dto.ts b/apps/edr-freight-api/src/modules/bookings/dto/create-booking.dto.ts
index 9380faba5..c4d971f51 100644
--- a/apps/edr-freight-api/src/modules/bookings/dto/create-booking.dto.ts
+++ b/apps/edr-freight-api/src/modules/bookings/dto/create-booking.dto.ts
@@ -52,6 +52,28 @@ export class CreateBookingContainerDto {
   @Min(0)
   @Transform(({ value }) => Number(value))
   vgmPerUnitTons!: number;
+
+  @ApiPropertyOptional({
+    description: 'How many of this line are hazardous (0..quantity)',
+    minimum: 0,
+    default: 0,
+  })
+  @IsOptional()
+  @IsInt()
+  @Min(0)
+  @Transform(({ value }) => Number(value ?? 0))
+  hazardousQuantity?: number;
+
+  @ApiPropertyOptional({
+    description: 'How many of this line are refrigerated (0..quantity)',
+    minimum: 0,
+    default: 0,
+  })
+  @IsOptional()
+  @IsInt()
+  @Min(0)
+  @Transform(({ value }) => Number(value ?? 0))
+  reeferQuantity?: number;
 }
 
 /**
@@ -320,6 +342,25 @@ export class CreateBookingDto {
   @Transform(({ value }) => value === 'true' || value === true)
   isReefer?: boolean;
 
+  /**
+   * Bulk-only: how much of the cargo is hazardous / refrigerated, in the cargo's
+   * unit of measure (tons for PER_TON, item count for PER_ITEM). Must not exceed
+   * cargoTotalWeightVgm. Ignored for container freight (per-line on containers).
+   */
+  @ApiPropertyOptional({ minimum: 0, default: 0 })
+  @IsOptional()
+  @IsNumber()
+  @Min(0)
+  @Transform(({ value }) => Number(value ?? 0))
+  bulkHazardousQuantity?: number;
+
+  @ApiPropertyOptional({ minimum: 0, default: 0 })
+  @IsOptional()
+  @IsNumber()
+  @Min(0)
+  @Transform(({ value }) => Number(value ?? 0))
+  bulkReeferQuantity?: number;
+
   @ApiProperty({ enum: PAYMENT_CURRENCIES })
   @IsIn([...PAYMENT_CURRENCIES])
   paymentCurrency!: string;
diff --git a/apps/edr-freight-api/src/modules/bookings/dto/customer-truck-assignment.dto.ts b/apps/edr-freight-api/src/modules/bookings/dto/customer-truck-assignment.dto.ts
new file mode 100644
index 000000000..9daf7523e
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/bookings/dto/customer-truck-assignment.dto.ts
@@ -0,0 +1,34 @@
+import { IsIn, IsNotEmpty, IsString, Matches, MaxLength } from 'class-validator';
+
+export const CUSTOMER_TRUCK_TYPES = [
+  'Flatbed',
+  'Container Chassis',
+  'Lowboy',
+  'Box Truck',
+  'Tipper',
+] as const;
+
+export class CustomerTruckAssignmentDto {
+  @IsString()
+  @IsNotEmpty()
+  @MaxLength(32)
+  truckPlateNumber!: string;
+
+  @IsString()
+  @IsNotEmpty()
+  @MaxLength(120)
+  driverName!: string;
+
+  @IsString()
+  @IsNotEmpty()
+  @IsIn(CUSTOMER_TRUCK_TYPES)
+  truckType!: string;
+
+  @IsString()
+  @IsNotEmpty()
+  @MaxLength(16)
+  @Matches(/^[A-Z]{4}\d{7}$/, {
+    message: 'containerNumberToLoad must match ISO container format, e.g. ABCD1234567',
+  })
+  containerNumberToLoad!: string;
+}
diff --git a/apps/edr-freight-api/src/modules/bookings/entities/booking.entity.ts b/apps/edr-freight-api/src/modules/bookings/entities/booking.entity.ts
index 19aa3a199..910d3f103 100644
--- a/apps/edr-freight-api/src/modules/bookings/entities/booking.entity.ts
+++ b/apps/edr-freight-api/src/modules/bookings/entities/booking.entity.ts
@@ -51,6 +51,7 @@ export const BOOKING_STATUSES = [
   // Road (truck) drawdown orders skip the train batch pool and wait here for
   // truck dispatch after Marketing accepts; billed by KM, not wagons.
   'ROAD_DISPATCH_PENDING',
+  'TRUCK_ASSIGNED',
   'OPERATION_REQUESTED',
   // Operations review gate: customer picks a schedule day and submits the
   // operation request; the operations team reviews capacity/docs/route before
@@ -260,6 +261,24 @@ export class Booking extends BaseEntity {
   @Column({ name: 'last_mile_delivery_lng', type: 'numeric', precision: 10, scale: 7, nullable: true })
   lastMileDeliveryLng?: number | null;
 
+  @Column({ name: 'customer_truck_plate_number', type: 'varchar', length: 32, nullable: true })
+  customerTruckPlateNumber?: string | null;
+
+  @Column({ name: 'customer_truck_driver_name', type: 'varchar', length: 120, nullable: true })
+  customerTruckDriverName?: string | null;
+
+  @Column({ name: 'customer_truck_type', type: 'varchar', length: 60, nullable: true })
+  customerTruckType?: string | null;
+
+  @Column({ name: 'customer_truck_container_number', type: 'varchar', length: 16, nullable: true })
+  customerTruckContainerNumber?: string | null;
+
+  @Column({ name: 'customer_truck_assigned_at', type: 'timestamptz', nullable: true })
+  customerTruckAssignedAt?: Date | null;
+
+  @Column({ name: 'customer_truck_arrived_at', type: 'timestamptz', nullable: true })
+  customerTruckArrivedAt?: Date | null;
+
   @Column({ name: 'customs_clearing_enabled', type: 'boolean', default: false })
   customsClearingEnabled!: boolean;
 
@@ -321,6 +340,19 @@ export class Booking extends BaseEntity {
   @Column({ name: 'is_reefer', type: 'boolean', default: false })
   isReefer!: boolean;
 
+  /**
+   * Bulk-only hazardous / reefer amount, in the cargo's own unit of measure
+   * (tons for PER_TON commodities, item count for PER_ITEM) — i.e. how much of
+   * `cargoTotalWeightVgm` is hazardous / refrigerated. 0 when none. Container
+   * freight carries this per line on `booking_container` instead, so these stay
+   * 0 for CONTAINER bookings. The booleans above remain the surcharge trigger.
+   */
+  @Column({ name: 'bulk_hazardous_quantity', type: 'numeric', precision: 12, scale: 3, default: 0 })
+  bulkHazardousQuantity!: number;
+
+  @Column({ name: 'bulk_reefer_quantity', type: 'numeric', precision: 12, scale: 3, default: 0 })
+  bulkReeferQuantity!: number;
+
   @Column({ name: 'payment_currency', type: 'varchar', length: 5 })
   paymentCurrency!: string;
 
@@ -435,6 +467,25 @@ export class Booking extends BaseEntity {
   @Column({ name: 'gl_station_yard_id', type: 'uuid', nullable: true })
   glStationYardId?: string | null;
 
+  /** Per-booking phased clearance (GENERAL + customs). */
+  @Column({ name: 'clearance_current_phase', type: 'varchar', length: 40, nullable: true })
+  clearanceCurrentPhase?: string | null;
+
+  @Column({ name: 'duty_required', type: 'boolean', nullable: true })
+  dutyRequired?: boolean | null;
+
+  @Column({ name: 'vessel_departure_date', type: 'date', nullable: true })
+  vesselDepartureDate?: string | null;
+
+  @Column({ name: 'ro_amendment_requested_at', type: 'timestamptz', nullable: true })
+  roAmendmentRequestedAt?: Date | null;
+
+  @Column({ name: 'ro_hold_reason', type: 'text', nullable: true })
+  roHoldReason?: string | null;
+
+  @Column({ name: 'pre_clearance_finalized_at', type: 'timestamptz', nullable: true })
+  preClearanceFinalizedAt?: Date | null;
+
   /** GL staff user bound to this shipment by the station manager. */
   @Column({ name: 'gl_assigned_staff_id', type: 'uuid', nullable: true })
   glAssignedStaffId?: string | null;
diff --git a/apps/edr-freight-api/src/modules/bookings/pay.controller.ts b/apps/edr-freight-api/src/modules/bookings/pay.controller.ts
deleted file mode 100644
index 25f1927d3..000000000
--- a/apps/edr-freight-api/src/modules/bookings/pay.controller.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Controller, Param, ParseUUIDPipe, Post } from '@nestjs/common';
-import { ApiBearerAuth, ApiOkResponse, ApiOperation, ApiTags } from '@nestjs/swagger';
-
-import { BookingPaymentService } from './booking-payment.service';
-// import { BookingTransitionService } from './booking-transition.service';
-// import { InAppPaymentReceiptDto } from './dto/pay-booking.dto';
-// import { Booking } from './entities/booking.entity';
-// import { BookingNextStep } from './booking-next-step.util';
-
-@ApiTags('payments')
-@ApiBearerAuth()
-@Controller('bookings')
-export class PayController {
-  constructor(
-    private readonly paymentService: BookingPaymentService,
-    // private readonly transitionService: BookingTransitionService,
-  ) { }
-
-  @Post(':id/payment/pay')
-  @ApiOperation({ summary: 'Complete in-app payment (mock)' })
-  @ApiOkResponse({ description: 'Enriched booking with ephemeral payment receipt' })
-  async pay(@Param('id', ParseUUIDPipe) id: string) {
-    return await this.paymentService.pay(id);
-    // const abstract = await this.transitionService.enrichBookingResponse(booking);
-    // return { ...abstract, paymentReceipt: receipt };
-  }
-}
diff --git a/apps/edr-freight-api/src/modules/contracts/booking-clearance.service.spec.ts b/apps/edr-freight-api/src/modules/contracts/booking-clearance.service.spec.ts
new file mode 100644
index 000000000..7ea818e34
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/contracts/booking-clearance.service.spec.ts
@@ -0,0 +1,188 @@
+import { BadRequestException } from '@nestjs/common';
+import { ContractDocPhase } from '@edr/types';
+
+import { BookingClearanceService } from './booking-clearance.service';
+import type { Booking } from '../bookings/entities/booking.entity';
+
+const generalImportBooking = {
+  id: 'b-general',
+  status: 'DOCUMENTS_UNDER_REVIEW',
+  tradeDirection: 'IMPORT',
+  freightType: 'CONTAINER',
+  customsClearingEnabled: true,
+  contractKind: 'GENERAL',
+  contractId: 'c-1',
+  dutyRequired: true,
+  roHoldReason: null,
+  vesselDepartureDate: null,
+} as Booking;
+
+const generalExportBooking = {
+  ...generalImportBooking,
+  id: 'b-export',
+  tradeDirection: 'EXPORT',
+  dutyRequired: null,
+} as Booking;
+
+function makeService(overrides?: {
+  booking?: Booking;
+  workflowThrows?: boolean;
+}) {
+  const booking = overrides?.booking ?? generalImportBooking;
+  const bookingsRepository = {
+    findDocumentReviews: jest.fn().mockResolvedValue([]),
+    update: jest.fn().mockResolvedValue(booking),
+  };
+  const bookingsService = {
+    findById: jest.fn().mockResolvedValue(booking),
+  };
+  const filesService = {
+    upsertByCode: jest.fn().mockResolvedValue({}),
+    findByResource: jest.fn().mockResolvedValue([]),
+  };
+  const fileUploadSettingsService = {
+    getByCode: jest.fn().mockRejectedValue(new Error('no setting')),
+  };
+  const workflowService = {
+    assertPriorCompleteForBooking: overrides?.workflowThrows
+      ? jest.fn().mockRejectedValue(new BadRequestException('Prior milestone incomplete'))
+      : jest.fn().mockResolvedValue(undefined),
+    completeMilestoneForBooking: jest.fn().mockResolvedValue(undefined),
+    onDeclarationUploadedForBooking: jest.fn().mockResolvedValue(undefined),
+    onDutySkippedForBooking: jest.fn().mockResolvedValue(undefined),
+    listMilestonesForBooking: jest.fn().mockResolvedValue([]),
+    resolvePhaseForBooking: jest.fn().mockReturnValue(null),
+    computeNextActionForBooking: jest.fn().mockReturnValue(null),
+    isBoundaryCompleteForBooking: jest.fn().mockResolvedValue(false),
+    markReadyForOperation: jest.fn().mockResolvedValue(undefined),
+    onExportReleasedForBooking: jest.fn().mockResolvedValue(undefined),
+  };
+  const milestoneService = {
+    adviseDuty: jest.fn().mockResolvedValue(undefined),
+  };
+  const dropdownSettingsService = {
+    getByCode: jest.fn().mockResolvedValue({
+      children: [{ value: '2' }],
+    }),
+  };
+
+  const service = new BookingClearanceService(
+    bookingsRepository as never,
+    bookingsService as never,
+    filesService as never,
+    fileUploadSettingsService as never,
+    workflowService as never,
+    milestoneService as never,
+    dropdownSettingsService as never,
+  );
+
+  return {
+    service,
+    bookingsRepository,
+    bookingsService,
+    filesService,
+    workflowService,
+    milestoneService,
+  };
+}
+
+describe('BookingClearanceService', () => {
+  describe('adviseDuty', () => {
+    it('skips duty milestones when duty is not required', async () => {
+      const { service, workflowService, bookingsRepository } = makeService();
+      await service.adviseDuty('b-general', { dutyRequired: false });
+
+      expect(workflowService.onDutySkippedForBooking).toHaveBeenCalledWith('b-general');
+      expect(bookingsRepository.update).toHaveBeenCalledWith(
+        'b-general',
+        expect.objectContaining({
+          dutyRequired: false,
+          clearanceCurrentPhase: ContractDocPhase.GlEtPostClearance,
+        }),
+      );
+    });
+
+    it('records duty advice when duty applies', async () => {
+      const { service, milestoneService } = makeService();
+      await service.adviseDuty('b-general', {
+        dutyRequired: true,
+        amount: 1500,
+        currency: 'ETB',
+        declarationSerial: 'DS-1',
+      });
+
+      expect(milestoneService.adviseDuty).toHaveBeenCalledWith(
+        'b-general',
+        expect.objectContaining({ amount: 1500, currency: 'ETB', declarationSerial: 'DS-1' }),
+        undefined,
+      );
+    });
+  });
+
+  describe('uploadDutySlip', () => {
+    it('rejects when duty is not required', async () => {
+      const { service } = makeService({
+        booking: { ...generalImportBooking, dutyRequired: false } as Booking,
+      });
+      await expect(
+        service.uploadDutySlip('b-general', { fieldname: 'file' } as Express.Multer.File),
+      ).rejects.toBeInstanceOf(BadRequestException);
+    });
+
+    it('uploads slip and completes DUTY_TAX_PAID on happy path', async () => {
+      const { service, filesService, workflowService, bookingsRepository } = makeService();
+      const file = { fieldname: 'file' } as Express.Multer.File;
+
+      await service.uploadDutySlip('b-general', file);
+
+      expect(filesService.upsertByCode).toHaveBeenCalledWith(
+        expect.objectContaining({
+          resourceId: 'b-general',
+          code: 'duty_tax_receipt',
+          file,
+        }),
+      );
+      expect(workflowService.completeMilestoneForBooking).toHaveBeenCalledWith(
+        'b-general',
+        'DUTY_TAX_PAID',
+      );
+      expect(bookingsRepository.update).toHaveBeenCalledWith(
+        'b-general',
+        expect.objectContaining({
+          clearanceCurrentPhase: ContractDocPhase.GlEtPostClearance,
+        }),
+      );
+    });
+  });
+
+  describe('uploadDeclaration', () => {
+    it('rejects when a prior milestone is incomplete', async () => {
+      const { service } = makeService({ workflowThrows: true });
+      await expect(
+        service.uploadDeclaration('b-general', [{ fieldname: 'decl' } as Express.Multer.File]),
+      ).rejects.toBeInstanceOf(BadRequestException);
+    });
+  });
+
+  describe('uploadReleaseOrder', () => {
+    it('places RO on hold when vessel departs too soon', async () => {
+      const tomorrow = new Date();
+      tomorrow.setDate(tomorrow.getDate() + 1);
+      const dateStr = tomorrow.toISOString().slice(0, 10);
+
+      const { service, bookingsRepository } = makeService({ booking: generalExportBooking });
+      const result = await service.uploadReleaseOrder(
+        'b-export',
+        { fieldname: 'ro' } as Express.Multer.File,
+        dateStr,
+      );
+
+      expect(result.hold).toBe(true);
+      expect(result.holdReason).toMatch(/minimum lead time/i);
+      expect(bookingsRepository.update).toHaveBeenCalledWith(
+        'b-export',
+        expect.objectContaining({ roHoldReason: expect.any(String) }),
+      );
+    });
+  });
+});
diff --git a/apps/edr-freight-api/src/modules/contracts/booking-clearance.service.ts b/apps/edr-freight-api/src/modules/contracts/booking-clearance.service.ts
new file mode 100644
index 000000000..7bb835df2
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/contracts/booking-clearance.service.ts
@@ -0,0 +1,618 @@
+import { BadRequestException, Injectable } from '@nestjs/common';
+import { ContractDocPhase } from '@edr/types';
+
+import { DropdownSettingsService } from '../dropdown-settings/dropdown-settings.service';
+import { FileUploadSettingsService } from '../file-upload-settings/file-upload-settings.service';
+import { FilesService } from '../files/files.service';
+import { BookingsRepository } from '../bookings/bookings.repository';
+import { BookingsService } from '../bookings/bookings.service';
+import { ClearanceMilestone } from './entities/clearance-milestone.entity';
+import { Booking } from '../bookings/entities/booking.entity';
+import { clearanceCodesForBooking } from '../bookings/clearance.util';
+import { ClearanceWorkflowService } from './clearance-workflow.service';
+import { ClearanceMilestoneService } from './clearance-milestone.service';
+import { AdviseContractDutyDto } from './dto/phased-clearance.dto';
+import { buildWorkflowFiles, belongsOnDjClearanceQueue, belongsOnEtClearanceQueue, DJ_BOOKING_QUEUE_STATUSES, persistDeclarationUploads, persistTransitPermitUploads, PHASED_CUSTOMS_BOOKING_QUEUE_STATUSES } from './phased-clearance.util';
+
+const RO_VESSEL_MIN_DAYS_CODE = 'ro_vessel_min_days';
+
+export interface BookingClearanceView {
+  bookingId: string;
+  status: string;
+  includesCustoms: boolean;
+  inputCode: string | null;
+  outputCode: string | null;
+  documents: Array<{
+    fileKey: string;
+    label: string;
+    required: boolean;
+    uploadedBy: 'customer' | 'gl';
+    settingCode: string;
+    file: { id: string; name: string; url: string } | null;
+    reviewStatus: 'PENDING' | 'APPROVED' | 'QUERIED' | null;
+    note: string | null;
+  }>;
+  allApproved: boolean;
+  phase?: string | null;
+  milestones?: Array<{
+    id: string;
+    milestoneCode: string;
+    milestoneLabel: string;
+    status: string;
+    ownerRegion?: string | null;
+    metadata?: Record<string, unknown> | null;
+    sortOrder: number;
+  }>;
+  nextAction?: {
+    actor: string;
+    action: string;
+    milestoneCode?: string | null;
+    blockedReason?: string | null;
+  } | null;
+  dutyRequired?: boolean | null;
+  roHold?: boolean;
+  roHoldReason?: string | null;
+  vesselDepartureDate?: string | null;
+  roAmendmentRequestedAt?: string | null;
+  operationReady?: boolean;
+  preClearanceFinalized?: boolean;
+  dutyAdvice?: {
+    amount: number;
+    currency: string;
+    declarationSerial?: string | null;
+    noticeFile?: { id: string; name: string; url: string } | null;
+  } | null;
+  workflowFiles?: ReturnType<typeof buildWorkflowFiles>;
+}
+
+@Injectable()
+export class BookingClearanceService {
+  constructor(
+    private readonly bookingsRepository: BookingsRepository,
+    private readonly bookingsService: BookingsService,
+    private readonly filesService: FilesService,
+    private readonly fileUploadSettingsService: FileUploadSettingsService,
+    private readonly workflowService: ClearanceWorkflowService,
+    private readonly milestoneService: ClearanceMilestoneService,
+    private readonly dropdownSettingsService: DropdownSettingsService,
+  ) {}
+
+  private async assertPhasedGeneralCustoms(booking: Booking): Promise<void> {
+    if (!booking.customsClearingEnabled) {
+      throw new BadRequestException('Phased clearance applies only to customs bookings.');
+    }
+    if (booking.contractKind !== 'GENERAL') {
+      throw new BadRequestException('Per-booking phased clearance applies to general contracts.');
+    }
+    if (!booking.contractId) {
+      throw new BadRequestException('Booking is not linked to a contract.');
+    }
+  }
+
+  private async loadBooking(bookingId: string): Promise<Booking> {
+    const booking = await this.bookingsService.findById(bookingId);
+    await this.assertPhasedGeneralCustoms(booking);
+    return booking;
+  }
+
+  async getClearanceView(bookingId: string): Promise<BookingClearanceView> {
+    const booking = await this.loadBooking(bookingId);
+    const { inputCode, outputCode, includesCustoms } = clearanceCodesForBooking(booking);
+
+    const files = await this.filesService.findByResource(bookingId, 'bookings');
+    const fileByCode = new Map(files.map((f) => [f.code, f]));
+    const reviews = await this.bookingsRepository.findDocumentReviews(bookingId);
+    const reviewByKey = new Map(reviews.map((r) => [`${r.settingCode}:${r.fileKey}`, r]));
+
+    const documents: BookingClearanceView['documents'] = [];
+
+    const pushSetting = async (code: string | null, uploadedBy: 'customer' | 'gl') => {
+      if (!code) return;
+      let setting;
+      try {
+        setting = await this.fileUploadSettingsService.getByCode(code);
+      } catch {
+        return;
+      }
+      for (const field of setting.fields ?? []) {
+        const file = fileByCode.get(field.fileKey) ?? null;
+        const review = reviewByKey.get(`${code}:${field.fileKey}`) ?? null;
+        documents.push({
+          fileKey: field.fileKey,
+          label: field.fileLabel,
+          required: field.isRequired,
+          uploadedBy,
+          settingCode: code,
+          file: file ? { id: file.id, name: file.name, url: file.url } : null,
+          reviewStatus: review?.status ?? null,
+          note: review?.note ?? null,
+        });
+      }
+    };
+
+    await pushSetting(inputCode, 'customer');
+    await pushSetting(outputCode, 'gl');
+
+    for (const f of files) {
+      if (!f.code?.startsWith('custom_')) continue;
+      const review = reviewByKey.get(`custom:${f.code}`) ?? null;
+      documents.push({
+        fileKey: f.code,
+        label: f.name,
+        required: false,
+        uploadedBy: 'customer',
+        settingCode: 'custom',
+        file: { id: f.id, name: f.name, url: f.url },
+        reviewStatus: review?.status ?? null,
+        note: review?.note ?? null,
+      });
+    }
+
+    const allApproved = await this.isClearanceFullyApproved(booking);
+    const milestones = await this.workflowService.listMilestonesForBooking(bookingId);
+    const phase = this.workflowService.resolvePhaseForBooking(booking, milestones);
+    const nextAction = this.workflowService.computeNextActionForBooking(booking, milestones);
+    const boundary = await this.workflowService.isBoundaryCompleteForBooking(
+      bookingId,
+      booking.tradeDirection ?? 'IMPORT',
+    );
+    const dutyAdvice = this.buildDutyAdvice(files, milestones);
+    const workflowFiles = buildWorkflowFiles(
+      files,
+      booking.tradeDirection ?? 'IMPORT',
+    );
+
+    return {
+      bookingId,
+      status: booking.status,
+      includesCustoms,
+      inputCode,
+      outputCode,
+      documents,
+      allApproved,
+      phase,
+      milestones: milestones.map((m) => ({
+        id: m.id,
+        milestoneCode: m.milestoneCode,
+        milestoneLabel: m.milestoneLabel,
+        status: m.status,
+        ownerRegion: m.ownerRegion,
+        metadata: (m.metadata ?? null) as Record<string, unknown> | null,
+        sortOrder: m.sortOrder,
+      })),
+      nextAction,
+      dutyRequired: booking.dutyRequired ?? null,
+      roHold: Boolean(booking.roHoldReason),
+      roHoldReason: booking.roHoldReason ?? null,
+      vesselDepartureDate: booking.vesselDepartureDate ?? null,
+      roAmendmentRequestedAt: booking.roAmendmentRequestedAt
+        ? booking.roAmendmentRequestedAt.toISOString()
+        : null,
+      operationReady: boundary,
+      preClearanceFinalized: Boolean(booking.preClearanceFinalizedAt),
+      dutyAdvice,
+      workflowFiles,
+    };
+  }
+
+  private buildDutyAdvice(
+    files: Array<{ code?: string | null; id: string; name: string; url: string }>,
+    milestones: ClearanceMilestone[],
+  ): BookingClearanceView['dutyAdvice'] {
+    const advised = milestones.find(
+      (m) => m.milestoneCode === 'DUTY_TAXES_ADVISED' && m.status === 'COMPLETED',
+    );
+    if (!advised?.metadata) return null;
+    const amount = advised.metadata.dutyAmount;
+    const currency = advised.metadata.dutyCurrency;
+    if (typeof amount !== 'number' || typeof currency !== 'string') return null;
+    const notice = files.find((f) => f.code === 'duty_tax_notice');
+    return {
+      amount,
+      currency,
+      declarationSerial:
+        typeof advised.metadata.declarationSerial === 'string'
+          ? advised.metadata.declarationSerial
+          : null,
+      noticeFile: notice
+        ? { id: notice.id, name: notice.name, url: notice.url }
+        : null,
+    };
+  }
+
+  private async isClearanceFullyApproved(booking: Booking): Promise<boolean> {
+    const { inputCode } = clearanceCodesForBooking(booking);
+    if (!inputCode) return true;
+    let setting;
+    try {
+      setting = await this.fileUploadSettingsService.getByCode(inputCode);
+    } catch {
+      return false;
+    }
+    const required = (setting.fields ?? []).filter((f) => f.isRequired);
+    if (required.length === 0) return true;
+    const reviews = await this.bookingsRepository.findDocumentReviews(booking.id);
+    return required.every((field) =>
+      reviews.some(
+        (r) =>
+          r.settingCode === inputCode &&
+          r.fileKey === field.fileKey &&
+          r.status === 'APPROVED',
+      ),
+    );
+  }
+
+  isPhasedGeneralCustomsBooking(booking: Booking): boolean {
+    return (
+      Boolean(booking.customsClearingEnabled) &&
+      booking.contractKind === 'GENERAL' &&
+      Boolean(booking.contractId)
+    );
+  }
+
+  async uploadDeclaration(
+    bookingId: string,
+    files: Express.Multer.File[],
+    userId?: string,
+  ): Promise<Booking> {
+    const booking = await this.loadBooking(bookingId);
+    const tradeDirection = booking.tradeDirection ?? 'IMPORT';
+    const allApproved = await this.isClearanceFullyApproved(booking);
+    if (!allApproved) {
+      throw new BadRequestException(
+        'All required customer documents must be approved before uploading a declaration.',
+      );
+    }
+    const milestones = await this.workflowService.listMilestonesForBooking(bookingId);
+    const docsApproved = milestones.find((m) => m.milestoneCode === 'DOCUMENTS_APPROVED');
+    if (docsApproved?.status !== 'COMPLETED' && docsApproved?.status !== 'SKIPPED') {
+      await this.workflowService.onAllDocsApprovedForBooking(bookingId);
+    }
+    await this.workflowService.assertPriorCompleteForBooking(
+      bookingId,
+      tradeDirection,
+      'UNDER_CUSTOMS_CLEARANCE',
+    );
+
+    if (files.length === 0) {
+      throw new BadRequestException('No declaration documents uploaded');
+    }
+
+    await persistDeclarationUploads(this.filesService, bookingId, 'bookings', files);
+
+    await this.workflowService.onDeclarationUploadedForBooking(bookingId, userId);
+    await this.bookingsRepository.update(bookingId, {
+      clearanceCurrentPhase:
+        tradeDirection === 'EXPORT'
+          ? ContractDocPhase.GlEtPostClearance
+          : ContractDocPhase.CustomerDuty,
+    } as never);
+
+    return this.bookingsService.findById(bookingId);
+  }
+
+  async adviseDuty(
+    bookingId: string,
+    dto: AdviseContractDutyDto,
+    userId?: string,
+    attachment?: Express.Multer.File,
+  ): Promise<Booking> {
+    const booking = await this.loadBooking(bookingId);
+    if (booking.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Duty advice applies only to import bookings.');
+    }
+    await this.workflowService.assertPriorCompleteForBooking(
+      bookingId,
+      'IMPORT',
+      'DUTY_TAXES_ADVISED',
+    );
+
+    await this.bookingsRepository.update(bookingId, {
+      dutyRequired: dto.dutyRequired,
+      clearanceCurrentPhase: dto.dutyRequired
+        ? ContractDocPhase.CustomerDuty
+        : ContractDocPhase.GlEtPostClearance,
+    } as never);
+
+    if (!dto.dutyRequired) {
+      await this.workflowService.onDutySkippedForBooking(bookingId);
+    } else {
+      if (dto.amount == null || dto.amount < 0) {
+        throw new BadRequestException('Duty amount is required when duty applies.');
+      }
+      if (!attachment) {
+        throw new BadRequestException('Duty notice attachment is required when duty applies.');
+      }
+      await this.filesService.upsertByCode({
+        resourceId: bookingId,
+        resource: 'bookings',
+        code: 'duty_tax_notice',
+        file: attachment,
+      });
+      await this.milestoneService.adviseDuty(
+        bookingId,
+        {
+          amount: dto.amount,
+          currency: dto.currency ?? 'ETB',
+          declarationSerial: dto.declarationSerial,
+        },
+        userId,
+      );
+    }
+
+    return this.bookingsService.findById(bookingId);
+  }
+
+  async uploadDutySlip(bookingId: string, file: Express.Multer.File): Promise<Booking> {
+    const booking = await this.loadBooking(bookingId);
+    if (booking.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Duty slip upload applies only to import bookings.');
+    }
+    if (!booking.dutyRequired) {
+      throw new BadRequestException('Duty/tax is not required for this clearance.');
+    }
+    if (!file) throw new BadRequestException('No payment slip uploaded');
+
+    await this.filesService.upsertByCode({
+      resourceId: bookingId,
+      resource: 'bookings',
+      code: 'duty_tax_receipt',
+      file,
+    });
+
+    await this.workflowService.completeMilestoneForBooking(bookingId, 'DUTY_TAX_PAID');
+    await this.bookingsRepository.update(bookingId, {
+      clearanceCurrentPhase: ContractDocPhase.GlEtPostClearance,
+    } as never);
+
+    return this.bookingsService.findById(bookingId);
+  }
+
+  async uploadTransitPermit(
+    bookingId: string,
+    files: Express.Multer.File[],
+    userId?: string,
+  ): Promise<Booking> {
+    const booking = await this.loadBooking(bookingId);
+    if (booking.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Transit permit applies only to import bookings.');
+    }
+    await this.workflowService.assertPriorCompleteForBooking(
+      bookingId,
+      'IMPORT',
+      'TRANSIT_PERMIT_UPLOADED',
+    );
+    if (files.length === 0) {
+      throw new BadRequestException('No transit permit documents uploaded');
+    }
+
+    await persistTransitPermitUploads(this.filesService, bookingId, 'bookings', files);
+
+    await this.workflowService.completeMilestoneForBooking(
+      bookingId,
+      'TRANSIT_PERMIT_UPLOADED',
+      userId,
+    );
+    await this.bookingsRepository.update(bookingId, {
+      clearanceCurrentPhase: ContractDocPhase.GlEtPostClearance,
+    } as never);
+
+    return this.bookingsService.findById(bookingId);
+  }
+
+  async finalizePreClearance(bookingId: string): Promise<Booking> {
+    const booking = await this.loadBooking(bookingId);
+    if (booking.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Pre-clearance finalize applies only to import bookings.');
+    }
+
+    await this.workflowService.assertPriorCompleteForBooking(
+      bookingId,
+      'IMPORT',
+      'TRANSIT_PERMIT_UPLOADED',
+    );
+
+    if (booking.preClearanceFinalizedAt) {
+      return this.bookingsService.findById(bookingId);
+    }
+
+    await this.bookingsRepository.update(bookingId, {
+      preClearanceFinalizedAt: new Date(),
+      clearanceCurrentPhase: ContractDocPhase.GlDjCollection,
+    } as never);
+
+    return this.bookingsService.findById(bookingId);
+  }
+
+  async uploadDeliveryOrder(
+    bookingId: string,
+    file: Express.Multer.File,
+    userId?: string,
+  ): Promise<Booking> {
+    const booking = await this.loadBooking(bookingId);
+    if (booking.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Delivery Order applies only to import bookings.');
+    }
+
+    if (!booking.preClearanceFinalizedAt) {
+      throw new BadRequestException(
+        'GL Ethiopia must finalize pre-clearance before the Delivery Order can be uploaded.',
+      );
+    }
+
+    await this.workflowService.assertPriorCompleteForBooking(bookingId, 'IMPORT', 'DO_COLLECTED');
+    if (!file) throw new BadRequestException('No Delivery Order uploaded');
+
+    await this.filesService.upsertByCode({
+      resourceId: bookingId,
+      resource: 'bookings',
+      code: 'delivery_order',
+      file,
+    });
+
+    await this.workflowService.completeMilestoneForBooking(bookingId, 'DO_COLLECTED', userId);
+    await this.workflowService.markReadyForOperation(bookingId);
+
+    return this.bookingsService.findById(bookingId);
+  }
+
+  private async resolveRoMinDays(): Promise<number> {
+    try {
+      const setting = await this.dropdownSettingsService.getByCode(RO_VESSEL_MIN_DAYS_CODE);
+      const first = setting.children?.[0];
+      const n = Number(first?.value);
+      return Number.isFinite(n) && n > 0 ? n : 2;
+    } catch {
+      return 2;
+    }
+  }
+
+  private daysUntil(dateStr: string): number {
+    const target = new Date(dateStr);
+    const today = new Date();
+    today.setHours(0, 0, 0, 0);
+    target.setHours(0, 0, 0, 0);
+    return Math.floor((target.getTime() - today.getTime()) / (24 * 60 * 60 * 1000));
+  }
+
+  async uploadReleaseOrder(
+    bookingId: string,
+    file: Express.Multer.File,
+    vesselDepartureDate: string,
+    userId?: string,
+  ): Promise<{ booking: Booking; hold: boolean; holdReason?: string }> {
+    const booking = await this.loadBooking(bookingId);
+    if (booking.tradeDirection !== 'EXPORT') {
+      throw new BadRequestException('Release Order applies only to export bookings.');
+    }
+    await this.workflowService.assertPriorCompleteForBooking(
+      bookingId,
+      'EXPORT',
+      'RELEASE_ORDER_SECURED',
+    );
+
+    if (!file) throw new BadRequestException('No Release Order uploaded');
+    if (!vesselDepartureDate?.trim()) {
+      throw new BadRequestException('Vessel departure date is required');
+    }
+
+    const minDays = await this.resolveRoMinDays();
+    const leadDays = this.daysUntil(vesselDepartureDate);
+
+    await this.filesService.upsertByCode({
+      resourceId: bookingId,
+      resource: 'bookings',
+      code: 'release_order',
+      file,
+    });
+
+    await this.bookingsRepository.update(bookingId, {
+      vesselDepartureDate,
+      roAmendmentRequestedAt: null,
+    } as never);
+
+    if (leadDays < minDays) {
+      const reason = `Vessel departs in ${leadDays} day(s) — minimum lead time is ${minDays} day(s). Request a port amendment or upload a new RO with a later date.`;
+      await this.bookingsRepository.update(bookingId, {
+        roHoldReason: reason,
+        clearanceCurrentPhase: ContractDocPhase.GlDjCollection,
+      } as never);
+      return {
+        booking: await this.bookingsService.findById(bookingId),
+        hold: true,
+        holdReason: reason,
+      };
+    }
+
+    await this.bookingsRepository.update(bookingId, {
+      roHoldReason: null,
+      clearanceCurrentPhase: ContractDocPhase.GlEtOutput,
+    } as never);
+    await this.workflowService.completeMilestoneForBooking(
+      bookingId,
+      'RELEASE_ORDER_SECURED',
+      userId,
+    );
+
+    return { booking: await this.bookingsService.findById(bookingId), hold: false };
+  }
+
+  async requestRoAmendment(
+    bookingId: string,
+    note?: string,
+    userId?: string,
+  ): Promise<Booking> {
+    const booking = await this.loadBooking(bookingId);
+    if (booking.tradeDirection !== 'EXPORT') {
+      throw new BadRequestException('RO amendment applies only to export bookings.');
+    }
+
+    const reason =
+      note?.trim() ||
+      'Port amendment requested — vessel departure window is too short. A new Release Order will be required.';
+
+    await this.bookingsRepository.update(bookingId, {
+      roAmendmentRequestedAt: new Date(),
+      roHoldReason: reason,
+      clearanceCurrentPhase: ContractDocPhase.GlDjCollection,
+    } as never);
+
+    if (userId) {
+      await this.bookingsRepository.createReviewNote(
+        bookingId,
+        reason,
+        'CHANGES_REQUESTED',
+        userId,
+      );
+    }
+
+    return this.bookingsService.findById(bookingId);
+  }
+
+  async confirmExportRelease(bookingId: string, userId?: string): Promise<Booking> {
+    const booking = await this.loadBooking(bookingId);
+    if (booking.tradeDirection !== 'EXPORT') {
+      throw new BadRequestException('Export release applies only to export bookings.');
+    }
+    await this.workflowService.assertPriorCompleteForBooking(
+      bookingId,
+      'EXPORT',
+      'EXPORT_RELEASED',
+    );
+    await this.workflowService.onExportReleasedForBooking(bookingId, userId);
+    return this.bookingsService.findById(bookingId);
+  }
+
+  async etQueue(): Promise<Booking[]> {
+    const candidates = await this.bookingsRepository.findByStatuses([
+      ...PHASED_CUSTOMS_BOOKING_QUEUE_STATUSES,
+    ]);
+    const filtered: Booking[] = [];
+    for (const b of candidates) {
+      if (!this.isPhasedGeneralCustomsBooking(b)) continue;
+      const milestones = await this.workflowService.listMilestonesForBooking(b.id);
+      if (belongsOnEtClearanceQueue(milestones)) filtered.push(b);
+    }
+    return filtered;
+  }
+
+  async djQueue(): Promise<Booking[]> {
+    const candidates = await this.bookingsRepository.findByStatuses([
+      ...DJ_BOOKING_QUEUE_STATUSES,
+    ]);
+    const filtered: Booking[] = [];
+    for (const b of candidates) {
+      if (!this.isPhasedGeneralCustomsBooking(b)) continue;
+      const milestones = await this.workflowService.listMilestonesForBooking(b.id);
+      if (
+        belongsOnDjClearanceQueue(b.tradeDirection, null, milestones, {
+          roHoldReason: b.roHoldReason,
+          preClearanceFinalizedAt: b.preClearanceFinalizedAt,
+        })
+      ) {
+        filtered.push(b);
+      }
+    }
+    return filtered;
+  }
+}
diff --git a/apps/edr-freight-api/src/modules/contracts/booking-request.repository.ts b/apps/edr-freight-api/src/modules/contracts/booking-request.repository.ts
index 9529cabbe..7a3695768 100644
--- a/apps/edr-freight-api/src/modules/contracts/booking-request.repository.ts
+++ b/apps/edr-freight-api/src/modules/contracts/booking-request.repository.ts
@@ -34,7 +34,17 @@ export class BookingRequestRepository extends BaseRepository<BookingRequest> {
   async findById(id: string): Promise<BookingRequest | null> {
     return this.repository.findOne({
       where: { id },
-      relations: { contract: true },
+      // Load the contract with the bits the detail page surfaces: customer
+      // (company), service type (mile/customs flags), routes (with yard labels)
+      // and cargo scope.
+      relations: {
+        contract: {
+          company: true,
+          serviceType: true,
+          routes: { originYard: true, destinationYard: true },
+          cargoScope: true,
+        },
+      },
     });
   }
 
diff --git a/apps/edr-freight-api/src/modules/contracts/clearance-milestone.catalog.ts b/apps/edr-freight-api/src/modules/contracts/clearance-milestone.catalog.ts
index 3389933a7..ce6f7bea4 100644
--- a/apps/edr-freight-api/src/modules/contracts/clearance-milestone.catalog.ts
+++ b/apps/edr-freight-api/src/modules/contracts/clearance-milestone.catalog.ts
@@ -22,6 +22,11 @@ const IMPORT_DEFS: Record<string, Omit<MilestoneDef, 'code'>> = {
   DECLARED: { label: 'Declared', ownerRegion: 'ET', triggeredByDoc: true },
   DUTY_TAXES_ADVISED: { label: 'Duty and Taxes Advised', ownerRegion: 'ET', triggeredByDoc: false },
   DUTY_TAX_PAID: { label: 'Duty and Tax Paid', ownerRegion: 'CUST', triggeredByDoc: true },
+  TRANSIT_PERMIT_UPLOADED: {
+    label: 'Transit Permit Uploaded',
+    ownerRegion: 'ET',
+    triggeredByDoc: true,
+  },
   DO_COLLECTED: { label: 'DO Collected', ownerRegion: 'DJ', triggeredByDoc: true },
   WAGON_REQUESTED: { label: 'Wagon Allocation Requested', ownerRegion: 'ET', triggeredByDoc: false },
   FREIGHT_PAYMENT_SETTLED: { label: 'Payment Settled (freight)', ownerRegion: 'CUST', triggeredByDoc: true },
@@ -52,6 +57,11 @@ const EXPORT_DEFS: Record<string, Omit<MilestoneDef, 'code'>> = {
   FREIGHT_PAYMENT_PENDING: { label: 'Pending Payment', ownerRegion: 'CUST', triggeredByDoc: false },
   FREIGHT_PAYMENT_SETTLED: { label: 'Payment Settled', ownerRegion: 'CUST', triggeredByDoc: true },
   WAGON_ALLOCATED: { label: 'Wagon Allocated', ownerRegion: 'OPS', triggeredByDoc: false },
+  EXPORT_TRANSPORT_ISSUED: {
+    label: 'Export Transport Document Issued',
+    ownerRegion: 'ET',
+    triggeredByDoc: true,
+  },
   CARGO_ARRIVED: { label: 'Cargo Arrived', ownerRegion: 'OPS', triggeredByDoc: false },
   READY_FOR_LOADING: { label: 'Ready for Loading', ownerRegion: 'OPS', triggeredByDoc: false },
   LOADED: { label: 'Loaded', ownerRegion: 'OPS', triggeredByDoc: false },
diff --git a/apps/edr-freight-api/src/modules/contracts/clearance-milestone.service.ts b/apps/edr-freight-api/src/modules/contracts/clearance-milestone.service.ts
index 947fc6979..7d30b1c5b 100644
--- a/apps/edr-freight-api/src/modules/contracts/clearance-milestone.service.ts
+++ b/apps/edr-freight-api/src/modules/contracts/clearance-milestone.service.ts
@@ -1,4 +1,4 @@
-import { BadRequestException, Injectable, NotFoundException } from '@nestjs/common';
+import { Injectable, NotFoundException } from '@nestjs/common';
 import { DataSource } from 'typeorm';
 
 import {
@@ -39,6 +39,15 @@ export class ClearanceMilestoneService {
     });
   }
 
+  /** Seed pre-booking milestones on a booking (GENERAL + customs per-shipment clearance). */
+  async seedPreBookingMilestonesOnBooking(
+    bookingId: string,
+    tradeDirection: string,
+  ): Promise<void> {
+    const { preBooking } = splitMilestones(tradeDirection);
+    await this.seed(preBooking, { bookingId });
+  }
+
   /** Seed the post-booking milestones onto a freshly created booking. */
   async seedPostBookingMilestones(
     bookingId: string,
@@ -94,7 +103,7 @@ export class ClearanceMilestoneService {
       throw new NotFoundException(`Milestone ${code} not found for booking ${bookingId}`);
     }
     if (milestone.status === 'COMPLETED') {
-      throw new BadRequestException(`Milestone ${code} is already completed.`);
+      return milestone;
     }
     milestone.status = 'COMPLETED';
     milestone.triggeredAt = new Date();
@@ -178,7 +187,7 @@ export class ClearanceMilestoneService {
       throw new NotFoundException(`Milestone ${code} not found for contract ${contractId}`);
     }
     if (milestone.status === 'COMPLETED') {
-      throw new BadRequestException(`Milestone ${code} is already completed.`);
+      return milestone;
     }
     milestone.status = 'COMPLETED';
     milestone.triggeredAt = new Date();
@@ -187,6 +196,99 @@ export class ClearanceMilestoneService {
     return this.repo.save(milestone);
   }
 
+  /** Skip optional milestones (e.g. duty when not required). */
+  /** Reopen a completed contract milestone so review can continue after a query. */
+  async reopenForContract(contractId: string, code: string): Promise<void> {
+    const milestone = await this.repo.findOne({ where: { contractId, milestoneCode: code } });
+    if (!milestone || milestone.status !== 'COMPLETED') return;
+    milestone.status = 'PENDING';
+    milestone.triggeredAt = null;
+    milestone.triggeredByUserId = null;
+    await this.repo.save(milestone);
+  }
+
+  /** Reopen a completed booking milestone so review can continue after a query. */
+  async reopenForBooking(bookingId: string, code: string): Promise<void> {
+    const milestone = await this.repo.findOne({ where: { bookingId, milestoneCode: code } });
+    if (!milestone || milestone.status !== 'COMPLETED') return;
+    milestone.status = 'PENDING';
+    milestone.triggeredAt = null;
+    milestone.triggeredByUserId = null;
+    await this.repo.save(milestone);
+  }
+
+  async skipForContract(contractId: string, code: string): Promise<ClearanceMilestone> {
+    const milestone = await this.repo.findOne({ where: { contractId, milestoneCode: code } });
+    if (!milestone) {
+      throw new NotFoundException(`Milestone ${code} not found for contract ${contractId}`);
+    }
+    if (milestone.status === 'COMPLETED') return milestone;
+    milestone.status = 'SKIPPED';
+    milestone.triggeredAt = new Date();
+    return this.repo.save(milestone);
+  }
+
+  async skipForBooking(bookingId: string, code: string): Promise<ClearanceMilestone> {
+    const milestone = await this.repo.findOne({ where: { bookingId, milestoneCode: code } });
+    if (!milestone) {
+      throw new NotFoundException(`Milestone ${code} not found for booking ${bookingId}`);
+    }
+    if (milestone.status === 'COMPLETED') return milestone;
+    milestone.status = 'SKIPPED';
+    milestone.triggeredAt = new Date();
+    return this.repo.save(milestone);
+  }
+
+  async completeWithMetadataForBooking(
+    bookingId: string,
+    code: string,
+    metadata: MilestoneMetadata,
+    userId?: string,
+    note?: string,
+  ): Promise<ClearanceMilestone> {
+    return this.completeWithMetadata(bookingId, code, metadata, userId, note);
+  }
+
+  /** Complete a contract milestone with structured metadata (duty advice, etc.). */
+  async completeWithMetadataForContract(
+    contractId: string,
+    code: string,
+    metadata: MilestoneMetadata,
+    userId?: string,
+    note?: string,
+  ): Promise<ClearanceMilestone> {
+    const milestone = await this.repo.findOne({ where: { contractId, milestoneCode: code } });
+    if (!milestone) {
+      throw new NotFoundException(`Milestone ${code} not found for contract ${contractId}`);
+    }
+    if (milestone.status === 'COMPLETED') {
+      return milestone;
+    }
+    milestone.status = 'COMPLETED';
+    milestone.triggeredAt = new Date();
+    milestone.triggeredByUserId = userId ?? null;
+    milestone.metadata = { ...(milestone.metadata ?? {}), ...metadata };
+    if (note) milestone.note = note;
+    return this.repo.save(milestone);
+  }
+
+  async adviseDutyForContract(
+    contractId: string,
+    input: { amount: number; currency: string; declarationSerial?: string },
+    userId?: string,
+  ): Promise<ClearanceMilestone> {
+    return this.completeWithMetadataForContract(
+      contractId,
+      'DUTY_TAXES_ADVISED',
+      {
+        dutyAmount: input.amount,
+        dutyCurrency: input.currency,
+        declarationSerial: input.declarationSerial,
+      },
+      userId,
+    );
+  }
+
   /** Complete a doc-triggered milestone when its document is uploaded/approved. */
   async completeByDocTrigger(
     scope: { bookingId?: string; contractId?: string },
diff --git a/apps/edr-freight-api/src/modules/contracts/clearance-workflow.service.spec.ts b/apps/edr-freight-api/src/modules/contracts/clearance-workflow.service.spec.ts
new file mode 100644
index 000000000..f30b64597
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/contracts/clearance-workflow.service.spec.ts
@@ -0,0 +1,331 @@
+import { BadRequestException } from '@nestjs/common';
+import { ContractDocPhase } from '@edr/types';
+
+import { ClearanceWorkflowService } from './clearance-workflow.service';
+import type { ClearanceMilestone } from './entities/clearance-milestone.entity';
+import type { Contract } from './entities/contract.entity';
+import type { ContractClearanceCycle } from './entities/contract-clearance-cycle.entity';
+import type { Booking } from '../bookings/entities/booking.entity';
+
+function ms(
+  code: string,
+  status: 'PENDING' | 'COMPLETED' | 'SKIPPED',
+  ownerRegion: 'ET' | 'DJ' | 'CUST' | 'OPS' = 'ET',
+): ClearanceMilestone {
+  return { milestoneCode: code, status, ownerRegion } as ClearanceMilestone;
+}
+
+function importThroughDeclaration(): ClearanceMilestone[] {
+  return [
+    ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+    ms('PENDING_DOCUMENT_REVIEW', 'COMPLETED', 'ET'),
+    ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+    ms('UNDER_CUSTOMS_CLEARANCE', 'PENDING', 'ET'),
+    ms('DECLARED', 'PENDING', 'ET'),
+    ms('DUTY_TAXES_ADVISED', 'PENDING', 'ET'),
+    ms('DUTY_TAX_PAID', 'PENDING', 'CUST'),
+    ms('TRANSIT_PERMIT_UPLOADED', 'PENDING', 'ET'),
+    ms('DO_COLLECTED', 'PENDING', 'DJ'),
+  ];
+}
+
+function makeService(milestones: ClearanceMilestone[]) {
+  const contractsRepository = {
+    currentCycle: jest.fn(),
+    update: jest.fn(),
+    setCycleStatus: jest.fn(),
+    updateCycle: jest.fn(),
+  };
+  const milestoneService = {
+    listForContract: jest.fn().mockResolvedValue(milestones),
+    listForBooking: jest.fn().mockResolvedValue(milestones),
+    skipForContract: jest.fn(),
+    completeForContract: jest.fn(),
+    completeWithMetadataForContract: jest.fn(),
+  };
+  const bookingsRepository = { update: jest.fn() };
+  const service = new ClearanceWorkflowService(
+    contractsRepository as never,
+    milestoneService as never,
+    bookingsRepository as never,
+  );
+  return { service, milestoneService, contractsRepository, bookingsRepository };
+}
+
+const importContract = {
+  id: 'c-import',
+  tradeDirection: 'IMPORT',
+  customsClearingEnabled: true,
+  contractKind: 'ONE_TIME',
+} as Contract;
+
+const exportContract = {
+  id: 'c-export',
+  tradeDirection: 'EXPORT',
+  customsClearingEnabled: true,
+  contractKind: 'ONE_TIME',
+} as Contract;
+
+describe('ClearanceWorkflowService', () => {
+  describe('boundaryMilestone', () => {
+    it('uses DO_COLLECTED for import and EXPORT_RELEASED for export', () => {
+      const { service } = makeService([]);
+      expect(service.boundaryMilestone('IMPORT')).toBe('DO_COLLECTED');
+      expect(service.boundaryMilestone('EXPORT')).toBe('EXPORT_RELEASED');
+    });
+  });
+
+  describe('assertPriorComplete', () => {
+    it('rejects when a prior milestone is still pending', async () => {
+      const milestones = importThroughDeclaration().map((m) =>
+        m.milestoneCode === 'DOCUMENTS_APPROVED'
+          ? ms('DOCUMENTS_APPROVED', 'PENDING', 'ET')
+          : m,
+      );
+      const { service } = makeService(milestones);
+      await expect(
+        service.assertPriorComplete('c-import', 'IMPORT', 'DECLARED'),
+      ).rejects.toBeInstanceOf(BadRequestException);
+    });
+
+    it('allows proceeding when prior milestones are completed or skipped', async () => {
+      const milestones = [
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('PENDING_DOCUMENT_REVIEW', 'COMPLETED', 'ET'),
+        ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+        ms('UNDER_CUSTOMS_CLEARANCE', 'COMPLETED', 'ET'),
+        ms('DECLARED', 'COMPLETED', 'ET'),
+        ms('DUTY_TAXES_ADVISED', 'SKIPPED', 'ET'),
+        ms('DUTY_TAX_PAID', 'SKIPPED', 'CUST'),
+        ms('TRANSIT_PERMIT_UPLOADED', 'PENDING', 'ET'),
+        ms('DO_COLLECTED', 'PENDING', 'DJ'),
+      ];
+      const { service } = makeService(milestones);
+      await expect(
+        service.assertPriorComplete('c-import', 'IMPORT', 'TRANSIT_PERMIT_UPLOADED'),
+      ).resolves.toBeUndefined();
+    });
+  });
+
+  describe('isBoundaryComplete', () => {
+    it('returns true only when boundary milestone is completed', async () => {
+      const done = [
+        ...importThroughDeclaration().slice(0, -1),
+        ms('DO_COLLECTED', 'COMPLETED', 'DJ'),
+      ];
+      const { service: doneSvc } = makeService(done);
+      await expect(doneSvc.isBoundaryComplete('c-import', 'IMPORT')).resolves.toBe(true);
+
+      const pending = importThroughDeclaration();
+      const { service: pendingSvc } = makeService(pending);
+      await expect(pendingSvc.isBoundaryComplete('c-import', 'IMPORT')).resolves.toBe(false);
+    });
+  });
+
+  describe('onDutySkipped', () => {
+    it('skips duty milestones on the contract', async () => {
+      const { service, milestoneService } = makeService([]);
+      await service.onDutySkipped('c-import');
+      expect(milestoneService.skipForContract).toHaveBeenCalledWith(
+        'c-import',
+        'DUTY_TAXES_ADVISED',
+      );
+      expect(milestoneService.skipForContract).toHaveBeenCalledWith(
+        'c-import',
+        'DUTY_TAX_PAID',
+      );
+    });
+  });
+
+  describe('computeNextAction — import happy path', () => {
+    it('prompts customer to upload docs first', () => {
+      const { service } = makeService([ms('IMPORT_DOCS_UPLOADED', 'PENDING', 'CUST')]);
+      const next = service.computeNextAction(importContract, null, [
+        ms('IMPORT_DOCS_UPLOADED', 'PENDING', 'CUST'),
+      ]);
+      expect(next?.actor).toBe('CUSTOMER');
+      expect(next?.milestoneCode).toBe('IMPORT_DOCS_UPLOADED');
+    });
+
+    it('prompts ET review after customer docs', () => {
+      const milestones = [
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'PENDING', 'ET'),
+      ];
+      const { service } = makeService(milestones);
+      const next = service.computeNextAction(importContract, null, milestones);
+      expect(next?.actor).toBe('GL_ET');
+      expect(next?.action).toMatch(/Review/i);
+    });
+
+    it('prompts duty toggle when declaration done and duty unset', () => {
+      const milestones = [
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+        ms('DECLARED', 'COMPLETED', 'ET'),
+        ms('DUTY_TAXES_ADVISED', 'PENDING', 'ET'),
+      ];
+      const cycle = { dutyRequired: null } as ContractClearanceCycle;
+      const { service } = makeService(milestones);
+      const next = service.computeNextAction(importContract, cycle, milestones);
+      expect(next?.actor).toBe('GL_ET');
+      expect(next?.action).toMatch(/duty/i);
+    });
+
+    it('prompts customer duty slip when duty required and advised', () => {
+      const milestones = [
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+        ms('DECLARED', 'COMPLETED', 'ET'),
+        ms('DUTY_TAXES_ADVISED', 'COMPLETED', 'ET'),
+        ms('DUTY_TAX_PAID', 'PENDING', 'CUST'),
+      ];
+      const cycle = { dutyRequired: true } as ContractClearanceCycle;
+      const { service } = makeService(milestones);
+      const next = service.computeNextAction(importContract, cycle, milestones);
+      expect(next?.actor).toBe('CUSTOMER');
+      expect(next?.milestoneCode).toBe('DUTY_TAX_PAID');
+    });
+
+    it('skips duty path when duty not required', () => {
+      const milestones = [
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+        ms('DECLARED', 'COMPLETED', 'ET'),
+        ms('DUTY_TAXES_ADVISED', 'SKIPPED', 'ET'),
+        ms('DUTY_TAX_PAID', 'SKIPPED', 'CUST'),
+        ms('TRANSIT_PERMIT_UPLOADED', 'PENDING', 'ET'),
+      ];
+      const cycle = { dutyRequired: false } as ContractClearanceCycle;
+      const { service } = makeService(milestones);
+      const next = service.computeNextAction(importContract, cycle, milestones);
+      expect(next?.actor).toBe('GL_ET');
+      expect(next?.milestoneCode).toBe('TRANSIT_PERMIT_UPLOADED');
+    });
+
+    it('prompts ET to finalize pre-clearance after transit permit', () => {
+      const milestones = [
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+        ms('DECLARED', 'COMPLETED', 'ET'),
+        ms('DUTY_TAXES_ADVISED', 'SKIPPED', 'ET'),
+        ms('DUTY_TAX_PAID', 'SKIPPED', 'CUST'),
+        ms('TRANSIT_PERMIT_UPLOADED', 'COMPLETED', 'ET'),
+        ms('DO_COLLECTED', 'PENDING', 'DJ'),
+      ];
+      const cycle = { dutyRequired: false } as ContractClearanceCycle;
+      const { service } = makeService(milestones);
+      const next = service.computeNextAction(importContract, cycle, milestones);
+      expect(next?.actor).toBe('GL_ET');
+      expect(next?.action).toMatch(/finalize pre-clearance/i);
+    });
+
+    it('prompts DJ for DO then ET booking when pre-booking complete', () => {
+      const milestones = [
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+        ms('DECLARED', 'COMPLETED', 'ET'),
+        ms('DUTY_TAXES_ADVISED', 'SKIPPED', 'ET'),
+        ms('DUTY_TAX_PAID', 'SKIPPED', 'CUST'),
+        ms('TRANSIT_PERMIT_UPLOADED', 'COMPLETED', 'ET'),
+        ms('DO_COLLECTED', 'PENDING', 'DJ'),
+      ];
+      const cycle = {
+        dutyRequired: false,
+        preClearanceFinalizedAt: new Date(),
+      } as ContractClearanceCycle;
+      const { service } = makeService(milestones);
+      const djNext = service.computeNextAction(importContract, cycle, milestones);
+      expect(djNext?.actor).toBe('GL_DJ');
+
+      const booked = milestones.map((m) =>
+        m.milestoneCode === 'DO_COLLECTED' ? ms('DO_COLLECTED', 'COMPLETED', 'DJ') : m,
+      );
+      const etNext = service.computeNextAction(importContract, cycle, booked);
+      expect(etNext?.actor).toBe('GL_ET');
+      expect(etNext?.action).toMatch(/booking/i);
+    });
+  });
+
+  describe('computeNextAction — export RO hold', () => {
+    it('surfaces DJ action when RO is on hold', () => {
+      const milestones = [
+        ms('EXPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+        ms('RELEASE_ORDER_SECURED', 'PENDING', 'DJ'),
+      ];
+      const cycle = {
+        roHoldReason: 'Vessel departs in 1 day(s) — minimum lead time is 2 day(s).',
+      } as ContractClearanceCycle;
+      const { service } = makeService(milestones);
+      const next = service.computeNextAction(exportContract, cycle, milestones);
+      expect(next?.actor).toBe('GL_DJ');
+      expect(next?.blockedReason).toMatch(/minimum lead time/i);
+    });
+  });
+
+  describe('inferPhase', () => {
+    it('places import contract in customer duty phase when duty outstanding', () => {
+      const milestones = [
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+        ms('DECLARED', 'COMPLETED', 'ET'),
+        ms('DUTY_TAX_PAID', 'PENDING', 'CUST'),
+      ];
+      const cycle = { dutyRequired: true } as ContractClearanceCycle;
+      const { service } = makeService(milestones);
+      const phase = service.inferPhase(importContract, cycle, milestones);
+      expect(phase).toBe(ContractDocPhase.CustomerDuty);
+    });
+  });
+
+  describe('queue helpers', () => {
+    it('returns first pending ET-owned milestone code', () => {
+      const { service } = makeService([
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'PENDING', 'ET'),
+        ms('DO_COLLECTED', 'PENDING', 'DJ'),
+      ]);
+      expect(service.etPendingMilestoneCodes([])).toBeNull();
+      expect(
+        service.etPendingMilestoneCodes([
+          ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+          ms('DOCUMENTS_APPROVED', 'PENDING', 'ET'),
+        ]),
+      ).toBe('DOCUMENTS_APPROVED');
+    });
+
+    it('returns first pending DJ-owned milestone code', () => {
+      const { service } = makeService([]);
+      expect(
+        service.djPendingMilestoneCodes([
+          ms('TRANSIT_PERMIT_UPLOADED', 'COMPLETED', 'ET'),
+          ms('DO_COLLECTED', 'PENDING', 'DJ'),
+        ]),
+      ).toBe('DO_COLLECTED');
+    });
+  });
+
+  describe('computeNextActionForBooking', () => {
+    it('prompts customer to proceed after import boundary on booking', () => {
+      const booking = {
+        tradeDirection: 'IMPORT',
+        dutyRequired: false,
+        preClearanceFinalizedAt: new Date(),
+      } as Booking;
+      const milestones = [
+        ms('IMPORT_DOCS_UPLOADED', 'COMPLETED', 'CUST'),
+        ms('DOCUMENTS_APPROVED', 'COMPLETED', 'ET'),
+        ms('DECLARED', 'COMPLETED', 'ET'),
+        ms('DUTY_TAXES_ADVISED', 'SKIPPED', 'ET'),
+        ms('DUTY_TAX_PAID', 'SKIPPED', 'CUST'),
+        ms('TRANSIT_PERMIT_UPLOADED', 'COMPLETED', 'ET'),
+        ms('DO_COLLECTED', 'COMPLETED', 'DJ'),
+      ];
+      const { service } = makeService(milestones);
+      const next = service.computeNextActionForBooking(booking, milestones);
+      expect(next?.actor).toBe('CUSTOMER');
+      expect(next?.action).toMatch(/operation/i);
+    });
+  });
+});
diff --git a/apps/edr-freight-api/src/modules/contracts/clearance-workflow.service.ts b/apps/edr-freight-api/src/modules/contracts/clearance-workflow.service.ts
new file mode 100644
index 000000000..758da27ff
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/contracts/clearance-workflow.service.ts
@@ -0,0 +1,566 @@
+import { BadRequestException, Injectable } from '@nestjs/common';
+import { ContractDocPhase } from '@edr/types';
+
+import { ContractsRepository } from './contracts.repository';
+import { ClearanceMilestoneService } from './clearance-milestone.service';
+import { MilestoneMetadata } from './entities/clearance-milestone.entity';
+import { splitMilestones } from './clearance-milestone.catalog';
+import { Contract } from './entities/contract.entity';
+import { ContractClearanceCycle } from './entities/contract-clearance-cycle.entity';
+import { ClearanceMilestone } from './entities/clearance-milestone.entity';
+import { BookingsRepository } from '../bookings/bookings.repository';
+import { Booking } from '../bookings/entities/booking.entity';
+import type { ClearanceMetaState } from './clearance-workflow.types';
+import { metaFromBooking } from './clearance-workflow.types';
+
+export type ClearanceActorRole = 'CUSTOMER' | 'GL_ET' | 'GL_DJ' | 'OPERATIONS';
+
+export interface ClearanceNextAction {
+  actor: ClearanceActorRole;
+  action: string;
+  milestoneCode?: string | null;
+  blockedReason?: string | null;
+}
+
+const IMPORT_BOUNDARY = 'DO_COLLECTED';
+const EXPORT_BOUNDARY = 'EXPORT_RELEASED';
+
+const IMPORT_DOC_UPLOADED = 'IMPORT_DOCS_UPLOADED';
+const EXPORT_DOC_UPLOADED = 'EXPORT_DOCS_UPLOADED';
+
+@Injectable()
+export class ClearanceWorkflowService {
+  constructor(
+    private readonly contractsRepository: ContractsRepository,
+    private readonly milestoneService: ClearanceMilestoneService,
+    private readonly bookingsRepository: BookingsRepository,
+  ) {}
+
+  boundaryMilestone(tradeDirection: string): string {
+    return tradeDirection === 'IMPORT' ? IMPORT_BOUNDARY : EXPORT_BOUNDARY;
+  }
+
+  // ── Contract scope (ONE_TIME) ─────────────────────────────────────────────
+
+  async listMilestones(contractId: string): Promise<ClearanceMilestone[]> {
+    return this.milestoneService.listForContract(contractId);
+  }
+
+  async listMilestonesForBooking(bookingId: string): Promise<ClearanceMilestone[]> {
+    return this.milestoneService.listForBooking(bookingId);
+  }
+
+  async isBoundaryComplete(contractId: string, tradeDirection: string): Promise<boolean> {
+    return this.isBoundaryCompleteForMilestones(
+      await this.listMilestones(contractId),
+      tradeDirection,
+    );
+  }
+
+  async isBoundaryCompleteForBooking(
+    bookingId: string,
+    tradeDirection: string,
+  ): Promise<boolean> {
+    return this.isBoundaryCompleteForMilestones(
+      await this.listMilestonesForBooking(bookingId),
+      tradeDirection,
+    );
+  }
+
+  private isBoundaryCompleteForMilestones(
+    milestones: ClearanceMilestone[],
+    tradeDirection: string,
+  ): boolean {
+    const code = this.boundaryMilestone(tradeDirection);
+    const m = milestones.find((x) => x.milestoneCode === code);
+    return m?.status === 'COMPLETED';
+  }
+
+  async assertBoundaryComplete(contract: Contract): Promise<void> {
+    const ok = await this.isBoundaryComplete(contract.id, contract.tradeDirection);
+    if (!ok) {
+      throw new BadRequestException(
+        `Pre-booking clearance is not complete — ${this.boundaryMilestone(contract.tradeDirection)} must be finished before booking.`,
+      );
+    }
+  }
+
+  async assertPriorComplete(
+    contractId: string,
+    tradeDirection: string,
+    targetCode: string,
+  ): Promise<void> {
+    await this.assertPriorCompleteOnMilestones(
+      await this.listMilestones(contractId),
+      tradeDirection,
+      targetCode,
+    );
+  }
+
+  async assertPriorCompleteForBooking(
+    bookingId: string,
+    tradeDirection: string,
+    targetCode: string,
+  ): Promise<void> {
+    await this.assertPriorCompleteOnMilestones(
+      await this.listMilestonesForBooking(bookingId),
+      tradeDirection,
+      targetCode,
+    );
+  }
+
+  private async assertPriorCompleteOnMilestones(
+    milestones: ClearanceMilestone[],
+    tradeDirection: string,
+    targetCode: string,
+  ): Promise<void> {
+    const { preBooking } = splitMilestones(tradeDirection);
+    const byCode = new Map(milestones.map((m) => [m.milestoneCode, m]));
+    const targetIdx = preBooking.findIndex((d) => d.code === targetCode);
+    if (targetIdx < 0) return;
+
+    for (let i = 0; i < targetIdx; i++) {
+
+      const code = preBooking[i]!.code;
+      const m = byCode.get(code);
+      if (!m) continue;
+      if (m.status === 'SKIPPED') continue;
+      if (m.status !== 'COMPLETED') {
+        throw new BadRequestException(
+          `Complete "${preBooking[i]!.label}" before proceeding.`,
+        );
+      }
+    }
+  }
+
+  async skipMilestones(contractId: string, codes: string[]): Promise<void> {
+    for (const code of codes) {
+      await this.milestoneService.skipForContract(contractId, code);
+    }
+  }
+
+  async skipMilestonesForBooking(bookingId: string, codes: string[]): Promise<void> {
+    for (const code of codes) {
+      await this.milestoneService.skipForBooking(bookingId, code);
+    }
+  }
+
+  async completeMilestone(
+    contractId: string,
+    code: string,
+    userId?: string,
+    metadata?: MilestoneMetadata,
+  ): Promise<ClearanceMilestone> {
+    if (metadata && Object.keys(metadata).length > 0) {
+      return this.milestoneService.completeWithMetadataForContract(
+        contractId,
+        code,
+        metadata,
+        userId,
+      );
+    }
+    return this.milestoneService.completeForContract(contractId, code, userId);
+  }
+
+  async completeMilestoneForBooking(
+    bookingId: string,
+    code: string,
+    userId?: string,
+    metadata?: MilestoneMetadata,
+  ): Promise<ClearanceMilestone> {
+    if (metadata && Object.keys(metadata).length > 0) {
+      return this.milestoneService.completeWithMetadataForBooking(
+        bookingId,
+        code,
+        metadata,
+        userId,
+      );
+    }
+    return this.milestoneService.completeForBooking(bookingId, code, userId);
+  }
+
+  async onCustomerDocsUploaded(contractId: string, tradeDirection: string): Promise<void> {
+    const uploaded =
+      tradeDirection === 'IMPORT' ? IMPORT_DOC_UPLOADED : EXPORT_DOC_UPLOADED;
+    await this.completeMilestone(contractId, uploaded);
+    await this.completeMilestone(contractId, 'PENDING_DOCUMENT_REVIEW');
+  }
+
+  async onCustomerDocsUploadedForBooking(
+    bookingId: string,
+    tradeDirection: string,
+  ): Promise<void> {
+    const uploaded =
+      tradeDirection === 'IMPORT' ? IMPORT_DOC_UPLOADED : EXPORT_DOC_UPLOADED;
+    await this.completeMilestoneForBooking(bookingId, uploaded);
+    await this.completeMilestoneForBooking(bookingId, 'PENDING_DOCUMENT_REVIEW');
+  }
+
+  async onAllDocsApproved(contractId: string): Promise<void> {
+    await this.completeMilestone(contractId, 'DOCUMENTS_APPROVED');
+  }
+
+  async onAllDocsApprovedForBooking(bookingId: string): Promise<void> {
+    await this.completeMilestoneForBooking(bookingId, 'DOCUMENTS_APPROVED');
+  }
+
+  /** Customer doc queried or re-uploaded — document approval milestone must reopen. */
+  async onDocumentReviewReopened(contractId: string): Promise<void> {
+    await this.milestoneService.reopenForContract(contractId, 'DOCUMENTS_APPROVED');
+  }
+
+  async onDocumentReviewReopenedForBooking(bookingId: string): Promise<void> {
+    await this.milestoneService.reopenForBooking(bookingId, 'DOCUMENTS_APPROVED');
+  }
+
+  async onDeclarationUploaded(contractId: string, userId?: string): Promise<void> {
+    await this.completeMilestone(contractId, 'UNDER_CUSTOMS_CLEARANCE');
+    await this.completeMilestone(contractId, 'DECLARED', userId);
+  }
+
+  async onDeclarationUploadedForBooking(bookingId: string, userId?: string): Promise<void> {
+    await this.completeMilestoneForBooking(bookingId, 'UNDER_CUSTOMS_CLEARANCE');
+    await this.completeMilestoneForBooking(bookingId, 'DECLARED', userId);
+  }
+
+  async onDutySkipped(contractId: string): Promise<void> {
+    await this.skipMilestones(contractId, ['DUTY_TAXES_ADVISED', 'DUTY_TAX_PAID']);
+  }
+
+  async onDutySkippedForBooking(bookingId: string): Promise<void> {
+    await this.skipMilestonesForBooking(bookingId, ['DUTY_TAXES_ADVISED', 'DUTY_TAX_PAID']);
+  }
+
+  async onExportReleased(contractId: string, userId?: string): Promise<void> {
+    await this.completeMilestone(contractId, 'EXPORT_RELEASED', userId);
+    await this.markReadyForBooking(contractId);
+  }
+
+  async onExportReleasedForBooking(bookingId: string, userId?: string): Promise<void> {
+    await this.completeMilestoneForBooking(bookingId, 'EXPORT_RELEASED', userId);
+    await this.markReadyForOperation(bookingId);
+  }
+
+  async markReadyForBooking(contractId: string): Promise<void> {
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    await this.contractsRepository.update(contractId, {
+      status: 'CLEARANCE_READY_FOR_BOOKING',
+      clearanceStatus: 'CLEARANCE_READY_FOR_BOOKING',
+    } as never);
+    if (cycle) {
+      await this.contractsRepository.setCycleStatus(cycle.id, 'CLEARANCE_READY_FOR_BOOKING', {
+        clearanceReadyAt: new Date(),
+        currentPhase: ContractDocPhase.GlEtPostClearance,
+      });
+      await this.contractsRepository.updateCycle(cycle.id, {
+        currentPhase: ContractDocPhase.GlEtPostClearance,
+      });
+    }
+  }
+
+  /** GENERAL per-booking: boundary complete → customer may proceed to operations. */
+  async markReadyForOperation(bookingId: string): Promise<void> {
+    await this.bookingsRepository.update(bookingId, {
+      status: 'CLEARANCE_READY',
+      clearanceCurrentPhase: ContractDocPhase.GlEtPostClearance,
+    } as never);
+  }
+
+  resolvePhase(
+    contract: Contract,
+    cycle: ContractClearanceCycle | null,
+    milestones: ClearanceMilestone[],
+  ): ContractDocPhase {
+    const meta: ClearanceMetaState = {
+      dutyRequired: cycle?.dutyRequired ?? null,
+      vesselDepartureDate: cycle?.vesselDepartureDate ?? null,
+      roHoldReason: cycle?.roHoldReason ?? null,
+      currentPhase: cycle?.currentPhase ?? null,
+    };
+    return this.resolvePhaseFromMeta(contract.tradeDirection, meta, milestones);
+  }
+
+  resolvePhaseForBooking(
+    booking: Booking,
+    milestones: ClearanceMilestone[],
+  ): ContractDocPhase {
+    return this.resolvePhaseFromMeta(
+      booking.tradeDirection ?? 'IMPORT',
+      metaFromBooking(booking),
+      milestones,
+    );
+  }
+
+  private resolvePhaseFromMeta(
+    tradeDirection: string,
+    meta: ClearanceMetaState,
+    milestones: ClearanceMilestone[],
+  ): ContractDocPhase {
+    if (meta.currentPhase) {
+      return meta.currentPhase as ContractDocPhase;
+    }
+    return this.inferPhaseFromMeta(tradeDirection, meta, milestones);
+  }
+
+  inferPhase(
+    contract: Contract,
+    cycle: ContractClearanceCycle | null,
+    milestones: ClearanceMilestone[],
+  ): ContractDocPhase {
+    return this.inferPhaseFromMeta(
+      contract.tradeDirection,
+      {
+        dutyRequired: cycle?.dutyRequired ?? null,
+        roHoldReason: cycle?.roHoldReason ?? null,
+      },
+      milestones,
+    );
+  }
+
+  inferPhaseForBooking(booking: Booking, milestones: ClearanceMilestone[]): ContractDocPhase {
+    return this.inferPhaseFromMeta(
+      booking.tradeDirection ?? 'IMPORT',
+      metaFromBooking(booking),
+      milestones,
+    );
+  }
+
+  private inferPhaseFromMeta(
+    tradeDirection: string,
+    meta: ClearanceMetaState,
+    milestones: ClearanceMilestone[],
+  ): ContractDocPhase {
+    const byCode = new Map(milestones.map((m) => [m.milestoneCode, m]));
+    const isDone = (code: string) =>
+      byCode.get(code)?.status === 'COMPLETED' || byCode.get(code)?.status === 'SKIPPED';
+
+    const docUploaded =
+      tradeDirection === 'IMPORT'
+        ? isDone(IMPORT_DOC_UPLOADED)
+        : isDone(EXPORT_DOC_UPLOADED);
+
+    if (!docUploaded) return ContractDocPhase.CustomerIntake;
+    if (!isDone('DOCUMENTS_APPROVED')) return ContractDocPhase.GlEtReview;
+
+    if (tradeDirection === 'EXPORT') {
+      if (!isDone('RELEASE_ORDER_SECURED')) {
+        return ContractDocPhase.GlDjCollection;
+      }
+      if (!isDone('DECLARED')) return ContractDocPhase.GlEtOutput;
+      if (!isDone(EXPORT_BOUNDARY)) return ContractDocPhase.GlEtPostClearance;
+      return ContractDocPhase.GlEtPostClearance;
+    }
+
+    if (!isDone('DECLARED')) return ContractDocPhase.GlEtOutput;
+    if (meta.dutyRequired === true && !isDone('DUTY_TAX_PAID')) {
+      return ContractDocPhase.CustomerDuty;
+    }
+    if (!isDone('TRANSIT_PERMIT_UPLOADED')) return ContractDocPhase.GlEtPostClearance;
+    if (!meta.preClearanceFinalizedAt) return ContractDocPhase.GlEtPostClearance;
+    if (!isDone(IMPORT_BOUNDARY)) return ContractDocPhase.GlDjCollection;
+    return ContractDocPhase.GlEtPostClearance;
+  }
+
+  computeNextAction(
+    contract: Contract,
+    cycle: ContractClearanceCycle | null,
+    milestones: ClearanceMilestone[],
+  ): ClearanceNextAction | null {
+    return this.computeNextActionFromMeta(
+      contract.tradeDirection,
+      {
+        dutyRequired: cycle?.dutyRequired ?? null,
+        roHoldReason: cycle?.roHoldReason ?? null,
+        preClearanceFinalizedAt: cycle?.preClearanceFinalizedAt ?? null,
+      },
+      milestones,
+      'contract',
+    );
+  }
+
+  computeNextActionForBooking(
+    booking: Booking,
+    milestones: ClearanceMilestone[],
+  ): ClearanceNextAction | null {
+    return this.computeNextActionFromMeta(
+      booking.tradeDirection ?? 'IMPORT',
+      metaFromBooking(booking),
+      milestones,
+      'booking',
+    );
+  }
+
+  private computeNextActionFromMeta(
+    tradeDirection: string,
+    meta: ClearanceMetaState,
+    milestones: ClearanceMilestone[],
+    terminalScope: 'contract' | 'booking',
+  ): ClearanceNextAction | null {
+    if (meta.roHoldReason) {
+      return {
+        actor: 'GL_DJ',
+        action: 'Re-upload Release Order or request port amendment',
+        milestoneCode: 'RELEASE_ORDER_SECURED',
+        blockedReason: meta.roHoldReason,
+      };
+    }
+
+    const byCode = new Map(milestones.map((m) => [m.milestoneCode, m]));
+    const pending = (code: string) => {
+      const m = byCode.get(code);
+      return m && m.status === 'PENDING';
+    };
+    const isDone = (code: string) => {
+      const m = byCode.get(code);
+      return m?.status === 'COMPLETED' || m?.status === 'SKIPPED';
+    };
+
+    const docCode =
+      tradeDirection === 'IMPORT' ? IMPORT_DOC_UPLOADED : EXPORT_DOC_UPLOADED;
+
+    if (pending(docCode) || !isDone(docCode)) {
+      return {
+        actor: 'CUSTOMER',
+        action: 'Upload clearance documents',
+        milestoneCode: docCode,
+      };
+    }
+
+    if (!isDone('DOCUMENTS_APPROVED')) {
+      return {
+        actor: 'GL_ET',
+        action: 'Review and approve customer documents',
+        milestoneCode: 'DOCUMENTS_APPROVED',
+      };
+    }
+
+    const terminalAction =
+      terminalScope === 'contract'
+        ? 'Create shipment booking'
+        : 'Proceed to request operation';
+
+    if (tradeDirection === 'EXPORT') {
+      if (!isDone('RELEASE_ORDER_SECURED')) {
+        return {
+          actor: 'GL_DJ',
+          action: 'Upload Release Order and vessel departure date',
+          milestoneCode: 'RELEASE_ORDER_SECURED',
+        };
+      }
+      if (!isDone('DECLARED')) {
+        return {
+          actor: 'GL_ET',
+          action: 'Upload customs declaration documents',
+          milestoneCode: 'DECLARED',
+        };
+      }
+      if (!isDone(EXPORT_BOUNDARY)) {
+        return {
+          actor: 'GL_ET',
+          action: 'Confirm export release',
+          milestoneCode: EXPORT_BOUNDARY,
+        };
+      }
+      if (terminalScope === 'booking') {
+        if (!isDone('FREIGHT_PAYMENT_SETTLED')) {
+          return {
+            actor: 'CUSTOMER',
+            action: 'Pay freight charges',
+            milestoneCode: 'FREIGHT_PAYMENT_SETTLED',
+          };
+        }
+        if (!isDone('WAGON_ALLOCATED')) {
+          return {
+            actor: 'OPERATIONS',
+            action: 'Allocate wagon',
+            milestoneCode: 'WAGON_ALLOCATED',
+          };
+        }
+        if (!isDone('EXPORT_TRANSPORT_ISSUED')) {
+          return {
+            actor: 'GL_ET',
+            action: 'Upload transit permit',
+            milestoneCode: 'EXPORT_TRANSPORT_ISSUED',
+          };
+        }
+        return null;
+      }
+      return {
+        actor: terminalScope === 'contract' ? 'GL_ET' : 'CUSTOMER',
+        action: terminalAction,
+        milestoneCode: EXPORT_BOUNDARY,
+      };
+    }
+
+    if (!isDone('DECLARED')) {
+      return {
+        actor: 'GL_ET',
+        action: 'Upload customs declaration documents',
+        milestoneCode: 'DECLARED',
+      };
+    }
+
+    if (meta.dutyRequired === null || meta.dutyRequired === undefined) {
+      return {
+        actor: 'GL_ET',
+        action: 'Set whether duty/tax applies',
+        milestoneCode: 'DUTY_TAXES_ADVISED',
+      };
+    }
+
+    if (meta.dutyRequired && !isDone('DUTY_TAX_PAID')) {
+      if (!isDone('DUTY_TAXES_ADVISED')) {
+        return {
+          actor: 'GL_ET',
+          action: 'Advise duty and tax amount',
+          milestoneCode: 'DUTY_TAXES_ADVISED',
+        };
+      }
+      return {
+        actor: 'CUSTOMER',
+        action: 'Upload duty/tax payment slip',
+        milestoneCode: 'DUTY_TAX_PAID',
+      };
+    }
+
+    if (!isDone('TRANSIT_PERMIT_UPLOADED')) {
+      return {
+        actor: 'GL_ET',
+        action: 'Upload transit permit screenshot',
+        milestoneCode: 'TRANSIT_PERMIT_UPLOADED',
+      };
+    }
+
+    if (!meta.preClearanceFinalizedAt) {
+      return {
+        actor: 'GL_ET',
+        action: 'Finalize pre-clearance',
+        milestoneCode: 'TRANSIT_PERMIT_UPLOADED',
+      };
+    }
+
+    if (!isDone(IMPORT_BOUNDARY)) {
+      return {
+        actor: 'GL_DJ',
+        action: 'Upload Delivery Order',
+        milestoneCode: IMPORT_BOUNDARY,
+      };
+    }
+
+    return {
+      actor: terminalScope === 'contract' ? 'GL_ET' : 'CUSTOMER',
+      action: terminalAction,
+      milestoneCode: IMPORT_BOUNDARY,
+    };
+  }
+
+  etPendingMilestoneCodes(milestones: ClearanceMilestone[]): string | null {
+    const pending = milestones.find((m) => m.status === 'PENDING' && m.ownerRegion === 'ET');
+    return pending?.milestoneCode ?? null;
+  }
+
+  djPendingMilestoneCodes(milestones: ClearanceMilestone[]): string | null {
+    const pending = milestones.find((m) => m.status === 'PENDING' && m.ownerRegion === 'DJ');
+    return pending?.milestoneCode ?? null;
+  }
+}
diff --git a/apps/edr-freight-api/src/modules/contracts/clearance-workflow.types.ts b/apps/edr-freight-api/src/modules/contracts/clearance-workflow.types.ts
new file mode 100644
index 000000000..25d01b17e
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/contracts/clearance-workflow.types.ts
@@ -0,0 +1,33 @@
+import type { ContractDocPhase } from '@edr/types';
+
+/** Shared clearance metadata for contract cycles and per-booking GENERAL clearance. */
+export interface ClearanceMetaState {
+  dutyRequired?: boolean | null;
+  vesselDepartureDate?: string | null;
+  roAmendmentRequestedAt?: Date | null;
+  roHoldReason?: string | null;
+  currentPhase?: ContractDocPhase | string | null;
+  preClearanceFinalizedAt?: Date | null;
+}
+
+export type ClearanceScope =
+  | { kind: 'contract'; contractId: string }
+  | { kind: 'booking'; bookingId: string };
+
+export function metaFromBooking(booking: {
+  dutyRequired?: boolean | null;
+  vesselDepartureDate?: string | null;
+  roAmendmentRequestedAt?: Date | null;
+  roHoldReason?: string | null;
+  clearanceCurrentPhase?: string | null;
+  preClearanceFinalizedAt?: Date | null;
+}): ClearanceMetaState {
+  return {
+    dutyRequired: booking.dutyRequired ?? null,
+    vesselDepartureDate: booking.vesselDepartureDate ?? null,
+    roAmendmentRequestedAt: booking.roAmendmentRequestedAt ?? null,
+    roHoldReason: booking.roHoldReason ?? null,
+    currentPhase: booking.clearanceCurrentPhase ?? null,
+    preClearanceFinalizedAt: booking.preClearanceFinalizedAt ?? null,
+  };
+}
diff --git a/apps/edr-freight-api/src/modules/contracts/contract-booking.service.ts b/apps/edr-freight-api/src/modules/contracts/contract-booking.service.ts
index b077930b7..b0a5cc636 100644
--- a/apps/edr-freight-api/src/modules/contracts/contract-booking.service.ts
+++ b/apps/edr-freight-api/src/modules/contracts/contract-booking.service.ts
@@ -23,6 +23,7 @@ import { Contract } from './entities/contract.entity';
 import { ContractRoute } from './entities/contract-route.entity';
 import { ContractsRepository } from './contracts.repository';
 import { ClearanceMilestoneService } from './clearance-milestone.service';
+import { ClearanceWorkflowService } from './clearance-workflow.service';
 import { CreateBookingUnderContractDto } from './dto/create-booking-under-contract.dto';
 
 /** Statuses that still occupy the single active-booking slot of a ONE_TIME contract. */
@@ -56,6 +57,7 @@ export class ContractBookingService {
     private readonly containerTypesService: ContainerTypesService,
     private readonly ruleEngineService: RuleEngineService,
     private readonly milestoneService: ClearanceMilestoneService,
+    private readonly workflowService: ClearanceWorkflowService,
     private readonly invoiceService: BookingInvoiceService,
     private readonly dataSource: DataSource,
   ) {}
@@ -194,9 +196,11 @@ export class ContractBookingService {
         clearanceStatus: 'ACTIVE_SHIPMENT_IN_PROGRESS',
       } as never);
     } else if (generalCustoms) {
-      // Per-booking clearance: seed post-booking milestones on the booking (no
-      // cycle needed) and leave the contract active. The booking now drives its
-      // own clearance via the booking-level pipeline.
+      // Per-booking clearance: seed full milestone timeline on the booking.
+      await this.milestoneService.seedPreBookingMilestonesOnBooking(
+        booking.id,
+        contract.tradeDirection,
+      );
       await this.milestoneService.seedPostBookingMilestones(
         booking.id,
         contract.tradeDirection,
@@ -246,10 +250,14 @@ export class ContractBookingService {
         }
         return 'GL_ET';
       }
-      // ONE_TIME customs — UNCHANGED: requires the finalized contract cycle.
-      if (contract.clearanceStatus !== 'CLEARANCE_READY_FOR_BOOKING') {
+      // ONE_TIME customs — pre-booking boundary milestone must be complete.
+      const boundaryOk = await this.workflowService.isBoundaryComplete(
+        contract.id,
+        contract.tradeDirection,
+      );
+      if (!boundaryOk) {
         throw new BadRequestException(
-          'Contract clearance is not ready for booking yet.',
+          'Pre-booking clearance is not complete — booking cannot be created yet.',
         );
       }
       return 'GL_ET';
diff --git a/apps/edr-freight-api/src/modules/contracts/contract-clearance.service.ts b/apps/edr-freight-api/src/modules/contracts/contract-clearance.service.ts
index 71cfa0580..a09de407c 100644
--- a/apps/edr-freight-api/src/modules/contracts/contract-clearance.service.ts
+++ b/apps/edr-freight-api/src/modules/contracts/contract-clearance.service.ts
@@ -1,13 +1,23 @@
 import { BadRequestException, ConflictException, Injectable } from '@nestjs/common';
+import { ContractDocPhase } from '@edr/types';
 
+import { DropdownSettingsService } from '../dropdown-settings/dropdown-settings.service';
 import { FileUploadSettingsService } from '../file-upload-settings/file-upload-settings.service';
 import { FilesService } from '../files/files.service';
 import { ContractsRepository } from './contracts.repository';
 import { ContractsService, PaginatedContracts } from './contracts.service';
+import { BookingsService } from '../bookings/bookings.service';
 import { contractClearanceCodes } from './contract-clearance.util';
+import { ClearanceWorkflowService } from './clearance-workflow.service';
+import { ClearanceMilestoneService } from './clearance-milestone.service';
+import { ClearanceMilestone } from './entities/clearance-milestone.entity';
 import { Contract } from './entities/contract.entity';
 import { ContractDocReviewStatus } from './entities/contract-document-review.entity';
 import { FilterContractDto } from './dto/filter-contract.dto';
+import { AdviseContractDutyDto } from './dto/phased-clearance.dto';
+import { buildWorkflowFiles, belongsOnDjClearanceQueue, belongsOnEtClearanceQueue, DJ_CONTRACT_QUEUE_STATUSES, persistDeclarationUploads, persistTransitPermitUploads, PHASED_CUSTOMS_CONTRACT_QUEUE_STATUSES } from './phased-clearance.util';
+
+const RO_VESSEL_MIN_DAYS_CODE = 'ro_vessel_min_days';
 
 export interface ContractClearanceDocument {
   fileKey: string;
@@ -34,6 +44,39 @@ export interface ContractClearanceView {
   outputCode: string | null;
   documents: ContractClearanceDocument[];
   allApproved: boolean;
+  phase?: string | null;
+  milestones?: Array<{
+    id: string;
+    milestoneCode: string;
+    milestoneLabel: string;
+    status: string;
+    ownerRegion?: string | null;
+    metadata?: Record<string, unknown> | null;
+    sortOrder: number;
+  }>;
+  nextAction?: {
+    actor: string;
+    action: string;
+    milestoneCode?: string | null;
+    blockedReason?: string | null;
+  } | null;
+  dutyRequired?: boolean | null;
+  roHold?: boolean;
+  roHoldReason?: string | null;
+  vesselDepartureDate?: string | null;
+  roAmendmentRequestedAt?: string | null;
+  bookingReady?: boolean;
+  preClearanceFinalized?: boolean;
+  /** Export post-booking clearance finalized (transit permit uploaded + GL confirmed). */
+  exportClearanceFinalized?: boolean;
+  linkedBookingId?: string | null;
+  dutyAdvice?: {
+    amount: number;
+    currency: string;
+    declarationSerial?: string | null;
+    noticeFile?: { id: string; name: string; url: string } | null;
+  } | null;
+  workflowFiles?: ReturnType<typeof buildWorkflowFiles>;
 }
 
 @Injectable()
@@ -41,13 +84,57 @@ export class ContractClearanceService {
   constructor(
     private readonly contractsRepository: ContractsRepository,
     private readonly contractsService: ContractsService,
+    private readonly bookingsService: BookingsService,
     private readonly filesService: FilesService,
     private readonly fileUploadSettingsService: FileUploadSettingsService,
+    private readonly workflowService: ClearanceWorkflowService,
+    private readonly milestoneService: ClearanceMilestoneService,
+    private readonly dropdownSettingsService: DropdownSettingsService,
   ) {}
 
+  private isPhasedCustoms(contract: Contract): boolean {
+    return contract.customsClearingEnabled && contract.contractKind === 'ONE_TIME';
+  }
+
+  private assertPhasedCustoms(contract: Contract): void {
+    if (!this.isPhasedCustoms(contract)) {
+      throw new BadRequestException(
+        'Phased clearance (Phase 1) applies to one-time customs contracts.',
+      );
+    }
+  }
+
+  /**
+   * Legacy finalize() used to set CLEARANCE_READY_FOR_BOOKING without completing
+   * phased milestones. Revert that state so declaration / DO steps can proceed.
+   */
+  private async reconcilePrematureBookingReady(
+    contractId: string,
+    contract: Contract,
+    bookingReady: boolean,
+  ): Promise<Contract> {
+    if (
+      !this.isPhasedCustoms(contract) ||
+      contract.status !== 'CLEARANCE_READY_FOR_BOOKING' ||
+      bookingReady
+    ) {
+      return contract;
+    }
+
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    await this.contractsRepository.update(contractId, {
+      status: 'CLEARANCE_UNDER_REVIEW',
+      clearanceStatus: 'DOCUMENTS_UNDER_REVIEW',
+    } as never);
+    if (cycle?.status === 'CLEARANCE_READY_FOR_BOOKING') {
+      await this.contractsRepository.setCycleStatus(cycle.id, 'DOCUMENTS_UNDER_REVIEW');
+    }
+    return this.contractsService.findById(contractId);
+  }
+
   /** The pre-booking clearance document grid for a contract (Path B). */
   async getClearanceView(contractId: string): Promise<ContractClearanceView> {
-    const contract = await this.contractsService.findById(contractId);
+    let contract = await this.contractsService.findById(contractId);
     const { inputCode, outputCode, includesCustoms } = contractClearanceCodes(contract);
     const cycle = await this.contractsRepository.currentCycle(contractId);
 
@@ -109,6 +196,47 @@ export class ContractClearanceService {
     }
 
     const allApproved = await this.isClearanceFullyApproved(contract);
+    const milestones = await this.workflowService.listMilestones(contractId);
+    let boundary = await this.workflowService.isBoundaryComplete(
+      contractId,
+      contract.tradeDirection,
+    );
+    contract = await this.reconcilePrematureBookingReady(contractId, contract, boundary);
+    const phase = this.workflowService.resolvePhase(contract, cycle, milestones);
+    const dutyAdvice = this.buildDutyAdvice(files, milestones);
+    let workflowFiles = buildWorkflowFiles(
+      files,
+      contract.tradeDirection ?? 'IMPORT',
+    );
+    if (cycle?.bookingId) {
+      const bookingFiles = await this.filesService.findByResource(
+        cycle.bookingId,
+        'bookings',
+      );
+      const bookingWorkflow = buildWorkflowFiles(
+        bookingFiles,
+        contract.tradeDirection ?? 'IMPORT',
+      );
+      const byCode = new Map(workflowFiles.map((f) => [f.code, f]));
+      for (const row of bookingWorkflow) {
+        if (row.file) byCode.set(row.code, row);
+      }
+      workflowFiles = [...byCode.values()];
+    }
+
+    let nextAction = this.workflowService.computeNextAction(contract, cycle, milestones);
+    if (cycle?.bookingId && contract.tradeDirection === 'EXPORT') {
+      const bookingMilestones = await this.workflowService.listMilestonesForBooking(
+        cycle.bookingId,
+      );
+      const booking = await this.bookingsService.findById(cycle.bookingId);
+      if (booking) {
+        nextAction = this.workflowService.computeNextActionForBooking(
+          booking,
+          bookingMilestones,
+        );
+      }
+    }
 
     return {
       contractId,
@@ -120,6 +248,55 @@ export class ContractClearanceService {
       outputCode,
       documents,
       allApproved,
+      phase,
+      milestones: milestones.map((m) => ({
+        id: m.id,
+        milestoneCode: m.milestoneCode,
+        milestoneLabel: m.milestoneLabel,
+        status: m.status,
+        ownerRegion: m.ownerRegion,
+        metadata: (m.metadata ?? null) as Record<string, unknown> | null,
+        sortOrder: m.sortOrder,
+      })),
+      nextAction,
+      dutyRequired: cycle?.dutyRequired ?? null,
+      roHold: Boolean(cycle?.roHoldReason),
+      roHoldReason: cycle?.roHoldReason ?? null,
+      vesselDepartureDate: cycle?.vesselDepartureDate ?? null,
+      roAmendmentRequestedAt: cycle?.roAmendmentRequestedAt
+        ? cycle.roAmendmentRequestedAt.toISOString()
+        : null,
+      bookingReady: boundary,
+      preClearanceFinalized: Boolean(cycle?.preClearanceFinalizedAt),
+      exportClearanceFinalized: Boolean(cycle?.completedAt),
+      linkedBookingId: cycle?.bookingId ?? null,
+      dutyAdvice,
+      workflowFiles,
+    };
+  }
+
+  private buildDutyAdvice(
+    files: Array<{ code?: string | null; id: string; name: string; url: string }>,
+    milestones: ClearanceMilestone[],
+  ): ContractClearanceView['dutyAdvice'] {
+    const advised = milestones.find(
+      (m) => m.milestoneCode === 'DUTY_TAXES_ADVISED' && m.status === 'COMPLETED',
+    );
+    if (!advised?.metadata) return null;
+    const amount = advised.metadata.dutyAmount;
+    const currency = advised.metadata.dutyCurrency;
+    if (typeof amount !== 'number' || typeof currency !== 'string') return null;
+    const notice = files.find((f) => f.code === 'duty_tax_notice');
+    return {
+      amount,
+      currency,
+      declarationSerial:
+        typeof advised.metadata.declarationSerial === 'string'
+          ? advised.metadata.declarationSerial
+          : null,
+      noticeFile: notice
+        ? { id: notice.id, name: notice.name, url: notice.url }
+        : null,
     };
   }
 
@@ -154,6 +331,59 @@ export class ContractClearanceService {
     );
   }
 
+  /** Staff may approve/query documents during review, after a query cycle, or post-finalize re-query. */
+  private assertClearanceReviewableStatus(contract: Contract): void {
+    const allowed = [
+      'CLEARANCE_UNDER_REVIEW',
+      'AWAITING_CLEARANCE_DOCUMENTS',
+      'CLEARANCE_READY_FOR_BOOKING',
+    ];
+    if (!allowed.includes(contract.status)) {
+      throw new ConflictException(
+        `Cannot review clearance documents on status "${contract.status}".`,
+      );
+    }
+  }
+
+  /** Finalize when docs are under review or all approved after a partial query cycle. */
+  private assertClearanceFinalizableStatus(contract: Contract): void {
+    const allowed = ['CLEARANCE_UNDER_REVIEW', 'AWAITING_CLEARANCE_DOCUMENTS'];
+    if (!allowed.includes(contract.status)) {
+      throw new ConflictException(
+        `Cannot finalize clearance on status "${contract.status}".`,
+      );
+    }
+  }
+
+  private assertClearanceOutputUploadableStatus(contract: Contract): void {
+    const allowed = ['CLEARANCE_UNDER_REVIEW', 'AWAITING_CLEARANCE_DOCUMENTS'];
+    if (!allowed.includes(contract.status)) {
+      throw new ConflictException(
+        `Cannot upload output documents on status "${contract.status}".`,
+      );
+    }
+  }
+
+  private async bumpToUnderReviewWhenFullyApproved(contractId: string): Promise<void> {
+    const refreshed = await this.contractsService.findById(contractId);
+    const allApproved = await this.isClearanceFullyApproved(refreshed);
+    if (
+      !allApproved ||
+      (refreshed.status !== 'AWAITING_CLEARANCE_DOCUMENTS' &&
+        refreshed.status !== 'CLEARANCE_READY_FOR_BOOKING')
+    ) {
+      return;
+    }
+    await this.contractsRepository.update(contractId, {
+      status: 'CLEARANCE_UNDER_REVIEW',
+      clearanceStatus: 'DOCUMENTS_UNDER_REVIEW',
+    } as never);
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (cycle) {
+      await this.contractsRepository.setCycleStatus(cycle.id, 'DOCUMENTS_UNDER_REVIEW');
+    }
+  }
+
   /**
    * Customer uploads clearance documents on the contract. When every required
    * input is present, auto-advance to CLEARANCE_UNDER_REVIEW for GL ET.
@@ -209,8 +439,16 @@ export class ContractClearanceService {
       clearanceStatus: 'DOCUMENTS_UNDER_REVIEW',
     } as never);
     if (cycle) {
-      await this.contractsRepository.setCycleStatus(cycle.id, 'DOCUMENTS_UNDER_REVIEW');
+      await this.contractsRepository.setCycleStatus(cycle.id, 'DOCUMENTS_UNDER_REVIEW', {
+        currentPhase: ContractDocPhase.GlEtReview,
+      });
     }
+
+    if (contract.customsClearingEnabled && contract.contractKind === 'ONE_TIME') {
+      await this.workflowService.onCustomerDocsUploaded(contractId, contract.tradeDirection);
+      await this.workflowService.onDocumentReviewReopened(contractId);
+    }
+
     return this.contractsService.findById(contractId);
   }
 
@@ -294,25 +532,22 @@ export class ContractClearanceService {
     note?: string,
   ): Promise<Contract> {
     const contract = await this.contractsService.findById(contractId);
-    // Reviewing is allowed both while the batch is UNDER_REVIEW and after it has
-    // dropped back to AWAITING_CLEARANCE_DOCUMENTS — querying one document flips
-    // the contract to "awaiting" (the customer must re-upload), but the reviewer
-    // may still be working through the rest of the batch. Restricting to
-    // UNDER_REVIEW only would 409 every review after the first query.
-    if (
-      contract.status !== 'CLEARANCE_UNDER_REVIEW' &&
-      contract.status !== 'AWAITING_CLEARANCE_DOCUMENTS'
-    ) {
-      throw new ConflictException(
-        `Cannot review clearance documents on status "${contract.status}".`,
-      );
-    }
+    this.assertClearanceReviewableStatus(contract);
     if (status === 'QUERIED' && !note?.trim()) {
       throw new BadRequestException('A note is required when querying a document');
     }
 
     const { inputCode, outputCode } = contractClearanceCodes(contract);
     const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (
+      status === 'QUERIED' &&
+      this.isPhasedCustoms(contract) &&
+      cycle?.preClearanceFinalizedAt
+    ) {
+      throw new BadRequestException(
+        'Customer documents cannot be queried after pre-clearance is finalized.',
+      );
+    }
     const reviews = await this.contractsRepository.findDocumentReviews(
       contractId,
       cycle?.id ?? null,
@@ -348,6 +583,33 @@ export class ContractClearanceService {
       if (cycle) {
         await this.contractsRepository.setCycleStatus(cycle.id, 'AWAITING_DOCUMENTS');
       }
+      if (this.isPhasedCustoms(contract)) {
+        await this.workflowService.onDocumentReviewReopened(contractId);
+        if (cycle) {
+          await this.contractsRepository.updateCycle(cycle.id, {
+            currentPhase: ContractDocPhase.GlEtReview,
+          });
+        }
+      }
+    } else if (status === 'APPROVED') {
+      await this.bumpToUnderReviewWhenFullyApproved(contractId);
+      const refreshed = await this.contractsService.findById(contractId);
+      if (
+        refreshed.customsClearingEnabled &&
+        refreshed.contractKind === 'ONE_TIME' &&
+        (await this.isClearanceFullyApproved(refreshed))
+      ) {
+        await this.workflowService.onAllDocsApproved(contractId);
+        const c = await this.contractsRepository.currentCycle(contractId);
+        if (c) {
+          await this.contractsRepository.updateCycle(c.id, {
+            currentPhase:
+              refreshed.tradeDirection === 'EXPORT'
+                ? ContractDocPhase.GlDjCollection
+                : ContractDocPhase.GlEtOutput,
+          });
+        }
+      }
     }
 
     return this.contractsService.findById(contractId);
@@ -359,11 +621,7 @@ export class ContractClearanceService {
     files: Express.Multer.File[],
   ): Promise<Contract> {
     const contract = await this.contractsService.findById(contractId);
-    if (contract.status !== 'CLEARANCE_UNDER_REVIEW') {
-      throw new ConflictException(
-        `Cannot upload output documents on status "${contract.status}".`,
-      );
-    }
+    this.assertClearanceOutputUploadableStatus(contract);
     const { outputCode } = contractClearanceCodes(contract);
     if (!outputCode) {
       throw new BadRequestException('This contract has no customs output documents');
@@ -384,8 +642,10 @@ export class ContractClearanceService {
 
   /**
    * GL ET finalizes Path B pre-booking clearance: requires every customer
-   * document APPROVED and required output docs present → CLEARANCE_READY_FOR_BOOKING
-   * (GL then creates the booking). Rejects self-clearance (Path A) contracts.
+   * document APPROVED. For phased customs (ONE_TIME), document review completes
+   * here — booking readiness is set only after delivery order (import) or export
+   * release via the milestone workflow. Non-phased customs still jump straight to
+   * CLEARANCE_READY_FOR_BOOKING. Rejects self-clearance (Path A) contracts.
    */
   async finalize(contractId: string): Promise<Contract> {
     const contract = await this.contractsService.findById(contractId);
@@ -394,11 +654,7 @@ export class ContractClearanceService {
         'Self-clearance (Path A) contracts are finalized by Operations, not GL.',
       );
     }
-    if (contract.status !== 'CLEARANCE_UNDER_REVIEW') {
-      throw new ConflictException(
-        `Cannot finalize clearance on status "${contract.status}".`,
-      );
-    }
+    this.assertClearanceFinalizableStatus(contract);
 
     const approved = await this.isClearanceFullyApproved(contract);
     if (!approved) {
@@ -407,6 +663,24 @@ export class ContractClearanceService {
       );
     }
 
+    if (this.isPhasedCustoms(contract)) {
+      await this.workflowService.onAllDocsApproved(contractId);
+      const cycle = await this.contractsRepository.currentCycle(contractId);
+      if (cycle) {
+        await this.contractsRepository.updateCycle(cycle.id, {
+          currentPhase:
+            contract.tradeDirection === 'EXPORT'
+              ? ContractDocPhase.GlDjCollection
+              : ContractDocPhase.GlEtOutput,
+        });
+      }
+      await this.contractsRepository.update(contractId, {
+        status: 'CLEARANCE_UNDER_REVIEW',
+        clearanceStatus: 'DOCUMENTS_UNDER_REVIEW',
+      } as never);
+      return this.contractsService.findById(contractId);
+    }
+
     const { outputCode } = contractClearanceCodes(contract);
     if (outputCode) {
       const setting = await this.fileUploadSettingsService.getByCode(outputCode);
@@ -452,11 +726,7 @@ export class ContractClearanceService {
         'Operations finalize applies only to self-clearance (non-customs) contracts.',
       );
     }
-    if (contract.status !== 'CLEARANCE_UNDER_REVIEW') {
-      throw new ConflictException(
-        `Cannot finalize clearance on status "${contract.status}".`,
-      );
-    }
+    this.assertClearanceFinalizableStatus(contract);
 
     const approved = await this.isClearanceFullyApproved(contract);
     if (!approved) {
@@ -479,19 +749,14 @@ export class ContractClearanceService {
   }
 
   /**
-   * GL ET clearance hub: every customs (Path B) contract that still needs
-   * customs clearance — awaiting the customer's documents, under GL review, or
-   * finalized and waiting for the customer to create the booking in the portal.
+   * GL ET clearance hub: every customs (Path B) contract in phased clearance,
+   * including after booking is created.
    */
   async queue(filter: FilterContractDto): Promise<PaginatedContracts> {
     return this.contractsRepository.findAllPaginated({
       page: filter.page ?? 1,
       pageSize: filter.pageSize ?? 100,
-      statuses: [
-        'AWAITING_CLEARANCE_DOCUMENTS',
-        'CLEARANCE_UNDER_REVIEW',
-        'CLEARANCE_READY_FOR_BOOKING',
-      ],
+      statuses: [...PHASED_CUSTOMS_CONTRACT_QUEUE_STATUSES],
       customsClearingEnabled: true,
       sortBy: filter.sortBy,
       sortOrder: filter.sortOrder,
@@ -536,4 +801,492 @@ export class ContractClearanceService {
       sortOrder: filter.sortOrder ?? 'DESC',
     });
   }
+
+  // ── Phased clearance actions (ONE_TIME customs, Phase 1) ───────────────────
+
+  /** Sync DOCUMENTS_APPROVED when reviews are done but the milestone row lags. */
+  private async ensureDeclarationPrerequisites(
+    contractId: string,
+    contract: Contract,
+  ): Promise<void> {
+    const allApproved = await this.isClearanceFullyApproved(contract);
+    if (!allApproved) {
+      throw new BadRequestException(
+        'All required customer documents must be approved before uploading a declaration.',
+      );
+    }
+    const milestones = await this.workflowService.listMilestones(contractId);
+    const docsApproved = milestones.find((m) => m.milestoneCode === 'DOCUMENTS_APPROVED');
+    if (docsApproved?.status !== 'COMPLETED' && docsApproved?.status !== 'SKIPPED') {
+      await this.workflowService.onAllDocsApproved(contractId);
+    }
+  }
+
+  async uploadDeclaration(
+    contractId: string,
+    files: Express.Multer.File[],
+    userId?: string,
+  ): Promise<Contract> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    await this.ensureDeclarationPrerequisites(contractId, contract);
+    await this.workflowService.assertPriorComplete(
+      contractId,
+      contract.tradeDirection,
+      'UNDER_CUSTOMS_CLEARANCE',
+    );
+
+    if (files.length === 0) {
+      throw new BadRequestException('No declaration documents uploaded');
+    }
+
+    await persistDeclarationUploads(
+      this.filesService,
+      contractId,
+      'contracts',
+      files,
+    );
+
+    await this.workflowService.onDeclarationUploaded(contractId, userId);
+
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (cycle) {
+      await this.contractsRepository.updateCycle(cycle.id, {
+        currentPhase:
+          contract.tradeDirection === 'EXPORT'
+            ? ContractDocPhase.GlEtPostClearance
+            : ContractDocPhase.CustomerDuty,
+      });
+    }
+
+    return this.contractsService.findById(contractId);
+  }
+
+  async adviseDuty(
+    contractId: string,
+    dto: AdviseContractDutyDto,
+    userId?: string,
+    attachment?: Express.Multer.File,
+  ): Promise<Contract> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    if (contract.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Duty advice applies only to import contracts.');
+    }
+    await this.workflowService.assertPriorComplete(contractId, 'IMPORT', 'DUTY_TAXES_ADVISED');
+
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (!cycle) throw new BadRequestException('No clearance cycle found');
+
+    await this.contractsRepository.updateCycle(cycle.id, {
+      dutyRequired: dto.dutyRequired,
+      currentPhase: dto.dutyRequired
+        ? ContractDocPhase.CustomerDuty
+        : ContractDocPhase.GlEtPostClearance,
+    });
+
+    if (!dto.dutyRequired) {
+      await this.workflowService.onDutySkipped(contractId);
+    } else {
+      if (dto.amount == null || dto.amount < 0) {
+        throw new BadRequestException('Duty amount is required when duty applies.');
+      }
+      if (!attachment) {
+        throw new BadRequestException('Duty notice attachment is required when duty applies.');
+      }
+      await this.filesService.upsertByCode({
+        resourceId: contractId,
+        resource: 'contracts',
+        code: 'duty_tax_notice',
+        file: attachment,
+      });
+      await this.milestoneService.adviseDutyForContract(
+        contractId,
+        {
+          amount: dto.amount,
+          currency: dto.currency ?? 'ETB',
+          declarationSerial: dto.declarationSerial,
+        },
+        userId,
+      );
+    }
+
+    return this.contractsService.findById(contractId);
+  }
+
+  async uploadDutySlip(
+    contractId: string,
+    file: Express.Multer.File,
+  ): Promise<Contract> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    if (contract.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Duty slip upload applies only to import contracts.');
+    }
+
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (!cycle?.dutyRequired) {
+      throw new BadRequestException('Duty/tax is not required for this clearance.');
+    }
+
+    if (!file) throw new BadRequestException('No payment slip uploaded');
+
+    await this.filesService.upsertByCode({
+      resourceId: contractId,
+      resource: 'contracts',
+      code: 'duty_tax_receipt',
+      file,
+    });
+
+    await this.workflowService.completeMilestone(contractId, 'DUTY_TAX_PAID');
+    if (cycle) {
+      await this.contractsRepository.updateCycle(cycle.id, {
+        currentPhase: ContractDocPhase.GlEtPostClearance,
+      });
+    }
+
+    return this.contractsService.findById(contractId);
+  }
+
+  async uploadTransitPermit(
+    contractId: string,
+    files: Express.Multer.File[],
+    userId?: string,
+  ): Promise<Contract> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    if (contract.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Transit permit applies only to import contracts.');
+    }
+    await this.workflowService.assertPriorComplete(
+      contractId,
+      'IMPORT',
+      'TRANSIT_PERMIT_UPLOADED',
+    );
+
+    if (files.length === 0) {
+      throw new BadRequestException('No transit permit documents uploaded');
+    }
+
+    await persistTransitPermitUploads(
+      this.filesService,
+      contractId,
+      'contracts',
+      files,
+    );
+
+    await this.workflowService.completeMilestone(contractId, 'TRANSIT_PERMIT_UPLOADED', userId);
+
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (cycle) {
+      await this.contractsRepository.updateCycle(cycle.id, {
+        currentPhase: ContractDocPhase.GlEtPostClearance,
+      });
+    }
+
+    return this.contractsService.findById(contractId);
+  }
+
+  async finalizePreClearance(contractId: string): Promise<Contract> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    if (contract.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Pre-clearance finalize applies only to import contracts.');
+    }
+
+    await this.workflowService.assertPriorComplete(
+      contractId,
+      'IMPORT',
+      'TRANSIT_PERMIT_UPLOADED',
+    );
+
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (!cycle) throw new BadRequestException('No clearance cycle found');
+    if (cycle.preClearanceFinalizedAt) {
+      return this.contractsService.findById(contractId);
+    }
+
+    await this.contractsRepository.updateCycle(cycle.id, {
+      preClearanceFinalizedAt: new Date(),
+      currentPhase: ContractDocPhase.GlDjCollection,
+    });
+
+    return this.contractsService.findById(contractId);
+  }
+
+  async uploadDeliveryOrder(
+    contractId: string,
+    file: Express.Multer.File,
+    userId?: string,
+  ): Promise<Contract> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    if (contract.tradeDirection !== 'IMPORT') {
+      throw new BadRequestException('Delivery Order applies only to import contracts.');
+    }
+
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (!cycle?.preClearanceFinalizedAt) {
+      throw new BadRequestException(
+        'GL Ethiopia must finalize pre-clearance before the Delivery Order can be uploaded.',
+      );
+    }
+
+    await this.workflowService.assertPriorComplete(contractId, 'IMPORT', 'DO_COLLECTED');
+
+    if (!file) throw new BadRequestException('No Delivery Order uploaded');
+
+    await this.filesService.upsertByCode({
+      resourceId: contractId,
+      resource: 'contracts',
+      code: 'delivery_order',
+      file,
+    });
+
+    await this.workflowService.completeMilestone(contractId, 'DO_COLLECTED', userId);
+    await this.workflowService.markReadyForBooking(contractId);
+
+    return this.contractsService.findById(contractId);
+  }
+
+  private async resolveRoMinDays(): Promise<number> {
+    try {
+      const setting = await this.dropdownSettingsService.getByCode(RO_VESSEL_MIN_DAYS_CODE);
+      const first = setting.children?.[0];
+      const n = Number(first?.value);
+      return Number.isFinite(n) && n > 0 ? n : 2;
+    } catch {
+      return 2;
+    }
+  }
+
+  private daysUntil(dateStr: string): number {
+    const target = new Date(dateStr);
+    const today = new Date();
+    today.setHours(0, 0, 0, 0);
+    target.setHours(0, 0, 0, 0);
+    return Math.floor((target.getTime() - today.getTime()) / (24 * 60 * 60 * 1000));
+  }
+
+  async uploadReleaseOrder(
+    contractId: string,
+    file: Express.Multer.File,
+    vesselDepartureDate: string,
+    userId?: string,
+  ): Promise<{ contract: Contract; hold: boolean; holdReason?: string }> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    if (contract.tradeDirection !== 'EXPORT') {
+      throw new BadRequestException('Release Order applies only to export contracts.');
+    }
+    await this.workflowService.assertPriorComplete(
+      contractId,
+      'EXPORT',
+      'RELEASE_ORDER_SECURED',
+    );
+
+    if (!file) throw new BadRequestException('No Release Order uploaded');
+    if (!vesselDepartureDate?.trim()) {
+      throw new BadRequestException('Vessel departure date is required');
+    }
+
+    const minDays = await this.resolveRoMinDays();
+    const leadDays = this.daysUntil(vesselDepartureDate);
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (!cycle) throw new BadRequestException('No clearance cycle found');
+
+    await this.filesService.upsertByCode({
+      resourceId: contractId,
+      resource: 'contracts',
+      code: 'release_order',
+      file,
+    });
+
+    await this.contractsRepository.updateCycle(cycle.id, {
+      vesselDepartureDate,
+      roAmendmentRequestedAt: null,
+    });
+
+    if (leadDays < minDays) {
+      const reason = `Vessel departs in ${leadDays} day(s) — minimum lead time is ${minDays} day(s). Request a port amendment or upload a new RO with a later date.`;
+      await this.contractsRepository.updateCycle(cycle.id, {
+        roHoldReason: reason,
+        currentPhase: ContractDocPhase.GlDjCollection,
+      });
+      return { contract: await this.contractsService.findById(contractId), hold: true, holdReason: reason };
+    }
+
+    await this.contractsRepository.updateCycle(cycle.id, {
+      roHoldReason: null,
+      currentPhase: ContractDocPhase.GlEtOutput,
+    });
+    await this.workflowService.completeMilestone(contractId, 'RELEASE_ORDER_SECURED', userId);
+
+    return { contract: await this.contractsService.findById(contractId), hold: false };
+  }
+
+  async requestRoAmendment(
+    contractId: string,
+    note?: string,
+    userId?: string,
+  ): Promise<Contract> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    if (contract.tradeDirection !== 'EXPORT') {
+      throw new BadRequestException('RO amendment applies only to export contracts.');
+    }
+
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (!cycle) throw new BadRequestException('No clearance cycle found');
+
+    const reason =
+      note?.trim() ||
+      'Port amendment requested — vessel departure window is too short. A new Release Order will be required.';
+
+    await this.contractsRepository.updateCycle(cycle.id, {
+      roAmendmentRequestedAt: new Date(),
+      roHoldReason: reason,
+      currentPhase: ContractDocPhase.GlDjCollection,
+    });
+
+    if (userId) {
+      await this.contractsRepository.createReviewNote(
+        contractId,
+        reason,
+        'CHANGES_REQUESTED',
+        userId,
+        'GL_DJ',
+      );
+    }
+
+    return this.contractsService.findById(contractId);
+  }
+
+  async confirmExportRelease(contractId: string, userId?: string): Promise<Contract> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    if (contract.tradeDirection !== 'EXPORT') {
+      throw new BadRequestException('Export release applies only to export contracts.');
+    }
+    await this.workflowService.assertPriorComplete(contractId, 'EXPORT', 'EXPORT_RELEASED');
+
+    await this.workflowService.onExportReleased(contractId, userId);
+    return this.contractsService.findById(contractId);
+  }
+
+  /** GL ET finalizes export clearance after post-booking transit permit is uploaded. */
+  async finalizeExportClearance(contractId: string, userId?: string): Promise<Contract> {
+    const contract = await this.contractsService.findById(contractId);
+    this.assertPhasedCustoms(contract);
+    if (contract.tradeDirection !== 'EXPORT') {
+      throw new BadRequestException('Export clearance finalize applies only to export contracts.');
+    }
+
+    const cycle = await this.contractsRepository.currentCycle(contractId);
+    if (!cycle?.bookingId) {
+      throw new BadRequestException(
+        'A shipment booking must exist before export clearance can be finalized.',
+      );
+    }
+    if (cycle.completedAt) {
+      return this.contractsService.findById(contractId);
+    }
+
+    const bookingMilestones = await this.workflowService.listMilestonesForBooking(
+      cycle.bookingId,
+    );
+    const transportDone = bookingMilestones.some(
+      (m) => m.milestoneCode === 'EXPORT_TRANSPORT_ISSUED' && m.status === 'COMPLETED',
+    );
+    if (!transportDone) {
+      throw new BadRequestException(
+        'Upload the transit permit before finalizing export clearance.',
+      );
+    }
+
+    await this.contractsRepository.updateCycle(cycle.id, {
+      completedAt: new Date(),
+      currentPhase: ContractDocPhase.GlEtPostClearance,
+    });
+
+    void userId;
+    return this.contractsService.findById(contractId);
+  }
+
+  /** GL ET queue: customs ONE_TIME contracts in phased clearance (persistent after booking). */
+  async etQueue(filter: FilterContractDto): Promise<PaginatedContracts> {
+    const base = await this.contractsRepository.findAllPaginated({
+      page: 1,
+      pageSize: 500,
+      statuses: [...PHASED_CUSTOMS_CONTRACT_QUEUE_STATUSES],
+      customsClearingEnabled: true,
+      contractKind: 'ONE_TIME',
+      sortBy: filter.sortBy,
+      sortOrder: filter.sortOrder,
+    });
+
+    const filtered: typeof base.items = [];
+    for (const c of base.items) {
+      const milestones = await this.workflowService.listMilestones(c.id);
+      if (belongsOnEtClearanceQueue(milestones)) filtered.push(c);
+    }
+
+    const page = filter.page ?? 1;
+    const pageSize = filter.pageSize ?? 50;
+    const start = (page - 1) * pageSize;
+    const items = filtered.slice(start, start + pageSize);
+
+    return {
+      items,
+      total: filtered.length,
+      meta: {
+        page,
+        pageSize,
+        total: filtered.length,
+        totalPages: Math.ceil(filtered.length / pageSize) || 1,
+        hasNextPage: start + pageSize < filtered.length,
+        hasPreviousPage: page > 1,
+      },
+    };
+  }
+
+  /** GL DJ queue: customs ONE_TIME contracts handed off to or handled by Djibouti GL. */
+  async djQueue(filter: FilterContractDto): Promise<PaginatedContracts> {
+    const base = await this.contractsRepository.findAllPaginated({
+      page: 1,
+      pageSize: 500,
+      statuses: [...DJ_CONTRACT_QUEUE_STATUSES],
+      customsClearingEnabled: true,
+      contractKind: 'ONE_TIME',
+      sortBy: filter.sortBy,
+      sortOrder: filter.sortOrder,
+    });
+
+    const filtered: typeof base.items = [];
+    for (const c of base.items) {
+      const cycle = await this.contractsRepository.currentCycle(c.id);
+      const milestones = await this.workflowService.listMilestones(c.id);
+      if (belongsOnDjClearanceQueue(c.tradeDirection, cycle, milestones)) {
+        filtered.push(c);
+      }
+    }
+
+    const page = filter.page ?? 1;
+    const pageSize = filter.pageSize ?? 50;
+    const start = (page - 1) * pageSize;
+    const items = filtered.slice(start, start + pageSize);
+
+    return {
+      items,
+      total: filtered.length,
+      meta: {
+        page,
+        pageSize,
+        total: filtered.length,
+        totalPages: Math.ceil(filtered.length / pageSize) || 1,
+        hasNextPage: start + pageSize < filtered.length,
+        hasPreviousPage: page > 1,
+      },
+    };
+  }
 }
diff --git a/apps/edr-freight-api/src/modules/contracts/contract-transition.service.ts b/apps/edr-freight-api/src/modules/contracts/contract-transition.service.ts
index 4fcbc9a6c..e87112bc2 100644
--- a/apps/edr-freight-api/src/modules/contracts/contract-transition.service.ts
+++ b/apps/edr-freight-api/src/modules/contracts/contract-transition.service.ts
@@ -172,15 +172,11 @@ export class ContractTransitionService {
     const cargoTypeId =
       (contract.cargoScope ?? []).find((c) => c.cargoTypeId)?.cargoTypeId ?? null;
 
-    // US-06 routing: bulk always needs director approval; container needs it only
-    // when its cargo type flags it. Resolve the chain via the same approval_rules
-    // source of truth the booking flow uses (no booking row is created here).
-    let requiresDirectorApproval = contract.freightType === 'BULK';
+    // Resolve the chain from the cargo type flag only.
+    let requiresDirectorApproval = false;
     if (cargoTypeId) {
       const cargoType = await this.cargoTypesService.findById(cargoTypeId);
-      if (cargoType?.requiresDirectorApproval) {
-        requiresDirectorApproval = true;
-      }
+      requiresDirectorApproval = cargoType?.requiresDirectorApproval ?? false;
     }
 
     const chain = await this.approvalRulesService.findChain(requiresDirectorApproval);
@@ -345,6 +341,14 @@ export class ContractTransitionService {
     return { view, html, signatures: view.signatures };
   }
 
+  /** Lazy-generate (or refresh) the stored contract PDF and stream it for download. */
+  async streamContractPdf(contractId: string) {
+    const contract = await this.contractsService.findById(contractId);
+    const { view } = await this.documentViewModelBuilder.build(contractId);
+    const record = await this.upsertContractPdf(contractId, contract.reference, view);
+    return this.filesService.streamById(record.id);
+  }
+
   /**
    * Rebuild the stored `contract` PDF from the current aggregate (now including
    * the latest signatures) so the downloaded/viewed file matches the live HTML
diff --git a/apps/edr-freight-api/src/modules/contracts/contracts.controller.ts b/apps/edr-freight-api/src/modules/contracts/contracts.controller.ts
index 0ef013347..5e712a177 100644
--- a/apps/edr-freight-api/src/modules/contracts/contracts.controller.ts
+++ b/apps/edr-freight-api/src/modules/contracts/contracts.controller.ts
@@ -9,13 +9,16 @@ import {
   Patch,
   Post,
   Query,
+  Res,
   UnauthorizedException,
   UploadedFiles,
+  UploadedFile,
   UseInterceptors,
 } from '@nestjs/common';
 import { CurrentUser } from '@edr/api-common';
 import type { TCurrentUser } from '@tria-plc/api-common/modules/auth/types/current-user.type';
-import { AnyFilesInterceptor } from '@nestjs/platform-express';
+import { AnyFilesInterceptor, FileInterceptor } from '@nestjs/platform-express';
+import type { Response } from 'express';
 import {
   ApiBearerAuth,
   ApiBody,
@@ -40,11 +43,13 @@ import { ContractsService } from './contracts.service';
 import { ContractPricingService } from './contract-pricing.service';
 import { ContractTransitionService } from './contract-transition.service';
 import { ContractClearanceService } from './contract-clearance.service';
+import { BookingClearanceService } from './booking-clearance.service';
 import { ContractBookingService } from './contract-booking.service';
 import { ClearanceMilestoneService } from './clearance-milestone.service';
 import { GlOperationsService } from './gl-operations.service';
 import { BookingRequestService } from './booking-request.service';
 import { SignaturesService } from '../signatures/signatures.service';
+import { BookingsService } from '../bookings/bookings.service';
 import { CreateContractDto } from './dto/create-contract.dto';
 import { UpdateContractDto } from './dto/update-contract.dto';
 import { FilterContractDto } from './dto/filter-contract.dto';
@@ -70,6 +75,10 @@ import {
   CompleteMilestoneDto,
   ReportIncidentDto,
 } from './dto/gl-operations.dto';
+import {
+  AdviseContractDutyDto,
+  RoAmendmentDto,
+} from './dto/phased-clearance.dto';
 
 @ApiTags('contracts')
 @Controller('contracts')
@@ -85,6 +94,8 @@ export class ContractsController {
     private readonly glOperationsService: GlOperationsService,
     private readonly bookingRequestService: BookingRequestService,
     private readonly signaturesService: SignaturesService,
+    private readonly bookingClearanceService: BookingClearanceService,
+    private readonly bookingsService: BookingsService,
   ) {}
 
   // ── Shipment / booking requests (GENERAL + customs, Path B) ───────────────
@@ -417,6 +428,26 @@ export class ContractsController {
     };
   }
 
+  @Get(':id/contract/document')
+  @ApiOperation({ summary: 'Download contract PDF' })
+  async downloadContractDocument(
+    @Param('id', ParseUUIDPipe) id: string,
+    @CurrentUser() user: TCurrentUser,
+    @Res() res: Response,
+  ): Promise<void> {
+    const contract = await this.contractsService.findById(id);
+    if (!hasFreightPermission(user, FREIGHT_PERMS.bookings.view)) {
+      await this.contractsService.assertCustomerCanAccessContract(user?.id, contract);
+    }
+    const { stream, record } = await this.transitionService.streamContractPdf(id);
+    res.setHeader('Content-Type', record.mimeType ?? 'application/pdf');
+    res.setHeader(
+      'Content-Disposition',
+      `attachment; filename="${record.name}"`,
+    );
+    stream.pipe(res);
+  }
+
   @Post(':id/contract/sign')
   @ApiOperation({ summary: 'Apply digital signature (customer or staff/director/ceo)' })
   signContract(
@@ -459,7 +490,10 @@ export class ContractsController {
   }
 
   @Post(':id/clearance/review')
-  @BookingStaff(FREIGHT_PERMS.contracts.clearanceReview)
+  @BookingStaff([
+    FREIGHT_PERMS.contracts.clearanceReview,
+    FREIGHT_PERMS.contracts.clearanceEtActions,
+  ])
   @ApiOperation({ summary: 'GL ET reviews a clearance document (Approve | Query)' })
   reviewClearanceDocument(
     @Param('id', ParseUUIDPipe) id: string,
@@ -489,11 +523,164 @@ export class ContractsController {
 
   @Post(':id/clearance/finalize')
   @BookingStaff(FREIGHT_PERMS.contracts.finalizeClearance)
-  @ApiOperation({ summary: 'GL ET finalizes clearance → CLEARANCE_READY_FOR_BOOKING' })
+  @ApiOperation({ summary: 'GL ET finalizes clearance → CLEARANCE_READY_FOR_BOOKING (legacy)' })
   finalizeClearance(@Param('id', ParseUUIDPipe) id: string) {
     return this.clearanceService.finalize(id);
   }
 
+  @Post(':id/clearance/declaration')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @UseInterceptors(AnyFilesInterceptor())
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'GL ET uploads customs declaration documents (multi-file)' })
+  uploadDeclaration(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFiles() files: Express.Multer.File[],
+    @CurrentUser() user: AuthUserPayload,
+  ) {
+    return this.clearanceService.uploadDeclaration(id, files ?? [], resolveAuthUserId(user));
+  }
+
+  @Post(':id/clearance/duty')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDutyAdvise)
+  @UseInterceptors(FileInterceptor('attachment'))
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'GL ET sets duty/tax requirement and advises amount with notice attachment' })
+  adviseContractDuty(
+    @Param('id', ParseUUIDPipe) id: string,
+    @Body('dutyRequired') dutyRequiredRaw: string,
+    @Body('amount') amountRaw: string | undefined,
+    @Body('currency') currency: string | undefined,
+    @Body('declarationSerial') declarationSerial: string | undefined,
+    @UploadedFile() attachment: Express.Multer.File | undefined,
+    @CurrentUser() user: AuthUserPayload,
+  ) {
+    const dutyRequired = dutyRequiredRaw === 'true' || dutyRequiredRaw === '1';
+    const dto: AdviseContractDutyDto = {
+      dutyRequired,
+      amount:
+        amountRaw != null && amountRaw !== '' ? Number(amountRaw) : undefined,
+      currency: currency ?? 'ETB',
+      declarationSerial,
+    };
+    return this.clearanceService.adviseDuty(
+      id,
+      dto,
+      resolveAuthUserId(user),
+      attachment,
+    );
+  }
+
+  @Post(':id/clearance/finalize-pre-clearance')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @ApiOperation({ summary: 'GL ET finalizes import pre-clearance — unlocks Djibouti DO upload' })
+  finalizePreClearance(@Param('id', ParseUUIDPipe) id: string) {
+    return this.clearanceService.finalizePreClearance(id);
+  }
+
+  @Post(':id/clearance/duty-slip')
+  @UseInterceptors(FileInterceptor('file'))
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'Customer uploads duty/tax payment slip on contract' })
+  uploadContractDutySlip(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFile() file: Express.Multer.File,
+  ) {
+    return this.clearanceService.uploadDutySlip(id, file);
+  }
+
+  @Post(':id/clearance/transit-permit')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @UseInterceptors(AnyFilesInterceptor())
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'GL ET uploads import transit permit documents (multi-file)' })
+  uploadTransitPermit(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFiles() files: Express.Multer.File[],
+    @CurrentUser() user: AuthUserPayload,
+  ) {
+    return this.clearanceService.uploadTransitPermit(id, files ?? [], resolveAuthUserId(user));
+  }
+
+  @Post(':id/clearance/delivery-order')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDjActions)
+  @UseInterceptors(FileInterceptor('file'))
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'GL DJ uploads Delivery Order (import)' })
+  uploadDeliveryOrder(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFile() file: Express.Multer.File,
+    @CurrentUser() user: AuthUserPayload,
+  ) {
+    return this.clearanceService.uploadDeliveryOrder(id, file, resolveAuthUserId(user));
+  }
+
+  @Post(':id/clearance/release-order')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDjActions)
+  @UseInterceptors(FileInterceptor('file'))
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'GL DJ uploads Release Order + vessel departure date (export)' })
+  uploadReleaseOrder(
+    @Param('id', ParseUUIDPipe) id: string,
+    @UploadedFile() file: Express.Multer.File,
+    @Body('vesselDepartureDate') vesselDepartureDate: string,
+    @CurrentUser() user: AuthUserPayload,
+  ) {
+    return this.clearanceService.uploadReleaseOrder(
+      id,
+      file,
+      vesselDepartureDate,
+      resolveAuthUserId(user),
+    );
+  }
+
+  @Post(':id/clearance/ro-amendment')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDjActions)
+  @ApiOperation({ summary: 'GL DJ requests port amendment when RO vessel window is too short' })
+  requestRoAmendment(
+    @Param('id', ParseUUIDPipe) id: string,
+    @Body() dto: RoAmendmentDto,
+    @CurrentUser() user: AuthUserPayload,
+  ) {
+    return this.clearanceService.requestRoAmendment(id, dto.note, resolveAuthUserId(user));
+  }
+
+  @Post(':id/clearance/export-release')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @ApiOperation({ summary: 'GL ET confirms export release after declaration' })
+  confirmExportRelease(
+    @Param('id', ParseUUIDPipe) id: string,
+    @CurrentUser() user: AuthUserPayload,
+  ) {
+    return this.clearanceService.confirmExportRelease(id, resolveAuthUserId(user));
+  }
+
+  @Post(':id/clearance/finalize-export-clearance')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @ApiOperation({
+    summary: 'GL ET finalizes export clearance after post-booking transit permit upload',
+  })
+  finalizeExportClearance(
+    @Param('id', ParseUUIDPipe) id: string,
+    @CurrentUser() user: AuthUserPayload,
+  ) {
+    return this.clearanceService.finalizeExportClearance(id, resolveAuthUserId(user));
+  }
+
+  @Get('clearance/et-queue')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @ApiOperation({ summary: 'GL Ethiopia phased clearance list (persistent after booking)' })
+  etClearanceQueue(@Query() filter: FilterContractDto) {
+    return this.clearanceService.etQueue(filter);
+  }
+
+  @Get('clearance/dj-queue')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceDjActions)
+  @ApiOperation({ summary: 'GL Djibouti phased clearance list (persistent after booking)' })
+  djClearanceQueue(@Query() filter: FilterContractDto) {
+    return this.clearanceService.djQueue(filter);
+  }
+
   // ── Path A self-clearance — Operations reviews the customer's own docs ───────
 
   @Get('clearance/ops-queue')
@@ -674,6 +861,18 @@ export class ContractsController {
     });
   }
 
+  @Post('bookings/:bookingId/transport-document')
+  @BookingStaff(FREIGHT_PERMS.contracts.clearanceEtActions)
+  @UseInterceptors(AnyFilesInterceptor())
+  @ApiConsumes('multipart/form-data')
+  @ApiOperation({ summary: 'GL ET uploads export transit permit documents (multi-file)' })
+  uploadTransportDocument(
+    @Param('bookingId', ParseUUIDPipe) bookingId: string,
+    @UploadedFiles() files: Express.Multer.File[],
+  ) {
+    return this.glOperationsService.uploadTransportDocument(bookingId, files ?? []);
+  }
+
   @Post('bookings/:bookingId/documents')
   @BookingStaff(FREIGHT_PERMS.bookings.uploadClearanceOutput)
   @UseInterceptors(AnyFilesInterceptor())
@@ -692,11 +891,16 @@ export class ContractsController {
   @UseInterceptors(AnyFilesInterceptor())
   @ApiConsumes('multipart/form-data')
   @ApiOperation({ summary: 'Customer uploads the duty/tax payment slip' })
-  uploadDutySlip(
+  async uploadDutySlip(
     @Param('bookingId', ParseUUIDPipe) bookingId: string,
     @UploadedFiles() files: Express.Multer.File[],
   ) {
-    return this.glOperationsService.uploadDutySlip(bookingId, (files ?? [])[0]);
+    const file = (files ?? [])[0];
+    const booking = await this.bookingsService.findById(bookingId);
+    if (this.bookingClearanceService.isPhasedGeneralCustomsBooking(booking)) {
+      return this.bookingClearanceService.uploadDutySlip(bookingId, file);
+    }
+    return this.glOperationsService.uploadDutySlip(bookingId, file);
   }
 
   @Get('bookings/:bookingId/incidents')
diff --git a/apps/edr-freight-api/src/modules/contracts/contracts.module.ts b/apps/edr-freight-api/src/modules/contracts/contracts.module.ts
index c595dbf5f..94f469112 100644
--- a/apps/edr-freight-api/src/modules/contracts/contracts.module.ts
+++ b/apps/edr-freight-api/src/modules/contracts/contracts.module.ts
@@ -1,4 +1,4 @@
-import { Module } from '@nestjs/common';
+import { Module, forwardRef } from '@nestjs/common';
 import { ConfigService } from '@nestjs/config';
 import { TypeOrmModule } from '@nestjs/typeorm';
 import { ExchangeModule, ExchangeOptions } from '@edr/api-common';
@@ -18,6 +18,8 @@ import { ContractsRepository } from './contracts.repository';
 import { ContractPricingService } from './contract-pricing.service';
 import { ContractTransitionService } from './contract-transition.service';
 import { ContractClearanceService } from './contract-clearance.service';
+import { BookingClearanceService } from './booking-clearance.service';
+import { ClearanceWorkflowService } from './clearance-workflow.service';
 import { ContractBookingService } from './contract-booking.service';
 import { ClearanceMilestoneService } from './clearance-milestone.service';
 import { GlOperationsService } from './gl-operations.service';
@@ -71,7 +73,7 @@ import { ContractDocumentViewModelBuilder } from '../../contracts/contract-docum
     CompaniesModule,
     // BookingsModule provides BookingsRepository/BookingPricingService used by the
     // contract PDF builders (they read a Booking today — see docs/new-doc.md §3.3).
-    BookingsModule,
+    forwardRef(() => BookingsModule),
     ExchangeModule.forRootAsync({
       inject: [ConfigService],
       useFactory: (config: ConfigService): ExchangeOptions =>
@@ -85,6 +87,8 @@ import { ContractDocumentViewModelBuilder } from '../../contracts/contract-docum
     ContractPricingService,
     ContractTransitionService,
     ContractClearanceService,
+    ClearanceWorkflowService,
+    BookingClearanceService,
     ContractBookingService,
     ClearanceMilestoneService,
     GlOperationsService,
@@ -103,6 +107,8 @@ import { ContractDocumentViewModelBuilder } from '../../contracts/contract-docum
     ContractPricingService,
     ContractTransitionService,
     ContractClearanceService,
+    ClearanceWorkflowService,
+    BookingClearanceService,
     ContractBookingService,
     ClearanceMilestoneService,
   ],
diff --git a/apps/edr-freight-api/src/modules/contracts/contracts.repository.ts b/apps/edr-freight-api/src/modules/contracts/contracts.repository.ts
index 354f02e8c..9e464db51 100644
--- a/apps/edr-freight-api/src/modules/contracts/contracts.repository.ts
+++ b/apps/edr-freight-api/src/modules/contracts/contracts.repository.ts
@@ -518,7 +518,17 @@ export class ContractsRepository extends BaseRepository<Contract> {
     cycleId: string,
     status: string,
     fields: Partial<
-      Pick<ContractClearanceCycle, 'bookingId' | 'clearanceReadyAt' | 'completedAt'>
+      Pick<
+        ContractClearanceCycle,
+        | 'bookingId'
+        | 'clearanceReadyAt'
+        | 'completedAt'
+        | 'dutyRequired'
+        | 'vesselDepartureDate'
+        | 'roAmendmentRequestedAt'
+        | 'roHoldReason'
+        | 'currentPhase'
+      >
     > = {},
   ): Promise<void> {
     await this.dataSource
@@ -526,6 +536,25 @@ export class ContractsRepository extends BaseRepository<Contract> {
       .update(cycleId, { status, ...fields } as never);
   }
 
+  async updateCycle(
+    cycleId: string,
+    fields: Partial<
+      Pick<
+        ContractClearanceCycle,
+        | 'dutyRequired'
+        | 'vesselDepartureDate'
+        | 'roAmendmentRequestedAt'
+        | 'roHoldReason'
+        | 'currentPhase'
+        | 'status'
+        | 'preClearanceFinalizedAt'
+        | 'completedAt'
+      >
+    >,
+  ): Promise<void> {
+    await this.dataSource.getRepository(ContractClearanceCycle).update(cycleId, fields as never);
+  }
+
   /** Link the GL-created booking to a clearance cycle. */
   async linkBooking(cycleId: string, bookingId: string): Promise<void> {
     await this.dataSource
diff --git a/apps/edr-freight-api/src/modules/contracts/contracts.service.ts b/apps/edr-freight-api/src/modules/contracts/contracts.service.ts
index 70d2632fa..8d864aac7 100644
--- a/apps/edr-freight-api/src/modules/contracts/contracts.service.ts
+++ b/apps/edr-freight-api/src/modules/contracts/contracts.service.ts
@@ -200,9 +200,6 @@ export class ContractsService {
       lastMileDeliveryLng: dto.lastMileDeliveryLng ?? null,
       isHazardous: dto.isHazardous ?? false,
       isReefer: dto.isReefer ?? false,
-      estimatedShipmentDate: dto.estimatedShipmentDate
-        ? new Date(dto.estimatedShipmentDate)
-        : null,
       contractType: dto.contractType ?? null,
       status: 'DRAFT',
       clearanceStatus: 'NOT_APPLICABLE',
@@ -347,9 +344,6 @@ export class ContractsService {
       lastMileDeliveryLng: dto.lastMileDeliveryLng ?? existing.lastMileDeliveryLng,
       contractType: dto.contractType ?? existing.contractType,
     };
-    if (dto.estimatedShipmentDate) {
-      updates.estimatedShipmentDate = new Date(dto.estimatedShipmentDate);
-    }
     if (dto.renewalOfId !== undefined) updates.renewalOfId = dto.renewalOfId ?? null;
 
     // Customs clearing always mirrors the (possibly changed) service type.
diff --git a/apps/edr-freight-api/src/modules/contracts/dto/create-booking-under-contract.dto.ts b/apps/edr-freight-api/src/modules/contracts/dto/create-booking-under-contract.dto.ts
index 4108986cb..ac404c9df 100644
--- a/apps/edr-freight-api/src/modules/contracts/dto/create-booking-under-contract.dto.ts
+++ b/apps/edr-freight-api/src/modules/contracts/dto/create-booking-under-contract.dto.ts
@@ -101,6 +101,13 @@ export class CreateBulkLineDto {
   @Min(0)
   @Transform(({ value }) => Number(value))
   hazardousQuantity?: number;
+
+  @ApiPropertyOptional({ minimum: 0 })
+  @IsOptional()
+  @IsInt()
+  @Min(0)
+  @Transform(({ value }) => Number(value))
+  reeferQuantity?: number;
 }
 
 /** Shipment booking created under a contract (Path A customer, Path B GL ET). */
diff --git a/apps/edr-freight-api/src/modules/contracts/dto/create-contract.dto.ts b/apps/edr-freight-api/src/modules/contracts/dto/create-contract.dto.ts
index 70dba1e90..b20b99575 100644
--- a/apps/edr-freight-api/src/modules/contracts/dto/create-contract.dto.ts
+++ b/apps/edr-freight-api/src/modules/contracts/dto/create-contract.dto.ts
@@ -4,7 +4,6 @@ import {
   ArrayMinSize,
   IsArray,
   IsBoolean,
-  IsDateString,
   IsIn,
   IsNumber,
   IsOptional,
@@ -219,14 +218,6 @@ export class CreateContractDto {
   @Transform(({ value }) => value === 'true' || value === true)
   isReefer?: boolean;
 
-  @ApiPropertyOptional({
-    description: 'Non-binding estimate from the wizard (NOT validated against departures)',
-    example: '2026-07-15T00:00:00.000Z',
-  })
-  @IsOptional()
-  @IsDateString()
-  estimatedShipmentDate?: string;
-
   @ApiPropertyOptional({ description: 'Contract document type (SPOT, etc.)' })
   @IsOptional()
   @IsString()
diff --git a/apps/edr-freight-api/src/modules/contracts/dto/phased-clearance.dto.ts b/apps/edr-freight-api/src/modules/contracts/dto/phased-clearance.dto.ts
new file mode 100644
index 000000000..f48653822
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/contracts/dto/phased-clearance.dto.ts
@@ -0,0 +1,37 @@
+import { ApiProperty, ApiPropertyOptional } from '@nestjs/swagger';
+import { IsBoolean, IsNumber, IsOptional, IsString, Min } from 'class-validator';
+
+export class AdviseContractDutyDto {
+  @ApiProperty({ description: 'Whether the customer must pay duty/tax' })
+  @IsBoolean()
+  dutyRequired!: boolean;
+
+  @ApiPropertyOptional({ description: 'Duty amount (required when dutyRequired is true)' })
+  @IsOptional()
+  @IsNumber()
+  @Min(0)
+  amount?: number;
+
+  @ApiPropertyOptional({ default: 'ETB' })
+  @IsOptional()
+  @IsString()
+  currency?: string;
+
+  @ApiPropertyOptional({ description: 'Declaration / payment reference code' })
+  @IsOptional()
+  @IsString()
+  declarationSerial?: string;
+}
+
+export class ReleaseOrderDto {
+  @ApiProperty({ description: 'Vessel departure date (ISO date YYYY-MM-DD)' })
+  @IsString()
+  vesselDepartureDate!: string;
+}
+
+export class RoAmendmentDto {
+  @ApiPropertyOptional({ description: 'Note to customer / ET GL about the amendment request' })
+  @IsOptional()
+  @IsString()
+  note?: string;
+}
diff --git a/apps/edr-freight-api/src/modules/contracts/entities/contract-clearance-cycle.entity.ts b/apps/edr-freight-api/src/modules/contracts/entities/contract-clearance-cycle.entity.ts
index e29985f2b..3c101f58e 100644
--- a/apps/edr-freight-api/src/modules/contracts/entities/contract-clearance-cycle.entity.ts
+++ b/apps/edr-freight-api/src/modules/contracts/entities/contract-clearance-cycle.entity.ts
@@ -34,4 +34,25 @@ export class ContractClearanceCycle extends BaseEntity {
 
   @Column({ name: 'completed_at', type: 'timestamptz', nullable: true })
   completedAt?: Date | null;
+
+  /** ET GL toggle: whether customer must pay duty/tax before DO collection (import). */
+  @Column({ name: 'duty_required', type: 'boolean', nullable: true })
+  dutyRequired?: boolean | null;
+
+  /** Export RO vessel departure date (Path B export). */
+  @Column({ name: 'vessel_departure_date', type: 'date', nullable: true })
+  vesselDepartureDate?: string | null;
+
+  @Column({ name: 'ro_amendment_requested_at', type: 'timestamptz', nullable: true })
+  roAmendmentRequestedAt?: Date | null;
+
+  @Column({ name: 'ro_hold_reason', type: 'text', nullable: true })
+  roHoldReason?: string | null;
+
+  @Column({ name: 'current_phase', type: 'varchar', length: 40, nullable: true })
+  currentPhase?: string | null;
+
+  /** ET GL confirms import pre-clearance complete — unlocks Djibouti DO upload. */
+  @Column({ name: 'pre_clearance_finalized_at', type: 'timestamptz', nullable: true })
+  preClearanceFinalizedAt?: Date | null;
 }
diff --git a/apps/edr-freight-api/src/modules/contracts/gl-operations.service.ts b/apps/edr-freight-api/src/modules/contracts/gl-operations.service.ts
index e8f53f4c6..73ca3a65d 100644
--- a/apps/edr-freight-api/src/modules/contracts/gl-operations.service.ts
+++ b/apps/edr-freight-api/src/modules/contracts/gl-operations.service.ts
@@ -8,6 +8,7 @@ import {
   IncidentType,
 } from './entities/clearance-incident.entity';
 import { ClearanceMilestoneService } from './clearance-milestone.service';
+import { persistExportTransportUploads } from './phased-clearance.util';
 
 /**
  * Maps a GL post-booking document `code` to the milestone it auto-completes when
@@ -21,6 +22,7 @@ const DOC_CODE_TO_MILESTONE: Record<string, string> = {
   import_release: 'IMPORT_RELEASE_GRANTED', // import — GL ET
   full_in_interchange: 'OFFLOADED', // export — GL DJ
   final_declaration: 'IMPORT_PROCESS_COMPLETED', // import — GL ET
+  export_transport_document: 'EXPORT_TRANSPORT_ISSUED', // export — GL ET post-allocation
 };
 
 /**
@@ -158,4 +160,44 @@ export class GlOperationsService {
     }
     return { uploaded: files.length, completedMilestones };
   }
+
+  /**
+   * GL ET uploads export transport document after wagon allocation (export ONE_TIME).
+   */
+  async uploadTransportDocument(
+    bookingId: string,
+    files: Express.Multer.File[],
+  ): Promise<{ uploaded: boolean; milestoneCompleted: boolean }> {
+    const booking = await this.getBooking(bookingId);
+    if (booking.tradeDirection !== 'EXPORT') {
+      throw new BadRequestException('Transport document upload applies to export shipments only.');
+    }
+
+    const milestones = await this.milestoneService.listForBooking(bookingId);
+    const wagonAllocated = milestones.find((m) => m.milestoneCode === 'WAGON_ALLOCATED');
+    const wagonDone =
+      wagonAllocated?.status === 'COMPLETED' || booking.schedulingStatus === 'SCHEDULED';
+    if (!wagonDone) {
+      throw new BadRequestException(
+        'Wagon must be allocated before the transport document can be uploaded.',
+      );
+    }
+
+    if (files.length === 0) {
+      throw new BadRequestException('No transit permit documents uploaded');
+    }
+
+    await persistExportTransportUploads(this.filesService, bookingId, files);
+
+    if (wagonAllocated && wagonAllocated.status !== 'COMPLETED') {
+      await this.milestoneService.completeForBooking(bookingId, 'WAGON_ALLOCATED');
+    }
+
+    await this.milestoneService.completeByDocTrigger(
+      { bookingId },
+      'EXPORT_TRANSPORT_ISSUED',
+    );
+
+    return { uploaded: true, milestoneCompleted: true };
+  }
 }
diff --git a/apps/edr-freight-api/src/modules/contracts/phased-clearance.util.spec.ts b/apps/edr-freight-api/src/modules/contracts/phased-clearance.util.spec.ts
new file mode 100644
index 000000000..cf044d6a9
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/contracts/phased-clearance.util.spec.ts
@@ -0,0 +1,125 @@
+import { buildWorkflowFiles, belongsOnDjClearanceQueue, belongsOnEtClearanceQueue } from './phased-clearance.util';
+
+describe('buildWorkflowFiles', () => {
+  const resourceFiles = [
+    { code: 'im4', id: 'f-im4', name: 'im4.pdf', url: '/files/im4' },
+    { code: 'im5', id: 'f-im5', name: 'im5.pdf', url: '/files/im5' },
+    {
+      code: 'transit_permitted',
+      id: 'f-transit',
+      name: 'transit.png',
+      url: '/files/transit',
+    },
+    {
+      code: 'duty_tax_notice',
+      id: 'f-duty',
+      name: 'notice.pdf',
+      url: '/files/duty',
+    },
+    { code: 'commercial_invoice', id: 'f-inv', name: 'inv.pdf', url: '/files/inv' },
+  ];
+
+  it('includes declaration and transit files even when they also appear in GL output document settings', () => {
+    const result = buildWorkflowFiles(resourceFiles, 'IMPORT');
+
+    expect(result.map((f) => f.code)).toEqual(
+      expect.arrayContaining(['im4', 'im5', 'transit_permitted', 'duty_tax_notice']),
+    );
+  });
+
+  it('includes multi-file declaration uploads alongside catalog codes', () => {
+    const result = buildWorkflowFiles(
+      [
+        ...resourceFiles,
+        {
+          code: 'declaration_0',
+          id: 'f-dec-0',
+          name: 'decl-a.pdf',
+          url: '/files/decl-a',
+        },
+        {
+          code: 'declaration_1',
+          id: 'f-dec-1',
+          name: 'decl-b.pdf',
+          url: '/files/decl-b',
+        },
+      ],
+      'IMPORT',
+    );
+
+    expect(result.map((f) => f.code)).toEqual(
+      expect.arrayContaining(['im4', 'im5', 'declaration_0', 'declaration_1']),
+    );
+    expect(result.find((f) => f.code === 'declaration_0')?.label).toBe(
+      'Declaration document 1',
+    );
+  });
+
+  it('includes multi-file import transit permit uploads', () => {
+    const result = buildWorkflowFiles(
+      [
+        ...resourceFiles,
+        {
+          code: 'transit_permit_0',
+          id: 'f-tp-0',
+          name: 'permit-a.pdf',
+          url: '/files/tp-a',
+        },
+        {
+          code: 'transit_permit_1',
+          id: 'f-tp-1',
+          name: 'permit-b.pdf',
+          url: '/files/tp-b',
+        },
+      ],
+      'IMPORT',
+    );
+
+    expect(result.map((f) => f.code)).toEqual(
+      expect.arrayContaining(['transit_permitted', 'transit_permit_0', 'transit_permit_1']),
+    );
+    expect(result.find((f) => f.code === 'transit_permit_0')?.label).toBe('Transit permit 1');
+  });
+
+  it('does not include non-catalog customer document codes', () => {
+    const result = buildWorkflowFiles(resourceFiles, 'IMPORT');
+
+    expect(result.some((f) => f.code === 'commercial_invoice')).toBe(false);
+  });
+});
+
+describe('belongsOnDjClearanceQueue', () => {
+  it('keeps import contracts after pre-clearance is finalized (even post-booking)', () => {
+    expect(
+      belongsOnDjClearanceQueue(
+        'IMPORT',
+        { preClearanceFinalizedAt: new Date('2026-01-01') },
+        [],
+      ),
+    ).toBe(true);
+  });
+
+  it('keeps contracts with completed Djibouti milestones', () => {
+    expect(
+      belongsOnDjClearanceQueue('IMPORT', null, [
+        { ownerRegion: 'DJ', status: 'COMPLETED' },
+      ]),
+    ).toBe(true);
+  });
+
+  it('excludes import contracts still on Ethiopia-side clearance only', () => {
+    expect(belongsOnDjClearanceQueue('IMPORT', null, [])).toBe(false);
+  });
+});
+
+describe('belongsOnEtClearanceQueue', () => {
+  it('keeps contracts once phased clearance milestones exist', () => {
+    expect(
+      belongsOnEtClearanceQueue([{ ownerRegion: 'ET', status: 'COMPLETED' }]),
+    ).toBe(true);
+  });
+
+  it('excludes contracts with no clearance milestones', () => {
+    expect(belongsOnEtClearanceQueue([])).toBe(false);
+  });
+});
diff --git a/apps/edr-freight-api/src/modules/contracts/phased-clearance.util.ts b/apps/edr-freight-api/src/modules/contracts/phased-clearance.util.ts
new file mode 100644
index 000000000..89fbf797e
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/contracts/phased-clearance.util.ts
@@ -0,0 +1,319 @@
+import { BadRequestException } from '@nestjs/common';
+import {
+  catalogEntriesForTradeDirection,
+  declarationFileLabel,
+  isDeclarationFileCode,
+  isImportTransitPermitFileCode,
+  isExportTransportFileCode,
+  exportTransportFileLabel,
+  transitPermitFileLabel,
+  type ClearanceWorkflowFile,
+} from '@edr/types';
+
+/** Require at least one declaration file in the upload batch. */
+export function assertDeclarationFiles(files: Express.Multer.File[]): void {
+  if (files.length === 0) {
+    throw new BadRequestException('No declaration documents uploaded');
+  }
+}
+
+/** Assign stable `declaration_*` codes so multi-file uploads always pass validation. */
+export function normalizeDeclarationFieldNames(
+  files: Express.Multer.File[],
+): Express.Multer.File[] {
+  return files.map((file, index) => ({
+    ...file,
+    fieldname: `declaration_${index}`,
+  }));
+}
+
+type DeclarationFileStore = {
+  findByResource(
+    resourceId: string,
+    resource: string,
+  ): Promise<Array<{ code?: string | null }>>;
+  deleteByCode(resourceId: string, resource: string, code: string): Promise<void>;
+  upload(input: {
+    resourceId: string;
+    resource: string;
+    code: string;
+    file: Express.Multer.File;
+  }): Promise<unknown>;
+};
+
+/** Replace all declaration files on a resource with a new multi-file upload batch. */
+export async function persistDeclarationUploads(
+  store: DeclarationFileStore,
+  resourceId: string,
+  resource: string,
+  files: Express.Multer.File[],
+): Promise<void> {
+  const normalized = normalizeDeclarationFieldNames(files);
+  assertDeclarationFiles(normalized);
+
+  const existing = await store.findByResource(resourceId, resource);
+  await Promise.all(
+    existing
+      .filter((f) => f.code && isDeclarationFileCode(f.code))
+      .map((f) => store.deleteByCode(resourceId, resource, f.code!)),
+  );
+
+  await Promise.all(
+    normalized.map((file, index) =>
+      store.upload({
+        resourceId,
+        resource,
+        code: `declaration_${index}`,
+        file,
+      }),
+    ),
+  );
+}
+
+/** Require at least one transit permit file in the upload batch. */
+export function assertTransitPermitFiles(files: Express.Multer.File[]): void {
+  if (files.length === 0) {
+    throw new BadRequestException('No transit permit documents uploaded');
+  }
+}
+
+/** Assign stable `transit_permit_*` codes for multi-file import transit uploads. */
+export function normalizeTransitPermitFieldNames(
+  files: Express.Multer.File[],
+): Express.Multer.File[] {
+  return files.map((file, index) => ({
+    ...file,
+    fieldname: `transit_permit_${index}`,
+  }));
+}
+
+/** Replace all import transit permit files on a resource with a new multi-file batch. */
+export async function persistTransitPermitUploads(
+  store: DeclarationFileStore,
+  resourceId: string,
+  resource: string,
+  files: Express.Multer.File[],
+): Promise<void> {
+  const normalized = normalizeTransitPermitFieldNames(files);
+  assertTransitPermitFiles(normalized);
+
+  const existing = await store.findByResource(resourceId, resource);
+  await Promise.all(
+    existing
+      .filter((f) => f.code && isImportTransitPermitFileCode(f.code))
+      .map((f) => store.deleteByCode(resourceId, resource, f.code!)),
+  );
+
+  await Promise.all(
+    normalized.map((file, index) =>
+      store.upload({
+        resourceId,
+        resource,
+        code: `transit_permit_${index}`,
+        file,
+      }),
+    ),
+  );
+}
+
+/** Require at least one export transport document in the upload batch. */
+export function assertExportTransportFiles(files: Express.Multer.File[]): void {
+  if (files.length === 0) {
+    throw new BadRequestException('No transit permit documents uploaded');
+  }
+}
+
+export function normalizeExportTransportFieldNames(
+  files: Express.Multer.File[],
+): Express.Multer.File[] {
+  return files.map((file, index) => ({
+    ...file,
+    fieldname: `export_transport_document_${index}`,
+  }));
+}
+
+/** Replace all export transport documents on a booking with a new multi-file batch. */
+export async function persistExportTransportUploads(
+  store: DeclarationFileStore,
+  bookingId: string,
+  files: Express.Multer.File[],
+): Promise<void> {
+  const normalized = normalizeExportTransportFieldNames(files);
+  assertExportTransportFiles(normalized);
+
+  const existing = await store.findByResource(bookingId, 'bookings');
+  await Promise.all(
+    existing
+      .filter((f) => f.code && isExportTransportFileCode(f.code))
+      .map((f) => store.deleteByCode(bookingId, 'bookings', f.code!)),
+  );
+
+  await Promise.all(
+    normalized.map((file, index) =>
+      store.upload({
+        resourceId: bookingId,
+        resource: 'bookings',
+        code: `export_transport_document_${index}`,
+        file,
+      }),
+    ),
+  );
+}
+
+export function parseDutyRequiredForm(value: string | boolean | undefined): boolean {
+  if (typeof value === 'boolean') return value;
+  if (value === undefined || value === '') return false;
+  return value === 'true' || value === '1';
+}
+
+type DjQueueMilestone = {
+  ownerRegion?: string | null;
+  status: string;
+};
+
+type DjQueueCycle = {
+  preClearanceFinalizedAt?: Date | null;
+  roHoldReason?: string | null;
+} | null | undefined;
+
+/** Whether a customs clearance item belongs on the persistent GL Djibouti list. */
+export function belongsOnDjClearanceQueue(
+  tradeDirection: string | null | undefined,
+  cycle: DjQueueCycle,
+  milestones: DjQueueMilestone[],
+  extras?: {
+    roHoldReason?: string | null;
+    preClearanceFinalizedAt?: Date | null;
+  },
+): boolean {
+  const roHold = cycle?.roHoldReason ?? extras?.roHoldReason;
+  if (roHold) return true;
+
+  const hasDjActivity = milestones.some(
+    (m) => m.ownerRegion === 'DJ' && (m.status === 'COMPLETED' || m.status === 'PENDING'),
+  );
+  if (hasDjActivity) return true;
+
+  const preFinalized =
+    cycle?.preClearanceFinalizedAt ?? extras?.preClearanceFinalizedAt ?? null;
+  if (tradeDirection === 'IMPORT' && preFinalized) return true;
+
+  return false;
+}
+
+/** Contract statuses for persistent phased customs clearance lists (ET + DJ). */
+export const PHASED_CUSTOMS_CONTRACT_QUEUE_STATUSES = [
+  'AWAITING_CLEARANCE_DOCUMENTS',
+  'CLEARANCE_UNDER_REVIEW',
+  'CLEARANCE_READY_FOR_BOOKING',
+  'ACTIVE_SHIPMENT_IN_PROGRESS',
+  'FULLY_EXECUTED',
+  'CONTRACT_ACTIVE',
+  'CONTRACT_CLOSED',
+] as const;
+
+/** Whether a customs clearance item belongs on the persistent GL Ethiopia list. */
+export function belongsOnEtClearanceQueue(milestones: DjQueueMilestone[]): boolean {
+  return milestones.some((m) => m.status === 'PENDING' || m.status === 'COMPLETED');
+}
+
+/** Contract statuses that may appear on the GL Djibouti clearance list (includes post-booking). */
+export const DJ_CONTRACT_QUEUE_STATUSES = PHASED_CUSTOMS_CONTRACT_QUEUE_STATUSES;
+
+/** Booking statuses for persistent phased customs clearance lists (ET + DJ). */
+export const PHASED_CUSTOMS_BOOKING_QUEUE_STATUSES = [
+  'AWAITING_DOCUMENTS',
+  'DOCUMENTS_UNDER_REVIEW',
+  'CLEARANCE_READY',
+  'FULLY_EXECUTED',
+  'OPERATION_REQUEST_PENDING',
+  'OPERATION_CHANGES_REQUESTED',
+  'ROAD_DISPATCH_PENDING',
+  'IN_TRANSIT',
+  'PAID',
+  'COMPLETED',
+  'CONTRACT_ACTIVE',
+  'CONTRACT_CLOSED',
+] as const;
+
+/** Booking statuses that may appear on the GL Djibouti clearance list (includes post-clearance). */
+export const DJ_BOOKING_QUEUE_STATUSES = PHASED_CUSTOMS_BOOKING_QUEUE_STATUSES;
+
+/** Build labeled phased-customs file rows from resource files. */
+export function buildWorkflowFiles(
+  files: Array<{ code?: string | null; id: string; name: string; url: string }>,
+  tradeDirection: string,
+): ClearanceWorkflowFile[] {
+  const fileByCode = new Map(
+    files.filter((f) => f.code).map((f) => [f.code as string, f]),
+  );
+  const out: ClearanceWorkflowFile[] = [];
+  const included = new Set<string>();
+
+  for (const entry of catalogEntriesForTradeDirection(tradeDirection)) {
+    const file = fileByCode.get(entry.code) ?? null;
+    if (!file) continue;
+    included.add(entry.code);
+    out.push({
+      code: entry.code,
+      label: entry.label,
+      uploadedBy: entry.uploadedBy,
+      category: entry.category,
+      file: { id: file.id, name: file.name, url: file.url },
+    });
+  }
+
+  const extraDeclarations = files
+    .filter((f) => f.code && isDeclarationFileCode(f.code) && !included.has(f.code))
+    .sort((a, b) => (a.code ?? '').localeCompare(b.code ?? ''));
+
+  extraDeclarations.forEach((file, index) => {
+    if (!file.code) return;
+    included.add(file.code);
+    out.push({
+      code: file.code,
+      label: declarationFileLabel(file.code, index),
+      uploadedBy: 'gl_et',
+      category: 'declaration',
+      file: { id: file.id, name: file.name, url: file.url },
+    });
+  });
+
+  if (tradeDirection === 'IMPORT') {
+    const extraTransit = files
+      .filter((f) => f.code && isImportTransitPermitFileCode(f.code) && !included.has(f.code))
+      .sort((a, b) => (a.code ?? '').localeCompare(b.code ?? ''));
+
+    extraTransit.forEach((file, index) => {
+      if (!file.code) return;
+      included.add(file.code);
+      out.push({
+        code: file.code,
+        label: transitPermitFileLabel(file.code, index),
+        uploadedBy: 'gl_et',
+        category: 'transit',
+        file: { id: file.id, name: file.name, url: file.url },
+      });
+    });
+  }
+
+  if (tradeDirection === 'EXPORT') {
+    const extraExportTransport = files
+      .filter((f) => f.code && isExportTransportFileCode(f.code) && !included.has(f.code))
+      .sort((a, b) => (a.code ?? '').localeCompare(b.code ?? ''));
+
+    extraExportTransport.forEach((file, index) => {
+      if (!file.code) return;
+      included.add(file.code);
+      out.push({
+        code: file.code,
+        label: exportTransportFileLabel(file.code, index),
+        uploadedBy: 'gl_et',
+        category: 'transit',
+        file: { id: file.id, name: file.name, url: file.url },
+      });
+    });
+  }
+
+  return out;
+}
diff --git a/apps/edr-freight-api/src/modules/files/files.service.ts b/apps/edr-freight-api/src/modules/files/files.service.ts
index 4bf8362f9..ec1fb6fa9 100644
--- a/apps/edr-freight-api/src/modules/files/files.service.ts
+++ b/apps/edr-freight-api/src/modules/files/files.service.ts
@@ -61,6 +61,14 @@ export class FilesService {
     return this.upload(input);
   }
 
+  async deleteByCode(
+    resourceId: string,
+    resource: string,
+    code: string,
+  ): Promise<void> {
+    await this.filesRepository.deleteByCode(resourceId, resource, code);
+  }
+
   async uploadMany(
     resourceId: string,
     resource: string,
diff --git a/apps/edr-freight-api/src/modules/first-mile/dto/create-first-mile.dto.ts b/apps/edr-freight-api/src/modules/first-mile/dto/create-first-mile.dto.ts
index e2535083e..45e9f5b1a 100644
--- a/apps/edr-freight-api/src/modules/first-mile/dto/create-first-mile.dto.ts
+++ b/apps/edr-freight-api/src/modules/first-mile/dto/create-first-mile.dto.ts
@@ -1,6 +1,6 @@
 import { ApiProperty, ApiPropertyOptional } from '@nestjs/swagger';
 import { Transform } from 'class-transformer';
-import { IsIn, IsNumber, IsOptional, IsUUID, Min } from 'class-validator';
+import { IsBoolean, IsIn, IsNumber, IsOptional, IsUUID, Min } from 'class-validator';
 
 import { FIRST_MILE_STATUSES, FirstMileStatus } from '../entities/first-mile.entity';
 
@@ -58,4 +58,9 @@ export class CreateFirstMileDto {
   @Transform(({ value }) => (value === '' ? undefined : value))
   @IsUUID()
   vehicleId?: string | null;
+
+  @ApiPropertyOptional({ description: 'Invoice payment status', default: false })
+  @IsOptional()
+  @IsBoolean()
+  paid?: boolean;
 }
diff --git a/apps/edr-freight-api/src/modules/first-mile/entities/first-mile.entity.ts b/apps/edr-freight-api/src/modules/first-mile/entities/first-mile.entity.ts
index 253d2d4c8..27dcfef87 100644
--- a/apps/edr-freight-api/src/modules/first-mile/entities/first-mile.entity.ts
+++ b/apps/edr-freight-api/src/modules/first-mile/entities/first-mile.entity.ts
@@ -35,6 +35,9 @@ export class FirstMile extends BaseEntity {
   @Column({ name: 'remaining_payment', type: 'numeric', precision: 14, scale: 2, default: 0 })
   remainingPayment!: number;
 
+  @Column({ name: 'paid', type: 'boolean', default: false })
+  paid!: boolean;
+
   // TODO: uncomment after migration creates column
   // @Column({ type: 'boolean', default: false })
   // isPostPaymentCompleted!: boolean;
diff --git a/apps/edr-freight-api/src/modules/first-mile/first-mile-invoice.service.ts b/apps/edr-freight-api/src/modules/first-mile/first-mile-invoice.service.ts
index c63a4c9e1..22520aac1 100644
--- a/apps/edr-freight-api/src/modules/first-mile/first-mile-invoice.service.ts
+++ b/apps/edr-freight-api/src/modules/first-mile/first-mile-invoice.service.ts
@@ -48,7 +48,7 @@ export class FirstMileInvoiceService {
     }
 
     // Fetch the booking to get the companyId and companyProfileId
-    const fm = record.booking ? record : (await this.firstMileRepo.findById(record.bookingId, { relations: { booking: true } }));
+    const fm = record.booking ? record : (await this.firstMileRepo.findById(record.id, { relations: { booking: true } }));
     if (!fm) return null;
     if (!fm.booking?.companyId) {
       this.logger.warn(
diff --git a/apps/edr-freight-api/src/modules/first-mile/first-mile.controller.ts b/apps/edr-freight-api/src/modules/first-mile/first-mile.controller.ts
index 6bb307a4b..680bb5d09 100644
--- a/apps/edr-freight-api/src/modules/first-mile/first-mile.controller.ts
+++ b/apps/edr-freight-api/src/modules/first-mile/first-mile.controller.ts
@@ -21,6 +21,9 @@ import { AllocateFirstMileContainersDto } from './dto/allocate-containers.dto';
 import { FirstMileStatus } from './entities/first-mile.entity';
 import { FirstMileService } from './first-mile.service';
 import { FirstMileInvoiceService } from './first-mile-invoice.service';
+import { BillingService } from '../billing/billing.service';
+import { BookingsService } from '../bookings/bookings.service';
+import { Freight } from '@edr/types';
 
 @ApiTags('first-mile')
 @ApiBearerAuth()
@@ -30,7 +33,9 @@ export class FirstMileController {
   constructor(
     private readonly firstMileService: FirstMileService,
     private readonly firstMileInvoiceService: FirstMileInvoiceService,
-  ) {}
+    private readonly billingService: BillingService,
+    private readonly bookingsService: BookingsService
+  ) { }
 
   @Get()
   @ApiOperation({ summary: 'List first-mile legs' })
@@ -80,7 +85,34 @@ export class FirstMileController {
   async update(@Param('id', ParseUUIDPipe) id: string, @Body() dto: UpdateFirstMileDto) {
     const record = await this.firstMileService.update(id, dto);
     // Auto-generate invoice if distance or payment was updated
-    if (dto.exactKm !== undefined || dto.remainingPayment !== undefined) {
+    const booking  = await this.bookingsService.findById(record.bookingId);
+    if (dto.exactKm !== undefined || dto.exactKm != record.exactKm || dto.remainingPayment !== undefined || dto.remainingPayment !== record.remainingPayment) {
+    await this.billingService.generateInvoice({
+      source: Freight.InvoiceSource.FirstMile,
+      sourceId: record.id,
+      type: "FIRST_MILE",
+      companyId: booking.companyId,
+      companyProfileId: booking.companyProfileId,
+      currency: "ETB",
+
+      lines: [
+        {
+          chargeType: "FIRST_MILE",
+          description: "First Mile Transportation Service",
+          quantity: 1,
+          unitRate: record.remainingPayment,
+          amount: record.remainingPayment,
+          currency: "ETB",
+        },
+      ],
+
+      subtotalAmount: record.remainingPayment,
+      taxAmount: 0, // Replace if VAT/tax applies
+      totalAmount: record.remainingPayment,
+
+      dueInDays: 7,
+      status: Freight.InvoiceStatus.Pending,
+    });
       await this.firstMileInvoiceService.ensureInvoiceFor(record);
     }
     return record;
diff --git a/apps/edr-freight-api/src/modules/first-mile/first-mile.module.ts b/apps/edr-freight-api/src/modules/first-mile/first-mile.module.ts
index a69c920f1..799ae14e6 100644
--- a/apps/edr-freight-api/src/modules/first-mile/first-mile.module.ts
+++ b/apps/edr-freight-api/src/modules/first-mile/first-mile.module.ts
@@ -16,7 +16,7 @@ import { FirstMileService } from './first-mile.service';
 @Module({
   imports: [
     TypeOrmModule.forFeature([FirstMile, FirstMileContainerAllocation]),
-    BillingModule,
+    forwardRef(() => BillingModule),
     forwardRef(() => BookingsModule),
     VehiclesModule,
     DriversModule,
diff --git a/apps/edr-freight-api/src/modules/first-mile/first-mile.service.ts b/apps/edr-freight-api/src/modules/first-mile/first-mile.service.ts
index 08cd9ab10..ae0ada831 100644
--- a/apps/edr-freight-api/src/modules/first-mile/first-mile.service.ts
+++ b/apps/edr-freight-api/src/modules/first-mile/first-mile.service.ts
@@ -12,6 +12,8 @@ import { UpdateFirstMileDto } from './dto/update-first-mile.dto';
 import { FirstMile, FirstMileStatus } from './entities/first-mile.entity';
 import { FirstMileContainerAllocation } from './entities/first-mile-container-allocation.entity';
 import { FirstMileRepository } from './first-mile.repository';
+import { OnEvent } from '@nestjs/event-emitter';
+import { InvoiceEventPayload } from '../billing/billing.service';
 
 type FirstMileListFilter = {
   status?: FirstMileStatus;
@@ -146,6 +148,18 @@ export class FirstMileService {
     };
   }
 
+  @OnEvent("firstmile.invoice.paid")
+  async onBookingInvoicePaid(payload: InvoiceEventPayload): Promise<void> {
+    try {
+      await this.firstMileRepository.update(payload.sourceId, { paid: true } as any);
+      this.logger.log(`Marked first-mile record ${payload.sourceId} as paid (invoice ${payload.invoiceId})`);
+    } catch (err) {
+      this.logger.error(
+        `Failed to update first-mile payment status for record ${payload.sourceId}: ${String(err)}`,
+      );
+    }
+  }
+
   async findById(id: string): Promise<FirstMile> {
     const record = await this.firstMileRepository.findById(id, {
       relations: {
@@ -175,6 +189,7 @@ export class FirstMileService {
       estimatedKm: dto.estimatedKm ?? null,
       exactKm: dto.exactKm ?? null,
       vehicleId: dto.vehicleId ?? null,
+      paid: (dto as any).paid ?? false,
     });
   }
 
@@ -207,6 +222,7 @@ export class FirstMileService {
   async update(id: string, dto: UpdateFirstMileDto): Promise<FirstMile> {
     const existing = await this.findById(id);
 
+    const dtoAny = dto as any;
     const updated = await this.firstMileRepository.update(id, {
       ...(dto.bookingId !== undefined ? { bookingId: dto.bookingId } : {}),
       ...(dto.status !== undefined ? { status: dto.status } : {}),
@@ -215,7 +231,8 @@ export class FirstMileService {
       ...(dto.estimatedKm !== undefined ? { estimatedKm: dto.estimatedKm } : {}),
       ...(dto.exactKm !== undefined ? { exactKm: dto.exactKm } : {}),
       ...(dto.vehicleId !== undefined ? { vehicleId: dto.vehicleId } : {}),
-    });
+      ...(dtoAny.paid !== undefined ? { paid: dtoAny.paid } : {}),
+    } as any);
 
     if (!updated) {
       throw new NotFoundException(`First-mile record ${id} not found`);
diff --git a/apps/edr-freight-api/src/modules/fuel/dto/create-fuel-purchase.dto.ts b/apps/edr-freight-api/src/modules/fuel/dto/create-fuel-purchase.dto.ts
new file mode 100644
index 000000000..254af7104
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/fuel/dto/create-fuel-purchase.dto.ts
@@ -0,0 +1,40 @@
+import { IsUUID, IsNumber, IsDateString, IsString, IsOptional, IsEnum } from 'class-validator';
+import { PaymentMethod } from '../entities/fuel-purchase.entity';
+
+export class CreateFuelPurchaseDto {
+  @IsUUID()
+  vehicleId!: string;
+
+  @IsDateString()
+  purchaseDate!: string;
+
+  @IsNumber()
+  liters!: number;
+
+  @IsNumber()
+  costPerLiter!: number;
+
+  @IsOptional()
+  @IsString()
+  fuelStation?: string;
+
+  @IsEnum(PaymentMethod)
+  @IsOptional()
+  paymentMethod?: PaymentMethod;
+
+  @IsOptional()
+  @IsNumber()
+  odometerReading?: number;
+
+  @IsOptional()
+  @IsUUID()
+  driverId?: string;
+
+  @IsOptional()
+  @IsString()
+  receiptNumber?: string;
+
+  @IsOptional()
+  @IsString()
+  notes?: string;
+}
diff --git a/apps/edr-freight-api/src/modules/fuel/entities/fuel-consumption.entity.ts b/apps/edr-freight-api/src/modules/fuel/entities/fuel-consumption.entity.ts
new file mode 100644
index 000000000..aabafd17c
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/fuel/entities/fuel-consumption.entity.ts
@@ -0,0 +1,35 @@
+import { BaseEntity } from '@edr/api-common';
+import { Entity, Column, ManyToOne, JoinColumn, Index } from 'typeorm';
+import { Vehicle } from '../../vehicles/entities/vehicle.entity';
+
+@Entity({ name: 'fuel_consumption', schema: 'freight' })
+@Index(['vehicleId', 'month'])
+export class FuelConsumption extends BaseEntity {
+  @Column({ name: 'vehicle_id', type: 'uuid' })
+  vehicleId!: string;
+
+  @ManyToOne(() => Vehicle, { eager: false })
+  @JoinColumn({ name: 'vehicle_id' })
+  vehicle!: Vehicle;
+
+  @Column({ name: 'month', type: 'date' })
+  month!: Date;
+
+  @Column({ name: 'total_liters', type: 'numeric', precision: 10, scale: 2 })
+  totalLiters!: number;
+
+  @Column({ name: 'total_cost', type: 'numeric', precision: 14, scale: 2 })
+  totalCost!: number;
+
+  @Column({ name: 'total_distance_km', type: 'numeric', precision: 10, scale: 2, default: 0 })
+  totalDistanceKm: number = 0;
+
+  @Column({ name: 'fuel_efficiency_km_per_l', type: 'numeric', precision: 10, scale: 2, nullable: true })
+  fuelEfficiencyKmPerL?: number;
+
+  @Column({ name: 'number_of_purchases', type: 'integer', default: 0 })
+  numberOfPurchases!: number;
+
+  @Column({ name: 'average_cost_per_liter', type: 'numeric', precision: 10, scale: 2, nullable: true })
+  averageCostPerLiter?: number;
+}
diff --git a/apps/edr-freight-api/src/modules/fuel/entities/fuel-purchase.entity.ts b/apps/edr-freight-api/src/modules/fuel/entities/fuel-purchase.entity.ts
new file mode 100644
index 000000000..163618d0b
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/fuel/entities/fuel-purchase.entity.ts
@@ -0,0 +1,51 @@
+import { BaseEntity } from '@edr/api-common';
+import { Entity, Column, ManyToOne, JoinColumn } from 'typeorm';
+import { Vehicle } from '../../vehicles/entities/vehicle.entity';
+
+export enum PaymentMethod {
+  CASH = 'CASH',
+  CARD = 'CARD',
+  FUEL_CARD = 'FUEL_CARD',
+  TRANSFER = 'TRANSFER',
+  CHEQUE = 'CHEQUE',
+}
+
+@Entity({ name: 'fuel_purchases', schema: 'freight' })
+export class FuelPurchase extends BaseEntity {
+  @Column({ name: 'vehicle_id', type: 'uuid' })
+  vehicleId!: string;
+
+  @ManyToOne(() => Vehicle, { eager: false })
+  @JoinColumn({ name: 'vehicle_id' })
+  vehicle!: Vehicle;
+
+  @Column({ name: 'purchase_date', type: 'timestamptz' })
+  purchaseDate!: Date;
+
+  @Column({ name: 'liters', type: 'numeric', precision: 10, scale: 2 })
+  liters!: number;
+
+  @Column({ name: 'cost_per_liter', type: 'numeric', precision: 10, scale: 2 })
+  costPerLiter!: number;
+
+  @Column({ name: 'total_cost', type: 'numeric', precision: 14, scale: 2 })
+  totalCost!: number;
+
+  @Column({ name: 'fuel_station', nullable: true })
+  fuelStation?: string;
+
+  @Column({ name: 'payment_method', type: 'varchar', default: PaymentMethod.CASH })
+  paymentMethod!: PaymentMethod;
+
+  @Column({ name: 'odometer_reading', type: 'numeric', nullable: true })
+  odometerReading?: number;
+
+  @Column({ name: 'driver_id', type: 'uuid', nullable: true })
+  driverId?: string;
+
+  @Column({ name: 'receipt_number', nullable: true })
+  receiptNumber?: string;
+
+  @Column({ type: 'text', nullable: true })
+  notes?: string;
+}
diff --git a/apps/edr-freight-api/src/modules/fuel/fuel.controller.ts b/apps/edr-freight-api/src/modules/fuel/fuel.controller.ts
new file mode 100644
index 000000000..62207bfa1
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/fuel/fuel.controller.ts
@@ -0,0 +1,60 @@
+import { Controller, Post, Get, Body, Param, Query } from '@nestjs/common';
+import { ApiTags, ApiOperation } from '@nestjs/swagger';
+import { FuelService } from './fuel.service';
+import { CreateFuelPurchaseDto } from './dto/create-fuel-purchase.dto';
+
+@ApiTags('Fuel Management')
+@Controller('fuel')
+export class FuelController {
+  constructor(private readonly fuelService: FuelService) {}
+
+  @Post('purchases')
+  @ApiOperation({ summary: 'Record fuel purchase' })
+  async recordFuelPurchase(@Body() dto: CreateFuelPurchaseDto) {
+    return this.fuelService.recordFuelPurchase(dto);
+  }
+
+  @Get('purchases')
+  @ApiOperation({ summary: 'Get all fuel purchases' })
+  async getAllFuelPurchases() {
+    return this.fuelService.getAllFuelPurchases();
+  }
+
+  @Get('purchases/:vehicleId')
+  @ApiOperation({ summary: 'Get fuel purchases for vehicle' })
+  async getFuelPurchases(
+    @Param('vehicleId') vehicleId: string,
+    @Query('startDate') startDate: string,
+    @Query('endDate') endDate: string,
+  ) {
+    return this.fuelService.getFuelPurchases(
+      vehicleId,
+      new Date(startDate),
+      new Date(endDate),
+    );
+  }
+
+  @Get('consumption/:vehicleId/:month')
+  @ApiOperation({ summary: 'Get monthly fuel consumption' })
+  async getMonthlyConsumption(
+    @Param('vehicleId') vehicleId: string,
+    @Param('month') month: string,
+  ) {
+    return this.fuelService.getMonthlyConsumption(vehicleId, new Date(month));
+  }
+
+  @Get('stats')
+  @ApiOperation({ summary: 'Get fleet-wide fuel statistics' })
+  async getFleetFuelStats(@Query('months') months: number = 12) {
+    return this.fuelService.getFleetFuelStats(months);
+  }
+
+  @Get('stats/:vehicleId')
+  @ApiOperation({ summary: 'Get fuel statistics for vehicle' })
+  async getVehicleFuelStats(
+    @Param('vehicleId') vehicleId: string,
+    @Query('months') months: number = 12,
+  ) {
+    return this.fuelService.getVehicleFuelStats(vehicleId, months);
+  }
+}
diff --git a/apps/edr-freight-api/src/modules/fuel/fuel.module.ts b/apps/edr-freight-api/src/modules/fuel/fuel.module.ts
new file mode 100644
index 000000000..258350f1c
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/fuel/fuel.module.ts
@@ -0,0 +1,15 @@
+import { Module } from '@nestjs/common';
+import { TypeOrmModule } from '@nestjs/typeorm';
+import { FuelController } from './fuel.controller';
+import { FuelService } from './fuel.service';
+import { FuelRepository } from './fuel.repository';
+import { FuelPurchase } from './entities/fuel-purchase.entity';
+import { FuelConsumption } from './entities/fuel-consumption.entity';
+
+@Module({
+  imports: [TypeOrmModule.forFeature([FuelPurchase, FuelConsumption])],
+  controllers: [FuelController],
+  providers: [FuelService, FuelRepository],
+  exports: [FuelService],
+})
+export class FuelModule {}
diff --git a/apps/edr-freight-api/src/modules/fuel/fuel.repository.ts b/apps/edr-freight-api/src/modules/fuel/fuel.repository.ts
new file mode 100644
index 000000000..d062c38e1
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/fuel/fuel.repository.ts
@@ -0,0 +1,76 @@
+import { Injectable } from '@nestjs/common';
+import { InjectRepository } from '@nestjs/typeorm';
+import { BaseRepository } from '@edr/api-common';
+import { Repository, Between } from 'typeorm';
+import { FuelPurchase } from './entities/fuel-purchase.entity';
+import { FuelConsumption } from './entities/fuel-consumption.entity';
+
+@Injectable()
+export class FuelRepository extends BaseRepository<FuelPurchase> {
+  constructor(
+    @InjectRepository(FuelPurchase)
+    private readonly purchaseRepository: Repository<FuelPurchase>,
+    @InjectRepository(FuelConsumption)
+    private readonly consumptionRepository: Repository<FuelConsumption>,
+  ) {
+    super(purchaseRepository);
+  }
+
+  async findByVehicleAndDateRange(
+    vehicleId: string,
+    startDate: Date,
+    endDate: Date,
+  ): Promise<FuelPurchase[]> {
+    return this.purchaseRepository.find({
+      where: {
+        vehicleId,
+        purchaseDate: Between(startDate, endDate),
+      },
+      order: { purchaseDate: 'DESC' },
+    });
+  }
+
+  async getMonthlyConsumption(
+    vehicleId: string,
+    month: Date,
+  ): Promise<FuelConsumption | null> {
+    return this.consumptionRepository.findOne({
+      where: {
+        vehicleId,
+        month,
+      },
+    });
+  }
+
+  async updateMonthlyConsumption(
+    vehicleId: string,
+    month: Date,
+    data: Partial<FuelConsumption>,
+  ): Promise<FuelConsumption> {
+    let consumption = await this.consumptionRepository.findOne({
+      where: {
+        vehicleId,
+        month,
+      },
+    });
+
+    if (!consumption) {
+      consumption = this.consumptionRepository.create({
+        vehicleId,
+        month,
+        ...data,
+      });
+    } else {
+      Object.assign(consumption, data);
+    }
+
+    return this.consumptionRepository.save(consumption);
+  }
+
+  async findPurchasesByVehicle(vehicleId: string): Promise<FuelPurchase[]> {
+    return this.purchaseRepository.find({
+      where: { vehicleId },
+      order: { purchaseDate: 'DESC' },
+    });
+  }
+}
diff --git a/apps/edr-freight-api/src/modules/fuel/fuel.service.ts b/apps/edr-freight-api/src/modules/fuel/fuel.service.ts
new file mode 100644
index 000000000..54c157c2d
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/fuel/fuel.service.ts
@@ -0,0 +1,121 @@
+import { Injectable } from '@nestjs/common';
+import { InjectRepository } from '@nestjs/typeorm';
+import { Repository } from 'typeorm';
+import { FuelRepository } from './fuel.repository';
+import { FuelPurchase } from './entities/fuel-purchase.entity';
+import { FuelConsumption } from './entities/fuel-consumption.entity';
+import { CreateFuelPurchaseDto } from './dto/create-fuel-purchase.dto';
+
+@Injectable()
+export class FuelService {
+  constructor(
+    private readonly fuelRepository: FuelRepository,
+    @InjectRepository(FuelPurchase)
+    private readonly purchaseRepository: Repository<FuelPurchase>,
+  ) {}
+
+  async recordFuelPurchase(dto: CreateFuelPurchaseDto): Promise<FuelPurchase> {
+    const totalCost = dto.liters * dto.costPerLiter;
+
+    const purchase = this.purchaseRepository.create({
+      ...dto,
+      totalCost,
+    });
+
+    const saved = await this.purchaseRepository.save(purchase);
+
+    // Update monthly consumption
+    await this.updateMonthlyConsumption(dto.vehicleId, new Date(dto.purchaseDate));
+
+    return saved;
+  }
+
+  async getAllFuelPurchases(): Promise<FuelPurchase[]> {
+    return this.purchaseRepository
+      .createQueryBuilder('purchase')
+      .leftJoinAndSelect('purchase.vehicle', 'vehicle')
+      .orderBy('purchase.purchaseDate', 'DESC')
+      .getMany();
+  }
+
+  async getFuelPurchases(
+    vehicleId: string,
+    startDate: Date,
+    endDate: Date,
+  ): Promise<FuelPurchase[]> {
+    return this.fuelRepository.findByVehicleAndDateRange(vehicleId, startDate, endDate);
+  }
+
+  async getMonthlyConsumption(
+    vehicleId: string,
+    month: Date,
+  ): Promise<FuelConsumption | null> {
+    return this.fuelRepository.getMonthlyConsumption(vehicleId, month);
+  }
+
+  async getFleetFuelStats(monthsBack: number = 12) {
+    const endDate = new Date();
+    const startDate = new Date(endDate.getFullYear(), endDate.getMonth() - monthsBack, 1);
+
+    const purchases = await this.purchaseRepository
+      .createQueryBuilder('purchase')
+      .where('purchase.purchaseDate BETWEEN :startDate AND :endDate', { startDate, endDate })
+      .getMany();
+
+    const totalLiters = purchases.reduce((sum: number, p: FuelPurchase) => sum + Number(p.liters), 0);
+    const totalCost = purchases.reduce((sum: number, p: FuelPurchase) => sum + Number(p.totalCost), 0);
+    const averagePrice = totalLiters > 0 ? totalCost / totalLiters : 0;
+
+    return {
+      totalPurchases: purchases.length,
+      totalLiters,
+      totalCost,
+      averagePricePerLiter: averagePrice,
+      averageEfficiency: 0, // Placeholder - would need distance data
+      dateRange: { startDate, endDate },
+    };
+  }
+
+  async getVehicleFuelStats(vehicleId: string, monthsBack: number = 12) {
+    const endDate = new Date();
+    const startDate = new Date(endDate.getFullYear(), endDate.getMonth() - monthsBack, 1);
+
+    const purchases = await this.getFuelPurchases(vehicleId, startDate, endDate);
+
+    const totalLiters = purchases.reduce((sum: number, p: FuelPurchase) => sum + Number(p.liters), 0);
+    const totalCost = purchases.reduce((sum: number, p: FuelPurchase) => sum + Number(p.totalCost), 0);
+    const averagePrice = totalLiters > 0 ? totalCost / totalLiters : 0;
+
+    return {
+      vehicleId,
+      totalPurchases: purchases.length,
+      totalLiters,
+      totalCost,
+      averagePricePerLiter: averagePrice,
+      dateRange: { startDate, endDate },
+    };
+  }
+
+  private async updateMonthlyConsumption(vehicleId: string, date: Date): Promise<void> {
+    const monthStart = new Date(date.getFullYear(), date.getMonth(), 1);
+    const monthEnd = new Date(monthStart.getFullYear(), monthStart.getMonth() + 1, 1);
+
+    const purchases = await this.fuelRepository.findByVehicleAndDateRange(
+      vehicleId,
+      monthStart,
+      monthEnd,
+    );
+
+    const totalLiters = purchases.reduce((sum: number, p: FuelPurchase) => sum + Number(p.liters), 0);
+    const totalCost = purchases.reduce((sum: number, p: FuelPurchase) => sum + Number(p.totalCost), 0);
+    const numberOfPurchases = purchases.length;
+    const averageCostPerLiter = totalLiters > 0 ? totalCost / totalLiters : 0;
+
+    await this.fuelRepository.updateMonthlyConsumption(vehicleId, monthStart, {
+      totalLiters,
+      totalCost,
+      numberOfPurchases,
+      averageCostPerLiter,
+    });
+  }
+}
diff --git a/apps/edr-freight-api/src/modules/last-mile/dto/create-last-mile.dto.ts b/apps/edr-freight-api/src/modules/last-mile/dto/create-last-mile.dto.ts
index 4f6f5fc8f..08de632f1 100644
--- a/apps/edr-freight-api/src/modules/last-mile/dto/create-last-mile.dto.ts
+++ b/apps/edr-freight-api/src/modules/last-mile/dto/create-last-mile.dto.ts
@@ -1,6 +1,6 @@
 import { ApiProperty, ApiPropertyOptional } from '@nestjs/swagger';
 import { Transform } from 'class-transformer';
-import { IsIn, IsNumber, IsOptional, IsUUID, Min } from 'class-validator';
+import { IsBoolean, IsIn, IsNumber, IsOptional, IsUUID, Min } from 'class-validator';
 
 import { LAST_MILE_STATUSES, LastMileStatus } from '../entities/last-mile.entity';
 
@@ -58,4 +58,9 @@ export class CreateLastMileDto {
   @Transform(({ value }) => (value === '' ? undefined : value))
   @IsUUID()
   vehicleId?: string | null;
+
+  @ApiPropertyOptional({ description: 'Invoice payment status', default: false })
+  @IsOptional()
+  @IsBoolean()
+  paid?: boolean;
 }
diff --git a/apps/edr-freight-api/src/modules/last-mile/entities/last-mile.entity.ts b/apps/edr-freight-api/src/modules/last-mile/entities/last-mile.entity.ts
index 1747e308c..85d01b7f0 100644
--- a/apps/edr-freight-api/src/modules/last-mile/entities/last-mile.entity.ts
+++ b/apps/edr-freight-api/src/modules/last-mile/entities/last-mile.entity.ts
@@ -35,6 +35,9 @@ export class LastMile extends BaseEntity {
   @Column({ name: 'remaining_payment', type: 'numeric', precision: 14, scale: 2, default: 0 })
   remainingPayment!: number;
 
+  @Column({ name: 'paid', type: 'boolean', default: false })
+  paid!: boolean;
+
   // TODO: uncomment after migration creates column
   // @Column({ type: 'boolean', default: false })
   // isPostPaymentCompleted!: boolean;
diff --git a/apps/edr-freight-api/src/modules/last-mile/last-mile.controller.ts b/apps/edr-freight-api/src/modules/last-mile/last-mile.controller.ts
index 929d97a3e..88a96e6c2 100644
--- a/apps/edr-freight-api/src/modules/last-mile/last-mile.controller.ts
+++ b/apps/edr-freight-api/src/modules/last-mile/last-mile.controller.ts
@@ -21,6 +21,9 @@ import { AllocateLastMileContainersDto } from './dto/allocate-containers.dto';
 import { LastMileStatus } from './entities/last-mile.entity';
 import { LastMileService } from './last-mile.service';
 import { LastMileInvoiceService } from './last-mile-invoice.service';
+import { Freight } from '@edr/types';
+import { BillingService } from '../billing/billing.service';
+import { BookingsService } from '../bookings/bookings.service';
 
 @ApiTags('last-mile')
 @ApiBearerAuth()
@@ -30,6 +33,8 @@ export class LastMileController {
   constructor(
     private readonly lastMileService: LastMileService,
     private readonly lastMileInvoiceService: LastMileInvoiceService,
+    private readonly billingService: BillingService,
+    private readonly bookingsService: BookingsService
   ) {}
 
   @Get()
@@ -80,9 +85,36 @@ export class LastMileController {
   async update(@Param('id', ParseUUIDPipe) id: string, @Body() dto: UpdateLastMileDto) {
     const record = await this.lastMileService.update(id, dto);
     // Auto-generate invoice if distance or payment was updated
-    if (dto.exactKm !== undefined || dto.remainingPayment !== undefined) {
-      await this.lastMileInvoiceService.ensureInvoiceFor(record);
-    }
+      const booking  = await this.bookingsService.findById(record.bookingId);
+        if (dto.exactKm !== undefined || dto.exactKm != record.exactKm || dto.remainingPayment !== undefined || dto.remainingPayment !== record.remainingPayment) {
+        await this.billingService.generateInvoice({
+          source: Freight.InvoiceSource.LastMile,
+          sourceId: record.id,
+          type: "LAST_MILE",
+          companyId: booking.companyId,
+          companyProfileId: booking.companyProfileId,
+          currency: "ETB",
+    
+          lines: [
+            {
+              chargeType: "LAST_MILE",
+              description: "Last Mile Transportation Service",
+              quantity: 1,
+              unitRate: record.remainingPayment,
+              amount: record.remainingPayment,
+              currency: "ETB",
+            },
+          ],
+    
+          subtotalAmount: record.remainingPayment,
+          taxAmount: 0, // Replace if VAT/tax applies
+          totalAmount: record.remainingPayment,
+    
+          dueInDays: 7,
+          status: Freight.InvoiceStatus.Pending,
+        });
+         await this.lastMileInvoiceService.ensureInvoiceFor(record);
+        }
     return record;
   }
 
diff --git a/apps/edr-freight-api/src/modules/last-mile/last-mile.service.ts b/apps/edr-freight-api/src/modules/last-mile/last-mile.service.ts
index 5faad49b9..df439f28f 100644
--- a/apps/edr-freight-api/src/modules/last-mile/last-mile.service.ts
+++ b/apps/edr-freight-api/src/modules/last-mile/last-mile.service.ts
@@ -10,6 +10,8 @@ import { UpdateLastMileDto } from './dto/update-last-mile.dto';
 import { LastMile, LastMileStatus } from './entities/last-mile.entity';
 import { LastMileContainerAllocation } from './entities/last-mile-container-allocation.entity';
 import { LastMileRepository } from './last-mile.repository';
+import { InvoiceEventPayload } from '../billing/billing.service';
+import { OnEvent } from '@nestjs/event-emitter';
 
 type LastMileListFilter = {
   status?: LastMileStatus;
@@ -129,6 +131,12 @@ export class LastMileService {
   }
 
   async create(dto: CreateLastMileDto): Promise<LastMile> {
+    const [existing] = await this.lastMileRepository.findAll({
+      where: { bookingId: dto.bookingId },
+      take: 1,
+    });
+    if (existing) return existing;
+
     return this.lastMileRepository.create({
       bookingId: dto.bookingId,
       status: dto.status ?? 'READY_TO_TRANSIT',
@@ -137,12 +145,26 @@ export class LastMileService {
       estimatedKm: dto.estimatedKm ?? null,
       exactKm: dto.exactKm ?? null,
       vehicleId: dto.vehicleId ?? null,
+      paid: (dto as any).paid ?? false,
     });
   }
 
+  @OnEvent("lastmile.invoice.paid")
+  async onBookingInvoicePaid(payload: InvoiceEventPayload): Promise<void> {
+    try {
+      await this.lastMileRepository.update(payload.sourceId, { paid: true } as any);
+      this.logger.log(`Marked last-mile record ${payload.sourceId} as paid (invoice ${payload.invoiceId})`);
+    } catch (err) {
+      this.logger.error(
+        `Failed to update last-mile payment status for record ${payload.sourceId}: ${String(err)}`,
+      );
+    }
+  }
+
   async update(id: string, dto: UpdateLastMileDto): Promise<LastMile> {
     const existing = await this.findById(id);
 
+    const dtoAny = dto as any;
     const updated = await this.lastMileRepository.update(id, {
       ...(dto.bookingId !== undefined ? { bookingId: dto.bookingId } : {}),
       ...(dto.status !== undefined ? { status: dto.status } : {}),
@@ -151,7 +173,8 @@ export class LastMileService {
       ...(dto.estimatedKm !== undefined ? { estimatedKm: dto.estimatedKm } : {}),
       ...(dto.exactKm !== undefined ? { exactKm: dto.exactKm } : {}),
       ...(dto.vehicleId !== undefined ? { vehicleId: dto.vehicleId } : {}),
-    });
+      ...(dtoAny.paid !== undefined ? { paid: dtoAny.paid } : {}),
+    } as any);
 
     if (!updated) {
       throw new NotFoundException(`Last-mile record ${id} not found`);
diff --git a/apps/edr-freight-api/src/modules/maintenance/dto/create-maintenance.dto.ts b/apps/edr-freight-api/src/modules/maintenance/dto/create-maintenance.dto.ts
new file mode 100644
index 000000000..d3e70acff
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/maintenance/dto/create-maintenance.dto.ts
@@ -0,0 +1,87 @@
+import { IsUUID, IsString, IsDateString, IsNumber, IsOptional, IsEnum } from 'class-validator';
+import { MaintenanceType, MaintenanceStatus } from '../entities/maintenance-schedule.entity';
+
+export class CreateMaintenanceScheduleDto {
+  @IsUUID()
+  vehicleId!: string;
+
+  @IsEnum(MaintenanceType)
+  maintenanceType!: MaintenanceType;
+
+  @IsString()
+  description!: string;
+
+  @IsDateString()
+  scheduledDate!: string;
+
+  @IsOptional()
+  @IsNumber()
+  estimatedCost?: number;
+
+  @IsOptional()
+  @IsString()
+  serviceProvider?: string;
+
+  @IsOptional()
+  @IsString()
+  notes?: string;
+
+  @IsOptional()
+  @IsNumber()
+  nextDueKm?: number;
+
+  @IsOptional()
+  @IsDateString()
+  nextDueDate?: string;
+}
+
+export class CreateMaintenanceCostDto {
+  @IsUUID()
+  vehicleId!: string;
+
+  @IsOptional()
+  @IsUUID()
+  maintenanceScheduleId?: string;
+
+  @IsDateString()
+  incurredDate!: string;
+
+  @IsNumber()
+  costAmount!: number;
+
+  @IsString()
+  costType!: string;
+
+  @IsString()
+  description!: string;
+
+  @IsOptional()
+  @IsString()
+  serviceProvider?: string;
+
+  @IsOptional()
+  @IsString()
+  invoiceNumber?: string;
+
+  @IsOptional()
+  @IsString()
+  notes?: string;
+}
+
+export class UpdateMaintenanceScheduleDto {
+  @IsOptional()
+  @IsEnum(MaintenanceStatus)
+  status?: MaintenanceStatus;
+
+  @IsOptional()
+  @IsDateString()
+  completedDate?: string;
+
+  @IsOptional()
+  @IsNumber()
+  actualCost?: number;
+
+  @IsOptional()
+  @IsString()
+  notes?: string;
+}
diff --git a/apps/edr-freight-api/src/modules/maintenance/entities/maintenance-cost.entity.ts b/apps/edr-freight-api/src/modules/maintenance/entities/maintenance-cost.entity.ts
new file mode 100644
index 000000000..5afbaa80f
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/maintenance/entities/maintenance-cost.entity.ts
@@ -0,0 +1,43 @@
+import { BaseEntity } from '@edr/api-common';
+import { Entity, Column, ManyToOne, JoinColumn, Index } from 'typeorm';
+import { Vehicle } from '../../vehicles/entities/vehicle.entity';
+import { MaintenanceSchedule } from './maintenance-schedule.entity';
+
+@Entity({ name: 'maintenance_costs', schema: 'freight' })
+@Index(['vehicleId', 'incurredDate'])
+export class MaintenanceCost extends BaseEntity {
+  @Column({ name: 'vehicle_id', type: 'uuid' })
+  vehicleId!: string;
+
+  @ManyToOne(() => Vehicle, { eager: false })
+  @JoinColumn({ name: 'vehicle_id' })
+  vehicle!: Vehicle;
+
+  @Column({ name: 'maintenance_schedule_id', type: 'uuid', nullable: true })
+  maintenanceScheduleId?: string;
+
+  @ManyToOne(() => MaintenanceSchedule, { eager: false, onDelete: 'SET NULL' })
+  @JoinColumn({ name: 'maintenance_schedule_id' })
+  maintenanceSchedule?: MaintenanceSchedule;
+
+  @Column({ name: 'incurred_date', type: 'timestamptz' })
+  incurredDate!: Date;
+
+  @Column({ name: 'cost_amount', type: 'numeric', precision: 14, scale: 2 })
+  costAmount!: number;
+
+  @Column({ name: 'cost_type' })
+  costType!: string; // 'PARTS', 'LABOR', 'DIAGNOSTICS', 'OTHER'
+
+  @Column({ name: 'description' })
+  description!: string;
+
+  @Column({ name: 'service_provider', nullable: true })
+  serviceProvider?: string;
+
+  @Column({ name: 'invoice_number', nullable: true })
+  invoiceNumber?: string;
+
+  @Column({ type: 'text', nullable: true })
+  notes?: string;
+}
diff --git a/apps/edr-freight-api/src/modules/maintenance/entities/maintenance-schedule.entity.ts b/apps/edr-freight-api/src/modules/maintenance/entities/maintenance-schedule.entity.ts
new file mode 100644
index 000000000..a4d4d60a0
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/maintenance/entities/maintenance-schedule.entity.ts
@@ -0,0 +1,65 @@
+import { BaseEntity } from '@edr/api-common';
+import { Entity, Column, ManyToOne, JoinColumn, Index } from 'typeorm';
+import { Vehicle } from '../../vehicles/entities/vehicle.entity';
+
+export enum MaintenanceType {
+  PREVENTIVE = 'PREVENTIVE',
+  CORRECTIVE = 'CORRECTIVE',
+  INSPECTION = 'INSPECTION',
+  REPAIR = 'REPAIR',
+}
+
+export enum MaintenanceStatus {
+  SCHEDULED = 'SCHEDULED',
+  IN_PROGRESS = 'IN_PROGRESS',
+  COMPLETED = 'COMPLETED',
+  CANCELLED = 'CANCELLED',
+  OVERDUE = 'OVERDUE',
+}
+
+@Entity({ name: 'maintenance_schedules', schema: 'freight' })
+@Index(['vehicleId', 'scheduledDate'])
+export class MaintenanceSchedule extends BaseEntity {
+  @Column({ name: 'vehicle_id', type: 'uuid' })
+  vehicleId!: string;
+
+  @ManyToOne(() => Vehicle, { eager: false })
+  @JoinColumn({ name: 'vehicle_id' })
+  vehicle!: Vehicle;
+
+  @Column({ name: 'maintenance_type', type: 'varchar' })
+  maintenanceType!: MaintenanceType;
+
+  @Column({ name: 'description' })
+  description!: string;
+
+  @Column({ name: 'scheduled_date', type: 'timestamptz' })
+  scheduledDate!: Date;
+
+  @Column({ name: 'completed_date', type: 'timestamptz', nullable: true })
+  completedDate?: Date;
+
+  @Column({ name: 'estimated_cost', type: 'numeric', precision: 14, scale: 2, nullable: true })
+  estimatedCost?: number;
+
+  @Column({ name: 'actual_cost', type: 'numeric', precision: 14, scale: 2, nullable: true })
+  actualCost?: number;
+
+  @Column({ name: 'status', type: 'varchar', default: MaintenanceStatus.SCHEDULED })
+  status!: MaintenanceStatus;
+
+  @Column({ name: 'odometer_reading', type: 'numeric', nullable: true })
+  odometerReading?: number;
+
+  @Column({ name: 'service_provider', nullable: true })
+  serviceProvider?: string;
+
+  @Column({ name: 'notes', type: 'text', nullable: true })
+  notes?: string;
+
+  @Column({ name: 'next_due_km', type: 'numeric', nullable: true })
+  nextDueKm?: number;
+
+  @Column({ name: 'next_due_date', type: 'timestamptz', nullable: true })
+  nextDueDate?: Date;
+}
diff --git a/apps/edr-freight-api/src/modules/maintenance/maintenance.controller.ts b/apps/edr-freight-api/src/modules/maintenance/maintenance.controller.ts
new file mode 100644
index 000000000..de5ff08f2
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/maintenance/maintenance.controller.ts
@@ -0,0 +1,52 @@
+import { Controller, Post, Get, Patch, Body, Param } from '@nestjs/common';
+import { ApiTags, ApiOperation } from '@nestjs/swagger';
+import { MaintenanceService } from './maintenance.service';
+import { CreateMaintenanceScheduleDto, CreateMaintenanceCostDto, UpdateMaintenanceScheduleDto } from './dto/create-maintenance.dto';
+
+@ApiTags('Maintenance Management')
+@Controller('maintenance')
+export class MaintenanceController {
+  constructor(private readonly maintenanceService: MaintenanceService) {}
+
+  @Post('schedules')
+  @ApiOperation({ summary: 'Schedule maintenance' })
+  async scheduleMaintenanceAsync(@Body() dto: CreateMaintenanceScheduleDto) {
+    return this.maintenanceService.scheduleMaintenanceAsync(dto);
+  }
+
+  @Post('costs')
+  @ApiOperation({ summary: 'Record maintenance cost' })
+  async recordCost(@Body() dto: CreateMaintenanceCostDto) {
+    return this.maintenanceService.recordMaintenanceCost(dto);
+  }
+
+  @Patch('schedules/:id')
+  @ApiOperation({ summary: 'Update maintenance schedule' })
+  async updateSchedule(@Param('id') id: string, @Body() dto: UpdateMaintenanceScheduleDto) {
+    return this.maintenanceService.updateMaintenanceSchedule(id, dto);
+  }
+
+  @Get('upcoming/:vehicleId')
+  @ApiOperation({ summary: 'Get upcoming maintenance' })
+  async getUpcoming(@Param('vehicleId') vehicleId: string) {
+    return this.maintenanceService.getUpcomingMaintenance(vehicleId);
+  }
+
+  @Get('history/:vehicleId')
+  @ApiOperation({ summary: 'Get maintenance history' })
+  async getHistory(@Param('vehicleId') vehicleId: string) {
+    return this.maintenanceService.getMaintenanceHistory(vehicleId);
+  }
+
+  @Get('stats')
+  @ApiOperation({ summary: 'Get fleet-wide maintenance statistics' })
+  async getFleetStats() {
+    return this.maintenanceService.getFleetMaintenanceStats();
+  }
+
+  @Get('stats/:vehicleId')
+  @ApiOperation({ summary: 'Get maintenance statistics' })
+  async getStats(@Param('vehicleId') vehicleId: string) {
+    return this.maintenanceService.getVehicleMaintenanceStats(vehicleId);
+  }
+}
diff --git a/apps/edr-freight-api/src/modules/maintenance/maintenance.module.ts b/apps/edr-freight-api/src/modules/maintenance/maintenance.module.ts
new file mode 100644
index 000000000..a0227a733
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/maintenance/maintenance.module.ts
@@ -0,0 +1,15 @@
+import { Module } from '@nestjs/common';
+import { TypeOrmModule } from '@nestjs/typeorm';
+import { MaintenanceSchedule } from './entities/maintenance-schedule.entity';
+import { MaintenanceCost } from './entities/maintenance-cost.entity';
+import { MaintenanceService } from './maintenance.service';
+import { MaintenanceRepository } from './maintenance.repository';
+import { MaintenanceController } from './maintenance.controller';
+
+@Module({
+  imports: [TypeOrmModule.forFeature([MaintenanceSchedule, MaintenanceCost])],
+  providers: [MaintenanceService, MaintenanceRepository],
+  controllers: [MaintenanceController],
+  exports: [MaintenanceService],
+})
+export class MaintenanceModule {}
diff --git a/apps/edr-freight-api/src/modules/maintenance/maintenance.repository.ts b/apps/edr-freight-api/src/modules/maintenance/maintenance.repository.ts
new file mode 100644
index 000000000..9e8cf972e
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/maintenance/maintenance.repository.ts
@@ -0,0 +1,50 @@
+import { Injectable } from '@nestjs/common';
+import { InjectRepository } from '@nestjs/typeorm';
+import { BaseRepository } from '@edr/api-common';
+import { Repository, Between } from 'typeorm';
+import { MaintenanceSchedule, MaintenanceStatus } from './entities/maintenance-schedule.entity';
+import { MaintenanceCost } from './entities/maintenance-cost.entity';
+
+@Injectable()
+export class MaintenanceRepository extends BaseRepository<MaintenanceSchedule> {
+  constructor(
+    @InjectRepository(MaintenanceSchedule)
+    private readonly scheduleRepository: Repository<MaintenanceSchedule>,
+    @InjectRepository(MaintenanceCost)
+    private readonly costRepository: Repository<MaintenanceCost>,
+  ) {
+    super(scheduleRepository);
+  }
+
+  async getUpcomingMaintenance(vehicleId: string, daysAhead: number = 30) {
+    const futureDate = new Date(Date.now() + daysAhead * 24 * 60 * 60 * 1000);
+    return this.scheduleRepository.find({
+      where: {
+        vehicleId,
+        scheduledDate: Between(new Date(), futureDate),
+        status: MaintenanceStatus.SCHEDULED,
+      },
+      order: { scheduledDate: 'ASC' },
+    });
+  }
+
+  async getMaintenanceCosts(vehicleId: string, startDate: Date, endDate: Date) {
+    return this.costRepository.find({
+      where: {
+        vehicleId,
+        incurredDate: Between(startDate, endDate),
+      },
+      order: { incurredDate: 'DESC' },
+    });
+  }
+
+  async getTotalMaintenanceCost(vehicleId: string, startDate: Date, endDate: Date) {
+    const result = await this.costRepository
+      .createQueryBuilder()
+      .select('SUM(cost_amount)', 'total')
+      .where('vehicle_id = :vehicleId', { vehicleId })
+      .andWhere('incurred_date BETWEEN :startDate AND :endDate', { startDate, endDate })
+      .getRawOne();
+    return result?.total || 0;
+  }
+}
diff --git a/apps/edr-freight-api/src/modules/maintenance/maintenance.service.ts b/apps/edr-freight-api/src/modules/maintenance/maintenance.service.ts
new file mode 100644
index 000000000..e804243a0
--- /dev/null
+++ b/apps/edr-freight-api/src/modules/maintenance/maintenance.service.ts
@@ -0,0 +1,101 @@
+import { Injectable } from '@nestjs/common';
+import { InjectRepository } from '@nestjs/typeorm';
+import { Repository } from 'typeorm';
+import { MaintenanceRepository } from './maintenance.repository';
+import { MaintenanceSchedule } from './entities/maintenance-schedule.entity';
+import { MaintenanceCost } from './entities/maintenance-cost.entity';
+import { CreateMaintenanceScheduleDto, CreateMaintenanceCostDto, UpdateMaintenanceScheduleDto } from './dto/create-maintenance.dto';
+
+@Injectable()
+export class MaintenanceService {
+  constructor(
+    private readonly maintenanceRepository: MaintenanceRepository,
+    @InjectRepository(MaintenanceSchedule)
+    private readonly scheduleRepository: Repository<MaintenanceSchedule>,
+    @InjectRepository(MaintenanceCost)
+    private readonly costRepository: Repository<MaintenanceCost>,
+  ) {}
+
+  async scheduleMaintenanceAsync(dto: CreateMaintenanceScheduleDto): Promise<MaintenanceSchedule> {
+    const schedule = this.scheduleRepository.create({
+      ...dto,
+      scheduledDate: new Date(dto.scheduledDate),
+      nextDueDate: dto.nextDueDate ? new Date(dto.nextDueDate) : undefined,
+    });
+    return this.scheduleRepository.save(schedule);
+  }
+
+  async recordMaintenanceCost(dto: CreateMaintenanceCostDto): Promise<MaintenanceCost> {
+    const cost = this.costRepository.create({
+      ...dto,
+      incurredDate: new Date(dto.incurredDate),
+    });
+    return this.costRepository.save(cost);
+  }
+
+  async updateMaintenanceSchedule(
+    id: string,
+    dto: UpdateMaintenanceScheduleDto,
+  ): Promise<MaintenanceSchedule> {
+    await this.scheduleRepository.update(id, {
+      ...dto,
+      completedDate: dto.completedDate ? new Date(dto.completedDate) : undefined,
+    });
+    const updated = await this.scheduleRepository.findOneBy({ id });
+    return updated!;
+  }
+
+  async getUpcomingMaintenance(vehicleId: string) {
+    return this.maintenanceRepository.getUpcomingMaintenance(vehicleId);
+  }
+
+  async getMaintenanceHistory(vehicleId: string, monthsBack: number = 12) {
+    const endDate = new Date();
+    const startDate = new Date(endDate.getFullYear(), endDate.getMonth() - monthsBack, 1);
+    return this.maintenanceRepository.getMaintenanceCosts(vehicleId, startDate, endDate);
+  }
+
+  async getFleetMaintenanceStats(monthsBack: number = 12) {
+    const endDate = new Date();
+    const startDate = new Date(endDate.getFullYear(), endDate.getMonth() - monthsBack, 1);
+
+    const costs = await this.costRepository
+      .createQueryBuilder('cost')
+      .where('cost.incurredDate BETWEEN :startDate AND :endDate', { startDate, endDate })
+      .getMany();
+
+    const totalCost = costs.reduce((sum: number, c: MaintenanceCost) => sum + Number(c.costAmount), 0);
+
+    return {
+      totalCost,
+      numberOfMaintenanceItems: costs.length,
+      averageCostPerMaintenance: costs.length > 0 ? totalCost / costs.length : 0,
+      costByType: this.groupCostsByType(costs),
+    };
+  }
+
+  async getVehicleMaintenanceStats(vehicleId: string, monthsBack: number = 12) {
+    const endDate = new Date();
+    const startDate = new Date(endDate.getFullYear(), endDate.getMonth() - monthsBack, 1);
+
+    const costs = await this.maintenanceRepository.getMaintenanceCosts(vehicleId, startDate, endDate);
+    const totalCost = costs.reduce((sum: number, c: MaintenanceCost) => sum + Number(c.costAmount), 0);
+
+    return {
+      vehicleId,
+      totalCost,
+      numberOfMaintenanceItems: costs.length,
+      averageCostPerMaintenance: costs.length > 0 ? totalCost / costs.length : 0,
+      costByType: this.groupCostsByType(costs),
+    };
+  }
+
+  private groupCostsByType(costs: MaintenanceCost[]) {
+    const grouped: Record<string, number> = {};
+    costs.forEach((c) => {
+      if (!grouped[c.costType]) grouped[c.costType] = 0;
+      grouped[c.costType] += Number(c.costAmount);
+    });
+    return grouped;
+  }
+}
diff --git a/apps/edr-freight-api/src/modules/payment/internal-payment.controller.ts b/apps/edr-freight-api/src/modules/payment/internal-payment.controller.ts
index 0db38a751..57c95eab3 100644
--- a/apps/edr-freight-api/src/modules/payment/internal-payment.controller.ts
+++ b/apps/edr-freight-api/src/modules/payment/internal-payment.controller.ts
@@ -4,22 +4,22 @@ import {
     HttpCode,
     HttpStatus,
     Post,
-    UseGuards,
 } from "@nestjs/common";
 import { ApiOperation, ApiTags } from "@nestjs/swagger";
-import { ServiceAuthGuard } from "../../common/guards/service-auth.guard";
+import { Public } from "@edr/api-common";
 import { PaymentEventDto, MarkPaidResponseDto } from "./internal-payment.dto";
 import { PaymentService } from "./payment.service";
 
 /**
  * Consumer side of the payment microservice's outbox relay.
- * Only the payment service may call this (shared SERVICE_AUTH_TOKEN).
+ * WARNING: currently unauthenticated — anyone who can reach the API can mark
+ * payments as paid. Re-add ServiceAuthGuard before exposing beyond a trusted network.
  * Idempotent by design — the relay delivers at-least-once, so duplicates must be harmless.
  * Becomes a queue consumer via PaymentEventsConsumer when RabbitMQ is available;
  * this HTTP endpoint remains as a transport-agnostic fallback.
  */
 @ApiTags("Internal Payments")
-@UseGuards(ServiceAuthGuard)
+@Public()
 @Controller("internal/payments")
 export class InternalPaymentController {
     constructor(private readonly paymentService: PaymentService) { }
diff --git a/apps/edr-freight-api/src/modules/payment/payment.module.ts b/apps/edr-freight-api/src/modules/payment/payment.module.ts
index 330521218..05267746d 100644
--- a/apps/edr-freight-api/src/modules/payment/payment.module.ts
+++ b/apps/edr-freight-api/src/modules/payment/payment.module.ts
@@ -13,6 +13,8 @@ import {
 
 import { ServiceAuthGuard } from "../../common/guards/service-auth.guard";
 import { BillingModule } from "../billing/billing.module";
+// import { FirstMileModule } from "../first-mile/first-mile.module";
+// import { TrainSchedulingModule } from "../train-scheduling/train-scheduling.module";
 import { PaymentRefundEntity } from "./entities/payment-refund.entity";
 import { PaymentWebhookEventEntity } from "./entities/payment-webhook-event.entity";
 import { PaymentEntity } from "./entities/payment.entity";
@@ -57,6 +59,8 @@ function rabbitMQImport(): DynamicModule[] {
         HttpModule.register({ timeout: 10_000 }),
         ConfigModule,
         forwardRef(() => BillingModule),
+        // forwardRef(() => TrainSchedulingModule),
+        // FirstMileModule,
         TypeOrmModule.forFeature([
             PaymentEntity,
             PaymentWebhookEventEntity,
diff --git a/apps/edr-freight-api/src/modules/payment/payments.dto.ts b/apps/edr-freight-api/src/modules/payment/payments.dto.ts
index 67ca68e87..3b86a940c 100644
--- a/apps/edr-freight-api/src/modules/payment/payments.dto.ts
+++ b/apps/edr-freight-api/src/modules/payment/payments.dto.ts
@@ -15,9 +15,9 @@ export enum PaymentMethodTypeEnum {
 }
 
 export class InitiatePaymentDto {
-  @ApiProperty({ example: "booking-uuid" })
+  @ApiProperty({ example: "invoice-uuid" })
   @IsString()
-  bookingId!: string;
+  invoiceId!: string;
 
   @ApiProperty({
     enum: PaymentMethodTypeEnum,
diff --git a/apps/edr-freight-api/src/modules/routes/dto/create-route.dto.ts b/apps/edr-freight-api/src/modules/routes/dto/create-route.dto.ts
index 45e737607..3f4d2e4ff 100644
--- a/apps/edr-freight-api/src/modules/routes/dto/create-route.dto.ts
+++ b/apps/edr-freight-api/src/modules/routes/dto/create-route.dto.ts
@@ -1,19 +1,31 @@
 import { ApiProperty, ApiPropertyOptional } from '@nestjs/swagger';
 import { Type } from 'class-transformer';
-import { ArrayMinSize, IsArray, IsBoolean, IsOptional, IsString, IsUUID, MaxLength, ValidateNested } from 'class-validator';
+import {
+  ArrayMinSize,
+  IsArray,
+  IsEnum,
+  IsNumber,
+  IsOptional,
+  IsUUID,
+  Min,
+  ValidateNested,
+} from 'class-validator';
+
+import { RouteStatus } from '../entities/route.entity';
 
 export class CreateRouteMilestoneDto {
   @ApiProperty({ format: 'uuid' })
   @IsUUID()
   yardId!: string;
+
+  @ApiPropertyOptional({ description: 'Km from the previous stop (0 for origin)' })
+  @IsOptional()
+  @IsNumber()
+  @Min(0)
+  distanceKm?: number;
 }
 
 export class CreateRouteDto {
-  @ApiProperty()
-  @IsString()
-  @MaxLength(120)
-  name!: string;
-
   @ApiProperty({ type: [CreateRouteMilestoneDto] })
   @IsArray()
   @ArrayMinSize(2)
@@ -21,8 +33,8 @@ export class CreateRouteDto {
   @Type(() => CreateRouteMilestoneDto)
   milestones!: CreateRouteMilestoneDto[];
 
-  @ApiPropertyOptional()
+  @ApiPropertyOptional({ enum: ['AVAILABLE', 'MAINTENANCE', 'DAMAGED', 'STOP_WORKING'] })
   @IsOptional()
-  @IsBoolean()
-  isActive?: boolean;
+  @IsEnum(['AVAILABLE', 'MAINTENANCE', 'DAMAGED', 'STOP_WORKING'])
+  status?: RouteStatus;
 }
diff --git a/apps/edr-freight-api/src/modules/routes/dto/filter-routes.dto.ts b/apps/edr-freight-api/src/modules/routes/dto/filter-routes.dto.ts
index 020a34cdf..59188a2a6 100644
--- a/apps/edr-freight-api/src/modules/routes/dto/filter-routes.dto.ts
+++ b/apps/edr-freight-api/src/modules/routes/dto/filter-routes.dto.ts
@@ -1,16 +1,16 @@
 import { ApiPropertyOptional } from '@nestjs/swagger';
-import { Transform } from 'class-transformer';
-import { IsBoolean, IsOptional, IsString } from 'class-validator';
+import { IsEnum, IsOptional, IsString } from 'class-validator';
+
+import { RouteStatus } from '../entities/route.entity';
 
 export class FilterRoutesDto {
-  @ApiPropertyOptional()
+  @ApiPropertyOptional({ description: 'Search origin/destination yard codes or names' })
   @IsOptional()
   @IsString()
   search?: string;
 
-  @ApiPropertyOptional()
+  @ApiPropertyOptional({ enum: ['AVAILABLE', 'MAINTENANCE', 'DAMAGED', 'STOP_WORKING'] })
   @IsOptional()
-  @Transform(({ value }) => value === 'true' || value === true)
-  @IsBoolean()
-  isActive?: boolean;
+  @IsEnum(['AVAILABLE', 'MAINTENANCE', 'DAMAGED', 'STOP_WORKING'])
+  status?: RouteStatus;
 }
diff --git a/apps/edr-freight-api/src/modules/routes/entities/route-milestone.entity.ts b/apps/edr-freight-api/src/modules/routes/entities/route-milestone.entity.ts
index 63e37b8ec..c40baaa82 100644
--- a/apps/edr-freight-api/src/modules/routes/entities/route-milestone.entity.ts
+++ b/apps/edr-freight-api/src/modules/routes/entities/route-milestone.entity.ts
@@ -23,4 +23,8 @@ export class RouteMilestone extends BaseEntity {
 
   @Column({ name: 'sequence_no', type: 'int' })
   sequenceNo!: number;
+
+  /** Kilometres from the previous stop (0 for origin). */
+  @Column({ name: 'distance_km', type: 'decimal', precision: 10, scale: 2, nullable: true })
+  distanceKm?: number | null;
 }
diff --git a/apps/edr-freight-api/src/modules/routes/entities/route.entity.ts b/apps/edr-freight-api/src/modules/routes/entities/route.entity.ts
index 8c6e4785e..9c25778dc 100644
--- a/apps/edr-freight-api/src/modules/routes/entities/route.entity.ts
+++ b/apps/edr-freight-api/src/modules/routes/entities/route.entity.ts
@@ -4,13 +4,11 @@ import { Column, Entity, Index, JoinColumn, ManyToOne, OneToMany } from 'typeorm
 import { Yard } from '../../rule-engine/entities/yard.entity';
 import { RouteMilestone } from './route-milestone.entity';
 
-@Entity({ schema: 'freight', name: 'routes' })
-@Index(['name'])
-@Index(['isActive'])
-export class Route extends BaseEntity {
-  @Column({ name: 'name', type: 'varchar', length: 120, unique: true })
-  name!: string;
+export type RouteStatus = 'AVAILABLE' | 'MAINTENANCE' | 'DAMAGED' | 'STOP_WORKING';
 
+@Entity({ schema: 'freight', name: 'routes' })
+@Index(['status'])
+export class Route extends BaseEntity {
   @Column({ name: 'origin_yard_id', type: 'uuid' })
   originYardId!: string;
 
@@ -25,9 +23,24 @@ export class Route extends BaseEntity {
   @JoinColumn({ name: 'destination_yard_id' })
   destinationYard?: Yard;
 
-  @Column({ name: 'is_active', type: 'boolean', default: true })
-  isActive!: boolean;
+  @Column({ name: 'status', type: 'varchar', length: 32, default: 'AVAILABLE' })
+  status!: RouteStatus;
 
   @OneToMany(() => RouteMilestone, (milestone) => milestone.route, { cascade: false })
   milestones?: RouteMilestone[];
 }
+
+export function formatRouteLabel(route: {
+  originYard?: { code?: string; name?: string } | null;
+  destinationYard?: { code?: string; name?: string } | null;
+}): string {
+  const origin = route.originYard?.code ?? route.originYard?.name ?? 'Origin';
+  const dest = route.destinationYard?.code ?? route.destinationYard?.name ?? 'Destination';
+  return `${origin} → ${dest}`;
+}
+
+export function totalRouteDistanceKm(
+  milestones: Array<{ distanceKm?: number | string | null }>,
+): number {
+  return milestones.reduce((sum, m) => sum + Number(m.distanceKm ?? 0), 0);
+}
diff --git a/apps/edr-freight-api/src/modules/routes/routes.service.ts b/apps/edr-freight-api/src/modules/routes/routes.service.ts
index 4c8e62498..937ffb0ae 100644
--- a/apps/edr-freight-api/src/modules/routes/routes.service.ts
+++ b/apps/edr-freight-api/src/modules/routes/routes.service.ts
@@ -1,12 +1,12 @@
-import { BadRequestException, ConflictException, Injectable, NotFoundException } from '@nestjs/common';
-import { DataSource, ILike } from 'typeorm';
+import { BadRequestException, Injectable, NotFoundException } from '@nestjs/common';
+import { DataSource } from 'typeorm';
 
 import { Yard } from '../rule-engine/entities/yard.entity';
 import { CreateRouteDto } from './dto/create-route.dto';
 import { FilterRoutesDto } from './dto/filter-routes.dto';
 import { UpdateRouteDto } from './dto/update-route.dto';
 import { RouteMilestone } from './entities/route-milestone.entity';
-import { Route } from './entities/route.entity';
+import { formatRouteLabel, Route } from './entities/route.entity';
 import { RoutesRepository } from './routes.repository';
 
 @Injectable()
@@ -16,11 +16,10 @@ export class RoutesService {
     private readonly routesRepository: RoutesRepository,
   ) {}
 
-  findAll(filter: FilterRoutesDto): Promise<Route[]> {
-    return this.routesRepository.findAll({
+  async findAll(filter: FilterRoutesDto): Promise<Route[]> {
+    const routes = await this.routesRepository.findAll({
       where: {
-        ...(filter.search ? { name: ILike(`%${filter.search.trim()}%`) } : {}),
-        ...(filter.isActive !== undefined ? { isActive: filter.isActive } : {}),
+        ...(filter.status ? { status: filter.status } : {}),
       },
       relations: {
         originYard: true,
@@ -28,10 +27,33 @@ export class RoutesService {
         milestones: { yard: true },
       },
       order: {
-        name: 'ASC',
         milestones: { sequenceNo: 'ASC' },
       },
     });
+
+    const sorted = [...routes].sort((a, b) =>
+      formatRouteLabel(a).localeCompare(formatRouteLabel(b)),
+    );
+
+    const query = filter.search?.trim().toLowerCase();
+    if (!query) return sorted;
+
+    return sorted.filter((route) => {
+      const haystack = [
+        formatRouteLabel(route),
+        route.originYard?.label,
+        route.originYard?.code,
+        route.destinationYard?.label,
+        route.destinationYard?.code,
+        ...(route.milestones ?? []).map(
+          (m) => m.yard?.label ?? m.yard?.code ?? m.yardId,
+        ),
+      ]
+        .filter(Boolean)
+        .join(' ')
+        .toLowerCase();
+      return haystack.includes(query);
+    });
   }
 
   async findById(id: string): Promise<Route> {
@@ -53,16 +75,14 @@ export class RoutesService {
   }
 
   async create(dto: CreateRouteDto): Promise<Route> {
-    await this.validateRouteName(dto.name);
     const validated = await this.validateMilestones(dto.milestones);
 
     const route = await this.dataSource.transaction(async (manager) => {
       const savedRoute = await manager.getRepository(Route).save(
         manager.getRepository(Route).create({
-          name: dto.name.trim(),
           originYardId: validated.originYardId,
           destinationYardId: validated.destinationYardId,
-          isActive: dto.isActive ?? true,
+          status: dto.status ?? 'AVAILABLE',
         }),
       );
 
@@ -72,6 +92,7 @@ export class RoutesService {
             routeId: savedRoute.id,
             yardId: milestone.yardId,
             sequenceNo: milestone.sequenceNo,
+            distanceKm: milestone.distanceKm,
           }),
         ),
       );
@@ -85,20 +106,16 @@ export class RoutesService {
   async update(id: string, dto: UpdateRouteDto): Promise<Route> {
     const existing = await this.findById(id);
 
-    if (dto.name && dto.name.trim() !== existing.name) {
-      await this.validateRouteName(dto.name, id);
-    }
-
     const milestoneInput = dto.milestones
       ? await this.validateMilestones(dto.milestones)
       : null;
 
     await this.dataSource.transaction(async (manager) => {
       await manager.getRepository(Route).update(id, {
-        name: dto.name?.trim() ?? existing.name,
         originYardId: milestoneInput?.originYardId ?? existing.originYardId,
-        destinationYardId: milestoneInput?.destinationYardId ?? existing.destinationYardId,
-        isActive: dto.isActive ?? existing.isActive,
+        destinationYardId:
+          milestoneInput?.destinationYardId ?? existing.destinationYardId,
+        ...(dto.status !== undefined ? { status: dto.status } : {}),
       });
 
       if (milestoneInput) {
@@ -109,6 +126,7 @@ export class RoutesService {
               routeId: id,
               yardId: milestone.yardId,
               sequenceNo: milestone.sequenceNo,
+              distanceKm: milestone.distanceKm,
             }),
           ),
         );
@@ -120,7 +138,9 @@ export class RoutesService {
 
   async deactivate(id: string): Promise<Route> {
     await this.findById(id);
-    const updated = await this.routesRepository.update(id, { isActive: false });
+    const updated = await this.routesRepository.update(id, {
+      status: 'STOP_WORKING',
+    } as never);
 
     if (!updated) {
       throw new NotFoundException(`Route ${id} not found`);
@@ -129,27 +149,32 @@ export class RoutesService {
     return this.findById(id);
   }
 
-  private async validateRouteName(name: string, routeId?: string) {
-    const trimmedName = name.trim();
-    const [existing] = await this.routesRepository.findAll({ where: { name: trimmedName } });
-
-    if (existing && existing.id !== routeId) {
-      throw new ConflictException(`Route name ${trimmedName} already exists`);
-    }
-  }
-
-  private async validateMilestones(milestones: Array<{ yardId: string }>) {
+  private async validateMilestones(
+    milestones: Array<{ yardId: string; distanceKm?: number }>,
+  ) {
     if (milestones.length < 2) {
       throw new BadRequestException('A route requires at least two yards');
     }
 
-    const normalized = milestones.map((milestone, index) => ({
-      yardId: milestone.yardId,
-      sequenceNo: index + 1,
-    }));
+    const normalized = milestones.map((milestone, index) => {
+      const distanceKm =
+        index === 0 ? 0 : milestone.distanceKm != null ? milestone.distanceKm : null;
+      if (index > 0 && (distanceKm == null || distanceKm < 0)) {
+        throw new BadRequestException(
+          `Enter segment KM for stop ${index + 1} (from previous yard).`,
+        );
+      }
+      return {
+        yardId: milestone.yardId,
+        sequenceNo: index + 1,
+        distanceKm,
+      };
+    });
 
     const uniqueYardIds = [...new Set(normalized.map((milestone) => milestone.yardId))];
-    const yards = await this.dataSource.getRepository(Yard).find({ where: uniqueYardIds.map((id) => ({ id })) });
+    const yards = await this.dataSource
+      .getRepository(Yard)
+      .find({ where: uniqueYardIds.map((id) => ({ id })) });
     const yardIds = new Set(yards.map((yard) => yard.id));
 
     for (const milestone of normalized) {
diff --git a/apps/edr-freight-api/src/modules/rule-engine/dto/create-cargo-type.dto.ts b/apps/edr-freight-api/src/modules/rule-engine/dto/create-cargo-type.dto.ts
index 794f97f83..f30ebd501 100644
--- a/apps/edr-freight-api/src/modules/rule-engine/dto/create-cargo-type.dto.ts
+++ b/apps/edr-freight-api/src/modules/rule-engine/dto/create-cargo-type.dto.ts
@@ -21,11 +21,6 @@ export class CreateCargoTypeDto {
   @IsUUID()
   parentGroupId?: string;
 
-  @ApiPropertyOptional({ default: false })
-  @IsOptional()
-  @IsBoolean()
-  showFreeTextBox?: boolean;
-
   @ApiPropertyOptional({ default: false })
   @IsOptional()
   @IsBoolean()
diff --git a/apps/edr-freight-api/src/modules/rule-engine/entities/cargo-type.entity.ts b/apps/edr-freight-api/src/modules/rule-engine/entities/cargo-type.entity.ts
index 2c1ed0e22..c8ac35f25 100644
--- a/apps/edr-freight-api/src/modules/rule-engine/entities/cargo-type.entity.ts
+++ b/apps/edr-freight-api/src/modules/rule-engine/entities/cargo-type.entity.ts
@@ -17,9 +17,6 @@ export class CargoType extends BaseEntity {
   @Column({ name: 'parent_group_id', type: 'uuid', nullable: true })
   parentGroupId?: string | null;
 
-  @Column({ name: 'show_free_text_box', type: 'boolean', default: false })
-  showFreeTextBox!: boolean;
-
   /**
    * How this cargo's quantity is measured: PER_TON (bulk) or PER_ITEM
    * (break-bulk). Nullable for container/legacy cargo, which is counted by
diff --git a/apps/edr-freight-api/src/modules/rule-engine/rule-engine.service.ts b/apps/edr-freight-api/src/modules/rule-engine/rule-engine.service.ts
index 16027f9c3..4b082e5fd 100644
--- a/apps/edr-freight-api/src/modules/rule-engine/rule-engine.service.ts
+++ b/apps/edr-freight-api/src/modules/rule-engine/rule-engine.service.ts
@@ -331,16 +331,14 @@ export class RuleEngineService {
   ): Promise<BookingApprovalStep[]> {
     await this.ensureDefaultApprovalRules();
 
-    let requiresDirectorApproval = options.freightType === 'BULK';
+    let requiresDirectorApproval = false;
 
     if (options.cargoTypeId) {
       const cargoType = await this.cargoTypesRepo.findById(options.cargoTypeId);
       if (!cargoType) {
         throw new BadRequestException(`Cargo type ${options.cargoTypeId} not found`);
       }
-      if (cargoType.requiresDirectorApproval) {
-        requiresDirectorApproval = true;
-      }
+      requiresDirectorApproval = cargoType.requiresDirectorApproval;
     }
 
     const chain = await this.approvalRulesRepo.findChainForCargo(
diff --git a/apps/edr-freight-api/src/modules/rule-engine/services/cargo-types.service.ts b/apps/edr-freight-api/src/modules/rule-engine/services/cargo-types.service.ts
index 5a343f910..f80ada585 100644
--- a/apps/edr-freight-api/src/modules/rule-engine/services/cargo-types.service.ts
+++ b/apps/edr-freight-api/src/modules/rule-engine/services/cargo-types.service.ts
@@ -79,7 +79,6 @@ export class CargoTypesService {
       code,
       cargoTypeName: dto.cargoTypeName,
       parentGroupId: dto.parentGroupId ?? null,
-      showFreeTextBox: dto.showFreeTextBox ?? false,
       requiresDirectorApproval: dto.requiresDirectorApproval ?? false,
       isActive: dto.isActive ?? true,
       unitOfMeasure: dto.unitOfMeasure ?? null,
diff --git a/apps/edr-freight-api/src/modules/train-scheduling/booking-batch.service.spec.ts b/apps/edr-freight-api/src/modules/train-scheduling/booking-batch.service.spec.ts
index 5cd06091a..9e974b31e 100644
--- a/apps/edr-freight-api/src/modules/train-scheduling/booking-batch.service.spec.ts
+++ b/apps/edr-freight-api/src/modules/train-scheduling/booking-batch.service.spec.ts
@@ -110,6 +110,7 @@ describe('BookingBatchService — PAID reconcile', () => {
       notifier as never,
       { addTimeout: jest.fn(), deleteTimeout: jest.fn(), doesExist: jest.fn() } as never,
       trainSchedulingService as never,
+      { syncPayableDueDate: jest.fn(), expirePayable: jest.fn() } as never,
     );
   });
 
diff --git a/apps/edr-freight-api/src/modules/train-scheduling/booking-batch.service.ts b/apps/edr-freight-api/src/modules/train-scheduling/booking-batch.service.ts
index f31d8561d..218a20436 100644
--- a/apps/edr-freight-api/src/modules/train-scheduling/booking-batch.service.ts
+++ b/apps/edr-freight-api/src/modules/train-scheduling/booking-batch.service.ts
@@ -4,6 +4,7 @@ import {
   Logger,
   NotFoundException,
   OnModuleInit,
+  Optional,
 } from '@nestjs/common';
 import { InjectDataSource } from '@nestjs/typeorm';
 import { Cron, SchedulerRegistry } from '@nestjs/schedule';
@@ -12,6 +13,7 @@ import { DataSource } from 'typeorm';
 import { Booking } from '../bookings/entities/booking.entity';
 import { BookingsRepository } from '../bookings/bookings.repository';
 import { Locomotive } from '../locomotives/entities/locomotive.entity';
+import { formatRouteLabel } from '../routes/entities/route.entity';
 import { TrainSchedule } from '../train-schedules/entities/train-schedule.entity';
 import { TrainScheduleBooking } from '../train-schedules/entities/train-schedule-booking.entity';
 import { TrainSchedulesRepository } from '../train-schedules/train-schedules.repository';
@@ -20,6 +22,10 @@ import { TrainSchedulingGlobalRules } from './entities/train-scheduling-global-r
 import { BookingNotifierService } from './booking-notifier.service';
 import { TrainSchedulingService } from './train-scheduling.service';
 import { eatDay, groupBookingsIntoBoardWindows } from './batch-window.util';
+import { Freight } from "@edr/types";
+import { BillingService } from "../billing/billing.service";
+
+
 import {
   BATCH_CRON,
   BATCH_TIMEZONE,
@@ -27,13 +33,14 @@ import {
   DEFAULT_CONTAINER_WAGON_LENGTH_METERS,
   DEFAULT_WAGONS_PER_BOOKING,
   PAYMENT_WINDOW_MS,
-} from './booking-batch.constants';
+} from "./booking-batch.constants";
 import {
   bookingTrainLengthMeters,
   deriveTrainCapacityFromLocomotive,
   wagonTypeDimensionsFromEntity,
 } from './train-capacity.util';
 import { WagonType } from '../wagon-types/entities/wagon-type.entity';
+import { ClearanceMilestoneService } from '../contracts/clearance-milestone.service';
 
 /** A train's remaining capacity along the three physical limits the batch enforces. */
 interface Capacity {
@@ -53,12 +60,12 @@ interface RouteDayGroup {
 type WagonLengths = { container: number; bulk: number };
 
 export type BatchBoardBookingState =
-  | 'ALLOCATED'
-  | 'SELECTED_FOR_BATCH'
-  | 'READY'
-  | 'WAITING'
-  | 'PENDING_CONTRACT'
-  | 'EXPIRED';
+  | "ALLOCATED"
+  | "SELECTED_FOR_BATCH"
+  | "READY"
+  | "WAITING"
+  | "PENDING_CONTRACT"
+  | "EXPIRED";
 
 export interface BatchBoardBooking {
   id: string;
@@ -73,10 +80,10 @@ export interface BatchBoardBooking {
 }
 
 export type BookingAllocationStatus =
-  | 'NOT_ATTEMPTED'
-  | 'ASSIGNED'
-  | 'DEFERRED'
-  | 'FAILED';
+  | "NOT_ATTEMPTED"
+  | "ASSIGNED"
+  | "DEFERRED"
+  | "FAILED";
 
 export interface BatchBoardBookingDetail extends BatchBoardBooking {
   fullyExecutedAt: string | null;
@@ -114,9 +121,9 @@ export interface BatchBoardScheduleDetail {
   scheduleDate: string | null;
   status: string;
   bookingWindowStatus: string;
-  locomotive: BatchBoardSchedule['locomotive'];
-  capacity: BatchBoardSchedule['capacity'];
-  counts: BatchBoardSchedule['counts'];
+  locomotive: BatchBoardSchedule["locomotive"];
+  capacity: BatchBoardSchedule["capacity"];
+  counts: BatchBoardSchedule["counts"];
   windows: BatchWindowGroup[];
   pendingContract: BatchWindowGroup;
   allocationViolations: string[];
@@ -179,6 +186,10 @@ export class BookingBatchService implements OnModuleInit {
     private readonly notifier: BookingNotifierService,
     private readonly scheduler: SchedulerRegistry,
     private readonly trainSchedulingService: TrainSchedulingService,
+    private readonly billing: BillingService,
+
+    @Optional() private readonly milestoneService?: ClearanceMilestoneService,
+
   ) {}
 
   /** On boot, reconcile OPEN route-days and re-arm settle timers. */
@@ -195,10 +206,10 @@ export class BookingBatchService implements OnModuleInit {
     }
     const reserved = await this.dataSource
       .getRepository(Booking)
-      .createQueryBuilder('b')
-      .select('DISTINCT b.train_schedule_id', 'scheduleId')
+      .createQueryBuilder("b")
+      .select("DISTINCT b.train_schedule_id", "scheduleId")
       .where(`b.status IN ('SELECTED_FOR_BATCH', 'AWAITING_PAYMENT')`)
-      .andWhere('b.train_schedule_id IS NOT NULL')
+      .andWhere("b.train_schedule_id IS NOT NULL")
       .getRawMany<{ scheduleId: string }>();
     for (const { scheduleId } of reserved) this.armSettle(scheduleId);
   }
@@ -276,7 +287,7 @@ export class BookingBatchService implements OnModuleInit {
   /** Distinct (origin, destination, EAT day) groups across all OPEN schedules. */
   private async openRouteDayGroups(): Promise<RouteDayGroup[]> {
     const open = await this.trainSchedulesRepository.findAll({
-      where: { bookingWindowStatus: 'OPEN' },
+      where: { bookingWindowStatus: "OPEN" },
     });
     const groups = new Map<string, RouteDayGroup>();
     for (const s of open) {
@@ -310,25 +321,29 @@ export class BookingBatchService implements OnModuleInit {
     if (!booking?.trainScheduleId) return;
 
     const isBatchPaid =
-      booking.status === 'SELECTED_FOR_BATCH' ||
-      booking.status === 'AWAITING_PAYMENT' ||
-      booking.status === 'PAID' ||
-      booking.paymentStatus === 'PAID';
+      booking.status === "SELECTED_FOR_BATCH" ||
+      booking.status === "AWAITING_PAYMENT" ||
+      booking.status === "PAID" ||
+      booking.paymentStatus === "PAID";
     if (!isBatchPaid) return;
 
-    if (booking.status === 'SELECTED_FOR_BATCH' || booking.status === 'AWAITING_PAYMENT') {
+    if (
+      booking.status === "SELECTED_FOR_BATCH" ||
+      booking.status === "AWAITING_PAYMENT"
+    ) {
       await this.dataSource
         .getRepository(Booking)
-        .update(bookingId, { paymentStatus: 'PAID', status: 'PAID' });
-    } else if (booking.paymentStatus !== 'PAID') {
+        .update(bookingId, { paymentStatus: "PAID", status: "PAID" });
+    } else if (booking.paymentStatus !== "PAID") {
       await this.dataSource
         .getRepository(Booking)
-        .update(bookingId, { paymentStatus: 'PAID' });
+        .update(bookingId, { paymentStatus: "PAID" });
     }
 
-    const linked = await this.trainScheduleBookingsRepository.existsForBooking(bookingId);
+    const linked =
+      await this.trainScheduleBookingsRepository.existsForBooking(bookingId);
     if (!linked) {
-      await this.allocate(booking.trainScheduleId, booking, 'paid');
+      await this.allocate(booking.trainScheduleId, booking, "paid");
       this.logger.log(
         `Linked PAID booking ${booking.reference ?? bookingId} to schedule ${booking.trainScheduleId}`,
       );
@@ -338,7 +353,7 @@ export class BookingBatchService implements OnModuleInit {
       booking.trainScheduleId,
     );
     if (schedule && (await this.remainingWagons(schedule)) <= 0) {
-      await this.setWindow(booking.trainScheduleId, 'FULL');
+      await this.setWindow(booking.trainScheduleId, "FULL");
     }
 
     const result = await this.trainSchedulingService.tryAutoWagonAllocation(
@@ -349,7 +364,11 @@ export class BookingBatchService implements OnModuleInit {
         `Wagon allocation for ${booking.reference ?? bookingId}: ${result.assignedBookingIds.length} assigned`,
       );
     }
-    if (result.issues.some((i) => i.bookingId === bookingId && i.status !== 'ASSIGNED')) {
+    if (
+      result.issues.some(
+        (i) => i.bookingId === bookingId && i.status !== "ASSIGNED",
+      )
+    ) {
       const issue = result.issues.find((i) => i.bookingId === bookingId);
       this.logger.warn(
         `Wagon allocation issue for ${booking.reference ?? bookingId}: ${issue?.issue ?? issue?.status}`,
@@ -364,9 +383,10 @@ export class BookingBatchService implements OnModuleInit {
 
   /** Link PAID bookings that have no train_schedule_bookings row (cron backstop). */
   async reconcilePaidUnlinked(scheduleId: string): Promise<void> {
-    const unlinked = await this.bookingsRepository.findPaidUnlinkedForSchedule(scheduleId);
+    const unlinked =
+      await this.bookingsRepository.findPaidUnlinkedForSchedule(scheduleId);
     for (const booking of unlinked) {
-      await this.allocate(scheduleId, booking, 'paid');
+      await this.allocate(scheduleId, booking, "paid");
       this.logger.log(
         `Reconciled PAID booking ${booking.reference ?? booking.id} → schedule ${scheduleId}`,
       );
@@ -375,7 +395,7 @@ export class BookingBatchService implements OnModuleInit {
 
   // ---- cron entry point -----------------------------------------------------
 
-  @Cron(BATCH_CRON, { name: 'booking-batch-fill', timeZone: BATCH_TIMEZONE })
+  @Cron(BATCH_CRON, { name: "booking-batch-fill", timeZone: BATCH_TIMEZONE })
   async runBatchFill(): Promise<void> {
     const groups = await this.openRouteDayGroups();
     this.logger.log(`Batch fill: ${groups.length} OPEN route-day group(s).`);
@@ -405,7 +425,7 @@ export class BookingBatchService implements OnModuleInit {
         destinationStation: true,
         route: true,
       },
-      order: { scheduledDepartureDate: 'ASC' },
+      order: { scheduledDepartureDate: "ASC" },
     });
 
     const wagonLengths = await this.loadWagonLengths();
@@ -413,7 +433,7 @@ export class BookingBatchService implements OnModuleInit {
 
     const board: BatchBoardSchedule[] = [];
     for (const s of schedules) {
-      if (s.status === 'ARRIVED' || s.status === 'CANCELLED') continue;
+      if (s.status === "ARRIVED" || s.status === "CANCELLED") continue;
 
       const links = await linkRepo.find({ where: { trainScheduleId: s.id } });
       const linkedIds = new Set(links.map((l) => l.bookingId));
@@ -425,13 +445,15 @@ export class BookingBatchService implements OnModuleInit {
           id: b.id,
           reference: b.reference ?? b.id.slice(0, 8),
           company: b.isGovernment
-            ? (b.governmentInstitution ?? 'Government')
-            : (b.company?.name ?? '—'),
+            ? (b.governmentInstitution ?? "Government")
+            : (b.company?.name ?? "—"),
           isGovernment: Boolean(b.isGovernment),
           wagons: need.wagons,
           weightTons: need.weightTons,
           lengthMeters: need.lengthMeters,
-          paymentDeadline: b.paymentDeadline ? b.paymentDeadline.toISOString() : null,
+          paymentDeadline: b.paymentDeadline
+            ? b.paymentDeadline.toISOString()
+            : null,
           state: this.boardState(b, linkedIds.has(b.id)),
         };
       });
@@ -442,11 +464,15 @@ export class BookingBatchService implements OnModuleInit {
   }
 
   /** Schedule-level batch board with EAT 3h windows grouped by fullyExecutedAt. */
-  async getBatchBoardDetail(scheduleId: string): Promise<BatchBoardScheduleDetail> {
-    const s = await this.trainSchedulesRepository.findByIdWithFullGraph(scheduleId);
-    if (!s) throw new NotFoundException(`Train schedule ${scheduleId} not found`);
-    if (s.status === 'ARRIVED' || s.status === 'CANCELLED') {
-      throw new BadRequestException('Schedule is no longer active');
+  async getBatchBoardDetail(
+    scheduleId: string,
+  ): Promise<BatchBoardScheduleDetail> {
+    const s =
+      await this.trainSchedulesRepository.findByIdWithFullGraph(scheduleId);
+    if (!s)
+      throw new NotFoundException(`Train schedule ${scheduleId} not found`);
+    if (s.status === "ARRIVED" || s.status === "CANCELLED") {
+      throw new BadRequestException("Schedule is no longer active");
     }
 
     const wagonLengths = await this.loadWagonLengths();
@@ -456,12 +482,18 @@ export class BookingBatchService implements OnModuleInit {
     const bookings = await this.bookingsRepository.findAllBySchedule(s.id);
 
     let allocationPreview: Awaited<
-      ReturnType<TrainSchedulingService['previewAllocationForSchedule']>
+      ReturnType<TrainSchedulingService["previewAllocationForSchedule"]>
     >;
     try {
-      allocationPreview = await this.trainSchedulingService.previewAllocationForSchedule(s.id);
+      allocationPreview =
+        await this.trainSchedulingService.previewAllocationForSchedule(s.id);
     } catch {
-      allocationPreview = { assignedBookingIds: [], deferred: [], issues: [], violations: [] };
+      allocationPreview = {
+        assignedBookingIds: [],
+        deferred: [],
+        issues: [],
+        violations: [],
+      };
     }
     const allocationByBooking = new Map(
       allocationPreview.issues.map((i) => [i.bookingId, i]),
@@ -474,17 +506,23 @@ export class BookingBatchService implements OnModuleInit {
         id: b.id,
         reference: b.reference ?? b.id.slice(0, 8),
         company: b.isGovernment
-          ? (b.governmentInstitution ?? 'Government')
-          : (b.company?.name ?? '—'),
+          ? (b.governmentInstitution ?? "Government")
+          : (b.company?.name ?? "—"),
         isGovernment: Boolean(b.isGovernment),
         wagons: need.wagons,
         weightTons: need.weightTons,
         lengthMeters: need.lengthMeters,
-        paymentDeadline: b.paymentDeadline ? b.paymentDeadline.toISOString() : null,
+        paymentDeadline: b.paymentDeadline
+          ? b.paymentDeadline.toISOString()
+          : null,
         state: this.boardState(b, linkedIds.has(b.id)),
-        fullyExecutedAt: b.fullyExecutedAt ? b.fullyExecutedAt.toISOString() : null,
-        selectedForBatchAt: b.selectedForBatchAt ? b.selectedForBatchAt.toISOString() : null,
-        allocationStatus: alloc?.status ?? 'NOT_ATTEMPTED',
+        fullyExecutedAt: b.fullyExecutedAt
+          ? b.fullyExecutedAt.toISOString()
+          : null,
+        selectedForBatchAt: b.selectedForBatchAt
+          ? b.selectedForBatchAt.toISOString()
+          : null,
+        allocationStatus: alloc?.status ?? "NOT_ATTEMPTED",
         allocationIssue: alloc?.issue ?? null,
       };
     });
@@ -514,11 +552,11 @@ export class BookingBatchService implements OnModuleInit {
     const countFor = (bookingsInWindow: BatchBoardBookingDetail[]) => {
       const counts = emptyCounts();
       for (const b of bookingsInWindow) {
-        if (b.state === 'ALLOCATED') counts.allocated += 1;
-        else if (b.state === 'SELECTED_FOR_BATCH') counts.selectedForBatch += 1;
-        else if (b.state === 'READY') counts.ready += 1;
-        else if (b.state === 'WAITING') counts.waiting += 1;
-        else if (b.state === 'EXPIRED') counts.expired += 1;
+        if (b.state === "ALLOCATED") counts.allocated += 1;
+        else if (b.state === "SELECTED_FOR_BATCH") counts.selectedForBatch += 1;
+        else if (b.state === "READY") counts.ready += 1;
+        else if (b.state === "WAITING") counts.waiting += 1;
+        else if (b.state === "EXPIRED") counts.expired += 1;
         else counts.pendingContract += 1;
       }
       return counts;
@@ -526,7 +564,7 @@ export class BookingBatchService implements OnModuleInit {
 
     const windows: BatchWindowGroup[] = [];
     for (const [key, bucket] of windowBuckets) {
-      if (key === 'pending-contract' || !bucket.window) continue;
+      if (key === "pending-contract" || !bucket.window) continue;
       const w = bucket.window;
       windows.push({
         key: w.key,
@@ -539,44 +577,51 @@ export class BookingBatchService implements OnModuleInit {
         bookings: bucket.items,
       });
     }
-    windows.sort((a, b) => new Date(a.start).getTime() - new Date(b.start).getTime());
+    windows.sort(
+      (a, b) => new Date(a.start).getTime() - new Date(b.start).getTime(),
+    );
 
-    const pendingBookings = windowBuckets.get('pending-contract')?.items ?? [];
+    const pendingBookings = windowBuckets.get("pending-contract")?.items ?? [];
 
     return {
       scheduleId: s.id,
       trainNumber: s.trainNumber ?? null,
-      routeName: s.route?.name ?? null,
+      routeName: s.route ? formatRouteLabel(s.route) : null,
       origin: s.originStation?.label ?? s.originStation?.code ?? null,
-      destination: s.destinationStation?.label ?? s.destinationStation?.code ?? null,
-      scheduleDate: s.scheduledDepartureDate ? s.scheduledDepartureDate.toISOString() : null,
+      destination:
+        s.destinationStation?.label ?? s.destinationStation?.code ?? null,
+      scheduleDate: s.scheduledDepartureDate
+        ? s.scheduledDepartureDate.toISOString()
+        : null,
       status: s.status,
       bookingWindowStatus: s.bookingWindowStatus,
       locomotive: loco
         ? {
-            code: loco.code,
-            name: loco.name ?? null,
-            maxPullWeightTons: Number(loco.maxPullWeightTons),
-            maxTrainLengthMeters: Number(loco.maxTrainLengthMeters),
-          }
+          code: loco.code,
+          name: loco.name ?? null,
+          maxPullWeightTons: Number(loco.maxPullWeightTons),
+          maxTrainLengthMeters: Number(loco.maxTrainLengthMeters),
+        }
         : null,
       capacity: this.computeBoardCapacity(items, loco),
       counts: {
-        allocated: items.filter((i) => i.state === 'ALLOCATED').length,
-        selectedForBatch: items.filter((i) => i.state === 'SELECTED_FOR_BATCH').length,
-        ready: items.filter((i) => i.state === 'READY').length,
-        waiting: items.filter((i) => i.state === 'WAITING').length,
-        pendingContract: items.filter((i) => i.state === 'PENDING_CONTRACT').length,
-        expired: items.filter((i) => i.state === 'EXPIRED').length,
+        allocated: items.filter((i) => i.state === "ALLOCATED").length,
+        selectedForBatch: items.filter((i) => i.state === "SELECTED_FOR_BATCH")
+          .length,
+        ready: items.filter((i) => i.state === "READY").length,
+        waiting: items.filter((i) => i.state === "WAITING").length,
+        pendingContract: items.filter((i) => i.state === "PENDING_CONTRACT")
+          .length,
+        expired: items.filter((i) => i.state === "EXPIRED").length,
       },
       windows,
       pendingContract: {
-        key: 'pending-contract',
-        label: 'Pending contract',
-        date: '',
-        dateLabel: '',
-        start: '',
-        end: '',
+        key: "pending-contract",
+        label: "Pending contract",
+        date: "",
+        dateLabel: "",
+        start: "",
+        end: "",
         counts: countFor(pendingBookings),
         bookings: pendingBookings,
       },
@@ -597,17 +642,21 @@ export class BookingBatchService implements OnModuleInit {
       lengthMeters: number;
     }>,
     loco: Locomotive | null,
-  ): BatchBoardSchedule['capacity'] {
-    const allocated = items.filter((i) => i.state === 'ALLOCATED');
+  ): BatchBoardSchedule["capacity"] {
+    const allocated = items.filter((i) => i.state === "ALLOCATED");
     const committed = items.filter(
-      (i) => i.state === 'ALLOCATED' || i.state === 'SELECTED_FOR_BATCH',
+      (i) => i.state === "ALLOCATED" || i.state === "SELECTED_FOR_BATCH",
     );
     return {
       allocatedWagons: allocated.reduce((sum, i) => sum + i.wagons, 0),
       allocatedLengthMeters:
-        Math.round(allocated.reduce((sum, i) => sum + i.lengthMeters, 0) * 100) / 100,
+        Math.round(
+          allocated.reduce((sum, i) => sum + i.lengthMeters, 0) * 100,
+        ) / 100,
       maxLengthMeters: loco ? Number(loco.maxTrainLengthMeters) : null,
-      usedWeightTons: Math.round(committed.reduce((sum, i) => sum + i.weightTons, 0) * 100) / 100,
+      usedWeightTons:
+        Math.round(committed.reduce((sum, i) => sum + i.weightTons, 0) * 100) /
+        100,
       maxWeightTons: loco ? Number(loco.maxPullWeightTons) : null,
     };
   }
@@ -621,53 +670,68 @@ export class BookingBatchService implements OnModuleInit {
     return {
       scheduleId: s.id,
       trainNumber: s.trainNumber ?? null,
-      routeName: s.route?.name ?? null,
+      routeName: s.route ? formatRouteLabel(s.route) : null,
       origin: s.originStation?.label ?? s.originStation?.code ?? null,
-      destination: s.destinationStation?.label ?? s.destinationStation?.code ?? null,
-      scheduleDate: s.scheduledDepartureDate ? s.scheduledDepartureDate.toISOString() : null,
+      destination:
+        s.destinationStation?.label ?? s.destinationStation?.code ?? null,
+      scheduleDate: s.scheduledDepartureDate
+        ? s.scheduledDepartureDate.toISOString()
+        : null,
       status: s.status,
       bookingWindowStatus: s.bookingWindowStatus,
       locomotive: loco
         ? {
-            code: loco.code,
-            name: loco.name ?? null,
-            maxPullWeightTons: Number(loco.maxPullWeightTons),
-            maxTrainLengthMeters: Number(loco.maxTrainLengthMeters),
-          }
+          code: loco.code,
+          name: loco.name ?? null,
+          maxPullWeightTons: Number(loco.maxPullWeightTons),
+          maxTrainLengthMeters: Number(loco.maxTrainLengthMeters),
+        }
         : null,
       capacity: this.computeBoardCapacity(items, loco),
       counts: {
-        allocated: items.filter((i) => i.state === 'ALLOCATED').length,
-        selectedForBatch: items.filter((i) => i.state === 'SELECTED_FOR_BATCH').length,
-        ready: items.filter((i) => i.state === 'READY').length,
-        waiting: items.filter((i) => i.state === 'WAITING').length,
-        pendingContract: items.filter((i) => i.state === 'PENDING_CONTRACT').length,
-        expired: items.filter((i) => i.state === 'EXPIRED').length,
+        allocated: items.filter((i) => i.state === "ALLOCATED").length,
+        selectedForBatch: items.filter((i) => i.state === "SELECTED_FOR_BATCH")
+          .length,
+        ready: items.filter((i) => i.state === "READY").length,
+        waiting: items.filter((i) => i.state === "WAITING").length,
+        pendingContract: items.filter((i) => i.state === "PENDING_CONTRACT")
+          .length,
+        expired: items.filter((i) => i.state === "EXPIRED").length,
       },
       bookings: items.slice(0, 3),
     };
   }
 
-  private boardState(booking: Booking, linked: boolean): BatchBoardBookingState {
-    if (linked) return 'ALLOCATED';
-    if (booking.status === 'SELECTED_FOR_BATCH' || booking.status === 'AWAITING_PAYMENT') {
-      return 'SELECTED_FOR_BATCH';
+  private boardState(
+    booking: Booking,
+    linked: boolean,
+  ): BatchBoardBookingState {
+    if (linked) return "ALLOCATED";
+    if (
+      booking.status === "SELECTED_FOR_BATCH" ||
+      booking.status === "AWAITING_PAYMENT"
+    ) {
+      return "SELECTED_FOR_BATCH";
     }
-    if (booking.status === 'EXPIRED') return 'EXPIRED';
-    if (booking.status === 'FULLY_EXECUTED' && booking.fullyExecutedAt) return 'READY';
-    if (booking.status === 'PAID') return 'WAITING';
-    return 'PENDING_CONTRACT';
+    if (booking.status === "EXPIRED") return "EXPIRED";
+    if (booking.status === "FULLY_EXECUTED" && booking.fullyExecutedAt)
+      return "READY";
+    if (booking.status === "PAID") return "WAITING";
+    return "PENDING_CONTRACT";
   }
 
   // ---- core fill ------------------------------------------------------------
 
   /** Fill one schedule from its priority-ordered pool until full. */
   async fillSchedule(scheduleId: string): Promise<void> {
-    const schedule = await this.trainSchedulesRepository.findByIdWithFullGraph(scheduleId);
-    if (!schedule || schedule.bookingWindowStatus !== 'OPEN') return;
+    const schedule =
+      await this.trainSchedulesRepository.findByIdWithFullGraph(scheduleId);
+    if (!schedule || schedule.bookingWindowStatus !== "OPEN") return;
     const locomotive = schedule.trainSet?.locomotive;
     if (!schedule.trainSetId || !locomotive) {
-      this.logger.warn(`Schedule ${scheduleId} has no locomotive/train set — skipped.`);
+      this.logger.warn(
+        `Schedule ${scheduleId} has no locomotive/train set — skipped.`,
+      );
       return;
     }
 
@@ -677,7 +741,7 @@ export class BookingBatchService implements OnModuleInit {
     await this.syncScheduleMaxWagons(schedule, locomotive, rules);
     let budget = await this.remainingCapacity(schedule, limits, wagonLengths);
     if (budget.wagons <= 0) {
-      await this.setWindow(scheduleId, 'FULL');
+      await this.setWindow(scheduleId, "FULL");
       return;
     }
 
@@ -689,7 +753,12 @@ export class BookingBatchService implements OnModuleInit {
 
       if (!this.fits(need, budget)) {
         if (booking.isGovernment) {
-          budget = await this.preemptForGovernment(scheduleId, need, budget, wagonLengths);
+          budget = await this.preemptForGovernment(
+            scheduleId,
+            need,
+            budget,
+            wagonLengths,
+          );
           if (!this.fits(need, budget)) continue; // still doesn't fit even after preempt
         } else {
           continue; // skip a booking that exceeds weight/length/wagons, try the next
@@ -697,7 +766,7 @@ export class BookingBatchService implements OnModuleInit {
       }
 
       if (booking.isGovernment) {
-        await this.allocate(scheduleId, booking, 'gov');
+        await this.allocate(scheduleId, booking, "gov");
       } else {
         await this.reserve(booking, scheduleId);
         armed = true;
@@ -706,7 +775,7 @@ export class BookingBatchService implements OnModuleInit {
       if (budget.wagons <= 0) break; // no wagon slots left — nothing more can board
     }
 
-    if (budget.wagons <= 0) await this.setWindow(scheduleId, 'FULL');
+    if (budget.wagons <= 0) await this.setWindow(scheduleId, "FULL");
     if (armed) this.armSettle(scheduleId);
     void this.triggerWagonAllocation(scheduleId);
   }
@@ -732,13 +801,14 @@ export class BookingBatchService implements OnModuleInit {
     const scheduleIds = bookable
       .filter(
         (s) =>
-          s.bookingWindowStatus === 'OPEN' &&
+          s.bookingWindowStatus === "OPEN" &&
           s.scheduleDate != null &&
           eatDay(new Date(s.scheduleDate)) === day,
       )
       .sort(
         (a, b) =>
-          new Date(a.scheduleDate).getTime() - new Date(b.scheduleDate).getTime(),
+          new Date(a.scheduleDate).getTime() -
+          new Date(b.scheduleDate).getTime(),
       )
       .map((s) => s.id);
 
@@ -750,15 +820,22 @@ export class BookingBatchService implements OnModuleInit {
     // Live per-schedule budget + arm flag, in departure order.
     const trains: Array<{ id: string; budget: Capacity; armed: boolean }> = [];
     for (const id of scheduleIds) {
-      const schedule = await this.trainSchedulesRepository.findByIdWithFullGraph(id);
+      const schedule =
+        await this.trainSchedulesRepository.findByIdWithFullGraph(id);
       const locomotive = schedule?.trainSet?.locomotive;
       if (!schedule || !schedule.trainSetId || !locomotive) {
-        this.logger.warn(`Schedule ${id} has no locomotive/train set — skipped.`);
+        this.logger.warn(
+          `Schedule ${id} has no locomotive/train set — skipped.`,
+        );
         continue;
       }
       const limits = await this.capacityLimits(locomotive, rules);
       await this.syncScheduleMaxWagons(schedule, locomotive, rules);
-      const budget = await this.remainingCapacity(schedule, limits, wagonLengths);
+      const budget = await this.remainingCapacity(
+        schedule,
+        limits,
+        wagonLengths,
+      );
       trains.push({ id, budget, armed: false });
     }
     if (trains.length === 0) return [];
@@ -779,7 +856,12 @@ export class BookingBatchService implements OnModuleInit {
         // Government booking fits nowhere on its own — try to preempt commercial
         // on each train (earliest first) until one frees enough room.
         for (const t of trains) {
-          t.budget = await this.preemptForGovernment(t.id, need, t.budget, wagonLengths);
+          t.budget = await this.preemptForGovernment(
+            t.id,
+            need,
+            t.budget,
+            wagonLengths,
+          );
           if (this.fits(need, t.budget)) {
             target = t;
             break;
@@ -794,7 +876,7 @@ export class BookingBatchService implements OnModuleInit {
       }
 
       if (booking.isGovernment) {
-        await this.allocate(target.id, booking, 'gov');
+        await this.allocate(target.id, booking, "gov");
       } else {
         await this.reserve(booking, target.id);
         target.armed = true;
@@ -803,7 +885,7 @@ export class BookingBatchService implements OnModuleInit {
     }
 
     for (const t of trains) {
-      if (t.budget.wagons <= 0) await this.setWindow(t.id, 'FULL');
+      if (t.budget.wagons <= 0) await this.setWindow(t.id, "FULL");
       if (t.armed) this.armSettle(t.id);
       void this.triggerWagonAllocation(t.id);
     }
@@ -813,18 +895,20 @@ export class BookingBatchService implements OnModuleInit {
 
   /** Durable settle: allocate paid / expire overdue reservations, then top up. */
   async settleDueReservations(scheduleId: string): Promise<void> {
-    const reserved = await this.bookingsRepository.findReservedForSchedule(scheduleId);
+    const reserved =
+      await this.bookingsRepository.findReservedForSchedule(scheduleId);
     const now = Date.now();
     let anySettled = false;
 
     for (const booking of reserved) {
-      const paid = booking.paymentStatus === 'PAID' || booking.status === 'PAID';
+      const paid =
+        booking.paymentStatus === "PAID" || booking.status === "PAID";
       const expired = booking.paymentDeadline
         ? booking.paymentDeadline.getTime() <= now
         : false;
 
       if (paid) {
-        await this.allocate(scheduleId, booking, 'paid');
+        await this.allocate(scheduleId, booking, "paid");
         anySettled = true;
       } else if (expired) {
         await this.expire(booking);
@@ -840,17 +924,19 @@ export class BookingBatchService implements OnModuleInit {
   /** Allocate paid reservations, expire the rest, then top up. */
   async settleBatch(scheduleId: string): Promise<void> {
     this.removeTimeout(scheduleId);
-    const reserved = await this.bookingsRepository.findReservedForSchedule(scheduleId);
+    const reserved =
+      await this.bookingsRepository.findReservedForSchedule(scheduleId);
     const now = Date.now();
 
     for (const booking of reserved) {
-      const paid = booking.paymentStatus === 'PAID' || booking.status === 'PAID';
+      const paid =
+        booking.paymentStatus === "PAID" || booking.status === "PAID";
       const expired = booking.paymentDeadline
         ? booking.paymentDeadline.getTime() <= now
         : true;
 
       if (paid) {
-        await this.allocate(scheduleId, booking, 'paid');
+        await this.allocate(scheduleId, booking, "paid");
       } else if (expired) {
         await this.expire(booking);
       }
@@ -862,11 +948,13 @@ export class BookingBatchService implements OnModuleInit {
   }
 
   private triggerWagonAllocation(scheduleId: string): void {
-    void this.trainSchedulingService.tryAutoWagonAllocation(scheduleId).catch((err) =>
-      this.logger.warn(
-        `Auto wagon allocation failed for ${scheduleId}: ${(err as Error).message}`,
-      ),
-    );
+    void this.trainSchedulingService
+      .tryAutoWagonAllocation(scheduleId)
+      .catch((err) =>
+        this.logger.warn(
+          `Auto wagon allocation failed for ${scheduleId}: ${(err as Error).message}`,
+        ),
+      );
   }
 
   // ---- staff override actions ----------------------------------------------
@@ -878,18 +966,20 @@ export class BookingBatchService implements OnModuleInit {
       .findOne({ where: { id: bookingId } });
     if (!booking) throw new NotFoundException(`Booking ${bookingId} not found`);
     if (!booking.trainScheduleId) {
-      throw new BadRequestException('Booking has no target schedule to allocate to');
+      throw new BadRequestException(
+        "Booking has no target schedule to allocate to",
+      );
     }
     await this.dataSource
       .getRepository(Booking)
-      .update(bookingId, { paymentStatus: 'PAID' });
-    await this.allocate(booking.trainScheduleId, booking, 'paid');
+      .update(bookingId, { paymentStatus: "PAID" });
+    await this.allocate(booking.trainScheduleId, booking, "paid");
 
     const schedule = await this.trainSchedulesRepository.findByIdWithFullGraph(
       booking.trainScheduleId,
     );
     if (schedule && (await this.remainingWagons(schedule)) <= 0) {
-      await this.setWindow(booking.trainScheduleId, 'FULL');
+      await this.setWindow(booking.trainScheduleId, "FULL");
     }
     void this.triggerWagonAllocation(booking.trainScheduleId!);
   }
@@ -898,7 +988,10 @@ export class BookingBatchService implements OnModuleInit {
    * Re-point a booking to another OPEN same-route schedule (keeps approval/contract + priority).
    * Used for EXPIRED or full-schedule bookings — no re-approval.
    */
-  async moveToSchedule(bookingId: string, newScheduleId: string): Promise<void> {
+  async moveToSchedule(
+    bookingId: string,
+    newScheduleId: string,
+  ): Promise<void> {
     const booking = await this.dataSource
       .getRepository(Booking)
       .findOne({ where: { id: bookingId } });
@@ -907,15 +1000,20 @@ export class BookingBatchService implements OnModuleInit {
     const schedule = await this.dataSource
       .getRepository(TrainSchedule)
       .findOne({ where: { id: newScheduleId } });
-    if (!schedule) throw new NotFoundException(`Train schedule ${newScheduleId} not found`);
-    if (schedule.bookingWindowStatus !== 'OPEN') {
-      throw new BadRequestException('Target schedule is not accepting bookings');
+    if (!schedule)
+      throw new NotFoundException(`Train schedule ${newScheduleId} not found`);
+    if (schedule.bookingWindowStatus !== "OPEN") {
+      throw new BadRequestException(
+        "Target schedule is not accepting bookings",
+      );
     }
     if (
       schedule.originStationId !== booking.originYardId ||
       schedule.destinationStationId !== booking.destinationYardId
     ) {
-      throw new BadRequestException('Target schedule is not on the booking route');
+      throw new BadRequestException(
+        "Target schedule is not on the booking route",
+      );
     }
 
     await this.dataSource.transaction(async (manager) => {
@@ -927,15 +1025,15 @@ export class BookingBatchService implements OnModuleInit {
         );
       }
       const restoredStatus =
-        booking.status === 'EXPIRED'
+        booking.status === "EXPIRED"
           ? booking.isGovernment
-            ? 'APPROVED'
-            : 'FULLY_EXECUTED'
+            ? "APPROVED"
+            : "FULLY_EXECUTED"
           : booking.status;
       await manager.getRepository(Booking).update(bookingId, {
         trainScheduleId: newScheduleId,
         status: restoredStatus,
-        schedulingStatus: 'ELIGIBLE',
+        schedulingStatus: "ELIGIBLE",
         paymentDeadline: null,
         selectedForBatchAt: null,
       } as never);
@@ -949,7 +1047,8 @@ export class BookingBatchService implements OnModuleInit {
       .findOne({ where: { id: bookingId } });
     if (!booking) throw new NotFoundException(`Booking ${bookingId} not found`);
     await this.expire(booking);
-    if (booking.trainScheduleId) await this.fillSchedule(booking.trainScheduleId);
+    if (booking.trainScheduleId)
+      await this.fillSchedule(booking.trainScheduleId);
   }
 
   // ---- mutations ------------------------------------------------------------
@@ -967,11 +1066,19 @@ export class BookingBatchService implements OnModuleInit {
     const deadline = new Date(now.getTime() + PAYMENT_WINDOW_MS);
     await this.bookingsRepository.update(booking.id, {
       trainScheduleId: scheduleId,
-      status: 'SELECTED_FOR_BATCH',
+      status: "SELECTED_FOR_BATCH",
       selectedForBatchAt: now,
       paymentDeadline: deadline,
     } as never);
     booking.trainScheduleId = scheduleId;
+    // The invoice was generated at booking creation/approval, before this pay
+    // window opened — refresh its printed due date to the real deadline.
+    await this.billing.syncPayableDueDate(
+      Freight.InvoiceSource.Booking,
+      booking.id,
+      deadline,
+      "PREPAID",
+    );
     await this.notifier.payNow(booking, deadline);
   }
 
@@ -979,13 +1086,14 @@ export class BookingBatchService implements OnModuleInit {
   private async allocate(
     scheduleId: string,
     booking: Booking,
-    reason: 'paid' | 'gov',
+    reason: "paid" | "gov",
   ): Promise<void> {
     await this.dataSource.transaction(async (manager) => {
-      const exists = await this.trainScheduleBookingsRepository.existsForBooking(
-        booking.id,
-        manager,
-      );
+      const exists =
+        await this.trainScheduleBookingsRepository.existsForBooking(
+          booking.id,
+          manager,
+        );
       if (!exists) {
         await this.trainScheduleBookingsRepository.createMany(
           [{ trainScheduleId: scheduleId, bookingId: booking.id }],
@@ -993,8 +1101,8 @@ export class BookingBatchService implements OnModuleInit {
         );
       }
       await manager.getRepository(Booking).update(booking.id, {
-        status: reason === 'paid' ? 'PAID' : booking.status,
-        schedulingStatus: 'SCHEDULED',
+        status: reason === "paid" ? "PAID" : booking.status,
+        schedulingStatus: "SCHEDULED",
         scheduledAt: new Date(),
         paymentDeadline: null,
         selectedForBatchAt: null,
@@ -1002,6 +1110,16 @@ export class BookingBatchService implements OnModuleInit {
     });
     this.notifier.secured(booking, reason);
     void this.triggerWagonAllocation(scheduleId);
+    void this.markWagonAllocatedMilestone(booking.id);
+  }
+
+  private async markWagonAllocatedMilestone(bookingId: string): Promise<void> {
+    if (!this.milestoneService) return;
+    try {
+      await this.milestoneService.completeForBooking(bookingId, 'WAGON_ALLOCATED');
+    } catch {
+      // Booking may have no milestone rows (non-contract path).
+    }
   }
 
   /**
@@ -1012,12 +1130,16 @@ export class BookingBatchService implements OnModuleInit {
   private async expire(booking: Booking): Promise<void> {
     await this.bookingsRepository.update(booking.id, {
       trainScheduleId: null,
-      status: 'EXPIRED',
-      schedulingStatus: 'ELIGIBLE',
+      status: "EXPIRED",
+      schedulingStatus: "ELIGIBLE",
       paymentDeadline: null,
       selectedForBatchAt: null,
     } as never);
     booking.trainScheduleId = null;
+    // Pay window closed before settlement → expire the booking's open invoice too
+    // (emits `booking.invoice.expired`). Domain owns the reaction; billing stays
+    // source-agnostic.
+    await this.billing.expirePayable(Freight.InvoiceSource.Booking, booking.id, "PREPAID");
     this.notifier.expired(booking);
   }
 
@@ -1035,7 +1157,9 @@ export class BookingBatchService implements OnModuleInit {
       await this.bookingsRepository.findReservedForSchedule(scheduleId)
     ).filter((b) => !b.isGovernment);
     const allocatedCommercial =
-      await this.bookingsRepository.findAllocatedCommercialForSchedule(scheduleId);
+      await this.bookingsRepository.findAllocatedCommercialForSchedule(
+        scheduleId,
+      );
 
     // lowest priority first; reserved are cheaper to free than allocated
     const candidates = [...reservedCommercial, ...allocatedCommercial].sort(
@@ -1052,11 +1176,19 @@ export class BookingBatchService implements OnModuleInit {
           manager,
         );
         await manager.getRepository(Booking).update(victim.id, {
-          status: 'EXPIRED',
-          schedulingStatus: 'ELIGIBLE',
+          status: "EXPIRED",
+          schedulingStatus: "ELIGIBLE",
           paymentDeadline: null,
           selectedForBatchAt: null,
         } as never);
+        // Displaced → EXPIRED: close its open invoice too, so a dead booking
+        // can't still be paid (mirrors `expire()`; enlisted in this txn).
+        await this.billing.expirePayable(
+          Freight.InvoiceSource.Booking,
+          victim.id,
+          "PREPAID",
+          manager,
+        );
       });
       this.notifier.displaced(victim);
       freed = this.add(freed, this.needFor(victim, wagonLengths));
@@ -1074,7 +1206,10 @@ export class BookingBatchService implements OnModuleInit {
       (sum, c) => sum + Number(c.quantity ?? 0),
       0,
     );
-    return Math.max(DEFAULT_WAGONS_PER_BOOKING, fromContainers || DEFAULT_WAGONS_PER_BOOKING);
+    return Math.max(
+      DEFAULT_WAGONS_PER_BOOKING,
+      fromContainers || DEFAULT_WAGONS_PER_BOOKING,
+    );
   }
 
   /** What one booking consumes along all three capacity axes. */
@@ -1161,7 +1296,7 @@ export class BookingBatchService implements OnModuleInit {
     Array<{ lengthMeters: number; capacityTons: number }>
   > {
     const types = await this.dataSource.getRepository(WagonType).find({
-      where: [{ code: 'NW5' }, { code: 'CW3' }],
+      where: [{ code: "NW5" }, { code: "CW3" }],
     });
     if (types.length) return types.map(wagonTypeDimensionsFromEntity);
     return [
@@ -1172,17 +1307,23 @@ export class BookingBatchService implements OnModuleInit {
 
   private async loadWagonLengths(): Promise<WagonLengths> {
     const types = await this.dataSource.getRepository(WagonType).find({
-      where: [{ code: 'NW5' }, { code: 'CW3' }],
+      where: [{ code: "NW5" }, { code: "CW3" }],
     });
-    const byCode = new Map(types.map((t) => [t.code, wagonTypeDimensionsFromEntity(t)]));
+    const byCode = new Map(
+      types.map((t) => [t.code, wagonTypeDimensionsFromEntity(t)]),
+    );
     return {
-      container: byCode.get('NW5')?.lengthMeters ?? DEFAULT_CONTAINER_WAGON_LENGTH_METERS,
-      bulk: byCode.get('CW3')?.lengthMeters ?? DEFAULT_BULK_WAGON_LENGTH_METERS,
+      container:
+        byCode.get("NW5")?.lengthMeters ??
+        DEFAULT_CONTAINER_WAGON_LENGTH_METERS,
+      bulk: byCode.get("CW3")?.lengthMeters ?? DEFAULT_BULK_WAGON_LENGTH_METERS,
     };
   }
 
   private async loadGlobalRules(): Promise<TrainSchedulingGlobalRules | null> {
-    return this.dataSource.getRepository(TrainSchedulingGlobalRules).findOne({ where: {} });
+    return this.dataSource
+      .getRepository(TrainSchedulingGlobalRules)
+      .findOne({ where: {} });
   }
 
   /** Remaining capacity = hard caps minus what allocated + reserved bookings already use. */
@@ -1194,7 +1335,9 @@ export class BookingBatchService implements OnModuleInit {
     const allocated = (schedule.scheduleBookings ?? [])
       .map((sb) => sb.booking)
       .filter((b): b is Booking => Boolean(b));
-    const reserved = await this.bookingsRepository.findReservedForSchedule(schedule.id);
+    const reserved = await this.bookingsRepository.findReservedForSchedule(
+      schedule.id,
+    );
     const used = [...allocated, ...reserved].reduce<Capacity>(
       (acc, b) => this.add(acc, this.needFor(b, wagonLengths)),
       { wagons: 0, weightTons: 0, lengthMeters: 0 },
@@ -1207,7 +1350,9 @@ export class BookingBatchService implements OnModuleInit {
     const allocated = (schedule.scheduleBookings ?? [])
       .map((sb) => sb.booking)
       .filter((b): b is Booking => Boolean(b));
-    const reserved = await this.bookingsRepository.findReservedForSchedule(schedule.id);
+    const reserved = await this.bookingsRepository.findReservedForSchedule(
+      schedule.id,
+    );
     const used =
       allocated.reduce((s, b) => s + this.wagonsFor(b), 0) +
       reserved.reduce((s, b) => s + this.wagonsFor(b), 0);
@@ -1216,7 +1361,7 @@ export class BookingBatchService implements OnModuleInit {
 
   private async setWindow(
     scheduleId: string,
-    status: 'OPEN' | 'FULL' | 'CLOSED',
+    status: "OPEN" | "FULL" | "CLOSED",
   ): Promise<void> {
     await this.dataSource
       .getRepository(TrainSchedule)
@@ -1233,7 +1378,9 @@ export class BookingBatchService implements OnModuleInit {
     this.removeTimeout(scheduleId);
     const handle = setTimeout(() => {
       void this.settleBatch(scheduleId).catch((err) =>
-        this.logger.error(`settleBatch ${scheduleId} failed: ${(err as Error).message}`),
+        this.logger.error(
+          `settleBatch ${scheduleId} failed: ${(err as Error).message}`,
+        ),
       );
     }, PAYMENT_WINDOW_MS);
     this.scheduler.addTimeout(this.timeoutName(scheduleId), handle);
@@ -1242,7 +1389,7 @@ export class BookingBatchService implements OnModuleInit {
   private removeTimeout(scheduleId: string): void {
     const name = this.timeoutName(scheduleId);
     try {
-      if (this.scheduler.doesExist('timeout', name)) {
+      if (this.scheduler.doesExist("timeout", name)) {
         this.scheduler.deleteTimeout(name);
       }
     } catch {
diff --git a/apps/edr-freight-api/src/modules/train-scheduling/dto/import-djibouti-operation.dto.ts b/apps/edr-freight-api/src/modules/train-scheduling/dto/import-djibouti-operation.dto.ts
index 9bd9f3957..d5adce129 100644
--- a/apps/edr-freight-api/src/modules/train-scheduling/dto/import-djibouti-operation.dto.ts
+++ b/apps/edr-freight-api/src/modules/train-scheduling/dto/import-djibouti-operation.dto.ts
@@ -1,7 +1,8 @@
 import { ApiProperty, ApiPropertyOptional } from '@nestjs/swagger';
-import { IsIn, IsOptional, IsString } from 'class-validator';
+import { IsDateString, IsIn, IsOptional, IsString } from 'class-validator';
 
 export const IMPORT_DJIBOUTI_DOCUMENT_TYPES = [
+  'GATE_PASS',
   'DELIVERY_ORDER',
   'PORT_INVOICE',
   'DJIBOUTI_T1',
@@ -43,6 +44,26 @@ export class UploadImportDjiboutiDocumentDto {
 }
 
 export class ImportDjiboutiActionDto {
+  @ApiPropertyOptional({ description: 'Gate pass secured date/time. Defaults to now.' })
+  @IsOptional()
+  @IsDateString()
+  securedAt?: string;
+
+  @ApiPropertyOptional()
+  @IsOptional()
+  @IsString()
+  fileId?: string;
+
+  @ApiPropertyOptional()
+  @IsOptional()
+  @IsString()
+  fileUrl?: string;
+
+  @ApiPropertyOptional()
+  @IsOptional()
+  @IsString()
+  reference?: string;
+
   @ApiPropertyOptional()
   @IsOptional()
   @IsString()
diff --git a/apps/edr-freight-api/src/modules/train-scheduling/entities/import-djibouti-operation.entity.ts b/apps/edr-freight-api/src/modules/train-scheduling/entities/import-djibouti-operation.entity.ts
index 792792070..47ced8738 100644
--- a/apps/edr-freight-api/src/modules/train-scheduling/entities/import-djibouti-operation.entity.ts
+++ b/apps/edr-freight-api/src/modules/train-scheduling/entities/import-djibouti-operation.entity.ts
@@ -4,6 +4,7 @@ import { Column, Entity, Index, JoinColumn, OneToOne } from 'typeorm';
 import { TrainSchedule } from '../../train-schedules/entities/train-schedule.entity';
 
 export type ImportDjiboutiDocumentType =
+  | 'GATE_PASS'
   | 'DELIVERY_ORDER'
   | 'PORT_INVOICE'
   | 'DJIBOUTI_T1'
diff --git a/apps/edr-freight-api/src/modules/train-scheduling/train-scheduling.module.ts b/apps/edr-freight-api/src/modules/train-scheduling/train-scheduling.module.ts
index 9b8efd9e0..0f2e22076 100644
--- a/apps/edr-freight-api/src/modules/train-scheduling/train-scheduling.module.ts
+++ b/apps/edr-freight-api/src/modules/train-scheduling/train-scheduling.module.ts
@@ -1,6 +1,7 @@
 import { Module, forwardRef } from '@nestjs/common';
 import { TypeOrmModule } from '@nestjs/typeorm';
 
+import { BillingModule } from '../billing/billing.module';
 import { BookingsModule } from '../bookings/bookings.module';
 import { Container } from '../container-management/entities/container.entity';
 import { LocomotivesModule } from '../locomotives/locomotives.module';
@@ -25,6 +26,7 @@ import { TrainSchedulingService } from './train-scheduling.service';
 import { BookingBatchService } from './booking-batch.service';
 import { BookingNotifierService } from './booking-notifier.service';
 import { NotificationsModule } from '../notifications/notifications.module';
+import { ContractsModule } from '../contracts/contracts.module';
 
 @Module({
   imports: [
@@ -42,6 +44,7 @@ import { NotificationsModule } from '../notifications/notifications.module';
       ImportDjiboutiOperation,
     ]),
     forwardRef(() => BookingsModule),
+    BillingModule,
     NotificationsModule,
     LocomotivesModule,
     WagonTypesModule,
@@ -49,6 +52,7 @@ import { NotificationsModule } from '../notifications/notifications.module';
     TrainSchedulesModule,
     forwardRef(() => WarehousesModule),
     RuleEngineModule,
+    forwardRef(() => ContractsModule),
   ],
   controllers: [TrainSchedulingController],
   providers: [
diff --git a/apps/edr-freight-api/src/modules/train-scheduling/train-scheduling.service.ts b/apps/edr-freight-api/src/modules/train-scheduling/train-scheduling.service.ts
index c71634ccb..e87dbdd88 100644
--- a/apps/edr-freight-api/src/modules/train-scheduling/train-scheduling.service.ts
+++ b/apps/edr-freight-api/src/modules/train-scheduling/train-scheduling.service.ts
@@ -21,7 +21,7 @@ import { BookingContainer } from '../bookings/entities/booking-container.entity'
 import { Container } from '../container-management/entities/container.entity';
 import { Locomotive } from '../locomotives/entities/locomotive.entity';
 import { LocomotivesRepository } from '../locomotives/locomotives.repository';
-import { Route } from '../routes/entities/route.entity';
+import { formatRouteLabel, Route } from '../routes/entities/route.entity';
 import { TrainSetLocomotive } from '../train-sets/entities/train-set-locomotive.entity';
 import { TrainSetWagon } from '../train-sets/entities/train-set-wagon.entity';
 import { TrainSet } from '../train-sets/entities/train-set.entity';
@@ -54,7 +54,6 @@ import {
   type ImportDjiboutiDocumentType,
 } from './entities/import-djibouti-operation.entity';
 import {
-  IMPORT_DJIBOUTI_DOCUMENT_TYPES,
   ImportDjiboutiActionDto,
   UploadImportDjiboutiDocumentDto,
 } from './dto/import-djibouti-operation.dto';
@@ -304,7 +303,7 @@ export class TrainSchedulingService {
   }
 
   async createContainerTrainSchedule(dto: CreateContainerTrainScheduleDto) {
-    const route = await this.getActiveRoute(dto.routeId);
+    const route = await this.getSchedulableRoute(dto.routeId);
 
     const locomotiveIds = [...new Set(dto.locomotiveIds)];
     if (locomotiveIds.length < 2) {
@@ -832,7 +831,7 @@ export class TrainSchedulingService {
   }
 
   async getImportDjiboutiOperation(scheduleId: string) {
-    const schedule = await this.getImportDjiboutiSchedule(scheduleId);
+    const schedule = await this.getDjiboutiGatepassSchedule(scheduleId);
     const operation = await this.getOrCreateImportDjiboutiOperation(scheduleId);
     return this.mapImportDjiboutiOperation(schedule, operation);
   }
@@ -841,7 +840,7 @@ export class TrainSchedulingService {
     scheduleId: string,
     dto: UploadImportDjiboutiDocumentDto,
   ) {
-    const schedule = await this.getImportDjiboutiSchedule(scheduleId);
+    const schedule = await this.getDjiboutiGatepassSchedule(scheduleId);
     const operation = await this.getOrCreateImportDjiboutiOperation(scheduleId);
     const documents = {
       ...(operation.documents ?? {}),
@@ -865,21 +864,30 @@ export class TrainSchedulingService {
   }
 
   async grantImportDjiboutiGatepass(scheduleId: string, dto: ImportDjiboutiActionDto = {}) {
-    const schedule = await this.getImportDjiboutiSchedule(scheduleId);
+    const schedule = await this.getDjiboutiGatepassSchedule(scheduleId);
     const operation = await this.getOrCreateImportDjiboutiOperation(scheduleId);
-    const missing = this.missingImportDjiboutiDocuments(operation);
-    if (missing.length) {
-      throw new BadRequestException(`Gatepass cannot be granted until documents are uploaded: ${missing.join(', ')}`);
+    const securedAt = dto.securedAt ? new Date(dto.securedAt) : new Date();
+    const documents = { ...(operation.documents ?? {}) };
+    if (dto.fileId || dto.fileUrl || dto.reference || dto.notes) {
+      documents.GATE_PASS = {
+        fileId: dto.fileId ?? null,
+        fileUrl: dto.fileUrl ?? null,
+        reference: dto.reference ?? null,
+        uploadedAt: new Date().toISOString(),
+        uploadedBy: dto.performedBy ?? null,
+        notes: dto.notes ?? null,
+      };
     }
 
     await this.dataSource.getRepository(ImportDjiboutiOperation).update(operation.id, {
-      gatepassGrantedAt: operation.gatepassGrantedAt ?? new Date(),
+      documents,
+      gatepassGrantedAt: securedAt,
       performedBy: dto.performedBy ?? operation.performedBy ?? null,
       notes: dto.notes ?? operation.notes ?? null,
     });
 
     console.log(
-      `[NOTIFY] Import gatepass granted for train ${schedule.trainNumber ?? schedule.id}; loading may proceed.`,
+      `[NOTIFY] Gate pass secured for train ${schedule.trainNumber ?? schedule.id}; Djibouti Port entry is allowed.`,
     );
     return this.getImportDjiboutiOperation(schedule.id);
   }
@@ -949,7 +957,7 @@ export class TrainSchedulingService {
       generatedAt: generatedAt.toISOString(),
       trainScheduleId: schedule.id,
       trainNumber: schedule.trainNumber ?? null,
-      route: schedule.route?.name ?? null,
+      route: schedule.route ? formatRouteLabel(schedule.route) : null,
       origin: schedule.originStation?.label ?? schedule.originStation?.code ?? null,
       destination: schedule.destinationStation?.label ?? schedule.destinationStation?.code ?? null,
       totalBookings: schedule.scheduleBookings?.length ?? 0,
@@ -1299,16 +1307,28 @@ export class TrainSchedulingService {
   }
 
   private async getImportDjiboutiSchedule(scheduleId: string): Promise<TrainSchedule> {
+    const schedule = await this.getDjiboutiGatepassSchedule(scheduleId);
+    if (!this.isImportDjiboutiSchedule(schedule)) {
+      throw new BadRequestException('This action applies only to IMPORT schedules originating from Djibouti');
+    }
+    return schedule;
+  }
+
+  private async getDjiboutiGatepassSchedule(scheduleId: string): Promise<TrainSchedule> {
     const schedule = await this.trainSchedulesRepository.findByIdWithFullGraph(scheduleId);
     if (!schedule) {
       throw new NotFoundException(`Train schedule ${scheduleId} not found`);
     }
-    if (!this.isImportDjiboutiSchedule(schedule)) {
-      throw new BadRequestException('Batch 7 actions apply only to IMPORT schedules originating from Djibouti');
+    if (!this.isDjiboutiGatepassSchedule(schedule)) {
+      throw new BadRequestException('Gate pass applies only to trains entering Djibouti Port on import or export routes');
     }
     return schedule;
   }
 
+  private isDjiboutiGatepassSchedule(schedule: TrainSchedule): boolean {
+    return this.isImportDjiboutiSchedule(schedule) || this.isExportDjiboutiSchedule(schedule);
+  }
+
   private isImportDjiboutiSchedule(schedule: TrainSchedule): boolean {
     const direction =
       (schedule.direction as 'IMPORT' | 'EXPORT' | 'DOMESTIC' | null) ??
@@ -1323,6 +1343,20 @@ export class TrainSchedulingService {
     );
   }
 
+  private isExportDjiboutiSchedule(schedule: TrainSchedule): boolean {
+    const direction =
+      (schedule.direction as 'IMPORT' | 'EXPORT' | 'DOMESTIC' | null) ??
+      (schedule.originStation && schedule.destinationStation
+        ? deriveScheduleDirection(schedule.originStation, schedule.destinationStation)
+        : null);
+    return (
+      direction === 'EXPORT' &&
+      this.isDjiboutiPortDestination(
+        `${schedule.destinationStation?.code ?? ''} ${schedule.destinationStation?.label ?? ''}`,
+      )
+    );
+  }
+
   private async getOrCreateImportDjiboutiOperation(scheduleId: string): Promise<ImportDjiboutiOperation> {
     const repo = this.dataSource.getRepository(ImportDjiboutiOperation);
     const existing = await repo.findOne({ where: { trainScheduleId: scheduleId } });
@@ -1331,8 +1365,8 @@ export class TrainSchedulingService {
   }
 
   private missingImportDjiboutiDocuments(operation?: ImportDjiboutiOperation | null): ImportDjiboutiDocumentType[] {
-    const documents = operation?.documents ?? {};
-    return IMPORT_DJIBOUTI_DOCUMENT_TYPES.filter((type) => !documents[type]);
+    void operation;
+    return [];
   }
 
   private assertImportDjiboutiGatepassGranted(operation?: ImportDjiboutiOperation | null): void {
@@ -1343,6 +1377,7 @@ export class TrainSchedulingService {
 
   private mapImportDjiboutiOperation(schedule: TrainSchedule, operation: ImportDjiboutiOperation) {
     const missingDocuments = this.missingImportDjiboutiDocuments(operation);
+    const gatepassStatus = operation.gatepassGrantedAt ? 'SECURED' : 'NOT_SECURED';
     return {
       trainScheduleId: schedule.id,
       trainNumber: schedule.trainNumber ?? null,
@@ -1350,6 +1385,7 @@ export class TrainSchedulingService {
       status: {
         documentsComplete: missingDocuments.length === 0,
         missingDocuments,
+        gatepassStatus,
         gatepassGranted: Boolean(operation.gatepassGrantedAt),
         readyForLoading: Boolean(operation.readyForLoadingAt),
         loadedOnTrain: Boolean(operation.loadedOnTrainAt),
@@ -1358,6 +1394,8 @@ export class TrainSchedulingService {
       },
       documents: operation.documents ?? {},
       gatepassGrantedAt: operation.gatepassGrantedAt ?? null,
+      gatepassSecuredAt: operation.gatepassGrantedAt ?? null,
+      gatepassStatus,
       readyForLoadingAt: operation.readyForLoadingAt ?? null,
       loadedOnTrainAt: operation.loadedOnTrainAt ?? null,
       departedFromDjiboutiAt: operation.departedFromDjiboutiAt ?? null,
@@ -2605,13 +2643,17 @@ export class TrainSchedulingService {
     return saved;
   }
 
-  private async getActiveRoute(routeId: string) {
+  private async getSchedulableRoute(routeId: string) {
     const route = await this.dataSource.getRepository(Route).findOne({
       where: { id: routeId },
       relations: { originYard: true, destinationYard: true },
     });
     if (!route) throw new NotFoundException(`Route ${routeId} not found`);
-    if (!route.isActive) throw new BadRequestException(`Route ${route.name} is inactive`);
+    if (route.status !== 'AVAILABLE') {
+      throw new BadRequestException(
+        `Route ${formatRouteLabel(route)} is not available for scheduling (${route.status})`,
+      );
+    }
     return route;
   }
 
@@ -2656,7 +2698,7 @@ export class TrainSchedulingService {
       id: schedule.id,
       scheduleDate: schedule.scheduledDepartureDate,
       trainNumber: schedule.trainNumber ?? null,
-      routeName: schedule.route?.name ?? null,
+      routeName: schedule.route ? formatRouteLabel(schedule.route) : null,
       origin: schedule.originStation?.label ?? schedule.originStation?.code ?? null,
       destination:
         schedule.destinationStation?.label ?? schedule.destinationStation?.code ?? null,
@@ -2691,7 +2733,7 @@ export class TrainSchedulingService {
 
   /** AVAILABLE locomotives at the route's origin yard. */
   async getAvailableLocomotivesForRoute(routeId: string): Promise<Locomotive[]> {
-    const route = await this.getActiveRoute(routeId);
+    const route = await this.getSchedulableRoute(routeId);
 
     const locomotives = await this.locomotivesRepository.findAll({
       where: { status: 'AVAILABLE', currentYardId: route.originYardId },
@@ -2933,7 +2975,9 @@ export class TrainSchedulingService {
       freightType: this.resolveScheduleFreightType(schedule),
       trainNumber: schedule.trainNumber ?? null,
       direction: schedule.direction ?? null,
-      route: schedule.route ? { id: schedule.route.id, name: schedule.route.name } : null,
+      route: schedule.route
+        ? { id: schedule.route.id, name: formatRouteLabel(schedule.route) }
+        : null,
       scheduledDepartureDate: schedule.scheduledDepartureDate,
       scheduledArrivalDate: schedule.scheduledArrivalDate,
       actualDepartureAt: schedule.actualDepartureAt ?? null,
diff --git a/apps/edr-freight-api/src/modules/warehouses/dto/bulk-receive.dto.ts b/apps/edr-freight-api/src/modules/warehouses/dto/bulk-receive.dto.ts
index 5e31c8593..8dd0681ce 100644
--- a/apps/edr-freight-api/src/modules/warehouses/dto/bulk-receive.dto.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/dto/bulk-receive.dto.ts
@@ -1,6 +1,6 @@
 import { ApiProperty, ApiPropertyOptional } from '@nestjs/swagger';
 import { Type } from 'class-transformer';
-import { ArrayNotEmpty, IsArray, IsIn, IsNumber, IsOptional, IsString, IsUUID, Min } from 'class-validator';
+import { ArrayNotEmpty, IsArray, IsBoolean, IsIn, IsNumber, IsOptional, IsString, IsUUID, Min } from 'class-validator';
 import { ValidateNested } from 'class-validator';
 
 export class TruckEntranceDto {
@@ -90,6 +90,11 @@ export class TruckEntranceDto {
   @Min(0)
   grossWeightKg?: number;
 
+  @ApiPropertyOptional({ description: 'Whether the customer truck was weighed at receipt.' })
+  @IsOptional()
+  @IsBoolean()
+  weighingRequired?: boolean;
+
   @ApiPropertyOptional()
   @IsOptional()
   @IsNumber()
@@ -135,10 +140,11 @@ export class TruckEntranceDto {
   @IsString()
   truckType?: string;
 
-  @ApiProperty()
+  @ApiPropertyOptional()
+  @IsOptional()
   @IsNumber()
   @Min(0)
-  entranceTareWeightKg!: number;
+  entranceTareWeightKg?: number;
 
   @ApiPropertyOptional()
   @IsOptional()
diff --git a/apps/edr-freight-api/src/modules/warehouses/dto/fee-rule.dto.ts b/apps/edr-freight-api/src/modules/warehouses/dto/fee-rule.dto.ts
index 873f97a6b..e2c20901d 100644
--- a/apps/edr-freight-api/src/modules/warehouses/dto/fee-rule.dto.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/dto/fee-rule.dto.ts
@@ -1,8 +1,27 @@
 import { ApiProperty, ApiPropertyOptional, PartialType } from '@nestjs/swagger';
-import { IsEnum, IsInt, IsNumber, IsOptional, IsString, IsUUID, Min } from 'class-validator';
+import { Type } from 'class-transformer';
+import { IsArray, IsEnum, IsInt, IsNumber, IsOptional, IsString, IsUUID, Min, ValidateNested } from 'class-validator';
 
 import { FEE_RULE_TYPES, FeeRuleType } from '../entities/warehouse-fee-rule.entity';
 
+export class FeeRuleTierDto {
+  @ApiProperty({ example: 4 })
+  @IsInt()
+  @Min(1)
+  fromDay!: number;
+
+  @ApiPropertyOptional({ example: 4, description: 'Inclusive. Leave empty for an open-ended tier.' })
+  @IsOptional()
+  @IsInt()
+  @Min(1)
+  toDay?: number | null;
+
+  @ApiProperty({ example: 2500 })
+  @IsNumber()
+  @Min(0)
+  ratePerDay!: number;
+}
+
 export class CreateFeeRuleDto {
   @ApiProperty()
   @IsString()
@@ -67,6 +86,13 @@ export class CreateFeeRuleDto {
   @Min(0)
   ratePerDay!: number;
 
+  @ApiPropertyOptional({ type: [FeeRuleTierDto] })
+  @IsOptional()
+  @IsArray()
+  @ValidateNested({ each: true })
+  @Type(() => FeeRuleTierDto)
+  tiers?: FeeRuleTierDto[];
+
   @ApiPropertyOptional({ default: 'USD' })
   @IsOptional()
   @IsString()
diff --git a/apps/edr-freight-api/src/modules/warehouses/entities/warehouse-fee-rule.entity.ts b/apps/edr-freight-api/src/modules/warehouses/entities/warehouse-fee-rule.entity.ts
index f346be282..38dffd235 100644
--- a/apps/edr-freight-api/src/modules/warehouses/entities/warehouse-fee-rule.entity.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/entities/warehouse-fee-rule.entity.ts
@@ -4,6 +4,12 @@ import { Column, Entity, Index } from 'typeorm';
 export const FEE_RULE_TYPES = ['STORAGE_FEE', 'DEMURRAGE_FEE'] as const;
 export type FeeRuleType = (typeof FEE_RULE_TYPES)[number];
 
+export interface WarehouseFeeTier {
+  fromDay: number;
+  toDay: number | null;
+  ratePerDay: number;
+}
+
 /**
  * Batch 5 — configurable storage / demurrage fee rules (no invoice/payment here — that is Batch 6).
  * The most specific active rule (highest `specificity` then lowest `priority`) applies to an item.
@@ -54,6 +60,9 @@ export class WarehouseFeeRule extends BaseEntity {
   @Column({ name: 'rate_per_day', type: 'numeric', precision: 14, scale: 2, default: 0 })
   ratePerDay!: number;
 
+  @Column({ name: 'tiers', type: 'jsonb', default: () => "'[]'" })
+  tiers!: WarehouseFeeTier[];
+
   @Column({ name: 'currency', type: 'varchar', length: 8, default: 'USD' })
   currency!: string;
 
diff --git a/apps/edr-freight-api/src/modules/warehouses/scheduling-read.facade.ts b/apps/edr-freight-api/src/modules/warehouses/scheduling-read.facade.ts
index c1faeed22..5fcf59dd5 100644
--- a/apps/edr-freight-api/src/modules/warehouses/scheduling-read.facade.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/scheduling-read.facade.ts
@@ -35,6 +35,7 @@ export interface ImportTrainItemRow {
   wagonNumber: string | null;
   sequenceNo: number | null;
   allocatedWeightTons: number | null;
+  freightType: string | null;
   containerNumber: string | null;
   cargoType: string | null;
   weight: number | null;
@@ -274,6 +275,7 @@ export class SchedulingReadFacade {
               w.wagon_number          AS "wagonNumber",
               tsw.sequence_no          AS "sequenceNo",
               wba.allocated_weight_tons AS "allocatedWeightTons",
+              b.freight_type           AS "freightType",
               (SELECT c.container_number FROM freight.containers c
                 WHERE c.booking_id = b.id AND c.deleted_at IS NULL
                 ORDER BY c.container_number LIMIT 1) AS "containerNumber",
diff --git a/apps/edr-freight-api/src/modules/warehouses/warehouse-fee.service.ts b/apps/edr-freight-api/src/modules/warehouses/warehouse-fee.service.ts
index e0a0f2b6c..cfc7fbf6c 100644
--- a/apps/edr-freight-api/src/modules/warehouses/warehouse-fee.service.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/warehouse-fee.service.ts
@@ -1,9 +1,9 @@
-import { Injectable, NotFoundException } from '@nestjs/common';
+import { BadRequestException, Injectable, NotFoundException } from '@nestjs/common';
 import { ExchangeService } from '@edr/api-common';
 import { DataSource } from 'typeorm';
 
 import { CreateFeeRuleDto, UpdateFeeRuleDto } from './dto/fee-rule.dto';
-import { FeeRuleType, WarehouseFeeRule } from './entities/warehouse-fee-rule.entity';
+import { FeeRuleType, WarehouseFeeRule, WarehouseFeeTier } from './entities/warehouse-fee-rule.entity';
 import { WarehouseFeeRuleRepository } from './warehouse-fee-rule.repository';
 
 interface ItemAttributes {
@@ -39,6 +39,15 @@ export interface FeePreview {
   containerCount: number;
   billableUnits: number;
   amount: number;
+  tiers: Array<{
+    fromDay: number;
+    toDay: number | null;
+    appliedFromDay: number;
+    appliedToDay: number;
+    days: number;
+    ratePerDay: number;
+    amount: number;
+  }>;
 }
 
 const MS_PER_DAY = 24 * 60 * 60 * 1000;
@@ -57,11 +66,16 @@ export class WarehouseFeeService {
   }
 
   createRule(dto: CreateFeeRuleDto): Promise<WarehouseFeeRule> {
-    return this.feeRuleRepository.create({ isActive: true, priority: 100, currency: 'USD', ...dto });
+    return this.feeRuleRepository.create({
+      isActive: true,
+      priority: 100,
+      currency: 'USD',
+      ...this.normalizeRuleInput(dto),
+    });
   }
 
   async updateRule(id: string, dto: UpdateFeeRuleDto): Promise<WarehouseFeeRule> {
-    const updated = await this.feeRuleRepository.update(id, dto);
+    const updated = await this.feeRuleRepository.update(id, this.normalizeRuleInput(dto));
     if (!updated) throw new NotFoundException(`Fee rule ${id} not found`);
     return updated;
   }
@@ -70,6 +84,40 @@ export class WarehouseFeeService {
     return this.feeRuleRepository.softDelete(id);
   }
 
+  private normalizeRuleInput<T extends CreateFeeRuleDto | UpdateFeeRuleDto>(dto: T): T {
+    if (dto.tiers === undefined) return dto;
+    const tiers = (dto.tiers ?? [])
+      .map((tier) => ({
+        fromDay: Number(tier.fromDay),
+        toDay: tier.toDay == null ? null : Number(tier.toDay),
+        ratePerDay: Number(tier.ratePerDay),
+      }))
+      .filter((tier) => tier.fromDay > 0 || tier.toDay != null || tier.ratePerDay > 0);
+
+    for (const tier of tiers) {
+      if (!Number.isInteger(tier.fromDay) || tier.fromDay < 1) {
+        throw new BadRequestException('Fee tier from day must be a positive whole number.');
+      }
+      if (tier.toDay != null && (!Number.isInteger(tier.toDay) || tier.toDay < tier.fromDay)) {
+        throw new BadRequestException('Fee tier to day must be empty or greater than/equal to from day.');
+      }
+      if (!Number.isFinite(tier.ratePerDay) || tier.ratePerDay < 0) {
+        throw new BadRequestException('Fee tier rate per day must be zero or greater.');
+      }
+    }
+
+    const sorted = [...tiers].sort((a, b) => a.fromDay - b.fromDay || (a.toDay ?? Infinity) - (b.toDay ?? Infinity));
+    for (let i = 1; i < sorted.length; i += 1) {
+      const prev = sorted[i - 1];
+      const current = sorted[i];
+      if (prev.toDay == null || current.fromDay <= prev.toDay) {
+        throw new BadRequestException('Fee tiers cannot overlap. Use separate from/to day ranges.');
+      }
+    }
+
+    return { ...dto, tiers: sorted } as T;
+  }
+
   private async loadItem(inventoryId: string): Promise<ItemAttributes> {
     const [row] = await this.dataSource.query(
       `SELECT inv.arrived_at        AS "arrivedAt",
@@ -82,16 +130,27 @@ export class WarehouseFeeService {
               w.facility_id         AS "facilityId",
               b.freight_type        AS "freightType",
               b.trade_direction     AS "tradeDirection",
-              cgt.code              AS "cargoTypeCode",
-              ctt.code              AS "containerTypeCode",
+              COALESCE(cgt.code, booking_cgt.code) AS "cargoTypeCode",
+              COALESCE(ctt.code, booking_ctt.code) AS "containerTypeCode",
               COALESCE(container_lines.container_count, 0) AS "bookingContainerCount"
          FROM freight.warehouse_inventory inv
          LEFT JOIN freight.warehouses w ON w.id = inv.warehouse_id
          LEFT JOIN freight.bookings b ON b.id = inv.booking_id
          LEFT JOIN freight.cargoes cg ON cg.id = inv.cargo_id
          LEFT JOIN freight.cargo_types cgt ON cgt.id = cg.cargo_type_id
+         LEFT JOIN freight.cargo_types booking_cgt ON booking_cgt.id = b.cargo_type_id
          LEFT JOIN freight.containers ct ON ct.id = inv.container_id
          LEFT JOIN freight.container_types ctt ON ctt.id = ct.container_type_id
+         LEFT JOIN LATERAL (
+           SELECT bc.container_type_id
+             FROM freight.booking_container bc
+            WHERE bc.booking_id = inv.booking_id
+              AND bc.deleted_at IS NULL
+              AND bc.container_type_id IS NOT NULL
+            ORDER BY bc.created_at ASC
+            LIMIT 1
+         ) booking_container_type ON true
+         LEFT JOIN freight.container_types booking_ctt ON booking_ctt.id = booking_container_type.container_type_id
          LEFT JOIN LATERAL (
            SELECT COALESCE(SUM(bc.quantity), 0)::int AS container_count
              FROM freight.booking_container bc
@@ -108,16 +167,26 @@ export class WarehouseFeeService {
   private matchScore(rule: WarehouseFeeRule, item: ItemAttributes): number | null {
     // Returns specificity score (#matched non-null scope fields), or null if any constraint fails.
     let score = 0;
-    const check = (ruleVal: string | null | undefined, itemVal: string | null) => {
-      if (ruleVal == null) return true;
-      if (itemVal != null && ruleVal.toUpperCase() === itemVal.toUpperCase()) {
+    const normalized = (value: string | null | undefined) => value?.trim().toUpperCase() || null;
+    const check = (
+      ruleVal: string | null | undefined,
+      itemVal: string | null,
+      opts: { allowBoth?: boolean } = {},
+    ) => {
+      const ruleCode = normalized(ruleVal);
+      if (ruleCode == null || ruleCode === 'ANY' || ruleCode === 'ALL') return true;
+      if (opts.allowBoth && ruleCode === 'BOTH') {
+        score += 1;
+        return true;
+      }
+      if (ruleCode === normalized(itemVal)) {
         score += 1;
         return true;
       }
       return false;
     };
     if (!check(rule.freightType, item.freightType)) return null;
-    if (!check(rule.tradeDirection, item.tradeDirection)) return null;
+    if (!check(rule.tradeDirection, item.tradeDirection, { allowBoth: true })) return null;
     if (!check(rule.cargoTypeCode, item.cargoTypeCode)) return null;
     if (!check(rule.containerType, item.containerTypeCode)) return null;
     if (!check(rule.facilityId, item.facilityId)) return null;
@@ -153,6 +222,60 @@ export class WarehouseFeeService {
     return Math.round(amount * rate * 100) / 100;
   }
 
+  private calculateTieredAmount(
+    tiers: WarehouseFeeTier[] | null | undefined,
+    elapsedDays: number,
+    containerCount: number,
+  ): {
+    sourceAmount: number;
+    billableUnits: number;
+    chargeableDays: number;
+    weightedRatePerDay: number;
+    tiers: FeePreview['tiers'];
+  } {
+    const sourceTiers = (tiers ?? [])
+      .map((tier) => ({
+        fromDay: Number(tier.fromDay),
+        toDay: tier.toDay == null ? null : Number(tier.toDay),
+        ratePerDay: Number(tier.ratePerDay),
+      }))
+      .filter((tier) => Number.isFinite(tier.fromDay) && tier.fromDay > 0 && Number.isFinite(tier.ratePerDay))
+      .sort((a, b) => a.fromDay - b.fromDay);
+
+    let sourceAmount = 0;
+    let tierDays = 0;
+    const appliedTiers: FeePreview['tiers'] = [];
+
+    for (const tier of sourceTiers) {
+      if (elapsedDays < tier.fromDay) continue;
+      const appliedFromDay = tier.fromDay;
+      const appliedToDay = Math.min(elapsedDays, tier.toDay ?? elapsedDays);
+      const days = Math.max(0, appliedToDay - appliedFromDay + 1);
+      if (days <= 0) continue;
+
+      const amount = Math.round(days * containerCount * tier.ratePerDay * 100) / 100;
+      sourceAmount += amount;
+      tierDays += days;
+      appliedTiers.push({
+        fromDay: tier.fromDay,
+        toDay: tier.toDay,
+        appliedFromDay,
+        appliedToDay,
+        days,
+        ratePerDay: tier.ratePerDay,
+        amount,
+      });
+    }
+
+    return {
+      sourceAmount: Math.round(sourceAmount * 100) / 100,
+      billableUnits: tierDays * containerCount,
+      chargeableDays: tierDays,
+      weightedRatePerDay: tierDays > 0 ? Math.round((sourceAmount / tierDays / containerCount) * 100) / 100 : 0,
+      tiers: appliedTiers,
+    };
+  }
+
   private async compute(
     ruleType: FeeRuleType,
     rule: WarehouseFeeRule | null,
@@ -176,13 +299,25 @@ export class WarehouseFeeService {
     const elapsedDays = start
       ? Math.max(0, Math.ceil((new Date(endDate).getTime() - start.getTime()) / MS_PER_DAY))
       : 0;
-    const chargeableDays = Math.max(0, elapsedDays - freeDays);
-    const billableUnits = chargeableDays * containerCount;
-    const sourceAmount = Math.round(billableUnits * ratePerDay * 100) / 100;
+    const tiered = this.calculateTieredAmount(rule?.tiers, elapsedDays, containerCount);
+    const hasTiers = Boolean(rule?.tiers?.length);
+    const chargeableDays = hasTiers ? tiered.chargeableDays : Math.max(0, elapsedDays - freeDays);
+    const billableUnits = hasTiers ? tiered.billableUnits : chargeableDays * containerCount;
+    const sourceAmount = hasTiers ? tiered.sourceAmount : Math.round(billableUnits * ratePerDay * 100) / 100;
     const amount = ruleCurrency ? await this.convertAmount(sourceAmount, ruleCurrency, targetCurrency) : 0;
+    const sourceRatePerDay = hasTiers ? tiered.weightedRatePerDay : ratePerDay;
     const convertedRatePerDay = ruleCurrency
-      ? await this.convertAmount(ratePerDay, ruleCurrency, targetCurrency)
+      ? await this.convertAmount(sourceRatePerDay, ruleCurrency, targetCurrency)
       : 0;
+    const convertedTiers = ruleCurrency
+      ? await Promise.all(
+          tiered.tiers.map(async (tier) => ({
+            ...tier,
+            ratePerDay: await this.convertAmount(tier.ratePerDay, ruleCurrency, targetCurrency),
+            amount: await this.convertAmount(tier.amount, ruleCurrency, targetCurrency),
+          })),
+        )
+      : [];
 
     return {
       ruleType,
@@ -201,6 +336,7 @@ export class WarehouseFeeService {
       containerCount,
       billableUnits,
       amount,
+      tiers: hasTiers ? convertedTiers : [],
     };
   }
 
diff --git a/apps/edr-freight-api/src/modules/warehouses/warehouse-inspection.service.ts b/apps/edr-freight-api/src/modules/warehouses/warehouse-inspection.service.ts
index 1de6daf81..ff25258d3 100644
--- a/apps/edr-freight-api/src/modules/warehouses/warehouse-inspection.service.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/warehouse-inspection.service.ts
@@ -84,9 +84,11 @@ export class WarehouseInspectionService {
       `SELECT inv.booking_id AS "bookingId",
               b.reference AS "bookingReference",
               b.trade_direction AS "tradeDirection",
-              b.last_mile_delivery_address AS "lastMileDeliveryAddress"
+              b.last_mile_delivery_address AS "lastMileDeliveryAddress",
+              COALESCE(st.includes_last_mile, false) AS "serviceIncludesLastMile"
          FROM freight.warehouse_inventory inv
          LEFT JOIN freight.bookings b ON b.id = inv.booking_id
+         LEFT JOIN freight.service_types st ON st.id = b.service_type_id
         WHERE inv.id = $1 AND inv.deleted_at IS NULL
         LIMIT 1`,
       [inventoryId],
@@ -98,7 +100,10 @@ export class WarehouseInspectionService {
       readyForPickupAt: new Date(),
     });
 
-    if (row.bookingReference && row.lastMileDeliveryAddress) {
+    const hasLastMile =
+      Boolean(row.lastMileDeliveryAddress?.trim?.()) || Boolean(row.serviceIncludesLastMile);
+
+    if (row.bookingReference && hasLastMile) {
       await this.lastMileService.acceptBooking(row.bookingReference);
     }
   }
diff --git a/apps/edr-freight-api/src/modules/warehouses/warehouse-inventory.controller.ts b/apps/edr-freight-api/src/modules/warehouses/warehouse-inventory.controller.ts
index 6b2bd8c28..6b30dad1e 100644
--- a/apps/edr-freight-api/src/modules/warehouses/warehouse-inventory.controller.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/warehouse-inventory.controller.ts
@@ -139,8 +139,18 @@ export class WarehouseInventoryController {
 
   @Post('import/auto-unload-arrived-bookings')
   @ApiOperation({ summary: 'Unload all eligible assigned bookings of an ARRIVED import train (→ UNLOADED)' })
-  autoUnloadArrivedBookings(@Body() dto: { scheduleId: string; performedBy?: string }) {
-    return this.inventoryService.autoUnloadArrivedBookings(dto.scheduleId, dto.performedBy);
+  autoUnloadArrivedBookings(@Body() dto: {
+    scheduleId: string;
+    warehouseId?: string;
+    performedBy?: string;
+    assignments?: { bookingId: string; warehouseId: string; yardId: string; zoneId: string }[];
+  }) {
+    return this.inventoryService.autoUnloadArrivedBookings(
+      dto.scheduleId,
+      dto.performedBy,
+      dto.warehouseId,
+      dto.assignments,
+    );
   }
 
   @Get('import/unloaded-queue')
diff --git a/apps/edr-freight-api/src/modules/warehouses/warehouse-inventory.service.ts b/apps/edr-freight-api/src/modules/warehouses/warehouse-inventory.service.ts
index 001897b3f..11f34c892 100644
--- a/apps/edr-freight-api/src/modules/warehouses/warehouse-inventory.service.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/warehouse-inventory.service.ts
@@ -180,6 +180,10 @@ interface LocationRef {
   zoneId: string;
 }
 
+interface BookingUnloadLocation extends LocationRef {
+  bookingId: string;
+}
+
 interface LocationNode {
   capacityWeight?: number | null;
   capacityContainers?: number | null;
@@ -221,6 +225,11 @@ export interface EligibleBookingRow {
   firstMileDriverPhone: string | null;
   firstMileDriverLicenseNumber: string | null;
   firstMileTruckType: string | null;
+  customerTruckPlateNumber: string | null;
+  customerTruckDriverName: string | null;
+  customerTruckType: string | null;
+  customerTruckContainerNumber: string | null;
+  customerTruckAssignedAt: string | null;
 }
 
 export interface BulkReceiveResult {
@@ -302,6 +311,11 @@ export interface ImportUnloadedRow {
   inspectionStatus: string | null;
   pickupOption: string;
   lastMileRequested: boolean;
+  customerTruckPlateNumber: string | null;
+  customerTruckDriverName: string | null;
+  customerTruckType: string | null;
+  customerTruckContainerNumber: string | null;
+  customerTruckAssignedAt: string | null;
   currentStatus: string;
   releaseDate: string | null;
   releaseOrderReference: string | null;
@@ -504,8 +518,9 @@ export class WarehouseInventoryService {
     }));
   }
 
-  /** First warehouse that has at least one yard + zone (fallback location for auto-unload). */
-  private async pickDefaultLocation(): Promise<DefaultLocation | null> {
+  /** First matching warehouse that has at least one yard + zone (fallback location for auto-unload). */
+  private async pickDefaultLocation(warehouseId?: string): Promise<DefaultLocation | null> {
+    const params = warehouseId ? [warehouseId] : [];
     const [row]: DefaultLocation[] = await this.dataSource.query(
       `SELECT wh.id AS "warehouseId", wh.facility_id AS "facilityId",
               yard.id AS "yardId", zone.id AS "zoneId"
@@ -513,8 +528,10 @@ export class WarehouseInventoryService {
          JOIN freight.warehouse_yards yard ON yard.warehouse_id = wh.id AND yard.deleted_at IS NULL
          JOIN freight.warehouse_zones zone ON zone.yard_id = yard.id AND zone.deleted_at IS NULL
         WHERE wh.deleted_at IS NULL
+          ${warehouseId ? 'AND wh.id = $1' : ''}
         ORDER BY wh.created_at ASC
-        LIMIT 1`,
+       LIMIT 1`,
+      params,
     );
     return row ?? null;
   }
@@ -592,6 +609,7 @@ export class WarehouseInventoryService {
       dto.warehouseId && dto.yardId && dto.zoneId
         ? { warehouseId: dto.warehouseId, yardId: dto.yardId, zoneId: dto.zoneId, facilityId: dto.facilityId ?? null }
         : null;
+    if (!location && dto.warehouseId) location = await this.pickDefaultLocation(dto.warehouseId);
     if (!location) location = await this.pickDefaultLocation();
     if (!location) {
       throw new BadRequestException('No warehouse/yard/zone provided or configured for unloading');
@@ -704,7 +722,12 @@ export class WarehouseInventoryService {
               ) AS "firstMileDriverName",
               driver.phone_number      AS "firstMileDriverPhone",
               driver.license_number    AS "firstMileDriverLicenseNumber",
-              v.vehicle_type           AS "firstMileTruckType"
+              v.vehicle_type           AS "firstMileTruckType",
+              b.customer_truck_plate_number AS "customerTruckPlateNumber",
+              b.customer_truck_driver_name AS "customerTruckDriverName",
+              b.customer_truck_type AS "customerTruckType",
+              b.customer_truck_container_number AS "customerTruckContainerNumber",
+              b.customer_truck_assigned_at AS "customerTruckAssignedAt"
          FROM freight.bookings b
          LEFT JOIN freight.companies company ON company.id = b.company_id
          LEFT JOIN freight.yards oy ON oy.id = b.origin_yard_id
@@ -796,7 +819,12 @@ export class WarehouseInventoryService {
                   ) AS "firstMileDriverName",
                   driver.phone_number AS "firstMileDriverPhone",
                   driver.license_number AS "firstMileDriverLicenseNumber",
-                  v.vehicle_type AS "firstMileTruckType"
+                  v.vehicle_type AS "firstMileTruckType",
+                  b.customer_truck_plate_number AS "customerTruckPlateNumber",
+                  b.customer_truck_driver_name AS "customerTruckDriverName",
+                  b.customer_truck_type AS "customerTruckType",
+                  b.customer_truck_container_number AS "customerTruckContainerNumber",
+                  b.customer_truck_assigned_at AS "customerTruckAssignedAt"
              FROM freight.bookings b
              LEFT JOIN freight.companies company ON company.id = b.company_id
              LEFT JOIN freight.yards oy ON oy.id = b.origin_yard_id
@@ -1041,9 +1069,16 @@ export class WarehouseInventoryService {
               COALESCE(inv.grn_number, substring(inv.notes FROM 'GRN Number: ([^\\n\\r]+)')) AS "grnNumber",
               ts.train_number          AS "trainSchedule",
               inv.inspection_status    AS "inspectionStatus",
-              CASE WHEN b.last_mile_delivery_address IS NOT NULL
+              CASE WHEN NULLIF(TRIM(COALESCE(b.last_mile_delivery_address, '')), '') IS NOT NULL
+                         OR COALESCE(st.includes_last_mile, false)
                    THEN 'DOOR_DELIVERY' ELSE 'TERMINAL_PICKUP' END AS "pickupOption",
-              (b.last_mile_delivery_address IS NOT NULL) AS "lastMileRequested",
+              (NULLIF(TRIM(COALESCE(b.last_mile_delivery_address, '')), '') IS NOT NULL
+                OR COALESCE(st.includes_last_mile, false)) AS "lastMileRequested",
+              b.customer_truck_plate_number AS "customerTruckPlateNumber",
+              b.customer_truck_driver_name AS "customerTruckDriverName",
+              b.customer_truck_type AS "customerTruckType",
+              b.customer_truck_container_number AS "customerTruckContainerNumber",
+              b.customer_truck_assigned_at AS "customerTruckAssignedAt",
               inv.status               AS "currentStatus",
               inv.release_date         AS "releaseDate",
               inv.release_order_reference AS "releaseOrderReference",
@@ -1056,6 +1091,7 @@ export class WarehouseInventoryService {
          LEFT JOIN freight.bookings b ON b.id = inv.booking_id AND b.deleted_at IS NULL
          LEFT JOIN freight.companies company ON company.id = b.company_id
          LEFT JOIN freight.cargo_types cgt ON cgt.id = b.cargo_type_id
+         LEFT JOIN freight.service_types st ON st.id = b.service_type_id
          LEFT JOIN freight.yards oy ON oy.id = b.origin_yard_id
          LEFT JOIN freight.yards dy ON dy.id = b.destination_yard_id
          LEFT JOIN freight.train_schedule_bookings tsb ON tsb.booking_id = b.id AND tsb.deleted_at IS NULL
@@ -1157,6 +1193,8 @@ export class WarehouseInventoryService {
   async autoUnloadArrivedBookings(
     scheduleId: string,
     performedBy?: string,
+    warehouseId?: string,
+    assignments: BookingUnloadLocation[] = [],
   ): Promise<AutoUnloadArrivedResult> {
     const result: AutoUnloadArrivedResult = { unloadedCount: 0, skippedCount: 0, failedCount: 0, results: [] };
 
@@ -1203,7 +1241,21 @@ export class WarehouseInventoryService {
       [scheduleId],
     );
 
-    const fallback = await this.pickDefaultLocation();
+    const requestedLocation = warehouseId ? await this.pickDefaultLocation(warehouseId) : null;
+    if (warehouseId && !requestedLocation) {
+      throw new BadRequestException('Selected warehouse has no yard/zone configured for unloading');
+    }
+    const fallback = requestedLocation ?? (await this.pickDefaultLocation());
+    const assignmentByBooking = new Map(
+      assignments.map((assignment) => [
+        assignment.bookingId,
+        {
+          warehouseId: assignment.warehouseId,
+          yardId: assignment.yardId,
+          zoneId: assignment.zoneId,
+        } satisfies LocationRef,
+      ]),
+    );
     const now = new Date();
 
     for (const booking of bookings) {
@@ -1223,6 +1275,8 @@ export class WarehouseInventoryService {
 
       try {
         const existing = (await this.inventoryRepository.findAll({ where: { bookingId: booking.id } }))[0];
+        const assignedLocation = assignmentByBooking.get(booking.id) ?? null;
+        const unloadLocation = assignedLocation ?? requestedLocation;
 
         // Already unloaded or further along — leave it (do not regress the lifecycle).
         if (existing && existing.status !== 'RECEIVED') {
@@ -1232,6 +1286,13 @@ export class WarehouseInventoryService {
 
         if (existing) {
           await this.inventoryRepository.update(existing.id, {
+            ...(unloadLocation
+              ? {
+                  warehouseId: unloadLocation.warehouseId,
+                  yardId: unloadLocation.yardId,
+                  zoneId: unloadLocation.zoneId,
+                }
+              : {}),
             status: 'UNLOADED',
             unloadedAt: now,
             arrivedAt: existing.arrivedAt ?? now,
@@ -1239,7 +1300,7 @@ export class WarehouseInventoryService {
           await this.activityLog.record({
             activityType: 'INVENTORY_UNLOADED',
             inventoryId: existing.id,
-            warehouseId: existing.warehouseId,
+            warehouseId: unloadLocation?.warehouseId ?? existing.warehouseId,
             description: 'Unloaded from arrived import train',
             performedBy,
           });
@@ -1254,7 +1315,7 @@ export class WarehouseInventoryService {
           tradeDirection: booking.tradeDirection,
           cargoTypeCode: booking.cargoTypeCode,
         });
-        const location = allocated ?? fallback;
+        const location = assignedLocation ?? requestedLocation ?? allocated ?? fallback;
         if (!location) {
           fail('No warehouse/yard/zone configured');
           continue;
@@ -1336,6 +1397,16 @@ export class WarehouseInventoryService {
     if (!['ARRIVED', 'ARRIVED_AT_DJIBOUTI'].includes(schedule.status)) {
       throw new BadRequestException(`Train schedule is ${schedule.status}, not ARRIVED`);
     }
+    const [gatepass] = await this.dataSource.query(
+      `SELECT gatepass_granted_at AS "gatepassSecuredAt"
+         FROM freight.import_djibouti_operations
+        WHERE train_schedule_id = $1 AND deleted_at IS NULL
+        LIMIT 1`,
+      [scheduleId],
+    );
+    if (!gatepass?.gatepassSecuredAt) {
+      throw new BadRequestException('Djibouti Port entry blocked: gate pass status is NOT_SECURED');
+    }
 
     const items: Array<{
       bookingId: string;
@@ -1631,13 +1702,17 @@ export class WarehouseInventoryService {
     if (!bookingId) return;
     const [booking] = await this.dataSource.query(
       `SELECT reference,
-              last_mile_delivery_address AS "lastMileDeliveryAddress"
-         FROM freight.bookings
-        WHERE id = $1 AND deleted_at IS NULL
+              last_mile_delivery_address AS "lastMileDeliveryAddress",
+              COALESCE(st.includes_last_mile, false) AS "serviceIncludesLastMile"
+         FROM freight.bookings b
+         LEFT JOIN freight.service_types st ON st.id = b.service_type_id
+        WHERE b.id = $1 AND b.deleted_at IS NULL
         LIMIT 1`,
       [bookingId],
     );
-    if (!booking?.reference || !booking.lastMileDeliveryAddress) return;
+    const hasLastMile =
+      Boolean(booking?.lastMileDeliveryAddress?.trim?.()) || Boolean(booking?.serviceIncludesLastMile);
+    if (!booking?.reference || !hasLastMile) return;
     await this.lastMileService.acceptBooking(booking.reference);
   }
 
@@ -1955,11 +2030,19 @@ export class WarehouseInventoryService {
     }
 
     const isTruckLeaving = dto.grossWeight !== undefined && Boolean(dto.gateOutTime);
+    if (isTruckLeaving) {
+      await this.invoices.assertClearanceAllowed(id);
+    }
     const releaseDate = isTruckLeaving
       ? dto.releaseDate ? new Date(dto.releaseDate) : new Date()
       : item.releaseDate ?? null;
-    const reference = dto.reference?.trim() || (await this.generateReleaseReference(item));
-    const exitInspectionNote = this.buildExitInspectionNote(dto);
+    const reference = isTruckLeaving
+      ? item.releaseOrderReference || dto.reference?.trim() || (await this.generateReleaseReference(item))
+      : dto.reference?.trim() || (await this.generateReleaseReference(item));
+    const exitInspectionDto = isTruckLeaving
+      ? this.preserveTruckArrivalForExit(dto, item.notes)
+      : dto;
+    const exitInspectionNote = this.buildExitInspectionNote(exitInspectionDto);
 
     await this.dataSource.transaction(async (manager) => {
       await manager.getRepository(WarehouseInventory).update(id, {
@@ -1967,6 +2050,17 @@ export class WarehouseInventoryService {
         releaseOrderReference: reference,
         notes: this.replaceExitInspectionNote(item.notes, exitInspectionNote),
       });
+      if (!isTruckLeaving && item.bookingId) {
+        await manager.query(
+          `UPDATE freight.bookings
+              SET customer_truck_arrived_at = COALESCE(customer_truck_arrived_at, NOW()),
+                  updated_at = NOW()
+            WHERE id = $1
+              AND customer_truck_assigned_at IS NOT NULL
+              AND deleted_at IS NULL`,
+          [item.bookingId],
+        );
+      }
       await this.activityLog.record(
         {
           activityType: 'INVENTORY_RELEASED',
@@ -2034,6 +2128,7 @@ export class WarehouseInventoryService {
     if (!row.releaseDate) {
       throw new BadRequestException('A release order must be issued before downloading the exit paper');
     }
+    await this.invoices.assertClearanceAllowed(id);
 
     const bookingReference = row?.bookingReference || 'N/A';
     const reference =
@@ -2180,11 +2275,19 @@ export class WarehouseInventoryService {
       throw new BadRequestException('Please save your signature before approving delivery');
     }
 
-    const [item]: Array<{ id: string; warehouseId: string | null; notes: string | null }> =
+    const [item]: Array<{
+      id: string;
+      warehouseId: string | null;
+      notes: string | null;
+      customerTruckAssignedAt: string | null;
+      customerTruckArrivedAt: string | null;
+    }> =
       await this.dataSource.query(
         `SELECT inv.id,
                 inv.warehouse_id AS "warehouseId",
-                inv.notes
+                inv.notes,
+                b.customer_truck_assigned_at AS "customerTruckAssignedAt",
+                b.customer_truck_arrived_at AS "customerTruckArrivedAt"
            FROM freight.warehouse_inventory inv
            JOIN freight.bookings b ON b.id = inv.booking_id AND b.deleted_at IS NULL
           WHERE inv.booking_id = $1
@@ -2198,6 +2301,10 @@ export class WarehouseInventoryService {
     if (!item) {
       throw new BadRequestException('Delivery can be approved after warehouse inspection has passed');
     }
+    if (item.customerTruckAssignedAt && !item.customerTruckArrivedAt) {
+      throw new BadRequestException('Customer truck arrival must be recorded before delivery approval');
+    }
+    await this.invoices.assertClearanceAllowed(item.id);
 
     const approvedAt = new Date();
     const approval = {
@@ -2301,6 +2408,7 @@ export class WarehouseInventoryService {
     if (!row) {
       throw new NotFoundException(`Inventory item ${id} not found`);
     }
+    await this.invoices.assertClearanceAllowed(id);
     if (row.inspectionStatus !== 'PASSED') {
       throw new BadRequestException('Handover document is available after inspection has passed');
     }
@@ -3302,8 +3410,13 @@ export class WarehouseInventoryService {
     if (!truckEntrance.driverPhone?.trim()) {
       throw new BadRequestException('Driver phone is required for entrance registration');
     }
-    if (truckEntrance.entranceTareWeightKg === undefined || Number(truckEntrance.entranceTareWeightKg) < 0) {
-      throw new BadRequestException('Entrance tare weight is required for entrance registration');
+    if (truckEntrance.weighingRequired) {
+      if (truckEntrance.grossWeightKg === undefined || Number(truckEntrance.grossWeightKg) < 0) {
+        throw new BadRequestException('Gross weight is required when customer truck weighing is Yes');
+      }
+      if (truckEntrance.exitTareWeightKg === undefined || Number(truckEntrance.exitTareWeightKg) < 0) {
+        throw new BadRequestException('Exit tare weight is required when customer truck weighing is Yes');
+      }
     }
   }
 
@@ -3325,6 +3438,11 @@ export class WarehouseInventoryService {
       firstMileDriverPhone?: string | null;
       firstMileDriverLicenseNumber?: string | null;
       firstMileTruckType?: string | null;
+      customerTruckPlateNumber?: string | null;
+      customerTruckDriverName?: string | null;
+      customerTruckType?: string | null;
+      customerTruckContainerNumber?: string | null;
+      customerTruckAssignedAt?: string | null;
     },
   ): TruckEntranceDto {
     return {
@@ -3340,16 +3458,22 @@ export class WarehouseInventoryService {
         booking.containerQuantity !== undefined && booking.containerQuantity !== null
           ? Number(booking.containerQuantity)
           : submitted.unitCount,
-      grossWeightKg:
-        booking.weight !== undefined && booking.weight !== null
-          ? Number(booking.weight)
-          : submitted.grossWeightKg,
-      truckPlateNumber: booking.firstMileTruckPlateNumber?.trim() || submitted.truckPlateNumber,
+      grossWeightKg: submitted.grossWeightKg,
+      truckPlateNumber:
+        booking.firstMileTruckPlateNumber?.trim() ||
+        booking.customerTruckPlateNumber?.trim() ||
+        submitted.truckPlateNumber,
       trailerPlateNumber: booking.firstMileTrailerPlateNumber?.trim() || submitted.trailerPlateNumber,
-      driverName: booking.firstMileDriverName?.trim() || submitted.driverName,
+      driverName:
+        booking.firstMileDriverName?.trim() ||
+        booking.customerTruckDriverName?.trim() ||
+        submitted.driverName,
       driverPhone: booking.firstMileDriverPhone?.trim() || submitted.driverPhone,
       driverLicenseNumber: booking.firstMileDriverLicenseNumber?.trim() || submitted.driverLicenseNumber,
-      truckType: booking.firstMileTruckType?.trim() || submitted.truckType,
+      truckType:
+        booking.firstMileTruckType?.trim() ||
+        booking.customerTruckType?.trim() ||
+        submitted.truckType,
     };
   }
 
@@ -3543,6 +3667,24 @@ export class WarehouseInventoryService {
     return rows.filter(Boolean).join('\n');
   }
 
+  private preserveTruckArrivalForExit(dto: ReleaseOrderDto, notes: string | null | undefined): ReleaseOrderDto {
+    const inspection = this.extractExitInspectionNote(notes);
+    if (!inspection) return dto;
+
+    return {
+      ...dto,
+      truckPlateNumber: this.extractExitInspectionLine(inspection, 'Truck Plate') || dto.truckPlateNumber,
+      trailerPlateNumber: this.extractExitInspectionLine(inspection, 'Trailer Plate') || dto.trailerPlateNumber,
+      driverName: this.extractExitInspectionLine(inspection, 'Driver') || dto.driverName,
+      driverLicense: this.extractExitInspectionLine(inspection, 'Driver License') || dto.driverLicense,
+      driverPhone: this.extractExitInspectionLine(inspection, 'Driver Phone') || dto.driverPhone,
+      truckType: this.extractExitInspectionLine(inspection, 'Truck Type') || dto.truckType,
+      containerNumber: this.extractExitInspectionLine(inspection, 'Container Number') || dto.containerNumber,
+      gateInTime: this.extractExitInspectionLine(inspection, 'Gate In Time') || dto.gateInTime,
+      tareWeight: this.extractExitInspectionNumber(inspection, 'Tare Weight') ?? dto.tareWeight,
+    };
+  }
+
   private replaceExitInspectionNote(notes: string | null | undefined, exitInspectionNote: string | null): string | null {
     const trimmed = notes?.trim();
     if (!exitInspectionNote) return trimmed || null;
@@ -3564,6 +3706,18 @@ export class WarehouseInventoryService {
     return notes.slice(index + marker.length).trim() || null;
   }
 
+  private extractExitInspectionLine(note: string | null | undefined, label: string): string | null {
+    const match = note?.match(new RegExp(`^${label}:\\s*(.+)$`, 'im'));
+    return match?.[1]?.trim() || null;
+  }
+
+  private extractExitInspectionNumber(note: string | null | undefined, label: string): number | undefined {
+    const value = this.extractExitInspectionLine(note, label)?.replace(/\s*kg$/i, '');
+    if (!value) return undefined;
+    const parsed = Number(value);
+    return Number.isFinite(parsed) ? parsed : undefined;
+  }
+
   private extractReceiveSummary(notes?: string | null): string | null {
     if (!notes?.trim()) return null;
     const withoutExit = notes.split('\n\n[Exit Inspection]')[0] ?? notes;
@@ -3622,6 +3776,7 @@ export class WarehouseInventoryService {
       truck?.driverPhone ? `Driver Phone: ${truck.driverPhone}` : null,
       truck?.driverLicenseNumber ? `Driver License: ${truck.driverLicenseNumber}` : null,
       truck?.entranceTareWeightKg !== undefined ? `Entrance Tare Weight: ${Number(truck.entranceTareWeightKg)} kg` : null,
+      truck?.weighingRequired !== undefined ? `Weighing Required: ${truck.weighingRequired ? 'Yes' : 'No'}` : null,
       truck?.exitTareWeightKg !== undefined ? `Exit Tare Weight: ${Number(truck.exitTareWeightKg)} kg` : null,
       truck?.declarationNumber ? `Declaration / Bill of Entry: ${truck.declarationNumber}` : null,
       truck?.incoterms ? `Incoterms: ${truck.incoterms}` : null,
diff --git a/apps/edr-freight-api/src/modules/warehouses/warehouse-invoice.controller.ts b/apps/edr-freight-api/src/modules/warehouses/warehouse-invoice.controller.ts
index a66cf91d0..8b16e3bec 100644
--- a/apps/edr-freight-api/src/modules/warehouses/warehouse-invoice.controller.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/warehouse-invoice.controller.ts
@@ -2,6 +2,7 @@ import { Body, Controller, Get, Param, ParseUUIDPipe, Patch, Post, Query, Res }
 import { ApiBearerAuth, ApiOperation, ApiTags } from '@nestjs/swagger';
 import type { Response } from 'express';
 
+import { PayInvoiceDto as GatewayPayInvoiceDto } from '../billing/dto/pay-invoice.dto';
 import { GenerateInvoiceDto, PayInvoiceBodyDto } from './dto/invoice.dto';
 import { WarehouseInvoiceService } from './warehouse-invoice.service';
 
@@ -86,4 +87,10 @@ export class WarehouseInvoiceController {
   pay(@Param('id', ParseUUIDPipe) id: string, @Body() dto: PayInvoiceBodyDto) {
     return this.invoiceService.pay(id, dto);
   }
+
+  @Post('warehouse-fee-invoices/:id/pay-online')
+  @ApiOperation({ summary: 'Initiate Telebirr/Waafi payment for a warehouse fee invoice' })
+  payOnline(@Param('id', ParseUUIDPipe) id: string, @Body() dto: GatewayPayInvoiceDto) {
+    return this.invoiceService.initiatePayment(id, dto);
+  }
 }
diff --git a/apps/edr-freight-api/src/modules/warehouses/warehouse-invoice.service.ts b/apps/edr-freight-api/src/modules/warehouses/warehouse-invoice.service.ts
index 6f7219781..f40153dad 100644
--- a/apps/edr-freight-api/src/modules/warehouses/warehouse-invoice.service.ts
+++ b/apps/edr-freight-api/src/modules/warehouses/warehouse-invoice.service.ts
@@ -3,6 +3,7 @@ import { OnEvent } from '@nestjs/event-emitter';
 import { Freight } from '@edr/types';
 import { DataSource } from 'typeorm';
 
+import { PayInvoiceDto as GatewayPayInvoiceDto } from '../billing/dto/pay-invoice.dto';
 import { BillingService, InvoiceEventPayload, InvoiceLineInput } from '../billing/billing.service';
 import { Invoice } from '../billing/entities/invoice.entity';
 import { InvoiceLine } from '../billing/entities/invoice-line.entity';
@@ -171,8 +172,12 @@ export class WarehouseInvoiceService {
           feeType,
           description:
             p.ruleType === 'STORAGE_FEE'
-              ? `Storage fee - ${p.chargeableDays} chargeable day(s) x ${p.containerCount} container(s) after ${p.freeDays} free`
-              : `${isContainer ? 'Container' : 'Bulk'} demurrage - ${p.chargeableDays} chargeable day(s) x ${p.containerCount} container(s) after ${p.freeDays} free`,
+              ? `Storage fee - ${p.chargeableDays} chargeable day(s) x ${p.containerCount} container(s)${
+                  p.tiers.length ? ' using tiered tariff' : ` after ${p.freeDays} free`
+                }`
+              : `${isContainer ? 'Container' : 'Bulk'} demurrage - ${p.chargeableDays} chargeable day(s) x ${p.containerCount} container(s)${
+                  p.tiers.length ? ' using tiered tariff' : ` after ${p.freeDays} free`
+                }`,
           quantity: p.billableUnits,
           unitRate: p.ratePerDay,
           amount: p.amount,
@@ -305,6 +310,22 @@ export class WarehouseInvoiceService {
     return detail;
   }
 
+  /** Initiate a wallet/gateway payment for the invoice. */
+  async initiatePayment(id: string, dto: GatewayPayInvoiceDto = {}) {
+    const invoice = await this.loadWarehouseInvoice(id);
+    if (invoice.status === Freight.InvoiceStatus.Paid) {
+      throw new BadRequestException('Invoice is already fully paid.');
+    }
+
+    return this.billing.payInvoice(invoice.source as Freight.InvoiceSource, invoice.sourceId, {
+      method: dto.method ?? (invoice.currency === 'USD' ? 'WAAFI' : 'TELEBIRR'),
+      platform: dto.platform ?? 'web',
+      payerAccount: dto.payerAccount,
+      returnUrl: dto.returnUrl,
+      failureUrl: dto.failureUrl,
+    });
+  }
+
   /**
    * Notify on online (gateway) settlement — the domain side-effect of a warehouse
    * fee being paid through billing's payment flow. The counter {@link pay} path
diff --git a/apps/edr-freight-api/src/scripts/main.ts b/apps/edr-freight-api/src/scripts/main.ts
new file mode 100644
index 000000000..f3a304233
--- /dev/null
+++ b/apps/edr-freight-api/src/scripts/main.ts
@@ -0,0 +1,35 @@
+import "reflect-metadata";
+import { config } from "dotenv";
+
+config();
+
+import Vorpal from "vorpal";
+
+import { NestFactory } from "@nestjs/core";
+import { AppModule } from "../app.module";
+
+const vorpal = new Vorpal();
+
+async function main() {
+  const app = await NestFactory.createApplicationContext(AppModule, {
+    logger: false,
+  });
+
+  try {
+    // registerCommands(vorpal, { app });
+
+    const args = process.argv.slice(2);
+    if (args.length > 0) {
+      await vorpal.exec(args.join(" "));
+    } else {
+      vorpal.parse(process.argv);
+    }
+  } finally {
+    await app.close();
+  }
+}
+
+main().catch((err) => {
+  console.error("Script failed:", err);
+  process.exit(1);
+});
diff --git a/apps/edr-freight-api/src/scripts/seed-gate-pass-train-scenarios.ts b/apps/edr-freight-api/src/scripts/seed-gate-pass-train-scenarios.ts
new file mode 100644
index 000000000..a57ce84c7
--- /dev/null
+++ b/apps/edr-freight-api/src/scripts/seed-gate-pass-train-scenarios.ts
@@ -0,0 +1,627 @@
+import 'reflect-metadata';
+import { config } from 'dotenv';
+import { resolve } from 'path';
+import { WagonStatus } from '@edr/types';
+import { In } from 'typeorm';
+
+config({ path: resolve(__dirname, '../../.env') });
+
+import { AppDataSource } from '../data-source';
+import { BookingContainer } from '../modules/bookings/entities/booking-container.entity';
+import { Booking } from '../modules/bookings/entities/booking.entity';
+import { CompanyProfile, ProfileStatus, ProfileType } from '../modules/companies/entities/company-profile.entity';
+import { Company, CompanyKind, CompanyStatus, CompanyType } from '../modules/companies/entities/company.entity';
+import { Container } from '../modules/container-management/entities/container.entity';
+import { Locomotive } from '../modules/locomotives/entities/locomotive.entity';
+import { ContainerType } from '../modules/rule-engine/entities/container-type.entity';
+import { ServiceType } from '../modules/rule-engine/entities/service-type.entity';
+import { Yard } from '../modules/rule-engine/entities/yard.entity';
+import { ImportDjiboutiOperation } from '../modules/train-scheduling/entities/import-djibouti-operation.entity';
+import { TrainScheduleBooking } from '../modules/train-schedules/entities/train-schedule-booking.entity';
+import { WagonAllocationContainerItem } from '../modules/train-schedules/entities/wagon-allocation-container-item.entity';
+import { WagonBookingAllocation } from '../modules/train-schedules/entities/wagon-booking-allocation.entity';
+import { TrainSchedule } from '../modules/train-schedules/entities/train-schedule.entity';
+import { TrainSetWagon } from '../modules/train-sets/entities/train-set-wagon.entity';
+import { TrainSet } from '../modules/train-sets/entities/train-set.entity';
+import { WagonType } from '../modules/wagon-types/entities/wagon-type.entity';
+import { Wagon } from '../modules/wagons/entities/wagon.entity';
+import { WarehouseInventory } from '../modules/warehouses/entities/warehouse-inventory.entity';
+import { WarehouseYard } from '../modules/warehouses/entities/warehouse-yard.entity';
+import { WarehouseZone } from '../modules/warehouses/entities/warehouse-zone.entity';
+import { Warehouse } from '../modules/warehouses/entities/warehouse.entity';
+
+type Direction = 'IMPORT' | 'EXPORT';
+type TrainStatus = 'SCHEDULED' | 'ARRIVED';
+
+interface ScenarioTrain {
+  trainNumber: string;
+  direction: Direction;
+  status: TrainStatus;
+  departureOffsetHours: number;
+  arrivalOffsetHours: number;
+  bookings: Array<{
+    reference: string;
+    mileVariant: 'FIRST_MILE' | 'LAST_MILE' | 'TERMINAL';
+    containerNumber: string;
+    weightTons: number;
+  }>;
+}
+
+const SCENARIOS: ScenarioTrain[] = [
+  {
+    trainNumber: 'GP-IMP-ARR-01',
+    direction: 'IMPORT',
+    status: 'ARRIVED',
+    departureOffsetHours: -18,
+    arrivalOffsetHours: -6,
+    bookings: [
+      { reference: 'GP-IMP-ARR-LM-001', mileVariant: 'LAST_MILE', containerNumber: 'GPIM0000001', weightTons: 22 },
+      { reference: 'GP-IMP-ARR-TM-002', mileVariant: 'TERMINAL', containerNumber: 'GPIM0000002', weightTons: 24 },
+    ],
+  },
+  {
+    trainNumber: 'GP-IMP-NARR-01',
+    direction: 'IMPORT',
+    status: 'SCHEDULED',
+    departureOffsetHours: 6,
+    arrivalOffsetHours: 18,
+    bookings: [
+      { reference: 'GP-IMP-NARR-LM-001', mileVariant: 'LAST_MILE', containerNumber: 'GPIM0000003', weightTons: 21 },
+      { reference: 'GP-IMP-NARR-TM-002', mileVariant: 'TERMINAL', containerNumber: 'GPIM0000004', weightTons: 23 },
+    ],
+  },
+  {
+    trainNumber: 'GP-EXP-ARR-01',
+    direction: 'EXPORT',
+    status: 'ARRIVED',
+    departureOffsetHours: -16,
+    arrivalOffsetHours: -4,
+    bookings: [
+      { reference: 'GP-EXP-ARR-FM-001', mileVariant: 'FIRST_MILE', containerNumber: 'GPEX0000001', weightTons: 20 },
+      { reference: 'GP-EXP-ARR-TM-002', mileVariant: 'TERMINAL', containerNumber: 'GPEX0000002', weightTons: 22 },
+    ],
+  },
+  {
+    trainNumber: 'GP-EXP-NARR-01',
+    direction: 'EXPORT',
+    status: 'SCHEDULED',
+    departureOffsetHours: 8,
+    arrivalOffsetHours: 20,
+    bookings: [
+      { reference: 'GP-EXP-NARR-FM-001', mileVariant: 'FIRST_MILE', containerNumber: 'GPEX0000003', weightTons: 19 },
+      { reference: 'GP-EXP-NARR-TM-002', mileVariant: 'TERMINAL', containerNumber: 'GPEX0000004', weightTons: 21 },
+    ],
+  },
+];
+
+const addHours = (date: Date, hours: number): Date => new Date(date.getTime() + hours * 60 * 60 * 1000);
+
+async function main() {
+  const dataSource = await AppDataSource.initialize();
+
+  try {
+    const seeded = await dataSource.transaction(async (manager) => {
+      if (await isAlreadySeeded(manager)) {
+        return null;
+      }
+      const refs = await ensureReferences(manager);
+      const now = new Date();
+      const result: Array<{ trainNumber: string; bookings: string[] }> = [];
+
+      for (const scenario of SCENARIOS) {
+        const schedule = await seedScenarioTrain(manager, scenario, refs, now);
+        result.push({
+          trainNumber: schedule.trainNumber ?? scenario.trainNumber,
+          bookings: scenario.bookings.map((booking) => booking.reference),
+        });
+      }
+
+      return result;
+    });
+
+    console.log('Gate-pass train scenario seed complete.');
+    if (seeded) {
+      for (const row of seeded) {
+        console.log(`${row.trainNumber}: ${row.bookings.join(', ')}`);
+      }
+    } else {
+      console.log('Gate-pass train scenarios already seeded; nothing changed.');
+    }
+  } finally {
+    await dataSource.destroy();
+  }
+}
+
+async function isAlreadySeeded(manager: any): Promise<boolean> {
+  const scheduleRepo = manager.getRepository(TrainSchedule);
+  const bookingRepo = manager.getRepository(Booking);
+  const trainNumbers = SCENARIOS.map((scenario) => scenario.trainNumber);
+  const bookingRefs = SCENARIOS.flatMap((scenario) => scenario.bookings.map((booking) => booking.reference));
+
+  const [scheduleCount, bookingCount] = await Promise.all([
+    scheduleRepo.count({ where: { trainNumber: In(trainNumbers) } }),
+    bookingRepo.count({ where: { reference: In(bookingRefs) } }),
+  ]);
+
+  return scheduleCount === trainNumbers.length && bookingCount === bookingRefs.length;
+}
+
+async function ensureReferences(manager: any) {
+  const yardRepo = manager.getRepository(Yard);
+  const serviceTypeRepo = manager.getRepository(ServiceType);
+  const containerTypeRepo = manager.getRepository(ContainerType);
+  const wagonTypeRepo = manager.getRepository(WagonType);
+  const companyRepo = manager.getRepository(Company);
+  const profileRepo = manager.getRepository(CompanyProfile);
+  const warehouseRepo = manager.getRepository(Warehouse);
+  const warehouseYardRepo = manager.getRepository(WarehouseYard);
+  const warehouseZoneRepo = manager.getRepository(WarehouseZone);
+
+  const djiboutiYard =
+    (await yardRepo.findOne({ where: { code: 'NAGAD' } })) ??
+    (await yardRepo.findOne({ where: { code: 'DJIB_PORT' } })) ??
+    (await yardRepo.findOne({ where: { country: 'Djibouti' } })) ??
+    (await yardRepo.save(
+      yardRepo.create({
+        code: 'NAGAD',
+        label: 'Nagad Port',
+        country: 'Djibouti',
+        isActive: true,
+        displayOrder: 90,
+      }),
+    ));
+
+  const ethiopiaYard =
+    (await yardRepo.findOne({ where: { code: 'INDODE' } })) ??
+    (await yardRepo.findOne({ where: { code: 'MOJO' } })) ??
+    (await yardRepo.findOne({ where: { country: 'Ethiopia' } })) ??
+    (await yardRepo.save(
+      yardRepo.create({
+        code: 'INDODE',
+        label: 'Indode Dry Port',
+        country: 'Ethiopia',
+        isActive: true,
+        displayOrder: 91,
+      }),
+    ));
+
+  const serviceType =
+    (await serviceTypeRepo.findOne({ where: { code: 'RAIL_CONTAINER' } })) ??
+    (await serviceTypeRepo.save(
+      serviceTypeRepo.create({
+        code: 'RAIL_CONTAINER',
+        serviceName: 'Rail Container Service',
+        description: 'Rail container service for gate-pass scenario seed',
+        canBeBookedAlone: true,
+        includesFirstMile: false,
+        includesLastMile: false,
+        includesCustoms: false,
+        priorityBonusPoints: 0,
+        isActive: true,
+        displayOrder: 1,
+      }),
+    ));
+
+  const containerType =
+    (await containerTypeRepo.findOne({ where: { code: '40FT' } })) ??
+    (await containerTypeRepo.findOne({ where: { isActive: true } })) ??
+    (await containerTypeRepo.save(
+      containerTypeRepo.create({
+        code: '40FT',
+        label: '40FT',
+        sizeFt: 40,
+        wagonsPerUnit: 1,
+        isReefer: false,
+        isOpenTop: false,
+        isActive: true,
+        displayOrder: 1,
+      }),
+    ));
+
+  const wagonType =
+    (await wagonTypeRepo.findOne({ where: { code: 'GP-FLAT' } })) ??
+    (await wagonTypeRepo.findOne({ where: { supportsContainer: true } })) ??
+    (await wagonTypeRepo.findOne({ where: { isActive: true } })) ??
+    (await wagonTypeRepo.save(
+      wagonTypeRepo.create({
+        code: 'GP-FLAT',
+        name: 'Gate Pass Demo Flat Wagon',
+        capacityTons: 70,
+        lengthMeters: 14,
+        maxWagonsPerTrain: 53,
+        supportedLoadTypes: ['CONTAINER'],
+        isActive: true,
+        equatedLengthM: 14,
+        tareWeightTons: 20,
+        supportsContainer: true,
+        maxContainerGrossT: 70,
+      }),
+    ));
+
+  const company =
+    (await companyRepo.findOne({ where: { tin: 'GTPASS001' } })) ??
+    (await companyRepo.save(
+      companyRepo.create({
+        name: 'Gate Pass Scenario Customer',
+        type: CompanyType.Customer,
+        kind: CompanyKind.Commercial,
+        status: CompanyStatus.Active,
+        tin: 'GTPASS001',
+        vatNumber: 'GTPASS001',
+        fanNumber: 'GTPASS0000001',
+        country: 'Ethiopia',
+        address: 'Indode Dry Port',
+        phone: '251900000555',
+        email: 'gate-pass-scenarios@edr.local',
+        contactPersonName: 'Gate Pass Tester',
+        contactPersonPhone: '251900000555',
+      }),
+    ));
+
+  const importerProfile = await ensureProfile(profileRepo, company.id, ProfileType.importer, 'GP-IMP');
+  const exporterProfile = await ensureProfile(profileRepo, company.id, ProfileType.exporter, 'GP-EXP');
+
+  const warehouse =
+    (await warehouseRepo.findOne({ where: { code: 'INDODE_OPEN' } })) ??
+    (await warehouseRepo.findOne({ where: {} }));
+  if (!warehouse) {
+    throw new Error('No warehouse found. Run the Indode/warehouse seed before gate-pass scenarios.');
+  }
+  const warehouseYard = await warehouseYardRepo.findOne({ where: { warehouseId: warehouse.id } });
+  if (!warehouseYard) {
+    throw new Error(`No warehouse yard found for ${warehouse.code ?? warehouse.id}.`);
+  }
+  const warehouseZone = await warehouseZoneRepo.findOne({ where: { yardId: warehouseYard.id } });
+  if (!warehouseZone) {
+    throw new Error(`No warehouse zone found for yard ${warehouseYard.id}.`);
+  }
+
+  return {
+    djiboutiYard,
+    ethiopiaYard,
+    serviceType,
+    containerType,
+    wagonType,
+    company,
+    importerProfile,
+    exporterProfile,
+    warehouse,
+    warehouseYard,
+    warehouseZone,
+  };
+}
+
+async function ensureProfile(repo: any, companyId: string, type: ProfileType, reference: string): Promise<CompanyProfile> {
+  const existing = await repo.findOne({ where: { companyId, type } });
+  if (existing) return existing;
+  return repo.save(
+    repo.create({
+      companyId,
+      type,
+      reference,
+      status: ProfileStatus.Active,
+      businessLicense: `${reference}-LICENSE`,
+    }),
+  );
+}
+
+async function seedScenarioTrain(manager: any, scenario: ScenarioTrain, refs: Awaited<ReturnType<typeof ensureReferences>>, now: Date) {
+  const locomotiveRepo = manager.getRepository(Locomotive);
+  const trainSetRepo = manager.getRepository(TrainSet);
+  const scheduleRepo = manager.getRepository(TrainSchedule);
+  const trainSetWagonRepo = manager.getRepository(TrainSetWagon);
+  const wagonRepo = manager.getRepository(Wagon);
+
+  const departure = addHours(now, scenario.departureOffsetHours);
+  const arrival = addHours(now, scenario.arrivalOffsetHours);
+  const isArrived = scenario.status === 'ARRIVED';
+  const originYard = scenario.direction === 'IMPORT' ? refs.djiboutiYard : refs.ethiopiaYard;
+  const destinationYard = scenario.direction === 'IMPORT' ? refs.ethiopiaYard : refs.djiboutiYard;
+  const totalWeightTons = scenario.bookings.reduce((sum, booking) => sum + booking.weightTons, 0);
+
+  const locomotive =
+    (await locomotiveRepo.findOne({ where: { code: 'GP-DEMO-LOCO' } })) ??
+    (await locomotiveRepo.save(
+      locomotiveRepo.create({
+        code: 'GP-DEMO-LOCO',
+        name: 'Gate Pass Scenario Locomotive',
+        locomotiveType: 'DIESEL',
+        maxPullWeightTons: 4200,
+        maxTrainLengthMeters: 760,
+        status: 'AVAILABLE',
+        currentYardId: originYard.id,
+      }),
+    ));
+
+  let schedule = await scheduleRepo.findOne({ where: { trainNumber: scenario.trainNumber } });
+  let trainSet: TrainSet | null = schedule?.trainSetId
+    ? await trainSetRepo.findOne({ where: { id: schedule.trainSetId } })
+    : null;
+
+  if (!trainSet) {
+    trainSet = await trainSetRepo.save(
+      trainSetRepo.create({
+        locomotiveId: locomotive.id,
+        totalWeightTons,
+        totalLengthMeters: scenario.bookings.length * 14,
+        wagonCount: scenario.bookings.length,
+        status: isArrived ? 'COMPLETED' : 'ASSIGNED',
+      }),
+    );
+  } else {
+    await trainSetRepo.update(trainSet.id, {
+      locomotiveId: locomotive.id,
+      totalWeightTons,
+      totalLengthMeters: scenario.bookings.length * 14,
+      wagonCount: scenario.bookings.length,
+      status: isArrived ? 'COMPLETED' : 'ASSIGNED',
+    });
+  }
+  if (!trainSet) {
+    throw new Error(`Could not create train set for ${scenario.trainNumber}`);
+  }
+  const trainSetId = trainSet.id;
+
+  if (!schedule) {
+    schedule = scheduleRepo.create({ trainNumber: scenario.trainNumber });
+  }
+  Object.assign(schedule, {
+    trainSetId,
+    originStationId: originYard.id,
+    destinationStationId: destinationYard.id,
+    scheduledDepartureDate: departure,
+    scheduledArrivalDate: arrival,
+    actualDepartureAt: isArrived ? departure : null,
+    actualArrivalAt: isArrived ? arrival : null,
+    status: scenario.status,
+    direction: scenario.direction,
+    maxWagons: 53,
+    bookingWindowStatus: 'CLOSED',
+  });
+  schedule = await scheduleRepo.save(schedule);
+
+  for (const [index, bookingSpec] of scenario.bookings.entries()) {
+    const sequenceNo = index + 1;
+    const wagon = await ensureWagon(manager, scenario, sequenceNo, refs.wagonType.id, originYard.id, schedule.id);
+    const trainSetWagon = await ensureTrainSetWagon(
+      trainSetWagonRepo,
+      trainSetId,
+      refs.wagonType.id,
+      wagon.id,
+      sequenceNo,
+      bookingSpec.weightTons,
+      isArrived,
+    );
+    await wagonRepo.update(wagon.id, { trainSetWagonId: trainSetWagon.id });
+
+    const booking = await ensureBooking(manager, scenario, bookingSpec, refs, departure, now, schedule.id);
+    const bookingContainer = await ensureBookingContainer(manager, booking.id, refs.containerType.id, bookingSpec);
+    const allocation = await ensureAllocation(manager, trainSetWagon.id, booking.id, bookingSpec.weightTons, isArrived, now);
+    const container = await ensureContainer(manager, booking.id, bookingContainer.id, allocation.id, wagon.id, sequenceNo, bookingSpec, refs.containerType.id, isArrived);
+    await ensureContainerItem(manager, allocation.id, bookingContainer.id, container.id, refs.containerType.id, sequenceNo, bookingSpec);
+    await ensureScheduleBooking(manager, schedule.id, booking.id);
+    if (scenario.direction === 'EXPORT') {
+      await ensureExportInventory(manager, refs, booking.id, container.id, bookingSpec.weightTons, isArrived, now);
+    }
+  }
+
+  if (scenario.direction === 'IMPORT') {
+    await ensureImportOperation(manager, schedule.id, scenario, departure, isArrived);
+  }
+
+  return schedule;
+}
+
+async function ensureWagon(manager: any, scenario: ScenarioTrain, sequenceNo: number, wagonTypeId: string, yardId: string, scheduleId: string): Promise<Wagon> {
+  const repo = manager.getRepository(Wagon);
+  const wagonNumber = `${scenario.trainNumber}-W${String(sequenceNo).padStart(2, '0')}`;
+  const existing = await repo.findOne({ where: { wagonNumber } });
+  const values = {
+    wagonNumber,
+    wagonTypeId,
+    trainId: null,
+    sequenceNumber: sequenceNo,
+    tareWeight: 20,
+    maxPayloadWeight: 70,
+    status: WagonStatus.Assigned,
+    currentYardId: yardId,
+    currentTrainScheduleId: scheduleId,
+    notes: 'Gate-pass scenario seed wagon',
+  };
+  return repo.save(repo.create({ ...(existing ?? {}), ...values }));
+}
+
+async function ensureTrainSetWagon(repo: any, trainSetId: string, wagonTypeId: string, wagonId: string, sequenceNo: number, weightTons: number, isArrived: boolean): Promise<TrainSetWagon> {
+  const existing = await repo.findOne({ where: { trainSetId, sequenceNo } });
+  return repo.save(
+    repo.create({
+      ...(existing ?? {}),
+      trainSetId,
+      wagonTypeId,
+      physicalWagonId: wagonId,
+      sequenceNo,
+      capacityTons: 70,
+      lengthMeters: 14,
+      assignedWeightTons: weightTons,
+      status: isArrived ? 'DEPARTED' : 'LOADED',
+    }),
+  );
+}
+
+async function ensureBooking(manager: any, scenario: ScenarioTrain, bookingSpec: ScenarioTrain['bookings'][number], refs: Awaited<ReturnType<typeof ensureReferences>>, departure: Date, now: Date, scheduleId: string): Promise<Booking> {
+  const repo = manager.getRepository(Booking);
+  const originYard = scenario.direction === 'IMPORT' ? refs.djiboutiYard : refs.ethiopiaYard;
+  const destinationYard = scenario.direction === 'IMPORT' ? refs.ethiopiaYard : refs.djiboutiYard;
+  const existing = await repo.findOne({ where: { reference: bookingSpec.reference } });
+  const profile = scenario.direction === 'IMPORT' ? refs.importerProfile : refs.exporterProfile;
+  const hasFirstMile = bookingSpec.mileVariant === 'FIRST_MILE';
+  const hasLastMile = bookingSpec.mileVariant === 'LAST_MILE';
+
+  return repo.save(
+    repo.create({
+      ...(existing ?? {}),
+      reference: bookingSpec.reference,
+      companyId: refs.company.id,
+      companyProfileId: profile.id,
+      originYardId: originYard.id,
+      destinationYardId: destinationYard.id,
+      serviceTypeId: refs.serviceType.id,
+      status: scenario.status === 'ARRIVED' ? 'IN_TRANSIT' : 'PAID',
+      paymentStatus: 'PAID',
+      scheduledDate: departure,
+      estimatedShipmentDate: departure,
+      contractType: 'SPOT',
+      equipmentReturn: 'TERMINAL',
+      paymentCurrency: 'ETB',
+      totalAmount: 0,
+      isGovernment: false,
+      tradeDirection: scenario.direction,
+      freightType: 'CONTAINER',
+      cargoTypeId: null,
+      cargoFreeText: `${scenario.direction} gate-pass scenario ${bookingSpec.mileVariant.toLowerCase().replace('_', ' ')}`,
+      cargoTotalWeightVgm: bookingSpec.weightTons * 1000,
+      firstMilePickupAddress: hasFirstMile ? 'Customer factory pickup - Addis Ababa' : null,
+      firstMilePickupLat: hasFirstMile ? 9.03 : null,
+      firstMilePickupLng: hasFirstMile ? 38.74 : null,
+      lastMileDeliveryAddress: hasLastMile ? 'Customer warehouse delivery - Addis Ababa' : null,
+      lastMileDeliveryLat: hasLastMile ? 8.98 : null,
+      lastMileDeliveryLng: hasLastMile ? 38.8 : null,
+      trainScheduleId: scheduleId,
+      schedulingStatus: scenario.status === 'ARRIVED' ? 'DISPATCHED' : 'SCHEDULED',
+      scheduledAt: now,
+      wagonsRequired: 1,
+    }),
+  );
+}
+
+async function ensureBookingContainer(manager: any, bookingId: string, containerTypeId: string, bookingSpec: ScenarioTrain['bookings'][number]): Promise<BookingContainer> {
+  const repo = manager.getRepository(BookingContainer);
+  const existing = await repo.findOne({ where: { bookingId } });
+  return repo.save(
+    repo.create({
+      ...(existing ?? {}),
+      bookingId,
+      containerTypeId,
+      containerNumber: bookingSpec.containerNumber,
+      containerSize: '40',
+      quantity: 1,
+      hazardousQuantity: 0,
+      reeferQuantity: 0,
+      vgmPerUnitTons: bookingSpec.weightTons,
+      totalVgmTons: bookingSpec.weightTons,
+      wagonsRequired: 1,
+      weightLimitRuleId: null,
+      isOverweight: false,
+      overweightExcessTons: null,
+    }),
+  );
+}
+
+async function ensureAllocation(manager: any, trainSetWagonId: string, bookingId: string, weightTons: number, isArrived: boolean, now: Date): Promise<WagonBookingAllocation> {
+  const repo = manager.getRepository(WagonBookingAllocation);
+  const existing = await repo.findOne({ where: { trainSetWagonId, bookingId } });
+  return repo.save(
+    repo.create({
+      ...(existing ?? {}),
+      trainSetWagonId,
+      bookingId,
+      allocatedWeightTons: weightTons,
+      loadType: 'CONTAINER',
+      status: isArrived ? 'DEPARTED' : 'LOADED',
+      confirmedAt: now,
+    }),
+  );
+}
+
+async function ensureContainer(manager: any, bookingId: string, bookingContainerId: string, allocationId: string, wagonId: string, position: number, bookingSpec: ScenarioTrain['bookings'][number], containerTypeId: string, isArrived: boolean): Promise<Container> {
+  const repo = manager.getRepository(Container);
+  const existing = await repo.findOne({ where: { containerNumber: bookingSpec.containerNumber } });
+  return repo.save(
+    repo.create({
+      ...(existing ?? {}),
+      containerNumber: bookingSpec.containerNumber,
+      containerTypeId,
+      wagonId,
+      position,
+      tareWeight: 3800,
+      maxGrossWeight: 30480,
+      sealNumber: `SEAL-${bookingSpec.containerNumber}`,
+      status: isArrived ? 'IN_TRANSIT' : 'LOADED',
+      bookingId,
+      wagonBookingAllocationId: allocationId,
+      bookingContainerId,
+    }),
+  );
+}
+
+async function ensureContainerItem(manager: any, allocationId: string, bookingContainerId: string, containerId: string, containerTypeId: string, position: number, bookingSpec: ScenarioTrain['bookings'][number]): Promise<void> {
+  const repo = manager.getRepository(WagonAllocationContainerItem);
+  await repo.delete({ wagonBookingAllocationId: allocationId });
+  await repo.save(
+    repo.create({
+      wagonBookingAllocationId: allocationId,
+      bookingContainerId,
+      containerId,
+      containerNumber: bookingSpec.containerNumber,
+      containerTypeId,
+      positionOnWagon: position,
+      sealNumber: `SEAL-${bookingSpec.containerNumber}`,
+      chassisNumber: `CHS-${bookingSpec.containerNumber}`,
+      grossWeightTons: bookingSpec.weightTons,
+    }),
+  );
+}
+
+async function ensureScheduleBooking(manager: any, scheduleId: string, bookingId: string): Promise<void> {
+  const repo = manager.getRepository(TrainScheduleBooking);
+  const existing = await repo.findOne({ where: { bookingId } });
+  await repo.save(repo.create({ ...(existing ?? {}), trainScheduleId: scheduleId, bookingId }));
+}
+
+async function ensureExportInventory(manager: any, refs: Awaited<ReturnType<typeof ensureReferences>>, bookingId: string, containerId: string, weightTons: number, isArrived: boolean, now: Date): Promise<void> {
+  const repo = manager.getRepository(WarehouseInventory);
+  const existing = await repo.findOne({ where: { bookingId } });
+  await repo.save(
+    repo.create({
+      ...(existing ?? {}),
+      warehouseId: refs.warehouse.id,
+      yardId: refs.warehouseYard.id,
+      zoneId: refs.warehouseZone.id,
+      bookingId,
+      containerId,
+      quantity: 1,
+      weight: weightTons * 1000,
+      status: 'LOADED',
+      inspectionStatus: 'PASSED',
+      arrivedAt: addHours(now, -24),
+      inspectedAt: addHours(now, -22),
+      readyForLoadingAt: addHours(now, -20),
+      loadedAt: isArrived ? addHours(now, -16) : null,
+      notes: '[GP-SCENARIO] Export train gate-pass scenario inventory',
+    }),
+  );
+}
+
+async function ensureImportOperation(manager: any, scheduleId: string, scenario: ScenarioTrain, departure: Date, isArrived: boolean): Promise<void> {
+  const repo = manager.getRepository(ImportDjiboutiOperation);
+  const existing = await repo.findOne({ where: { trainScheduleId: scheduleId } });
+  await repo.save(
+    repo.create({
+      ...(existing ?? {}),
+      trainScheduleId: scheduleId,
+      documents: existing?.documents ?? {},
+      gatepassGrantedAt: null,
+      readyForLoadingAt: null,
+      loadedOnTrainAt: null,
+      departedFromDjiboutiAt: isArrived ? departure : null,
+      loadListGeneratedAt: null,
+      performedBy: 'Gate Pass Scenario Seeder',
+      notes: `[GP-SCENARIO] ${scenario.trainNumber}; fill gate-pass dates during testing`,
+    }),
+  );
+}
+
+main().catch((error) => {
+  console.error('Gate-pass train scenario seed failed:', error);
+  process.exit(1);
+});
diff --git a/apps/edr-freight-api/src/seed/demo-bookings.seeder.ts b/apps/edr-freight-api/src/seed/demo-bookings.seeder.ts
index 9670243c9..a619c7c05 100644
--- a/apps/edr-freight-api/src/seed/demo-bookings.seeder.ts
+++ b/apps/edr-freight-api/src/seed/demo-bookings.seeder.ts
@@ -468,15 +468,15 @@ export class DemoBookingsSeeder {
       const djibouti = yardByCode.get("DJIBOUTI");
       const addis = yardByCode.get("ADDIS_ABABA");
       if (djibouti && addis) {
-        const routeName = "Djibouti → Addis Ababa";
-        let route = await manager.getRepository(Route).findOneBy({ name: routeName });
+        let route = await manager.getRepository(Route).findOne({
+          where: { originYardId: djibouti.id, destinationYardId: addis.id },
+        });
         if (!route) {
           route = await manager.getRepository(Route).save(
             manager.getRepository(Route).create({
-              name: routeName,
               originYardId: djibouti.id,
               destinationYardId: addis.id,
-              isActive: true,
+              status: 'AVAILABLE',
             }),
           );
           await manager.getRepository(RouteMilestone).save([
@@ -484,11 +484,13 @@ export class DemoBookingsSeeder {
               routeId: route.id,
               yardId: djibouti.id,
               sequenceNo: 1,
+              distanceKm: 0,
             }),
             manager.getRepository(RouteMilestone).create({
               routeId: route.id,
               yardId: addis.id,
               sequenceNo: 2,
+              distanceKm: 780,
             }),
           ]);
         }
diff --git a/apps/edr-freight-api/src/seed/freight-permissions.registry.ts b/apps/edr-freight-api/src/seed/freight-permissions.registry.ts
index ba0d6da19..56ca98626 100644
--- a/apps/edr-freight-api/src/seed/freight-permissions.registry.ts
+++ b/apps/edr-freight-api/src/seed/freight-permissions.registry.ts
@@ -80,6 +80,9 @@ export const CONTRACT_PERMISSIONS: FreightPermissionSeed[] = [
   perm('a3000001-0001-4000-8000-00000000000b', 'edr_freight_app:contracts:finalize_clearance', 'Finalize pre-booking clearance'),
   perm('a3000001-0001-4000-8000-00000000000c', 'edr_freight_app:contracts:create_booking', 'GL ET create booking under contract'),
   perm('a3000001-0001-4000-8000-00000000000d', 'edr_freight_app:contracts:ops_clearance_review', 'Operations review of self-clearance docs (Path A)'),
+  perm('a3000001-0001-4000-8000-00000000000e', 'edr_freight_app:contracts:clearance_et_actions', 'GL Ethiopia phased clearance actions'),
+  perm('a3000001-0001-4000-8000-00000000000f', 'edr_freight_app:contracts:clearance_dj_actions', 'GL Djibouti phased clearance actions'),
+  perm('a3000001-0001-4000-8000-000000000010', 'edr_freight_app:contracts:clearance_duty_advise', 'Advise contract duty/tax'),
 ];
 
 const RULE_ENGINE_PERMISSION_IDS: Record<RuleEngineResourceSlug, { view: string; manage: string }> = {
@@ -149,6 +152,9 @@ export const FREIGHT_PERMS = {
     finalizeClearance: 'edr_freight_app:contracts:finalize_clearance',
     createBooking: 'edr_freight_app:contracts:create_booking',
     opsClearanceReview: 'edr_freight_app:contracts:ops_clearance_review',
+    clearanceEtActions: 'edr_freight_app:contracts:clearance_et_actions',
+    clearanceDjActions: 'edr_freight_app:contracts:clearance_dj_actions',
+    clearanceDutyAdvise: 'edr_freight_app:contracts:clearance_duty_advise',
   },
   trainScheduling: {
     view: 'edr_freight_app:train_scheduling:view',
@@ -237,6 +243,8 @@ export const ROLE_PERMISSION_PRESETS = {
     FREIGHT_PERMS.contracts.clearanceReview,
     FREIGHT_PERMS.contracts.finalizeClearance,
     FREIGHT_PERMS.contracts.createBooking,
+    FREIGHT_PERMS.contracts.clearanceEtActions,
+    FREIGHT_PERMS.contracts.clearanceDutyAdvise,
     FREIGHT_PERMS.bookings.clearanceView,
     FREIGHT_PERMS.bookings.reviewDocuments,
     FREIGHT_PERMS.bookings.uploadClearanceOutput,
@@ -247,6 +255,7 @@ export const ROLE_PERMISSION_PRESETS = {
   // damage reports. Read-only on the contract; no booking creation.
   glDjibouti: [
     FREIGHT_PERMS.contracts.view,
+    FREIGHT_PERMS.contracts.clearanceDjActions,
     FREIGHT_PERMS.bookings.clearanceView,
     FREIGHT_PERMS.bookings.uploadClearanceOutput,
     FREIGHT_PERMS.bookings.operations,
diff --git a/apps/edr-freight-api/src/seed/paid-indode-demo-bookings.seeder.ts b/apps/edr-freight-api/src/seed/paid-indode-demo-bookings.seeder.ts
new file mode 100644
index 000000000..e33baa7fd
--- /dev/null
+++ b/apps/edr-freight-api/src/seed/paid-indode-demo-bookings.seeder.ts
@@ -0,0 +1,1131 @@
+import { Injectable, Logger } from '@nestjs/common';
+import { CargoUnitOfMeasure, TrainScheduleStatus, WagonStatus } from '@edr/types';
+import { randomUUID } from 'crypto';
+import { DataSource, EntityManager, In } from 'typeorm';
+
+import { BookingContainer } from '../modules/bookings/entities/booking-container.entity';
+import { Booking } from '../modules/bookings/entities/booking.entity';
+import {
+  Company,
+  CompanyKind,
+  CompanyNationality,
+  CompanyStatus,
+  CompanyType,
+} from '../modules/companies/entities/company.entity';
+import {
+  CompanyProfile,
+  ProfileStatus,
+  ProfileType,
+} from '../modules/companies/entities/company-profile.entity';
+import { FirstMile } from '../modules/first-mile/entities/first-mile.entity';
+import { LastMile } from '../modules/last-mile/entities/last-mile.entity';
+import { Locomotive } from '../modules/locomotives/entities/locomotive.entity';
+import { CargoType } from '../modules/rule-engine/entities/cargo-type.entity';
+import { ContainerType } from '../modules/rule-engine/entities/container-type.entity';
+import { ServiceType } from '../modules/rule-engine/entities/service-type.entity';
+import { Yard } from '../modules/rule-engine/entities/yard.entity';
+import { WagonAllocationContainerItem } from '../modules/train-schedules/entities/wagon-allocation-container-item.entity';
+import { WagonBookingAllocation } from '../modules/train-schedules/entities/wagon-booking-allocation.entity';
+import { TrainSchedule } from '../modules/train-schedules/entities/train-schedule.entity';
+import { TrainScheduleBooking } from '../modules/train-schedules/entities/train-schedule-booking.entity';
+import { TrainSetWagon } from '../modules/train-sets/entities/train-set-wagon.entity';
+import { TrainSet } from '../modules/train-sets/entities/train-set.entity';
+import { ImportDjiboutiOperation } from '../modules/train-scheduling/entities/import-djibouti-operation.entity';
+import { WagonType } from '../modules/wagon-types/entities/wagon-type.entity';
+import { Wagon } from '../modules/wagons/entities/wagon.entity';
+import { WarehouseInventory } from '../modules/warehouses/entities/warehouse-inventory.entity';
+import { WarehouseActivityLog } from '../modules/warehouses/entities/warehouse-activity-log.entity';
+import { Warehouse } from '../modules/warehouses/entities/warehouse.entity';
+import { WarehouseYard } from '../modules/warehouses/entities/warehouse-yard.entity';
+import { WarehouseZone } from '../modules/warehouses/entities/warehouse-zone.entity';
+import { Driver, DriverStatus } from '../modules/drivers/entities/driver.entity';
+import { FuelType, Vehicle, VehicleStatus, VehicleType } from '../modules/vehicles/entities/vehicle.entity';
+
+const CUSTOMER_TIN = 'US12DEMO01';
+
+const DEMO_TRAINS = [
+  {
+    trainNumber: 'US12-DJI-IND-01',
+    direction: 'IMPORT',
+    originCode: 'NAGAD',
+    destinationCode: 'INDODE',
+    departureHoursAgo: 30,
+    arrivalHoursAgo: 14,
+  },
+  {
+    trainNumber: 'US12-IND-DJI-01',
+    direction: 'EXPORT',
+    originCode: 'INDODE',
+    destinationCode: 'NAGAD',
+    departureHoursAgo: 28,
+    arrivalHoursAgo: 12,
+  },
+  {
+    trainNumber: 'US12-DJI-IND-LM-02',
+    direction: 'IMPORT',
+    originCode: 'NAGAD',
+    destinationCode: 'INDODE',
+    departureHoursAgo: 24,
+    arrivalHoursAgo: 8,
+  },
+  {
+    trainNumber: 'US12-IND-DJI-LM-02',
+    direction: 'EXPORT',
+    originCode: 'INDODE',
+    destinationCode: 'NAGAD',
+    departureHoursAgo: 22,
+    arrivalHoursAgo: 6,
+  },
+] as const;
+
+const TRAIN_DEMO_BOOKINGS = [
+  {
+    reference: 'US12-IMP-FM-001',
+    trainNumber: 'US12-DJI-IND-01',
+    tradeDirection: 'IMPORT',
+    freightType: 'CONTAINER',
+    withFirstMile: true,
+    withLastMile: true,
+    containerCode: '40FT',
+    cargoCode: 'GENERAL_CARGO',
+    weightTons: 27,
+    totalAmount: 18450,
+    pickupAddress: 'Doraleh Container Terminal, Djibouti',
+    pickupLat: 11.5881,
+    pickupLng: 43.1372,
+    deliveryAddress: 'Indode bonded warehouse gate, Ethiopia',
+    deliveryLat: 8.7566,
+    deliveryLng: 38.9846,
+  },
+  {
+    reference: 'US12-IMP-NOFM-001',
+    trainNumber: 'US12-DJI-IND-01',
+    tradeDirection: 'IMPORT',
+    freightType: 'BULK',
+    withFirstMile: false,
+    withLastMile: false,
+    containerCode: null,
+    cargoCode: 'BULK',
+    weightTons: 42,
+    totalAmount: 22100,
+    pickupAddress: null,
+    pickupLat: null,
+    pickupLng: null,
+    deliveryAddress: null,
+    deliveryLat: null,
+    deliveryLng: null,
+  },
+  {
+    reference: 'US12-EXP-FM-001',
+    trainNumber: 'US12-IND-DJI-01',
+    tradeDirection: 'EXPORT',
+    freightType: 'CONTAINER',
+    withFirstMile: true,
+    withLastMile: true,
+    containerCode: '20FT',
+    cargoCode: 'GENERAL_CARGO',
+    weightTons: 19,
+    totalAmount: 15680,
+    pickupAddress: 'Indode export truck gate, Ethiopia',
+    pickupLat: 8.7566,
+    pickupLng: 38.9846,
+    deliveryAddress: 'Nagad Terminal customer handover yard, Djibouti',
+    deliveryLat: 11.5536,
+    deliveryLng: 43.1103,
+  },
+  {
+    reference: 'US12-EXP-NOFM-001',
+    trainNumber: 'US12-IND-DJI-01',
+    tradeDirection: 'EXPORT',
+    freightType: 'BULK',
+    withFirstMile: false,
+    withLastMile: false,
+    containerCode: null,
+    cargoCode: 'BULK',
+    weightTons: 55,
+    totalAmount: 29800,
+    pickupAddress: null,
+    pickupLat: null,
+    pickupLng: null,
+    deliveryAddress: null,
+    deliveryLat: null,
+    deliveryLng: null,
+  },
+  {
+    reference: 'US12-IMP-LM-TRAIN-001',
+    trainNumber: 'US12-DJI-IND-LM-02',
+    tradeDirection: 'IMPORT',
+    freightType: 'CONTAINER',
+    withFirstMile: false,
+    withLastMile: true,
+    containerCode: '40FT',
+    cargoCode: 'GENERAL_CARGO',
+    weightTons: 31,
+    totalAmount: 20300,
+    pickupAddress: null,
+    pickupLat: null,
+    pickupLng: null,
+    deliveryAddress: 'Indode last-mile customer delivery bay, Ethiopia',
+    deliveryLat: 8.7581,
+    deliveryLng: 38.9834,
+  },
+  {
+    reference: 'US12-EXP-LM-TRAIN-001',
+    trainNumber: 'US12-IND-DJI-LM-02',
+    tradeDirection: 'EXPORT',
+    freightType: 'CONTAINER',
+    withFirstMile: false,
+    withLastMile: true,
+    containerCode: '20FT',
+    cargoCode: 'GENERAL_CARGO',
+    weightTons: 21,
+    totalAmount: 17600,
+    pickupAddress: null,
+    pickupLat: null,
+    pickupLng: null,
+    deliveryAddress: 'Nagad last-mile consignee handover yard, Djibouti',
+    deliveryLat: 11.5549,
+    deliveryLng: 43.1121,
+  },
+] as const;
+
+const CUSTOMER_TRUCK_DEMO_BOOKINGS = [
+  {
+    reference: 'US12-EXP-FM-TRUCK-001',
+    trainNumber: null,
+    originCode: 'INDODE',
+    destinationCode: 'NAGAD',
+    tradeDirection: 'EXPORT',
+    freightType: 'CONTAINER',
+    withFirstMile: true,
+    withLastMile: false,
+    containerCode: '40FT',
+    cargoCode: 'GENERAL_CARGO',
+    weightTons: 24,
+    totalAmount: 14800,
+    pickupAddress: 'Customer factory gate, Addis Ababa',
+    pickupLat: 8.9806,
+    pickupLng: 38.8736,
+    deliveryAddress: null,
+    deliveryLat: null,
+    deliveryLng: null,
+  },
+  {
+    reference: 'US12-EXP-NOFM-TRUCK-001',
+    trainNumber: null,
+    originCode: 'INDODE',
+    destinationCode: 'NAGAD',
+    tradeDirection: 'EXPORT',
+    freightType: 'CONTAINER',
+    withFirstMile: false,
+    withLastMile: false,
+    containerCode: '20FT',
+    cargoCode: 'GENERAL_CARGO',
+    weightTons: 18,
+    totalAmount: 11200,
+    pickupAddress: null,
+    pickupLat: null,
+    pickupLng: null,
+    deliveryAddress: null,
+    deliveryLat: null,
+    deliveryLng: null,
+    customerTruckPlateNumber: 'ET-CUS-2046',
+    customerTruckDriverName: 'Dawit Customer Carrier',
+    customerTruckType: 'Container Chassis',
+    customerTruckContainerNumber: 'USDU1234567',
+  },
+] as const;
+
+const DEMO_BOOKINGS = [...TRAIN_DEMO_BOOKINGS, ...CUSTOMER_TRUCK_DEMO_BOOKINGS] as const;
+
+@Injectable()
+export class PaidIndodeDemoBookingsSeeder {
+  private readonly logger = new Logger(PaidIndodeDemoBookingsSeeder.name);
+
+  constructor(private readonly dataSource: DataSource) {}
+
+  async run(): Promise<void> {
+    try {
+      await this.dataSource.transaction(async (manager) => {
+        const refs = await this.ensureReferenceData(manager);
+        const schedules = await this.ensureArrivedTrains(manager, refs);
+        const bookings = await this.ensureBookings(manager, refs, schedules);
+        await this.ensureTrainLinks(manager, refs, schedules, bookings);
+        await this.ensureGatepasses(manager, schedules);
+        await this.ensureImportWarehouseInventory(manager, bookings);
+      });
+
+      this.logger.log(
+        `US12 paid Indode demo bookings ready: ${DEMO_BOOKINGS.length} booking(s), ${DEMO_TRAINS.length} arrived train(s)`,
+      );
+    } catch (error) {
+      this.logger.error(
+        `PaidIndodeDemoBookingsSeeder failed: ${error instanceof Error ? error.message : String(error)}`,
+      );
+    }
+  }
+
+  private async ensureReferenceData(manager: EntityManager) {
+    await manager.getRepository(Yard).upsert(
+      [
+        {
+          code: 'INDODE',
+          label: 'Indode Terminal',
+          country: 'Ethiopia',
+          isActive: true,
+          displayOrder: 1,
+        },
+        {
+          code: 'NAGAD',
+          label: 'Nagad Terminal, Djibouti',
+          country: 'Djibouti',
+          isActive: true,
+          displayOrder: 2,
+        },
+      ],
+      { conflictPaths: { code: true } },
+    );
+
+    await manager.getRepository(ServiceType).upsert(
+      [
+        {
+          code: 'RAIL_CONTAINER_FIRST_LAST',
+          serviceName: 'Rail Freight with First and Last Mile',
+          description: 'Rail movement with first-mile pickup and last-mile delivery',
+          canBeBookedAlone: true,
+          includesFirstMile: true,
+          includesLastMile: true,
+          includesCustoms: false,
+          priorityBonusPoints: 15,
+          isActive: true,
+          displayOrder: 3,
+        },
+        {
+          code: 'RAIL_CONTAINER_LAST_MILE',
+          serviceName: 'Rail Freight with Last Mile',
+          description: 'Rail movement with last-mile delivery from terminal',
+          canBeBookedAlone: true,
+          includesFirstMile: false,
+          includesLastMile: true,
+          includesCustoms: false,
+          priorityBonusPoints: 8,
+          isActive: true,
+          displayOrder: 4,
+        },
+        {
+          code: 'RAIL_CONTAINER',
+          serviceName: 'Rail Freight',
+          description: 'Rail movement without first-mile pickup',
+          canBeBookedAlone: true,
+          includesFirstMile: false,
+          includesLastMile: false,
+          includesCustoms: false,
+          priorityBonusPoints: 0,
+          isActive: true,
+          displayOrder: 1,
+        },
+        {
+          code: 'RAIL_CONTAINER_FIRST_MILE',
+          serviceName: 'Rail Freight with First Mile',
+          description: 'Rail movement with first-mile pickup to terminal',
+          canBeBookedAlone: true,
+          includesFirstMile: true,
+          includesLastMile: false,
+          includesCustoms: false,
+          priorityBonusPoints: 10,
+          isActive: true,
+          displayOrder: 2,
+        },
+      ],
+      { conflictPaths: { code: true } },
+    );
+
+    await manager.getRepository(ContainerType).upsert(
+      [
+        {
+          code: '20FT',
+          label: '20FT Standard',
+          sizeFt: 20,
+          wagonsPerUnit: 1,
+          isReefer: false,
+          isOpenTop: false,
+          isActive: true,
+          displayOrder: 1,
+        },
+        {
+          code: '40FT',
+          label: '40FT Standard',
+          sizeFt: 40,
+          wagonsPerUnit: 1,
+          isReefer: false,
+          isOpenTop: false,
+          isActive: true,
+          displayOrder: 2,
+        },
+      ],
+      { conflictPaths: { code: true } },
+    );
+
+    await manager.getRepository(CargoType).upsert(
+      [
+        {
+          code: 'GENERAL_CARGO',
+          cargoTypeName: 'General Cargo',
+          showFreeTextBox: true,
+          unitOfMeasure: null,
+          requiresDirectorApproval: false,
+          isActive: true,
+          displayOrder: 1,
+        },
+        {
+          code: 'BULK',
+          cargoTypeName: 'Bulk Cargo',
+          showFreeTextBox: true,
+          unitOfMeasure: CargoUnitOfMeasure.PerTon,
+          requiresDirectorApproval: false,
+          isActive: true,
+          displayOrder: 2,
+        },
+      ],
+      { conflictPaths: { code: true } },
+    );
+
+    await manager.getRepository(WagonType).upsert(
+      {
+        code: 'US12-DEMO',
+        name: 'US12 Demo Flat/Bulk Wagon',
+        capacityTons: 70,
+        lengthMeters: 14,
+        maxWagonsPerTrain: 53,
+        supportedLoadTypes: ['CONTAINER', 'BULK'],
+        isActive: true,
+        equatedLengthM: 14,
+        tareWeightTons: 14,
+        supportsContainer: true,
+        maxContainerGrossT: 40,
+      },
+      { conflictPaths: { code: true } },
+    );
+
+    await manager.getRepository(Company).upsert(
+      {
+        name: 'US12 Indode Demo Customer PLC',
+        type: CompanyType.Customer,
+        kind: CompanyKind.Commercial,
+        status: CompanyStatus.Active,
+        tin: CUSTOMER_TIN,
+        vatNumber: 'VAT-US12-001',
+        fanNumber: 'US12000000000001',
+        country: 'Ethiopia',
+        nationality: CompanyNationality.Ethiopian,
+        address: 'Bole Road, Addis Ababa, Ethiopia',
+        phone: '251911120012',
+        email: 'us12.indode.demo@edr.local',
+        website: 'https://edr.local/us12-demo',
+        contactPersonName: 'Aster Bekele',
+        contactPersonPhone: '251911120013',
+        generalManagerName: 'Mekonnen Desta',
+        generalManagerEmail: 'manager.us12.demo@edr.local',
+        generalManagerPhone: '251911120014',
+        licenceNumber: 'LIC-US12-2026',
+        region: 'Addis Ababa',
+        zone: 'Bole',
+        woreda: '03',
+        kebele: '12',
+        houseNo: 'US12-01',
+        attributes: {
+          seededBy: 'PaidIndodeDemoBookingsSeeder',
+          note: 'Paid customer with import/export demo bookings for US12.',
+        } as any,
+      },
+      { conflictPaths: { tin: true } },
+    );
+
+    const company = await manager.getRepository(Company).findOneByOrFail({ tin: CUSTOMER_TIN });
+    await manager.getRepository(CompanyProfile).upsert(
+      [
+        {
+          companyId: company.id,
+          type: ProfileType.importer,
+          reference: 'US12-IMP',
+          status: ProfileStatus.Active,
+          businessLicense: 'BL-US12-IMP-2026',
+          attributes: { seededBy: 'PaidIndodeDemoBookingsSeeder' } as any,
+        },
+        {
+          companyId: company.id,
+          type: ProfileType.exporter,
+          reference: 'US12-EXP',
+          status: ProfileStatus.Active,
+          businessLicense: 'BL-US12-EXP-2026',
+          attributes: { seededBy: 'PaidIndodeDemoBookingsSeeder' } as any,
+        },
+      ],
+      { conflictPaths: { reference: true } },
+    );
+
+    const [yards, serviceTypes, containerTypes, cargoTypes, wagonType, importerProfile, exporterProfile] =
+      await Promise.all([
+        manager.getRepository(Yard).find({ where: { code: In(['INDODE', 'NAGAD']) } }),
+        manager
+          .getRepository(ServiceType)
+          .find({
+            where: {
+              code: In([
+                'RAIL_CONTAINER',
+                'RAIL_CONTAINER_FIRST_MILE',
+                'RAIL_CONTAINER_LAST_MILE',
+                'RAIL_CONTAINER_FIRST_LAST',
+              ]),
+            },
+          }),
+        manager.getRepository(ContainerType).find({ where: { code: In(['20FT', '40FT']) } }),
+        manager.getRepository(CargoType).find({ where: { code: In(['GENERAL_CARGO', 'BULK']) } }),
+        manager.getRepository(WagonType).findOneByOrFail({ code: 'US12-DEMO' }),
+        manager.getRepository(CompanyProfile).findOneByOrFail({ reference: 'US12-IMP' }),
+        manager.getRepository(CompanyProfile).findOneByOrFail({ reference: 'US12-EXP' }),
+      ]);
+
+    return {
+      company,
+      importerProfile,
+      exporterProfile,
+      yards: new Map(yards.map((yard) => [yard.code, yard])),
+      serviceTypes: new Map(serviceTypes.map((serviceType) => [serviceType.code, serviceType])),
+      containerTypes: new Map(containerTypes.map((containerType) => [containerType.code, containerType])),
+      cargoTypes: new Map(cargoTypes.map((cargoType) => [cargoType.code, cargoType])),
+      wagonType,
+    };
+  }
+
+  private async ensureArrivedTrains(
+    manager: EntityManager,
+    refs: Awaited<ReturnType<PaidIndodeDemoBookingsSeeder['ensureReferenceData']>>,
+  ): Promise<Map<string, TrainSchedule>> {
+    const schedules = new Map<string, TrainSchedule>();
+    const now = new Date();
+
+    for (const demo of DEMO_TRAINS) {
+      const origin = refs.yards.get(demo.originCode);
+      const destination = refs.yards.get(demo.destinationCode);
+      if (!origin || !destination) {
+        throw new Error(`US12 demo train missing yard: ${demo.trainNumber}`);
+      }
+
+      const departure = this.addHours(now, -demo.departureHoursAgo);
+      const arrival = this.addHours(now, -demo.arrivalHoursAgo);
+      const locomotive = await this.ensureLocomotive(manager, origin.id);
+      const trainSet = await this.ensureTrainSet(manager, demo.trainNumber, locomotive.id);
+      const schedule = await this.ensureTrainSchedule(manager, {
+        trainNumber: demo.trainNumber,
+        trainSetId: trainSet.id,
+        originStationId: origin.id,
+        destinationStationId: destination.id,
+        scheduledDepartureDate: departure,
+        scheduledArrivalDate: arrival,
+        actualDepartureAt: departure,
+        actualArrivalAt: arrival,
+        direction: demo.direction,
+      });
+
+      await manager.getRepository(TrainSet).update(trainSet.id, {
+        totalWeightTons: TRAIN_DEMO_BOOKINGS.filter((booking) => booking.trainNumber === demo.trainNumber)
+          .reduce((sum, booking) => sum + booking.weightTons, 0),
+        totalLengthMeters: 28,
+        wagonCount: 2,
+        status: 'COMPLETED',
+      });
+      schedules.set(demo.trainNumber, schedule);
+    }
+
+    return schedules;
+  }
+
+  private async ensureBookings(
+    manager: EntityManager,
+    refs: Awaited<ReturnType<PaidIndodeDemoBookingsSeeder['ensureReferenceData']>>,
+    schedules: Map<string, TrainSchedule>,
+  ): Promise<Map<string, Booking>> {
+    const bookingRepo = manager.getRepository(Booking);
+    const bookingContainerRepo = manager.getRepository(BookingContainer);
+    const firstMileRepo = manager.getRepository(FirstMile);
+    const lastMileRepo = manager.getRepository(LastMile);
+    const now = new Date();
+    const references = DEMO_BOOKINGS.map((booking) => booking.reference);
+    const existingBookings = await bookingRepo.find({ where: { reference: In(references) } });
+    const existingBookingIds = existingBookings.map((booking) => booking.id);
+    const firstMileVehicle = await this.ensureFirstMileVehicle(manager);
+
+    if (existingBookingIds.length) {
+      const existingInventory = await manager.getRepository(WarehouseInventory).find({
+        where: { bookingId: In(existingBookingIds) },
+        select: { id: true },
+      });
+      const existingInventoryIds = existingInventory.map((item) => item.id);
+      if (existingInventoryIds.length) {
+        await manager.getRepository(WarehouseActivityLog).delete({
+          inventoryId: In(existingInventoryIds),
+        });
+        await manager.getRepository(WarehouseInventory).delete({
+          id: In(existingInventoryIds),
+        });
+      }
+      await this.deleteBookingTrainChildren(manager, existingBookingIds);
+      await bookingContainerRepo.delete({ bookingId: In(existingBookingIds) });
+      await firstMileRepo.delete({ bookingId: In(existingBookingIds) });
+      await lastMileRepo.delete({ bookingId: In(existingBookingIds) });
+    }
+
+    for (const demo of DEMO_BOOKINGS) {
+      const schedule = demo.trainNumber ? schedules.get(demo.trainNumber) : null;
+      if (demo.trainNumber && !schedule) {
+        throw new Error(`US12 demo booking missing train: ${demo.reference}`);
+      }
+
+      const train = demo.trainNumber ? DEMO_TRAINS.find((item) => item.trainNumber === demo.trainNumber) : null;
+      const originCode = train?.originCode ?? ('originCode' in demo ? demo.originCode : undefined);
+      const destinationCode = train?.destinationCode ?? ('destinationCode' in demo ? demo.destinationCode : undefined);
+      const origin = originCode ? refs.yards.get(originCode) : null;
+      const destination = destinationCode ? refs.yards.get(destinationCode) : null;
+      const serviceType = refs.serviceTypes.get(
+        demo.withFirstMile && demo.withLastMile
+          ? 'RAIL_CONTAINER_FIRST_LAST'
+          : demo.withFirstMile
+            ? 'RAIL_CONTAINER_FIRST_MILE'
+            : demo.withLastMile
+              ? 'RAIL_CONTAINER_LAST_MILE'
+              : 'RAIL_CONTAINER',
+      );
+      const cargoType = refs.cargoTypes.get(demo.cargoCode);
+      const profile = demo.tradeDirection === 'IMPORT' ? refs.importerProfile : refs.exporterProfile;
+
+      if (!origin || !destination || !serviceType || !cargoType) {
+        throw new Error(`US12 demo booking missing reference data: ${demo.reference}`);
+      }
+
+      await bookingRepo.upsert(
+        {
+          reference: demo.reference,
+          companyId: refs.company.id,
+          companyProfileId: profile.id,
+          isGovernment: false,
+          status:
+            'customerTruckPlateNumber' in demo && demo.customerTruckPlateNumber
+              ? 'TRUCK_ASSIGNED'
+              : demo.trainNumber
+                ? 'IN_TRANSIT'
+                : 'PAID',
+          scheduledDate: schedule?.scheduledDepartureDate ?? now,
+          estimatedShipmentDate: schedule?.scheduledDepartureDate ?? now,
+          totalAmount: demo.totalAmount,
+          paymentStatus: 'PAID',
+          contractType: 'NEW',
+          serviceTypeId: serviceType.id,
+          firstMilePickupAddress: demo.pickupAddress,
+          firstMilePickupLat: demo.pickupLat,
+          firstMilePickupLng: demo.pickupLng,
+          lastMileDeliveryAddress: demo.deliveryAddress,
+          lastMileDeliveryLat: demo.deliveryLat,
+          lastMileDeliveryLng: demo.deliveryLng,
+          customerTruckPlateNumber:
+            'customerTruckPlateNumber' in demo ? demo.customerTruckPlateNumber : null,
+          customerTruckDriverName:
+            'customerTruckDriverName' in demo ? demo.customerTruckDriverName : null,
+          customerTruckType:
+            'customerTruckType' in demo ? demo.customerTruckType : null,
+          customerTruckContainerNumber:
+            'customerTruckContainerNumber' in demo ? demo.customerTruckContainerNumber : null,
+          customerTruckAssignedAt:
+            'customerTruckPlateNumber' in demo && demo.customerTruckPlateNumber
+              ? this.addHours(now, -2)
+              : null,
+          customerTruckArrivedAt: null,
+          customsClearingEnabled: false,
+          equipmentReturn: 'WITHOUT_RETURN',
+          originYardId: origin.id,
+          destinationYardId: destination.id,
+          tradeDirection: demo.tradeDirection,
+          freightType: demo.freightType,
+          cargoTypeId: cargoType.id,
+          cargoFreeText: demo.freightType === 'BULK' ? 'Seeded paid bulk cargo' : 'Seeded paid container cargo',
+          shippingLineId: null,
+          cargoTotalWeightVgm: demo.weightTons,
+          isHazardous: false,
+          isReefer: false,
+          paymentCurrency: 'ETB',
+          pnrCode: `PNR-${demo.reference}`,
+          versionNumber: 1,
+          approvedByStaffAt: now,
+          customerSignedAt: now,
+          fullyExecutedAt: now,
+          pricingBreakdown: {
+            paid: true,
+            source: 'PaidIndodeDemoBookingsSeeder',
+            firstMileIncluded: demo.withFirstMile,
+            lastMileIncluded: demo.withLastMile,
+          },
+          priorityScore: demo.withFirstMile ? 30 : demo.withLastMile ? 25 : 20,
+          wagonsRequired: 1,
+          schedulingStatus: demo.trainNumber ? 'DISPATCHED' : 'NOT_SCHEDULED',
+          scheduledAt: demo.trainNumber ? now : null,
+          trainScheduleId: schedule?.id ?? null,
+          paymentDeadline: null,
+          selectedForBatchAt: demo.trainNumber ? now : null,
+        },
+        { conflictPaths: { reference: true } },
+      );
+
+      const booking = await bookingRepo.findOneByOrFail({ reference: demo.reference });
+
+      if (demo.freightType === 'CONTAINER' && demo.containerCode) {
+        const containerType = refs.containerTypes.get(demo.containerCode);
+        if (!containerType) {
+          throw new Error(`US12 demo booking missing container type: ${demo.reference}`);
+        }
+        await bookingContainerRepo.insert({
+          id: randomUUID(),
+          bookingId: booking.id,
+          containerTypeId: containerType.id,
+          containerNumber: this.containerNumber(demo.reference),
+          containerSize: demo.containerCode.startsWith('40') ? '40ft' : '20ft',
+          quantity: 1,
+          hazardousQuantity: 0,
+          reeferQuantity: 0,
+          vgmPerUnitTons: demo.weightTons,
+          totalVgmTons: demo.weightTons,
+          wagonsRequired: 1,
+          weightLimitRuleId: null,
+          isOverweight: false,
+          overweightExcessTons: null,
+        });
+      }
+
+      if (demo.withFirstMile) {
+        await firstMileRepo.insert({
+          id: randomUUID(),
+          bookingId: booking.id,
+          status: 'RECEIVED_TO_PORT',
+          advancedPayment: demo.totalAmount,
+          remainingPayment: 0,
+          estimatedKm: demo.tradeDirection === 'IMPORT' ? 12 : 35,
+          exactKm: demo.tradeDirection === 'IMPORT' ? 11.8 : 34.6,
+          vehicleId: firstMileVehicle.id,
+        });
+      }
+
+      if (demo.withLastMile) {
+        await lastMileRepo.insert({
+          id: randomUUID(),
+          bookingId: booking.id,
+          status: 'DELIVERED',
+          advancedPayment: demo.totalAmount,
+          remainingPayment: 0,
+          estimatedKm: demo.tradeDirection === 'IMPORT' ? 18 : 14,
+          exactKm: demo.tradeDirection === 'IMPORT' ? 17.5 : 13.8,
+          vehicleId: null,
+        });
+      }
+    }
+
+    const savedBookings = await bookingRepo.find({ where: { reference: In(references) } });
+    return new Map(savedBookings.map((booking) => [booking.reference, booking]));
+  }
+
+  private async ensureTrainLinks(
+    manager: EntityManager,
+    refs: Awaited<ReturnType<PaidIndodeDemoBookingsSeeder['ensureReferenceData']>>,
+    schedules: Map<string, TrainSchedule>,
+    bookings: Map<string, Booking>,
+  ): Promise<void> {
+    const scheduleBookingRepo = manager.getRepository(TrainScheduleBooking);
+    const trainSetWagonRepo = manager.getRepository(TrainSetWagon);
+    const allocationRepo = manager.getRepository(WagonBookingAllocation);
+    const containerItemRepo = manager.getRepository(WagonAllocationContainerItem);
+    const wagonCapacity = Number(refs.wagonType.capacityTons) || 70;
+    const wagonLength = Number(refs.wagonType.lengthMeters) || 14;
+    const tareWeight = Number(refs.wagonType.tareWeightTons) || 14;
+
+    for (const demo of TRAIN_DEMO_BOOKINGS) {
+      const schedule = schedules.get(demo.trainNumber);
+      const booking = bookings.get(demo.reference);
+      if (!schedule || !booking) continue;
+
+      const trainBookings = TRAIN_DEMO_BOOKINGS.filter((item) => item.trainNumber === demo.trainNumber);
+      const sequence = trainBookings.findIndex((item) => item.reference === demo.reference) + 1;
+      const wagon = await this.ensureWagon(manager, {
+        wagonNumber: `${demo.trainNumber}-W${String(sequence).padStart(2, '0')}`,
+        wagonTypeId: refs.wagonType.id,
+        yardId: schedule.destinationStationId,
+        trainScheduleId: schedule.id,
+        trainSetWagonId: null,
+        tareWeight,
+        capacityTons: wagonCapacity,
+      });
+
+      let trainSetWagon = await trainSetWagonRepo.findOne({
+        where: { trainSetId: schedule.trainSetId, sequenceNo: sequence },
+      });
+      trainSetWagon = await trainSetWagonRepo.save(
+        trainSetWagonRepo.create({
+          ...(trainSetWagon ? { id: trainSetWagon.id } : {}),
+          trainSetId: schedule.trainSetId,
+          wagonTypeId: refs.wagonType.id,
+          physicalWagonId: wagon.id,
+          sequenceNo: sequence,
+          capacityTons: wagonCapacity,
+          lengthMeters: wagonLength,
+          assignedWeightTons: demo.weightTons,
+          status: 'DEPARTED',
+        }),
+      );
+
+      await manager.getRepository(Wagon).update(wagon.id, {
+        trainSetWagonId: trainSetWagon.id,
+        currentTrainScheduleId: schedule.id,
+        currentYardId: schedule.destinationStationId,
+        status: WagonStatus.Assigned,
+      });
+
+      const allocation = await allocationRepo.save(
+        allocationRepo.create({
+          trainSetWagonId: trainSetWagon.id,
+          bookingId: booking.id,
+          allocatedWeightTons: demo.weightTons,
+          loadType: demo.freightType,
+          status: 'DEPARTED',
+          confirmedAt: schedule.actualDepartureAt ?? new Date(),
+        }),
+      );
+
+      if (demo.freightType === 'CONTAINER') {
+        const bookingContainer = await manager.getRepository(BookingContainer).findOne({
+          where: { bookingId: booking.id },
+        });
+        const containerType = demo.containerCode ? refs.containerTypes.get(demo.containerCode) : null;
+        await containerItemRepo.insert({
+          id: randomUUID(),
+          wagonBookingAllocationId: allocation.id,
+          bookingContainerId: bookingContainer?.id ?? null,
+          containerNumber: this.containerNumber(demo.reference),
+          containerTypeId: containerType?.id ?? null,
+          positionOnWagon: 1,
+          sealNumber: `SEAL-${demo.reference}`,
+          chassisNumber: `CHS-${demo.reference}`,
+          grossWeightTons: demo.weightTons,
+        });
+      }
+
+      await scheduleBookingRepo.insert({
+        id: randomUUID(),
+        trainScheduleId: schedule.id,
+        bookingId: booking.id,
+      });
+    }
+  }
+
+  private async ensureGatepasses(
+    manager: EntityManager,
+    schedules: Map<string, TrainSchedule>,
+  ): Promise<void> {
+    const repo = manager.getRepository(ImportDjiboutiOperation);
+    const securedAt = this.addHours(new Date(), -20);
+
+    for (const schedule of schedules.values()) {
+      const existing = await repo.findOne({ where: { trainScheduleId: schedule.id } });
+      await repo.save(
+        repo.create({
+          ...(existing ? { id: existing.id } : {}),
+          trainScheduleId: schedule.id,
+          documents: {
+            ...(existing?.documents ?? {}),
+            GATE_PASS: {
+              reference: `GP-${schedule.trainNumber}`,
+              uploadedAt: securedAt.toISOString(),
+              uploadedBy: 'PaidIndodeDemoBookingsSeeder',
+              notes: 'Seeded secured gate pass for import/export Djibouti port entry testing.',
+            },
+          },
+          gatepassGrantedAt: securedAt,
+          performedBy: 'PaidIndodeDemoBookingsSeeder',
+          notes: 'Seeded SECURED gate pass for US12 warehouse workflow testing.',
+        }),
+      );
+    }
+  }
+
+  private async ensureImportWarehouseInventory(
+    manager: EntityManager,
+    bookings: Map<string, Booking>,
+  ): Promise<void> {
+    const warehouse = await manager.getRepository(Warehouse).findOne({ where: { code: 'INDODE_OPEN' } });
+    if (!warehouse) {
+      this.logger.warn('INDODE_OPEN warehouse missing; skipping US12 import warehouse inventory seed');
+      return;
+    }
+
+    for (const demo of TRAIN_DEMO_BOOKINGS.filter((booking) => booking.tradeDirection === 'IMPORT')) {
+      const booking = bookings.get(demo.reference);
+      if (!booking) continue;
+
+      const yard = await this.findWarehouseYard(manager, warehouse.id, demo.freightType);
+      if (!yard) {
+        this.logger.warn(`No warehouse yard found for ${warehouse.code}; skipping ${demo.reference}`);
+        continue;
+      }
+      const zone = await manager.getRepository(WarehouseZone).findOne({ where: { yardId: yard.id } });
+      if (!zone) {
+        this.logger.warn(`No warehouse zone found for ${yard.code}; skipping ${demo.reference}`);
+        continue;
+      }
+
+      const arrivedAt = this.addHours(new Date(), -Number(demo.trainNumber.includes('LM') ? 7 : 13));
+      const grnNumber = `GRN-IMP-${demo.reference.replace(/[^A-Z0-9]/g, '')}`;
+      const saved = await manager.getRepository(WarehouseInventory).save(
+        manager.getRepository(WarehouseInventory).create({
+          warehouseId: warehouse.id,
+          yardId: yard.id,
+          zoneId: zone.id,
+          bookingId: booking.id,
+          quantity: demo.freightType === 'CONTAINER' ? 1 : 1,
+          weight: demo.weightTons,
+          volume: null,
+          grnNumber,
+          status: 'UNLOADED',
+          inspectionStatus: null,
+          arrivedAt,
+          unloadedAt: arrivedAt,
+          notes: [
+            `GRN Number: ${grnNumber}`,
+            'Direction: IMPORT',
+            `Train: ${demo.trainNumber}`,
+            `Seeded For: ${demo.withLastMile ? 'Import with last mile' : 'Import terminal pickup / no last mile'}`,
+            'Seeded by PaidIndodeDemoBookingsSeeder for Receive at Warehouse testing.',
+          ].join('\n'),
+        }),
+      );
+
+      await manager.getRepository(WarehouseActivityLog).save(
+        manager.getRepository(WarehouseActivityLog).create({
+          inventoryId: saved.id,
+          warehouseId: warehouse.id,
+          activityType: 'INVENTORY_UNLOADED',
+          description: `Seeded import train arrival ${demo.trainNumber} into warehouse queue`,
+          performedBy: 'PaidIndodeDemoBookingsSeeder',
+        }),
+      );
+    }
+  }
+
+  private async findWarehouseYard(
+    manager: EntityManager,
+    warehouseId: string,
+    freightType: string,
+  ): Promise<WarehouseYard | null> {
+    const preferredType = freightType === 'CONTAINER' ? 'CONTAINER_YARD' : 'BULK_YARD';
+    return (
+      (await manager.getRepository(WarehouseYard).findOne({
+        where: { warehouseId, type: preferredType as any },
+      })) ??
+      (await manager.getRepository(WarehouseYard).findOne({
+        where: { warehouseId },
+      }))
+    );
+  }
+
+  private async deleteBookingTrainChildren(manager: EntityManager, bookingIds: string[]): Promise<void> {
+    const allocationRepo = manager.getRepository(WagonBookingAllocation);
+    const allocations = await allocationRepo.find({
+      where: { bookingId: In(bookingIds) },
+      select: { id: true },
+    });
+    const allocationIds = allocations.map((allocation) => allocation.id);
+    if (allocationIds.length) {
+      await manager.getRepository(WagonAllocationContainerItem).delete({
+        wagonBookingAllocationId: In(allocationIds),
+      });
+    }
+    await allocationRepo.delete({ bookingId: In(bookingIds) });
+    await manager.getRepository(TrainScheduleBooking).delete({ bookingId: In(bookingIds) });
+  }
+
+  private async ensureLocomotive(
+    manager: EntityManager,
+    currentYardId: string,
+  ): Promise<Locomotive> {
+    const repo = manager.getRepository(Locomotive);
+    const existing = await repo.findOne({ where: { code: 'US12-DEMO-LOCO' } });
+    if (existing) {
+      await repo.update(existing.id, { currentYardId, status: 'AVAILABLE' });
+      return { ...existing, currentYardId, status: 'AVAILABLE' };
+    }
+
+    return repo.save(
+      repo.create({
+        code: 'US12-DEMO-LOCO',
+        name: 'US12 Demo Locomotive',
+        locomotiveType: 'DIESEL',
+        maxPullWeightTons: 4200,
+        maxTrainLengthMeters: 760,
+        status: 'AVAILABLE',
+        currentYardId,
+      }),
+    );
+  }
+
+  private async ensureTrainSet(
+    manager: EntityManager,
+    trainNumber: string,
+    locomotiveId: string,
+  ): Promise<TrainSet> {
+    const schedule = await manager.getRepository(TrainSchedule).findOne({
+      where: { trainNumber },
+    });
+    if (schedule) {
+      const existing = await manager.getRepository(TrainSet).findOneByOrFail({
+        id: schedule.trainSetId,
+      });
+      await manager.getRepository(TrainSet).update(existing.id, {
+        locomotiveId,
+        status: 'COMPLETED',
+      });
+      return { ...existing, locomotiveId, status: 'COMPLETED' };
+    }
+
+    return manager.getRepository(TrainSet).save(
+      manager.getRepository(TrainSet).create({
+        locomotiveId,
+        totalWeightTons: 0,
+        totalLengthMeters: 0,
+        wagonCount: 0,
+        status: 'COMPLETED',
+      }),
+    );
+  }
+
+  private async ensureTrainSchedule(
+    manager: EntityManager,
+    input: {
+      trainNumber: string;
+      trainSetId: string;
+      originStationId: string;
+      destinationStationId: string;
+      scheduledDepartureDate: Date;
+      scheduledArrivalDate: Date;
+      actualDepartureAt: Date;
+      actualArrivalAt: Date;
+      direction: 'IMPORT' | 'EXPORT';
+    },
+  ): Promise<TrainSchedule> {
+    const repo = manager.getRepository(TrainSchedule);
+    const existing = await repo.findOne({ where: { trainNumber: input.trainNumber } });
+    const nextSchedule = repo.create({
+        ...(existing ? { id: existing.id } : {}),
+        trainSetId: input.trainSetId,
+        originStationId: input.originStationId,
+        destinationStationId: input.destinationStationId,
+        scheduledDepartureDate: input.scheduledDepartureDate,
+        scheduledArrivalDate: input.scheduledArrivalDate,
+        actualDepartureAt: input.actualDepartureAt,
+        actualArrivalAt: input.actualArrivalAt,
+        status: TrainScheduleStatus.Arrived,
+        trainNumber: input.trainNumber,
+        direction: input.direction,
+        maxWagons: 53,
+        bookingWindowStatus: 'CLOSED',
+      });
+    return repo.save(nextSchedule);
+  }
+
+  private async ensureWagon(
+    manager: EntityManager,
+    input: {
+      wagonNumber: string;
+      wagonTypeId: string;
+      yardId: string;
+      trainScheduleId: string;
+      trainSetWagonId: string | null;
+      tareWeight: number;
+      capacityTons: number;
+    },
+  ): Promise<Wagon> {
+    const repo = manager.getRepository(Wagon);
+    const existing = await repo.findOne({ where: { wagonNumber: input.wagonNumber } });
+    return repo.save(
+      repo.create({
+        ...(existing ? { id: existing.id } : {}),
+        wagonNumber: input.wagonNumber,
+        wagonTypeId: input.wagonTypeId,
+        currentYardId: input.yardId,
+        currentTrainScheduleId: input.trainScheduleId,
+        trainSetWagonId: input.trainSetWagonId,
+        tareWeight: input.tareWeight,
+        maxPayloadWeight: input.capacityTons,
+        status: WagonStatus.Assigned,
+        notes: 'US12 paid Indode demo seed wagon',
+      }),
+    );
+  }
+
+  private async ensureFirstMileVehicle(manager: EntityManager): Promise<Vehicle> {
+    const driverRepo = manager.getRepository(Driver);
+    const vehicleRepo = manager.getRepository(Vehicle);
+    const licenseNumber = 'US12-FM-LIC-001';
+    const plateNumber = 'ET-FM-1201';
+
+    await driverRepo.upsert(
+      {
+        licenseNumber,
+        firstName: 'Tesfaye',
+        lastName: 'Firstmile',
+        email: 'tesfaye.firstmile@edr.local',
+        phoneNumber: '251911120120',
+        licenseExpiryDate: this.addHours(new Date(), 24 * 365),
+        status: DriverStatus.ACTIVE,
+        vehicleTypesAuthorized: [VehicleType.TRUCK, VehicleType.FLATBED],
+        notes: 'Seeded first-mile driver for US12 receive-to-warehouse testing',
+      },
+      { conflictPaths: { licenseNumber: true } },
+    );
+    const driver = await driverRepo.findOneByOrFail({ licenseNumber });
+
+    await vehicleRepo.upsert(
+      {
+        plateNumber,
+        registrationNumber: 'US12-FM-REG-001',
+        vehicleType: VehicleType.TRUCK,
+        manufacturer: 'Sinotruk',
+        model: 'HOWO Container Carrier',
+        year: 2024,
+        fuelType: FuelType.DIESEL,
+        capacity: 40,
+        status: VehicleStatus.ACTIVE,
+        assignedDriverId: driver.id,
+        assignedDriverName: `${driver.firstName} ${driver.lastName}`,
+        description: 'Seeded first-mile truck for US12 receive-to-warehouse testing',
+        estimatedDistanceKm: 35,
+        actualDistanceKm: 34.6,
+      },
+      { conflictPaths: { plateNumber: true } },
+    );
+    const vehicle = await vehicleRepo.findOneByOrFail({ plateNumber });
+    await manager.query(
+      `UPDATE freight.vehicles
+          SET trailer_plate_no = $2,
+              assigned_driver_id = $3,
+              assigned_driver_name = $4,
+              updated_at = NOW()
+        WHERE id = $1`,
+      [vehicle.id, 'ET-TRL-1201', driver.id, `${driver.firstName} ${driver.lastName}`],
+    );
+    return vehicleRepo.findOneByOrFail({ plateNumber });
+  }
+
+  private containerNumber(reference: string): string {
+    const suffix = reference.replace(/[^A-Z0-9]/g, '').slice(-7);
+    return `US12${suffix}`;
+  }
+
+  private addHours(date: Date, hours: number): Date {
+    return new Date(date.getTime() + hours * 60 * 60 * 1000);
+  }
+}
diff --git a/apps/edr-freight-api/src/seed/pricing-data.seeder.ts b/apps/edr-freight-api/src/seed/pricing-data.seeder.ts
index ae48ada66..02a05602e 100644
--- a/apps/edr-freight-api/src/seed/pricing-data.seeder.ts
+++ b/apps/edr-freight-api/src/seed/pricing-data.seeder.ts
@@ -286,15 +286,15 @@ export class PricingDataSeeder {
 
     const routeRepo = manager.getRepository(Route);
     const milestoneRepo = manager.getRepository(RouteMilestone);
-    const routeName = "Addis Ababa → Dire Dawa";
-    let route = await routeRepo.findOneBy({ name: routeName });
+    let route = await routeRepo.findOne({
+      where: { originYardId: addis.id, destinationYardId: direDawa.id },
+    });
     if (!route) {
       route = await routeRepo.save(
         routeRepo.create({
-          name: routeName,
           originYardId: addis.id,
           destinationYardId: direDawa.id,
-          isActive: true,
+          status: 'AVAILABLE',
         }),
       );
       await milestoneRepo.save([
@@ -302,11 +302,13 @@ export class PricingDataSeeder {
           routeId: route.id,
           yardId: addis.id,
           sequenceNo: 1,
+          distanceKm: 0,
         }),
         milestoneRepo.create({
           routeId: route.id,
           yardId: direDawa.id,
           sequenceNo: 2,
+          distanceKm: 445,
         }),
       ]);
       this.logger.log("Seeded domestic route Addis Ababa → Dire Dawa");
diff --git a/apps/edr-freight-api/src/types/multer-globals.d.ts b/apps/edr-freight-api/src/types/multer-globals.d.ts
new file mode 100644
index 000000000..0bc672a9e
--- /dev/null
+++ b/apps/edr-freight-api/src/types/multer-globals.d.ts
@@ -0,0 +1 @@
+/// <reference types="multer" />
diff --git a/apps/edr-freight-web/backoffice/src/App.tsx b/apps/edr-freight-web/backoffice/src/App.tsx
index 542a848a4..567ecf074 100644
--- a/apps/edr-freight-web/backoffice/src/App.tsx
+++ b/apps/edr-freight-web/backoffice/src/App.tsx
@@ -6,6 +6,7 @@ import {
   FileText,
   LayoutDashboard,
   LayoutGrid,
+  MapPin,
   Network,
   Package,
   PackageCheck,
@@ -14,13 +15,22 @@ import {
   Send,
   Settings,
   ShieldCheck,
+  Ship,
   SlidersHorizontal,
   Train,
   Truck,
   Users,
   Wallet,
 } from "lucide-react";
-import { Navigate, Outlet, Route, Routes, useLocation, useNavigate } from "react-router-dom";
+import {
+  Navigate,
+  Outlet,
+  Route,
+  Routes,
+  useLocation,
+  useNavigate,
+  useParams,
+} from "react-router-dom";
 
 import { FreightDashboardLayout, type SidebarItem, type SidebarSection } from "@/components/layout";
 import { useAuth } from "./auth/useAuth";
@@ -35,8 +45,12 @@ import ContractRequestDetailPage from "./pages/contracts/ContractRequestDetailPa
 import ContractViewPage from "./pages/contracts/ContractViewPage";
 import ContractClearanceListPage from "./pages/contracts/ContractClearanceListPage";
 import ContractClearanceDetailPage from "./pages/contracts/ContractClearanceDetailPage";
+import GlDjiboutiClearanceListPage from "./pages/contracts/GlDjiboutiClearanceListPage";
+import GlClearanceDetailPage from "./pages/contracts/GlClearanceDetailPage";
+import ShipmentRequestsPage from "./pages/contracts/ShipmentRequestsPage";
+import ShipmentRequestDetailPage from "./pages/contracts/ShipmentRequestDetailPage";
 import GlCreateBookingForm from "./components/contracts/GlCreateBookingForm";
-import BookingMilestonesPage from "./pages/contracts/BookingMilestonesPage";
+import DocumentClearanceDetailPage from "./pages/bookings/DocumentClearanceDetailPage";
 import CustomerDetailPage from "./pages/customers/CustomerDetailPage";
 import CustomersPage from "./pages/customers/CustomersPage";
 import DemoUser1Page from "./pages/dashboard/demo/DemoUser1Page";
@@ -57,6 +71,12 @@ import FileUploadSettingsPage from "./pages/documents/FileUploadSettingsPage";
 import DropdownSettingsPage from "./pages/dropdown_settings/DropdownSettingsPage";
 import FleetResourcePage from "./pages/fleet/FleetResourcePage";
 import RoutesPage from "./pages/fleet/RoutesPage";
+import FuelPurchasePage from "./pages/fleet/FuelPurchasePage";
+import FuelStatsPage from "./pages/fleet/FuelStatsPage";
+import { MaintenancePage } from "./pages/fleet/MaintenancePage";
+import { FinancialReportsPage } from "./pages/fleet/FinancialReportsPage";
+import { FleetDashboard } from "./pages/fleet/FleetDashboard";
+import { TrackingPage } from "./pages/fleet/TrackingPage";
 import { getCategorySidebarChildren } from "./pages/ruleEngine/config/resources";
 import RuleEngineLegacyRedirect from "./pages/ruleEngine/RuleEngineLegacyRedirect";
 import RuleEngineResourcePage from "./pages/ruleEngine/RuleEngineResourcePage";
@@ -67,6 +87,7 @@ import BatchScheduleDetailPage from "./pages/trainScheduling/BatchScheduleDetail
 import TrainScheduleV2DetailPage from "./pages/trainScheduling/TrainScheduleV2DetailPage";
 import TrainScheduleTrackPage from "./pages/trainScheduling/TrainScheduleTrackPage";
 import TrainSchedulingGlobalRulesPage from "./pages/trainScheduling/TrainSchedulingGlobalRulesPage";
+import ContractValidityPeriodsPage from "./pages/configuration/ContractValidityPeriodsPage";
 import FirstMilePage from "./pages/operations/FirstMilePage";
 import LastMilePage from "./pages/operations/LastMilePage";
 import TrainDetailPage from "./pages/trains/TrainDetailPage";
@@ -133,7 +154,22 @@ const buildSidebarSections = (demoItems: SidebarItem[]): SidebarSection[] => [
         label: "Document Clearance",
         href: "/dashboard/contracts/clearance",
         icon: <ShieldCheck />,
-        permission: FREIGHT_PERMS.contracts.clearanceReview,
+        permission: [
+          FREIGHT_PERMS.contracts.clearanceReview,
+          FREIGHT_PERMS.contracts.clearanceEtActions,
+        ],
+      },
+      // {
+      //   label: "Shipment Requests",
+      //   href: "/dashboard/shipment-requests",
+      //   icon: <Send />,
+      //   permission: FREIGHT_PERMS.contracts.createBooking,
+      // },
+      {
+        label: "GL Djibouti Clearance",
+        href: "/dashboard/gl-djibouti/clearance",
+        icon: <Ship />,
+        permission: FREIGHT_PERMS.contracts.clearanceDjActions,
       },
       {
         label: "Train Schedules",
@@ -164,6 +200,12 @@ const buildSidebarSections = (demoItems: SidebarItem[]): SidebarSection[] => [
   {
     title: "Fleet Management",
     items: [
+      {
+        label: "Fleet Dashboard",
+        href: "/dashboard/fleet-dashboard",
+        icon: <LayoutDashboard />,
+        permission: FREIGHT_PERMS.fleet.view,
+      },
       {
         label: "Routes",
         href: "/dashboard/routes",
@@ -200,6 +242,36 @@ const buildSidebarSections = (demoItems: SidebarItem[]): SidebarSection[] => [
         icon: <Users />,
         permission: FREIGHT_PERMS.fleet.view,
       },
+      {
+        label: "Track Vehicles",
+        href: "/dashboard/tracking",
+        icon: <MapPin />,
+        permission: FREIGHT_PERMS.fleet.view,
+      },
+      {
+        label: "Fuel Purchases",
+        href: "/dashboard/fuel-purchases",
+        icon: <Truck />,
+        permission: FREIGHT_PERMS.fleet.view,
+      },
+      {
+        label: "Fuel Analytics",
+        href: "/dashboard/fuel-stats",
+        icon: <Truck />,
+        permission: FREIGHT_PERMS.fleet.view,
+      },
+      {
+        label: "Maintenance",
+        href: "/dashboard/maintenance",
+        icon: <Truck />,
+        permission: FREIGHT_PERMS.fleet.view,
+      },
+      {
+        label: "Financial Reports",
+        href: "/dashboard/financial-reports",
+        icon: <Wallet />,
+        permission: FREIGHT_PERMS.fleet.view,
+      },
       // {
       //   label: "Containers",
       //   href: "/dashboard/containers",
@@ -343,6 +415,10 @@ const buildSidebarSections = (demoItems: SidebarItem[]): SidebarSection[] => [
         icon: <Boxes />,
         children: [
           ...getCategorySidebarChildren("configuration"),
+          {
+            label: "Contract validity",
+            href: "/dashboard/configuration/contract-validity-periods",
+          },
           // {
           //   label: "Train scheduling rules",
           //   href: "/dashboard/configuration/train-scheduling-rules",
@@ -459,7 +535,11 @@ const App = () => {
         />
         <Route
           path="clearance/:id"
-          element={<Navigate to="/dashboard/contracts/clearance" replace />}
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.bookings.clearanceView}>
+              <DocumentClearanceDetailPage />
+            </RequirePermission>
+          }
         />
 
         {/* Contracts (Path A/B) */}
@@ -487,11 +567,40 @@ const App = () => {
             </RequirePermission>
           }
         />
+        <Route
+          path="bookings/:bookingId/clearance"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.bookings.clearanceView}>
+              <DocumentClearanceDetailPage />
+            </RequirePermission>
+          }
+        />
+        <Route
+          path="shipment-requests"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.contracts.createBooking}>
+              <ShipmentRequestsPage />
+            </RequirePermission>
+          }
+        />
+        <Route
+          path="shipment-requests/:id"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.contracts.createBooking}>
+              <ShipmentRequestDetailPage />
+            </RequirePermission>
+          }
+        />
         {/* GL (Path B) contract clearance review hub */}
         <Route
           path="contracts/clearance"
           element={
-            <RequirePermission permission={FREIGHT_PERMS.contracts.clearanceReview}>
+            <RequirePermission
+              permission={[
+                FREIGHT_PERMS.contracts.clearanceReview,
+                FREIGHT_PERMS.contracts.clearanceEtActions,
+              ]}
+            >
               <ContractClearanceListPage />
             </RequirePermission>
           }
@@ -499,11 +608,34 @@ const App = () => {
         <Route
           path="contracts/clearance/:id"
           element={
-            <RequirePermission permission={FREIGHT_PERMS.contracts.clearanceReview}>
+            <RequirePermission
+              permission={[
+                FREIGHT_PERMS.contracts.clearanceReview,
+                FREIGHT_PERMS.contracts.clearanceEtActions,
+              ]}
+            >
               <ContractClearanceDetailPage />
             </RequirePermission>
           }
         />
+        <Route path="gl-ethiopia/clearance" element={<LegacyGlEthiopiaClearanceRedirect />} />
+        <Route path="gl-ethiopia/clearance/:id" element={<LegacyGlEthiopiaClearanceRedirect />} />
+        <Route
+          path="gl-djibouti/clearance"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.contracts.clearanceDjActions}>
+              <GlDjiboutiClearanceListPage />
+            </RequirePermission>
+          }
+        />
+        <Route
+          path="gl-djibouti/clearance/:id"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.contracts.clearanceDjActions}>
+              <GlClearanceDetailPage />
+            </RequirePermission>
+          }
+        />
         {/* Path A ops queue out of scope for now → fold into the GL hub. */}
         <Route
           path="contracts/ops-clearance"
@@ -519,11 +651,7 @@ const App = () => {
         />
         <Route
           path="bookings/:id/milestones"
-          element={
-            <RequirePermission permission={FREIGHT_PERMS.contracts.clearanceReview}>
-              <BookingMilestonesPage />
-            </RequirePermission>
-          }
+          element={<BookingMilestonesRedirect />}
         />
         <Route path="warehouses" element={<WarehouseListPage />} />
         <Route path="warehouses/:id" element={<WarehouseDetailPage />} />
@@ -725,6 +853,54 @@ const App = () => {
             </RequirePermission>
           }
         />
+        <Route
+          path="fuel-purchases"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.fleet.view}>
+              <FuelPurchasePage />
+            </RequirePermission>
+          }
+        />
+        <Route
+          path="fuel-stats"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.fleet.view}>
+              <FuelStatsPage />
+            </RequirePermission>
+          }
+        />
+        <Route
+          path="maintenance"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.fleet.view}>
+              <MaintenancePage />
+            </RequirePermission>
+          }
+        />
+        <Route
+          path="financial-reports"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.fleet.view}>
+              <FinancialReportsPage />
+            </RequirePermission>
+          }
+        />
+        <Route
+          path="fleet-dashboard"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.fleet.view}>
+              <FleetDashboard />
+            </RequirePermission>
+          }
+        />
+        <Route
+          path="tracking"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.fleet.view}>
+              <TrackingPage />
+            </RequirePermission>
+          }
+        />
         <Route
           path="locomotives"
           element={
@@ -811,6 +987,14 @@ const App = () => {
             </RequirePermission>
           }
         />
+        <Route
+          path="configuration/contract-validity-periods"
+          element={
+            <RequirePermission permission={FREIGHT_PERMS.admin}>
+              <ContractValidityPeriodsPage />
+            </RequirePermission>
+          }
+        />
         <Route path="configuration/cargo-types" element={<CargoTypesPage />} />
         <Route path="configuration/cargo-types/:id" element={<CargoTypesPage />} />
         <Route path="configuration/:resource" element={<RuleEngineResourcePage />} />
@@ -839,4 +1023,21 @@ const App = () => {
   );
 };
 
+/** Redirect removed milestones page to document clearance. */
+function BookingMilestonesRedirect() {
+  const { id } = useParams();
+  return (
+    <Navigate to={`/dashboard/bookings/${id}/clearance`} replace />
+  );
+}
+
+/** Redirect legacy GL Ethiopia clearance URLs to the unified document clearance hub. */
+function LegacyGlEthiopiaClearanceRedirect() {
+  const { id } = useParams();
+  if (id) {
+    return <Navigate to={`/dashboard/contracts/clearance/${id}`} replace />;
+  }
+  return <Navigate to="/dashboard/contracts/clearance" replace />;
+}
+
 export default App;
diff --git a/apps/edr-freight-web/backoffice/src/components/bookings/BookingActionsMenu.tsx b/apps/edr-freight-web/backoffice/src/components/bookings/BookingActionsMenu.tsx
index 01a0db69a..13ac9577d 100644
--- a/apps/edr-freight-web/backoffice/src/components/bookings/BookingActionsMenu.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/bookings/BookingActionsMenu.tsx
@@ -65,7 +65,6 @@ export function BookingActionsMenu({
   };
 
   const hasMenu = listRowHasActions(row, user);
-  const primary = actions.find((a) => a.primary) ?? actions[0];
 
   if (!hasMenu && variant === "table") {
     return (
@@ -117,19 +116,6 @@ export function BookingActionsMenu({
       onClick={(e) => e.stopPropagation()}
       onKeyDown={(e) => e.stopPropagation()}
     >
-      {variant === "table" && primary && (
-        <Button
-          size="compact-sm"
-          color="edr-green"
-          visibleFrom="lg"
-          leftSection={<primary.icon size={14} />}
-          disabled={mutations.isPending}
-          onClick={() => handleAction(primary)}
-        >
-          {primary.shortLabel}
-        </Button>
-      )}
-
       <Menu position="bottom-end" width={220} withinPortal>
         <Menu.Target>
           <ActionIcon
diff --git a/apps/edr-freight-web/backoffice/src/components/bookings/detail/ClearanceReviewSection.tsx b/apps/edr-freight-web/backoffice/src/components/bookings/detail/ClearanceReviewSection.tsx
index 16bd6ed27..78cc5efd6 100644
--- a/apps/edr-freight-web/backoffice/src/components/bookings/detail/ClearanceReviewSection.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/bookings/detail/ClearanceReviewSection.tsx
@@ -41,6 +41,12 @@ export interface ClearanceReviewSectionProps {
   onChanged?: () => void;
   /** Hide the inline progress summary (e.g. when the parent renders its own). */
   hideSummary?: boolean;
+  /** Lock approve actions after document review phase completes. */
+  approvalsLocked?: boolean;
+  /** Block new queries after pre-clearance finalization. */
+  queriesLocked?: boolean;
+  /** Read-only audit view — no approve/query actions. */
+  readOnly?: boolean;
 }
 
 const STATUS_META: Record<
@@ -64,6 +70,9 @@ export function ClearanceReviewSection({
   bookingId,
   onChanged,
   hideSummary,
+  approvalsLocked = false,
+  queriesLocked = false,
+  readOnly = false,
 }: ClearanceReviewSectionProps) {
   const qc = useQueryClient();
   const [queryNotes, setQueryNotes] = useState<Record<string, string>>({});
@@ -147,6 +156,11 @@ export function ClearanceReviewSection({
     return { total, approved, queried, pending, pct };
   }, [customerDocs]);
 
+  const hasDocsAwaitingApproval = customerDocs.some(
+    (d) => d.file && d.reviewStatus !== "APPROVED",
+  );
+  const effectiveApprovalsLocked = approvalsLocked && !hasDocsAwaitingApproval;
+
   if (isLoading || !clearance) {
     return (
       <Group justify="center" py="xl" gap={10}>
@@ -194,6 +208,9 @@ export function ClearanceReviewSection({
               <DocReviewCard
                 key={`${doc.settingCode}:${doc.fileKey}`}
                 doc={doc}
+                approvalsLocked={effectiveApprovalsLocked}
+                queriesLocked={queriesLocked}
+                readOnly={readOnly}
                 note={queryNotes[doc.fileKey] ?? ""}
                 queryOpen={openQuery[doc.fileKey] ?? false}
                 onToggleQuery={(open) =>
@@ -397,6 +414,9 @@ function StatPill({
 
 function DocReviewCard({
   doc,
+  approvalsLocked,
+  queriesLocked,
+  readOnly,
   note,
   queryOpen,
   onToggleQuery,
@@ -407,6 +427,9 @@ function DocReviewCard({
   busy,
 }: {
   doc: Freight.ClearanceDocument;
+  approvalsLocked: boolean;
+  queriesLocked: boolean;
+  readOnly: boolean;
   note: string;
   queryOpen: boolean;
   onToggleQuery: (open: boolean) => void;
@@ -419,6 +442,7 @@ function DocReviewCard({
   const status = doc.reviewStatus ?? "PENDING";
   const meta = STATUS_META[status];
   const hasFile = !!doc.file;
+  const isApproved = status === "APPROVED";
 
   return (
     <Paper
@@ -499,31 +523,35 @@ function DocReviewCard({
         </Alert>
       )}
 
-      {hasFile && (
+      {hasFile && !readOnly && (
         <Box mt="sm">
           {!queryOpen ? (
             <Group justify="flex-end" gap={8}>
-              <Button
-                size="compact-sm"
-                variant="light"
-                color="red"
-                radius="md"
-                leftSection={<MessageSquareWarning size={14} />}
-                disabled={busy}
-                onClick={() => onToggleQuery(true)}
-              >
-                Open query
-              </Button>
-              <Button
-                size="compact-sm"
-                color="edr-green"
-                radius="md"
-                leftSection={<CheckCircle2 size={14} />}
-                disabled={busy}
-                onClick={onApprove}
-              >
-                Approve
-              </Button>
+              {!queriesLocked && (
+                <Button
+                  size="compact-sm"
+                  variant="light"
+                  color="red"
+                  radius="md"
+                  leftSection={<MessageSquareWarning size={14} />}
+                  disabled={busy}
+                  onClick={() => onToggleQuery(true)}
+                >
+                  Open query
+                </Button>
+              )}
+              {!isApproved && !approvalsLocked && (
+                <Button
+                  size="compact-sm"
+                  color="edr-green"
+                  radius="md"
+                  leftSection={<CheckCircle2 size={14} />}
+                  disabled={busy}
+                  onClick={onApprove}
+                >
+                  Approve
+                </Button>
+              )}
             </Group>
           ) : (
             <Box
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/ClearanceOpsTabs.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/ClearanceOpsTabs.tsx
new file mode 100644
index 000000000..c9290bb9b
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/ClearanceOpsTabs.tsx
@@ -0,0 +1,128 @@
+import type { ReactNode } from "react";
+import { Badge, Stack, Tabs, Text } from "@mantine/core";
+import { AlertTriangle, FileText, ShieldAlert } from "lucide-react";
+import type { Freight } from "@edr/types";
+
+import { SectionCard } from "@/components/bookings/detail/SectionCard";
+import { AssignRiskCard } from "@/components/contracts/gl-actions/AssignRiskCard";
+import { IncidentReportCard } from "@/components/contracts/gl-actions/IncidentReportCard";
+import { ClearanceUploadedDocumentsPanel } from "@/components/contracts/ClearanceUploadedDocumentsPanel";
+
+export interface ClearanceOpsTabsProps {
+  bookingId: string | undefined;
+  milestones?: Freight.IClearanceMilestone[];
+  /** When false, only the clearance tab content is rendered (no tab bar). */
+  showOpsTabs?: boolean;
+  clearanceTab: ReactNode;
+  /** Phased customs workflow files — enables the Uploaded documents tab. */
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  showWorkflowFilesTab?: boolean;
+  tradeDirection?: string;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}
+
+function findMilestone(
+  milestones: Freight.IClearanceMilestone[] | undefined,
+  code: string,
+): Freight.IClearanceMilestone | undefined {
+  return milestones?.find((m) => m.milestoneCode === code);
+}
+
+/**
+ * Document Clearance detail layout: primary clearance workflow plus optional
+ * uploaded documents, post-booking risk assignment, and incident reporting tabs.
+ */
+export function ClearanceOpsTabs({
+  bookingId,
+  milestones,
+  showOpsTabs = true,
+  clearanceTab,
+  workflowFiles = [],
+  showWorkflowFilesTab = false,
+  tradeDirection = "IMPORT",
+  onViewFile,
+  onDownloadFile,
+}: ClearanceOpsTabsProps) {
+  const riskMs = findMilestone(milestones, "RISK_ASSIGNED");
+  const hasOps = Boolean(bookingId);
+  const isExport = tradeDirection === "EXPORT";
+  const uploadedDocCount = workflowFiles.filter((f) => {
+    if (!f.file) return false;
+    if (isExport) return f.category !== "duty";
+    return true;
+  }).length;
+  const showDocuments = showWorkflowFilesTab && Boolean(onViewFile);
+  const hasTabs = (showOpsTabs && hasOps) || showDocuments;
+
+  if (!hasTabs) {
+    return <>{clearanceTab}</>;
+  }
+
+  return (
+    <Tabs defaultValue="clearance" keepMounted={false}>
+      <Tabs.List mb="md">
+        <Tabs.Tab value="clearance">Clearance</Tabs.Tab>
+        {showDocuments ? (
+          <Tabs.Tab
+            value="documents"
+            leftSection={<FileText size={14} />}
+            rightSection={
+              uploadedDocCount > 0 ? (
+                <Badge size="xs" variant="light" color="edr-green" circle>
+                  {uploadedDocCount}
+                </Badge>
+              ) : undefined
+            }
+          >
+            Uploaded documents
+          </Tabs.Tab>
+        ) : null}
+        {showOpsTabs && riskMs ? (
+          <Tabs.Tab value="risk" leftSection={<ShieldAlert size={14} />}>
+            Risk assignment
+          </Tabs.Tab>
+        ) : null}
+        {showOpsTabs && bookingId ? (
+          <Tabs.Tab value="incidents" leftSection={<AlertTriangle size={14} />}>
+            Incidents
+          </Tabs.Tab>
+        ) : null}
+      </Tabs.List>
+
+      <Tabs.Panel value="clearance">{clearanceTab}</Tabs.Panel>
+
+      {showDocuments ? (
+        <Tabs.Panel value="documents">
+          <ClearanceUploadedDocumentsPanel
+            files={workflowFiles}
+            tradeDirection={tradeDirection}
+            onView={onViewFile!}
+            onDownload={onDownloadFile}
+          />
+        </Tabs.Panel>
+      ) : null}
+
+      {showOpsTabs && riskMs && bookingId ? (
+        <Tabs.Panel value="risk">
+          <SectionCard icon={ShieldAlert} title="Customs risk" accent="edr-green">
+            <AssignRiskCard bookingId={bookingId} milestone={riskMs} />
+          </SectionCard>
+        </Tabs.Panel>
+      ) : null}
+
+      {showOpsTabs && bookingId ? (
+        <Tabs.Panel value="incidents">
+          <SectionCard icon={AlertTriangle} title="Incident reports" accent="edr-green">
+            <Stack gap="sm">
+              <Text size="sm" c="dimmed">
+                Log container or seal issues discovered during clearance handling.
+              </Text>
+              <IncidentReportCard bookingId={bookingId} />
+            </Stack>
+          </SectionCard>
+        </Tabs.Panel>
+      ) : null}
+    </Tabs>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/ClearancePhaseStepper.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/ClearancePhaseStepper.tsx
new file mode 100644
index 000000000..ba93a790d
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/ClearancePhaseStepper.tsx
@@ -0,0 +1,112 @@
+import { Check } from "lucide-react";
+import { Box, Group, Stack, Text } from "@mantine/core";
+import type { Freight } from "@edr/types";
+
+const BRAND_GREEN = "var(--freight-brand, #0A6F4D)";
+
+const IMPORT_PHASES = [
+  "CUSTOMER_INTAKE",
+  "GL_ET_REVIEW",
+  "GL_ET_OUTPUT",
+  "CUSTOMER_DUTY",
+  "GL_ET_POST_CLEARANCE",
+  "GL_DJ_COLLECTION",
+] as const;
+
+const PHASE_LABELS: Record<string, string> = {
+  CUSTOMER_INTAKE: "Customer docs",
+  GL_ET_REVIEW: "GL ET review",
+  GL_DJ_COLLECTION: "GL Djibouti DO",
+  GL_ET_OUTPUT: "Declaration",
+  CUSTOMER_DUTY: "Duty / customer pays",
+  GL_ET_POST_CLEARANCE: "Transit & finalize",
+  GL_DJ_LOADING: "Loading",
+  POST_TRANSIT: "Transit",
+};
+
+const EXPORT_PHASES = [
+  "CUSTOMER_INTAKE",
+  "GL_ET_REVIEW",
+  "GL_DJ_COLLECTION",
+  "GL_ET_OUTPUT",
+  "GL_ET_POST_CLEARANCE",
+] as const;
+
+function phaseIndex(phases: readonly string[], current?: string | null): number {
+  if (!current) return 0;
+  const idx = phases.indexOf(current);
+  return idx >= 0 ? idx : 0;
+}
+
+export function ClearancePhaseStepper({
+  clearance,
+  tradeDirection,
+  compact = false,
+}: {
+  clearance?: Freight.ContractClearanceView | Freight.ClearanceView | null;
+  tradeDirection?: string;
+  compact?: boolean;
+}) {
+  const phases = tradeDirection === "EXPORT" ? EXPORT_PHASES : IMPORT_PHASES;
+  const current = clearance?.phase ?? phases[0];
+  const activeIdx = phaseIndex(phases, current);
+
+  return (
+    <Group gap={0} wrap="nowrap" align="flex-start" style={{ overflowX: "auto" }}>
+      {phases.map((phase, index) => {
+        const isComplete = index < activeIdx;
+        const isActive = index === activeIdx;
+        const isLast = index === phases.length - 1;
+
+        return (
+          <Box key={phase} style={{ flex: isLast ? "0 0 auto" : 1, minWidth: compact ? 72 : 88 }}>
+            <Group gap={0} wrap="nowrap" align="center">
+              <Stack gap={4} align="center" style={{ flexShrink: 0 }}>
+                <Box
+                  style={{
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    width: compact ? 28 : 34,
+                    height: compact ? 28 : 34,
+                    borderRadius: "50%",
+                    background: isComplete ? BRAND_GREEN : isActive ? "white" : "var(--mantine-color-gray-1)",
+                    border: isActive
+                      ? `2px solid ${BRAND_GREEN}`
+                      : isComplete
+                        ? "2px solid transparent"
+                        : "2px solid var(--mantine-color-gray-3)",
+                    color: isComplete ? "white" : isActive ? BRAND_GREEN : "var(--mantine-color-gray-5)",
+                  }}
+                >
+                  {isComplete ? <Check size={compact ? 14 : 16} strokeWidth={3} /> : null}
+                </Box>
+                <Text
+                  size={compact ? "10px" : "xs"}
+                  fw={isActive ? 600 : 500}
+                  c={isActive ? "edr-green.7" : isComplete ? "dark" : "dimmed"}
+                  ta="center"
+                  style={{ whiteSpace: "nowrap" }}
+                >
+                  {PHASE_LABELS[phase] ?? phase}
+                </Text>
+              </Stack>
+              {!isLast && (
+                <Box
+                  style={{
+                    flex: 1,
+                    height: 2,
+                    marginInline: 6,
+                    marginBottom: compact ? 16 : 20,
+                    borderRadius: 2,
+                    background: isComplete ? BRAND_GREEN : "var(--mantine-color-gray-2)",
+                  }}
+                />
+              )}
+            </Group>
+          </Box>
+        );
+      })}
+    </Group>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/ClearanceUploadedDocumentsPanel.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/ClearanceUploadedDocumentsPanel.tsx
new file mode 100644
index 000000000..1abffa761
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/ClearanceUploadedDocumentsPanel.tsx
@@ -0,0 +1,205 @@
+import { useMemo } from "react";
+import { Badge, Box, Stack, Tabs, Text, ThemeIcon } from "@mantine/core";
+import { FileText, Receipt, Ship, Truck } from "lucide-react";
+import type { Freight } from "@edr/types";
+
+import { SectionCard } from "@/components/bookings/detail/SectionCard";
+import { PhasedUploadedFileRow } from "@/components/contracts/PhasedUploadedFileRow";
+
+type TabValue = Freight.ClearanceWorkflowFileCategory;
+
+type TabConfig = {
+  value: TabValue;
+  label: string;
+  icon: typeof FileText;
+  emptyHint: string;
+};
+
+function tabConfigForTradeDirection(tradeDirection: string): TabConfig[] {
+  if (tradeDirection === "EXPORT") {
+    return [
+      {
+        value: "declaration",
+        label: "Declaration",
+        icon: FileText,
+        emptyHint: "No declaration uploaded yet.",
+      },
+      {
+        value: "djibouti",
+        label: "Release order",
+        icon: Ship,
+        emptyHint: "No release order uploaded yet.",
+      },
+      {
+        value: "transit",
+        label: "Transit Permit",
+        icon: Truck,
+        emptyHint: "No transit permit uploaded yet.",
+      },
+    ];
+  }
+
+  return [
+    {
+      value: "declaration",
+      label: "Declaration",
+      icon: FileText,
+      emptyHint: "No declaration uploaded yet.",
+    },
+    {
+      value: "duty",
+      label: "Duty notice",
+      icon: Receipt,
+      emptyHint: "No duty notice or payment slip uploaded yet.",
+    },
+    {
+      value: "transit",
+      label: "Transit permit",
+      icon: Truck,
+      emptyHint: "No transit permit uploaded yet.",
+    },
+  ];
+}
+
+function subtitleForTradeDirection(tradeDirection: string): string {
+  return tradeDirection === "EXPORT"
+    ? "Declaration, release order, and transit permit files for this clearance."
+    : "Declaration, duty notice, and transit permit files for this clearance.";
+}
+
+function footerHintForTradeDirection(tradeDirection: string): string {
+  return tradeDirection === "EXPORT"
+    ? "Files appear here once GL uploads the declaration and release order, and after booking when the transit permit is uploaded."
+    : "Files appear here once GL Ethiopia uploads declaration, duty notice, or transit permit documents.";
+}
+
+export interface ClearanceUploadedDocumentsPanelProps {
+  files: Freight.ClearanceWorkflowFile[];
+  tradeDirection?: string;
+  onView: (file: { name: string; url: string }) => void;
+  onDownload?: (file: { id: string; name: string }) => void;
+}
+
+export function ClearanceUploadedDocumentsPanel({
+  files,
+  tradeDirection = "IMPORT",
+  onView,
+  onDownload,
+}: ClearanceUploadedDocumentsPanelProps) {
+  const tabConfig = useMemo(
+    () => tabConfigForTradeDirection(tradeDirection),
+    [tradeDirection],
+  );
+  const isExport = tradeDirection === "EXPORT";
+
+  const visibleFiles = useMemo(
+    () =>
+      isExport ? files.filter((f) => f.category !== "duty") : files,
+    [files, isExport],
+  );
+
+  const uploadedCount = visibleFiles.filter((f) => f.file).length;
+
+  const defaultTab =
+    tabConfig.find((tab) =>
+      visibleFiles.some((f) => f.category === tab.value && f.file),
+    )?.value ?? tabConfig[0]?.value ?? "declaration";
+
+  return (
+    <SectionCard
+      icon={FileText}
+      title="Uploaded customs documents"
+      subtitle={subtitleForTradeDirection(tradeDirection)}
+      accent="edr-green"
+    >
+      <Tabs defaultValue={defaultTab} keepMounted={false}>
+        <Tabs.List mb="md">
+          {tabConfig.map((tab) => {
+            const count = visibleFiles.filter(
+              (f) => f.category === tab.value && f.file,
+            ).length;
+            const Icon = tab.icon;
+            return (
+              <Tabs.Tab
+                key={tab.value}
+                value={tab.value}
+                leftSection={<Icon size={14} />}
+                rightSection={
+                  count > 0 ? (
+                    <Badge size="xs" variant="light" color="edr-green" circle>
+                      {count}
+                    </Badge>
+                  ) : undefined
+                }
+              >
+                {tab.label}
+              </Tabs.Tab>
+            );
+          })}
+        </Tabs.List>
+
+        {tabConfig.map((tab) => {
+          const items = visibleFiles.filter(
+            (f) => f.category === tab.value && f.file,
+          );
+          const Icon = tab.icon;
+
+          return (
+            <Tabs.Panel key={tab.value} value={tab.value}>
+              {items.length > 0 ? (
+                <Stack gap="sm">
+                  {items.map((item) => (
+                    <PhasedUploadedFileRow
+                      key={item.code}
+                      label={item.label}
+                      file={item.file!}
+                      onView={onView}
+                      onDownload={onDownload}
+                    />
+                  ))}
+                </Stack>
+              ) : (
+                <EmptyTabState icon={Icon} hint={tab.emptyHint} />
+              )}
+            </Tabs.Panel>
+          );
+        })}
+      </Tabs>
+
+      {uploadedCount === 0 ? (
+        <Text size="xs" c="dimmed" mt="md">
+          {footerHintForTradeDirection(tradeDirection)}
+        </Text>
+      ) : null}
+    </SectionCard>
+  );
+}
+
+function EmptyTabState({
+  icon: Icon,
+  hint,
+}: {
+  icon: typeof FileText;
+  hint: string;
+}) {
+  return (
+    <Box
+      py={40}
+      style={{
+        borderRadius: 12,
+        border: "1px dashed var(--mantine-color-gray-4)",
+        background: "var(--mantine-color-gray-0)",
+        textAlign: "center",
+      }}
+    >
+      <Stack gap={8} align="center">
+        <ThemeIcon variant="light" color="gray" radius="xl" size={44}>
+          <Icon size={20} />
+        </ThemeIcon>
+        <Text size="sm" c="dimmed" maw={320}>
+          {hint}
+        </Text>
+      </Stack>
+    </Box>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/ClearanceWorkflowFilesPanel.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/ClearanceWorkflowFilesPanel.tsx
new file mode 100644
index 000000000..17e5e4b70
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/ClearanceWorkflowFilesPanel.tsx
@@ -0,0 +1,155 @@
+import {
+  Badge,
+  Box,
+  Button,
+  Group,
+  Paper,
+  Stack,
+  Text,
+  ThemeIcon,
+  Tooltip,
+} from "@mantine/core";
+import { Download, Eye, FileText } from "lucide-react";
+import type { Freight } from "@edr/types";
+import { isViewable } from "@edr/ui-common";
+
+import { SectionCard } from "@/components/bookings/detail/SectionCard";
+import { fileViewUrl } from "@/constants/apiConfig";
+
+const CATEGORY_LABELS: Record<
+  Freight.ClearanceWorkflowFileCategory,
+  string
+> = {
+  declaration: "Declaration",
+  duty: "Duty & taxes",
+  transit: "Transit",
+  djibouti: "Djibouti",
+};
+
+const CATEGORY_ORDER: Freight.ClearanceWorkflowFileCategory[] = [
+  "declaration",
+  "duty",
+  "transit",
+  "djibouti",
+];
+
+const OWNER_LABELS: Record<Freight.ClearanceWorkflowFileOwner, string> = {
+  customer: "Customer",
+  gl_et: "GL Ethiopia",
+  gl_dj: "GL Djibouti",
+};
+
+export interface ClearanceWorkflowFilesPanelProps {
+  files: Freight.ClearanceWorkflowFile[];
+  onView: (file: { name: string; url: string }) => void;
+  onDownload?: (file: { id: string; name: string }) => void;
+  title?: string;
+}
+
+export function ClearanceWorkflowFilesPanel({
+  files,
+  onView,
+  onDownload,
+  title = "Customs workflow documents",
+}: ClearanceWorkflowFilesPanelProps) {
+  if (files.length === 0) return null;
+
+  const grouped = CATEGORY_ORDER.map((category) => ({
+    category,
+    label: CATEGORY_LABELS[category],
+    items: files.filter((f) => f.category === category),
+  })).filter((g) => g.items.length > 0);
+
+  return (
+    <SectionCard icon={FileText} title={title} accent="edr-green">
+      <Stack gap="md">
+        {grouped.map((group) => (
+          <Box key={group.category}>
+            <Text size="xs" fw={700} c="dimmed" tt="uppercase" mb={8}>
+              {group.label}
+            </Text>
+            <Stack gap={8}>
+              {group.items.map((item) => (
+                <WorkflowFileRow
+                  key={item.code}
+                  item={item}
+                  onView={onView}
+                  onDownload={onDownload}
+                />
+              ))}
+            </Stack>
+          </Box>
+        ))}
+      </Stack>
+    </SectionCard>
+  );
+}
+
+function WorkflowFileRow({
+  item,
+  onView,
+  onDownload,
+}: {
+  item: Freight.ClearanceWorkflowFile;
+  onView: (file: { name: string; url: string }) => void;
+  onDownload?: (file: { id: string; name: string }) => void;
+}) {
+  const file = item.file;
+  if (!file) return null;
+
+  const viewUrl = fileViewUrl(file.id);
+  const canPreview = isViewable({ name: file.name, url: viewUrl });
+
+  return (
+    <Paper withBorder radius="md" p="sm">
+      <Group justify="space-between" wrap="nowrap" align="center">
+        <Group gap={10} wrap="nowrap" style={{ minWidth: 0 }}>
+          <ThemeIcon variant="light" color="edr-green" radius="md" size={36}>
+            <FileText size={17} />
+          </ThemeIcon>
+          <Box style={{ minWidth: 0 }}>
+            <Text size="sm" fw={600} truncate>
+              {item.label}
+            </Text>
+            <Group gap={6} wrap="nowrap" mt={2}>
+              <Badge size="xs" variant="light" color="gray" radius="sm" tt="none">
+                {OWNER_LABELS[item.uploadedBy]}
+              </Badge>
+              <Text size="xs" c="dimmed" truncate>
+                {file.name}
+              </Text>
+            </Group>
+          </Box>
+        </Group>
+        <Group gap={6} wrap="nowrap">
+          {canPreview ? (
+            <Tooltip label="Preview">
+              <Button
+                size="compact-xs"
+                variant="default"
+                radius="md"
+                leftSection={<Eye size={13} />}
+                onClick={() => onView({ name: file.name, url: viewUrl })}
+              >
+                View
+              </Button>
+            </Tooltip>
+          ) : null}
+          {onDownload ? (
+            <Tooltip label="Download">
+              <Button
+                size="compact-xs"
+                variant="light"
+                radius="md"
+                leftSection={<Download size={13} />}
+                onClick={() => onDownload({ id: file.id, name: file.name })}
+              >
+                Download
+              </Button>
+            </Tooltip>
+          ) : null}
+        </Group>
+      </Group>
+    </Paper>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/ContractApprovalStepsCard.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/ContractApprovalStepsCard.tsx
index 7a3dd897e..0d7adc5be 100644
--- a/apps/edr-freight-web/backoffice/src/components/contracts/ContractApprovalStepsCard.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/ContractApprovalStepsCard.tsx
@@ -1,6 +1,14 @@
-import { useMemo } from "react";
+import { useMemo, useState } from "react";
 import { Check, ShieldCheck } from "lucide-react";
-import { Stack, Group, Text, Badge, Button, Box } from "@mantine/core";
+import {
+  Stack,
+  Group,
+  Text,
+  Badge,
+  Button,
+  Box,
+  Modal,
+} from "@mantine/core";
 import type { Freight } from "@edr/types";
 
 import { formatContractApprovalProgress } from "@/features/contracts/contract-approval-progress";
@@ -19,6 +27,10 @@ export function ContractApprovalStepsCard({
   contract,
   mutations,
 }: ContractApprovalStepsCardProps) {
+  const [confirmOpen, setConfirmOpen] = useState(false);
+  const [pendingStep, setPendingStep] =
+    useState<Freight.IContractApprovalStep | null>(null);
+
   const steps = useMemo(
     () =>
       [...(contract.approvalSteps ?? [])].sort(
@@ -30,6 +42,24 @@ export function ContractApprovalStepsCard({
   const nextPending = steps.find((s) => s.status === "PENDING");
   const summary = formatContractApprovalProgress(contract.status, steps);
 
+  const openApprove = (step: Freight.IContractApprovalStep) => {
+    setPendingStep(step);
+    setConfirmOpen(true);
+  };
+
+  const closeApprove = () => {
+    setConfirmOpen(false);
+    setPendingStep(null);
+  };
+
+  const runApprove = () => {
+    if (!pendingStep) return;
+    mutations.approveStep.mutate(
+      { stepId: pendingStep.id, requiredRole: pendingStep.requiredRole },
+      { onSuccess: () => closeApprove() },
+    );
+  };
+
   const subtitle =
     summary.detail ||
     (nextPending
@@ -39,54 +69,87 @@ export function ContractApprovalStepsCard({
         : "Accept submission to begin");
 
   return (
-    <SectionCard
-      icon={ShieldCheck}
-      title="Approval chain"
-      extra={
-        <Badge color="edr-green" variant="light" radius="sm">
-          {steps.filter((s) => s.status === "APPROVED").length}/{steps.length}
-        </Badge>
-      }
-    >
-      <Text size="xs" c="dimmed" mb="sm">
-        {subtitle}
-      </Text>
-
-      {steps.length === 0 ? (
-        <Text
-          size="sm"
-          c="dimmed"
-          ta="center"
-          py="lg"
-          px="md"
-          style={{
-            borderRadius: 8,
-            border: "1px dashed var(--mantine-color-gray-3)",
-            background: "var(--mantine-color-gray-0)",
-          }}
-        >
-          Use <strong>Accept for approval</strong> in staff actions to
-          instantiate steps.
+    <>
+      <SectionCard
+        icon={ShieldCheck}
+        title="Approval chain"
+        extra={
+          <Badge color="edr-green" variant="light" radius="sm">
+            {steps.filter((s) => s.status === "APPROVED").length}/{steps.length}
+          </Badge>
+        }
+      >
+        <Text size="xs" c="dimmed" mb="sm">
+          {subtitle}
         </Text>
-      ) : (
-        <Stack gap="xs">
-          {steps.map((step) => (
-            <StepRow
-              key={step.id}
-              step={step}
-              isNext={nextPending?.id === step.id}
-              isPending={mutations.approveStep.isPending}
-              onApprove={() =>
-                mutations.approveStep.mutate({
-                  stepId: step.id,
-                  requiredRole: step.requiredRole,
-                })
-              }
-            />
-          ))}
+
+        {steps.length === 0 ? (
+          <Text
+            size="sm"
+            c="dimmed"
+            ta="center"
+            py="lg"
+            px="md"
+            style={{
+              borderRadius: 8,
+              border: "1px dashed var(--mantine-color-gray-3)",
+              background: "var(--mantine-color-gray-0)",
+            }}
+          >
+            Use <strong>Accept for approval</strong> in staff actions to
+            instantiate steps.
+          </Text>
+        ) : (
+          <Stack gap="xs">
+            {steps.map((step) => (
+              <StepRow
+                key={step.id}
+                step={step}
+                isNext={nextPending?.id === step.id}
+                isPending={mutations.approveStep.isPending}
+                onApprove={() => openApprove(step)}
+              />
+            ))}
+          </Stack>
+        )}
+      </SectionCard>
+
+      <Modal
+        opened={confirmOpen}
+        onClose={closeApprove}
+        title="Approve this step?"
+        radius="md"
+        centered
+      >
+        <Stack gap="md">
+          <Text size="sm" c="dimmed">
+            You are about to approve the{" "}
+            <Text span fw={600} c="dark">
+              {pendingStep?.requiredRole}
+            </Text>{" "}
+            step for contract{" "}
+            <Text span fw={600} c="dark">
+              {contract.reference}
+            </Text>
+            . This action cannot be undone from this screen.
+          </Text>
+          <Group justify="flex-end" gap="sm">
+            <Button variant="default" radius="md" onClick={closeApprove}>
+              Cancel
+            </Button>
+            <Button
+              color="edr-green"
+              radius="md"
+              leftSection={<Check size={16} />}
+              loading={mutations.approveStep.isPending}
+              onClick={runApprove}
+            >
+              Confirm approval
+            </Button>
+          </Group>
         </Stack>
-      )}
-    </SectionCard>
+      </Modal>
+    </>
   );
 }
 
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/ContractClearanceReviewSection.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/ContractClearanceReviewSection.tsx
index c660bb928..36b18bbec 100644
--- a/apps/edr-freight-web/backoffice/src/components/contracts/ContractClearanceReviewSection.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/ContractClearanceReviewSection.tsx
@@ -54,6 +54,21 @@ export interface ContractClearanceReviewSectionProps {
    * by whom, when) but hide all approve / query / finalize actions.
    */
   readOnly?: boolean;
+  /**
+   * Document approvals are locked (e.g. after all docs approved in phased flow)
+   * but queries remain available until {@link queriesLocked} or {@link readOnly}.
+   */
+  approvalsLocked?: boolean;
+  /**
+   * Pre-clearance finalized — block opening new queries on customer documents.
+   */
+  queriesLocked?: boolean;
+  /**
+   * ONE_TIME customs contracts use the phased milestone workflow. Hides the
+   * legacy "Finalize clearance" shortcut; booking readiness follows delivery
+   * order (import) or export release.
+   */
+  phasedCustoms?: boolean;
 }
 
 const STATUS_META: Record<
@@ -89,6 +104,9 @@ export function ContractClearanceReviewSection({
   hideSummary,
   selfClear = false,
   readOnly = false,
+  phasedCustoms = false,
+  approvalsLocked = false,
+  queriesLocked = false,
 }: ContractClearanceReviewSectionProps) {
   const [queryNotes, setQueryNotes] = useState<Record<string, string>>({});
   const [openQuery, setOpenQuery] = useState<Record<string, boolean>>({});
@@ -137,6 +155,11 @@ export function ContractClearanceReviewSection({
     .filter((d) => d.file && d.reviewStatus !== "APPROVED")
     .map((d) => d.fileKey);
 
+  const hasDocsAwaitingApproval = customerDocs.some(
+    (d) => d.file && d.reviewStatus !== "APPROVED",
+  );
+  const effectiveApprovalsLocked = approvalsLocked && !hasDocsAwaitingApproval;
+
   if (isLoading || !clearance) {
     return (
       <Group justify="center" py="xl" gap={10}>
@@ -170,14 +193,16 @@ export function ContractClearanceReviewSection({
         subtitle={
           readOnly
             ? `Reviewed by the ${reviewerTeam} team.`
-            : "Approve each document, or open a query to tell the customer what to fix."
+            : effectiveApprovalsLocked
+              ? "Documents are approved — you can still open a query if something needs fixing."
+              : "Approve each document, or open a query to tell the customer what to fix."
         }
         extra={
           <Group gap={10} wrap="nowrap" align="center">
             <Text size="xs" c="dimmed" fw={600}>
               {stats.approved}/{stats.total} approved
             </Text>
-            {!readOnly && approvableKeys.length > 0 && (
+            {!readOnly && !effectiveApprovalsLocked && approvableKeys.length > 0 && (
               <Button
                 size="compact-sm"
                 color="edr-green"
@@ -221,6 +246,8 @@ export function ContractClearanceReviewSection({
                 doc={doc}
                 reviewerTeam={reviewerTeam}
                 readOnly={readOnly}
+                approvalsLocked={effectiveApprovalsLocked}
+                queriesLocked={queriesLocked}
                 note={queryNotes[doc.fileKey] ?? ""}
                 queryOpen={openQuery[doc.fileKey] ?? false}
                 onToggleQuery={(open) =>
@@ -241,7 +268,7 @@ export function ContractClearanceReviewSection({
         </Stack>
       </SectionCard>
 
-      {glDocs.length > 0 && (
+      {glDocs.length > 0 && !phasedCustoms && (
         <SectionCard
           icon={Upload}
           title="GL output documents"
@@ -372,8 +399,42 @@ export function ContractClearanceReviewSection({
               <CheckCircle2 size={15} />
             </ThemeIcon>
             <Text fz="12.5px" c="dimmed">
-              Clearance was finalized by the {reviewerTeam} team. This is a
-              read-only record of the approved documents.
+              {phasedCustoms
+                ? "Document review is complete. Continue customs milestones in the action panel."
+                : `Clearance was finalized by the ${reviewerTeam} team. This is a read-only record of the approved documents.`}
+            </Text>
+          </Group>
+        </Paper>
+      ) : phasedCustoms && effectiveApprovalsLocked ? (
+        <Paper withBorder radius="md" p="md">
+          <Group gap={8} wrap="nowrap" style={{ minWidth: 0 }}>
+            <ThemeIcon variant="light" color="edr-green" radius="md" size={28}>
+              <CheckCircle2 size={15} />
+            </ThemeIcon>
+            <Text fz="12.5px" c="dimmed">
+              Document review is complete. Use the action panel for declaration, duty, and
+              transit steps
+              {queriesLocked
+                ? ". Pre-clearance is finalized — customer documents can no longer be queried."
+                : " — or open a query above if a customer document needs correction."}
+            </Text>
+          </Group>
+        </Paper>
+      ) : phasedCustoms ? (
+        <Paper withBorder radius="md" p="md">
+          <Group gap={8} wrap="nowrap" style={{ minWidth: 0 }}>
+            <ThemeIcon
+              variant="light"
+              color={clearance.allApproved ? "edr-green" : "gray"}
+              radius="md"
+              size={28}
+            >
+              <FileCheck2 size={15} />
+            </ThemeIcon>
+            <Text fz="12.5px" c="dimmed">
+              {clearance.allApproved
+                ? "All required documents are approved. Continue declaration, duty, and transit in the action panel."
+                : "Approve every required document to unlock the customs milestone steps."}
             </Text>
           </Group>
         </Paper>
@@ -450,6 +511,8 @@ function DocReviewCard({
   doc,
   reviewerTeam,
   readOnly,
+  approvalsLocked,
+  queriesLocked,
   note,
   queryOpen,
   onToggleQuery,
@@ -462,6 +525,8 @@ function DocReviewCard({
   doc: Freight.ContractClearanceDocument;
   reviewerTeam: string;
   readOnly: boolean;
+  approvalsLocked: boolean;
+  queriesLocked: boolean;
   note: string;
   queryOpen: boolean;
   onToggleQuery: (open: boolean) => void;
@@ -583,31 +648,35 @@ function DocReviewCard({
         </Alert>
       )}
 
-      {!readOnly && hasFile && !isApproved && (
+      {!readOnly && hasFile && (
         <Box mt="sm">
           {!queryOpen ? (
             <Group justify="flex-end" gap={8}>
-              <Button
-                size="sm"
-                variant="light"
-                color="red"
-                radius="md"
-                leftSection={<MessageSquareWarning size={15} />}
-                disabled={busy}
-                onClick={() => onToggleQuery(true)}
-              >
-                Open query
-              </Button>
-              <Button
-                size="sm"
-                color="edr-green"
-                radius="md"
-                leftSection={<CheckCircle2 size={15} />}
-                disabled={busy}
-                onClick={onApprove}
-              >
-                Approve
-              </Button>
+              {!queriesLocked && (
+                <Button
+                  size="sm"
+                  variant="light"
+                  color="red"
+                  radius="md"
+                  leftSection={<MessageSquareWarning size={15} />}
+                  disabled={busy}
+                  onClick={() => onToggleQuery(true)}
+                >
+                  Open query
+                </Button>
+              )}
+              {!isApproved && !approvalsLocked && (
+                <Button
+                  size="sm"
+                  color="edr-green"
+                  radius="md"
+                  leftSection={<CheckCircle2 size={15} />}
+                  disabled={busy}
+                  onClick={onApprove}
+                >
+                  Approve
+                </Button>
+              )}
             </Group>
           ) : (
             <Box
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/ContractSignSuccessModal.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/ContractSignSuccessModal.tsx
new file mode 100644
index 000000000..de488b87d
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/ContractSignSuccessModal.tsx
@@ -0,0 +1,43 @@
+import { Button, Group, Modal, Stack, Text, ThemeIcon } from "@mantine/core";
+import { CheckCircle2 } from "lucide-react";
+
+export interface ContractSignSuccessModalProps {
+  opened: boolean;
+  onClose: () => void;
+  reference: string;
+  message?: string;
+  confirmLabel?: string;
+}
+
+export function ContractSignSuccessModal({
+  opened,
+  onClose,
+  reference,
+  message = "The contract has been signed and recorded.",
+  confirmLabel = "Back to contract request",
+}: ContractSignSuccessModalProps) {
+  return (
+    <Modal
+      opened={opened}
+      onClose={onClose}
+      title="Contract signed successfully"
+      centered
+      radius="lg"
+    >
+      <Stack gap="md" align="center" ta="center">
+        <ThemeIcon size={56} radius="xl" color="edr-green" variant="light">
+          <CheckCircle2 size={28} />
+        </ThemeIcon>
+        <Text fw={600}>{reference}</Text>
+        <Text size="sm" c="dimmed">
+          {message}
+        </Text>
+        <Group justify="center" mt="xs">
+          <Button color="edr-green" onClick={onClose}>
+            {confirmLabel}
+          </Button>
+        </Group>
+      </Stack>
+    </Modal>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/GlClearanceUploadModal.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/GlClearanceUploadModal.tsx
new file mode 100644
index 000000000..b33729bf1
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/GlClearanceUploadModal.tsx
@@ -0,0 +1,154 @@
+import { useState } from "react";
+import { Button, Group, Modal, Stack, Text } from "@mantine/core";
+import { DateInput } from "@mantine/dates";
+import { Ship, Upload } from "lucide-react";
+import toast from "react-hot-toast";
+
+import { PhasedFileDropzone } from "@/components/contracts/PhasedFileDropzone";
+import { findWorkflowFile } from "@/components/contracts/PhasedUploadedFileRow";
+import { contractsService } from "@/services/contracts.service";
+import { bookingsService } from "@/services/bookings.service";
+import type { Freight } from "@edr/types";
+
+export type GlClearanceUploadKind = "do" | "ro";
+
+export interface GlClearanceUploadModalProps {
+  opened: boolean;
+  kind: GlClearanceUploadKind | null;
+  onClose: () => void;
+  entityId: string;
+  isBooking: boolean;
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  vesselDepartureDate?: string | null;
+  onSuccess?: () => void;
+  onPreview?: (file: { name: string; url: string }) => void;
+}
+
+export function GlClearanceUploadModal({
+  opened,
+  kind,
+  onClose,
+  entityId,
+  isBooking,
+  workflowFiles = [],
+  vesselDepartureDate,
+  onSuccess,
+  onPreview,
+}: GlClearanceUploadModalProps) {
+  const [file, setFile] = useState<File | null>(null);
+  const [vesselDate, setVesselDate] = useState<Date | null>(
+    vesselDepartureDate ? new Date(vesselDepartureDate) : null,
+  );
+  const [loading, setLoading] = useState(false);
+
+  const isDo = kind === "do";
+  const isRo = kind === "ro";
+  const replaceMode = isDo
+    ? Boolean(findWorkflowFile(workflowFiles, "delivery_order"))
+    : Boolean(findWorkflowFile(workflowFiles, "release_order"));
+
+  const close = () => {
+    setFile(null);
+    onClose();
+  };
+
+  const submit = async () => {
+    if (!file || !kind) return;
+    if (isRo && !vesselDate) {
+      toast.error("Vessel departure date is required.");
+      return;
+    }
+
+    setLoading(true);
+    try {
+      if (isDo) {
+        if (isBooking) {
+          await bookingsService.uploadDeliveryOrder(entityId, file);
+        } else {
+          await contractsService.uploadDeliveryOrder(entityId, file);
+        }
+        toast.success(replaceMode ? "Delivery Order updated" : "Delivery Order uploaded");
+      } else {
+        const iso = vesselDate!.toISOString().slice(0, 10);
+        const result = isBooking
+          ? await bookingsService.uploadReleaseOrder(entityId, file, iso)
+          : await contractsService.uploadReleaseOrder(entityId, file, iso);
+        if (result.hold) {
+          toast.error(result.holdReason ?? "Vessel date too soon");
+        } else {
+          toast.success(replaceMode ? "Release Order updated" : "Release Order uploaded");
+        }
+      }
+      setFile(null);
+      onSuccess?.();
+      close();
+    } catch (e) {
+      toast.error(e instanceof Error ? e.message : "Upload failed");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Modal
+      opened={opened && kind != null}
+      onClose={close}
+      title={
+        <Group gap={8}>
+          <Ship size={18} />
+          <Text fw={700}>{isDo ? "Upload Delivery Order" : "Upload Release Order"}</Text>
+        </Group>
+      }
+      radius="md"
+      size="md"
+    >
+      <Stack gap="md">
+        <Text size="sm" c="dimmed">
+          {isDo
+            ? "Upload the Djibouti Delivery Order (DO) for this import shipment."
+            : "Upload the Release Order and confirm the vessel departure date."}
+        </Text>
+
+        {isRo ? (
+          <DateInput
+            label="Vessel departure date"
+            value={vesselDate}
+            onChange={(v) => setVesselDate(v ? new Date(v) : null)}
+            size="sm"
+            required
+          />
+        ) : null}
+
+        <PhasedFileDropzone
+          label={isDo ? "Delivery Order file" : "Release Order file"}
+          description="PDF or image."
+          value={file}
+          onChange={setFile}
+          replaceMode={replaceMode}
+          onPreview={onPreview}
+        />
+
+        <Group justify="flex-end" gap="sm">
+          <Button variant="default" onClick={close} disabled={loading}>
+            Cancel
+          </Button>
+          <Button
+            color="edr-green"
+            loading={loading}
+            disabled={!file || (isRo && !vesselDate)}
+            leftSection={<Upload size={16} />}
+            onClick={() => void submit()}
+          >
+            {replaceMode
+              ? isDo
+                ? "Replace DO"
+                : "Replace RO"
+              : isDo
+                ? "Upload DO"
+                : "Upload RO"}
+          </Button>
+        </Group>
+      </Stack>
+    </Modal>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/GlCreateBookingForm.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/GlCreateBookingForm.tsx
index 676e4840e..f9bd7683d 100644
--- a/apps/edr-freight-web/backoffice/src/components/contracts/GlCreateBookingForm.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/GlCreateBookingForm.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 import {
   useNavigate,
   useParams,
@@ -6,14 +6,11 @@ import {
 } from "react-router-dom";
 import { useQuery } from "@tanstack/react-query";
 import {
-  ActionIcon,
   Alert,
-  Badge,
   Box,
   Button,
   Center,
   Divider,
-  Grid,
   Group,
   Loader,
   Modal,
@@ -28,13 +25,13 @@ import {
 } from "@mantine/core";
 import {
   AlertCircle,
+  CalendarDays,
   CheckCircle2,
-  Container as ContainerIcon,
+  ChevronLeft,
   FileText,
+  MapPin,
   Package,
-  Plus,
   Receipt,
-  Trash2,
   X,
 } from "lucide-react";
 import type { Freight } from "@edr/types";
@@ -43,19 +40,23 @@ import { OperationDatePicker } from "@edr/ui-common";
 import { api } from "@/services/api";
 import { PageContainer } from "@/components/page";
 import { PageHeader } from "@/components/page/PageHeader";
-import { SectionCard } from "@/components/bookings/detail/SectionCard";
 import { contractsService } from "@/services/contracts.service";
 import {
-  useContractCapacity,
   useContractDetail,
   useContractMutations,
 } from "@/hooks/contracts/useContracts";
-import { Boxes } from "lucide-react";
 import {
   computeGlShipmentTotal,
   formatRateUnit,
   type GlShipmentQuantities,
 } from "./gl-booking-form/total";
+import { ContractCapacityNotice } from "./gl-booking-form/ContractCapacityNotice";
+import {
+  fieldStyles,
+  StepCard,
+  StepHeader,
+  StepLabel,
+} from "./gl-booking-form/form-ui";
 
 interface UnitDraft {
   containerNumber: string;
@@ -75,22 +76,28 @@ interface BulkLineDraft {
   cargoWeightTons: number | string;
   itemCount: number | string;
   hazardousQuantity: number | string;
+  reeferQuantity: number | string;
 }
 
 function emptyUnit(): UnitDraft {
   return { containerNumber: "", sealNumber: "", vgmTons: "" };
 }
 
+function bulkUnitOfMeasure(
+  contract: Freight.IContract,
+): "PER_TON" | "PER_ITEM" {
+  const hasPerItem = contract.pricingBreakdown?.lineItems?.some(
+    (li) => li.unit === "per_item",
+  );
+  return hasPerItem ? "PER_ITEM" : "PER_TON";
+}
+
 export default function GlCreateBookingForm() {
   const { id } = useParams<{ id: string }>();
   const [searchParams] = useSearchParams();
-  // When GL accepts a shipment request, the form opens with ?requestId=… so it
-  // can prefill the requested quantities/date and mark the request accepted on
-  // success.
   const requestId = searchParams.get("requestId");
   const navigate = useNavigate();
   const { data: contract, isLoading } = useContractDetail(id);
-  const { data: capacity = [] } = useContractCapacity(id);
   const mutations = useContractMutations(id ?? "");
 
   const { data: bookingRequest } = useQuery({
@@ -105,42 +112,8 @@ export default function GlCreateBookingForm() {
   const [containerLines, setContainerLines] = useState<ContainerLineDraft[]>([]);
   const [bulkLines, setBulkLines] = useState<BulkLineDraft[]>([]);
   const [prefilled, setPrefilled] = useState(false);
-
-  // Prefill once from an accepted shipment request: size/qty container lines
-  // (one blank unit per requested container) + bulk + route + notes. GL still
-  // enters per-unit container numbers + sets the binding shipment date.
-  useEffect(() => {
-    if (!bookingRequest || prefilled) return;
-    setPrefilled(true);
-    const lines = bookingRequest.requestedLines ?? {};
-    if (lines.containers?.length) {
-      setContainerLines(
-        lines.containers.map((c) => ({
-          containerSize: c.containerSize,
-          hazardousQuantity: c.hazardousQuantity ?? "",
-          reeferQuantity: c.reeferQuantity ?? "",
-          units: Array.from({ length: Math.max(1, c.quantity) }, () =>
-            emptyUnit(),
-          ),
-        })),
-      );
-    } else if (lines.bulk) {
-      setBulkLines([
-        {
-          cargoTypeId: lines.bulk.cargoTypeId ?? "",
-          cargoWeightTons: lines.bulk.cargoWeightTons ?? "",
-          itemCount: lines.bulk.itemCount ?? "",
-          hazardousQuantity: lines.bulk.hazardousQuantity ?? "",
-        },
-      ]);
-    }
-    if (bookingRequest.contractRouteId)
-      setContractRouteId(bookingRequest.contractRouteId);
-    if (bookingRequest.notes) setNotes(bookingRequest.notes);
-  }, [bookingRequest, prefilled]);
-  // Price-confirm modal — GL reviews the estimate before booking on behalf of
-  // the customer, mirroring the portal customer flow.
   const [priceOpen, setPriceOpen] = useState(false);
+  const seededRef = useRef(false);
 
   const isContainer = contract?.freightType === "CONTAINER";
   const routes = useMemo(
@@ -158,7 +131,6 @@ export default function GlCreateBookingForm() {
     return [...sizes];
   }, [contract?.cargoScope]);
 
-  // Bulk cargo types declared on the contract scope (prefill, no free-text).
   const bulkCargoOptions = useMemo(() => {
     const seen = new Map<string, string>();
     (contract?.cargoScope ?? []).forEach((s) => {
@@ -172,11 +144,73 @@ export default function GlCreateBookingForm() {
 
   const defaultBulkCargoTypeId = bulkCargoOptions[0]?.value ?? "";
 
-  // Normalized quantities for the client-side price estimate (same source the
-  // portal customer sees: the contract's frozen unit rates × entered qty).
+  useEffect(() => {
+    if (!bookingRequest || prefilled) return;
+    setPrefilled(true);
+    const lines = bookingRequest.requestedLines ?? {};
+    if (lines.containers?.length) {
+      setContainerLines(
+        lines.containers.map((c) => ({
+          containerSize: c.containerSize,
+          hazardousQuantity: c.hazardousQuantity ?? "0",
+          reeferQuantity: c.reeferQuantity ?? "",
+          units: Array.from({ length: Math.max(1, c.quantity) }, () =>
+            emptyUnit(),
+          ),
+        })),
+      );
+    } else if (lines.bulk) {
+      setBulkLines([
+        {
+          cargoTypeId: lines.bulk.cargoTypeId ?? defaultBulkCargoTypeId,
+          cargoWeightTons: lines.bulk.cargoWeightTons ?? "",
+          itemCount: lines.bulk.itemCount ?? "",
+          hazardousQuantity: lines.bulk.hazardousQuantity ?? "0",
+          reeferQuantity: "",
+        },
+      ]);
+    }
+    if (bookingRequest.contractRouteId)
+      setContractRouteId(bookingRequest.contractRouteId);
+    if (bookingRequest.notes) setNotes(bookingRequest.notes);
+  }, [bookingRequest, prefilled, defaultBulkCargoTypeId]);
+
+  useEffect(() => {
+    if (!contract || prefilled || seededRef.current) return;
+    seededRef.current = true;
+    if (isContainer && containerSizes.length > 0 && containerLines.length === 0) {
+      setContainerLines(
+        containerSizes.map((size) => ({
+          containerSize: size,
+          hazardousQuantity: "0",
+          reeferQuantity: "0",
+          units: [emptyUnit()],
+        })),
+      );
+    } else if (!isContainer && bulkLines.length === 0) {
+      setBulkLines([
+        {
+          cargoTypeId: defaultBulkCargoTypeId,
+          cargoWeightTons: "",
+          itemCount: "",
+          hazardousQuantity: "0",
+          reeferQuantity: "0",
+        },
+      ]);
+    }
+  }, [
+    contract,
+    prefilled,
+    isContainer,
+    containerSizes,
+    containerLines.length,
+    bulkLines.length,
+    defaultBulkCargoTypeId,
+  ]);
+
   const quantities: GlShipmentQuantities = useMemo(
     () => ({
-      isContainer,
+      isContainer: Boolean(isContainer),
       containers: containerLines.map((l) => ({
         containerSize: l.containerSize,
         quantity: l.units.length,
@@ -200,17 +234,11 @@ export default function GlCreateBookingForm() {
     [contract, quantities],
   );
 
-  // The route this shipment ships on (for the cargo-aware day list). For a
-  // single-route contract there's exactly one; for GENERAL multi-route, the
-  // selected route (defaults to the first).
   const selectedRoute = useMemo(
     () => routes.find((r) => r.id === contractRouteId) ?? routes[0],
     [routes, contractRouteId],
   );
 
-  // Cargo-aware availability query: only days where a train has remaining
-  // capacity AND enough matching-type wagons for the entered cargo. Null until
-  // the cargo is entered (so the Schedule section stays empty first).
   const cargoQuery = useMemo<Freight.AvailableDaysForCargoQuery | null>(() => {
     if (!selectedRoute?.originYardId || !selectedRoute?.destinationYardId)
       return null;
@@ -247,18 +275,113 @@ export default function GlCreateBookingForm() {
 
   const { data: availableDays, isLoading: daysLoading } = useQuery({
     ...api.trainScheduling.availableDaysForCargo.queryOptions({
-      input: cargoQuery ?? {
-        freightType: "BULK" as const,
-      },
+      input: cargoQuery ?? { freightType: "BULK" as const },
     }),
     enabled: cargoQuery !== null,
   });
 
+  const syncUnits = (lineIdx: number, qty: number) => {
+    setContainerLines((prev) =>
+      prev.map((line, i) => {
+        if (i !== lineIdx) return line;
+        const next = [...line.units];
+        while (next.length < qty) next.push(emptyUnit());
+        next.length = Math.max(0, qty);
+        return { ...line, units: next };
+      }),
+    );
+  };
+
+  const patchLine = (idx: number, patch: Partial<ContainerLineDraft>) =>
+    setContainerLines((prev) =>
+      prev.map((l, i) => (i === idx ? { ...l, ...patch } : l)),
+    );
+
+  const patchUnit = (
+    lineIdx: number,
+    unitIdx: number,
+    patch: Partial<UnitDraft>,
+  ) =>
+    patchLine(lineIdx, {
+      units: containerLines[lineIdx].units.map((u, i) =>
+        i === unitIdx ? { ...u, ...patch } : u,
+      ),
+    });
+
+  const patchBulk = (idx: number, patch: Partial<BulkLineDraft>) =>
+    setBulkLines((prev) =>
+      prev.map((l, i) => (i === idx ? { ...l, ...patch } : l)),
+    );
+
+  const canSubmit =
+    Boolean(scheduledDate) &&
+    (!needsRouteSelect || Boolean(contractRouteId)) &&
+    (isContainer ? containerLines.some((l) => l.units.length > 0) : bulkLines.length > 0);
+
+  const handleSubmit = () => {
+    if (!scheduledDate || !contract) return;
+
+    const payload: Freight.CreateBookingUnderContractDto = {
+      scheduledDate,
+      ...(contractRouteId ? { contractRouteId } : {}),
+      ...(notes.trim() ? { notes: notes.trim() } : {}),
+    };
+
+    if (isContainer) {
+      payload.containers = containerLines
+        .filter((l) => l.units.length > 0)
+        .map((l) => ({
+          containerSize: l.containerSize,
+          quantity: l.units.length,
+          ...(l.hazardousQuantity !== ""
+            ? { hazardousQuantity: Number(l.hazardousQuantity) }
+            : {}),
+          ...(l.reeferQuantity !== ""
+            ? { reeferQuantity: Number(l.reeferQuantity) }
+            : {}),
+          units: l.units.map((u) => ({
+            containerNumber: u.containerNumber,
+            ...(u.sealNumber ? { sealNumber: u.sealNumber } : {}),
+            vgmTons: Number(u.vgmTons) || 0,
+          })),
+        }));
+    } else {
+      payload.bulkLines = bulkLines.map((l) => ({
+        ...(l.cargoTypeId ? { cargoTypeId: l.cargoTypeId } : {}),
+        ...(l.cargoWeightTons !== ""
+          ? { cargoWeightTons: Number(l.cargoWeightTons) }
+          : {}),
+        ...(l.itemCount !== "" ? { itemCount: Number(l.itemCount) } : {}),
+        ...(l.hazardousQuantity !== ""
+          ? { hazardousQuantity: Number(l.hazardousQuantity) }
+          : {}),
+        ...(l.reeferQuantity !== ""
+          ? { reeferQuantity: Number(l.reeferQuantity) }
+          : {}),
+      }));
+    }
+
+    mutations.createBooking.mutate(payload, {
+      onSuccess: async (booking) => {
+        if (requestId) {
+          try {
+            await contractsService.acceptBookingRequest(requestId, booking.id);
+          } catch {
+            // Non-fatal
+          }
+          navigate(`/dashboard/bookings/${booking.id}/clearance`);
+        } else {
+          navigate(`/dashboard/contracts/clearance/${contract.id}`);
+        }
+      },
+    });
+  };
+
   if (isLoading) {
     return (
       <PageContainer>
         <Center mih="50vh">
-          <Loader color="gray" />
+          <Loader color="edr-green" />
         </Center>
       </PageContainer>
     );
@@ -275,194 +398,74 @@ export default function GlCreateBookingForm() {
     );
   }
 
-  // ── Container line helpers ──
-  const addContainerLine = () =>
-    setContainerLines((prev) => [
-      ...prev,
-      {
-        containerSize: containerSizes[0] ?? "20ft",
-        hazardousQuantity: "",
-        reeferQuantity: "",
-        units: [emptyUnit()],
-      },
-    ]);
-  const removeContainerLine = (idx: number) =>
-    setContainerLines((prev) => prev.filter((_, i) => i !== idx));
-  const patchLine = (idx: number, patch: Partial<ContainerLineDraft>) =>
-    setContainerLines((prev) =>
-      prev.map((l, i) => (i === idx ? { ...l, ...patch } : l)),
-    );
-  const addUnit = (lineIdx: number) =>
-    patchLine(lineIdx, {
-      units: [...containerLines[lineIdx].units, emptyUnit()],
-    });
-  const removeUnit = (lineIdx: number, unitIdx: number) =>
-    patchLine(lineIdx, {
-      units: containerLines[lineIdx].units.filter((_, i) => i !== unitIdx),
-    });
-  const patchUnit = (
-    lineIdx: number,
-    unitIdx: number,
-    patch: Partial<UnitDraft>,
-  ) =>
-    patchLine(lineIdx, {
-      units: containerLines[lineIdx].units.map((u, i) =>
-        i === unitIdx ? { ...u, ...patch } : u,
-      ),
-    });
-
-  // ── Bulk line helpers ──
-  const addBulkLine = () =>
-    setBulkLines((prev) => [
-      ...prev,
-      {
-        cargoTypeId: defaultBulkCargoTypeId,
-        cargoWeightTons: "",
-        itemCount: "",
-        hazardousQuantity: "",
-      },
-    ]);
-  const removeBulkLine = (idx: number) =>
-    setBulkLines((prev) => prev.filter((_, i) => i !== idx));
-  const patchBulk = (idx: number, patch: Partial<BulkLineDraft>) =>
-    setBulkLines((prev) =>
-      prev.map((l, i) => (i === idx ? { ...l, ...patch } : l)),
-    );
-
-  const canSubmit =
-    Boolean(scheduledDate) &&
-    (!needsRouteSelect || Boolean(contractRouteId)) &&
-    (isContainer ? containerLines.length > 0 : bulkLines.length > 0);
-
-  const handleSubmit = () => {
-    if (!scheduledDate) return;
-
-    const payload: Freight.CreateBookingUnderContractDto = {
-      scheduledDate,
-      ...(contractRouteId ? { contractRouteId } : {}),
-      ...(notes.trim() ? { notes: notes.trim() } : {}),
-    };
-
-    if (isContainer) {
-      payload.containers = containerLines.map((l) => ({
-        containerSize: l.containerSize,
-        quantity: l.units.length,
-        ...(l.hazardousQuantity !== ""
-          ? { hazardousQuantity: Number(l.hazardousQuantity) }
-          : {}),
-        ...(l.reeferQuantity !== ""
-          ? { reeferQuantity: Number(l.reeferQuantity) }
-          : {}),
-        units: l.units.map((u) => ({
-          containerNumber: u.containerNumber,
-          ...(u.sealNumber ? { sealNumber: u.sealNumber } : {}),
-          vgmTons: Number(u.vgmTons) || 0,
-        })),
-      }));
-    } else {
-      payload.bulkLines = bulkLines.map((l) => ({
-        ...(l.cargoTypeId ? { cargoTypeId: l.cargoTypeId } : {}),
-        ...(l.cargoWeightTons !== ""
-          ? { cargoWeightTons: Number(l.cargoWeightTons) }
-          : {}),
-        ...(l.itemCount !== "" ? { itemCount: Number(l.itemCount) } : {}),
-        ...(l.hazardousQuantity !== ""
-          ? { hazardousQuantity: Number(l.hazardousQuantity) }
-          : {}),
-      }));
-    }
-
-    mutations.createBooking.mutate(payload, {
-      onSuccess: async (booking) => {
-        if (requestId) {
-          // GENERAL+customs accept flow: mark the request accepted + link the
-          // booking, then hand off to the per-booking clearance review.
-          try {
-            await contractsService.acceptBookingRequest(requestId, booking.id);
-          } catch {
-            // Non-fatal — the booking exists; the request link can be retried.
-          }
-          navigate(`/dashboard/clearance/${booking.id}`);
-        } else {
-          navigate(`/dashboard/bookings/${booking.id}/milestones`);
-        }
-      },
-    });
-  };
+  const bulkUom = bulkUnitOfMeasure(contract);
 
   return (
     <PageContainer>
-      <PageHeader
-        title="Create booking (GL)"
-        subtitle={`Enter the shipment details on behalf of the customer for contract ${contract.reference}.`}
-        backTo={`/dashboard/contracts/clearance/${contract.id}`}
-        breadcrumbs={[
-          {
-            label: "Document Clearance",
-            href: "/dashboard/contracts/clearance",
-          },
-          {
-            label: contract.reference,
-            href: `/dashboard/contracts/clearance/${contract.id}`,
-          },
-          { label: "Create booking" },
-        ]}
-      />
+      <Group justify="space-between" align="flex-end" wrap="wrap" gap="md" mb="lg">
+        <Box>
+          <Text fw={800} fz={26} style={{ letterSpacing: "-0.01em" }}>
+            New Shipment Booking
+          </Text>
+          <Text size="sm" c="dimmed" mt={4}>
+            Book a shipment on behalf of the customer for contract {contract.reference}.
+          </Text>
+        </Box>
+        <Button
+          variant="default"
+          radius="md"
+          leftSection={<ChevronLeft size={16} />}
+          onClick={() =>
+            navigate(`/dashboard/contracts/clearance/${contract.id}`)
+          }
+        >
+          Back to clearance
+        </Button>
+      </Group>
 
-      <Stack gap="lg">
-        {capacity.length > 0 && (
-          <Alert
-            color={capacity.every((c) => c.remaining === 0) ? "red" : "blue"}
-            variant="light"
-            radius="md"
-            icon={<Boxes size={16} />}
-            title="Contract draw-down capacity"
-          >
-            <Group gap={8} wrap="wrap">
-              {capacity.map((c, i) => (
-                <Badge
-                  key={i}
-                  color={c.remaining === 0 ? "red" : "blue"}
-                  variant="light"
-                  radius="sm"
-                >
-                  {c.containerSize ?? "Bulk"}: {c.remaining} of {c.cap} left
-                </Badge>
-              ))}
-            </Group>
-          </Alert>
-        )}
-        {bookingRequest ? (
-          <Alert
-            color="edr-green"
-            variant="light"
-            radius="md"
-            icon={<FileText size={16} />}
-            title="From shipment request"
-          >
-            Booking on behalf of the customer for request{" "}
-            <b>{bookingRequest.reference}</b>.
-            {bookingRequest.scheduledDate ? (
-              <>
-                {" "}
-                Customer requested{" "}
-                <b>
-                  {new Intl.DateTimeFormat("en-GB", {
-                    day: "2-digit",
-                    month: "short",
-                    year: "numeric",
-                  }).format(new Date(bookingRequest.scheduledDate))}
-                </b>{" "}
-                — set the binding shipment date below.
-              </>
-            ) : null}
-          </Alert>
-        ) : null}
-        <SectionCard icon={FileText} title="Route">
+      {bookingRequest ? (
+        <Alert
+          color="edr-green"
+          variant="light"
+          radius="md"
+          icon={<FileText size={16} />}
+          title="From shipment request"
+          mb="lg"
+        >
+          Booking on behalf of the customer for request{" "}
+          <b>{bookingRequest.reference}</b>.
+          {bookingRequest.scheduledDate ? (
+            <>
+              {" "}
+              Customer requested{" "}
+              <b>
+                {new Intl.DateTimeFormat("en-GB", {
+                  day: "2-digit",
+                  month: "short",
+                  year: "numeric",
+                }).format(new Date(bookingRequest.scheduledDate))}
+              </b>{" "}
+              — set the binding shipment date below.
+            </>
+          ) : null}
+        </Alert>
+      ) : null}
+
+      <Stack gap="lg" maw={896} mx="auto">
+        <StepCard>
+          <StepHeader
+            icon={<MapPin size={22} />}
+            title="Route"
+            description={
+              needsRouteSelect
+                ? "Choose which contracted route this shipment ships on."
+                : "This shipment ships on the contract's only route."
+            }
+          />
           {needsRouteSelect ? (
             <Select
-              label="Contract route"
-              placeholder="Select contract route"
+              label="Contract route *"
+              placeholder="Select a route..."
               value={contractRouteId}
               onChange={setContractRouteId}
               data={routes.map((r) => ({
@@ -474,92 +477,72 @@ export default function GlCreateBookingForm() {
                 }`,
               }))}
               required
+              radius={10}
+              styles={fieldStyles}
             />
           ) : (
-            <Text size="sm" c="dimmed">
-              {selectedRoute
-                ? `${selectedRoute.originYard?.label ?? selectedRoute.originYard?.code ?? "Origin"} → ${
-                    selectedRoute.destinationYard?.label ??
-                    selectedRoute.destinationYard?.code ??
-                    "Destination"
-                  }`
-                : "This contract's only route."}
-            </Text>
+            <Paper withBorder radius="md" p="md" style={{ borderColor: "#E6ECF2" }}>
+              <Text fz={14} fw={600}>
+                {selectedRoute?.originYard?.label ??
+                  selectedRoute?.originYard?.code ??
+                  "—"}{" "}
+                →{" "}
+                {selectedRoute?.destinationYard?.label ??
+                  selectedRoute?.destinationYard?.code ??
+                  "—"}
+              </Text>
+              <Text fz={12} c="dimmed" mt={2}>
+                {contract.tradeDirection}
+              </Text>
+            </Paper>
           )}
-        </SectionCard>
+        </StepCard>
 
         {isContainer ? (
-          <SectionCard
-            icon={ContainerIcon}
-            title="Containers"
-            extra={
-              <Button
-                size="compact-sm"
-                variant="light"
-                color="edr-green"
-                leftSection={<Plus size={14} />}
-                onClick={addContainerLine}
-              >
-                Add line
-              </Button>
-            }
-          >
-            {containerLines.length === 0 ? (
-              <Text size="sm" c="dimmed">
-                Add at least one container line.
-              </Text>
-            ) : (
-              <Stack gap="lg">
-                {containerLines.map((line, lineIdx) => (
+          <StepCard>
+            <StepHeader
+              icon={<Package size={22} />}
+              title="Cargo Details"
+              description="Enter the quantity and per-container details for each size in the contract scope."
+            />
+            <Stack gap={18}>
+              <ContractCapacityNotice contractId={contract.id} isContainer />
+              {containerLines.length === 0 ? (
+                <Text fz="sm" c="dimmed">
+                  This contract has no container sizes in scope.
+                </Text>
+              ) : (
+                containerLines.map((line, lineIdx) => (
                   <Box
-                    key={lineIdx}
-                    p="md"
-                    style={{
-                      borderRadius: 10,
-                      border: "1px solid var(--mantine-color-gray-2)",
-                    }}
+                    key={`${line.containerSize}-${lineIdx}`}
+                    className="rounded-xl"
+                    style={{ border: "1px solid #E6ECF2", padding: 16 }}
                   >
-                    <Group justify="space-between" mb="sm">
-                      <Text fw={600} size="sm">
-                        Line {lineIdx + 1}
-                      </Text>
-                      <ActionIcon
-                        variant="subtle"
-                        color="red"
-                        onClick={() => removeContainerLine(lineIdx)}
-                        aria-label="Remove line"
-                      >
-                        <Trash2 size={16} />
-                      </ActionIcon>
-                    </Group>
-                    <Grid gap="sm">
-                      <Grid.Col span={{ base: 12, sm: 4 }}>
-                        <Select
-                          label="Container size"
-                          value={line.containerSize}
-                          onChange={(v) =>
-                            patchLine(lineIdx, {
-                              containerSize: v ?? line.containerSize,
-                            })
-                          }
-                          data={
-                            containerSizes.length > 0
-                              ? containerSizes
-                              : ["20ft", "40ft"]
-                          }
-                        />
-                      </Grid.Col>
-                      <Grid.Col span={{ base: 6, sm: 4 }}>
+                    <Text fz={14} fw={700} mb={10}>
+                      {line.containerSize} containers
+                    </Text>
+                    <Group gap={12} grow mb={12} align="flex-start">
+                      <NumberInput
+                        label="Quantity *"
+                        min={1}
+                        value={line.units.length}
+                        onChange={(v) => syncUnits(lineIdx, Number(v) || 0)}
+                        radius={10}
+                        styles={fieldStyles}
+                      />
+                      {contract.isHazardous ? (
                         <NumberInput
-                          label="Hazard qty"
+                          label="Hazardous qty"
                           min={0}
                           value={line.hazardousQuantity}
                           onChange={(v) =>
                             patchLine(lineIdx, { hazardousQuantity: v })
                           }
+                          radius={10}
+                          styles={fieldStyles}
                         />
-                      </Grid.Col>
-                      <Grid.Col span={{ base: 6, sm: 4 }}>
+                      ) : null}
+                      {contract.isReefer ? (
                         <NumberInput
                           label="Reefer qty"
                           min={0}
@@ -567,192 +550,136 @@ export default function GlCreateBookingForm() {
                           onChange={(v) =>
                             patchLine(lineIdx, { reeferQuantity: v })
                           }
+                          radius={10}
+                          styles={fieldStyles}
                         />
-                      </Grid.Col>
-                    </Grid>
-
-                    <Divider
-                      my="sm"
-                      label={`${line.units.length} container unit${
-                        line.units.length === 1 ? "" : "s"
-                      }`}
-                      labelPosition="left"
-                    />
-
-                    <Stack gap="xs">
-                      {line.units.map((unit, unitIdx) => (
-                        <Grid key={unitIdx} gap="xs" align="flex-end">
-                          <Grid.Col span={{ base: 12, sm: 4 }}>
-                            <TextInput
-                              label={unitIdx === 0 ? "Container no." : undefined}
-                              placeholder="MSKU1234567"
-                              value={unit.containerNumber}
-                              onChange={(e) =>
-                                patchUnit(lineIdx, unitIdx, {
-                                  containerNumber: e.currentTarget.value,
-                                })
-                              }
-                            />
-                          </Grid.Col>
-                          <Grid.Col span={{ base: 6, sm: 3 }}>
-                            <TextInput
-                              label={unitIdx === 0 ? "Seal no." : undefined}
-                              placeholder="Optional"
-                              value={unit.sealNumber}
-                              onChange={(e) =>
-                                patchUnit(lineIdx, unitIdx, {
-                                  sealNumber: e.currentTarget.value,
-                                })
-                              }
-                            />
-                          </Grid.Col>
-                          <Grid.Col span={{ base: 5, sm: 3 }}>
-                            <NumberInput
-                              label={unitIdx === 0 ? "VGM (t)" : undefined}
-                              min={0}
-                              decimalScale={2}
-                              value={unit.vgmTons}
-                              onChange={(v) =>
-                                patchUnit(lineIdx, unitIdx, { vgmTons: v })
-                              }
-                            />
-                          </Grid.Col>
-                          <Grid.Col span={{ base: 1, sm: 2 }}>
-                            <ActionIcon
-                              variant="subtle"
-                              color="red"
-                              disabled={line.units.length === 1}
-                              onClick={() => removeUnit(lineIdx, unitIdx)}
-                              aria-label="Remove unit"
-                            >
-                              <Trash2 size={15} />
-                            </ActionIcon>
-                          </Grid.Col>
-                        </Grid>
-                      ))}
-                      <Button
-                        size="compact-xs"
-                        variant="subtle"
-                        color="edr-green"
-                        leftSection={<Plus size={13} />}
-                        onClick={() => addUnit(lineIdx)}
-                        style={{ alignSelf: "flex-start" }}
-                      >
-                        Add container unit
-                      </Button>
-                    </Stack>
-                  </Box>
-                ))}
-              </Stack>
-            )}
-          </SectionCard>
-        ) : (
-          <SectionCard
-            icon={Package}
-            title="Bulk cargo"
-            extra={
-              <Button
-                size="compact-sm"
-                variant="light"
-                color="edr-green"
-                leftSection={<Plus size={14} />}
-                onClick={addBulkLine}
-              >
-                Add line
-              </Button>
-            }
-          >
-            {bulkLines.length === 0 ? (
-              <Text size="sm" c="dimmed">
-                Add at least one bulk line.
-              </Text>
-            ) : (
-              <Stack gap="md">
-                {bulkLines.map((line, idx) => (
-                  <Box
-                    key={idx}
-                    p="md"
-                    style={{
-                      borderRadius: 10,
-                      border: "1px solid var(--mantine-color-gray-2)",
-                    }}
-                  >
-                    <Group justify="space-between" mb="sm">
-                      <Text fw={600} size="sm">
-                        Line {idx + 1}
-                      </Text>
-                      <ActionIcon
-                        variant="subtle"
-                        color="red"
-                        onClick={() => removeBulkLine(idx)}
-                        aria-label="Remove line"
-                      >
-                        <Trash2 size={16} />
-                      </ActionIcon>
+                      ) : null}
                     </Group>
-                    <Grid gap="sm">
-                      <Grid.Col span={{ base: 12, sm: 6 }}>
-                        {bulkCargoOptions.length > 0 ? (
-                          <Select
-                            label="Cargo type"
-                            placeholder="Select cargo type"
-                            value={line.cargoTypeId || null}
-                            onChange={(v) =>
-                              patchBulk(idx, { cargoTypeId: v ?? "" })
-                            }
-                            data={bulkCargoOptions}
-                          />
-                        ) : (
+
+                    <StepLabel>Per-container details</StepLabel>
+                    <Stack gap={10} mt={8}>
+                      {line.units.map((unit, unitIdx) => (
+                        <Group key={unitIdx} gap={10} grow align="flex-start">
                           <TextInput
-                            label="Cargo type id"
-                            placeholder="Optional"
-                            value={line.cargoTypeId}
+                            label={unitIdx === 0 ? "Container number *" : undefined}
+                            placeholder="e.g. MSCU1234567"
+                            value={unit.containerNumber}
                             onChange={(e) =>
-                              patchBulk(idx, {
-                                cargoTypeId: e.currentTarget.value,
+                              patchUnit(lineIdx, unitIdx, {
+                                containerNumber: e.currentTarget.value,
                               })
                             }
+                            radius={10}
+                            styles={fieldStyles}
                           />
-                        )}
-                      </Grid.Col>
-                      <Grid.Col span={{ base: 6, sm: 6 }}>
-                        <NumberInput
-                          label="Weight (tons)"
-                          min={0}
-                          decimalScale={2}
-                          value={line.cargoWeightTons}
-                          onChange={(v) =>
-                            patchBulk(idx, { cargoWeightTons: v })
-                          }
-                        />
-                      </Grid.Col>
-                      <Grid.Col span={{ base: 6, sm: 6 }}>
-                        <NumberInput
-                          label="Item count"
-                          min={0}
-                          value={line.itemCount}
-                          onChange={(v) => patchBulk(idx, { itemCount: v })}
-                        />
-                      </Grid.Col>
-                      <Grid.Col span={{ base: 6, sm: 6 }}>
-                        <NumberInput
-                          label="Hazard qty"
-                          min={0}
-                          value={line.hazardousQuantity}
-                          onChange={(v) =>
-                            patchBulk(idx, { hazardousQuantity: v })
-                          }
-                        />
-                      </Grid.Col>
-                    </Grid>
+                          <TextInput
+                            label={unitIdx === 0 ? "Seal number" : undefined}
+                            placeholder="Optional"
+                            value={unit.sealNumber}
+                            onChange={(e) =>
+                              patchUnit(lineIdx, unitIdx, {
+                                sealNumber: e.currentTarget.value,
+                              })
+                            }
+                            radius={10}
+                            styles={fieldStyles}
+                          />
+                          <NumberInput
+                            label={unitIdx === 0 ? "VGM (tons) *" : undefined}
+                            placeholder="e.g. 24.5"
+                            min={0}
+                            decimalScale={2}
+                            value={unit.vgmTons}
+                            onChange={(v) =>
+                              patchUnit(lineIdx, unitIdx, { vgmTons: v })
+                            }
+                            radius={10}
+                            styles={fieldStyles}
+                          />
+                        </Group>
+                      ))}
+                    </Stack>
                   </Box>
-                ))}
-              </Stack>
-            )}
-          </SectionCard>
+                ))
+              )}
+            </Stack>
+          </StepCard>
+        ) : (
+          <StepCard>
+            <StepHeader
+              icon={<Package size={22} />}
+              title="Cargo Details"
+              description="Enter the amount you are shipping for this booking."
+            />
+            <Stack gap={14}>
+              <ContractCapacityNotice contractId={contract.id} isContainer={false} />
+              {bulkLines.map((line, idx) => (
+                <Stack key={idx} gap={14}>
+                  {bulkCargoOptions.length > 0 ? (
+                    <Select
+                      label="Cargo type"
+                      placeholder="Select cargo type"
+                      value={line.cargoTypeId || null}
+                      onChange={(v) => patchBulk(idx, { cargoTypeId: v ?? "" })}
+                      data={bulkCargoOptions}
+                      radius={10}
+                      styles={fieldStyles}
+                    />
+                  ) : null}
+                  {bulkUom === "PER_TON" ? (
+                    <NumberInput
+                      label="Quantity (tons) *"
+                      placeholder="e.g. 1200"
+                      min={0}
+                      decimalScale={2}
+                      value={line.cargoWeightTons}
+                      onChange={(v) => patchBulk(idx, { cargoWeightTons: v })}
+                      radius={10}
+                      styles={fieldStyles}
+                    />
+                  ) : (
+                    <NumberInput
+                      label="Item count *"
+                      placeholder="e.g. 500"
+                      min={0}
+                      value={line.itemCount}
+                      onChange={(v) => patchBulk(idx, { itemCount: v })}
+                      radius={10}
+                      styles={fieldStyles}
+                    />
+                  )}
+                  {contract.isHazardous ? (
+                    <NumberInput
+                      label="Hazardous quantity"
+                      min={0}
+                      value={line.hazardousQuantity}
+                      onChange={(v) => patchBulk(idx, { hazardousQuantity: v })}
+                      radius={10}
+                      styles={fieldStyles}
+                    />
+                  ) : null}
+                  {contract.isReefer ? (
+                    <NumberInput
+                      label="Refrigerated quantity"
+                      min={0}
+                      value={line.reeferQuantity}
+                      onChange={(v) => patchBulk(idx, { reeferQuantity: v })}
+                      radius={10}
+                      styles={fieldStyles}
+                    />
+                  ) : null}
+                </Stack>
+              ))}
+            </Stack>
+          </StepCard>
         )}
 
-        <SectionCard icon={FileText} title="Schedule">
+        <StepCard>
+          <StepHeader
+            icon={<CalendarDays size={22} />}
+            title="Schedule"
+            description="Pick the binding shipment day. Only days with an open train that has enough matching wagons for the cargo can be selected."
+          />
           {cargoQuery === null ? (
             <Alert
               color="yellow"
@@ -760,45 +687,53 @@ export default function GlCreateBookingForm() {
               radius="md"
               icon={<AlertCircle size={16} />}
             >
-              Enter the cargo details first — available shipment days depend on
-              the wagons the cargo needs.
+              Enter your cargo details first — available shipment days depend on
+              the wagons your cargo needs.
             </Alert>
           ) : (
-            <>
-              {bookingRequest?.scheduledDate ? (
-                <Text size="xs" c="dimmed" mb="xs">
-                  Customer requested{" "}
-                  {new Intl.DateTimeFormat("en-GB", {
-                    day: "2-digit",
-                    month: "short",
-                    year: "numeric",
-                  }).format(new Date(bookingRequest.scheduledDate))}{" "}
-                  — pick the binding shipment day below.
-                </Text>
-              ) : null}
-              <OperationDatePicker
-                availableDays={availableDays ?? []}
-                isLoading={daysLoading}
-                value={scheduledDate}
-                onChange={setScheduledDate}
-              />
-            </>
+            <Box>
+              <StepLabel>Shipment day *</StepLabel>
+              <Box mt={10} w="100%">
+                <OperationDatePicker
+                  fullWidth
+                  availableDays={availableDays ?? []}
+                  isLoading={daysLoading}
+                  value={scheduledDate}
+                  onChange={setScheduledDate}
+                />
+              </Box>
+            </Box>
           )}
-        </SectionCard>
+        </StepCard>
 
-        <SectionCard icon={FileText} title="Notes">
+        <StepCard>
           <Textarea
-            placeholder="Internal GL notes (optional)"
-            autosize
-            minRows={2}
+            label="Additional notes"
+            placeholder="Any special instructions for this shipment…"
+            rows={3}
+            radius="md"
             value={notes}
             onChange={(e) => setNotes(e.currentTarget.value)}
           />
-        </SectionCard>
+        </StepCard>
+      </Stack>
 
-        <Group justify="flex-end">
+      <Box
+        style={{
+          position: "sticky",
+          bottom: 0,
+          zIndex: 20,
+          borderTop: "1px solid var(--mantine-color-gray-3)",
+          backgroundColor: "rgba(255,255,255,0.94)",
+          backdropFilter: "blur(14px)",
+          padding: "16px 0",
+          marginTop: 24,
+        }}
+      >
+        <Group justify="flex-end" maw={896} mx="auto">
           <Button
             variant="default"
+            radius="md"
             onClick={() =>
               navigate(`/dashboard/contracts/clearance/${contract.id}`)
             }
@@ -815,10 +750,8 @@ export default function GlCreateBookingForm() {
             Review price &amp; book
           </Button>
         </Group>
-      </Stack>
+      </Box>
 
-      {/* Price-confirm — GL reviews the estimate, then books on behalf of the
-          customer. The server recomputes the authoritative total on submit. */}
       <Modal
         opened={priceOpen}
         onClose={() => {
@@ -845,7 +778,7 @@ export default function GlCreateBookingForm() {
       >
         {priceTotal ? (
           <Stack gap="md">
-            <Paper withBorder radius={16} p="lg">
+            <Paper withBorder radius={16} p="lg" style={{ borderColor: "#E6ECF2" }}>
               <Stack gap={10}>
                 {priceTotal.lines.map((line, i) => (
                   <Group key={i} justify="space-between" wrap="nowrap" gap="sm">
@@ -898,7 +831,7 @@ export default function GlCreateBookingForm() {
                 onClick={() => setPriceOpen(false)}
                 disabled={mutations.createBooking.isPending}
               >
-                Back to edit
+                Reject &amp; edit
               </Button>
               <Button
                 color="edr-green"
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/PhasedClearanceActionPanel.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/PhasedClearanceActionPanel.tsx
new file mode 100644
index 000000000..4c5a16964
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/PhasedClearanceActionPanel.tsx
@@ -0,0 +1,1383 @@
+import { useMemo, useState } from "react";
+import {
+  Alert,
+  Badge,
+  Button,
+  FileInput,
+  Group,
+  NumberInput,
+  Paper,
+  Select,
+  Stack,
+  Stepper,
+  Switch,
+  Text,
+  TextInput,
+} from "@mantine/core";
+import { PhasedFileDropzone, PhasedMultiFileDropzone } from "@/components/contracts/PhasedFileDropzone";
+import {
+  TransitPermitMultiUpload,
+  type TransitPermitUploadedRow,
+} from "@/components/contracts/TransitPermitMultiUpload";
+import { DateInput } from "@mantine/dates";
+import {
+  AlertTriangle,
+  CheckCircle2,
+  Clock,
+  FileText,
+  PackageCheck,
+  Receipt,
+  Ship,
+  Truck,
+  Upload,
+} from "lucide-react";
+import type { Freight } from "@edr/types";
+import toast from "react-hot-toast";
+
+import { SectionCard } from "@/components/bookings/detail/SectionCard";
+import { PhasedDocumentUploadField } from "@/components/contracts/PhasedDocumentUploadField";
+import {
+  findWorkflowFile,
+  PhasedUploadedFileRow,
+} from "@/components/contracts/PhasedUploadedFileRow";
+import { contractsService } from "@/services/contracts.service";
+import { bookingsService } from "@/services/bookings.service";
+import { useAuth } from "@/auth/useAuth";
+import { FREIGHT_PERMS, hasPermission } from "@/lib/permissions";
+
+type RoleMode = "ET" | "DJ" | "ALL";
+
+type ClearanceViewLike = Pick<
+  Freight.ContractClearanceView,
+  | "nextAction"
+  | "dutyRequired"
+  | "dutyAdvice"
+  | "roHold"
+  | "roHoldReason"
+  | "milestones"
+  | "bookingReady"
+  | "preClearanceFinalized"
+  | "exportClearanceFinalized"
+  | "allApproved"
+> & { operationReady?: boolean };
+
+type MilestoneRow = NonNullable<ClearanceViewLike["milestones"]>[number];
+
+function isMilestoneDone(
+  milestones: MilestoneRow[] | undefined,
+  code: string,
+): boolean {
+  const m = milestones?.find((x) => x.milestoneCode === code);
+  return m?.status === "COMPLETED" || m?.status === "SKIPPED";
+}
+
+function isBookingMilestoneDone(
+  milestones: MilestoneRow[] | undefined,
+  code: string,
+): boolean {
+  const m = milestones?.find((x) => x.milestoneCode === code);
+  return m?.status === "COMPLETED" || m?.status === "SKIPPED";
+}
+
+function computeImportActiveStep(clearance: ClearanceViewLike): number {
+  if (!isMilestoneDone(clearance.milestones, "DOCUMENTS_APPROVED")) return 0;
+  if (!isMilestoneDone(clearance.milestones, "DECLARED")) return 1;
+  if (
+    clearance.dutyRequired === null ||
+    clearance.dutyRequired === undefined ||
+    (clearance.dutyRequired && !isMilestoneDone(clearance.milestones, "DUTY_TAXES_ADVISED"))
+  ) {
+    return 2;
+  }
+  if (
+    clearance.dutyRequired &&
+    !isMilestoneDone(clearance.milestones, "DUTY_TAX_PAID")
+  ) {
+    return 3;
+  }
+  if (!isMilestoneDone(clearance.milestones, "TRANSIT_PERMIT_UPLOADED")) return 4;
+  if (!clearance.preClearanceFinalized) return 5;
+  if (!isMilestoneDone(clearance.milestones, "DO_COLLECTED")) return 6;
+  return 7;
+}
+
+function declarationFilesFromWorkflow(
+  workflowFiles: Freight.ClearanceWorkflowFile[],
+): Array<{ code: string; label: string; file: { id: string; name: string } }> {
+  return workflowFiles
+    .filter((f) => f.category === "declaration" && f.file)
+    .map((f) => ({
+      code: f.code,
+      label: f.label,
+      file: f.file!,
+    }));
+}
+
+function importTransitFilesFromWorkflow(
+  workflowFiles: Freight.ClearanceWorkflowFile[],
+): Array<{ code: string; label: string; file: { id: string; name: string } }> {
+  return workflowFiles
+    .filter(
+      (f) =>
+        f.category === "transit" &&
+        f.code !== "export_transport_document" &&
+        f.file,
+    )
+    .map((f) => ({
+      code: f.code,
+      label: f.label,
+      file: f.file!,
+    }));
+}
+
+export function PhasedClearanceActionPanel({
+  contractId,
+  bookingId,
+  clearance,
+  tradeDirection,
+  workflowFiles = [],
+  roleMode = "ALL",
+  onChanged,
+  bookingCreateHref,
+  onViewFile,
+  onDownloadFile,
+  useUploadModals = false,
+  onUploadDoRequest,
+  onUploadRoRequest,
+  bookingCreated = false,
+  bookingMilestones = [],
+}: {
+  contractId?: string;
+  bookingId?: string;
+  clearance: ClearanceViewLike;
+  tradeDirection: string;
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  roleMode?: RoleMode;
+  onChanged?: () => void;
+  bookingCreateHref?: string;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+  /** GL Djibouti: open modal uploads instead of inline forms for DO/RO. */
+  useUploadModals?: boolean;
+  onUploadDoRequest?: () => void;
+  onUploadRoRequest?: () => void;
+  /** Hide create-booking CTA once GL has already created the shipment booking. */
+  bookingCreated?: boolean;
+  /** Post-booking milestones (export transit permit after wagon allocation). */
+  bookingMilestones?: MilestoneRow[];
+}) {
+  const entityId = bookingId ?? contractId ?? "";
+  const isBooking = Boolean(bookingId);
+  const { user } = useAuth();
+  const canEt = hasPermission(user, FREIGHT_PERMS.contracts.clearanceEtActions);
+  const canDj = hasPermission(user, FREIGHT_PERMS.contracts.clearanceDjActions);
+  const showEt = roleMode === "ET" || roleMode === "ALL";
+  const showDj = roleMode === "DJ" || roleMode === "ALL";
+  const isImport = tradeDirection === "IMPORT";
+  const activeStep = useMemo(
+    () => (isImport ? computeImportActiveStep(clearance) : 0),
+    [clearance, isImport],
+  );
+
+  if (isImport) {
+    return (
+      <Stack gap="md">
+        {clearance.roHold && clearance.roHoldReason ? (
+          <Alert color="orange" icon={<AlertTriangle size={16} />} title="Release Order on hold">
+            {clearance.roHoldReason}
+          </Alert>
+        ) : null}
+
+        {clearance.nextAction ? (
+          <Alert color="blue" variant="light" title="Next step">
+            <Text size="sm">
+              <strong>{clearance.nextAction.actor.replace("_", " ")}</strong> —{" "}
+              {clearance.nextAction.action}
+            </Text>
+          </Alert>
+        ) : null}
+
+        <Paper withBorder radius="md" p="md">
+          <Text fw={600} size="sm" mb="md">
+            Import pre-booking clearance
+          </Text>
+          <Stepper
+            active={activeStep}
+            orientation="vertical"
+            size="sm"
+            iconSize={26}
+            allowNextStepsSelect={false}
+          >
+            <Stepper.Step
+              label="Customer documents"
+              description="Review and approve in the panel on the left"
+              icon={
+                isMilestoneDone(clearance.milestones, "DOCUMENTS_APPROVED") ? (
+                  <CheckCircle2 size={14} />
+                ) : undefined
+              }
+            >
+              <StepStatus
+                done={isMilestoneDone(clearance.milestones, "DOCUMENTS_APPROVED")}
+                pendingLabel="Approve every required customer document."
+                doneLabel="All required documents approved."
+              />
+            </Stepper.Step>
+
+            <Stepper.Step
+              label="Customs declaration"
+              description="Upload declaration documents"
+              icon={
+                isMilestoneDone(clearance.milestones, "DECLARED") ? (
+                  <CheckCircle2 size={14} />
+                ) : (
+                  <FileText size={14} />
+                )
+              }
+            >
+              {showEt &&
+              canEt &&
+              !clearance.bookingReady &&
+              (activeStep >= 1 ||
+                isMilestoneDone(clearance.milestones, "DECLARED")) ? (
+                <DeclarationStep
+                  entityId={entityId}
+                  isBooking={isBooking}
+                  replaceMode={isMilestoneDone(clearance.milestones, "DECLARED")}
+                  workflowFiles={workflowFiles}
+                  onChanged={onChanged}
+                  onViewFile={onViewFile}
+                  onDownloadFile={onDownloadFile}
+                />
+              ) : (
+                <Stack gap="sm">
+                  {declarationFilesFromWorkflow(workflowFiles).map((row) => (
+                    <PhasedUploadedFileRow
+                      key={row.code}
+                      label={row.label}
+                      file={row.file}
+                      onView={onViewFile}
+                      onDownload={onDownloadFile}
+                      compact
+                    />
+                  ))}
+                  <StepStatus
+                    done={isMilestoneDone(clearance.milestones, "DECLARED")}
+                    pendingLabel="Waiting for GL Ethiopia to upload customs declaration documents."
+                    doneLabel="Declaration uploaded."
+                  />
+                </Stack>
+              )}
+            </Stepper.Step>
+
+            <Stepper.Step
+              label="Duty & tax"
+              description="Advise amount and attach notice"
+              icon={<Receipt size={14} />}
+            >
+              {showEt && canEt && activeStep === 2 ? (
+                <DutyStep
+                  entityId={entityId}
+                  isBooking={isBooking}
+                  clearance={clearance}
+                  workflowFiles={workflowFiles}
+                  onChanged={onChanged}
+                  onViewFile={onViewFile}
+                  onDownloadFile={onDownloadFile}
+                />
+              ) : (
+                <StepStatus
+                  done={
+                    clearance.dutyRequired === false ||
+                    isMilestoneDone(clearance.milestones, "DUTY_TAXES_ADVISED")
+                  }
+                  pendingLabel="Waiting for GL Ethiopia to advise duty/tax."
+                  doneLabel={
+                    clearance.dutyRequired === false
+                      ? "Duty/tax not required."
+                      : "Duty/tax advised to customer."
+                  }
+                />
+              )}
+            </Stepper.Step>
+
+            <Stepper.Step
+              label="Customer payment"
+              description="Customer uploads payment slip"
+              icon={<Clock size={14} />}
+            >
+              {findWorkflowFile(workflowFiles, "duty_tax_receipt") ? (
+                <PhasedUploadedFileRow
+                  label="Duty / Tax Payment Slip"
+                  file={findWorkflowFile(workflowFiles, "duty_tax_receipt")!}
+                  onView={onViewFile}
+                  onDownload={onDownloadFile}
+                />
+              ) : (
+                <StepStatus
+                  done={
+                    clearance.dutyRequired === false ||
+                    isMilestoneDone(clearance.milestones, "DUTY_TAX_PAID")
+                  }
+                  pendingLabel={
+                    clearance.dutyRequired === false
+                      ? "Skipped — duty not required."
+                      : "Waiting for the customer to upload the duty/tax payment slip in the portal."
+                  }
+                  doneLabel="Customer payment slip received."
+                />
+              )}
+            </Stepper.Step>
+
+            <Stepper.Step
+              label="Transit Permit"
+              description="Upload transit permit documents"
+              icon={<Upload size={14} />}
+            >
+              {showEt &&
+              canEt &&
+              !bookingCreated &&
+              (activeStep >= 4 ||
+                isMilestoneDone(clearance.milestones, "TRANSIT_PERMIT_UPLOADED")) ? (
+                <TransitPermitStep
+                  entityId={entityId}
+                  isBooking={isBooking}
+                  workflowFiles={workflowFiles}
+                  replaceMode={isMilestoneDone(
+                    clearance.milestones,
+                    "TRANSIT_PERMIT_UPLOADED",
+                  )}
+                  onChanged={onChanged}
+                  onViewFile={onViewFile}
+                  onDownloadFile={onDownloadFile}
+                />
+              ) : importTransitFilesFromWorkflow(workflowFiles).length > 0 ? (
+                <Stack gap="sm">
+                  <Text size="sm" fw={700}>
+                    Transit Permit
+                  </Text>
+                  {importTransitFilesFromWorkflow(workflowFiles).map((row) => (
+                    <PhasedUploadedFileRow
+                      key={row.code}
+                      label={row.label}
+                      file={row.file}
+                      onView={onViewFile}
+                      onDownload={onDownloadFile}
+                      compact
+                    />
+                  ))}
+                </Stack>
+              ) : (
+                <StepStatus
+                  done={isMilestoneDone(clearance.milestones, "TRANSIT_PERMIT_UPLOADED")}
+                  pendingLabel="Waiting for GL Ethiopia to upload the transit permit."
+                  doneLabel="Transit permit uploaded."
+                />
+              )}
+            </Stepper.Step>
+
+            <Stepper.Step
+              label="Finalize pre-clearance"
+              description="Hand off to GL Djibouti"
+              icon={<PackageCheck size={14} />}
+            >
+              {showEt && canEt && activeStep === 5 ? (
+                <FinalizePreClearanceStep
+                  entityId={entityId}
+                  isBooking={isBooking}
+                  onChanged={onChanged}
+                />
+              ) : (
+                <StepStatus
+                  done={Boolean(clearance.preClearanceFinalized)}
+                  pendingLabel="Waiting for GL Ethiopia to finalize pre-clearance."
+                  doneLabel="Pre-clearance finalized — Djibouti may upload the DO."
+                />
+              )}
+            </Stepper.Step>
+
+            <Stepper.Step
+              label="Delivery Order"
+              description="GL Djibouti uploads DO"
+              icon={<Ship size={14} />}
+            >
+              {showDj &&
+              canDj &&
+              !useUploadModals &&
+              (activeStep >= 6 ||
+                isMilestoneDone(clearance.milestones, "DO_COLLECTED")) ? (
+                <DeliveryOrderStep
+                  entityId={entityId}
+                  isBooking={isBooking}
+                  workflowFiles={workflowFiles}
+                  replaceMode={isMilestoneDone(clearance.milestones, "DO_COLLECTED")}
+                  onChanged={onChanged}
+                  onViewFile={onViewFile}
+                  onDownloadFile={onDownloadFile}
+                />
+              ) : (
+                <Stack gap="sm">
+                  {findWorkflowFile(workflowFiles, "delivery_order") ? (
+                    <PhasedUploadedFileRow
+                      label="Delivery Order"
+                      file={findWorkflowFile(workflowFiles, "delivery_order")!}
+                      onView={onViewFile}
+                      onDownload={onDownloadFile}
+                    />
+                  ) : null}
+                  <StepStatus
+                    done={isMilestoneDone(clearance.milestones, "DO_COLLECTED")}
+                    pendingLabel={
+                      !clearance.preClearanceFinalized
+                        ? "Blocked until GL Ethiopia finalizes pre-clearance."
+                        : "Waiting for GL Djibouti to upload the Delivery Order."
+                    }
+                    doneLabel="Delivery Order collected."
+                  />
+                  {useUploadModals && showDj && canDj && onUploadDoRequest ? (
+                    <Button
+                      color="edr-green"
+                      leftSection={<Upload size={16} />}
+                      onClick={onUploadDoRequest}
+                      disabled={!clearance.preClearanceFinalized && !findWorkflowFile(workflowFiles, "delivery_order")}
+                    >
+                      {findWorkflowFile(workflowFiles, "delivery_order")
+                        ? "Replace DO"
+                        : "Upload DO"}
+                    </Button>
+                  ) : null}
+                </Stack>
+              )}
+            </Stepper.Step>
+
+            <Stepper.Step
+              label="Create booking"
+              description="GL Ethiopia books for the customer"
+              icon={<Ship size={14} />}
+            >
+              {(clearance.bookingReady || clearance.operationReady) &&
+              bookingCreateHref &&
+              !bookingCreated &&
+              showEt &&
+              canEt ? (
+                <SectionCard icon={Ship} title="Create booking" accent="edr-green">
+                  <Text size="sm" c="dimmed" mb="sm">
+                    Pre-booking clearance is complete. Create the shipment booking for the
+                    customer.
+                  </Text>
+                  <Button component="a" href={bookingCreateHref} color="edr-green">
+                    Create shipment booking
+                  </Button>
+                </SectionCard>
+              ) : (
+                <StepStatus
+                  done={Boolean(
+                    bookingCreated || clearance.bookingReady || clearance.operationReady,
+                  )}
+                  pendingLabel="Complete the Delivery Order step first."
+                  doneLabel={
+                    bookingCreated
+                      ? "Shipment booking created."
+                      : "Ready — create the shipment booking."
+                  }
+                />
+              )}
+            </Stepper.Step>
+          </Stepper>
+        </Paper>
+      </Stack>
+    );
+  }
+
+  return (
+    <Stack gap="md">
+      {clearance.roHold && clearance.roHoldReason ? (
+        <Alert color="orange" icon={<AlertTriangle size={16} />} title="Release Order on hold">
+          {clearance.roHoldReason}
+        </Alert>
+      ) : null}
+
+      {showDj && canDj ? (
+        useUploadModals ? (
+          <ReleaseOrderActions
+            entityId={entityId}
+            isBooking={isBooking}
+            clearance={clearance}
+            workflowFiles={workflowFiles}
+            onUploadRoRequest={onUploadRoRequest}
+            onChanged={onChanged}
+            onViewFile={onViewFile}
+            onDownloadFile={onDownloadFile}
+          />
+        ) : (
+          <ReleaseOrderCard
+            entityId={entityId}
+            isBooking={isBooking}
+            clearance={clearance}
+            onChanged={onChanged}
+          />
+        )
+      ) : null}
+
+      {showEt && canEt ? (
+        <DeclarationStep
+          entityId={entityId}
+          isBooking={isBooking}
+          workflowFiles={workflowFiles}
+          onChanged={onChanged}
+          onViewFile={onViewFile}
+          onDownloadFile={onDownloadFile}
+        />
+      ) : null}
+
+      {showEt && canEt ? (
+        <ExportReleaseCard
+          entityId={entityId}
+          isBooking={isBooking}
+          clearance={clearance}
+          onChanged={onChanged}
+        />
+      ) : null}
+
+      {(clearance.bookingReady || clearance.operationReady) &&
+      bookingCreateHref &&
+      !bookingCreated &&
+      showEt &&
+      canEt ? (
+        <SectionCard icon={Ship} title="Create booking" accent="edr-green">
+          <Text size="sm" c="dimmed" mb="sm">
+            Pre-booking clearance is complete. Create the shipment booking for the customer.
+          </Text>
+          <Button component="a" href={bookingCreateHref} color="edr-green">
+            Create shipment booking
+          </Button>
+        </SectionCard>
+      ) : bookingCreated && showEt ? (
+        <SectionCard icon={Ship} title="Create booking" accent="edr-green">
+          <StepStatus
+            done
+            pendingLabel=""
+            doneLabel="Shipment booking has been created for this contract."
+          />
+        </SectionCard>
+      ) : null}
+
+      {bookingCreated && showEt && canEt && bookingId ? (
+        <ExportPostBookingSection
+          contractId={contractId}
+          bookingId={bookingId}
+          clearance={clearance}
+          bookingMilestones={bookingMilestones}
+          workflowFiles={workflowFiles}
+          onChanged={onChanged}
+          onViewFile={onViewFile}
+          onDownloadFile={onDownloadFile}
+        />
+      ) : null}
+    </Stack>
+  );
+}
+
+function StepStatus({
+  done,
+  pendingLabel,
+  doneLabel,
+}: {
+  done: boolean;
+  pendingLabel: string;
+  doneLabel: string;
+}) {
+  return (
+    <Paper withBorder radius="md" p="sm" bg={done ? "var(--mantine-color-edr-green-0)" : undefined}>
+      <Group gap="xs" wrap="nowrap">
+        {done ? (
+          <Badge color="edr-green" variant="light" leftSection={<CheckCircle2 size={12} />}>
+            Done
+          </Badge>
+        ) : (
+          <Badge color="gray" variant="light" leftSection={<Clock size={12} />}>
+            Pending
+          </Badge>
+        )}
+        <Text size="sm" c="dimmed">
+          {done ? doneLabel : pendingLabel}
+        </Text>
+      </Group>
+    </Paper>
+  );
+}
+
+function DeclarationStep({
+  entityId,
+  isBooking,
+  onChanged,
+  replaceMode = false,
+  workflowFiles = [],
+  onViewFile,
+  onDownloadFile,
+}: {
+  entityId: string;
+  isBooking: boolean;
+  onChanged?: () => void;
+  replaceMode?: boolean;
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}) {
+  const [files, setFiles] = useState<File[]>([]);
+  const [loading, setLoading] = useState(false);
+
+  const uploaded = declarationFilesFromWorkflow(workflowFiles);
+
+  return (
+    <Stack gap="md">
+      {uploaded.length > 0 ? (
+        <Stack gap={8}>
+          <Text size="xs" fw={700} c="dimmed" tt="uppercase">
+            Current file{uploaded.length > 1 ? "s" : ""}
+          </Text>
+          {uploaded.map((row) => (
+            <PhasedUploadedFileRow
+              key={row.code}
+              label={row.label}
+              file={row.file}
+              onView={onViewFile}
+              onDownload={onDownloadFile}
+            />
+          ))}
+        </Stack>
+      ) : null}
+
+      <Paper withBorder radius="md" p="md" bg="var(--mantine-color-gray-0)">
+        <PhasedMultiFileDropzone
+          label="Customs declaration documents"
+          description={
+            replaceMode
+              ? "Replace declaration files — upload one or more documents."
+              : "Upload one or more customs declaration documents (PDF or image)."
+          }
+          value={files}
+          onChange={setFiles}
+          replaceMode={replaceMode}
+          disabled={loading}
+        />
+      </Paper>
+
+      <Button
+        color="edr-green"
+        loading={loading}
+        disabled={files.length === 0}
+        leftSection={<Upload size={16} />}
+        fullWidth
+        onClick={async () => {
+          setLoading(true);
+          try {
+            const payload = Object.fromEntries(
+              files.map((file, index) => [`declaration_${index}`, file]),
+            ) as Record<string, File>;
+            if (isBooking) {
+              await bookingsService.uploadDeclaration(entityId, payload);
+            } else {
+              await contractsService.uploadDeclaration(entityId, payload);
+            }
+            setFiles([]);
+            toast.success(replaceMode ? "Declaration updated" : "Declaration uploaded");
+            onChanged?.();
+          } catch (e) {
+            toast.error(e instanceof Error ? e.message : "Upload failed");
+          } finally {
+            setLoading(false);
+          }
+        }}
+      >
+        {replaceMode ? "Replace declaration" : "Submit declaration"}
+      </Button>
+    </Stack>
+  );
+}
+
+function DutyStep({
+  entityId,
+  isBooking,
+  clearance,
+  workflowFiles = [],
+  onChanged,
+  onViewFile,
+  onDownloadFile,
+}: {
+  entityId: string;
+  isBooking: boolean;
+  clearance: ClearanceViewLike;
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  onChanged?: () => void;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}) {
+  const [dutyRequired, setDutyRequired] = useState(clearance.dutyRequired ?? true);
+  const [amount, setAmount] = useState<number | string>(
+    clearance.dutyAdvice?.amount ?? "",
+  );
+  const [currency, setCurrency] = useState(clearance.dutyAdvice?.currency ?? "ETB");
+  const [serial, setSerial] = useState(clearance.dutyAdvice?.declarationSerial ?? "");
+  const [attachment, setAttachment] = useState<File | null>(null);
+  const [loading, setLoading] = useState(false);
+  const noticeFile = findWorkflowFile(workflowFiles, "duty_tax_notice");
+
+  const hasExistingNotice = Boolean(noticeFile);
+
+  return (
+    <Stack gap="md">
+      {noticeFile ? (
+        <Stack gap={8}>
+          <Text size="xs" fw={700} c="dimmed" tt="uppercase">
+            Current notice
+          </Text>
+          <PhasedUploadedFileRow
+            label="Duty / Tax Notice"
+            file={noticeFile}
+            onView={onViewFile}
+            onDownload={onDownloadFile}
+          />
+        </Stack>
+      ) : null}
+
+      <Paper withBorder radius="md" p="md" bg="var(--mantine-color-gray-0)">
+        <Stack gap="md">
+          <Switch
+            label="Customer must pay duty/tax"
+            description="Turn off if no duty or tax applies to this shipment."
+            checked={dutyRequired}
+            onChange={(e) => setDutyRequired(e.currentTarget.checked)}
+          />
+          {dutyRequired ? (
+            <>
+              <Group grow align="flex-start">
+                <NumberInput
+                  label="Amount"
+                  placeholder="0.00"
+                  value={amount}
+                  onChange={setAmount}
+                  min={0}
+                  size="sm"
+                  thousandSeparator=","
+                />
+                <Select
+                  label="Currency"
+                  data={["ETB", "USD"]}
+                  value={currency}
+                  onChange={(v) => setCurrency(v ?? "ETB")}
+                  size="sm"
+                />
+              </Group>
+              <TextInput
+                label="Declaration / payment code"
+                placeholder="Customs payment reference"
+                value={serial}
+                onChange={(e) => setSerial(e.currentTarget.value)}
+                size="sm"
+              />
+              <PhasedFileDropzone
+                label="Duty notice attachment"
+                description="Upload the official duty/tax notice — shown to the customer in the portal."
+                value={attachment}
+                onChange={setAttachment}
+                replaceMode={hasExistingNotice}
+                onPreview={onViewFile}
+              />
+            </>
+          ) : null}
+        </Stack>
+      </Paper>
+
+      <Button
+        color="edr-green"
+        loading={loading}
+        disabled={
+          dutyRequired && (amount === "" || (!attachment && !hasExistingNotice))
+        }
+        fullWidth
+        onClick={async () => {
+          setLoading(true);
+          try {
+            const payload = {
+              dutyRequired,
+              amount: dutyRequired ? Number(amount) : undefined,
+              currency,
+              declarationSerial: serial || undefined,
+              attachment: dutyRequired ? attachment : undefined,
+            };
+            if (isBooking) {
+              await bookingsService.adviseDuty(entityId, payload);
+            } else {
+              await contractsService.adviseContractDuty(entityId, payload);
+            }
+            toast.success(dutyRequired ? "Duty advised" : "Duty step skipped");
+            onChanged?.();
+          } catch (e) {
+            toast.error(e instanceof Error ? e.message : "Failed");
+          } finally {
+            setLoading(false);
+          }
+        }}
+      >
+        Save duty settings
+      </Button>
+    </Stack>
+  );
+}
+
+function TransitPermitStep({
+  entityId,
+  isBooking,
+  onChanged,
+  workflowFiles = [],
+  replaceMode = false,
+  onViewFile,
+  onDownloadFile,
+}: {
+  entityId: string;
+  isBooking: boolean;
+  onChanged?: () => void;
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  replaceMode?: boolean;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}) {
+  const uploaded: TransitPermitUploadedRow[] = importTransitFilesFromWorkflow(workflowFiles);
+
+  return (
+    <TransitPermitMultiUpload
+      uploaded={uploaded}
+      replaceMode={replaceMode}
+      fileFieldPrefix="transit_permit"
+      onViewFile={onViewFile}
+      onDownloadFile={onDownloadFile}
+      onSubmit={async (payload) => {
+        try {
+          if (isBooking) {
+            await bookingsService.uploadTransitPermit(entityId, payload);
+          } else {
+            await contractsService.uploadContractTransitPermit(entityId, payload);
+          }
+          toast.success(replaceMode ? "Transit permit updated" : "Transit permit uploaded");
+          onChanged?.();
+        } catch (e) {
+          toast.error(e instanceof Error ? e.message : "Upload failed");
+          throw e;
+        }
+      }}
+    />
+  );
+}
+
+function FinalizePreClearanceStep({
+  entityId,
+  isBooking,
+  onChanged,
+}: {
+  entityId: string;
+  isBooking: boolean;
+  onChanged?: () => void;
+}) {
+  const [loading, setLoading] = useState(false);
+
+  return (
+    <Stack gap="sm">
+      <Text size="sm" c="dimmed">
+        Confirm that Ethiopia-side pre-clearance is complete. This unlocks GL Djibouti to
+        upload the Delivery Order.
+      </Text>
+      <Button
+        color="edr-green"
+        loading={loading}
+        leftSection={<PackageCheck size={16} />}
+        onClick={async () => {
+          setLoading(true);
+          try {
+            if (isBooking) {
+              await bookingsService.finalizePreClearance(entityId);
+            } else {
+              await contractsService.finalizePreClearance(entityId);
+            }
+            toast.success("Pre-clearance finalized");
+            onChanged?.();
+          } catch (e) {
+            toast.error(e instanceof Error ? e.message : "Failed");
+          } finally {
+            setLoading(false);
+          }
+        }}
+      >
+        Finalize pre-clearance
+      </Button>
+    </Stack>
+  );
+}
+
+function DeliveryOrderStep({
+  entityId,
+  isBooking,
+  onChanged,
+  workflowFiles = [],
+  replaceMode = false,
+  onViewFile,
+  onDownloadFile,
+}: {
+  entityId: string;
+  isBooking: boolean;
+  onChanged?: () => void;
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  replaceMode?: boolean;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}) {
+  const [files, setFiles] = useState<Record<string, File | null>>({
+    delivery_order: null,
+  });
+  const [loading, setLoading] = useState(false);
+  const hasFile = Boolean(files.delivery_order);
+
+  return (
+    <PhasedDocumentUploadField
+      fields={[{ key: "delivery_order", label: "Delivery Order" }]}
+      files={files}
+      onChange={(key, file) => setFiles((prev) => ({ ...prev, [key]: file }))}
+      workflowFiles={workflowFiles}
+      replaceMode={replaceMode}
+      loading={loading}
+      disabled={!hasFile}
+      helperText="Upload the Djibouti Delivery Order (DO) for this shipment."
+      submitLabel={replaceMode ? "Replace DO" : "Upload DO"}
+      onViewFile={onViewFile}
+      onDownloadFile={onDownloadFile}
+      onSubmit={async () => {
+        const file = files.delivery_order;
+        if (!file) return;
+        setLoading(true);
+        try {
+          if (isBooking) {
+            await bookingsService.uploadDeliveryOrder(entityId, file);
+          } else {
+            await contractsService.uploadDeliveryOrder(entityId, file);
+          }
+          setFiles({ delivery_order: null });
+          toast.success(replaceMode ? "Delivery Order updated" : "Delivery Order uploaded");
+          onChanged?.();
+        } catch (e) {
+          toast.error(e instanceof Error ? e.message : "Upload failed");
+        } finally {
+          setLoading(false);
+        }
+      }}
+    />
+  );
+}
+
+function ReleaseOrderActions({
+  entityId,
+  isBooking,
+  clearance,
+  workflowFiles = [],
+  onUploadRoRequest,
+  onChanged,
+  onViewFile,
+  onDownloadFile,
+}: {
+  entityId: string;
+  isBooking: boolean;
+  clearance: ClearanceViewLike & { vesselDepartureDate?: string | null };
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  onUploadRoRequest?: () => void;
+  onChanged?: () => void;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}) {
+  const [amendLoading, setAmendLoading] = useState(false);
+  const roFile = findWorkflowFile(workflowFiles, "release_order");
+
+  return (
+    <Paper withBorder radius="md" p="md">
+      <Text fw={600} size="sm" mb="sm">
+        Release Order
+      </Text>
+      <Stack gap="sm">
+        {roFile ? (
+          <PhasedUploadedFileRow
+            label="Release Order"
+            file={roFile}
+            onView={onViewFile}
+            onDownload={onDownloadFile}
+          />
+        ) : null}
+        {clearance.vesselDepartureDate ? (
+          <Text size="sm" c="dimmed">
+            Vessel departure:{" "}
+            {new Date(clearance.vesselDepartureDate).toLocaleDateString()}
+          </Text>
+        ) : null}
+        <Group>
+          {onUploadRoRequest ? (
+            <Button color="edr-green" leftSection={<Upload size={16} />} onClick={onUploadRoRequest}>
+              {roFile ? "Replace RO" : "Upload RO"}
+            </Button>
+          ) : null}
+          <Button
+            variant="light"
+            color="orange"
+            loading={amendLoading}
+            onClick={async () => {
+              setAmendLoading(true);
+              try {
+                if (isBooking) {
+                  await bookingsService.requestRoAmendment(
+                    entityId,
+                    "Port amendment requested — vessel window too short.",
+                  );
+                } else {
+                  await contractsService.requestRoAmendment(
+                    entityId,
+                    "Port amendment requested — vessel window too short.",
+                  );
+                }
+                toast.success("Amendment request recorded");
+                onChanged?.();
+              } catch (e) {
+                toast.error(e instanceof Error ? e.message : "Failed");
+              } finally {
+                setAmendLoading(false);
+              }
+            }}
+          >
+            Request amendment
+          </Button>
+        </Group>
+      </Stack>
+    </Paper>
+  );
+}
+
+function ReleaseOrderCard({
+  entityId,
+  isBooking,
+  clearance,
+  onChanged,
+}: {
+  entityId: string;
+  isBooking: boolean;
+  clearance: ClearanceViewLike & { vesselDepartureDate?: string | null };
+  onChanged?: () => void;
+}) {
+  const [file, setFile] = useState<File | null>(null);
+  const [vesselDate, setVesselDate] = useState<Date | null>(
+    clearance.vesselDepartureDate ? new Date(clearance.vesselDepartureDate) : null,
+  );
+  const [loading, setLoading] = useState(false);
+  const [amendLoading, setAmendLoading] = useState(false);
+
+  return (
+    <Paper withBorder radius="md" p="md">
+      <Text fw={600} size="sm" mb="sm">
+        Release Order
+      </Text>
+      <Stack gap="sm">
+        <FileInput label="Release Order" value={file} onChange={setFile} size="sm" />
+        <DateInput
+          label="Vessel departure date"
+          value={vesselDate}
+          onChange={(v) => setVesselDate(v ? new Date(v) : null)}
+          size="sm"
+        />
+        <Group>
+          <Button
+            color="edr-green"
+            loading={loading}
+            disabled={!file || !vesselDate}
+            onClick={async () => {
+              if (!file || !vesselDate) return;
+              setLoading(true);
+              try {
+                const iso = vesselDate.toISOString().slice(0, 10);
+                const result = isBooking
+                  ? await bookingsService.uploadReleaseOrder(entityId, file, iso)
+                  : await contractsService.uploadReleaseOrder(entityId, file, iso);
+                if (result.hold) {
+                  toast.error(result.holdReason ?? "Vessel date too soon");
+                } else {
+                  toast.success("Release Order accepted");
+                }
+                onChanged?.();
+              } catch (e) {
+                toast.error(e instanceof Error ? e.message : "Upload failed");
+              } finally {
+                setLoading(false);
+              }
+            }}
+          >
+            Upload RO
+          </Button>
+          <Button
+            variant="light"
+            color="orange"
+            loading={amendLoading}
+            onClick={async () => {
+              setAmendLoading(true);
+              try {
+                if (isBooking) {
+                  await bookingsService.requestRoAmendment(
+                    entityId,
+                    "Port amendment requested — vessel window too short.",
+                  );
+                } else {
+                  await contractsService.requestRoAmendment(
+                    entityId,
+                    "Port amendment requested — vessel window too short.",
+                  );
+                }
+                toast.success("Amendment request recorded");
+                onChanged?.();
+              } catch (e) {
+                toast.error(e instanceof Error ? e.message : "Failed");
+              } finally {
+                setAmendLoading(false);
+              }
+            }}
+          >
+            Request amendment
+          </Button>
+        </Group>
+      </Stack>
+    </Paper>
+  );
+}
+
+function ExportReleaseCard({
+  entityId,
+  isBooking,
+  clearance,
+  onChanged,
+}: {
+  entityId: string;
+  isBooking: boolean;
+  clearance: ClearanceViewLike;
+  onChanged?: () => void;
+}) {
+  const [loading, setLoading] = useState(false);
+  const done = clearance.bookingReady || clearance.operationReady;
+
+  return (
+    <Paper withBorder radius="md" p="md">
+      <Text fw={600} size="sm" mb="sm">
+        Export release
+      </Text>
+      <Button
+        color="edr-green"
+        loading={loading}
+        disabled={Boolean(done)}
+        onClick={async () => {
+          setLoading(true);
+          try {
+            if (isBooking) {
+              await bookingsService.confirmExportRelease(entityId);
+            } else {
+              await contractsService.confirmExportRelease(entityId);
+            }
+            toast.success("Export released — ready for booking");
+            onChanged?.();
+          } catch (e) {
+            toast.error(e instanceof Error ? e.message : "Failed");
+          } finally {
+            setLoading(false);
+          }
+        }}
+      >
+        Confirm export release
+      </Button>
+    </Paper>
+  );
+}
+
+function ExportPostBookingSection({
+  contractId,
+  bookingId,
+  clearance,
+  bookingMilestones,
+  workflowFiles = [],
+  onChanged,
+  onViewFile,
+  onDownloadFile,
+}: {
+  contractId?: string;
+  bookingId: string;
+  clearance: ClearanceViewLike;
+  bookingMilestones: MilestoneRow[];
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  onChanged?: () => void;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}) {
+  const wagonAllocated = isBookingMilestoneDone(bookingMilestones, "WAGON_ALLOCATED");
+  const paymentSettled = isBookingMilestoneDone(bookingMilestones, "FREIGHT_PAYMENT_SETTLED");
+  const transitUploaded = isBookingMilestoneDone(bookingMilestones, "EXPORT_TRANSPORT_ISSUED");
+  const finalized = Boolean(clearance.exportClearanceFinalized);
+
+  return (
+    <SectionCard icon={Truck} title="Post-booking clearance" accent="edr-green">
+      <Stack gap="md">
+        <Text size="sm" c="dimmed">
+          After the customer pays and operations allocates wagons, upload the transit
+          permit and finalize export clearance.
+        </Text>
+
+        {!paymentSettled ? (
+          <Alert color="blue" variant="light" icon={<Clock size={16} />}>
+            Waiting for the customer to pay freight charges.
+          </Alert>
+        ) : null}
+
+        {paymentSettled && !wagonAllocated ? (
+          <Alert color="yellow" variant="light" icon={<Clock size={16} />}>
+            Waiting for operations to allocate wagons before the transit permit can be
+            uploaded.
+          </Alert>
+        ) : null}
+
+        {wagonAllocated && !transitUploaded ? (
+          <ExportTransitPermitStep
+            bookingId={bookingId}
+            workflowFiles={workflowFiles}
+            onChanged={onChanged}
+            onViewFile={onViewFile}
+            onDownloadFile={onDownloadFile}
+          />
+        ) : null}
+
+        {transitUploaded ? (
+          <StepStatus
+            done
+            pendingLabel=""
+            doneLabel="Transit permit uploaded."
+          />
+        ) : null}
+
+        {transitUploaded && !finalized && contractId ? (
+          <FinalizeExportClearanceStep contractId={contractId} onChanged={onChanged} />
+        ) : null}
+
+        {finalized ? (
+          <StepStatus
+            done
+            pendingLabel=""
+            doneLabel="Export clearance finalized."
+          />
+        ) : null}
+      </Stack>
+    </SectionCard>
+  );
+}
+
+function exportTransitFilesFromWorkflow(
+  workflowFiles: Freight.ClearanceWorkflowFile[],
+): TransitPermitUploadedRow[] {
+  return workflowFiles
+    .filter((f) => f.category === "transit" && f.file)
+    .map((f) => ({
+      code: f.code,
+      label: f.label,
+      file: f.file!,
+    }));
+}
+
+function ExportTransitPermitStep({
+  bookingId,
+  workflowFiles = [],
+  replaceMode = false,
+  onChanged,
+  onViewFile,
+  onDownloadFile,
+}: {
+  bookingId: string;
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  replaceMode?: boolean;
+  onChanged?: () => void;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}) {
+  const uploaded = exportTransitFilesFromWorkflow(workflowFiles);
+  const hasUploaded = uploaded.length > 0;
+
+  if (hasUploaded && !replaceMode) {
+    return (
+      <Stack gap="sm">
+        <Text size="sm" fw={700}>
+          Transit Permit
+        </Text>
+        {uploaded.map((row) => (
+          <PhasedUploadedFileRow
+            key={row.code}
+            label={row.label}
+            file={row.file}
+            onView={onViewFile}
+            onDownload={onDownloadFile}
+          />
+        ))}
+      </Stack>
+    );
+  }
+
+  return (
+    <TransitPermitMultiUpload
+      replaceMode={replaceMode || hasUploaded}
+      uploaded={uploaded}
+      fileFieldPrefix="export_transport_document"
+      onViewFile={onViewFile}
+      onDownloadFile={onDownloadFile}
+      onSubmit={async (payload) => {
+        try {
+          await contractsService.uploadTransportDocument(bookingId, payload);
+          toast.success(replaceMode ? "Transit permit updated" : "Transit permit uploaded");
+          onChanged?.();
+        } catch (e) {
+          toast.error(e instanceof Error ? e.message : "Upload failed");
+          throw e;
+        }
+      }}
+    />
+  );
+}
+
+function FinalizeExportClearanceStep({
+  contractId,
+  onChanged,
+}: {
+  contractId: string;
+  onChanged?: () => void;
+}) {
+  const [loading, setLoading] = useState(false);
+
+  return (
+    <Stack gap="sm">
+      <Text size="sm" c="dimmed">
+        Confirm that export clearance is complete now that the transit permit is on file.
+      </Text>
+      <Button
+        color="edr-green"
+        loading={loading}
+        leftSection={<PackageCheck size={16} />}
+        onClick={async () => {
+          setLoading(true);
+          try {
+            await contractsService.finalizeExportClearance(contractId);
+            toast.success("Export clearance finalized");
+            onChanged?.();
+          } catch (e) {
+            toast.error(e instanceof Error ? e.message : "Failed");
+          } finally {
+            setLoading(false);
+          }
+        }}
+      >
+        Finalize clearance
+      </Button>
+    </Stack>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/PhasedDocumentUploadField.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/PhasedDocumentUploadField.tsx
new file mode 100644
index 000000000..394385133
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/PhasedDocumentUploadField.tsx
@@ -0,0 +1,122 @@
+import { Box, Button, Group, Paper, Stack, Text } from "@mantine/core";
+import { FileText, Upload } from "lucide-react";
+import type { Freight } from "@edr/types";
+
+import { PhasedFileDropzone } from "@/components/contracts/PhasedFileDropzone";
+import { PhasedUploadedFileRow, findWorkflowFile } from "@/components/contracts/PhasedUploadedFileRow";
+
+export interface PhasedDocumentUploadFieldProps {
+  fields: Array<{ key: string; label: string }>;
+  files: Record<string, File | null>;
+  onChange: (key: string, file: File | null) => void;
+  workflowFiles?: Freight.ClearanceWorkflowFile[];
+  helperText: string;
+  replaceMode?: boolean;
+  loading?: boolean;
+  disabled?: boolean;
+  submitLabel?: string;
+  onSubmit: () => void;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}
+
+/** Consistent phased customs document upload with drag-and-drop, preview, and uploaded rows. */
+export function PhasedDocumentUploadField({
+  fields,
+  files,
+  onChange,
+  workflowFiles = [],
+  helperText,
+  replaceMode = false,
+  loading = false,
+  disabled = false,
+  submitLabel,
+  onSubmit,
+  onViewFile,
+  onDownloadFile,
+}: PhasedDocumentUploadFieldProps) {
+  const hasStaged = Object.values(files).some(Boolean);
+  const uploaded = fields
+    .map((f) => ({ ...f, file: findWorkflowFile(workflowFiles, f.key) }))
+    .filter((f) => f.file);
+  const multiField = fields.length > 1;
+
+  return (
+    <Stack gap="md">
+      {uploaded.length > 0 ? (
+        <Stack gap={8}>
+          <Text size="xs" fw={700} c="dimmed" tt="uppercase">
+            Current file{uploaded.length > 1 ? "s" : ""}
+          </Text>
+          {uploaded.map((row) => (
+            <PhasedUploadedFileRow
+              key={row.key}
+              label={row.label}
+              file={row.file!}
+              onView={onViewFile}
+              onDownload={onDownloadFile}
+            />
+          ))}
+        </Stack>
+      ) : null}
+
+      <Paper withBorder radius="md" p="md" bg="var(--mantine-color-gray-0)">
+        <Group gap={8} mb="sm" wrap="nowrap">
+          <Box
+            c="edr-green"
+            style={{
+              width: 32,
+              height: 32,
+              borderRadius: 8,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              background: "var(--mantine-color-edr-green-1)",
+            }}
+          >
+            <FileText size={16} />
+          </Box>
+          <Box>
+            <Text size="sm" fw={700}>
+              {replaceMode ? "Replace document" : "Upload document"}
+            </Text>
+            <Text size="xs" c="dimmed">
+              {helperText}
+            </Text>
+          </Box>
+        </Group>
+
+        <Stack gap="md">
+          {fields.map((f) => (
+            <PhasedFileDropzone
+              key={f.key}
+              label={multiField ? f.label : "Choose file"}
+              description={
+                multiField
+                  ? uploaded.some((u) => u.key === f.key)
+                    ? "Drop a new file to replace the current one."
+                    : `Upload ${f.label} (optional if another declaration type is provided).`
+                  : undefined
+              }
+              value={files[f.key] ?? null}
+              onChange={(file) => onChange(f.key, file)}
+              replaceMode={replaceMode || uploaded.some((u) => u.key === f.key)}
+              onPreview={onViewFile}
+            />
+          ))}
+        </Stack>
+      </Paper>
+
+      <Button
+        color="edr-green"
+        loading={loading}
+        disabled={disabled || !hasStaged}
+        leftSection={<Upload size={16} />}
+        onClick={onSubmit}
+        fullWidth
+      >
+        {submitLabel ?? (replaceMode ? "Replace document" : "Upload document")}
+      </Button>
+    </Stack>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/PhasedFileDropzone.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/PhasedFileDropzone.tsx
new file mode 100644
index 000000000..8092198f7
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/PhasedFileDropzone.tsx
@@ -0,0 +1,403 @@
+import { useEffect, useMemo, useRef, useState } from "react";
+import {
+  ActionIcon,
+  Box,
+  Button,
+  Group,
+  Stack,
+  Text,
+  ThemeIcon,
+  UnstyledButton,
+} from "@mantine/core";
+import { Eye, FileText, Trash2, UploadCloud } from "lucide-react";
+import { isViewable } from "@edr/ui-common";
+
+export interface PhasedFileDropzoneProps {
+  label: string;
+  description?: string;
+  value: File | null;
+  onChange: (file: File | null) => void;
+  accept?: string;
+  replaceMode?: boolean;
+  onPreview?: (file: { name: string; url: string; mimeType?: string | null }) => void;
+  disabled?: boolean;
+}
+
+function formatBytes(bytes: number): string {
+  if (bytes === 0) return "0 B";
+  const k = 1024;
+  const sizes = ["B", "KB", "MB", "GB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return `${parseFloat((bytes / k ** i).toFixed(1))} ${sizes[i]}`;
+}
+
+function isImageFile(file: File): boolean {
+  if (file.type.startsWith("image/")) return true;
+  const ext = file.name.split(".").pop()?.toLowerCase() ?? "";
+  return ["png", "jpg", "jpeg", "webp", "gif", "bmp", "svg"].includes(ext);
+}
+
+export function PhasedFileDropzone({
+  label,
+  description,
+  value,
+  onChange,
+  accept = "application/pdf,image/*",
+  replaceMode = false,
+  onPreview,
+  disabled = false,
+}: PhasedFileDropzoneProps) {
+  const inputRef = useRef<HTMLInputElement>(null);
+  const [dragOver, setDragOver] = useState(false);
+
+  const previewUrl = useMemo(
+    () => (value ? URL.createObjectURL(value) : null),
+    [value],
+  );
+
+  useEffect(() => {
+    return () => {
+      if (previewUrl) URL.revokeObjectURL(previewUrl);
+    };
+  }, [previewUrl]);
+
+  const pickFile = (file: File | null) => {
+    if (disabled) return;
+    onChange(file);
+  };
+
+  const handleDrop = (e: React.DragEvent) => {
+    e.preventDefault();
+    setDragOver(false);
+    if (disabled) return;
+    const file = e.dataTransfer.files[0];
+    if (file) pickFile(file);
+  };
+
+  if (value && previewUrl) {
+    const canPreview = onPreview && isViewable({ name: value.name, url: previewUrl, mimeType: value.type });
+    const image = isImageFile(value);
+
+    return (
+      <Stack gap={6}>
+        <Text size="sm" fw={600}>
+          {label}
+        </Text>
+        <Box
+          p="sm"
+          style={{
+            borderRadius: 12,
+            border: "1px solid var(--mantine-color-edr-green-4)",
+            background:
+              "linear-gradient(135deg, var(--mantine-color-edr-green-0) 0%, #fff 70%)",
+          }}
+        >
+          <Group justify="space-between" wrap="nowrap" align="center">
+            <Group gap={12} wrap="nowrap" style={{ minWidth: 0 }}>
+              {image ? (
+                <UnstyledButton
+                  onClick={() =>
+                    canPreview && onPreview?.({ name: value.name, url: previewUrl, mimeType: value.type })
+                  }
+                  style={{
+                    width: 52,
+                    height: 52,
+                    flexShrink: 0,
+                    borderRadius: 10,
+                    overflow: "hidden",
+                    border: "1px solid var(--mantine-color-gray-3)",
+                    cursor: canPreview ? "pointer" : "default",
+                  }}
+                >
+                  <img
+                    src={previewUrl}
+                    alt=""
+                    style={{ width: "100%", height: "100%", objectFit: "cover" }}
+                  />
+                </UnstyledButton>
+              ) : (
+                <ThemeIcon variant="light" color="edr-green" radius="md" size={52}>
+                  <FileText size={22} />
+                </ThemeIcon>
+              )}
+              <Box style={{ minWidth: 0 }}>
+                <Text size="xs" fw={700} c="edr-green" tt="uppercase">
+                  Ready to upload
+                </Text>
+                <Text size="sm" fw={600} truncate>
+                  {value.name}
+                </Text>
+                <Text size="xs" c="dimmed">
+                  {formatBytes(value.size)}
+                </Text>
+              </Box>
+            </Group>
+            <Group gap={6} wrap="nowrap">
+              {canPreview ? (
+                <Button
+                  size="compact-xs"
+                  variant="default"
+                  leftSection={<Eye size={13} />}
+                  onClick={() =>
+                    onPreview({ name: value.name, url: previewUrl, mimeType: value.type })
+                  }
+                >
+                  Preview
+                </Button>
+              ) : null}
+              <ActionIcon
+                variant="subtle"
+                color="red"
+                radius="md"
+                aria-label="Remove file"
+                onClick={() => pickFile(null)}
+                disabled={disabled}
+              >
+                <Trash2 size={15} />
+              </ActionIcon>
+            </Group>
+          </Group>
+        </Box>
+      </Stack>
+    );
+  }
+
+  return (
+    <Stack gap={6}>
+      <Text size="sm" fw={600}>
+        {label}
+      </Text>
+      {description ? (
+        <Text size="xs" c="dimmed">
+          {description}
+        </Text>
+      ) : null}
+      <Box
+        onDragOver={(e) => {
+          e.preventDefault();
+          if (!disabled) setDragOver(true);
+        }}
+        onDragLeave={() => setDragOver(false)}
+        onDrop={handleDrop}
+        onClick={() => !disabled && inputRef.current?.click()}
+        style={{
+          borderRadius: 12,
+          border: `2px dashed ${
+            dragOver
+              ? "var(--mantine-color-edr-green-5)"
+              : "var(--mantine-color-gray-4)"
+          }`,
+          background: dragOver
+            ? "var(--mantine-color-edr-green-0)"
+            : "var(--mantine-color-gray-0)",
+          padding: "28px 20px",
+          textAlign: "center",
+          cursor: disabled ? "not-allowed" : "pointer",
+          opacity: disabled ? 0.6 : 1,
+          transition: "border-color 120ms ease, background 120ms ease",
+        }}
+      >
+        <input
+          ref={inputRef}
+          type="file"
+          accept={accept}
+          hidden
+          disabled={disabled}
+          onChange={(e) => pickFile(e.target.files?.[0] ?? null)}
+        />
+        <Stack gap={8} align="center">
+          <ThemeIcon
+            variant="light"
+            color={dragOver ? "edr-green" : "gray"}
+            radius="xl"
+            size={48}
+          >
+            <UploadCloud size={24} />
+          </ThemeIcon>
+          <Box>
+            <Text size="sm" fw={600}>
+              {dragOver
+                ? "Drop to upload"
+                : replaceMode
+                  ? "Drag & drop to replace"
+                  : "Drag & drop your file here"}
+            </Text>
+            <Text size="xs" c="dimmed" mt={4}>
+              or <span style={{ color: "var(--mantine-color-edr-green-7)", fontWeight: 600 }}>browse</span>{" "}
+              — PDF or image
+            </Text>
+          </Box>
+        </Stack>
+      </Box>
+    </Stack>
+  );
+}
+
+export interface PhasedMultiFileDropzoneProps {
+  label: string;
+  description?: string;
+  value: File[];
+  onChange: (files: File[]) => void;
+  accept?: string;
+  replaceMode?: boolean;
+  disabled?: boolean;
+}
+
+export function PhasedMultiFileDropzone({
+  label,
+  description,
+  value,
+  onChange,
+  accept = "application/pdf,image/*",
+  replaceMode = false,
+  disabled = false,
+}: PhasedMultiFileDropzoneProps) {
+  const inputRef = useRef<HTMLInputElement>(null);
+  const [dragOver, setDragOver] = useState(false);
+
+  const addFiles = (incoming: FileList | File[]) => {
+    if (disabled) return;
+    const next = [...value];
+    for (const file of Array.from(incoming)) {
+      if (!next.some((f) => f.name === file.name && f.size === file.size)) {
+        next.push(file);
+      }
+    }
+    onChange(next);
+  };
+
+  const removeAt = (index: number) => {
+    if (disabled) return;
+    onChange(value.filter((_, i) => i !== index));
+  };
+
+  const handleDrop = (e: React.DragEvent) => {
+    e.preventDefault();
+    setDragOver(false);
+    if (e.dataTransfer.files.length > 0) addFiles(e.dataTransfer.files);
+  };
+
+  return (
+    <Stack gap={6}>
+      <Text size="sm" fw={600}>
+        {label}
+      </Text>
+      {description ? (
+        <Text size="xs" c="dimmed">
+          {description}
+        </Text>
+      ) : null}
+
+      {value.length > 0 ? (
+        <Stack gap={8}>
+          {value.map((file, index) => (
+            <Box
+              key={`${file.name}-${file.size}-${index}`}
+              p="sm"
+              style={{
+                borderRadius: 12,
+                border: "1px solid var(--mantine-color-edr-green-4)",
+                background:
+                  "linear-gradient(135deg, var(--mantine-color-edr-green-0) 0%, #fff 70%)",
+              }}
+            >
+              <Group justify="space-between" wrap="nowrap" align="center">
+                <Group gap={12} wrap="nowrap" style={{ minWidth: 0 }}>
+                  <ThemeIcon variant="light" color="edr-green" radius="md" size={44}>
+                    <FileText size={18} />
+                  </ThemeIcon>
+                  <Box style={{ minWidth: 0 }}>
+                    <Text size="xs" fw={700} c="edr-green" tt="uppercase">
+                      Ready to upload
+                    </Text>
+                    <Text size="sm" fw={600} truncate>
+                      {file.name}
+                    </Text>
+                    <Text size="xs" c="dimmed">
+                      {formatBytes(file.size)}
+                    </Text>
+                  </Box>
+                </Group>
+                <ActionIcon
+                  variant="subtle"
+                  color="red"
+                  radius="md"
+                  aria-label="Remove file"
+                  onClick={() => removeAt(index)}
+                  disabled={disabled}
+                >
+                  <Trash2 size={15} />
+                </ActionIcon>
+              </Group>
+            </Box>
+          ))}
+        </Stack>
+      ) : null}
+
+      <Box
+        onDragOver={(e) => {
+          e.preventDefault();
+          if (!disabled) setDragOver(true);
+        }}
+        onDragLeave={() => setDragOver(false)}
+        onDrop={handleDrop}
+        onClick={() => !disabled && inputRef.current?.click()}
+        style={{
+          borderRadius: 12,
+          border: `2px dashed ${
+            dragOver
+              ? "var(--mantine-color-edr-green-5)"
+              : "var(--mantine-color-gray-4)"
+          }`,
+          background: dragOver
+            ? "var(--mantine-color-edr-green-0)"
+            : "var(--mantine-color-gray-0)",
+          padding: "28px 20px",
+          textAlign: "center",
+          cursor: disabled ? "not-allowed" : "pointer",
+          opacity: disabled ? 0.6 : 1,
+          transition: "border-color 120ms ease, background 120ms ease",
+        }}
+      >
+        <input
+          ref={inputRef}
+          type="file"
+          accept={accept}
+          multiple
+          hidden
+          disabled={disabled}
+          onChange={(e) => {
+            if (e.target.files?.length) addFiles(e.target.files);
+            e.target.value = "";
+          }}
+        />
+        <Stack gap={8} align="center">
+          <ThemeIcon
+            variant="light"
+            color={dragOver ? "edr-green" : "gray"}
+            radius="xl"
+            size={48}
+          >
+            <UploadCloud size={24} />
+          </ThemeIcon>
+          <Box>
+            <Text size="sm" fw={600}>
+              {dragOver
+                ? "Drop to add files"
+                : replaceMode
+                  ? "Drag & drop to replace declaration files"
+                  : "Drag & drop declaration files here"}
+            </Text>
+            <Text size="xs" c="dimmed" mt={4}>
+              or{" "}
+              <span style={{ color: "var(--mantine-color-edr-green-7)", fontWeight: 600 }}>
+                browse
+              </span>{" "}
+              — select one or more PDF or image files
+            </Text>
+          </Box>
+        </Stack>
+      </Box>
+    </Stack>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/PhasedUploadedFileRow.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/PhasedUploadedFileRow.tsx
new file mode 100644
index 000000000..4666b7588
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/PhasedUploadedFileRow.tsx
@@ -0,0 +1,94 @@
+import { Badge, Box, Button, Group, Paper, Text, ThemeIcon, Tooltip } from "@mantine/core";
+import { Download, Eye, FileText } from "lucide-react";
+import { isViewable } from "@edr/ui-common";
+
+import { fileViewUrl } from "@/constants/apiConfig";
+
+export interface PhasedUploadedFileRowProps {
+  label: string;
+  file: { id: string; name: string };
+  onView?: (file: { name: string; url: string }) => void;
+  onDownload?: (file: { id: string; name: string }) => void;
+  compact?: boolean;
+}
+
+/** Inline preview row for a phased customs upload (declaration, transit permit, DO, etc.). */
+export function PhasedUploadedFileRow({
+  label,
+  file,
+  onView,
+  onDownload,
+  compact = false,
+}: PhasedUploadedFileRowProps) {
+  const viewUrl = fileViewUrl(file.id);
+  const canPreview = isViewable({ name: file.name, url: viewUrl });
+
+  return (
+    <Paper
+      withBorder
+      radius="md"
+      p={compact ? "xs" : "sm"}
+      style={{
+        borderColor: "var(--mantine-color-edr-green-3)",
+        background:
+          "linear-gradient(135deg, var(--mantine-color-edr-green-0) 0%, #FFFFFF 75%)",
+      }}
+    >
+      <Group justify="space-between" wrap="nowrap" align="center">
+        <Group gap={10} wrap="nowrap" style={{ minWidth: 0 }}>
+          <ThemeIcon variant="light" color="edr-green" radius="md" size={compact ? 32 : 36}>
+            <FileText size={compact ? 15 : 17} />
+          </ThemeIcon>
+          <Box style={{ minWidth: 0 }}>
+            <Text size="sm" fw={600} truncate>
+              {label}
+            </Text>
+            <Group gap={6} wrap="nowrap" mt={2}>
+              <Badge size="xs" variant="light" color="edr-green" radius="sm">
+                Uploaded
+              </Badge>
+              <Text size="xs" c="dimmed" truncate>
+                {file.name}
+              </Text>
+            </Group>
+          </Box>
+        </Group>
+        <Group gap={6} wrap="nowrap">
+          {canPreview && onView ? (
+            <Tooltip label="Preview">
+              <Button
+                size="compact-xs"
+                variant="default"
+                radius="md"
+                leftSection={<Eye size={13} />}
+                onClick={() => onView({ name: file.name, url: viewUrl })}
+              >
+                View
+              </Button>
+            </Tooltip>
+          ) : null}
+          {onDownload ? (
+            <Tooltip label="Download">
+              <Button
+                size="compact-xs"
+                variant="light"
+                radius="md"
+                leftSection={<Download size={13} />}
+                onClick={() => onDownload({ id: file.id, name: file.name })}
+              >
+                Download
+              </Button>
+            </Tooltip>
+          ) : null}
+        </Group>
+      </Group>
+    </Paper>
+  );
+}
+
+export function findWorkflowFile(
+  files: Array<{ code: string; file: { id: string; name: string } | null }> | undefined,
+  code: string,
+): { id: string; name: string } | null {
+  return files?.find((f) => f.code === code)?.file ?? null;
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/TransitPermitMultiUpload.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/TransitPermitMultiUpload.tsx
new file mode 100644
index 000000000..559b85707
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/TransitPermitMultiUpload.tsx
@@ -0,0 +1,106 @@
+import { useState } from "react";
+import { Button, Paper, Stack, Text } from "@mantine/core";
+import { Upload } from "lucide-react";
+
+import { PhasedMultiFileDropzone } from "@/components/contracts/PhasedFileDropzone";
+import { PhasedUploadedFileRow } from "@/components/contracts/PhasedUploadedFileRow";
+
+export type TransitPermitUploadedRow = {
+  code: string;
+  label: string;
+  file: { id: string; name: string };
+};
+
+export interface TransitPermitMultiUploadProps {
+  title?: string;
+  uploaded?: TransitPermitUploadedRow[];
+  replaceMode?: boolean;
+  submitLabel?: string;
+  fileFieldPrefix: string;
+  disabled?: boolean;
+  onSubmit: (files: Record<string, File>) => Promise<void>;
+  onViewFile?: (file: { name: string; url: string }) => void;
+  onDownloadFile?: (file: { id: string; name: string }) => void;
+}
+
+/** Multi-file transit permit upload — import pre-booking and export post-booking. */
+export function TransitPermitMultiUpload({
+  title = "Transit Permit",
+  uploaded = [],
+  replaceMode = false,
+  submitLabel,
+  fileFieldPrefix,
+  disabled = false,
+  onSubmit,
+  onViewFile,
+  onDownloadFile,
+}: TransitPermitMultiUploadProps) {
+  const [files, setFiles] = useState<File[]>([]);
+  const [loading, setLoading] = useState(false);
+
+  const label = submitLabel ?? (replaceMode ? "Replace transit permit" : "Upload transit permit");
+
+  return (
+    <Stack gap="md">
+      <Text size="sm" fw={700}>
+        {title}
+      </Text>
+
+      {uploaded.length > 0 ? (
+        <Stack gap={8}>
+          <Text size="xs" fw={700} c="dimmed" tt="uppercase">
+            Current file{uploaded.length > 1 ? "s" : ""}
+          </Text>
+          {uploaded.map((row) => (
+            <PhasedUploadedFileRow
+              key={row.code}
+              label={row.label}
+              file={row.file}
+              onView={onViewFile}
+              onDownload={onDownloadFile}
+            />
+          ))}
+        </Stack>
+      ) : null}
+
+      <Paper withBorder radius="md" p="md" bg="var(--mantine-color-gray-0)">
+        <PhasedMultiFileDropzone
+          label="Transit permit documents"
+          description={
+            replaceMode
+              ? "Replace transit permit files — upload one or more documents (PDF or image)."
+              : "Upload one or more transit permit documents (PDF or image)."
+          }
+          value={files}
+          onChange={setFiles}
+          replaceMode={replaceMode}
+          disabled={disabled || loading}
+        />
+      </Paper>
+
+      <Button
+        color="edr-green"
+        loading={loading}
+        disabled={disabled || files.length === 0}
+        leftSection={<Upload size={16} />}
+        fullWidth
+        onClick={async () => {
+          setLoading(true);
+          try {
+            const payload = Object.fromEntries(
+              files.map((file, index) => [`${fileFieldPrefix}_${index}`, file]),
+            ) as Record<string, File>;
+            await onSubmit(payload);
+            setFiles([]);
+          } catch {
+            // Caller shows toast for upload errors.
+          } finally {
+            setLoading(false);
+          }
+        }}
+      >
+        {label}
+      </Button>
+    </Stack>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/detail/ContractDetailTabCards.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/detail/ContractDetailTabCards.tsx
new file mode 100644
index 000000000..44ece975d
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/detail/ContractDetailTabCards.tsx
@@ -0,0 +1,322 @@
+import type { LucideIcon } from "lucide-react";
+import {
+  Building2,
+  Download,
+  Eye,
+  FileCheck,
+  FileText,
+  Globe,
+  Hash,
+  Mail,
+  MapPin,
+  Phone,
+  ShieldCheck,
+  User,
+} from "lucide-react";
+import {
+  ActionIcon,
+  Badge,
+  Divider,
+  Group,
+  Loader,
+  Stack,
+  Text,
+  ThemeIcon,
+  Tooltip,
+} from "@mantine/core";
+import { useQuery } from "@tanstack/react-query";
+import type { Freight } from "@edr/types";
+import { clearanceWorkflowFileLabel } from "@edr/types";
+
+import { SectionCard } from "@/components/bookings/detail/SectionCard";
+import { detailStyles } from "@/components/bookings/detail/booking-detail.styles";
+import { customersService } from "@/services/customers.service";
+
+type ContractFile = NonNullable<Freight.IContract["files"]>[number];
+
+// ── shared bits ──────────────────────────────────────────────────────────────
+
+interface InfoRowProps {
+  icon: LucideIcon;
+  label: string;
+  value?: string | null;
+}
+
+function InfoRow({ icon: Icon, label, value }: InfoRowProps) {
+  return (
+    <Group justify="space-between" wrap="nowrap" py={6} gap="md">
+      <Group gap="xs" wrap="nowrap">
+        <Icon size={15} color="var(--mantine-color-gray-5)" />
+        <Text size="sm" c="dimmed">
+          {label}
+        </Text>
+      </Group>
+      <Text size="sm" fw={600} ta="right" style={{ minWidth: 0 }} truncate>
+        {value || "—"}
+      </Text>
+    </Group>
+  );
+}
+
+function InfoRows({ rows }: { rows: InfoRowProps[] }) {
+  const visible = rows.filter((r) => r.value);
+  if (visible.length === 0) {
+    return (
+      <Text size="sm" c="dimmed">
+        No details available.
+      </Text>
+    );
+  }
+  return (
+    <Stack gap={0}>
+      {visible.map((row, i) => (
+        <div key={row.label}>
+          {i > 0 && <Divider color="var(--mantine-color-gray-2)" />}
+          <InfoRow {...row} />
+        </div>
+      ))}
+    </Stack>
+  );
+}
+
+// ── Customer tab ─────────────────────────────────────────────────────────────
+
+/**
+ * Customer info for the contract. The contract detail payload only carries a
+ * `companyId`, so we fetch the full company record to surface contact + manager
+ * details (mirrors the booking-request customer card).
+ */
+export function ContractCustomerCard({
+  contract,
+}: {
+  contract: Freight.IContract;
+}) {
+  const companyId = contract.companyId ?? undefined;
+
+  const { data: company, isLoading } = useQuery({
+    queryKey: ["companies", "byId", companyId],
+    queryFn: () => customersService.getById(companyId!),
+    enabled: Boolean(companyId) && !contract.isGovernment,
+  });
+
+  // Government contracts carry an institution name instead of a company.
+  if (contract.isGovernment) {
+    return (
+      <SectionCard icon={Building2} title="Customer" accent="blue">
+        <InfoRows
+          rows={[
+            {
+              icon: Building2,
+              label: "Government",
+              value: contract.governmentInstitution ?? "Government",
+            },
+          ]}
+        />
+      </SectionCard>
+    );
+  }
+
+  if (isLoading) {
+    return (
+      <SectionCard icon={Building2} title="Customer" accent="blue">
+        <Group gap="sm" py="sm">
+          <Loader size="sm" color="gray" />
+          <Text size="sm" c="dimmed">
+            Loading customer…
+          </Text>
+        </Group>
+      </SectionCard>
+    );
+  }
+
+  if (!company) {
+    return (
+      <SectionCard icon={Building2} title="Customer" accent="blue">
+        <Text size="sm" c="dimmed">
+          No customer linked to this contract.
+        </Text>
+      </SectionCard>
+    );
+  }
+
+  return (
+    <Stack gap="lg">
+      <SectionCard
+        icon={Building2}
+        title="Customer"
+        subtitle={company.name}
+        accent="blue"
+      >
+        <InfoRows
+          rows={[
+            { icon: FileCheck, label: "TIN", value: company.tin },
+            { icon: Hash, label: "VAT number", value: company.vatNumber },
+            { icon: ShieldCheck, label: "FAN number", value: company.fanNumber },
+            { icon: Globe, label: "Country", value: company.country },
+            { icon: Mail, label: "Email", value: company.email },
+            { icon: Phone, label: "Phone", value: company.phone },
+            { icon: MapPin, label: "Address", value: company.address },
+            { icon: Globe, label: "Website", value: company.website },
+          ]}
+        />
+      </SectionCard>
+
+      <SectionCard icon={User} title="Contact person" accent="teal">
+        <InfoRows
+          rows={[
+            { icon: User, label: "Name", value: company.contactPersonName },
+            { icon: Phone, label: "Phone", value: company.contactPersonPhone },
+          ]}
+        />
+      </SectionCard>
+
+      <SectionCard icon={User} title="General manager" accent="grape">
+        <InfoRows
+          rows={[
+            { icon: User, label: "Name", value: company.generalManagerName },
+            { icon: Mail, label: "Email", value: company.generalManagerEmail },
+            { icon: Phone, label: "Phone", value: company.generalManagerPhone },
+          ]}
+        />
+      </SectionCard>
+    </Stack>
+  );
+}
+
+// ── Documents tab ────────────────────────────────────────────────────────────
+
+function formatBytes(bytes?: number | null): string {
+  if (!bytes || bytes <= 0) return "—";
+  const units = ["B", "KB", "MB", "GB"];
+  let value = bytes;
+  let unit = 0;
+  while (value >= 1024 && unit < units.length - 1) {
+    value /= 1024;
+    unit += 1;
+  }
+  return `${value.toFixed(value >= 10 || unit === 0 ? 0 : 1)} ${units[unit]}`;
+}
+
+/** Human label for a file's `code` (e.g. "business_license" → "Business license"). */
+function codeLabel(code?: string | null): string | null {
+  if (!code) return null;
+  return (
+    clearanceWorkflowFileLabel(code) ??
+    code.replace(/[_-]+/g, " ").replace(/\b\w/g, (c) => c.toUpperCase())
+  );
+}
+
+export interface ContractDocumentsCardProps {
+  files: ContractFile[];
+  /** Open the file inline in a viewer modal. */
+  onView?: (file: ContractFile) => void;
+  /** Download the file to disk. */
+  onDownload?: (file: ContractFile) => void;
+}
+
+/** Rich list of the contract's attached documents: type, size, view + download. */
+export function ContractDocumentsCard({
+  files,
+  onView,
+  onDownload,
+}: ContractDocumentsCardProps) {
+  return (
+    <SectionCard
+      icon={FileText}
+      title="Documents"
+      accent="indigo"
+      extra={
+        <Badge color="gray" variant="light" radius="sm">
+          {files.length}
+        </Badge>
+      }
+    >
+      {files.length === 0 ? (
+        <Text size="sm" c="dimmed">
+          No documents attached to this contract.
+        </Text>
+      ) : (
+        <Stack gap="xs">
+          {files.map((file) => {
+            const label = codeLabel(file.code);
+            return (
+              <Group
+                key={file.id}
+                justify="space-between"
+                wrap="nowrap"
+                p="xs"
+                style={detailStyles.fileRow}
+                onMouseEnter={(e) => {
+                  e.currentTarget.style.background =
+                    "var(--mantine-color-gray-0)";
+                  e.currentTarget.style.borderColor =
+                    "var(--freight-brand-border)";
+                }}
+                onMouseLeave={(e) => {
+                  e.currentTarget.style.background = "transparent";
+                  e.currentTarget.style.borderColor =
+                    "var(--mantine-color-gray-2)";
+                }}
+              >
+                <Group gap="sm" wrap="nowrap" style={{ minWidth: 0 }}>
+                  <ThemeIcon size={36} radius="md" variant="light" color="indigo">
+                    <FileText size={17} />
+                  </ThemeIcon>
+                  <Stack gap={2} style={{ minWidth: 0 }}>
+                    <Text size="sm" fw={500} truncate>
+                      {file.name}
+                    </Text>
+                    <Group gap={6} wrap="nowrap">
+                      {label ? (
+                        <Badge
+                          variant="light"
+                          color="gray"
+                          radius="sm"
+                          size="xs"
+                          tt="none"
+                        >
+                          {label}
+                        </Badge>
+                      ) : null}
+                      <Text size="xs" c="dimmed">
+                        {formatBytes(file.size)}
+                      </Text>
+                    </Group>
+                  </Stack>
+                </Group>
+                <Group gap={4} wrap="nowrap">
+                  {onView ? (
+                    <Tooltip label="View" withArrow>
+                      <ActionIcon
+                        variant="subtle"
+                        color="indigo"
+                        radius="md"
+                        onClick={() => onView(file)}
+                        aria-label={`View ${file.name}`}
+                      >
+                        <Eye size={16} />
+                      </ActionIcon>
+                    </Tooltip>
+                  ) : null}
+                  {onDownload ? (
+                    <Tooltip label="Download" withArrow>
+                      <ActionIcon
+                        variant="subtle"
+                        color="gray"
+                        radius="md"
+                        onClick={() => onDownload(file)}
+                        aria-label={`Download ${file.name}`}
+                      >
+                        <Download size={16} />
+                      </ActionIcon>
+                    </Tooltip>
+                  ) : null}
+                </Group>
+              </Group>
+            );
+          })}
+        </Stack>
+      )}
+    </SectionCard>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/detail/RequestDetailCards.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/detail/RequestDetailCards.tsx
new file mode 100644
index 000000000..595252cbf
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/detail/RequestDetailCards.tsx
@@ -0,0 +1,275 @@
+import type { LucideIcon } from "lucide-react";
+import {
+  Building2,
+  FileCheck,
+  FileText,
+  Mail,
+  MapPin,
+  Package,
+  Phone,
+  Ship,
+  Truck,
+  User,
+  Warehouse,
+} from "lucide-react";
+import { Badge, Box, Divider, Group, Stack, Text } from "@mantine/core";
+import type { Freight } from "@edr/types";
+
+import { SectionCard } from "@/components/bookings/detail/SectionCard";
+
+type ReqContract = NonNullable<Freight.IBookingRequest["contract"]>;
+
+interface InfoRowProps {
+  icon: LucideIcon;
+  label: string;
+  value?: string | null;
+}
+
+function InfoRow({ icon: Icon, label, value }: InfoRowProps) {
+  return (
+    <Group justify="space-between" wrap="nowrap" py={6} gap="md">
+      <Group gap="xs" wrap="nowrap">
+        <Icon size={15} color="var(--mantine-color-gray-5)" />
+        <Text size="sm" c="dimmed">
+          {label}
+        </Text>
+      </Group>
+      <Text size="sm" fw={600} ta="right" style={{ minWidth: 0 }} truncate>
+        {value || "—"}
+      </Text>
+    </Group>
+  );
+}
+
+function InfoRows({ rows }: { rows: InfoRowProps[] }) {
+  const visible = rows.filter((r) => r.value);
+  if (visible.length === 0) {
+    return (
+      <Text size="sm" c="dimmed">
+        No details available.
+      </Text>
+    );
+  }
+  return (
+    <Stack gap={0}>
+      {visible.map((row, i) => (
+        <div key={row.label}>
+          {i > 0 && <Divider color="var(--mantine-color-gray-2)" />}
+          <InfoRow {...row} />
+        </div>
+      ))}
+    </Stack>
+  );
+}
+
+/** Customer (company) on the request's contract. */
+export function RequestCustomerCard({ contract }: { contract?: ReqContract | null }) {
+  const company = contract?.company;
+  if (!company) {
+    return (
+      <SectionCard icon={Building2} title="Customer" accent="blue">
+        <Text size="sm" c="dimmed">
+          No customer linked to this request.
+        </Text>
+      </SectionCard>
+    );
+  }
+  return (
+    <SectionCard
+      icon={Building2}
+      title="Customer"
+      subtitle={company.name ?? undefined}
+      accent="blue"
+    >
+      <InfoRows
+        rows={[
+          { icon: FileCheck, label: "TIN", value: company.tin },
+          { icon: Mail, label: "Email", value: company.email },
+          { icon: Phone, label: "Phone", value: company.phone },
+          { icon: MapPin, label: "Address", value: company.address },
+          { icon: User, label: "Contact", value: company.contactPersonName },
+          { icon: Phone, label: "Contact phone", value: company.contactPersonPhone },
+        ]}
+      />
+    </SectionCard>
+  );
+}
+
+const fmtDate = (iso?: string | null) =>
+  iso
+    ? new Intl.DateTimeFormat("en-GB", {
+        day: "2-digit",
+        month: "short",
+        year: "numeric",
+      }).format(new Date(iso))
+    : "—";
+
+const titleCase = (s?: string | null) =>
+  s ? s.charAt(0) + s.slice(1).toLowerCase() : "—";
+
+/** Contract identity + commercial terms. */
+export function RequestContractSummaryCard({
+  contract,
+}: {
+  contract?: ReqContract | null;
+}) {
+  if (!contract) return null;
+  return (
+    <SectionCard
+      icon={FileText}
+      title="Contract"
+      subtitle={contract.reference}
+      accent="grape"
+    >
+      <InfoRows
+        rows={[
+          {
+            icon: FileText,
+            label: "Kind",
+            value: contract.contractKind === "GENERAL" ? "General" : "One-time",
+          },
+          {
+            icon: Package,
+            label: "Cargo",
+            value: contract.freightType === "CONTAINER" ? "Container" : "Bulk",
+          },
+          { icon: Ship, label: "Trade", value: titleCase(contract.tradeDirection) },
+          { icon: FileCheck, label: "Currency", value: contract.paymentCurrency },
+          {
+            icon: FileCheck,
+            label: "Customs",
+            value: contract.customsClearingEnabled
+              ? "Included (Global Logistics)"
+              : "Not included",
+          },
+          {
+            icon: FileText,
+            label: "Valid until",
+            value: contract.contractValidUntil
+              ? fmtDate(contract.contractValidUntil)
+              : "Not active yet",
+          },
+        ]}
+      />
+    </SectionCard>
+  );
+}
+
+/** Routes + cargo scope of the contract. */
+export function RequestRouteCargoCard({
+  contract,
+}: {
+  contract?: ReqContract | null;
+}) {
+  const routes = contract?.routes ?? [];
+  const cargo = contract?.cargoScope ?? [];
+  const isContainer = contract?.freightType === "CONTAINER";
+  return (
+    <SectionCard icon={MapPin} title="Route & cargo" accent="teal">
+      <Stack gap="md">
+        <Box>
+          <Text size="xs" c="dimmed" fw={600} mb={6} tt="uppercase">
+            Routes
+          </Text>
+          {routes.length === 0 ? (
+            <Text size="sm" c="dimmed">
+              No routes recorded.
+            </Text>
+          ) : (
+            <Stack gap={6}>
+              {routes.map((r) => (
+                <Group key={r.id} gap={8} wrap="nowrap">
+                  <MapPin size={14} color="var(--mantine-color-gray-5)" />
+                  <Text size="sm" fw={500} truncate>
+                    {r.originYard?.label ?? r.originYardId} →{" "}
+                    {r.destinationYard?.label ?? r.destinationYardId}
+                  </Text>
+                </Group>
+              ))}
+            </Stack>
+          )}
+        </Box>
+        <Box>
+          <Text size="xs" c="dimmed" fw={600} mb={6} tt="uppercase">
+            Cargo scope
+          </Text>
+          {cargo.length === 0 ? (
+            <Text size="sm" c="dimmed">
+              No cargo scope recorded.
+            </Text>
+          ) : (
+            <Group gap={6} wrap="wrap">
+              {cargo.map((c) => (
+                <Badge
+                  key={c.id}
+                  variant="light"
+                  color="teal"
+                  radius="sm"
+                  leftSection={<Package size={11} />}
+                >
+                  {c.containerSize ??
+                    c.cargoFreeText ??
+                    (isContainer ? "Container" : "Bulk commodity")}
+                </Badge>
+              ))}
+            </Group>
+          )}
+        </Box>
+      </Stack>
+    </SectionCard>
+  );
+}
+
+/** Service type — what the contracted service bundles (rail-only vs logistics/customs). */
+export function RequestServiceTypeCard({
+  contract,
+}: {
+  contract?: ReqContract | null;
+}) {
+  const st = contract?.serviceType;
+  if (!st) return null;
+
+  const firstMile = st.includesFirstMile ?? false;
+  const lastMile = st.includesLastMile ?? false;
+  const customs = st.includesCustoms ?? false;
+  const railOnly = !firstMile && !lastMile && !customs;
+
+  const chips: Array<{ label: string; color: string; icon: LucideIcon }> = [];
+  if (railOnly) chips.push({ label: "Rail only", color: "blue", icon: Ship });
+  if (firstMile)
+    chips.push({ label: "First-mile pickup", color: "teal", icon: Truck });
+  if (lastMile)
+    chips.push({ label: "Last-mile delivery", color: "teal", icon: Warehouse });
+  if (customs)
+    chips.push({ label: "Customs clearance (GL)", color: "grape", icon: FileCheck });
+
+  return (
+    <SectionCard
+      icon={Ship}
+      title="Service"
+      subtitle={st.serviceName}
+      accent="indigo"
+    >
+      <Stack gap="sm">
+        <Group gap={6} wrap="wrap">
+          {chips.map((c) => (
+            <Badge
+              key={c.label}
+              variant="light"
+              color={c.color}
+              radius="sm"
+              leftSection={<c.icon size={11} />}
+            >
+              {c.label}
+            </Badge>
+          ))}
+        </Group>
+        {st.description ? (
+          <Text size="sm" c="dimmed">
+            {st.description}
+          </Text>
+        ) : null}
+      </Stack>
+    </SectionCard>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/GlActionsPanel.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/GlActionsPanel.tsx
index ca0038512..57133cb0c 100644
--- a/apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/GlActionsPanel.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/GlActionsPanel.tsx
@@ -9,6 +9,7 @@ import { AssignStationCard } from "./AssignStationCard";
 import { AssignRiskCard } from "./AssignRiskCard";
 import { AdviseDutyCard } from "./AdviseDutyCard";
 import { GlDocumentUploadCard } from "./GlDocumentUploadCard";
+import { TransportDocumentCard } from "./TransportDocumentCard";
 import { IncidentReportCard } from "./IncidentReportCard";
 
 export interface GlActionsPanelProps {
@@ -39,6 +40,16 @@ export function GlActionsPanel({ bookingId, milestones }: GlActionsPanelProps) {
     () => findMilestone(milestones, "DUTY_TAXES_ADVISED"),
     [milestones],
   );
+  const wagonMs = useMemo(
+    () => findMilestone(milestones, "WAGON_ALLOCATED"),
+    [milestones],
+  );
+  const transportMs = useMemo(
+    () => findMilestone(milestones, "EXPORT_TRANSPORT_ISSUED"),
+    [milestones],
+  );
+  const showTransport =
+    wagonMs?.status === "COMPLETED" && transportMs?.status !== "COMPLETED";
 
   return (
     <SectionCard icon={Flag} title="Global Logistics actions" accent="edr-green">
@@ -56,6 +67,8 @@ export function GlActionsPanel({ bookingId, milestones }: GlActionsPanelProps) {
 
         <GlDocumentUploadCard bookingId={bookingId} />
 
+        {showTransport ? <TransportDocumentCard bookingId={bookingId} /> : null}
+
         {riskMs ? (
           <AssignRiskCard bookingId={bookingId} milestone={riskMs} />
         ) : null}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/TransportDocumentCard.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/TransportDocumentCard.tsx
new file mode 100644
index 000000000..52bcfef98
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/TransportDocumentCard.tsx
@@ -0,0 +1,49 @@
+import { useState } from "react";
+import { Button, FileInput, Stack } from "@mantine/core";
+import { FileText } from "lucide-react";
+import toast from "react-hot-toast";
+
+import { ActionShell } from "./ActionShell";
+import { contractsService } from "@/services/contracts.service";
+
+export function TransportDocumentCard({ bookingId }: { bookingId: string }) {
+  const [file, setFile] = useState<File | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  return (
+    <ActionShell
+      icon={FileText}
+      title="Transit permit"
+      subtitle="Upload after wagon allocation (GL Ethiopia)"
+      done={false}
+    >
+      <Stack gap="sm">
+        <FileInput
+          label="Transit permit"
+          value={file}
+          onChange={setFile}
+          size="sm"
+        />
+        <Button
+          color="edr-green"
+          loading={loading}
+          disabled={!file}
+          onClick={async () => {
+            if (!file) return;
+            setLoading(true);
+            try {
+              await contractsService.uploadTransportDocument(bookingId, file);
+              toast.success("Transport document uploaded");
+            } catch (e) {
+              toast.error(e instanceof Error ? e.message : "Upload failed");
+            } finally {
+              setLoading(false);
+            }
+          }}
+        >
+          Upload document
+        </Button>
+      </Stack>
+    </ActionShell>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/gl-booking-form/ContractCapacityNotice.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/gl-booking-form/ContractCapacityNotice.tsx
new file mode 100644
index 000000000..34bc11f10
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/gl-booking-form/ContractCapacityNotice.tsx
@@ -0,0 +1,52 @@
+import { Alert, Badge, Group, Stack, Text } from "@mantine/core";
+import { Boxes } from "lucide-react";
+
+import { useContractCapacity } from "@/hooks/contracts/useContracts";
+
+export function ContractCapacityNotice({
+  contractId,
+  isContainer,
+}: {
+  contractId: string;
+  isContainer: boolean;
+}) {
+  const { data: lines = [] } = useContractCapacity(contractId);
+
+  if (lines.length === 0) return null;
+
+  const allFull = lines.every((l) => l.remaining === 0);
+  const unit = isContainer ? "" : " tons";
+
+  return (
+    <Alert
+      color={allFull ? "red" : "edr-green"}
+      variant="light"
+      radius="md"
+      icon={<Boxes size={16} />}
+      title={allFull ? "Contract capacity reached" : "Remaining contract capacity"}
+    >
+      {allFull ? (
+        <Text fz={13}>
+          This contract has been fully booked. No further shipments can be created
+          against it.
+        </Text>
+      ) : (
+        <Stack gap={6} mt={4}>
+          {lines.map((l, i) => (
+            <Group key={i} justify="space-between" wrap="nowrap">
+              <Text fz={13}>{l.containerSize ?? "Bulk"}</Text>
+              <Badge
+                color={l.remaining === 0 ? "red" : "edr-green"}
+                variant="light"
+                radius="sm"
+              >
+                {l.remaining}
+                {unit} of {l.cap} left
+              </Badge>
+            </Group>
+          ))}
+        </Stack>
+      )}
+    </Alert>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/contracts/gl-booking-form/form-ui.tsx b/apps/edr-freight-web/backoffice/src/components/contracts/gl-booking-form/form-ui.tsx
new file mode 100644
index 000000000..d7d628bae
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/components/contracts/gl-booking-form/form-ui.tsx
@@ -0,0 +1,93 @@
+import { Box, Group, Paper, Text, Title } from "@mantine/core";
+import type { ReactNode } from "react";
+
+const INK = "#10202F";
+const MUTED = "#6B7C8E";
+const BORDER = "#E6ECF2";
+const GREEN_DARK = "#0A6F4D";
+
+export const fieldStyles = {
+  label: { fontWeight: 600, fontSize: 13, color: INK, marginBottom: 6 },
+  input: {
+    borderRadius: 12,
+    minHeight: 46,
+    height: 46,
+    fontSize: 14,
+    borderColor: BORDER,
+  },
+};
+
+export function StepLabel({ children }: { children: ReactNode }) {
+  return (
+    <Text
+      fz={11}
+      fw={700}
+      tt="uppercase"
+      c={MUTED}
+      style={{ letterSpacing: "0.07em" }}
+    >
+      {children}
+    </Text>
+  );
+}
+
+export function StepCard({
+  children,
+  eyebrow,
+}: {
+  children: ReactNode;
+  eyebrow?: ReactNode;
+}) {
+  return (
+    <Paper
+      radius={20}
+      p={{ base: "lg", sm: 28 }}
+      withBorder
+      bg="white"
+      style={{ borderColor: BORDER, boxShadow: "0 2px 14px rgba(16,24,40,0.04)" }}
+    >
+      {eyebrow}
+      {children}
+    </Paper>
+  );
+}
+
+export function StepHeader({
+  title,
+  description,
+  icon,
+}: {
+  title: string;
+  description: string;
+  icon?: ReactNode;
+}) {
+  return (
+    <Group gap={14} align="flex-start" wrap="nowrap" mb={22}>
+      {icon ? (
+        <Box
+          style={{
+            flexShrink: 0,
+            width: 44,
+            height: 44,
+            borderRadius: 13,
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            background: "linear-gradient(135deg, #ECF6F1, #E4F3EC)",
+            color: GREEN_DARK,
+          }}
+        >
+          {icon}
+        </Box>
+      ) : null}
+      <Box>
+        <Title order={3} fz={20} fw={800} c={INK} style={{ letterSpacing: "-0.01em" }}>
+          {title}
+        </Title>
+        <Text size="sm" c={MUTED} mt={4} style={{ lineHeight: 1.5 }}>
+          {description}
+        </Text>
+      </Box>
+    </Group>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/components/layout/route-meta.ts b/apps/edr-freight-web/backoffice/src/components/layout/route-meta.ts
index b400ddba4..9b75f35f5 100644
--- a/apps/edr-freight-web/backoffice/src/components/layout/route-meta.ts
+++ b/apps/edr-freight-web/backoffice/src/components/layout/route-meta.ts
@@ -184,6 +184,13 @@ const ROUTE_META: Array<{ prefix: string; meta: PageMeta }> = [
       subtitle: "Manage dropdown options used across the platform",
     },
   },
+  {
+    prefix: "/dashboard/configuration/contract-validity-periods",
+    meta: {
+      title: "Contract validity periods",
+      subtitle: "Validity options staff choose when accepting a submitted contract",
+    },
+  },
   {
     prefix: "/dashboard/configuration/train-scheduling-rules",
     meta: {
diff --git a/apps/edr-freight-web/backoffice/src/components/ruleEngine/RuleEngineFormDialog.tsx b/apps/edr-freight-web/backoffice/src/components/ruleEngine/RuleEngineFormDialog.tsx
index f60ac3045..6ae71cdc0 100644
--- a/apps/edr-freight-web/backoffice/src/components/ruleEngine/RuleEngineFormDialog.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/ruleEngine/RuleEngineFormDialog.tsx
@@ -307,6 +307,14 @@ const RuleEngineFormDialog = ({
         size="md"
         radius="md"
         styles={inputStyles}
+        rightSection={
+          field.suffix ? (
+            <Text size="sm" c="dimmed" fw={600} pr={4}>
+              {field.suffix}
+            </Text>
+          ) : undefined
+        }
+        rightSectionWidth={field.suffix ? 52 : undefined}
       />
     );
   };
diff --git a/apps/edr-freight-web/backoffice/src/components/ruleEngine/ruleEngineFormat.tsx b/apps/edr-freight-web/backoffice/src/components/ruleEngine/ruleEngineFormat.tsx
index 5251141a4..5ec7597b9 100644
--- a/apps/edr-freight-web/backoffice/src/components/ruleEngine/ruleEngineFormat.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/ruleEngine/ruleEngineFormat.tsx
@@ -94,6 +94,15 @@ export const formatCell = (value: unknown, format?: ColumnFormat): ReactNode =>
     return <Text size="sm">{Number.isNaN(num) ? String(value) : num.toLocaleString()}</Text>;
   }
 
+  if (format === "currency") {
+    const num = Number(value);
+    return (
+      <Text size="sm" fw={500}>
+        {Number.isNaN(num) ? String(value) : `USD ${num.toLocaleString()}`}
+      </Text>
+    );
+  }
+
   if (format === "date") {
     const d = new Date(String(value));
     if (Number.isNaN(d.getTime())) return <Text size="sm">{String(value)}</Text>;
diff --git a/apps/edr-freight-web/backoffice/src/components/trainScheduling/AllocateBookingWizard.tsx b/apps/edr-freight-web/backoffice/src/components/trainScheduling/AllocateBookingWizard.tsx
index ecbdcc1e6..e1ff69412 100644
--- a/apps/edr-freight-web/backoffice/src/components/trainScheduling/AllocateBookingWizard.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/trainScheduling/AllocateBookingWizard.tsx
@@ -34,6 +34,7 @@ import {
 
 import { useMutation, useQuery } from "@tanstack/react-query";
 import { api } from "@/services/api";
+import { formatRouteLabel } from "@/services/routes.service";
 import { useToast } from "@/hooks/use-toast";
 import { trainSchedulingService } from "@/services/trainScheduling.service";
 import type { BookingDetail } from "@/types/booking";
@@ -138,7 +139,9 @@ export function AllocateBookingWizard({
   const schedulesQuery = useQuery(
     api.trainScheduling.scheduleList.queryOptions({ input: {} }),
   );
-  const routesQuery = useQuery(api.routes.list.queryOptions());
+  const routesQuery = useQuery(
+    api.routes.list.queryOptions({ input: { status: "AVAILABLE" } }),
+  );
   const locomotivesQuery = useQuery(
     api.trainScheduling.availableLocomotives.queryOptions({
       input: {
@@ -244,7 +247,7 @@ export function AllocateBookingWizard({
   }, [containerUnits, containerSlots, savedPlacementsFromSchedule]);
 
   const activeRoutes = useMemo(
-    () => (routesQuery.data ?? []).filter((r) => r.isActive),
+    () => routesQuery.data ?? [],
     [routesQuery.data],
   );
 
@@ -522,7 +525,7 @@ export function AllocateBookingWizard({
                 <SimpleGrid cols={{ base: 1, sm: 2 }} spacing="sm">
                   <Select
                     label="Route"
-                    data={activeRoutes.map((r) => ({ value: r.id, label: r.name }))}
+                    data={activeRoutes.map((r) => ({ value: r.id, label: formatRouteLabel(r) }))}
                     value={routeId || null}
                     onChange={(v) => setRouteId(v ?? "")}
                     searchable
diff --git a/apps/edr-freight-web/backoffice/src/components/warehouses/FeePreviewModal.tsx b/apps/edr-freight-web/backoffice/src/components/warehouses/FeePreviewModal.tsx
index efdca3ae4..1d192e2b2 100644
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/FeePreviewModal.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/FeePreviewModal.tsx
@@ -72,6 +72,13 @@ function FeeCard({ fee }: { fee: FeePreview }) {
           <Row label="Chargeable days" value={`${fee.chargeableDays} (after ${fee.freeDays} free)`} />
           <Row label="Containers" value={String(fee.containerCount ?? 1)} />
           <Row label="Billable units" value={`${fee.billableUnits ?? fee.chargeableDays} container-day(s)`} />
+          {(fee.tiers ?? []).map((tier) => (
+            <Row
+              key={`${tier.appliedFromDay}-${tier.appliedToDay}-${tier.ratePerDay}`}
+              label={`Days ${tier.appliedFromDay}-${tier.appliedToDay}`}
+              value={`${tier.days} x ${money(tier.ratePerDay, fee.currency)} = ${money(tier.amount, fee.currency)}`}
+            />
+          ))}
         </Stack>
       )}
     </Card>
diff --git a/apps/edr-freight-web/backoffice/src/components/warehouses/ReceiveInventoryModal.tsx b/apps/edr-freight-web/backoffice/src/components/warehouses/ReceiveInventoryModal.tsx
index 924d4456e..32b0b5a5d 100644
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/ReceiveInventoryModal.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/ReceiveInventoryModal.tsx
@@ -41,7 +41,7 @@ import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { api } from '@/services/api';
 import { QUERY_KEYS } from '@/constants/QUERY_KEYS';
 import { useToast } from '@/hooks/use-toast';
-import { useInventoryInquiry } from '@/hooks/useWarehouses';
+import { useAllWarehouseYards, useAllWarehouseZones, useInventoryInquiry } from '@/hooks/useWarehouses';
 import { firstMileService } from '@/services/first-mile.service';
 import { warehouseService } from '@/services/warehouse.service';
 import type {
@@ -54,7 +54,10 @@ import type {
   ReadyToLoadRow,
   ReceiveInventoryPayload,
   TruckEntrancePayload,
+  Warehouse,
   WarehouseInventoryItem,
+  WarehouseYard,
+  WarehouseZone,
 } from '@/types/warehouse';
 import { BookingSelect } from './BookingSelect';
 import { DeliverInventoryModal } from './DeliverInventoryModal';
@@ -70,12 +73,17 @@ import { extractErrorMessage, formatDate, formatNumber, inventoryStatusOptions }
 import { openPdfBlob } from './pdf';
 import '@/components/overview/overview.css';
 
+type ImportUnloadAssignment = { bookingId: string; warehouseId: string; yardId: string; zoneId: string };
+type ImportUnloadAssignmentDraft = Partial<Omit<ImportUnloadAssignment, 'bookingId'>>;
+
 interface ReceiveInventoryModalProps {
   opened: boolean;
   onClose: () => void;
   /** When supplied the modal locks to a single booking (legacy single-receive). */
   bookingId?: string;
   bookingLabel?: string;
+  mode?: 'single' | 'bulk';
+  direction?: WarehouseFlowDirection;
   onReceived?: () => void;
 }
 
@@ -142,6 +150,7 @@ interface TruckEntranceFormState {
   packagingType: string;
   unitCount: number | '';
   grossWeightKg: number | '';
+  weighingRequired: boolean | null;
   netWeightKg: number | '';
   volumeDimensions: string;
   conditionAtReceipt: string;
@@ -163,11 +172,17 @@ interface LockedTruckEntranceFields {
   tin?: boolean;
   edrDigitalBookingId?: boolean;
   customerPhone?: boolean;
+  truckPlateNumber?: boolean;
+  trailerPlateNumber?: boolean;
   assignedEquipmentNumber?: boolean;
   itemDescription?: boolean;
   packagingType?: boolean;
   unitCount?: boolean;
   grossWeightKg?: boolean;
+  driverName?: boolean;
+  driverPhone?: boolean;
+  driverLicenseNumber?: boolean;
+  truckType?: boolean;
 }
 
 type PackagingFreightType = 'CONTAINER' | 'BULK' | 'MIXED';
@@ -190,6 +205,7 @@ const emptyTruckEntrance = (): TruckEntranceFormState => ({
   packagingType: '',
   unitCount: '',
   grossWeightKg: '',
+  weighingRequired: null,
   netWeightKg: '',
   volumeDimensions: '',
   conditionAtReceipt: '',
@@ -206,13 +222,24 @@ const emptyTruckEntrance = (): TruckEntranceFormState => ({
 });
 
 const toTruckEntrancePayload = (form: TruckEntranceFormState): TruckEntrancePayload => ({
+  ownerName: form.ownerName.trim() || undefined,
+  consigneeDetails: form.consigneeDetails.trim() || undefined,
+  edrDigitalBookingId: form.edrDigitalBookingId.trim() || undefined,
+  tin: form.tin.trim() || undefined,
+  customerPhone: form.customerPhone.trim() || undefined,
   truckPlateNumber: form.truckPlateNumber.trim(),
   trailerPlateNumber: form.trailerPlateNumber.trim() || undefined,
+  assignedEquipmentNumber: form.assignedEquipmentNumber.trim() || undefined,
   customsSealNumber: form.customsSealNumber.trim() || undefined,
   declarationNumber: form.declarationNumber.trim() || undefined,
   incoterms: form.incoterms.trim() || undefined,
   hsCodes: form.hsCodes.trim() || undefined,
   itemCode: form.itemCode.trim() || undefined,
+  itemDescription: form.itemDescription.trim() || undefined,
+  packagingType: form.packagingType.trim() || undefined,
+  unitCount: form.unitCount === '' ? undefined : Number(form.unitCount),
+  weighingRequired: form.weighingRequired ?? undefined,
+  grossWeightKg: form.weighingRequired && form.grossWeightKg !== '' ? Number(form.grossWeightKg) : undefined,
   netWeightKg: form.netWeightKg === '' ? undefined : Number(form.netWeightKg),
   volumeDimensions: form.volumeDimensions.trim() || undefined,
   conditionAtReceipt: form.conditionAtReceipt.trim() || undefined,
@@ -222,8 +249,11 @@ const toTruckEntrancePayload = (form: TruckEntranceFormState): TruckEntrancePayl
   driverPhone: form.driverPhone.trim(),
   driverLicenseNumber: form.driverLicenseNumber.trim() || undefined,
   truckType: form.truckType.trim() || undefined,
-  entranceTareWeightKg: Number(form.entranceTareWeightKg),
-  exitTareWeightKg: form.exitTareWeightKg === '' ? undefined : Number(form.exitTareWeightKg),
+  entranceTareWeightKg:
+    form.entranceTareWeightKg === ''
+      ? undefined
+      : Number(form.entranceTareWeightKg),
+  exitTareWeightKg: form.weighingRequired && form.exitTareWeightKg !== '' ? Number(form.exitTareWeightKg) : undefined,
   driverSignatoryName: form.driverSignatoryName.trim() || undefined,
   warehouseManagerName: form.warehouseManagerName.trim() || undefined,
 });
@@ -242,22 +272,31 @@ const truckEntranceFromBookings = (bookings: EligibleBooking[]): {
   const tin = commonNonEmptyValue(bookings.map((booking) => booking.customerTin));
   const customerPhone = commonNonEmptyValue(bookings.map((booking) => booking.customerPhone));
   const consigneeDetails = commonNonEmptyValue(bookings.map((booking) => booking.customer));
-  const assignedEquipmentNumber = commonNonEmptyValue(bookings.map((booking) => booking.containerNumber));
+  const assignedEquipmentNumber = commonNonEmptyValue(
+    bookings.map((booking) => booking.customerTruckContainerNumber || booking.containerNumber),
+  );
   const itemDescription = commonNonEmptyValue(bookings.map((booking) => booking.cargoDescription ?? booking.cargo));
   const packagingType = commonNonEmptyValue(bookings.map((booking) => booking.containerPackagingType));
+  const truckPlateNumber = commonNonEmptyValue(
+    bookings.map((booking) => booking.firstMileTruckPlateNumber || booking.customerTruckPlateNumber),
+  );
+  const trailerPlateNumber = commonNonEmptyValue(bookings.map((booking) => booking.firstMileTrailerPlateNumber));
+  const driverName = commonNonEmptyValue(
+    bookings.map((booking) => booking.firstMileDriverName || booking.customerTruckDriverName),
+  );
+  const driverPhone = commonNonEmptyValue(bookings.map((booking) => booking.firstMileDriverPhone));
+  const driverLicenseNumber = commonNonEmptyValue(bookings.map((booking) => booking.firstMileDriverLicenseNumber));
+  const truckType = commonNonEmptyValue(
+    bookings.map((booking) => booking.firstMileTruckType || booking.customerTruckType),
+  );
   const edrDigitalBookingId =
     bookings.length === 1
       ? bookings[0]?.reference ?? bookings[0]?.id ?? ''
       : commonNonEmptyValue(bookings.map((booking) => booking.reference));
-  const firstMileBooking = bookings.length === 1 ? bookings[0] : null;
   const unitCount =
     bookings.length === 1 && bookings[0]?.containerQuantity != null
       ? Number(bookings[0].containerQuantity)
       : '';
-  const grossWeightKg =
-    bookings.length === 1 && bookings[0]?.weight != null
-      ? Number(bookings[0].weight)
-      : '';
   const freightTypes = [...new Set(bookings.map((booking) => booking.freightType).filter(Boolean))];
   const packagingFreightType =
     freightTypes.length === 1 && freightTypes[0] === 'CONTAINER'
@@ -278,13 +317,13 @@ const truckEntranceFromBookings = (bookings: EligibleBooking[]): {
       itemDescription,
       packagingType,
       unitCount,
-      grossWeightKg,
-      truckPlateNumber: firstMileBooking?.firstMileTruckPlateNumber ?? '',
-      trailerPlateNumber: firstMileBooking?.firstMileTrailerPlateNumber ?? '',
-      driverName: firstMileBooking?.firstMileDriverName ?? '',
-      driverPhone: firstMileBooking?.firstMileDriverPhone ?? '',
-      driverLicenseNumber: firstMileBooking?.firstMileDriverLicenseNumber ?? '',
-      truckType: firstMileBooking?.firstMileTruckType ?? '',
+      grossWeightKg: '',
+      truckPlateNumber,
+      trailerPlateNumber,
+      driverName,
+      driverPhone,
+      driverLicenseNumber,
+      truckType,
     },
     lockedFields: {
       ownerName: Boolean(ownerName),
@@ -296,7 +335,13 @@ const truckEntranceFromBookings = (bookings: EligibleBooking[]): {
       itemDescription: Boolean(itemDescription),
       packagingType: Boolean(packagingType),
       unitCount: unitCount !== '',
-      grossWeightKg: grossWeightKg !== '',
+      grossWeightKg: false,
+      truckPlateNumber: Boolean(truckPlateNumber),
+      trailerPlateNumber: Boolean(trailerPlateNumber),
+      driverName: Boolean(driverName),
+      driverPhone: Boolean(driverPhone),
+      driverLicenseNumber: Boolean(driverLicenseNumber),
+      truckType: Boolean(truckType),
     },
     packagingFreightType,
   };
@@ -338,11 +383,13 @@ function TruckEntranceFields({
   onChange,
   lockedFields,
   packagingFreightType = 'MIXED',
+  allowTruckWeighing = true,
 }: {
   value: TruckEntranceFormState;
   onChange: (next: TruckEntranceFormState) => void;
   lockedFields?: LockedTruckEntranceFields;
   packagingFreightType?: PackagingFreightType;
+  allowTruckWeighing?: boolean;
 }) {
   const packagingOptions = packagingOptionsFor(packagingFreightType);
   const quantityLabel =
@@ -396,11 +443,13 @@ function TruckEntranceFields({
           label="Truck plate number"
           required
           value={value.truckPlateNumber}
+          readOnly={lockedFields?.truckPlateNumber}
           onChange={(e) => onChange({ ...value, truckPlateNumber: e.currentTarget.value })}
         />
         <TextInput
           label="Trailer plate number"
           value={value.trailerPlateNumber}
+          readOnly={lockedFields?.trailerPlateNumber}
           onChange={(e) => onChange({ ...value, trailerPlateNumber: e.currentTarget.value })}
         />
       </Group>
@@ -422,12 +471,14 @@ function TruckEntranceFields({
           label="Driver name"
           required
           value={value.driverName}
+          readOnly={lockedFields?.driverName}
           onChange={(e) => onChange({ ...value, driverName: e.currentTarget.value })}
         />
         <TextInput
           label="Driver phone"
           required
           value={value.driverPhone}
+          readOnly={lockedFields?.driverPhone}
           onChange={(e) => onChange({ ...value, driverPhone: e.currentTarget.value })}
         />
       </Group>
@@ -435,29 +486,61 @@ function TruckEntranceFields({
         <TextInput
           label="Driver license number"
           value={value.driverLicenseNumber}
+          readOnly={lockedFields?.driverLicenseNumber}
           onChange={(e) => onChange({ ...value, driverLicenseNumber: e.currentTarget.value })}
         />
         <TextInput
           label="Truck type"
           value={value.truckType}
+          readOnly={lockedFields?.truckType}
           onChange={(e) => onChange({ ...value, truckType: e.currentTarget.value })}
         />
       </Group>
-      <Group grow>
-        <NumberInput
-          label="Entrance tare weight (kg)"
-          required
-          min={0}
-          value={value.entranceTareWeightKg}
-          onChange={(v) => onChange({ ...value, entranceTareWeightKg: v === '' ? '' : Number(v) })}
-        />
-        <NumberInput
-          label="Exit tare weight (kg)"
-          min={0}
-          value={value.exitTareWeightKg}
-          onChange={(v) => onChange({ ...value, exitTareWeightKg: v === '' ? '' : Number(v) })}
-        />
-      </Group>
+      {allowTruckWeighing ? (
+        <>
+          <Select
+            label="Weighing"
+            required
+            data={[
+              { value: 'YES', label: 'Yes' },
+              { value: 'NO', label: 'No' },
+            ]}
+            value={value.weighingRequired == null ? null : value.weighingRequired ? 'YES' : 'NO'}
+            onChange={(next) =>
+              onChange({
+                ...value,
+                weighingRequired: next === 'YES' ? true : next === 'NO' ? false : null,
+                grossWeightKg: next === 'YES' ? value.grossWeightKg : '',
+                exitTareWeightKg: next === 'YES' ? value.exitTareWeightKg : '',
+              })
+            }
+          />
+          {value.weighingRequired && (
+            <Group grow>
+              <NumberInput
+                label="Gross weight (kg)"
+                required
+                min={0}
+                value={value.grossWeightKg}
+                onChange={(v) => onChange({ ...value, grossWeightKg: v === '' ? '' : Number(v) })}
+              />
+              <NumberInput
+                label="Exit tare weight (kg)"
+                required
+                min={0}
+                value={value.exitTareWeightKg}
+                onChange={(v) => onChange({ ...value, exitTareWeightKg: v === '' ? '' : Number(v) })}
+              />
+            </Group>
+          )}
+        </>
+      ) : (
+        <Alert icon={<Info size={16} />} color="green" variant="light">
+          <Text size="sm">
+            Truck weighing is not required for a received first-mile arrival. The GRN uses the booking weight.
+          </Text>
+        </Alert>
+      )}
 
       <Text size="sm" fw={600} mt="xs">Customs and compliance</Text>
       <Group grow>
@@ -510,21 +593,12 @@ function TruckEntranceFields({
           onChange={(v) => onChange({ ...value, unitCount: v === '' ? '' : Number(v) })}
         />
       </Group>
-      <Group grow>
-        <NumberInput
-          label="Gross weight (kg)"
-          min={0}
-          value={value.grossWeightKg}
-          readOnly={lockedFields?.grossWeightKg}
-          onChange={(v) => onChange({ ...value, grossWeightKg: v === '' ? '' : Number(v) })}
-        />
-        <NumberInput
-          label="Net weight (kg)"
-          min={0}
-          value={value.netWeightKg}
-          onChange={(v) => onChange({ ...value, netWeightKg: v === '' ? '' : Number(v) })}
-        />
-      </Group>
+      <NumberInput
+        label="Net weight (kg)"
+        min={0}
+        value={value.netWeightKg}
+        onChange={(v) => onChange({ ...value, netWeightKg: v === '' ? '' : Number(v) })}
+      />
       <TextInput
         label="Volume / dimensions"
         value={value.volumeDimensions}
@@ -650,11 +724,15 @@ function EligibleTab({
   location,
   enabled,
   onChanged,
+  focusedBookingId,
+  focusedBookingLabel,
 }: {
   direction: 'IMPORT' | 'EXPORT';
   location: Location;
   enabled: boolean;
   onChanged?: () => void;
+  focusedBookingId?: string;
+  focusedBookingLabel?: string;
 }) {
   const { toast } = useToast();
   const qc = useQueryClient();
@@ -664,7 +742,15 @@ function EligibleTab({
       enabled,
     }),
   );
-  const rows = useMemo(() => allRows.filter((r) => r.direction === direction), [allRows, direction]);
+  const rows = useMemo(
+    () =>
+      allRows.filter(
+        (r) =>
+          r.direction === direction &&
+          (!focusedBookingId || r.id === focusedBookingId),
+      ),
+    [allRows, direction, focusedBookingId],
+  );
   const bulkReceive = useMutation(api.warehouses.bulkReceive.mutationOptions());
   const requestFirstMile = useMutation({
     mutationFn: (reference: string) => firstMileService.accept(reference),
@@ -766,6 +852,8 @@ function EligibleTab({
     [pendingReceiveIds, rows],
   );
   const pendingHasFirstMile = pendingReceiveRows.some((row) => row.hasFirstMile);
+  const pendingUsesFirstMile =
+    pendingReceiveRows.length > 0 && pendingReceiveRows.every((row) => row.hasFirstMile);
 
   const toggleAll = () =>
     setSelected(allSelected ? new Set() : new Set(selectableRows.map((r) => r.id)));
@@ -788,6 +876,18 @@ function EligibleTab({
         title: `${r.receivedCount} received at ${direction === 'EXPORT' ? 'facility' : 'warehouse'}`,
         description: r.results.find((item) => item.grnNumber)?.grnNumber ?? (r.skippedCount ? `${r.skippedCount} skipped` : undefined),
       });
+      const firstGrn = r.results.find((item) => item.inventoryId && item.grnNumber);
+      if (focusedBookingId && firstGrn?.inventoryId && firstGrn.grnNumber) {
+        const pdfWindow = window.open('', '_blank');
+        try {
+          const response = await warehouseService.downloadGrnDocument(firstGrn.inventoryId);
+          const opened = openPdfBlob(response.data, `grn-${firstGrn.grnNumber}.pdf`, pdfWindow);
+          toast({ title: opened ? 'GRN document opened' : 'GRN document downloaded' });
+        } catch (error) {
+          pdfWindow?.close();
+          toast({ variant: 'destructive', title: 'GRN document failed', description: extractErrorMessage(error) });
+        }
+      }
       setSelected(new Set());
       setTruckOpen(false);
       setPendingReceiveIds([]);
@@ -822,32 +922,65 @@ function EligibleTab({
       void receiveBookings(filteredIds);
       return;
     }
+    const hasFirstMileRows = selectedRows.some((row) => row.hasFirstMile);
+    const hasCustomerTruckRows = selectedRows.some((row) => !row.hasFirstMile);
+    if (hasFirstMileRows && hasCustomerTruckRows) {
+      toast({
+        variant: 'destructive',
+        title: 'Receive separately',
+        description: 'First-mile arrivals and customer-truck arrivals use different truck evidence. Select one group at a time.',
+      });
+      return;
+    }
     const { form, lockedFields, packagingFreightType: nextPackagingFreightType } = truckEntranceFromBookings(selectedRows);
     const totalContainerQuantity = selectedRows.reduce(
       (sum, row) => sum + Number(row.containerQuantity ?? 0),
       0,
     );
+    const usesFirstMile = selectedRows.length > 0 && selectedRows.every((row) => row.hasFirstMile);
+    const usesCustomerAssignedTruck =
+      selectedRows.length > 0 &&
+      selectedRows.every((row) => !row.hasFirstMile && Boolean(row.customerTruckAssignedAt));
     const normalizedForm =
       nextPackagingFreightType === 'CONTAINER' && totalContainerQuantity > 0
         ? {
             ...form,
             unitCount: totalContainerQuantity,
           }
-        : form;
+        : {
+            ...form,
+          };
     setPendingReceiveIds(filteredIds);
     setReceivedAt(new Date().toISOString());
     setTruckForm(normalizedForm);
     setLockedTruckFields({
       ...lockedFields,
       unitCount: nextPackagingFreightType === 'CONTAINER' && totalContainerQuantity > 0,
+      assignedEquipmentNumber: usesCustomerAssignedTruck
+        ? lockedFields.assignedEquipmentNumber
+        : lockedFields.assignedEquipmentNumber,
+      truckPlateNumber: (usesFirstMile || usesCustomerAssignedTruck) && lockedFields.truckPlateNumber,
+      trailerPlateNumber: usesFirstMile && lockedFields.trailerPlateNumber,
+      driverName: (usesFirstMile || usesCustomerAssignedTruck) && lockedFields.driverName,
+      driverPhone: usesFirstMile && lockedFields.driverPhone,
+      driverLicenseNumber: usesFirstMile && lockedFields.driverLicenseNumber,
+      truckType: (usesFirstMile || usesCustomerAssignedTruck) && lockedFields.truckType,
     });
     setPackagingFreightType(nextPackagingFreightType);
     setTruckOpen(true);
   };
 
   const receive = async () => {
-    if (!truckForm.truckPlateNumber.trim() || !truckForm.driverName.trim() || !truckForm.driverPhone.trim() || truckForm.entranceTareWeightKg === '') {
-      toast({ variant: 'destructive', title: 'Truck, driver and entrance tare weight are required' });
+    if (!truckForm.truckPlateNumber.trim() || !truckForm.driverName.trim() || !truckForm.driverPhone.trim()) {
+      toast({ variant: 'destructive', title: 'Truck and driver information are required' });
+      return;
+    }
+    if (!pendingUsesFirstMile && truckForm.weighingRequired == null) {
+      toast({ variant: 'destructive', title: 'Select whether customer truck weighing is required' });
+      return;
+    }
+    if (truckForm.weighingRequired && (truckForm.grossWeightKg === '' || truckForm.exitTareWeightKg === '')) {
+      toast({ variant: 'destructive', title: 'Gross weight and exit tare weight are required when weighing is Yes' });
       return;
     }
     await receiveBookings(pendingReceiveIds, toTruckEntrancePayload(truckForm));
@@ -906,7 +1039,9 @@ function EligibleTab({
         </Group>
       ) : statusFilteredRows.length === 0 ? (
         <Text c="dimmed" ta="center" py="lg" size="sm">
-          No eligible PAID {direction.toLowerCase()} bookings to receive.
+          {focusedBookingLabel
+            ? `${focusedBookingLabel} is not eligible for warehouse receiving yet.`
+            : `No eligible PAID ${direction.toLowerCase()} bookings to receive.`}
         </Text>
       ) : (
         <Table.ScrollContainer minWidth={1700}>
@@ -1053,8 +1188,8 @@ function EligibleTab({
         <Stack gap="md">
           <Alert icon={<Truck size={16} />} color={pendingHasFirstMile ? 'green' : 'blue'} variant="light">
             <Text size="sm">
-              {pendingHasFirstMile
-                ? 'Assigned first-mile truck and driver details are prefilled. Confirm or update the actual arrival details before GRN.'
+              {pendingUsesFirstMile
+                ? 'Received first-mile truck and driver details are pulled from the first-mile record. GRN uses booking cargo, quantity and weight.'
                 : 'Register the customer or third-party truck and driver before export receiving and GRN.'}
             </Text>
           </Alert>
@@ -1109,6 +1244,7 @@ function EligibleTab({
             onChange={setTruckForm}
             lockedFields={lockedTruckFields}
             packagingFreightType={packagingFreightType}
+            allowTruckWeighing={!pendingUsesFirstMile}
           />
           <Group justify="flex-end">
             <Button variant="default" onClick={() => setTruckOpen(false)} disabled={bulkReceive.isPending}>
@@ -1611,14 +1747,59 @@ function LoadedExportTab({
   );
 }
 
-/** Assigned bookings/items for an arrived import train (read-only detail view). */
-function ImportTrainDetailTable({ train }: { train: ImportTrain }) {
+const importLocationTypesForFreight = (freightType: string | null | undefined) => {
+  const normalized = (freightType ?? '').toUpperCase();
+  if (normalized === 'CONTAINER') {
+    return { yardTypes: ['CONTAINER_YARD', 'GENERAL_CARGO_YARD'], zoneTypes: ['CONTAINER_ZONE', 'GENERAL_CARGO_ZONE'] };
+  }
+  return { yardTypes: ['BULK_YARD', 'GENERAL_CARGO_YARD'], zoneTypes: ['BULK_ZONE', 'GENERAL_CARGO_ZONE'] };
+};
+
+const isImportContainerFreight = (freightType: string | null | undefined) =>
+  (freightType ?? '').toUpperCase() === 'CONTAINER';
+
+const isImportUnloadPending = (item: ImportTrainItem) =>
+  !item.currentStatus || item.currentStatus === 'RECEIVED';
+
+/** Assigned bookings/items for an arrived import train with per-booking unload locations. */
+function ImportTrainDetailTable({
+  train,
+  warehouses,
+  yards,
+  zones,
+  assignments,
+  onAssignmentChange,
+  onReadyChange,
+}: {
+  train: ImportTrain;
+  warehouses: Warehouse[];
+  yards: WarehouseYard[];
+  zones: WarehouseZone[];
+  assignments: Record<string, ImportUnloadAssignmentDraft>;
+  onAssignmentChange: (bookingId: string, draft: ImportUnloadAssignmentDraft) => void;
+  onReadyChange: (ready: boolean) => void;
+}) {
   const { data: items = [], isLoading } = useQuery(
     api.warehouses.importTrainItems.queryOptions({
       input: { scheduleId: train.scheduleId },
       enabled: Boolean(train.scheduleId),
     }),
   );
+  const warehouseOptions = useMemo(
+    () => warehouses.map((warehouse) => ({ value: warehouse.id, label: `${warehouse.name} (${warehouse.code})` })),
+    [warehouses],
+  );
+
+  useEffect(() => {
+    const pending = items.filter(isImportUnloadPending);
+    onReadyChange(
+      pending.length > 0 &&
+        pending.every((item) => {
+          const draft = assignments[item.bookingId];
+          return Boolean(draft?.warehouseId && draft.yardId && draft.zoneId);
+        }),
+    );
+  }, [assignments, items]);
 
   if (isLoading) {
     return (
@@ -1648,6 +1829,9 @@ function ImportTrainDetailTable({ train }: { train: ImportTrain }) {
           <Table.Th>Cargo Type</Table.Th>
           <Table.Th>Weight</Table.Th>
           <Table.Th>Arrival</Table.Th>
+          <Table.Th>Warehouse</Table.Th>
+          <Table.Th>Yard</Table.Th>
+          <Table.Th>Zone</Table.Th>
           <Table.Th>Inspection</Table.Th>
           <Table.Th>Current Status</Table.Th>
           <Table.Th>Last Mile</Table.Th>
@@ -1655,7 +1839,18 @@ function ImportTrainDetailTable({ train }: { train: ImportTrain }) {
         </Table.Tr>
       </Table.Thead>
       <Table.Tbody>
-        {items.map((it: ImportTrainItem) => (
+        {items.map((it: ImportTrainItem) => {
+          const draft = assignments[it.bookingId] ?? {};
+          const { yardTypes, zoneTypes } = importLocationTypesForFreight(it.freightType);
+          const yardOptions = yards
+            .filter((yard) => yard.warehouseId === draft.warehouseId && yardTypes.includes(yard.type))
+            .map((yard) => ({ value: yard.id, label: `${yard.name} (${yard.code})` }));
+          const zoneOptions = zones
+            .filter((zone) => zone.yardId === draft.yardId && zoneTypes.includes(zone.type))
+            .map((zone) => ({ value: zone.id, label: `${zone.name} (${zone.code})` }));
+          const pending = isImportUnloadPending(it);
+
+          return (
           <Table.Tr key={`${it.bookingId}-${it.sequenceNo ?? 'wagon'}`}>
             <Table.Td>
               <Text size="xs" fw={600}>
@@ -1676,6 +1871,41 @@ function ImportTrainDetailTable({ train }: { train: ImportTrain }) {
             <Table.Td>{it.cargoType ?? '—'}</Table.Td>
             <Table.Td>{formatNumber(Number(it.weight))}</Table.Td>
             <Table.Td>{formatDate(it.arrivalTime)}</Table.Td>
+            <Table.Td>
+              <Select
+                placeholder="Warehouse"
+                data={warehouseOptions}
+                value={draft.warehouseId ?? null}
+                onChange={(value) => onAssignmentChange(it.bookingId, { warehouseId: value ?? undefined })}
+                searchable
+                disabled={!pending}
+                w={210}
+              />
+            </Table.Td>
+            <Table.Td>
+              <Select
+                placeholder={isImportContainerFreight(it.freightType) ? 'Container yard' : 'Bulk yard'}
+                data={yardOptions}
+                value={draft.yardId ?? null}
+                onChange={(value) =>
+                  onAssignmentChange(it.bookingId, { ...draft, yardId: value ?? undefined, zoneId: undefined })
+                }
+                searchable
+                disabled={!pending || !draft.warehouseId}
+                w={190}
+              />
+            </Table.Td>
+            <Table.Td>
+              <Select
+                placeholder={isImportContainerFreight(it.freightType) ? 'Container zone' : 'Bulk zone'}
+                data={zoneOptions}
+                value={draft.zoneId ?? null}
+                onChange={(value) => onAssignmentChange(it.bookingId, { ...draft, zoneId: value ?? undefined })}
+                searchable
+                disabled={!pending || !draft.yardId}
+                w={190}
+              />
+            </Table.Td>
             <Table.Td>
               <Badge size="xs" variant="light" color={it.inspectionStatus === 'PASSED' ? 'green' : 'gray'}>
                 {it.inspectionStatus ?? 'Not inspected'}
@@ -1691,7 +1921,8 @@ function ImportTrainDetailTable({ train }: { train: ImportTrain }) {
             </Table.Td>
             <Table.Td>{it.pickupOption}</Table.Td>
           </Table.Tr>
-        ))}
+          );
+        })}
       </Table.Tbody>
     </Table>
   );
@@ -1715,13 +1946,42 @@ function ImportArriveQueueTab({
   const { data: trains = [], isLoading } = useQuery(
     api.warehouses.importArriveQueue.queryOptions({ enabled }),
   );
+  const { data: warehouses = [], isLoading: warehousesLoading } = useQuery(
+    api.warehouses.list.queryOptions({ input: { filter: { status: 'ACTIVE' } }, enabled }),
+  );
+  const { data: yards = [] } = useAllWarehouseYards();
+  const { data: zones = [] } = useAllWarehouseZones();
   const autoUnloadMutation = useMutation(
     api.warehouses.autoUnloadArrivedBookings.mutationOptions(),
   );
   const [openId, setOpenId] = useState<string | null>(null);
   const [busyId, setBusyId] = useState<string | null>(null);
+  const [assignmentsBySchedule, setAssignmentsBySchedule] = useState<
+    Record<string, Record<string, ImportUnloadAssignmentDraft>>
+  >({});
+  const [readyBySchedule, setReadyBySchedule] = useState<Record<string, boolean>>({});
 
   const autoUnload = async (train: ImportTrain) => {
+    const assignments = Object.entries(assignmentsBySchedule[train.scheduleId] ?? {})
+      .filter((entry): entry is [string, Required<ImportUnloadAssignmentDraft>] =>
+        Boolean(entry[1].warehouseId && entry[1].yardId && entry[1].zoneId),
+      )
+      .map(([bookingId, draft]) => ({
+        bookingId,
+        warehouseId: draft.warehouseId,
+        yardId: draft.yardId,
+        zoneId: draft.zoneId,
+      }));
+
+    if (!readyBySchedule[train.scheduleId] || assignments.length === 0) {
+      toast({
+        variant: 'destructive',
+        title: 'Assign locations',
+        description: 'Select warehouse, yard and zone for each pending booking before unloading.',
+      });
+      return;
+    }
+
     if (isFullyUnloaded(train)) {
       toast({
         title: 'Already unloaded',
@@ -1732,7 +1992,7 @@ function ImportArriveQueueTab({
 
     setBusyId(train.scheduleId);
     try {
-      const r = await autoUnloadMutation.mutateAsync(train.scheduleId);
+      const r = await autoUnloadMutation.mutateAsync({ scheduleId: train.scheduleId, assignments });
       const alreadyUnloaded = r.unloadedCount === 0 && r.skippedCount > 0 && r.failedCount === 0;
       const firstReason = r.results.find((item) => item.reason)?.reason;
       const extra = [
@@ -1831,7 +2091,7 @@ function ImportArriveQueueTab({
                             color={fullyUnloaded ? 'gray' : 'indigo'}
                             leftSection={<Truck size={14} />}
                             loading={busyId === t.scheduleId}
-                            disabled={fullyUnloaded || t.totalBookings === 0}
+                            disabled={fullyUnloaded || t.totalBookings === 0 || !readyBySchedule[t.scheduleId] || warehousesLoading}
                             onClick={() => autoUnload(t)}
                           >
                             {fullyUnloaded ? 'Already Unloaded' : 'Auto Unload Arrived Bookings'}
@@ -1842,7 +2102,25 @@ function ImportArriveQueueTab({
                     {isOpen && (
                       <Table.Tr>
                         <Table.Td colSpan={11} bg="var(--mantine-color-gray-0)">
-                          <ImportTrainDetailTable train={t} />
+                          <ImportTrainDetailTable
+                            train={t}
+                            warehouses={warehouses}
+                            yards={yards}
+                            zones={zones}
+                            assignments={assignmentsBySchedule[t.scheduleId] ?? {}}
+                            onAssignmentChange={(bookingId, draft) =>
+                              setAssignmentsBySchedule((current) => ({
+                                ...current,
+                                [t.scheduleId]: {
+                                  ...(current[t.scheduleId] ?? {}),
+                                  [bookingId]: draft.warehouseId ? draft : {},
+                                },
+                              }))
+                            }
+                            onReadyChange={(ready) =>
+                              setReadyBySchedule((current) => ({ ...current, [t.scheduleId]: ready }))
+                            }
+                          />
                         </Table.Td>
                       </Table.Tr>
                     )}
@@ -1934,6 +2212,11 @@ function ImportUnloadedQueueTab({ enabled }: { enabled: boolean }) {
             reference: row.bookingReference ?? row.bookingId,
             tradeDirection: 'IMPORT',
             lastMileDeliveryAddress: row.lastMileRequested ? row.pickupOption : null,
+            customerTruckPlateNumber: row.customerTruckPlateNumber,
+            customerTruckDriverName: row.customerTruckDriverName,
+            customerTruckType: row.customerTruckType,
+            customerTruckContainerNumber: row.customerTruckContainerNumber,
+            customerTruckAssignedAt: row.customerTruckAssignedAt,
           }
         : null,
     }) as unknown as WarehouseInventoryItem;
@@ -2262,6 +2545,8 @@ interface WarehouseFlowWorkbenchProps {
   direction?: WarehouseFlowDirection;
   enabled?: boolean;
   onChanged?: () => void;
+  focusedBookingId?: string;
+  focusedBookingLabel?: string;
 }
 
 function WarehouseQueueTabs<TValue extends string>({
@@ -2481,10 +2766,14 @@ function ExportWarehouseTabs({
   enabled,
   location,
   onChanged,
+  focusedBookingId,
+  focusedBookingLabel,
 }: {
   enabled: boolean;
   location: Location;
   onChanged?: () => void;
+  focusedBookingId?: string;
+  focusedBookingLabel?: string;
 }) {
   const [activeTab, setActiveTab] = useState<ExportWarehouseTab>('receive-queue');
   const { data: eligibleRows = [] } = useQuery(
@@ -2543,7 +2832,14 @@ function ExportWarehouseTabs({
       <WarehouseQueueTabs value={activeTab} onChange={setActiveTab} tabs={tabs} />
 
       {activeTab === 'receive-queue' && (
-        <EligibleTab direction="EXPORT" location={location} enabled={enabled} onChanged={onChanged} />
+        <EligibleTab
+          direction="EXPORT"
+          location={location}
+          enabled={enabled}
+          onChanged={onChanged}
+          focusedBookingId={focusedBookingId}
+          focusedBookingLabel={focusedBookingLabel}
+        />
       )}
       {activeTab === 'received' && (
         <ExportReceivedTab enabled={enabled} onChanged={onChanged} />
@@ -2568,6 +2864,8 @@ export function WarehouseFlowWorkbench({
   direction = 'BOTH',
   enabled = true,
   onChanged,
+  focusedBookingId,
+  focusedBookingLabel,
 }: WarehouseFlowWorkbenchProps) {
   const [location, setLocation] = useState<Location>({ warehouseId: '', yardId: '', zoneId: '' });
   const [tab, setTab] = useState<Exclude<WarehouseFlowDirection, 'BOTH'>>(
@@ -2600,24 +2898,42 @@ export function WarehouseFlowWorkbench({
             <ImportWarehouseTabs enabled={enabled} onChanged={onChanged} />
           </Tabs.Panel>
           <Tabs.Panel value="EXPORT">
-            <ExportWarehouseTabs enabled={enabled} location={location} onChanged={onChanged} />
+            <ExportWarehouseTabs
+              enabled={enabled}
+              location={location}
+              onChanged={onChanged}
+              focusedBookingId={focusedBookingId}
+              focusedBookingLabel={focusedBookingLabel}
+            />
           </Tabs.Panel>
         </Tabs>
       ) : activeDirection === 'IMPORT' ? (
         <ImportWarehouseTabs enabled={enabled} onChanged={onChanged} />
       ) : (
-        <ExportWarehouseTabs enabled={enabled} location={location} onChanged={onChanged} />
+        <ExportWarehouseTabs
+          enabled={enabled}
+          location={location}
+          onChanged={onChanged}
+          focusedBookingId={focusedBookingId}
+          focusedBookingLabel={focusedBookingLabel}
+        />
       )}
     </Stack>
   );
 }
 
 /** New bulk Receive: Import / Export tabs with eligible PAID bookings. */
-function BulkReceiveModal({ opened, onClose, onReceived }: ReceiveInventoryModalProps) {
+function BulkReceiveModal({ opened, onClose, onReceived, bookingId, bookingLabel, direction = 'BOTH' }: ReceiveInventoryModalProps) {
   return (
     <Modal opened={opened} onClose={onClose} title="Receive at warehouse" centered size="80rem">
       <Stack gap="md">
-        <WarehouseFlowWorkbench enabled={opened} direction="BOTH" onChanged={onReceived} />
+        <WarehouseFlowWorkbench
+          enabled={opened}
+          direction={direction}
+          onChanged={onReceived}
+          focusedBookingId={bookingId}
+          focusedBookingLabel={bookingLabel}
+        />
 
         <Group justify="flex-end" mt="sm">
           <Button variant="default" onClick={onClose}>
@@ -2763,5 +3079,5 @@ function SingleBookingReceiveModal({
 
 export function ReceiveInventoryModal(props: ReceiveInventoryModalProps) {
   // Locked to a booking → legacy single receive; otherwise the Import/Export bulk flow.
-  return props.bookingId ? <SingleBookingReceiveModal {...props} /> : <BulkReceiveModal {...props} />;
+  return props.bookingId && props.mode !== 'bulk' ? <SingleBookingReceiveModal {...props} /> : <BulkReceiveModal {...props} />;
 }
diff --git a/apps/edr-freight-web/backoffice/src/components/warehouses/ReleaseOrderModal.tsx b/apps/edr-freight-web/backoffice/src/components/warehouses/ReleaseOrderModal.tsx
index be49e527b..b962a7393 100644
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/ReleaseOrderModal.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/ReleaseOrderModal.tsx
@@ -15,6 +15,17 @@ interface ReleaseOrderModalProps {
   opened: boolean;
   onClose: () => void;
   item: WarehouseInventoryItem | null;
+  truckPrefill?: ReleaseOrderTruckPrefill | null;
+}
+
+export interface ReleaseOrderTruckPrefill {
+  truckPlateNumber?: string | null;
+  trailerPlateNumber?: string | null;
+  driverName?: string | null;
+  driverLicense?: string | null;
+  driverPhone?: string | null;
+  truckType?: string | null;
+  containerNumber?: string | null;
 }
 
 const REGISTERED_FIRST_LAST_MILE_TRUCKS = [
@@ -82,6 +93,9 @@ const splitContainerNumbers = (value: string | null | undefined) =>
 const getItemContainerNumber = (item: WarehouseInventoryItem | null) =>
   (item as (WarehouseInventoryItem & { containerNumber?: string | null }) | null)?.containerNumber ?? '';
 
+const assignedTruckValue = (item: WarehouseInventoryItem | null, key: keyof NonNullable<WarehouseInventoryItem['booking']>) =>
+  item?.booking?.[key] == null ? '' : String(item.booking[key]);
+
 const isContainerInventory = (item: WarehouseInventoryItem | null, containerCount: number) => {
   const freightType = (item as (WarehouseInventoryItem & { booking?: { freightType?: string | null } | null }) | null)
     ?.booking?.freightType;
@@ -117,7 +131,7 @@ const parseInspectionNote = (notes: string | null | undefined) => {
   };
 };
 
-export function ReleaseOrderModal({ opened, onClose, item }: ReleaseOrderModalProps) {
+export function ReleaseOrderModal({ opened, onClose, item, truckPrefill }: ReleaseOrderModalProps) {
   const { toast } = useToast();
   const releaseMutation = useMutation(api.warehouses.release.mutationOptions());
   const [reference, setReference] = useState('');
@@ -138,25 +152,34 @@ export function ReleaseOrderModal({ opened, onClose, item }: ReleaseOrderModalPr
   useEffect(() => {
     if (opened) {
       const inspection = parseInspectionNote(item?.notes);
+      const assignedTruckPlate = assignedTruckValue(item, 'customerTruckPlateNumber');
+      const assignedDriverName = assignedTruckValue(item, 'customerTruckDriverName');
+      const assignedTruckType = assignedTruckValue(item, 'customerTruckType');
+      const assignedContainerNumber = assignedTruckValue(item, 'customerTruckContainerNumber');
+      const prefillContainerNumber = truckPrefill?.containerNumber ?? '';
       setReference(item?.releaseOrderReference ?? generateReleaseReference(item));
-      setTruckPlateNumber(inspection.truckPlateNumber);
-      setTrailerPlateNumber(inspection.trailerPlateNumber);
-      setDriverName(inspection.driverName);
-      setDriverLicense(inspection.driverLicense);
-      setDriverPhone(inspection.driverPhone);
-      setTruckType(inspection.truckType);
-      setContainerNumbers(initialContainerNumbers(item, inspection.containerNumber));
+      setTruckPlateNumber(inspection.truckPlateNumber || truckPrefill?.truckPlateNumber || assignedTruckPlate || '');
+      setTrailerPlateNumber(inspection.trailerPlateNumber || truckPrefill?.trailerPlateNumber || '');
+      setDriverName(inspection.driverName || truckPrefill?.driverName || assignedDriverName || '');
+      setDriverLicense(inspection.driverLicense || truckPrefill?.driverLicense || '');
+      setDriverPhone(inspection.driverPhone || truckPrefill?.driverPhone || '');
+      setTruckType(inspection.truckType || truckPrefill?.truckType || assignedTruckType || '');
+      setContainerNumbers(initialContainerNumbers(item, inspection.containerNumber || prefillContainerNumber || assignedContainerNumber));
       setGateInTime(inspection.gateInTime);
       setTareWeight(inspection.tareWeight);
       setGrossWeight(inspection.grossWeight);
       setNetWeight(item?.weight == null ? inspection.netWeight : Number(item.weight));
       setGateOutTime(inspection.gateOutTime);
     }
-  }, [opened, item]);
+  }, [opened, item, truckPrefill]);
 
   const savedInspection = parseInspectionNote(item?.notes);
   const isExitStep = savedInspection.tareWeight !== '';
   const isEntranceLocked = isExitStep;
+  const isCustomerAssignedTruck = Boolean(item?.booking?.customerTruckAssignedAt);
+  const hasLastMileTruckPrefill = Boolean(truckPrefill?.truckPlateNumber || truckPrefill?.trailerPlateNumber);
+  const isTruckIdentityLocked = isEntranceLocked || isCustomerAssignedTruck || hasLastMileTruckPrefill;
+  const isDriverNameLocked = isEntranceLocked || isCustomerAssignedTruck || Boolean(truckPrefill?.driverName);
   const systemNetWeight = item?.weight == null ? netWeight : Number(item.weight);
   const computedNetWeight =
     tareWeight !== '' && grossWeight !== '' ? Number((Number(grossWeight) - Number(tareWeight)).toFixed(3)) : null;
@@ -269,7 +292,7 @@ export function ReleaseOrderModal({ opened, onClose, item }: ReleaseOrderModalPr
           searchable
           clearable
           data={REGISTERED_FIRST_LAST_MILE_TRUCKS}
-          disabled={isEntranceLocked}
+          disabled={isTruckIdentityLocked}
           value={REGISTERED_FIRST_LAST_MILE_TRUCKS.some((truck) => truck.value === truckPlateNumber) ? truckPlateNumber : null}
           onChange={(value) => {
             const truck = REGISTERED_FIRST_LAST_MILE_TRUCKS.find((row) => row.value === value);
@@ -283,7 +306,7 @@ export function ReleaseOrderModal({ opened, onClose, item }: ReleaseOrderModalPr
             required
             value={truckPlateNumber}
             onChange={(e) => setTruckPlateNumber(e.currentTarget.value)}
-            readOnly={isEntranceLocked}
+            readOnly={isTruckIdentityLocked}
           />
           <TextInput
             label="Trailer plate number"
@@ -293,12 +316,12 @@ export function ReleaseOrderModal({ opened, onClose, item }: ReleaseOrderModalPr
           />
         </Group>
         <Group grow>
-          <TextInput label="Driver name" required value={driverName} onChange={(e) => setDriverName(e.currentTarget.value)} readOnly={isEntranceLocked} />
+          <TextInput label="Driver name" required value={driverName} onChange={(e) => setDriverName(e.currentTarget.value)} readOnly={isDriverNameLocked} />
           <TextInput label="Driver license" value={driverLicense} onChange={(e) => setDriverLicense(e.currentTarget.value)} readOnly={isEntranceLocked} />
         </Group>
         <Group grow>
           <TextInput label="Driver phone" value={driverPhone} onChange={(e) => setDriverPhone(e.currentTarget.value)} readOnly={isEntranceLocked} />
-          <TextInput label="Truck type" value={truckType} onChange={(e) => setTruckType(e.currentTarget.value)} readOnly={isEntranceLocked} />
+          <TextInput label="Truck type" value={truckType} onChange={(e) => setTruckType(e.currentTarget.value)} readOnly={isTruckIdentityLocked} />
         </Group>
         <Group grow>
           <Stack gap={6}>
@@ -313,7 +336,7 @@ export function ReleaseOrderModal({ opened, onClose, item }: ReleaseOrderModalPr
                       numbers.map((number, numberIndex) => (numberIndex === index ? e.currentTarget.value : number)),
                     )
                   }
-                  readOnly={isEntranceLocked}
+                  readOnly={isTruckIdentityLocked}
                 />
               ))}
             </SimpleGrid>
diff --git a/apps/edr-freight-web/backoffice/src/components/warehouses/warehousePdf.ts b/apps/edr-freight-web/backoffice/src/components/warehouses/warehousePdf.ts
index 8b526fb3d..39daf7b57 100644
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/warehousePdf.ts
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/warehousePdf.ts
@@ -31,9 +31,6 @@ export interface WarehouseHandoverPdfContext {
 const escapePdfText = (value: string) =>
   value.replace(/\\/g, '\\\\').replace(/\(/g, '\\(').replace(/\)/g, '\\)');
 
-const money = (amount: unknown, currency = 'USD') =>
-  `${Number(amount ?? 0).toLocaleString()} ${currency === 'ETB' ? 'Birr (ETB)' : currency}`;
-
 const fmtDate = (value: unknown) => {
   if (!value) return '-';
   const date = new Date(value as string | Date);
@@ -96,12 +93,6 @@ const textOp = (
   color = '0 0 0',
 ) => `BT\n${color} rg\n/${bold ? 'F2' : 'F1'} ${size} Tf\n${x} ${y} Td\n(${escapePdfText(text)}) Tj\nET`;
 
-const buildAuthorizationBand = (label: 'PAID' | 'CLEARED') => [
-  lineOp(60, 242, 535, 242),
-  textOp('AUTHORIZED SEAL', 382, 218, 9, true, GREEN),
-  buildCircularSeal(452, 155, label),
-];
-
 const buildWarehouseOfficerSealBand = () => [
   lineOp(60, 218, 535, 218),
   textOp('WAREHOUSE OFFICER SEAL', 92, 194, 9, true, GREEN),
@@ -146,57 +137,6 @@ function buildSimplePdf(lines: PdfLine[], rawOps: string[] = []): Blob {
   return new Blob([pdf], { type: 'application/pdf' });
 }
 
-export function buildWarehouseInvoicePdf(invoice: WarehouseFeeInvoice, kind: 'INVOICE' | 'RECEIPT') {
-  const paid = kind === 'RECEIPT' || invoice.status === 'PAID';
-  const title = `Warehouse Fee ${kind === 'RECEIPT' ? 'Receipt' : 'Invoice'}`;
-  const bookingReference = firstText(invoice.bookingReference);
-  const customerName = firstText(invoice.customerName);
-  const inventoryReference = firstText(invoice.inventoryReference);
-  const inventoryInfo = firstText(invoice.inventoryInfo, invoice.containerNumber, invoice.cargoDescription);
-  const clearanceStatus = firstText(
-    invoice.clearanceStatus,
-    paid ? 'FEE PAID - READY FOR RELEASE' : 'PENDING PAYMENT',
-  );
-  const lines: PdfLine[] = [
-    { text: 'Ethio-Djibouti Railway S.C.', size: 12, bold: true, yGap: 0, align: 'center' },
-    { text: title, size: 23, bold: true, yGap: 28, align: 'center' },
-    { text: `Document No: ${invoice.invoiceNumber}`, size: 12, bold: true, yGap: 32, align: 'center' },
-    { text: `Status: ${invoice.status.replace(/_/g, ' ')}     Type: ${invoice.invoiceType.replace(/_/g, ' ')}`, align: 'center' },
-    { text: `Booking Reference: ${bookingReference}     Customer: ${customerName}`, align: 'center' },
-    { text: `Inventory Reference: ${inventoryReference}     Inventory Info: ${inventoryInfo}`, align: 'center' },
-    { text: `Clearance: ${clearanceStatus}`, align: 'center' },
-    { text: `Issued: ${fmtDate(invoice.issuedAt)}     Paid At: ${fmtDate(invoice.paidAt)}`, align: 'center' },
-    { text: 'ITEMS', size: 13, bold: true, yGap: 30, align: 'center' },
-    ...(invoice.items ?? []).flatMap((item) => [
-      { text: item.description, bold: true, align: 'center' as const },
-      {
-        text: `${item.feeType.replace(/_/g, ' ')} | Qty ${Number(item.quantity ?? 0).toLocaleString()} | Rate ${money(item.unitRate, item.currency)} | Amount ${money(item.amount, item.currency)}`,
-        yGap: 13,
-        align: 'center' as const,
-      },
-    ]),
-    { text: 'TOTALS', size: 13, bold: true, yGap: 30, align: 'center' },
-    { text: `Subtotal: ${money(invoice.subtotalAmount, invoice.currency)}`, align: 'center' },
-    { text: `Tax: ${money(invoice.taxAmount, invoice.currency)}`, align: 'center' },
-    { text: `Total: ${money(invoice.totalAmount, invoice.currency)}`, bold: true, align: 'center' },
-    { text: `Paid: ${money(invoice.paidAmount, invoice.currency)}`, align: 'center' },
-    { text: `Balance: ${money(invoice.balanceAmount, invoice.currency)}`, bold: true, align: 'center' },
-  ];
-  const authorizationOps = [
-    ...buildAuthorizationBand('PAID'),
-    textOp('Prepared by EDR warehouse finance', 72, 196, 10),
-    textOp('Finance officer name / signature / date:', 72, 164, 10),
-    lineOp(245, 162, 360, 162, '0 0 0'),
-  ];
-  const invoiceOps = [
-    lineOp(60, 242, 535, 242),
-    textOp('Prepared by EDR warehouse finance', 72, 196, 10),
-    textOp('Finance officer name / signature / date:', 72, 164, 10),
-    lineOp(245, 162, 360, 162, '0 0 0'),
-  ];
-  return buildSimplePdf(lines, paid ? authorizationOps : invoiceOps);
-}
-
 const firstText = (...values: Array<unknown>) => {
   for (const value of values) {
     if (value !== null && value !== undefined && String(value).trim()) return String(value);
diff --git a/apps/edr-freight-web/backoffice/src/constants/QUERY_KEYS.ts b/apps/edr-freight-web/backoffice/src/constants/QUERY_KEYS.ts
index 59b493bf3..2221fe898 100644
--- a/apps/edr-freight-web/backoffice/src/constants/QUERY_KEYS.ts
+++ b/apps/edr-freight-web/backoffice/src/constants/QUERY_KEYS.ts
@@ -44,6 +44,8 @@ export const QUERY_KEYS = {
     listSummary: (filter?: BookingListFilter) =>
       ["bookings", "list-summary", filter ?? {}] as const,
     byId: (id: string) => ["bookings", "detail", id] as const,
+    clearanceQueue: (region?: string) =>
+      ["bookings", "clearance-queue", region ?? "ET"] as const,
   },
 
   CONTRACTS: {
@@ -98,6 +100,12 @@ export const QUERY_KEYS = {
     list: (resource: FleetResourceSlug | string) => ["fleet", "list", resource] as const,
   },
 
+  VEHICLES: {
+    ROOT: ["vehicles"] as const,
+    list: (filter?: Record<string, unknown>) => ["vehicles", "list", filter ?? {}] as const,
+    byId: (id: string) => ["vehicles", "detail", id] as const,
+  },
+
   FIRST_MILE: {
     ROOT: ["first-mile"] as const,
     list: (filter?: Record<string, unknown>) => ["first-mile", "list", filter ?? {}] as const,
@@ -135,4 +143,24 @@ export const QUERY_KEYS = {
     customersTab: (range?: string) => ["overview", "customers", range ?? "30d"] as const,
     staffTab: (range?: string) => ["overview", "staff", range ?? "30d"] as const,
   },
+
+  FUEL: {
+    ROOT: ["fuel"] as const,
+    purchases: (vehicleId?: string) => ["fuel", "purchases", vehicleId ?? "all"] as const,
+    stats: (vehicleId?: string) => ["fuel", "stats", vehicleId ?? "all"] as const,
+  },
+
+  MAINTENANCE: {
+    ROOT: ["maintenance"] as const,
+    schedules: (vehicleId?: string) => ["maintenance", "schedules", vehicleId ?? "all"] as const,
+    upcoming: (vehicleId?: string) => ["maintenance", "upcoming", vehicleId ?? "all"] as const,
+    history: (vehicleId?: string) => ["maintenance", "history", vehicleId ?? "all"] as const,
+    stats: (vehicleId?: string) => ["maintenance", "stats", vehicleId ?? "all"] as const,
+  },
+
+  FINANCIAL_REPORTS: {
+    ROOT: ["financial-reports"] as const,
+    fleet: (vehicleId?: string, months?: number) =>
+      ["financial-reports", "fleet", vehicleId ?? "all", months ?? 12] as const,
+  },
 } as const;
diff --git a/apps/edr-freight-web/backoffice/src/constants/URLS.ts b/apps/edr-freight-web/backoffice/src/constants/URLS.ts
index e58f5bfc8..dff9167f5 100644
--- a/apps/edr-freight-web/backoffice/src/constants/URLS.ts
+++ b/apps/edr-freight-web/backoffice/src/constants/URLS.ts
@@ -123,6 +123,18 @@ export const URL_CONSTANTS = {
     COMPLETE: (id: string) => `/bookings/${id}/operations/complete`,
     CANCEL: (id: string) => `/bookings/${id}/cancel`,
     CONSOLIDATION: (id: string) => `/bookings/${id}/consolidation`,
+    CLEARANCE: (id: string) => `/bookings/${id}/clearance`,
+    CLEARANCE_DECLARATION: (id: string) => `/bookings/${id}/clearance/declaration`,
+    CLEARANCE_DUTY: (id: string) => `/bookings/${id}/clearance/duty`,
+    CLEARANCE_FINALIZE_PRE: (id: string) =>
+      `/bookings/${id}/clearance/finalize-pre-clearance`,
+    CLEARANCE_TRANSIT_PERMIT: (id: string) => `/bookings/${id}/clearance/transit-permit`,
+    CLEARANCE_DELIVERY_ORDER: (id: string) => `/bookings/${id}/clearance/delivery-order`,
+    CLEARANCE_RELEASE_ORDER: (id: string) => `/bookings/${id}/clearance/release-order`,
+    CLEARANCE_RO_AMENDMENT: (id: string) => `/bookings/${id}/clearance/ro-amendment`,
+    CLEARANCE_EXPORT_RELEASE: (id: string) => `/bookings/${id}/clearance/export-release`,
+    CLEARANCE_ET_QUEUE: "/bookings/clearance/et-queue",
+    CLEARANCE_DJ_QUEUE: "/bookings/clearance/dj-queue",
   },
 
   CONTRACTS: {
@@ -137,6 +149,7 @@ export const URL_CONSTANTS = {
       `/contracts/${id}/approval-steps/${stepId}/approve`,
     CONTRACT_GENERATE: (id: string) => `/contracts/${id}/contract/generate`,
     CONTRACT_VIEW: (id: string) => `/contracts/${id}/contract/view`,
+    CONTRACT_DOCUMENT: (id: string) => `/contracts/${id}/contract/document`,
     CONTRACT_SIGN: (id: string) => `/contracts/${id}/contract/sign`,
     CLEARANCE_QUEUE: "/contracts/clearance/queue",
     CLEARANCE: (id: string) => `/contracts/${id}/clearance`,
@@ -144,6 +157,25 @@ export const URL_CONSTANTS = {
     CLEARANCE_OUTPUT_DOCUMENTS: (id: string) =>
       `/contracts/${id}/clearance/output-documents`,
     CLEARANCE_FINALIZE: (id: string) => `/contracts/${id}/clearance/finalize`,
+    CLEARANCE_DECLARATION: (id: string) => `/contracts/${id}/clearance/declaration`,
+    CLEARANCE_DUTY: (id: string) => `/contracts/${id}/clearance/duty`,
+    CLEARANCE_DUTY_SLIP: (id: string) => `/contracts/${id}/clearance/duty-slip`,
+    CLEARANCE_FINALIZE_PRE: (id: string) =>
+      `/contracts/${id}/clearance/finalize-pre-clearance`,
+    CLEARANCE_TRANSIT_PERMIT: (id: string) =>
+      `/contracts/${id}/clearance/transit-permit`,
+    CLEARANCE_DELIVERY_ORDER: (id: string) =>
+      `/contracts/${id}/clearance/delivery-order`,
+    CLEARANCE_RELEASE_ORDER: (id: string) =>
+      `/contracts/${id}/clearance/release-order`,
+    CLEARANCE_RO_AMENDMENT: (id: string) =>
+      `/contracts/${id}/clearance/ro-amendment`,
+    CLEARANCE_EXPORT_RELEASE: (id: string) =>
+      `/contracts/${id}/clearance/export-release`,
+    CLEARANCE_FINALIZE_EXPORT: (id: string) =>
+      `/contracts/${id}/clearance/finalize-export-clearance`,
+    CLEARANCE_ET_QUEUE: "/contracts/clearance/et-queue",
+    CLEARANCE_DJ_QUEUE: "/contracts/clearance/dj-queue",
     // Path A self-clearance — Operations reviews the customer's own clearance docs.
     OPS_CLEARANCE_QUEUE: "/contracts/clearance/ops-queue",
     OPS_CLEARANCE_REVIEW: (id: string) =>
@@ -177,6 +209,8 @@ export const URL_CONSTANTS = {
       `/contracts/bookings/${bookingId}/station-assign`,
     BOOKING_GL_DOCUMENTS: (bookingId: string) =>
       `/contracts/bookings/${bookingId}/documents`,
+    BOOKING_TRANSPORT_DOCUMENT: (bookingId: string) =>
+      `/contracts/bookings/${bookingId}/transport-document`,
     BOOKING_INCIDENTS: (bookingId: string) =>
       `/contracts/bookings/${bookingId}/incidents`,
   },
@@ -441,6 +475,7 @@ export const URL_CONSTANTS = {
     RECEIPT: (id: string) => `/warehouse-fee-invoices/${id}/receipt`,
     CANCEL: (id: string) => `/warehouse-fee-invoices/${id}/cancel`,
     PAY: (id: string) => `/warehouse-fee-invoices/${id}/pay`,
+    PAY_ONLINE: (id: string) => `/warehouse-fee-invoices/${id}/pay-online`,
     GENERATE: (inventoryId: string) => `/warehouse-inventory/${inventoryId}/generate-fee-invoice`,
     FOR_INVENTORY: (inventoryId: string) => `/warehouse-inventory/${inventoryId}/fee-invoices`,
     FOR_BOOKING: (bookingId: string) => `/bookings/${bookingId}/warehouse-fee-invoices`,
diff --git a/apps/edr-freight-web/backoffice/src/constants/apiConfig.ts b/apps/edr-freight-web/backoffice/src/constants/apiConfig.ts
index 07e271cb6..842276815 100644
--- a/apps/edr-freight-web/backoffice/src/constants/apiConfig.ts
+++ b/apps/edr-freight-web/backoffice/src/constants/apiConfig.ts
@@ -1,12 +1,7 @@
-
-export const API_BASE_URL = 'https://edrfreightapi.triaplc.com';
-//export const API_BASE_URL = 'http://localhost:3001';
-
-
+export const API_BASE_URL = import.meta.env.VITE_BASE_API_URL;
 
 // export const API_BASE_URL = 'http://localhost:3001';
 
-
 /**
  * URL that streams an uploaded file through the API by its UUID. Routes the
  * bytes through `GET /api/files/:id` (served from MinIO with backend
diff --git a/apps/edr-freight-web/backoffice/src/features/contracts/mapShipmentListRow.ts b/apps/edr-freight-web/backoffice/src/features/contracts/mapShipmentListRow.ts
new file mode 100644
index 000000000..766c04ee1
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/features/contracts/mapShipmentListRow.ts
@@ -0,0 +1,64 @@
+import type { Freight } from "@edr/types";
+
+export interface ShipmentListRow {
+  id: string;
+  reference: string;
+  contractId: string;
+  contractReference: string;
+  scheduledDate?: string | null;
+  summary: string;
+  status: Freight.BookingRequestStatus;
+  createdBookingId?: string | null;
+}
+
+export type ShipmentRowAction =
+  | {
+      kind: "navigate";
+      label: string;
+      to: (row: ShipmentListRow) => string;
+      variant: "filled" | "light" | "default";
+    }
+  | {
+      kind: "reject";
+      label: string;
+      variant: "light";
+    };
+
+/** Primary staff action for a shipment request list row. */
+export function getShipmentStaffRowAction(
+  row: Pick<
+    ShipmentListRow,
+    "status" | "contractId" | "id" | "createdBookingId"
+  >,
+): ShipmentRowAction {
+  if (row.status === "PENDING") {
+    return {
+      kind: "navigate",
+      label: "Accept",
+      to: (r) =>
+        `/dashboard/contracts/${r.contractId}/create-booking?requestId=${r.id}`,
+      variant: "filled",
+    };
+  }
+  if (row.status === "ACCEPTED" && row.createdBookingId) {
+    return {
+      kind: "navigate",
+      label: "View clearance",
+      to: (r) => `/dashboard/clearance/${r.createdBookingId}`,
+      variant: "light",
+    };
+  }
+  return {
+    kind: "navigate",
+    label: "Review",
+    to: (r) => `/dashboard/shipment-requests/${r.id}`,
+    variant: "default",
+  };
+}
+
+export function getShipmentRejectAction(
+  row: Pick<ShipmentListRow, "status">,
+): ShipmentRowAction | null {
+  if (row.status !== "PENDING") return null;
+  return { kind: "reject", label: "Reject", variant: "light" };
+}
diff --git a/apps/edr-freight-web/backoffice/src/hooks/bookings/useBookings.ts b/apps/edr-freight-web/backoffice/src/hooks/bookings/useBookings.ts
index c403d911c..8ea6f6f27 100644
--- a/apps/edr-freight-web/backoffice/src/hooks/bookings/useBookings.ts
+++ b/apps/edr-freight-web/backoffice/src/hooks/bookings/useBookings.ts
@@ -188,3 +188,19 @@ export function useBookingMutations(bookingId: string) {
     downloadContract: () => bookingsService.downloadContract(bookingId),
   };
 }
+
+export function useBookingEtClearanceQueue(enabled = true) {
+  return useQuery({
+    queryKey: QUERY_KEYS.BOOKINGS.clearanceQueue("ET"),
+    queryFn: () => bookingsService.getEtClearanceQueue(),
+    enabled,
+  });
+}
+
+export function useBookingDjClearanceQueue(enabled = true) {
+  return useQuery({
+    queryKey: QUERY_KEYS.BOOKINGS.clearanceQueue("DJ"),
+    queryFn: () => bookingsService.getDjClearanceQueue(),
+    enabled,
+  });
+}
diff --git a/apps/edr-freight-web/backoffice/src/hooks/contracts/useContracts.ts b/apps/edr-freight-web/backoffice/src/hooks/contracts/useContracts.ts
index 337d9f2de..04a4720aa 100644
--- a/apps/edr-freight-web/backoffice/src/hooks/contracts/useContracts.ts
+++ b/apps/edr-freight-web/backoffice/src/hooks/contracts/useContracts.ts
@@ -52,6 +52,22 @@ export function useContractClearanceQueue(enabled = true) {
   });
 }
 
+export function useEtClearanceQueue(enabled = true) {
+  return useQuery({
+    queryKey: QUERY_KEYS.CONTRACTS.clearanceQueue("ET"),
+    queryFn: () => contractsService.getEtClearanceQueue(),
+    enabled,
+  });
+}
+
+export function useDjClearanceQueue(enabled = true) {
+  return useQuery({
+    queryKey: QUERY_KEYS.CONTRACTS.clearanceQueue("DJ"),
+    queryFn: () => contractsService.getDjClearanceQueue(),
+    enabled,
+  });
+}
+
 /** Path A self-clearance queue (Operations reviews non-customs contracts). */
 export function useOpsClearanceQueue(enabled = true) {
   return useQuery({
@@ -248,7 +264,10 @@ export function useContractClearanceMutations(
       );
       refresh();
     },
-    onError: () => toast.error("Could not update document"),
+    onError: (e) =>
+      toast.error(
+        e instanceof Error ? e.message : "Could not update document",
+      ),
   });
 
   // Approve every still-pending customer document in one click. There is no
diff --git a/apps/edr-freight-web/backoffice/src/hooks/useScrollToHash.ts b/apps/edr-freight-web/backoffice/src/hooks/useScrollToHash.ts
new file mode 100644
index 000000000..f381f49d5
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/hooks/useScrollToHash.ts
@@ -0,0 +1,30 @@
+import { useEffect } from "react";
+import { useLocation } from "react-router-dom";
+
+/**
+ * Scroll to the element whose `id` matches the URL hash. Retries for a short
+ * window so it still lands on sections that mount after an async fetch (there is
+ * no router-level hash handling). Deep-link targets give a card an `id`.
+ */
+export function useScrollToHash(): void {
+  const { hash } = useLocation();
+
+  useEffect(() => {
+    if (!hash) return;
+    const id = decodeURIComponent(hash.slice(1));
+    let tries = 0;
+    let timer: ReturnType<typeof setTimeout>;
+
+    const tick = () => {
+      const el = document.getElementById(id);
+      if (el) {
+        el.scrollIntoView({ behavior: "smooth", block: "start" });
+        return;
+      }
+      if (tries++ < 20) timer = setTimeout(tick, 100);
+    };
+
+    timer = setTimeout(tick, 100);
+    return () => clearTimeout(timer);
+  }, [hash]);
+}
diff --git a/apps/edr-freight-web/backoffice/src/hooks/useWarehouses.ts b/apps/edr-freight-web/backoffice/src/hooks/useWarehouses.ts
index 0f2a23eae..2c5af46ab 100644
--- a/apps/edr-freight-web/backoffice/src/hooks/useWarehouses.ts
+++ b/apps/edr-freight-web/backoffice/src/hooks/useWarehouses.ts
@@ -280,7 +280,13 @@ export function useImportTrainItems(scheduleId?: string) {
 
 /** Unload all eligible assigned bookings of an ARRIVED import train (→ UNLOADED). */
 export const useAutoUnloadArrivedBookings = () =>
-  useInventoryMutation((scheduleId: string) => warehouseService.autoUnloadArrivedBookings(scheduleId));
+  useInventoryMutation((payload: {
+    scheduleId: string;
+    warehouseId?: string;
+    assignments?: { bookingId: string; warehouseId: string; yardId: string; zoneId: string }[];
+  }) =>
+    warehouseService.autoUnloadArrivedBookings(payload),
+  );
 
 /** Arrived EXPORT trains at Djibouti-side ports. Read-only. */
 export function useExportDjiboutiArrivalQueue(enabled = true) {
diff --git a/apps/edr-freight-web/backoffice/src/lib/permissions.ts b/apps/edr-freight-web/backoffice/src/lib/permissions.ts
index 2469e7047..8ea3fdc28 100644
--- a/apps/edr-freight-web/backoffice/src/lib/permissions.ts
+++ b/apps/edr-freight-web/backoffice/src/lib/permissions.ts
@@ -33,7 +33,9 @@ export const FREIGHT_PERMS = {
     clearanceReview: "edr_freight_app:contracts:clearance_review",
     finalizeClearance: "edr_freight_app:contracts:finalize_clearance",
     createBooking: "edr_freight_app:contracts:create_booking",
-    opsClearanceReview: "edr_freight_app:contracts:ops_clearance_review",
+    clearanceDutyAdvise: "edr_freight_app:contracts:clearance_duty_advise",
+    clearanceEtActions: "edr_freight_app:contracts:clearance_et_actions",
+    clearanceDjActions: "edr_freight_app:contracts:clearance_dj_actions",
   },
   trainScheduling: {
     view: "edr_freight_app:train_scheduling:view",
diff --git a/apps/edr-freight-web/backoffice/src/pages/bookings/BookingRequestDetailPage.tsx b/apps/edr-freight-web/backoffice/src/pages/bookings/BookingRequestDetailPage.tsx
index 75badc5b3..ebfe22cb7 100644
--- a/apps/edr-freight-web/backoffice/src/pages/bookings/BookingRequestDetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/bookings/BookingRequestDetailPage.tsx
@@ -50,6 +50,7 @@ import {
   useBookingDetail,
   useBookingMutations,
 } from "@/hooks/bookings/useBookings";
+import { useScrollToHash } from "@/hooks/useScrollToHash";
 import toast from "react-hot-toast";
 
 // Signature / generated-contract files are surfaced on the contract page, not
@@ -65,6 +66,8 @@ export default function BookingRequestDetailPage() {
   const { id } = useParams<{ id: string }>();
   const navigate = useNavigate();
   const [searchParams, setSearchParams] = useSearchParams();
+  // Deep-link from a warehouse fee invoice → this booking's warehouse section.
+  useScrollToHash();
   const {
     data: booking,
     isLoading,
@@ -281,24 +284,28 @@ export default function BookingRequestDetailPage() {
               <Stack gap="lg">
                 <BookingCompanyCard booking={booking} />
                 <BookingPricingSummary booking={booking} />
-                <WarehouseInfoCard
-                  bookingId={booking.id}
-                  bookingReference={booking.reference}
-                />
+                <Box id="warehouse-payments">
+                  <WarehouseInfoCard
+                    bookingId={booking.id}
+                    bookingReference={booking.reference}
+                  />
+                </Box>
                 <BookingActionsToolbar
                   booking={booking}
                   mutations={mutations}
                 />
-                <Button
-                  fullWidth
-                  variant="default"
-                  leftSection={<Milestone size={16} />}
-                  onClick={() =>
-                    navigate(`/dashboard/bookings/${booking.id}/milestones`)
-                  }
-                >
-                  View clearance milestones
-                </Button>
+                {booking.customsClearingEnabled && (
+                  <Button
+                    fullWidth
+                    variant="default"
+                    leftSection={<Milestone size={16} />}
+                    onClick={() =>
+                      navigate(`/dashboard/bookings/${booking.id}/clearance`)
+                    }
+                  >
+                    View document clearance
+                  </Button>
+                )}
                 {showContractButton && (
                   <Button
                     fullWidth
diff --git a/apps/edr-freight-web/backoffice/src/pages/bookings/DocumentClearanceDetailPage.tsx b/apps/edr-freight-web/backoffice/src/pages/bookings/DocumentClearanceDetailPage.tsx
index 72679aea8..a514cd3ec 100644
--- a/apps/edr-freight-web/backoffice/src/pages/bookings/DocumentClearanceDetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/bookings/DocumentClearanceDetailPage.tsx
@@ -25,27 +25,39 @@ import {
 } from "lucide-react";
 import type { Freight } from "@edr/types";
 
+import { ClearanceOpsTabs } from "@/components/contracts/ClearanceOpsTabs";
 import { PageContainer } from "@/components/page/PageContainer";
 import { PageHeader } from "@/components/page/PageHeader";
 import { SectionCard } from "@/components/bookings/detail";
 import { ClearanceReviewSection } from "@/components/bookings/detail/ClearanceReviewSection";
+import { ClearancePhaseStepper } from "@/components/contracts/ClearancePhaseStepper";
+import { PhasedClearanceActionPanel } from "@/components/contracts/PhasedClearanceActionPanel";
+import { ClearanceMilestoneTimeline } from "@/components/contracts/ClearanceMilestoneTimeline";
+import { useFileViewer } from "@/hooks/useFileViewer";
+import { useBookingMilestones } from "@/hooks/contracts/useContracts";
 import { bookingsService } from "@/services/bookings.service";
+import { downloadBookingFile } from "@/services/files.service";
 import { useBookingDetail } from "@/hooks/bookings/useBookings";
 
 export default function DocumentClearanceDetailPage() {
-  const { id } = useParams<{ id: string }>();
+  const params = useParams<{ id?: string; bookingId?: string }>();
+  const id = params.id ?? params.bookingId;
+  const { view, viewer } = useFileViewer();
 
   const { data: booking } = useBookingDetail(id);
   const {
     data: clearance,
     isLoading,
     isError,
+    refetch,
   } = useQuery({
     queryKey: ["clearance", id],
     queryFn: () => bookingsService.getClearance(id!),
     enabled: Boolean(id),
   });
 
+  const { data: bookingMilestones } = useBookingMilestones(id);
+
   const stats = useMemo(() => {
     const docs = (clearance?.documents ?? []).filter(
       (d) => d.uploadedBy === "customer",
@@ -59,6 +71,20 @@ export default function DocumentClearanceDetailPage() {
   }, [clearance]);
 
   const reference = booking?.reference ?? "Clearance";
+  const isPhasedGeneral =
+    Boolean(booking?.customsClearingEnabled) &&
+    booking?.contractKind === "GENERAL" &&
+    Boolean(clearance?.phase);
+
+  const docsPhaseComplete =
+    clearance?.milestones?.some(
+      (m) => m.milestoneCode === "DOCUMENTS_APPROVED" && m.status === "COMPLETED",
+    ) ?? false;
+  const queriesLocked = Boolean(
+    (clearance as Freight.ContractClearanceView | undefined)?.preClearanceFinalized,
+  );
+  const workflowFiles =
+    (clearance as Freight.ContractClearanceView | undefined)?.workflowFiles ?? [];
 
   if (isLoading) {
     return (
@@ -76,9 +102,9 @@ export default function DocumentClearanceDetailPage() {
       <PageContainer>
         <PageHeader
           title="Clearance not found"
-          backTo="/dashboard/clearance"
+          backTo="/dashboard/contracts/clearance"
           breadcrumbs={[
-            { label: "Document Clearance", href: "/dashboard/clearance" },
+            { label: "Document Clearance", href: "/dashboard/contracts/clearance" },
             { label: "Not found" },
           ]}
         />
@@ -94,9 +120,9 @@ export default function DocumentClearanceDetailPage() {
       <Stack gap="lg">
         <PageHeader
           title={reference}
-          backTo="/dashboard/clearance"
+          backTo="/dashboard/contracts/clearance"
           breadcrumbs={[
-            { label: "Document Clearance", href: "/dashboard/clearance" },
+            { label: "Document Clearance", href: "/dashboard/contracts/clearance" },
             { label: reference },
           ]}
           meta={
@@ -124,60 +150,103 @@ export default function DocumentClearanceDetailPage() {
 
         <ClearanceHero booking={booking} clearance={clearance} stats={stats} />
 
-        <Grid gap="lg">
-          {/* LEFT — document review (shared with the Marketing booking detail) */}
-          <Grid.Col span={{ base: 12, lg: 8 }}>
-            <ClearanceReviewSection bookingId={id!} hideSummary />
-          </Grid.Col>
+        {isPhasedGeneral ? (
+          <Paper withBorder radius="md" p="lg">
+            <ClearancePhaseStepper
+              clearance={clearance as Freight.ContractClearanceView}
+              tradeDirection={booking?.tradeDirection ?? "IMPORT"}
+            />
+          </Paper>
+        ) : null}
 
-          {/* RIGHT — sticky progress gauge */}
-          <Grid.Col span={{ base: 12, lg: 4 }}>
-            <Box style={{ position: "sticky", top: 24 }}>
-              <SectionCard
-                icon={PackageCheck}
-                title="Review progress"
-                accent="edr-green"
-              >
-                <Stack align="center" gap="sm">
-                  <RingProgress
-                    size={140}
-                    thickness={12}
-                    roundCaps
-                    sections={[{ value: stats.pct, color: "edr-green" }]}
-                    label={
-                      <Stack gap={0} align="center">
-                        <Text fw={800} fz={26} lh={1}>
-                          {stats.pct}%
-                        </Text>
-                        <Text size="xs" c="dimmed">
-                          approved
-                        </Text>
-                      </Stack>
-                    }
+        <ClearanceOpsTabs
+          bookingId={id}
+          milestones={bookingMilestones}
+          showOpsTabs={Boolean(id)}
+          showWorkflowFilesTab={isPhasedGeneral}
+          tradeDirection={booking?.tradeDirection ?? "IMPORT"}
+          workflowFiles={workflowFiles}
+          onViewFile={view}
+          onDownloadFile={(f) => void downloadBookingFile(f.id, f.name)}
+          clearanceTab={
+            <Grid gap="lg">
+              <Grid.Col span={{ base: 12, lg: isPhasedGeneral ? 7 : 8 }}>
+                <ClearanceReviewSection
+                  bookingId={id!}
+                  hideSummary
+                  approvalsLocked={isPhasedGeneral && docsPhaseComplete}
+                  queriesLocked={queriesLocked}
+                  onChanged={() => void refetch()}
+                />
+              </Grid.Col>
+
+              <Grid.Col span={{ base: 12, lg: isPhasedGeneral ? 5 : 4 }}>
+                {isPhasedGeneral ? (
+                  <PhasedClearanceActionPanel
+                    bookingId={id!}
+                    clearance={clearance}
+                    tradeDirection={booking?.tradeDirection ?? "IMPORT"}
+                    workflowFiles={workflowFiles}
+                    roleMode="ET"
+                    onChanged={() => void refetch()}
+                    onViewFile={view}
+                    onDownloadFile={(f) => void downloadBookingFile(f.id, f.name)}
                   />
-                  <Group gap="lg" justify="center">
-                    <ProgressStat
-                      color="edr-green"
-                      label="Approved"
-                      value={stats.approved}
-                    />
-                    <ProgressStat
-                      color="red"
-                      label="Queried"
-                      value={stats.queried}
-                    />
-                    <ProgressStat
-                      color="gray"
-                      label="Pending"
-                      value={stats.pending}
-                    />
-                  </Group>
-                </Stack>
-              </SectionCard>
-            </Box>
-          </Grid.Col>
-        </Grid>
+                ) : (
+                  <Box style={{ position: "sticky", top: 24 }}>
+                    <SectionCard
+                      icon={PackageCheck}
+                      title="Review progress"
+                      accent="edr-green"
+                    >
+                      <Stack align="center" gap="sm">
+                        <RingProgress
+                          size={140}
+                          thickness={12}
+                          roundCaps
+                          sections={[{ value: stats.pct, color: "edr-green" }]}
+                          label={
+                            <Stack gap={0} align="center">
+                              <Text fw={800} fz={26} lh={1}>
+                                {stats.pct}%
+                              </Text>
+                              <Text size="xs" c="dimmed">
+                                approved
+                              </Text>
+                            </Stack>
+                          }
+                        />
+                        <Group gap="lg" justify="center">
+                          <ProgressStat
+                            color="edr-green"
+                            label="Approved"
+                            value={stats.approved}
+                          />
+                          <ProgressStat
+                            color="red"
+                            label="Queried"
+                            value={stats.queried}
+                          />
+                          <ProgressStat
+                            color="gray"
+                            label="Pending"
+                            value={stats.pending}
+                          />
+                        </Group>
+                      </Stack>
+                    </SectionCard>
+                  </Box>
+                )}
+              </Grid.Col>
+            </Grid>
+          }
+        />
+
+        {isPhasedGeneral && clearance.milestones && clearance.milestones.length > 0 ? (
+          <ClearanceMilestoneTimeline milestones={clearance.milestones} />
+        ) : null}
       </Stack>
+      {viewer}
     </PageContainer>
   );
 }
diff --git a/apps/edr-freight-web/backoffice/src/pages/bookings/NewBookingPage.tsx b/apps/edr-freight-web/backoffice/src/pages/bookings/NewBookingPage.tsx
index 690da9998..0344e99cb 100644
--- a/apps/edr-freight-web/backoffice/src/pages/bookings/NewBookingPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/bookings/NewBookingPage.tsx
@@ -70,7 +70,6 @@ interface RefCargoChild {
   id: string;
   name: string;
   code: string;
-  show_free_text_box?: boolean;
 }
 interface RefCargoGroup {
   id: string;
@@ -307,20 +306,18 @@ export default function NewBookingPage() {
     [refData?.containers],
   );
 
-  const { cargoData, freeTextById } = useMemo(() => {
+  const { cargoData } = useMemo(() => {
     const groups = refData?.cargo_type ?? [];
-    const freeText = new Map<string, boolean>();
     const data = groups.map((g) => {
       if (g.children?.length) {
-        g.children.forEach((c) => freeText.set(c.id, Boolean(c.show_free_text_box)));
         return { group: g.name, items: g.children.map((c) => ({ value: c.id, label: c.name })) };
       }
       return { value: g.id, label: g.name };
     });
-    return { cargoData: data, freeTextById: freeText };
+    return { cargoData: data };
   }, [refData?.cargo_type]);
 
-  const showFreeText = cargoTypeId ? freeTextById.get(cargoTypeId) : false;
+  const showFreeText = freightType === "BULK" && Boolean(cargoTypeId);
 
   // ---- derived totals ----
   const totalContainers = lines.reduce((s, l) => s + (l.quantity || 0), 0);
@@ -376,7 +373,7 @@ export default function NewBookingPage() {
         lastMileDeliveryAddress: lastMileDeliveryAddress.trim() || undefined,
         cargoTotalWeightVgm,
         cargoTypeId: freightType === "BULK" ? cargoTypeId : undefined,
-        cargoFreeText: freightType === "BULK" && showFreeText ? cargoFreeText.trim() || undefined : undefined,
+        cargoFreeText: freightType === "BULK" ? cargoFreeText.trim() || undefined : undefined,
         containers:
           freightType === "CONTAINER"
             ? lines.map((l) => ({
diff --git a/apps/edr-freight-web/backoffice/src/pages/configuration/ContractValidityPeriodsPage.tsx b/apps/edr-freight-web/backoffice/src/pages/configuration/ContractValidityPeriodsPage.tsx
new file mode 100644
index 000000000..ee6bb5ebd
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/configuration/ContractValidityPeriodsPage.tsx
@@ -0,0 +1,145 @@
+import { useMemo, useState } from "react";
+import { useQuery } from "@tanstack/react-query";
+import {
+  Badge,
+  Button,
+  Center,
+  Group,
+  Loader,
+  Paper,
+  Stack,
+  Table,
+  Text,
+  Title,
+} from "@mantine/core";
+import { CalendarClock, Pencil } from "lucide-react";
+
+import { PageContainer } from "@/components/page";
+import Breadcrumbs from "@/components/ui/Breadcrumbs";
+import { api } from "@/services/api";
+import ManageDropdownOptionsDialog from "@/pages/dropdown_settings/ManageDropdownOptionsDialog";
+
+const CONTRACT_VALIDITY_PERIODS_CODE = "contract_validity_periods";
+
+/**
+ * Admin UI for contract validity options used when staff accepts a submitted
+ * contract (SUBMITTED → PENDING_APPROVAL). Backed by dropdown_settings.
+ */
+export default function ContractValidityPeriodsPage() {
+  const [editOpen, setEditOpen] = useState(false);
+
+  const { data: setting, isLoading, isError } = useQuery(
+    api.dropdownSettings.getByCode.queryOptions({
+      input: { code: CONTRACT_VALIDITY_PERIODS_CODE },
+    }),
+  );
+
+  const options = useMemo(
+    () =>
+      [...(setting?.children ?? [])].sort(
+        (a, b) => (a.order ?? 0) - (b.order ?? 0),
+      ),
+    [setting],
+  );
+
+  return (
+    <PageContainer>
+      <Breadcrumbs
+        items={[
+          { label: "Configuration", href: "/dashboard/configuration" },
+          { label: "Contract validity periods" },
+        ]}
+      />
+
+      <Stack gap="lg" mt="md">
+        <Group justify="space-between" align="flex-start" wrap="wrap">
+          <Stack gap={4}>
+            <Title order={2}>Contract validity periods</Title>
+            <Text size="sm" c="dimmed" maw={560}>
+              Options shown when line staff accepts a submitted contract. Each
+              value is the number of days the contract stays valid from the
+              accept date.
+            </Text>
+          </Stack>
+          {setting && (
+            <Button
+              leftSection={<Pencil size={16} />}
+              color="edr-green"
+              onClick={() => setEditOpen(true)}
+            >
+              Edit options
+            </Button>
+          )}
+        </Group>
+
+        <Paper withBorder radius="lg" p="lg">
+          {isLoading ? (
+            <Center py="xl">
+              <Loader color="edr-green" />
+            </Center>
+          ) : isError || !setting ? (
+            <Text c="dimmed">
+              Could not load contract validity settings. Ensure{" "}
+              <Text span ff="monospace" size="sm">
+                {CONTRACT_VALIDITY_PERIODS_CODE}
+              </Text>{" "}
+              is seeded in dropdown settings.
+            </Text>
+          ) : options.length === 0 ? (
+            <Stack align="center" gap="md" py="xl">
+              <CalendarClock size={32} color="var(--mantine-color-gray-5)" />
+              <Text c="dimmed">No validity periods configured yet.</Text>
+              <Button
+                variant="light"
+                color="edr-green"
+                onClick={() => setEditOpen(true)}
+              >
+                Add options
+              </Button>
+            </Stack>
+          ) : (
+            <Table striped highlightOnHover>
+              <Table.Thead>
+                <Table.Tr>
+                  <Table.Th>Label</Table.Th>
+                  <Table.Th>Days (value)</Table.Th>
+                  <Table.Th>Order</Table.Th>
+                  <Table.Th>Status</Table.Th>
+                </Table.Tr>
+              </Table.Thead>
+              <Table.Tbody>
+                {options.map((opt) => (
+                  <Table.Tr key={opt.id}>
+                    <Table.Td>{opt.label}</Table.Td>
+                    <Table.Td>
+                      <Text ff="monospace" size="sm">
+                        {opt.value}
+                      </Text>
+                    </Table.Td>
+                    <Table.Td>{opt.order ?? "—"}</Table.Td>
+                    <Table.Td>
+                      <Badge
+                        color={opt.disabled ? "gray" : "edr-green"}
+                        variant="light"
+                      >
+                        {opt.disabled ? "Disabled" : "Active"}
+                      </Badge>
+                    </Table.Td>
+                  </Table.Tr>
+                ))}
+              </Table.Tbody>
+            </Table>
+          )}
+        </Paper>
+      </Stack>
+
+      {setting ? (
+        <ManageDropdownOptionsDialog
+          setting={setting}
+          open={editOpen}
+          onOpenChange={setEditOpen}
+        />
+      ) : null}
+    </PageContainer>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/contracts/ContractClearanceDetailPage.tsx b/apps/edr-freight-web/backoffice/src/pages/contracts/ContractClearanceDetailPage.tsx
index 63f011ea6..66abbdd72 100644
--- a/apps/edr-freight-web/backoffice/src/pages/contracts/ContractClearanceDetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/contracts/ContractClearanceDetailPage.tsx
@@ -23,23 +23,33 @@ import {
   PackageCheck,
   ShieldCheck,
 } from "lucide-react";
+import { Link } from "react-router-dom";
 
+import { ClearanceOpsTabs } from "@/components/contracts/ClearanceOpsTabs";
 import { PageContainer } from "@/components/page/PageContainer";
 import { PageHeader } from "@/components/page/PageHeader";
 import { SectionCard } from "@/components/bookings/detail/SectionCard";
 import { ContractClearanceReviewSection } from "@/components/contracts/ContractClearanceReviewSection";
+import { PhasedClearanceActionPanel } from "@/components/contracts/PhasedClearanceActionPanel";
 import { QUERY_KEYS } from "@/constants/QUERY_KEYS";
+import { useFileViewer } from "@/hooks/useFileViewer";
 import { contractsService } from "@/services/contracts.service";
-import { useContractDetail } from "@/hooks/contracts/useContracts";
+import { downloadBookingFile } from "@/services/files.service";
+import {
+  useBookingMilestones,
+  useContractDetail,
+} from "@/hooks/contracts/useContracts";
 
 export default function ContractClearanceDetailPage() {
   const { id } = useParams<{ id: string }>();
+  const { view, viewer } = useFileViewer();
 
   const { data: contract } = useContractDetail(id);
   const {
     data: clearance,
     isLoading,
     isError,
+    refetch,
   } = useQuery({
     queryKey: QUERY_KEYS.CONTRACTS.clearance(id ?? ""),
     queryFn: () => contractsService.getClearance(id!),
@@ -59,9 +69,40 @@ export default function ContractClearanceDetailPage() {
   }, [clearance]);
 
   const reference = contract?.reference ?? "Clearance";
-  // Customs (Path B) hub. The customer always creates the booking in the portal
-  // after GL finalizes clearance — there is no GL "Create booking" action here.
-  const ready = clearance?.clearanceStatus === "CLEARANCE_READY_FOR_BOOKING";
+  const phasedCustoms =
+    contract?.contractKind === "ONE_TIME" && Boolean(contract.customsClearingEnabled);
+  const docsPhaseComplete =
+    clearance?.milestones?.some(
+      (m) => m.milestoneCode === "DOCUMENTS_APPROVED" && m.status === "COMPLETED",
+    ) ?? false;
+  const ready = clearance?.bookingReady === true;
+  const docReviewLocked = phasedCustoms
+    ? docsPhaseComplete
+    : clearance?.clearanceStatus === "CLEARANCE_READY_FOR_BOOKING";
+  const shipmentLocked = Boolean(
+    contract?.status &&
+      [
+        "ACTIVE_SHIPMENT_IN_PROGRESS",
+        "FULLY_EXECUTED",
+        "CONTRACT_ACTIVE",
+        "CONTRACT_CLOSED",
+        "EXPIRED",
+      ].includes(contract.status),
+  );
+  const linkedBookingId = useMemo(() => {
+    const cycle = contract?.clearanceCycles?.find(
+      (c) => c.cycleNumber === (contract?.clearanceCycleNumber ?? 1),
+    );
+    return cycle?.bookingId ?? undefined;
+  }, [contract]);
+  const bookingAlreadyCreated = Boolean(linkedBookingId) || shipmentLocked;
+  const canCreateBooking = ready && !bookingAlreadyCreated;
+  const reviewReadOnly = shipmentLocked;
+  const queriesLocked = Boolean(clearance?.preClearanceFinalized);
+  const bookingHref = `/dashboard/contracts/${id}/create-booking`;
+
+  const { data: bookingMilestones, refetch: refetchBookingMilestones } =
+    useBookingMilestones(linkedBookingId);
 
   if (isLoading) {
     return (
@@ -95,6 +136,8 @@ export default function ContractClearanceDetailPage() {
     );
   }
 
+  const workflowFiles = clearance.workflowFiles ?? [];
+
   return (
     <PageContainer>
       <Stack gap="lg">
@@ -109,14 +152,23 @@ export default function ContractClearanceDetailPage() {
             { label: reference },
           ]}
           meta={
-            ready ? (
+            bookingAlreadyCreated ? (
+              <Badge
+                variant="light"
+                color="blue"
+                radius="sm"
+                leftSection={<PackageCheck size={13} />}
+              >
+                Booking created
+              </Badge>
+            ) : ready ? (
               <Badge
                 variant="light"
                 color="edr-green"
                 radius="sm"
                 leftSection={<PackageCheck size={13} />}
               >
-                Ready — customer books
+                Ready — create booking
               </Badge>
             ) : clearance.allApproved ? (
               <Badge
@@ -142,75 +194,139 @@ export default function ContractClearanceDetailPage() {
 
         <ClearanceHero contract={contract} stats={stats} />
 
-        {ready ? (
+        {bookingAlreadyCreated ? (
+          <Alert
+            color="blue"
+            radius="md"
+            icon={<PackageCheck size={16} />}
+            title="Shipment booking created"
+          >
+            GL Ethiopia has created the shipment booking for this contract.
+            {linkedBookingId ? (
+              <>
+                {" "}
+                <Text
+                  component={Link}
+                  to={`/dashboard/bookings/${linkedBookingId}/clearance`}
+                  inherit
+                  fw={600}
+                  c="blue.7"
+                >
+                  View booking →
+                </Text>
+              </>
+            ) : null}
+          </Alert>
+        ) : canCreateBooking ? (
           <Alert
             color="edr-green"
             radius="md"
             icon={<PackageCheck size={16} />}
-            title="Clearance finalized"
+            title="Clearance complete"
           >
-            Customs clearance is complete. The customer can now create the
-            shipment booking from the portal — no further action is needed here.
+            Pre-booking clearance is complete. GL Ethiopia can create the shipment booking.
           </Alert>
         ) : null}
 
-        <Grid gap="lg">
-          <Grid.Col span={{ base: 12, lg: 8 }}>
-            <ContractClearanceReviewSection
-              contractId={id!}
-              hideSummary
-              selfClear={false}
-              readOnly={ready}
-            />
-          </Grid.Col>
+        <ClearanceOpsTabs
+          bookingId={linkedBookingId}
+          milestones={bookingMilestones}
+          showOpsTabs={Boolean(linkedBookingId)}
+          showWorkflowFilesTab={phasedCustoms}
+          tradeDirection={contract?.tradeDirection ?? "IMPORT"}
+          workflowFiles={workflowFiles}
+          onViewFile={view}
+          onDownloadFile={(f) => void downloadBookingFile(f.id, f.name)}
+          clearanceTab={
+            <Grid>
+              <Grid.Col span={{ base: 12, lg: 7 }}>
+                <ContractClearanceReviewSection
+                  contractId={id!}
+                  hideSummary
+                  selfClear={false}
+                  readOnly={reviewReadOnly}
+                  approvalsLocked={phasedCustoms && docReviewLocked}
+                  queriesLocked={queriesLocked}
+                  phasedCustoms={phasedCustoms}
+                  onChanged={() => {
+                    void refetch();
+                    void refetchBookingMilestones();
+                  }}
+                />
+              </Grid.Col>
 
-          <Grid.Col span={{ base: 12, lg: 4 }}>
-            <Box style={{ position: "sticky", top: 24 }}>
-              <SectionCard
-                icon={PackageCheck}
-                title="Review progress"
-                accent="edr-green"
-              >
-                <Stack align="center" gap="sm">
-                  <RingProgress
-                    size={140}
-                    thickness={12}
-                    roundCaps
-                    sections={[{ value: stats.pct, color: "edr-green" }]}
-                    label={
-                      <Stack gap={0} align="center">
-                        <Text fw={800} fz={26} lh={1}>
-                          {stats.pct}%
-                        </Text>
-                        <Text size="xs" c="dimmed">
-                          approved
-                        </Text>
-                      </Stack>
-                    }
-                  />
-                  <Group gap="lg" justify="center">
-                    <ProgressStat
-                      color="edr-green"
-                      label="Approved"
-                      value={stats.approved}
+              <Grid.Col span={{ base: 12, lg: 5 }}>
+                <Stack gap="md">
+                  {phasedCustoms ? (
+                    <PhasedClearanceActionPanel
+                      contractId={id!}
+                      bookingId={linkedBookingId}
+                      bookingMilestones={bookingMilestones ?? []}
+                      clearance={clearance}
+                      tradeDirection={contract?.tradeDirection ?? "IMPORT"}
+                      workflowFiles={workflowFiles}
+                      roleMode="ET"
+                      onChanged={() => {
+                        void refetch();
+                        void refetchBookingMilestones();
+                      }}
+                      onViewFile={view}
+                      onDownloadFile={(f) => void downloadBookingFile(f.id, f.name)}
+                      bookingCreateHref={canCreateBooking ? bookingHref : undefined}
+                      bookingCreated={bookingAlreadyCreated}
                     />
-                    <ProgressStat
-                      color="red"
-                      label="Queried"
-                      value={stats.queried}
-                    />
-                    <ProgressStat
-                      color="gray"
-                      label="Pending"
-                      value={stats.pending}
-                    />
-                  </Group>
+                  ) : (
+                    <Box style={{ position: "sticky", top: 24 }}>
+                      <SectionCard
+                        icon={PackageCheck}
+                        title="Review progress"
+                        accent="edr-green"
+                      >
+                        <Stack align="center" gap="sm">
+                          <RingProgress
+                            size={140}
+                            thickness={12}
+                            roundCaps
+                            sections={[{ value: stats.pct, color: "edr-green" }]}
+                            label={
+                              <Stack gap={0} align="center">
+                                <Text fw={800} fz={26} lh={1}>
+                                  {stats.pct}%
+                                </Text>
+                                <Text size="xs" c="dimmed">
+                                  approved
+                                </Text>
+                              </Stack>
+                            }
+                          />
+                          <Group gap="lg" justify="center">
+                            <ProgressStat
+                              color="edr-green"
+                              label="Approved"
+                              value={stats.approved}
+                            />
+                            <ProgressStat
+                              color="red"
+                              label="Queried"
+                              value={stats.queried}
+                            />
+                            <ProgressStat
+                              color="gray"
+                              label="Pending"
+                              value={stats.pending}
+                            />
+                          </Group>
+                        </Stack>
+                      </SectionCard>
+                    </Box>
+                  )}
                 </Stack>
-              </SectionCard>
-            </Box>
-          </Grid.Col>
-        </Grid>
+              </Grid.Col>
+            </Grid>
+          }
+        />
       </Stack>
+      {viewer}
     </PageContainer>
   );
 }
diff --git a/apps/edr-freight-web/backoffice/src/pages/contracts/ContractClearanceListPage.tsx b/apps/edr-freight-web/backoffice/src/pages/contracts/ContractClearanceListPage.tsx
index 68f04d5bb..034958303 100644
--- a/apps/edr-freight-web/backoffice/src/pages/contracts/ContractClearanceListPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/contracts/ContractClearanceListPage.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useMemo, useState } from "react";
+import { useCallback, useMemo, useState, type ReactNode } from "react";
 import { useNavigate } from "react-router-dom";
 import {
   ActionIcon,
@@ -18,6 +18,7 @@ import {
   ArrowRight,
   ChevronRight,
   FileText,
+  Flag,
   Inbox,
   LayoutGrid,
   PackageCheck,
@@ -43,9 +44,15 @@ import { PageContainer } from "@/components/page/PageContainer";
 import { PageHeader } from "@/components/page/PageHeader";
 import { KpiStrip } from "@/components/page/KpiStrip";
 import { bookingTable } from "@/components/bookings/booking-ui.styles";
-import { useContractClearanceQueue } from "@/hooks/contracts/useContracts";
+import { useAuth } from "@/auth/useAuth";
+import {
+  useContractClearanceQueue,
+  useEtClearanceQueue,
+} from "@/hooks/contracts/useContracts";
+import { FREIGHT_PERMS, hasPermission } from "@/lib/permissions";
 
 type ViewMode = "table" | "cards";
+type QueueTab = "all" | "et";
 
 interface ClearanceRow {
   id: string;
@@ -59,8 +66,10 @@ interface ClearanceRow {
   serviceTypeName: string;
   customs: boolean;
   status: string;
-  /** true once GL has finalized clearance — customer now books in the portal. */
+  /** true once GL has finalized clearance — customer may book in the portal. */
   ready: boolean;
+  /** true once GL Ethiopia created the shipment booking. */
+  bookingCreated: boolean;
 }
 
 function yardLabel(
@@ -93,6 +102,7 @@ function toClearanceRow(contract: Freight.IContract): ClearanceRow {
       contract.serviceType?.includesCustoms ?? contract.customsClearingEnabled,
     status: contract.status,
     ready: contract.status === "CLEARANCE_READY_FOR_BOOKING",
+    bookingCreated: contract.status === "ACTIVE_SHIPMENT_IN_PROGRESS",
   };
 }
 
@@ -134,6 +144,21 @@ function DirectionIcon({ direction }: { direction: string }) {
 }
 
 function StatusBadge({ row }: { row: ClearanceRow }) {
+  if (row.bookingCreated) {
+    return (
+      <Tooltip label="GL Ethiopia created the shipment booking" withArrow>
+        <Badge
+          size="sm"
+          variant="light"
+          color="blue"
+          radius="sm"
+          leftSection={<PackagePlus size={12} />}
+        >
+          Booking created
+        </Badge>
+      </Tooltip>
+    );
+  }
   if (row.ready) {
     return (
       <Tooltip
@@ -160,19 +185,61 @@ function StatusBadge({ row }: { row: ClearanceRow }) {
 }
 
 /**
- * Document Clearance hub. Lists every customs (Path B) contract that still needs
- * customs clearance — awaiting documents, under GL review, or finalized and
- * waiting for the customer to create the booking in the portal. A single list,
- * no queue/history/direction tabs.
+ * Document Clearance hub. Lists every customs (Path B) contract in phased clearance,
+ * including after booking is created — stays visible for reference and follow-up.
  */
 export default function ContractClearanceListPage() {
   const navigate = useNavigate();
+  const { user } = useAuth();
+  const canReview = hasPermission(user, FREIGHT_PERMS.contracts.clearanceReview);
+  const canEt = hasPermission(user, FREIGHT_PERMS.contracts.clearanceEtActions);
+
+  const defaultQueue: QueueTab = canReview ? "all" : "et";
+  const [queueTab, setQueueTab] = useState<QueueTab>(defaultQueue);
   const [query, setQuery] = useState("");
   const [view, setView] = useState<ViewMode>("table");
   const { pagination, setPagination } = usePagination({ pageSize: 10 });
 
-  const { data, isLoading, isError, isFetching, refetch } =
-    useContractClearanceQueue(true);
+  const { data: allData, isLoading: allLoading, isError: allError, isFetching: allFetching, refetch: refetchAll } =
+    useContractClearanceQueue(queueTab === "all");
+  const { data: etData, isLoading: etLoading, isError: etError, isFetching: etFetching, refetch: refetchEt } =
+    useEtClearanceQueue(queueTab === "et");
+
+  const data = queueTab === "et" ? etData : allData;
+  const isLoading = queueTab === "et" ? etLoading : allLoading;
+  const isError = queueTab === "et" ? etError : allError;
+  const isFetching = queueTab === "et" ? etFetching : allFetching;
+  const refetch = () => {
+    if (queueTab === "et") void refetchEt();
+    else void refetchAll();
+  };
+
+  const queueTabOptions = useMemo(() => {
+    const opts: { value: QueueTab; label: ReactNode }[] = [];
+    if (canReview) {
+      opts.push({
+        value: "all",
+        label: (
+          <Group gap={6} wrap="nowrap">
+            <ShieldCheck size={15} />
+            <Box visibleFrom="sm">All</Box>
+          </Group>
+        ),
+      });
+    }
+    if (canEt) {
+      opts.push({
+        value: "et",
+        label: (
+          <Group gap={6} wrap="nowrap">
+            <Flag size={15} />
+            <Box visibleFrom="sm">ET queue</Box>
+          </Group>
+        ),
+      });
+    }
+    return opts;
+  }, [canReview, canEt]);
 
   const allRows = useMemo(
     () => (data?.items ?? []).map(toClearanceRow),
@@ -183,7 +250,8 @@ export default function ContractClearanceListPage() {
     () => ({
       all: allRows.length,
       ready: allRows.filter((r) => r.ready).length,
-      review: allRows.filter((r) => !r.ready).length,
+      booked: allRows.filter((r) => r.bookingCreated).length,
+      review: allRows.filter((r) => !r.ready && !r.bookingCreated).length,
     }),
     [allRows],
   );
@@ -329,7 +397,7 @@ export default function ContractClearanceListPage() {
       <Stack gap="lg">
         <PageHeader
           title="Document Clearance"
-          subtitle="Review pre-booking customs documents on contracts and finalize clearance. Once finalized, the customer creates the shipment booking in the portal."
+          subtitle="All customs contracts in phased clearance — stays visible after booking is created."
           meta={
             <Badge
               variant="light"
@@ -337,7 +405,7 @@ export default function ContractClearanceListPage() {
               radius="sm"
               leftSection={<ShieldCheck size={13} />}
             >
-              {counts.all} need clearance
+              {counts.all} in clearance
             </Badge>
           }
           action={
@@ -358,7 +426,7 @@ export default function ContractClearanceListPage() {
           loading={isLoading}
           items={[
             {
-              label: "Need clearance",
+              label: "In clearance",
               value: counts.all,
               icon: Inbox,
               color: "edr-green",
@@ -370,8 +438,8 @@ export default function ContractClearanceListPage() {
               color: "yellow",
             },
             {
-              label: "Ready — customer books",
-              value: counts.ready,
+              label: "Ready / booked",
+              value: counts.ready + counts.booked,
               icon: PackageCheck,
               color: "edr-green",
             },
@@ -380,6 +448,20 @@ export default function ContractClearanceListPage() {
 
         <Card p={0} withBorder shadow="sm" radius="lg">
           <Stack gap={0}>
+            {queueTabOptions.length > 1 ? (
+              <Box px="md" pt="md">
+                <SegmentedControl
+                  size="sm"
+                  radius="md"
+                  value={queueTab}
+                  onChange={(v) => {
+                    setQueueTab(v as QueueTab);
+                    setPagination({ pageIndex: 0, pageSize: pagination.pageSize });
+                  }}
+                  data={queueTabOptions}
+                />
+              </Box>
+            ) : null}
             <Box px="md" pt="md" pb="sm">
               <Group justify="space-between" gap="md" wrap="wrap">
                 <TextInput
diff --git a/apps/edr-freight-web/backoffice/src/pages/contracts/ContractRequestDetailPage.tsx b/apps/edr-freight-web/backoffice/src/pages/contracts/ContractRequestDetailPage.tsx
index f00a3b7c6..8502a996c 100644
--- a/apps/edr-freight-web/backoffice/src/pages/contracts/ContractRequestDetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/contracts/ContractRequestDetailPage.tsx
@@ -1,4 +1,5 @@
 import { useNavigate, useParams, useSearchParams } from "react-router-dom";
+import { useQuery } from "@tanstack/react-query";
 import {
   ArrowLeft,
   ArrowRight,
@@ -6,14 +7,19 @@ import {
   Building2,
   Calendar,
   CalendarClock,
+  Download,
+  FileSignature,
   FileText,
+  Files,
   Flame,
+  LayoutGrid,
   Package,
   Receipt,
   RefreshCw,
   Route as RouteIcon,
   ShieldCheck,
   Snowflake,
+  Users,
 } from "lucide-react";
 import {
   Badge,
@@ -31,6 +37,8 @@ import {
   Title,
 } from "@mantine/core";
 
+import toast from "react-hot-toast";
+
 import "@/components/overview/overview.css";
 import { PageContainer } from "@/components/page";
 import Breadcrumbs from "@/components/ui/Breadcrumbs";
@@ -41,11 +49,22 @@ import { ContractWorkflowStepper } from "@/components/contracts/ContractWorkflow
 import { ContractActionsToolbar } from "@/components/contracts/ContractActionsToolbar";
 import { ContractApprovalStepsCard } from "@/components/contracts/ContractApprovalStepsCard";
 import { ContractClearanceReviewSection } from "@/components/contracts/ContractClearanceReviewSection";
+import { ClearanceWorkflowFilesPanel } from "@/components/contracts/ClearanceWorkflowFilesPanel";
+import {
+  ContractCustomerCard,
+  ContractDocumentsCard,
+} from "@/components/contracts/detail/ContractDetailTabCards";
 import { getContractStatusMeta } from "@/features/contracts/contract-status.config";
+import { useFileViewer } from "@/hooks/useFileViewer";
 import {
   useContractDetail,
   useContractMutations,
 } from "@/hooks/contracts/useContracts";
+import { contractsService } from "@/services/contracts.service";
+import { QUERY_KEYS } from "@/constants/QUERY_KEYS";
+import { fileViewUrl } from "@/constants/apiConfig";
+import { downloadBookingFile } from "@/services/files.service";
+import type { Freight } from "@edr/types";
 
 // Clearance phase — staff can still ACT (approve / query / finalize).
 const CLEARANCE_ACTIVE_STATUSES = [
@@ -94,7 +113,8 @@ export default function ContractRequestDetailPage() {
   } = useContractDetail(id);
   const mutations = useContractMutations(id ?? "");
   const [searchParams, setSearchParams] = useSearchParams();
-  const activeTab = searchParams.get("tab") === "clearance" ? "clearance" : "details";
+  const { view, viewer } = useFileViewer();
+  const requestedTab = searchParams.get("tab");
   const setTab = (tab: string) =>
     setSearchParams(
       (prev) => {
@@ -106,6 +126,48 @@ export default function ContractRequestDetailPage() {
       { replace: true },
     );
 
+  const handleViewFile = (file: NonNullable<Freight.IContract["files"]>[number]) =>
+    view({
+      name: file.name,
+      url: file.signedUrl ?? file.url,
+      mimeType: file.mimeType,
+    });
+
+  const handleDownloadFile = async (
+    file: NonNullable<Freight.IContract["files"]>[number],
+  ) => {
+    try {
+      await downloadBookingFile(file.id, file.name);
+    } catch {
+      toast.error("Could not download file.");
+    }
+  };
+
+  const showClearanceTabQuery = Boolean(
+    contract && CLEARANCE_REVIEW_STATUSES.includes(contract.status),
+  );
+  const { data: clearanceView } = useQuery({
+    queryKey: QUERY_KEYS.CONTRACTS.clearance(id ?? ""),
+    queryFn: () => contractsService.getClearance(id!),
+    enabled: Boolean(id) && showClearanceTabQuery,
+  });
+
+  const downloadContractPdf = async () => {
+    if (!contract?.id) return;
+    try {
+      const blob = await contractsService.downloadContractDocument(contract.id);
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      const contractPdf = contract.files?.find((f) => f.code === "contract");
+      a.download = contractPdf?.name ?? `contract-${contract.reference}.pdf`;
+      a.click();
+      URL.revokeObjectURL(url);
+    } catch {
+      toast.error("Could not download contract PDF.");
+    }
+  };
+
   if (isLoading) {
     return (
       <PageContainer>
@@ -172,13 +234,36 @@ export default function ContractRequestDetailPage() {
     contract.status === "APPROVED_PENDING_SIGNATURE";
 
   const showClearanceTab = CLEARANCE_REVIEW_STATUSES.includes(contract.status);
+  const phasedCustoms =
+    contract.contractKind === "ONE_TIME" && Boolean(contract.customsClearingEnabled);
+  const docsPhaseComplete =
+    clearanceView?.milestones?.some(
+      (m) => m.milestoneCode === "DOCUMENTS_APPROVED" && m.status === "COMPLETED",
+    ) ?? false;
+  const clearanceApprovalsLocked = phasedCustoms && docsPhaseComplete;
   // Once clearance is finalized the tab is informational only — no approve/query.
   const clearanceReadOnly = CLEARANCE_DONE_STATUSES.includes(contract.status);
   // Path A (no customs) → Operations reviews; Path B (customs) → GL reviews.
   const selfClear = !contract.customsClearingEnabled;
-  // If the tab param points at clearance but the contract isn't in a clearance
-  // phase, fall back to details so we never show an empty tab.
-  const currentTab = activeTab === "clearance" && showClearanceTab ? "clearance" : "details";
+  const files = contract.files ?? [];
+  const contractPdf = files.find((f) => f.code === "contract");
+  const hasContractDocument = Boolean(
+    contractPdf || contract.contractGeneratedAt,
+  );
+  const canViewSign =
+    (contract.status === "CONTRACT_READY" ||
+      contract.status === "SIGNED_CUSTOMER") &&
+    Boolean(contract.contractGeneratedAt);
+  // Resolve the active tab from the URL, falling back to details when the
+  // requested tab isn't available for this contract (e.g. clearance pre-phase).
+  const currentTab =
+    requestedTab === "documents"
+      ? "documents"
+      : requestedTab === "customer"
+        ? "customer"
+        : requestedTab === "clearance" && showClearanceTab
+          ? "clearance"
+          : "details";
 
   const customerLabel = contract.isGovernment
     ? (contract.governmentInstitution ?? "Government")
@@ -254,6 +339,48 @@ export default function ContractRequestDetailPage() {
                   />
                 ) : null}
               </Group>
+              {hasContractDocument && (
+                <Group gap="sm" mt="sm">
+                  {canViewSign && (
+                    <Button
+                      color="edr-green"
+                      size="compact-sm"
+                      radius="lg"
+                      leftSection={<FileSignature size={15} />}
+                      onClick={() =>
+                        navigate(`/dashboard/contract-requests/${contract.id}/view`)
+                      }
+                    >
+                      View &amp; sign contract
+                    </Button>
+                  )}
+                  {contractPdf && (
+                    <Button
+                      variant="default"
+                      size="compact-sm"
+                      radius="lg"
+                      leftSection={<FileText size={15} />}
+                      onClick={() =>
+                        handleViewFile({
+                          ...contractPdf,
+                          url: fileViewUrl(contractPdf.id),
+                        })
+                      }
+                    >
+                      View contract
+                    </Button>
+                  )}
+                  <Button
+                    variant="default"
+                    size="compact-sm"
+                    radius="lg"
+                    leftSection={<Download size={15} />}
+                    onClick={() => void downloadContractPdf()}
+                  >
+                    Download PDF
+                  </Button>
+                </Group>
+              )}
             </Stack>
           </Stack>
         </Paper>
@@ -264,38 +391,83 @@ export default function ContractRequestDetailPage() {
           description={statusMeta.description}
         />
 
-        {showClearanceTab && (
-          <Tabs
-            value={currentTab}
-            onChange={(v) => setTab(v ?? "details")}
-            variant="pills"
-            color="edr-green"
-            classNames={{ list: "ov-tablist", tab: "ov-tab" }}
-          >
-            <Tabs.List>
-              <Tabs.Tab value="details" leftSection={<FileText size={16} />}>
-                Details
-              </Tabs.Tab>
+        <Tabs
+          value={currentTab}
+          onChange={(v) => setTab(v ?? "details")}
+          variant="pills"
+          color="edr-green"
+          classNames={{ list: "ov-tablist", tab: "ov-tab" }}
+        >
+          <Tabs.List>
+            <Tabs.Tab value="details" leftSection={<LayoutGrid size={16} />}>
+              Details
+            </Tabs.Tab>
+            <Tabs.Tab
+              value="documents"
+              leftSection={<Files size={16} />}
+              rightSection={
+                files.length > 0 ? (
+                  <Badge size="xs" variant="light" color="gray" radius="sm">
+                    {files.length}
+                  </Badge>
+                ) : null
+              }
+            >
+              Documents
+            </Tabs.Tab>
+            <Tabs.Tab value="customer" leftSection={<Users size={16} />}>
+              Customer
+            </Tabs.Tab>
+            {showClearanceTab && (
               <Tabs.Tab
                 value="clearance"
                 leftSection={<ShieldCheck size={16} />}
               >
                 Clearance Review
               </Tabs.Tab>
-            </Tabs.List>
-          </Tabs>
-        )}
+            )}
+          </Tabs.List>
+        </Tabs>
 
         <Grid gap="lg">
           {/* LEFT — primary content */}
           <Grid.Col span={{ base: 12, lg: 8 }}>
             {currentTab === "clearance" ? (
-              <ContractClearanceReviewSection
-                contractId={id!}
-                selfClear={selfClear}
-                readOnly={clearanceReadOnly}
-                onChanged={() => refetch()}
-              />
+              <Stack gap="lg">
+                <ContractClearanceReviewSection
+                  contractId={id!}
+                  selfClear={selfClear}
+                  readOnly={clearanceReadOnly}
+                  phasedCustoms={phasedCustoms}
+                  approvalsLocked={clearanceApprovalsLocked}
+                  onChanged={() => refetch()}
+                />
+                {(clearanceView?.workflowFiles?.length ?? 0) > 0 ? (
+                  <ClearanceWorkflowFilesPanel
+                    files={clearanceView!.workflowFiles!}
+                    onView={view}
+                    onDownload={(f) => void handleDownloadFile({ id: f.id, name: f.name } as never)}
+                  />
+                ) : null}
+              </Stack>
+            ) : currentTab === "documents" ? (
+              <Stack gap="lg">
+                <ContractDocumentsCard
+                  files={files}
+                  onView={handleViewFile}
+                  onDownload={handleDownloadFile}
+                />
+                {(clearanceView?.workflowFiles?.length ?? 0) > 0 ? (
+                  <ClearanceWorkflowFilesPanel
+                    files={clearanceView!.workflowFiles!}
+                    title="Customs workflow documents"
+                    onView={view}
+                    onDownload={(f) => void handleDownloadFile({ id: f.id, name: f.name } as never)}
+                  />
+                ) : null}
+              </Stack>
+            ) : currentTab === "customer" ? (
+              <ContractCustomerCard contract={contract} />
             ) : (
             <Stack gap="lg">
               <SectionCard icon={RouteIcon} title="Routes">
@@ -453,6 +625,8 @@ export default function ContractRequestDetailPage() {
           </Grid.Col>
         </Grid>
       </Stack>
+
+      {viewer}
     </PageContainer>
   );
 }
diff --git a/apps/edr-freight-web/backoffice/src/pages/contracts/ContractViewPage.tsx b/apps/edr-freight-web/backoffice/src/pages/contracts/ContractViewPage.tsx
index ecb8f1c62..7e8f06e0b 100644
--- a/apps/edr-freight-web/backoffice/src/pages/contracts/ContractViewPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/contracts/ContractViewPage.tsx
@@ -1,4 +1,4 @@
-import { useRef, useState } from "react";
+import { useCallback, useRef, useState } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import {
@@ -13,18 +13,17 @@ import {
   Text,
   TextInput,
 } from "@mantine/core";
-import { ArrowLeft, FileSignature, Printer } from "lucide-react";
+import { ArrowLeft, Download, FileSignature, Printer } from "lucide-react";
 import toast from "react-hot-toast";
 
+import { ContractSignSuccessModal } from "@/components/contracts/ContractSignSuccessModal";
 import { ContractSignaturePad } from "@/components/bookings/ContractSignaturePad";
 import { contractsService } from "@/services/contracts.service";
 import { QUERY_KEYS } from "@/constants/QUERY_KEYS";
 
 /**
  * Staff contract preview + sign. Staff must open and read the generated
- * contract here before signing — there is no sign action on the detail page or
- * the list table. Signing as STAFF is only possible once the contract has been
- * generated and is in CONTRACT_READY / SIGNED_CUSTOMER.
+ * contract here before signing.
  */
 export default function ContractViewPage() {
   const { id } = useParams<{ id: string }>();
@@ -33,9 +32,9 @@ export default function ContractViewPage() {
   const iframeRef = useRef<HTMLIFrameElement>(null);
 
   const [signOpen, setSignOpen] = useState(false);
+  const [successOpen, setSuccessOpen] = useState(false);
   const [signerName, setSignerName] = useState("");
   const [signatureData, setSignatureData] = useState<string | null>(null);
-  // Offer the staff member's saved signature first; they can draw a fresh one.
   const [drawNew, setDrawNew] = useState(false);
 
   const { data, isLoading, isError, refetch } = useQuery({
@@ -58,8 +57,8 @@ export default function ContractViewPage() {
         consentText: "I confirm this contract on behalf of EDR.",
       }),
     onSuccess: () => {
-      toast.success("Contract signed");
       setSignOpen(false);
+      setSuccessOpen(true);
       void refetch();
       void qc.invalidateQueries({ queryKey: QUERY_KEYS.CONTRACTS.byId(id!) });
       void qc.invalidateQueries({ queryKey: QUERY_KEYS.CONTRACTS.ROOT });
@@ -69,6 +68,21 @@ export default function ContractViewPage() {
 
   const handlePrint = () => iframeRef.current?.contentWindow?.print();
 
+  const downloadPdf = useCallback(async () => {
+    if (!id) return;
+    try {
+      const blob = await contractsService.downloadContractDocument(id);
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = `contract-${data?.reference ?? id}.pdf`;
+      a.click();
+      URL.revokeObjectURL(url);
+    } catch {
+      toast.error("Could not download contract PDF.");
+    }
+  }, [id, data?.reference]);
+
   const openSign = () => {
     setSignerName(data?.savedSignature?.signerDisplayName ?? "");
     setSignatureData(null);
@@ -124,6 +138,13 @@ export default function ContractViewPage() {
             >
               Print
             </Button>
+            <Button
+              variant="default"
+              leftSection={<Download size={16} />}
+              onClick={() => void downloadPdf()}
+            >
+              Download PDF
+            </Button>
             {data.canSignStaff && (
               <Button
                 color="edr-green"
@@ -217,6 +238,16 @@ export default function ContractViewPage() {
           </Group>
         </Stack>
       </Modal>
+
+      <ContractSignSuccessModal
+        opened={successOpen}
+        reference={data.reference}
+        message="The contract has been counter-signed. The customer will be notified of the next steps."
+        onClose={() => {
+          setSuccessOpen(false);
+          navigate(`/dashboard/contract-requests/${data.contractId}`);
+        }}
+      />
     </Box>
   );
 }
diff --git a/apps/edr-freight-web/backoffice/src/pages/contracts/GlClearanceDetailPage.tsx b/apps/edr-freight-web/backoffice/src/pages/contracts/GlClearanceDetailPage.tsx
new file mode 100644
index 000000000..ecf95fe89
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/contracts/GlClearanceDetailPage.tsx
@@ -0,0 +1,262 @@
+import { useState } from "react";
+import { useQuery } from "@tanstack/react-query";
+import { useParams } from "react-router-dom";
+import {
+  Alert,
+  Badge,
+  Box,
+  Button,
+  Grid,
+  Group,
+  Loader,
+  Stack,
+  Tabs,
+  Text,
+  ThemeIcon,
+} from "@mantine/core";
+import { AlertCircle, ClipboardList, FileText, Upload } from "lucide-react";
+import type { Freight } from "@edr/types";
+
+import { PageContainer } from "@/components/page/PageContainer";
+import { PageHeader } from "@/components/page/PageHeader";
+import { ClearanceReviewSection } from "@/components/bookings/detail/ClearanceReviewSection";
+import { ContractClearanceReviewSection } from "@/components/contracts/ContractClearanceReviewSection";
+import { ClearanceWorkflowFilesPanel } from "@/components/contracts/ClearanceWorkflowFilesPanel";
+import {
+  GlClearanceUploadModal,
+  type GlClearanceUploadKind,
+} from "@/components/contracts/GlClearanceUploadModal";
+import { PhasedClearanceActionPanel } from "@/components/contracts/PhasedClearanceActionPanel";
+import { findWorkflowFile } from "@/components/contracts/PhasedUploadedFileRow";
+import { useFileViewer } from "@/hooks/useFileViewer";
+import { contractsService } from "@/services/contracts.service";
+import { bookingsService } from "@/services/bookings.service";
+import { downloadBookingFile } from "@/services/files.service";
+
+type GlClearanceDetail =
+  | {
+      kind: "contract";
+      reference: string;
+      tradeDirection: string;
+      clearance: Freight.ContractClearanceView;
+    }
+  | {
+      kind: "booking";
+      reference: string;
+      tradeDirection: string;
+      clearance: Freight.ClearanceView;
+    };
+
+async function loadGlClearanceDetail(id: string): Promise<GlClearanceDetail> {
+  try {
+    const [clearance, contract] = await Promise.all([
+      contractsService.getClearance(id),
+      contractsService.getById(id),
+    ]);
+    return {
+      kind: "contract",
+      reference: contract.reference,
+      tradeDirection: contract.tradeDirection,
+      clearance,
+    };
+  } catch {
+    const [clearance, booking] = await Promise.all([
+      bookingsService.getClearance(id),
+      bookingsService.getById(id),
+    ]);
+    return {
+      kind: "booking",
+      reference: booking.reference,
+      tradeDirection: booking.tradeDirection,
+      clearance,
+    };
+  }
+}
+
+/** Djibouti GL clearance detail — RO/DO upload and read-only upstream context. */
+export default function GlClearanceDetailPage() {
+  const { id } = useParams<{ id: string }>();
+  const { view, viewer } = useFileViewer();
+  const [uploadKind, setUploadKind] = useState<GlClearanceUploadKind | null>(null);
+
+  const { data, isLoading, isError, refetch } = useQuery({
+    queryKey: ["gl-clearance-detail", id],
+    queryFn: () => loadGlClearanceDetail(id!),
+    enabled: Boolean(id),
+  });
+
+  if (isLoading) {
+    return (
+      <PageContainer>
+        <Stack align="center" py={80}>
+          <Loader color="edr-green" />
+          <Text c="dimmed">Loading clearance…</Text>
+        </Stack>
+      </PageContainer>
+    );
+  }
+
+  if (isError || !data) {
+    return (
+      <PageContainer>
+        <Alert color="red" icon={<AlertCircle size={16} />}>
+          Could not load clearance for this item.
+        </Alert>
+      </PageContainer>
+    );
+  }
+
+  const backTo = "/dashboard/gl-djibouti/clearance";
+  const workflowFiles = data.clearance.workflowFiles ?? [];
+  const workflowFileCount = workflowFiles.filter((f) => f.file).length;
+  const isImport = data.tradeDirection === "IMPORT";
+  const hasDo = Boolean(findWorkflowFile(workflowFiles, "delivery_order"));
+  const hasRo = Boolean(findWorkflowFile(workflowFiles, "release_order"));
+  const canUploadDo = isImport && Boolean(data.clearance.preClearanceFinalized || hasDo);
+  const vesselDepartureDate =
+    "vesselDepartureDate" in data.clearance
+      ? (data.clearance.vesselDepartureDate ?? null)
+      : null;
+
+  return (
+    <PageContainer>
+      <Stack gap="lg">
+        <PageHeader
+          title={data.reference}
+          backTo={backTo}
+          breadcrumbs={[
+            { label: "GL Djibouti Clearance", href: backTo },
+            { label: data.reference },
+          ]}
+          meta={
+            <Badge variant="light" color={isImport ? "edr-green" : "gray"} radius="sm">
+              {data.tradeDirection}
+            </Badge>
+          }
+          action={
+            <Group gap="sm">
+              {isImport ? (
+                <Button
+                  color="edr-green"
+                  leftSection={<Upload size={16} />}
+                  disabled={!canUploadDo}
+                  onClick={() => setUploadKind("do")}
+                >
+                  {hasDo ? "Replace DO" : "Upload DO"}
+                </Button>
+              ) : (
+                <Button
+                  color="edr-green"
+                  leftSection={<Upload size={16} />}
+                  onClick={() => setUploadKind("ro")}
+                >
+                  {hasRo ? "Replace RO" : "Upload RO"}
+                </Button>
+              )}
+            </Group>
+          }
+        />
+
+        <Tabs defaultValue="workflow" keepMounted={false}>
+          <Tabs.List mb="md">
+            <Tabs.Tab value="workflow" leftSection={<ClipboardList size={14} />}>
+              Clearance workflow
+            </Tabs.Tab>
+            <Tabs.Tab
+              value="documents"
+              leftSection={<FileText size={14} />}
+              rightSection={
+                workflowFileCount > 0 ? (
+                  <Badge size="xs" variant="light" color="edr-green" circle>
+                    {workflowFileCount}
+                  </Badge>
+                ) : undefined
+              }
+            >
+              Customs documents (all steps)
+            </Tabs.Tab>
+          </Tabs.List>
+
+          <Tabs.Panel value="workflow">
+            <Grid gutter="lg">
+              <Grid.Col span={{ base: 12, lg: 7 }}>
+                {data.kind === "booking" ? (
+                  <ClearanceReviewSection bookingId={id!} hideSummary readOnly />
+                ) : (
+                  <ContractClearanceReviewSection
+                    contractId={id!}
+                    hideSummary
+                    selfClear={false}
+                    readOnly
+                    phasedCustoms
+                  />
+                )}
+              </Grid.Col>
+
+              <Grid.Col span={{ base: 12, lg: 5 }}>
+                <PhasedClearanceActionPanel
+                  contractId={data.kind === "contract" ? id : undefined}
+                  bookingId={data.kind === "booking" ? id : undefined}
+                  clearance={data.clearance}
+                  tradeDirection={data.tradeDirection}
+                  workflowFiles={workflowFiles}
+                  roleMode="DJ"
+                  useUploadModals
+                  onUploadDoRequest={() => setUploadKind("do")}
+                  onUploadRoRequest={() => setUploadKind("ro")}
+                  onChanged={() => void refetch()}
+                  onViewFile={view}
+                  onDownloadFile={(f) => void downloadBookingFile(f.id, f.name)}
+                />
+              </Grid.Col>
+            </Grid>
+          </Tabs.Panel>
+
+          <Tabs.Panel value="documents">
+            {workflowFiles.length > 0 ? (
+              <ClearanceWorkflowFilesPanel
+                files={workflowFiles}
+                title="Customs documents (all steps)"
+                onView={view}
+                onDownload={(f) => void downloadBookingFile(f.id, f.name)}
+              />
+            ) : (
+              <Box
+                py={48}
+                style={{
+                  borderRadius: 12,
+                  border: "1px dashed var(--mantine-color-gray-4)",
+                  background: "var(--mantine-color-gray-0)",
+                  textAlign: "center",
+                }}
+              >
+                <Stack gap={8} align="center">
+                  <ThemeIcon variant="light" color="gray" radius="xl" size={48}>
+                    <FileText size={22} />
+                  </ThemeIcon>
+                  <Text size="sm" c="dimmed" maw={360}>
+                    No customs workflow documents uploaded yet. Files from Ethiopia-side
+                    clearance and your DO/RO uploads will appear here.
+                  </Text>
+                </Stack>
+              </Box>
+            )}
+          </Tabs.Panel>
+        </Tabs>
+      </Stack>
+
+      <GlClearanceUploadModal
+        opened={uploadKind != null}
+        kind={uploadKind}
+        onClose={() => setUploadKind(null)}
+        entityId={id!}
+        isBooking={data.kind === "booking"}
+        workflowFiles={workflowFiles}
+        vesselDepartureDate={vesselDepartureDate}
+        onSuccess={() => void refetch()}
+        onPreview={view}
+      />
+      {viewer}
+    </PageContainer>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/contracts/GlDjiboutiClearanceListPage.tsx b/apps/edr-freight-web/backoffice/src/pages/contracts/GlDjiboutiClearanceListPage.tsx
new file mode 100644
index 000000000..9d2c6cba1
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/contracts/GlDjiboutiClearanceListPage.tsx
@@ -0,0 +1,123 @@
+import { useNavigate } from "react-router-dom";
+import { Badge, Card, Group, Loader, Stack, Tabs, Text } from "@mantine/core";
+import { ChevronRight, Container, Ship } from "lucide-react";
+
+import { PageContainer } from "@/components/page/PageContainer";
+import { PageHeader } from "@/components/page/PageHeader";
+import { useDjClearanceQueue } from "@/hooks/contracts/useContracts";
+import { useBookingDjClearanceQueue } from "@/hooks/bookings/useBookings";
+
+export default function GlDjiboutiClearanceListPage() {
+  const navigate = useNavigate();
+  const { data: contractQueue, isLoading: contractsLoading } = useDjClearanceQueue();
+  const { data: bookingQueue, isLoading: bookingsLoading } = useBookingDjClearanceQueue();
+
+  const contractItems = contractQueue?.items ?? [];
+  const bookingItems = bookingQueue ?? [];
+
+  return (
+    <PageContainer>
+      <PageHeader
+        title="GL Djibouti — Clearance"
+        subtitle="All customs contracts and bookings handed off to Djibouti GL — stays visible after DO/RO upload and booking creation."
+      />
+      <Tabs defaultValue="contracts" keepMounted={false}>
+        <Tabs.List mb="md">
+          <Tabs.Tab value="contracts">Contracts ({contractItems.length})</Tabs.Tab>
+          <Tabs.Tab value="bookings">Bookings ({bookingItems.length})</Tabs.Tab>
+        </Tabs.List>
+
+        <Tabs.Panel value="contracts">
+          {contractsLoading ? (
+            <Group justify="center" py={60}>
+              <Loader color="edr-green" />
+            </Group>
+          ) : (
+            <Stack gap="sm">
+              {contractItems.length === 0 ? (
+                <Text c="dimmed" ta="center" py="xl">
+                  No Djibouti customs contracts yet. Items appear here once Ethiopia-side
+                  pre-clearance is finalized.
+                </Text>
+              ) : (
+                contractItems.map((c) => (
+                  <Card
+                    key={c.id}
+                    withBorder
+                    radius="md"
+                    padding="md"
+                    style={{ cursor: "pointer" }}
+                    onClick={() => navigate(`/dashboard/gl-djibouti/clearance/${c.id}`)}
+                  >
+                    <Group justify="space-between" wrap="nowrap">
+                      <Group gap="sm">
+                        <Ship size={18} className="text-[color:var(--freight-brand)]" />
+                        <div>
+                          <Text fw={700}>{c.reference}</Text>
+                          <Text size="sm" c="dimmed">
+                            {c.tradeDirection} · {c.status}
+                          </Text>
+                        </div>
+                      </Group>
+                      <Group gap="xs">
+                        <Badge variant="light" color="edr-green">
+                          Contract
+                        </Badge>
+                        <ChevronRight size={18} className="text-muted-foreground" />
+                      </Group>
+                    </Group>
+                  </Card>
+                ))
+              )}
+            </Stack>
+          )}
+        </Tabs.Panel>
+
+        <Tabs.Panel value="bookings">
+          {bookingsLoading ? (
+            <Group justify="center" py={60}>
+              <Loader color="edr-green" />
+            </Group>
+          ) : (
+            <Stack gap="sm">
+              {bookingItems.length === 0 ? (
+                <Text c="dimmed" ta="center" py="xl">
+                  No Djibouti customs bookings yet.
+                </Text>
+              ) : (
+                bookingItems.map((b) => (
+                  <Card
+                    key={b.id}
+                    withBorder
+                    radius="md"
+                    padding="md"
+                    style={{ cursor: "pointer" }}
+                    onClick={() => navigate(`/dashboard/gl-djibouti/clearance/${b.id}`)}
+                  >
+                    <Group justify="space-between" wrap="nowrap">
+                      <Group gap="sm">
+                        <Container size={18} className="text-[color:var(--freight-brand)]" />
+                        <div>
+                          <Text fw={700}>{b.reference}</Text>
+                          <Text size="sm" c="dimmed">
+                            {b.tradeDirection} · {b.status}
+                          </Text>
+                        </div>
+                      </Group>
+                      <Group gap="xs">
+                        <Badge variant="light" color="blue">
+                          Booking
+                        </Badge>
+                        <ChevronRight size={18} className="text-muted-foreground" />
+                      </Group>
+                    </Group>
+                  </Card>
+                ))
+              )}
+            </Stack>
+          )}
+        </Tabs.Panel>
+      </Tabs>
+    </PageContainer>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/contracts/ShipmentRequestDetailPage.tsx b/apps/edr-freight-web/backoffice/src/pages/contracts/ShipmentRequestDetailPage.tsx
index c04acfdca..89237af1f 100644
--- a/apps/edr-freight-web/backoffice/src/pages/contracts/ShipmentRequestDetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/contracts/ShipmentRequestDetailPage.tsx
@@ -6,6 +6,7 @@ import {
   Badge,
   Box,
   Button,
+  Grid,
   Group,
   Loader,
   Modal,
@@ -24,6 +25,12 @@ import type { Freight } from "@edr/types";
 import { PageContainer } from "@/components/page/PageContainer";
 import { PageHeader } from "@/components/page/PageHeader";
 import { SectionCard } from "@/components/bookings/detail/SectionCard";
+import {
+  RequestCustomerCard,
+  RequestContractSummaryCard,
+  RequestRouteCargoCard,
+  RequestServiceTypeCard,
+} from "@/components/contracts/detail/RequestDetailCards";
 import { contractsService } from "@/services/contracts.service";
 
 const fmtDate = (iso?: string | null) =>
@@ -167,49 +174,67 @@ export default function ShipmentRequestDetailPage() {
           }
         />
 
-        <SectionCard icon={CalendarDays} title="Requested shipment">
-          <Stack gap="sm">
-            <Group justify="space-between">
-              <Text size="sm" c="dimmed">
-                Preferred date (informational)
-              </Text>
-              <Text size="sm" fw={600}>
-                {fmtDate(request.scheduledDate)}
-              </Text>
-            </Group>
-            <Box>
-              <Text size="sm" c="dimmed" mb={6}>
-                Quantities
-              </Text>
-              <Stack gap={4}>
-                {lineRows(request.requestedLines ?? {}).map((l, i) => (
-                  <Badge
-                    key={i}
-                    variant="light"
-                    color="edr-green"
-                    radius="sm"
-                    size="lg"
-                  >
-                    {l}
-                  </Badge>
-                ))}
-              </Stack>
-            </Box>
-            {request.notes ? (
-              <Box>
-                <Text size="sm" c="dimmed" mb={4}>
-                  Customer note
-                </Text>
-                <Text size="sm">{request.notes}</Text>
-              </Box>
-            ) : null}
-            {request.reviewNote ? (
-              <Alert color="red" variant="light" radius="md" mt="sm">
-                Rejected: {request.reviewNote}
-              </Alert>
-            ) : null}
-          </Stack>
-        </SectionCard>
+        <Grid gap="lg">
+          {/* LEFT — the request itself + route/cargo scope */}
+          <Grid.Col span={{ base: 12, lg: 7 }}>
+            <Stack gap="lg">
+              <SectionCard icon={CalendarDays} title="Requested shipment">
+                <Stack gap="sm">
+                  <Group justify="space-between">
+                    <Text size="sm" c="dimmed">
+                      Preferred date (informational)
+                    </Text>
+                    <Text size="sm" fw={600}>
+                      {fmtDate(request.scheduledDate)}
+                    </Text>
+                  </Group>
+                  <Box>
+                    <Text size="sm" c="dimmed" mb={6}>
+                      Quantities
+                    </Text>
+                    <Stack gap={4}>
+                      {lineRows(request.requestedLines ?? {}).map((l, i) => (
+                        <Badge
+                          key={i}
+                          variant="light"
+                          color="edr-green"
+                          radius="sm"
+                          size="lg"
+                        >
+                          {l}
+                        </Badge>
+                      ))}
+                    </Stack>
+                  </Box>
+                  {request.notes ? (
+                    <Box>
+                      <Text size="sm" c="dimmed" mb={4}>
+                        Customer note
+                      </Text>
+                      <Text size="sm">{request.notes}</Text>
+                    </Box>
+                  ) : null}
+                  {request.reviewNote ? (
+                    <Alert color="red" variant="light" radius="md" mt="sm">
+                      Rejected: {request.reviewNote}
+                    </Alert>
+                  ) : null}
+                </Stack>
+              </SectionCard>
+
+              <RequestRouteCargoCard contract={request.contract} />
+            </Stack>
+          </Grid.Col>
+
+          {/* RIGHT — customer, contract + service-type context */}
+          <Grid.Col span={{ base: 12, lg: 5 }}>
+            <Stack gap="lg">
+              <RequestCustomerCard contract={request.contract} />
+              <RequestContractSummaryCard contract={request.contract} />
+              <RequestServiceTypeCard contract={request.contract} />
+            </Stack>
+          </Grid.Col>
+        </Grid>
       </Stack>
 
       <Modal
diff --git a/apps/edr-freight-web/backoffice/src/pages/contracts/ShipmentRequestsPage.tsx b/apps/edr-freight-web/backoffice/src/pages/contracts/ShipmentRequestsPage.tsx
index 03b80e165..812d68f0d 100644
--- a/apps/edr-freight-web/backoffice/src/pages/contracts/ShipmentRequestsPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/contracts/ShipmentRequestsPage.tsx
@@ -1,22 +1,30 @@
 import { useMemo, useState } from "react";
 import { useNavigate } from "react-router-dom";
-import { useQuery } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import {
   ActionIcon,
   Badge,
   Box,
+  Button,
   Group,
+  Modal,
   Stack,
   Text,
+  Textarea,
   TextInput,
 } from "@mantine/core";
-import { ChevronRight, Inbox, PackageSearch, RefreshCw, Search } from "lucide-react";
+import { Inbox, PackageSearch, RefreshCw, Search } from "lucide-react";
 import { DataTable, type ColumnDef } from "@edr/ui-common";
 import type { Freight } from "@edr/types";
 
 import { PageContainer } from "@/components/page/PageContainer";
 import { PageHeader } from "@/components/page/PageHeader";
 import { ruleEngineTable } from "@/components/ruleEngine/ruleEngineStyles";
+import {
+  getShipmentRejectAction,
+  getShipmentStaffRowAction,
+  type ShipmentListRow,
+} from "@/features/contracts/mapShipmentListRow";
 import { contractsService } from "@/services/contracts.service";
 
 const cellMeta = {
@@ -33,7 +41,6 @@ const fmtDate = (iso?: string | null) =>
       }).format(new Date(iso))
     : "—";
 
-/** Summarize requested quantities for the list row. */
 function summarizeLines(lines: Freight.RequestedShipmentLines): string {
   if (lines.containers?.length) {
     return lines.containers
@@ -49,17 +56,13 @@ function summarizeLines(lines: Freight.RequestedShipmentLines): string {
   return "—";
 }
 
-interface RequestRow {
-  id: string;
-  reference: string;
-  contractReference: string;
-  scheduledDate?: string | null;
-  summary: string;
-}
-
 export default function ShipmentRequestsPage() {
   const navigate = useNavigate();
+  const queryClient = useQueryClient();
   const [query, setQuery] = useState("");
+  const [rejectTarget, setRejectTarget] = useState<ShipmentListRow | null>(null);
+  const [rejectNote, setRejectNote] = useState("");
+  const [acceptTarget, setAcceptTarget] = useState<ShipmentListRow | null>(null);
 
   const { data, isLoading, isError, isFetching, refetch } = useQuery({
     queryKey: ["shipment-request-queue"],
@@ -67,13 +70,26 @@ export default function ShipmentRequestsPage() {
     refetchInterval: 30_000,
   });
 
-  const rows = useMemo<RequestRow[]>(() => {
+  const reject = useMutation({
+    mutationFn: () =>
+      contractsService.rejectBookingRequest(rejectTarget!.id, rejectNote),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["shipment-request-queue"] });
+      setRejectTarget(null);
+      setRejectNote("");
+    },
+  });
+
+  const rows = useMemo<ShipmentListRow[]>(() => {
     const all = (data ?? []).map((r) => ({
       id: r.id,
       reference: r.reference || r.id.slice(0, 8),
+      contractId: r.contractId,
       contractReference: r.contract?.reference ?? r.contractId,
       scheduledDate: r.scheduledDate,
       summary: summarizeLines(r.requestedLines ?? {}),
+      status: r.status,
+      createdBookingId: r.createdBookingId,
     }));
     const q = query.trim().toLowerCase();
     if (!q) return all;
@@ -85,7 +101,7 @@ export default function ShipmentRequestsPage() {
     );
   }, [data, query]);
 
-  const columns = useMemo<ColumnDef<RequestRow>[]>(
+  const columns = useMemo<ColumnDef<ShipmentListRow>[]>(
     () => [
       {
         id: "reference",
@@ -126,16 +142,55 @@ export default function ShipmentRequestsPage() {
         ),
       },
       {
-        id: "go",
-        size: 56,
-        cell: () => (
-          <Group justify="flex-end" pr="xs">
-            <ChevronRight size={16} className="text-muted-foreground" />
-          </Group>
-        ),
+        id: "actions",
+        header: () => <span className={ruleEngineTable.headerCell}>Action</span>,
+        meta: cellMeta,
+        cell: ({ row }) => {
+          const primary = getShipmentStaffRowAction(row.original);
+          const rejectAction = getShipmentRejectAction(row.original);
+          return (
+            <Group gap={6} wrap="nowrap" justify="flex-end">
+              {rejectAction ? (
+                <Button
+                  size="compact-sm"
+                  radius="md"
+                  variant="light"
+                  color="red"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setRejectTarget(row.original);
+                  }}
+                >
+                  {rejectAction.label}
+                </Button>
+              ) : null}
+              {primary.kind === "navigate" ? (
+                <Button
+                  size="compact-sm"
+                  radius="md"
+                  variant={primary.variant === "filled" ? "filled" : primary.variant}
+                  color="edr-green"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    if (
+                      primary.label === "Accept" &&
+                      row.original.status === "PENDING"
+                    ) {
+                      setAcceptTarget(row.original);
+                    } else {
+                      navigate(primary.to(row.original));
+                    }
+                  }}
+                >
+                  {primary.label}
+                </Button>
+              ) : null}
+            </Group>
+          );
+        },
       },
     ],
-    [],
+    [navigate],
   );
 
   return (
@@ -203,6 +258,95 @@ export default function ShipmentRequestsPage() {
           />
         )}
       </Stack>
+
+      <Modal
+        opened={rejectTarget !== null}
+        onClose={() => {
+          if (!reject.isPending) {
+            setRejectTarget(null);
+            setRejectNote("");
+          }
+        }}
+        title="Reject shipment request"
+        radius="md"
+        centered
+      >
+        <Stack gap="md">
+          <Text size="sm" c="dimmed">
+            Reject request{" "}
+            <Text span fw={600}>
+              {rejectTarget?.reference}
+            </Text>
+            ? The customer will be notified.
+          </Text>
+          <Textarea
+            label="Reason"
+            placeholder="Explain why this request cannot be accepted…"
+            value={rejectNote}
+            onChange={(e) => setRejectNote(e.currentTarget.value)}
+            minRows={3}
+            radius="md"
+          />
+          <Group justify="flex-end" gap="sm">
+            <Button
+              variant="default"
+              radius="md"
+              onClick={() => {
+                setRejectTarget(null);
+                setRejectNote("");
+              }}
+            >
+              Cancel
+            </Button>
+            <Button
+              color="red"
+              radius="md"
+              loading={reject.isPending}
+              disabled={!rejectNote.trim()}
+              onClick={() => reject.mutate()}
+            >
+              Reject request
+            </Button>
+          </Group>
+        </Stack>
+      </Modal>
+
+      <Modal
+        opened={acceptTarget !== null}
+        onClose={() => setAcceptTarget(null)}
+        title="Accept shipment request"
+        radius="md"
+        centered
+      >
+        <Stack gap="md">
+          <Text size="sm" c="dimmed">
+            Proceed to create a booking for request{" "}
+            <Text span fw={600}>
+              {acceptTarget?.reference}
+            </Text>
+            ? You will confirm the shipment price before submitting.
+          </Text>
+          <Group justify="flex-end" gap="sm">
+            <Button variant="default" radius="md" onClick={() => setAcceptTarget(null)}>
+              Cancel
+            </Button>
+            <Button
+              color="edr-green"
+              radius="md"
+              onClick={() => {
+                if (!acceptTarget) return;
+                const to = getShipmentStaffRowAction(acceptTarget);
+                if (to.kind === "navigate") {
+                  navigate(to.to(acceptTarget));
+                }
+                setAcceptTarget(null);
+              }}
+            >
+              Continue
+            </Button>
+          </Group>
+        </Stack>
+      </Modal>
     </PageContainer>
   );
 }
diff --git a/apps/edr-freight-web/backoffice/src/pages/fleet/FinancialReportsPage.tsx b/apps/edr-freight-web/backoffice/src/pages/fleet/FinancialReportsPage.tsx
new file mode 100644
index 000000000..73a7456af
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/FinancialReportsPage.tsx
@@ -0,0 +1,251 @@
+import { useMemo, useState } from 'react';
+import { useQuery } from '@tanstack/react-query';
+import { Card, Button, Stack, Group, Grid, Select, Text, ThemeIcon, RingProgress, Container } from '@mantine/core';
+import { QUERY_KEYS } from '@/constants/QUERY_KEYS';
+import { api } from '@/services/api';
+import { vehiclesService } from '@/services/vehicles.service';
+import { freightBrand } from '@/theme/freight-brand';
+
+interface FuelStats {
+  vehicleId: string;
+  totalPurchases: number;
+  totalFuel: number;
+  totalCost: number;
+  averageCostPerLiter: number;
+}
+
+interface MaintenanceStats {
+  vehicleId: string;
+  totalCost: number;
+  numberOfMaintenanceItems: number;
+  averageCostPerMaintenance: number;
+  costByType: Record<string, number>;
+}
+
+interface CombinedReport {
+  vehicleId: string;
+  fuelCost: number;
+  maintenanceCost: number;
+  totalOperatingCost: number;
+  fuelPercentage: number;
+  maintenancePercentage: number;
+}
+
+export function FinancialReportsPage() {
+  const [selectedVehicle, setSelectedVehicle] = useState<string | null>(null);
+  const [months, setMonths] = useState('12');
+
+  const { data: vehicles } = useQuery({
+    queryKey: QUERY_KEYS.VEHICLES.list(),
+    queryFn: async () => {
+      const res = await vehiclesService.getAll({ limit: 1000 });
+      return res.data || [];
+    },
+  });
+
+  const { data: fuelStats } = useQuery({
+    queryKey: QUERY_KEYS.FUEL.stats(selectedVehicle || ''),
+    queryFn: () => selectedVehicle ? api.get(`/fuel/stats/${selectedVehicle}?months=${months}`) : Promise.resolve(null),
+    enabled: !!selectedVehicle,
+  });
+
+  const { data: maintenanceStats } = useQuery({
+    queryKey: QUERY_KEYS.MAINTENANCE.stats(selectedVehicle || ''),
+    queryFn: () => selectedVehicle ? api.get(`/maintenance/stats/${selectedVehicle}`) : Promise.resolve(null),
+    enabled: !!selectedVehicle,
+  });
+
+  const vehicleOptions = useMemo(
+    () => vehicles?.map(v => ({ label: v.registrationNumber || v.id, value: v.id })) || [],
+    [vehicles]
+  );
+
+  const report = useMemo(() => {
+    if (!fuelStats || !maintenanceStats) return null;
+
+    const fuelCost = Number(fuelStats.totalCost) || 0;
+    const maintenanceCost = Number(maintenanceStats.totalCost) || 0;
+    const total = fuelCost + maintenanceCost;
+
+    return {
+      vehicleId: selectedVehicle!,
+      fuelCost,
+      maintenanceCost,
+      totalOperatingCost: total,
+      fuelPercentage: total > 0 ? Math.round((fuelCost / total) * 100) : 0,
+      maintenancePercentage: total > 0 ? Math.round((maintenanceCost / total) * 100) : 0,
+    };
+  }, [fuelStats, maintenanceStats, selectedVehicle]);
+
+  const StatCard = ({ label, value }: { label: string; value: string }) => (
+    <Card withBorder>
+      <Card.Section p="md">
+        <Text size="sm" c="dimmed">
+          {label}
+        </Text>
+        <Text fw={700} size="lg">
+          {value}
+        </Text>
+      </Card.Section>
+    </Card>
+  );
+
+  return (
+    <Container size="xl" py="xl" px="lg">
+      <Stack gap="md">
+      <Card>
+        <Card.Section p="md" withBorder>
+          <Text fw={500}>Fleet Financial Analysis</Text>
+        </Card.Section>
+        <Card.Section p="md">
+          <Group>
+            <Select
+              label="Vehicle"
+              placeholder="Select a vehicle"
+              data={vehicleOptions}
+              value={selectedVehicle}
+              onChange={setSelectedVehicle}
+              style={{ flex: 1 }}
+            />
+            <Select
+              label="Period"
+              data={[
+                { label: 'Last 3 months', value: '3' },
+                { label: 'Last 6 months', value: '6' },
+                { label: 'Last 12 months', value: '12' },
+              ]}
+              value={months}
+              onChange={v => setMonths(v || '12')}
+              style={{ flex: 1 }}
+            />
+          </Group>
+        </Card.Section>
+      </Card>
+
+      {report && (
+        <>
+          <Grid>
+            <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+              <StatCard label="Total Operating Cost" value={`$${report.totalOperatingCost.toFixed(2)}`} />
+            </Grid.Col>
+            <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+              <StatCard label="Fuel Cost" value={`$${report.fuelCost.toFixed(2)}`} />
+            </Grid.Col>
+            <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+              <StatCard label="Maintenance Cost" value={`$${report.maintenanceCost.toFixed(2)}`} />
+            </Grid.Col>
+            <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+              <Card withBorder>
+                <Card.Section p="md">
+                  <Text size="sm" c="dimmed">
+                    Monthly Avg
+                  </Text>
+                  <Text fw={700} size="lg">
+                    ${(report.totalOperatingCost / parseInt(months)).toFixed(2)}
+                  </Text>
+                </Card.Section>
+              </Card>
+            </Grid.Col>
+          </Grid>
+
+          <Grid>
+            <Grid.Col span={{ base: 12, sm: 6 }}>
+              <Card>
+                <Card.Section p="md" withBorder>
+                  <Text fw={500}>Cost Breakdown</Text>
+                </Card.Section>
+                <Card.Section p="md">
+                  <Stack gap="lg">
+                    <Group justify="space-between">
+                      <Stack gap={0}>
+                        <Text size="sm" c="dimmed">
+                          Fuel
+                        </Text>
+                        <Text fw={500}>{report.fuelPercentage}%</Text>
+                      </Stack>
+                      <RingProgress
+                        sections={[{ value: report.fuelPercentage, color: 'edr-accent' }]}
+                        label={
+                          <Text size="xs" align="center">
+                            {report.fuelPercentage}%
+                          </Text>
+                        }
+                        size={100}
+                        thickness={4}
+                      />
+                    </Group>
+                    <Group justify="space-between">
+                      <Stack gap={0}>
+                        <Text size="sm" c="dimmed">
+                          Maintenance
+                        </Text>
+                        <Text fw={500}>{report.maintenancePercentage}%</Text>
+                      </Stack>
+                      <RingProgress
+                        sections={[{ value: report.maintenancePercentage, color: 'edr-red' }]}
+                        label={
+                          <Text size="xs" align="center">
+                            {report.maintenancePercentage}%
+                          </Text>
+                        }
+                        size={100}
+                        thickness={4}
+                      />
+                    </Group>
+                  </Stack>
+                </Card.Section>
+              </Card>
+            </Grid.Col>
+
+            <Grid.Col span={{ base: 12, sm: 6 }}>
+              <Card>
+                <Card.Section p="md" withBorder>
+                  <Text fw={500}>Operational Insights</Text>
+                </Card.Section>
+                <Card.Section p="md">
+                  <Stack gap="sm">
+                    <div>
+                      <Text size="sm" c="dimmed">
+                        Fuel Purchases
+                      </Text>
+                      <Text fw={500}>{fuelStats?.totalPurchases || 0} transactions</Text>
+                    </div>
+                    <div>
+                      <Text size="sm" c="dimmed">
+                        Fuel Efficiency
+                      </Text>
+                      <Text fw={500}>
+                        {fuelStats?.fuelEfficiency?.toFixed(2) || 'N/A'} km/L
+                      </Text>
+                    </div>
+                    <div>
+                      <Text size="sm" c="dimmed">
+                        Maintenance Items
+                      </Text>
+                      <Text fw={500}>{maintenanceStats?.numberOfMaintenanceItems || 0} records</Text>
+                    </div>
+                    <div>
+                      <Text size="sm" c="dimmed">
+                        Avg Maintenance Cost
+                      </Text>
+                      <Text fw={500}>${maintenanceStats?.averageCostPerMaintenance?.toFixed(2) || '0.00'}</Text>
+                    </div>
+                  </Stack>
+                </Card.Section>
+              </Card>
+            </Grid.Col>
+          </Grid>
+        </>
+      )}
+
+      {!selectedVehicle && (
+        <Card>
+          <Card.Section p="md">
+            <Text c="dimmed">Select a vehicle to view financial reports</Text>
+          </Card.Section>
+        </Card>
+      )}
+      </Stack>
+    </Container>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/fleet/FleetDashboard.tsx b/apps/edr-freight-web/backoffice/src/pages/fleet/FleetDashboard.tsx
new file mode 100644
index 000000000..a311a16eb
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/FleetDashboard.tsx
@@ -0,0 +1,361 @@
+import { useMemo } from 'react';
+import { useQuery } from '@tanstack/react-query';
+import { Card, Stack, Group, Grid, Text, ThemeIcon, Progress, Badge, Table, RingProgress, Container, Title, Box, Tabs, Button } from '@mantine/core';
+import { Truck, Fuel, Wrench, TrendingUp, AlertCircle, Users, User, MapPin, Calendar, BarChart3 } from 'lucide-react';
+import Breadcrumbs from '@/components/ui/Breadcrumbs';
+import { QUERY_KEYS } from '@/constants/QUERY_KEYS';
+import { api } from '@/auth/http';
+import { vehiclesService } from '@/services/vehicles.service';
+import { freightBrand } from '@/theme/freight-brand';
+
+interface Vehicle {
+  id: string;
+  registrationNumber: string;
+  plateNumber: string;
+  manufacturer: string;
+  model: string;
+  status?: string;
+}
+
+interface Driver {
+  id: string;
+  firstName: string;
+  lastName: string;
+  licenseNumber?: string;
+  email?: string;
+  phone?: string;
+  assignedVehicle?: string;
+}
+
+interface FleetMetrics {
+  totalVehicles: number;
+  activeVehicles: number;
+  maintenanceOverdue: number;
+  totalFuelSpend: number;
+  totalMaintenanceSpend: number;
+  averageFuelEfficiency: number;
+  costPerKm: number;
+  totalDrivers: number;
+  assignedDrivers: number;
+}
+
+const StatCard = ({ icon: Icon, label, value, color = 'edr-green', change }: any) => (
+  <Card withBorder p="lg" style={{ borderTop: `3px solid ${freightBrand.primary}` }}>
+    <Group justify="space-between" mb="sm">
+      <ThemeIcon size="xl" radius="md" color={color} variant="light">
+        <Icon size={28} />
+      </ThemeIcon>
+    </Group>
+    <Stack gap="xs">
+      <Text size="xs" c="dimmed" fw={500} tt="uppercase">
+        {label}
+      </Text>
+      <Group justify="space-between">
+        <Text fw={700} size="xl" c="edr-ink">
+          {value}
+        </Text>
+        {change && <Badge color={change > 0 ? 'edr-green' : 'edr-red'} size="lg">{change > 0 ? '+' : ''}{change}%</Badge>}
+      </Group>
+    </Stack>
+  </Card>
+);
+
+export function FleetDashboard() {
+  const { data: vehicles = [] } = useQuery({
+    queryKey: QUERY_KEYS.VEHICLES.list(),
+    queryFn: async () => {
+      const res = await vehiclesService.getAll({ limit: 1000 });
+      return res.data || [];
+    },
+  });
+
+  const { data: drivers = [] } = useQuery({
+    queryKey: ['drivers'],
+    queryFn: async () => {
+      try {
+        const res = await api.get('/drivers');
+        return res.data || [];
+      } catch {
+        return [];
+      }
+    },
+  });
+
+  const { data: fuelStats } = useQuery({
+    queryKey: ['fleet-fuel-stats'],
+    queryFn: async () => {
+      try {
+        const res = await api.get('/fuel/stats');
+        return res.data || {};
+      } catch {
+        return {};
+      }
+    },
+  });
+
+  const { data: maintenanceStats } = useQuery({
+    queryKey: ['fleet-maintenance-stats'],
+    queryFn: async () => {
+      try {
+        const res = await api.get('/maintenance/stats');
+        return res.data || {};
+      } catch {
+        return {};
+      }
+    },
+  });
+
+  const metrics = useMemo((): FleetMetrics => {
+    const totalVehicles = (vehicles as Vehicle[]).length;
+    const activeVehicles = (vehicles as Vehicle[]).filter(v => v.status === 'ACTIVE').length;
+    const totalDrivers = (drivers as Driver[]).length;
+    const assignedDrivers = (drivers as Driver[]).filter(d => d.assignedVehicle).length;
+
+    const fuelTotal = fuelStats?.totalCost || 0;
+    const maintenanceTotal = maintenanceStats?.totalCost || 0;
+
+    return {
+      totalVehicles,
+      activeVehicles,
+      maintenanceOverdue: 0, // TODO: fetch from API
+      totalFuelSpend: fuelTotal,
+      totalMaintenanceSpend: maintenanceTotal,
+      averageFuelEfficiency: fuelStats?.averageEfficiency || 0,
+      costPerKm: (fuelTotal + maintenanceTotal) / 100000, // Placeholder
+      totalDrivers,
+      assignedDrivers,
+    };
+  }, [vehicles, drivers, fuelStats, maintenanceStats]);
+
+  const operatingCost = metrics.totalFuelSpend + metrics.totalMaintenanceSpend;
+  const fuelPercent = operatingCost > 0 ? Math.round((metrics.totalFuelSpend / operatingCost) * 100) : 0;
+
+  return (
+    <Container size="xl" py="xl" px="lg">
+      <Breadcrumbs items={[{ label: 'Fleet' }, { label: 'Dashboard' }]} />
+
+      <Box mb="xl">
+        <Title order={1} mb="xs">
+          Fleet Management Dashboard
+        </Title>
+        <Text c="dimmed" size="sm">
+          Real-time fleet overview, vehicle & driver management
+        </Text>
+      </Box>
+
+      {/* Primary Metrics */}
+      <Grid mb="xl">
+        <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+          <StatCard icon={Truck} label="Total Vehicles" value={metrics.totalVehicles} color="edr-green" />
+        </Grid.Col>
+        <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+          <StatCard icon={Users} label="Total Drivers" value={metrics.totalDrivers} color="edr-blue" />
+        </Grid.Col>
+        <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+          <StatCard icon={Fuel} label="Fuel Spend" value={`$${metrics.totalFuelSpend.toFixed(0)}`} color="edr-accent" />
+        </Grid.Col>
+        <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+          <StatCard icon={Wrench} label="Maintenance" value={`$${metrics.totalMaintenanceSpend.toFixed(0)}`} color="edr-red" />
+        </Grid.Col>
+      </Grid>
+
+      {/* Fleet Status */}
+      <Grid mb="lg">
+        <Grid.Col span={{ base: 12, md: 6 }}>
+          <Card withBorder>
+            <Card.Section p="md" withBorder>
+              <Text fw={500}>Fleet Status</Text>
+            </Card.Section>
+            <Card.Section p="md">
+              <Stack gap="lg">
+                <div>
+                  <Group justify="space-between" mb="xs">
+                    <Text size="sm">Active Vehicles</Text>
+                    <Text fw={700}>{metrics.activeVehicles} / {metrics.totalVehicles}</Text>
+                  </Group>
+                  <Progress value={(metrics.activeVehicles / metrics.totalVehicles) * 100} color="edr-green" />
+                </div>
+
+                <div>
+                  <Group justify="space-between" mb="xs">
+                    <Text size="sm">Maintenance Overdue</Text>
+                    <Badge color="edr-red">{metrics.maintenanceOverdue}</Badge>
+                  </Group>
+                  <Progress value={0} color="edr-red" />
+                </div>
+
+                <div>
+                  <Group justify="space-between" mb="xs">
+                    <Text size="sm">Idle / Under Maintenance</Text>
+                    <Text fw={700}>{metrics.totalVehicles - metrics.activeVehicles}</Text>
+                  </Group>
+                  <Progress value={((metrics.totalVehicles - metrics.activeVehicles) / metrics.totalVehicles) * 100} color="edr-amber-soft" />
+                </div>
+              </Stack>
+            </Card.Section>
+          </Card>
+        </Grid.Col>
+
+        <Grid.Col span={{ base: 12, md: 6 }}>
+          <Card withBorder>
+            <Card.Section p="md" withBorder>
+              <Text fw={500}>Operating Cost Breakdown</Text>
+            </Card.Section>
+            <Card.Section p="md">
+              <Stack gap="lg">
+                <Group justify="center">
+                  <RingProgress
+                    sections={[
+                      { value: fuelPercent, color: 'edr-accent' },
+                      { value: 100 - fuelPercent, color: 'edr-red' },
+                    ]}
+                    label={
+                      <div style={{ textAlign: 'center' }}>
+                        <Text fw={700} size="sm">
+                          ${operatingCost.toFixed(0)}
+                        </Text>
+                        <Text size="xs" c="dimmed">
+                          Total Cost
+                        </Text>
+                      </div>
+                    }
+                    size={120}
+                    thickness={4}
+                  />
+                </Group>
+
+                <div>
+                  <Group justify="space-between">
+                    <Group gap="xs">
+                      <ThemeIcon size="sm" color="edr-accent" variant="light">
+                        <Fuel size={14} />
+                      </ThemeIcon>
+                      <Text size="sm">Fuel</Text>
+                    </Group>
+                    <Text fw={700}>{fuelPercent}%</Text>
+                  </Group>
+                </div>
+
+                <div>
+                  <Group justify="space-between">
+                    <Group gap="xs">
+                      <ThemeIcon size="sm" color="edr-red" variant="light">
+                        <Wrench size={14} />
+                      </ThemeIcon>
+                      <Text size="sm">Maintenance</Text>
+                    </Group>
+                    <Text fw={700}>{100 - fuelPercent}%</Text>
+                  </Group>
+                </div>
+              </Stack>
+            </Card.Section>
+          </Card>
+        </Grid.Col>
+      </Grid>
+
+      {/* Vehicles & Drivers Tabs */}
+      <Card withBorder>
+        <Tabs defaultValue="vehicles" p="md">
+          <Tabs.List>
+            <Tabs.Tab value="vehicles" leftSection={<Truck size={16} />}>
+              Vehicles ({(vehicles as Vehicle[]).length})
+            </Tabs.Tab>
+            <Tabs.Tab value="drivers" leftSection={<Users size={16} />}>
+              Drivers ({(drivers as Driver[]).length})
+            </Tabs.Tab>
+          </Tabs.List>
+
+          <Tabs.Panel value="vehicles" pt="md">
+            {(vehicles as Vehicle[]).length > 0 ? (
+              <Table striped highlightOnHover>
+                <Table.Thead>
+                  <Table.Tr>
+                    <Table.Th>Registration</Table.Th>
+                    <Table.Th>Plate</Table.Th>
+                    <Table.Th>Model</Table.Th>
+                    <Table.Th>Status</Table.Th>
+                  </Table.Tr>
+                </Table.Thead>
+                <Table.Tbody>
+                  {(vehicles as Vehicle[]).slice(0, 15).map(v => (
+                    <Table.Tr key={v.id}>
+                      <Table.Td fw={500}>{v.registrationNumber}</Table.Td>
+                      <Table.Td>{v.plateNumber}</Table.Td>
+                      <Table.Td>
+                        {v.manufacturer} {v.model}
+                      </Table.Td>
+                      <Table.Td>
+                        <Badge color={v.status === 'ACTIVE' ? 'edr-green' : v.status === 'MAINTENANCE' ? 'edr-amber-soft' : 'gray'}>
+                          {v.status || 'UNKNOWN'}
+                        </Badge>
+                      </Table.Td>
+                    </Table.Tr>
+                  ))}
+                </Table.Tbody>
+              </Table>
+            ) : (
+              <Group gap="xs" p="md">
+                <AlertCircle size={20} />
+                <Text c="dimmed">No vehicles in fleet</Text>
+              </Group>
+            )}
+          </Tabs.Panel>
+
+          <Tabs.Panel value="drivers" pt="md">
+            {(drivers as Driver[]).length > 0 ? (
+              <Table striped highlightOnHover>
+                <Table.Thead>
+                  <Table.Tr>
+                    <Table.Th>Name</Table.Th>
+                    <Table.Th>License</Table.Th>
+                    <Table.Th>Contact</Table.Th>
+                    <Table.Th>Assigned Vehicle</Table.Th>
+                  </Table.Tr>
+                </Table.Thead>
+                <Table.Tbody>
+                  {(drivers as Driver[]).slice(0, 15).map(d => (
+                    <Table.Tr key={d.id}>
+                      <Table.Td fw={500}>
+                        <Group gap="xs">
+                          <ThemeIcon size="sm" radius="xl" variant="light" color="blue">
+                            <User size={14} />
+                          </ThemeIcon>
+                          {d.firstName} {d.lastName}
+                        </Group>
+                      </Table.Td>
+                      <Table.Td>{d.licenseNumber || 'N/A'}</Table.Td>
+                      <Table.Td>
+                        <Stack gap={0} size="xs">
+                          {d.phone && (
+                            <Text size="xs">
+                              <Group gap={4} inline>
+                                <MapPin size={12} /> {d.phone}
+                              </Group>
+                            </Text>
+                          )}
+                          {d.email && <Text size="xs">{d.email}</Text>}
+                        </Stack>
+                      </Table.Td>
+                      <Table.Td>
+                        {d.assignedVehicle ? (
+                          <Badge color="edr-green">Assigned</Badge>
+                        ) : (
+                          <Badge color="edr-slate">Unassigned</Badge>
+                        )}
+                      </Table.Td>
+                    </Table.Tr>
+                  ))}
+                </Table.Tbody>
+              </Table>
+            ) : (
+              <Group gap="xs" p="md">
+                <AlertCircle size={20} />
+                <Text c="dimmed">No drivers in system</Text>
+              </Group>
+            )}
+          </Tabs.Panel>
+        </Tabs>
+      </Card>
+    </Container>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/fleet/FuelPurchasePage.tsx b/apps/edr-freight-web/backoffice/src/pages/fleet/FuelPurchasePage.tsx
new file mode 100644
index 000000000..b3c168df3
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/FuelPurchasePage.tsx
@@ -0,0 +1,316 @@
+import { useState } from "react";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import {
+  Box,
+  Button,
+  Card,
+  Container,
+  Group,
+  Modal,
+  NumberInput,
+  Select,
+  Stack,
+  Table,
+  Text,
+  TextInput,
+  Title,
+  Badge,
+  Grid,
+} from "@mantine/core";
+import { Plus, Trash2 } from "lucide-react";
+import Breadcrumbs from "@/components/ui/Breadcrumbs";
+import { useToast } from "@/hooks/use-toast";
+import { api } from "@/auth/http";
+import { QUERY_KEYS } from "@/constants/QUERY_KEYS";
+import { vehiclesService, type Vehicle as VehicleType } from "@/services/vehicles.service";
+import { freightBrand } from "@/theme/freight-brand";
+
+interface FuelPurchase {
+  id: string;
+  vehicleId: string;
+  vehicleName?: string;
+  purchaseDate: string;
+  liters: number;
+  costPerLiter: number;
+  totalCost: number;
+  fuelStation?: string;
+  paymentMethod: string;
+  odometerReading?: number;
+  receiptNumber?: string;
+  notes?: string;
+}
+
+
+export default function FuelPurchasePage() {
+  const { toast } = useToast();
+  const qc = useQueryClient();
+  const [modalOpen, setModalOpen] = useState(false);
+  const [formData, setFormData] = useState({
+    vehicleId: "",
+    purchaseDate: new Date().toISOString().split("T")[0],
+    liters: 0,
+    costPerLiter: 0,
+    fuelStation: "",
+    paymentMethod: "CASH",
+    odometerReading: undefined as number | undefined,
+    receiptNumber: "",
+    notes: "",
+  });
+
+  // Fetch vehicles
+  const { data: vehiclesData } = useQuery({
+    queryKey: QUERY_KEYS.VEHICLES.list(),
+    queryFn: async () => {
+      const res = await vehiclesService.getAll({ limit: 1000 });
+      return res.data || [];
+    },
+  });
+
+  // Fetch fuel purchases
+  const { data: purchasesData = [] } = useQuery({
+    queryKey: ["fuel-purchases"],
+    queryFn: async () => {
+      const res = await api.get("/fuel/purchases");
+      return res.data || [];
+    },
+  });
+
+  // Record purchase mutation
+  const recordMutation = useMutation({
+    mutationFn: async (data: typeof formData) => {
+      const res = await api.post("/fuel/purchases", {
+        ...data,
+        liters: parseFloat(data.liters.toString()),
+        costPerLiter: parseFloat(data.costPerLiter.toString()),
+      });
+      return res.data;
+    },
+    onSuccess: () => {
+      toast({ title: "Fuel purchase recorded" });
+      setModalOpen(false);
+      setFormData({
+        vehicleId: "",
+        purchaseDate: new Date().toISOString().split("T")[0],
+        liters: 0,
+        costPerLiter: 0,
+        fuelStation: "",
+        paymentMethod: "CASH",
+        odometerReading: undefined,
+        receiptNumber: "",
+        notes: "",
+      });
+      qc.invalidateQueries({ queryKey: ["fuel-purchases"] });
+    },
+    onError: (error: any) => {
+      toast({
+        title: "Error recording purchase",
+        message: error?.response?.data?.message || "Failed to record fuel purchase",
+        color: "red",
+      });
+    },
+  });
+
+  const vehicleOptions =
+    vehiclesData?.map((v: VehicleType) => ({
+      value: v.id,
+      label: `${v.plateNumber} - ${v.manufacturer} ${v.model}`,
+    })) || [];
+
+  const totalCost = formData.liters * formData.costPerLiter;
+
+  return (
+    <Container size="xl" py="xl" px="lg">
+      <Breadcrumbs items={[{ label: "Fleet" }, { label: "Fuel Management" }, { label: "Record Purchase" }]} />
+
+      <Group justify="space-between" mb="lg">
+        <Title order={1}>Fuel Purchases</Title>
+        <Button leftSection={<Plus size={16} />} onClick={() => setModalOpen(true)} color="edr-green">
+          Record Purchase
+        </Button>
+      </Group>
+
+      {/* Stats Cards */}
+      <Grid mb="lg">
+        <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+          <Card withBorder padding="lg">
+            <Text size="sm" c="dimmed" fw={500}>
+              Total Purchases
+            </Text>
+            <Text fw={700} size="lg">
+              {purchasesData.length}
+            </Text>
+          </Card>
+        </Grid.Col>
+        <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+          <Card withBorder padding="lg">
+            <Text size="sm" c="dimmed" fw={500}>
+              Total Liters
+            </Text>
+            <Text fw={700} size="lg">
+              {purchasesData
+                .reduce((sum: number, p: FuelPurchase) => sum + Number(p.liters), 0)
+                .toFixed(2)}{" "}
+              L
+            </Text>
+          </Card>
+        </Grid.Col>
+        <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+          <Card withBorder padding="lg">
+            <Text size="sm" c="dimmed" fw={500}>
+              Total Cost
+            </Text>
+            <Text fw={700} size="lg">
+              ETB {purchasesData
+                .reduce((sum: number, p: FuelPurchase) => sum + Number(p.totalCost), 0)
+                .toLocaleString("en-US", { maximumFractionDigits: 2 })}
+            </Text>
+          </Card>
+        </Grid.Col>
+        <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+          <Card withBorder padding="lg">
+            <Text size="sm" c="dimmed" fw={500}>
+              Avg Price/L
+            </Text>
+            <Text fw={700} size="lg">
+              ETB{" "}
+              {(
+                purchasesData.reduce((sum: number, p: FuelPurchase) => sum + Number(p.totalCost), 0) /
+                  purchasesData.reduce((sum: number, p: FuelPurchase) => sum + Number(p.liters), 0) || 0
+              ).toFixed(2)}
+            </Text>
+          </Card>
+        </Grid.Col>
+      </Grid>
+
+      {/* Purchases Table */}
+      <Card withBorder>
+        <Table striped highlightOnHover>
+          <Table.Thead>
+            <Table.Tr>
+              <Table.Th>Vehicle</Table.Th>
+              <Table.Th>Date</Table.Th>
+              <Table.Th align="right">Liters</Table.Th>
+              <Table.Th align="right">Cost/L</Table.Th>
+              <Table.Th align="right">Total</Table.Th>
+              <Table.Th>Station</Table.Th>
+              <Table.Th>Payment</Table.Th>
+            </Table.Tr>
+          </Table.Thead>
+          <Table.Tbody>
+            {(purchasesData as FuelPurchase[])?.map((purchase) => (
+              <Table.Tr key={purchase.id}>
+                <Table.Td>{(purchase as any).vehicle?.registrationNumber || (purchase as any).vehicle?.plateNumber || purchase.vehicleId}</Table.Td>
+                <Table.Td>{new Date(purchase.purchaseDate).toLocaleDateString()}</Table.Td>
+                <Table.Td align="right">{Number(purchase.liters).toFixed(2)}</Table.Td>
+                <Table.Td align="right">ETB {Number(purchase.costPerLiter).toFixed(2)}</Table.Td>
+                <Table.Td align="right">ETB {Number(purchase.totalCost).toLocaleString("en-US", { maximumFractionDigits: 2 })}</Table.Td>
+                <Table.Td>{purchase.fuelStation || "—"}</Table.Td>
+                <Table.Td>
+                  <Badge size="sm">{purchase.paymentMethod}</Badge>
+                </Table.Td>
+              </Table.Tr>
+            ))}
+          </Table.Tbody>
+        </Table>
+      </Card>
+
+      {/* Modal */}
+      <Modal opened={modalOpen} onClose={() => setModalOpen(false)} title="Record Fuel Purchase" size="lg">
+        <Stack gap="md">
+          <Select
+            label="Vehicle"
+            placeholder="Select vehicle"
+            data={vehicleOptions}
+            value={formData.vehicleId}
+            onChange={(val) => setFormData({ ...formData, vehicleId: val || "" })}
+            required
+          />
+
+          <TextInput
+            label="Purchase Date"
+            type="date"
+            value={formData.purchaseDate}
+            onChange={(e) => setFormData({ ...formData, purchaseDate: e.currentTarget.value })}
+            required
+          />
+
+          <NumberInput
+            label="Liters"
+            placeholder="0.00"
+            value={formData.liters}
+            onChange={(val) => setFormData({ ...formData, liters: val as number })}
+            decimalScale={2}
+            min={0}
+            required
+          />
+
+          <NumberInput
+            label="Cost per Liter"
+            placeholder="0.00"
+            value={formData.costPerLiter}
+            onChange={(val) => setFormData({ ...formData, costPerLiter: val as number })}
+            decimalScale={2}
+            min={0}
+            required
+          />
+
+          <Card withBorder bg="gray.0" padding="md">
+            <Text fw={600} size="lg">
+              Total Cost: ETB {totalCost.toFixed(2)}
+            </Text>
+          </Card>
+
+          <TextInput
+            label="Fuel Station"
+            placeholder="Station name"
+            value={formData.fuelStation}
+            onChange={(e) => setFormData({ ...formData, fuelStation: e.currentTarget.value })}
+          />
+
+          <Select
+            label="Payment Method"
+            data={["CASH", "CARD", "FUEL_CARD", "TRANSFER", "CHEQUE"]}
+            value={formData.paymentMethod}
+            onChange={(val) => setFormData({ ...formData, paymentMethod: val || "CASH" })}
+          />
+
+          <NumberInput
+            label="Odometer Reading (KM)"
+            placeholder="Optional"
+            value={formData.odometerReading}
+            onChange={(val) => setFormData({ ...formData, odometerReading: val as number | undefined })}
+            decimalScale={0}
+            min={0}
+          />
+
+          <TextInput
+            label="Receipt Number"
+            placeholder="Optional"
+            value={formData.receiptNumber}
+            onChange={(e) => setFormData({ ...formData, receiptNumber: e.currentTarget.value })}
+          />
+
+          <TextInput
+            label="Notes"
+            placeholder="Optional notes"
+            value={formData.notes}
+            onChange={(e) => setFormData({ ...formData, notes: e.currentTarget.value })}
+          />
+
+          <Group justify="flex-end">
+            <Button variant="light" onClick={() => setModalOpen(false)}>
+              Cancel
+            </Button>
+            <Button
+              onClick={() => recordMutation.mutate(formData)}
+              loading={recordMutation.isPending}
+              disabled={!formData.vehicleId || formData.liters <= 0 || formData.costPerLiter <= 0}
+            >
+              Record Purchase
+            </Button>
+          </Group>
+        </Stack>
+      </Modal>
+    </Container>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/fleet/FuelStatsPage.tsx b/apps/edr-freight-web/backoffice/src/pages/fleet/FuelStatsPage.tsx
new file mode 100644
index 000000000..04c872966
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/FuelStatsPage.tsx
@@ -0,0 +1,200 @@
+import { useQuery } from "@tanstack/react-query";
+import { Box, Card, Container, Grid, Group, Select, Stack, Table, Text, Title, Badge } from "@mantine/core";
+import Breadcrumbs from "@/components/ui/Breadcrumbs";
+import { api } from "@/auth/http";
+import { QUERY_KEYS } from "@/constants/QUERY_KEYS";
+import { vehiclesService, type Vehicle as VehicleType } from "@/services/vehicles.service";
+import { useState } from "react";
+
+interface FuelStats {
+  vehicleId: string;
+  totalPurchases: number;
+  totalLiters: number;
+  totalCost: number;
+  averagePricePerLiter: number;
+  dateRange: { startDate: string; endDate: string };
+}
+
+export default function FuelStatsPage() {
+  const [selectedVehicleId, setSelectedVehicleId] = useState<string>("");
+  const [monthsBack, setMonthsBack] = useState<string>("12");
+
+  // Fetch vehicles
+  const { data: vehiclesData } = useQuery({
+    queryKey: QUERY_KEYS.VEHICLES.list(),
+    queryFn: async () => {
+      const res = await vehiclesService.getAll({ limit: 1000 });
+      return res.data || [];
+    },
+  });
+
+  // Fetch fuel stats
+  const { data: statsData } = useQuery({
+    queryKey: ["fuel-stats", selectedVehicleId, monthsBack],
+    queryFn: async () => {
+      if (!selectedVehicleId) return null;
+      const res = await api.get(`/fuel/stats/${selectedVehicleId}?months=${monthsBack}`);
+      return res.data;
+    },
+    enabled: !!selectedVehicleId,
+  });
+
+  const vehicleOptions =
+    vehiclesData?.map((v: VehicleType) => ({
+      value: v.id,
+      label: `${v.plateNumber} - ${v.manufacturer} ${v.model}`,
+    })) || [];
+
+  const selectedVehicle = vehiclesData?.find((v: VehicleType) => v.id === selectedVehicleId);
+
+  const costPerKm =
+    statsData && selectedVehicle?.actualDistanceKm
+      ? (statsData.totalCost / selectedVehicle.actualDistanceKm).toFixed(2)
+      : "—";
+
+  const efficiency = statsData
+    ? (statsData.totalLiters > 0 ? (selectedVehicle?.actualDistanceKm || 0) / statsData.totalLiters : 0).toFixed(2)
+    : "—";
+
+  return (
+    <Container size="xl" py="xl" px="lg">
+      <Breadcrumbs items={[{ label: "Fleet" }, { label: "Fuel Management" }, { label: "Statistics" }]} />
+
+      <Group justify="space-between" mb="lg">
+        <Title order={1}>Fuel Consumption Analysis</Title>
+      </Group>
+
+      {/* Filters */}
+      <Card withBorder mb="lg" padding="md">
+        <Grid>
+          <Grid.Col span={{ base: 12, sm: 6 }}>
+            <Select
+              label="Vehicle"
+              placeholder="Select vehicle to analyze"
+              data={vehicleOptions}
+              value={selectedVehicleId}
+              onChange={(val) => setSelectedVehicleId(val || "")}
+              searchable
+            />
+          </Grid.Col>
+          <Grid.Col span={{ base: 12, sm: 6 }}>
+            <Select
+              label="Period"
+              data={[
+                { value: "3", label: "Last 3 months" },
+                { value: "6", label: "Last 6 months" },
+                { value: "12", label: "Last 12 months" },
+              ]}
+              value={monthsBack}
+              onChange={(val) => setMonthsBack(val || "12")}
+            />
+          </Grid.Col>
+        </Grid>
+      </Card>
+
+      {selectedVehicleId && statsData ? (
+        <>
+          {/* Stats Cards */}
+          <Grid mb="lg">
+            <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+              <Card withBorder padding="lg">
+                <Text size="sm" c="dimmed" fw={500}>
+                  Total Purchases
+                </Text>
+                <Text fw={700} size="lg">
+                  {statsData.totalPurchases}
+                </Text>
+              </Card>
+            </Grid.Col>
+            <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+              <Card withBorder padding="lg">
+                <Text size="sm" c="dimmed" fw={500}>
+                  Total Fuel
+                </Text>
+                <Text fw={700} size="lg">
+                  {statsData.totalLiters.toFixed(2)} L
+                </Text>
+              </Card>
+            </Grid.Col>
+            <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+              <Card withBorder padding="lg">
+                <Text size="sm" c="dimmed" fw={500}>
+                  Total Cost
+                </Text>
+                <Text fw={700} size="lg">
+                  ETB {statsData.totalCost.toLocaleString("en-US", { maximumFractionDigits: 2 })}
+                </Text>
+              </Card>
+            </Grid.Col>
+            <Grid.Col span={{ base: 12, sm: 6, md: 3 }}>
+              <Card withBorder padding="lg">
+                <Text size="sm" c="dimmed" fw={500}>
+                  Avg Price/L
+                </Text>
+                <Text fw={700} size="lg">
+                  ETB {statsData.averagePricePerLiter.toFixed(2)}
+                </Text>
+              </Card>
+            </Grid.Col>
+          </Grid>
+
+          {/* Efficiency Metrics */}
+          <Grid mb="lg">
+            <Grid.Col span={{ base: 12, sm: 6 }}>
+              <Card withBorder padding="lg">
+                <Text size="sm" c="dimmed" fw={500}>
+                  Fuel Efficiency
+                </Text>
+                <Text fw={700} size="lg">
+                  {efficiency} km/L
+                </Text>
+              </Card>
+            </Grid.Col>
+            <Grid.Col span={{ base: 12, sm: 6 }}>
+              <Card withBorder padding="lg">
+                <Text size="sm" c="dimmed" fw={500}>
+                  Cost per KM
+                </Text>
+                <Text fw={700} size="lg">
+                  ETB {costPerKm}
+                </Text>
+              </Card>
+            </Grid.Col>
+          </Grid>
+
+          {/* Summary */}
+          <Card withBorder padding="lg">
+            <Stack gap="md">
+              <div>
+                <Text fw={600} mb="xs">
+                  Summary
+                </Text>
+                <Text size="sm">
+                  {selectedVehicle?.plateNumber} consumed{" "}
+                  <Text fw={700} span>
+                    {statsData.totalLiters.toFixed(2)} liters
+                  </Text>{" "}
+                  over the last {monthsBack} months, costing{" "}
+                  <Text fw={700} span>
+                    ETB {statsData.totalCost.toLocaleString("en-US", { maximumFractionDigits: 2 })}
+                  </Text>
+                  . Average fuel price was{" "}
+                  <Text fw={700} span>
+                    ETB {statsData.averagePricePerLiter.toFixed(2)} per liter
+                  </Text>
+                  .
+                </Text>
+              </div>
+            </Stack>
+          </Card>
+        </>
+      ) : (
+        <Card withBorder padding="lg">
+          <Text c="dimmed" ta="center">
+            Select a vehicle to view fuel consumption statistics
+          </Text>
+        </Card>
+      )}
+    </Container>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/fleet/MaintenancePage.tsx b/apps/edr-freight-web/backoffice/src/pages/fleet/MaintenancePage.tsx
new file mode 100644
index 000000000..b2bd155d3
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/MaintenancePage.tsx
@@ -0,0 +1,206 @@
+import { useState, useMemo } from 'react';
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
+import { Card, Button, Modal, Stack, Group, Grid, Select, TextInput, NumberInput, Table, Badge, Text, Container } from '@mantine/core';
+import { DateInput } from '@mantine/dates';
+import { Plus } from 'lucide-react';
+import { QUERY_KEYS } from '@/constants/QUERY_KEYS';
+import { api } from '@/services/api';
+import { vehiclesService } from '@/services/vehicles.service';
+import { freightBrand } from '@/theme/freight-brand';
+
+interface MaintenanceSchedule {
+  id: string;
+  vehicleId: string;
+  maintenanceType: string;
+  description: string;
+  scheduledDate: string;
+  completedDate?: string;
+  status: string;
+  estimatedCost?: number;
+  actualCost?: number;
+  serviceProvider?: string;
+}
+
+export function MaintenancePage() {
+  const [selectedVehicle, setSelectedVehicle] = useState<string | null>(null);
+  const [openScheduleModal, setOpenScheduleModal] = useState(false);
+  const [formData, setFormData] = useState({
+    maintenanceType: 'PREVENTIVE',
+    description: '',
+    scheduledDate: new Date(),
+    estimatedCost: 0,
+    serviceProvider: '',
+    notes: '',
+  });
+
+  const queryClient = useQueryClient();
+
+  const { data: vehicles } = useQuery({
+    queryKey: QUERY_KEYS.VEHICLES.list(),
+    queryFn: async () => {
+      const res = await vehiclesService.getAll({ limit: 1000 });
+      return res.data || [];
+    },
+  });
+
+  const { data: upcoming, isLoading } = useQuery({
+    queryKey: QUERY_KEYS.MAINTENANCE.upcoming(selectedVehicle || ''),
+    queryFn: () => selectedVehicle ? api.get(`/maintenance/upcoming/${selectedVehicle}`) : Promise.resolve([]),
+    enabled: !!selectedVehicle,
+  });
+
+  const scheduleMutation = useMutation({
+    mutationFn: async () => {
+      if (!selectedVehicle) return;
+      return api.post('/maintenance/schedules', {
+        vehicleId: selectedVehicle,
+        ...formData,
+      });
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: QUERY_KEYS.MAINTENANCE.upcoming(selectedVehicle || '') });
+      setOpenScheduleModal(false);
+      setFormData({
+        maintenanceType: 'PREVENTIVE',
+        description: '',
+        scheduledDate: new Date(),
+        estimatedCost: 0,
+        serviceProvider: '',
+        notes: '',
+      });
+    },
+  });
+
+  const vehicleOptions = useMemo(
+    () => vehicles?.map(v => ({ label: v.registrationNumber || v.id, value: v.id })) || [],
+    [vehicles]
+  );
+
+  const statusColor = (status: string) => {
+    const colors: Record<string, string> = {
+      SCHEDULED: 'edr-blue',
+      IN_PROGRESS: 'edr-amber-soft',
+      COMPLETED: 'edr-green',
+      OVERDUE: 'edr-red',
+    };
+    return colors[status] || 'edr-slate';
+  };
+
+  return (
+    <Container size="xl" py="xl" px="lg">
+      <Stack gap="md">
+      <Card>
+        <Card.Section p="md" withBorder>
+          <Group justify="space-between">
+            <Text fw={500}>Schedule Maintenance</Text>
+            <Button onClick={() => setOpenScheduleModal(true)} color="edr-green" leftSection={<Plus size={16} />}>
+              New Schedule
+            </Button>
+          </Group>
+        </Card.Section>
+        <Card.Section p="md">
+          <Select
+            label="Select Vehicle"
+            placeholder="Pick a vehicle"
+            data={vehicleOptions}
+            value={selectedVehicle}
+            onChange={setSelectedVehicle}
+          />
+        </Card.Section>
+      </Card>
+
+      {selectedVehicle && (
+        <Card>
+          <Card.Section p="md" withBorder>
+            <Text fw={500}>Upcoming Maintenance</Text>
+          </Card.Section>
+          <Card.Section p="md">
+            {isLoading ? (
+              <Text>Loading...</Text>
+            ) : (upcoming || []).length > 0 ? (
+              <Table>
+                <Table.Thead>
+                  <Table.Tr>
+                    <Table.Th>Type</Table.Th>
+                    <Table.Th>Description</Table.Th>
+                    <Table.Th>Scheduled</Table.Th>
+                    <Table.Th>Est. Cost</Table.Th>
+                    <Table.Th>Status</Table.Th>
+                  </Table.Tr>
+                </Table.Thead>
+                <Table.Tbody>
+                  {(upcoming as MaintenanceSchedule[]).map(m => (
+                    <Table.Tr key={m.id}>
+                      <Table.Td>{m.maintenanceType}</Table.Td>
+                      <Table.Td>{m.description}</Table.Td>
+                      <Table.Td>{new Date(m.scheduledDate).toLocaleDateString()}</Table.Td>
+                      <Table.Td>${m.estimatedCost?.toFixed(2) || '—'}</Table.Td>
+                      <Table.Td>
+                        <Badge color={statusColor(m.status)}>{m.status}</Badge>
+                      </Table.Td>
+                    </Table.Tr>
+                  ))}
+                </Table.Tbody>
+              </Table>
+            ) : (
+              <Text c="dimmed">No upcoming maintenance</Text>
+            )}
+          </Card.Section>
+        </Card>
+      )}
+
+      <Modal
+        opened={openScheduleModal}
+        onClose={() => setOpenScheduleModal(false)}
+        title="Schedule Maintenance"
+        size="md"
+      >
+        <Stack gap="md">
+          <Select
+            label="Type"
+            data={['PREVENTIVE', 'CORRECTIVE', 'INSPECTION', 'REPAIR']}
+            value={formData.maintenanceType}
+            onChange={v => setFormData({ ...formData, maintenanceType: v || 'PREVENTIVE' })}
+          />
+          <TextInput
+            label="Description"
+            placeholder="What needs to be done?"
+            value={formData.description}
+            onChange={e => setFormData({ ...formData, description: e.currentTarget.value })}
+          />
+          <DateInput
+            label="Scheduled Date"
+            value={formData.scheduledDate}
+            onChange={d => setFormData({ ...formData, scheduledDate: d || new Date() })}
+          />
+          <NumberInput
+            label="Estimated Cost"
+            value={formData.estimatedCost}
+            onChange={v => setFormData({ ...formData, estimatedCost: Number(v) })}
+          />
+          <TextInput
+            label="Service Provider"
+            placeholder="e.g., John's Auto Repair"
+            value={formData.serviceProvider}
+            onChange={e => setFormData({ ...formData, serviceProvider: e.currentTarget.value })}
+          />
+          <TextInput
+            label="Notes"
+            placeholder="Additional notes"
+            value={formData.notes}
+            onChange={e => setFormData({ ...formData, notes: e.currentTarget.value })}
+          />
+          <Group justify="flex-end">
+            <Button variant="light" onClick={() => setOpenScheduleModal(false)}>
+              Cancel
+            </Button>
+            <Button onClick={() => scheduleMutation.mutate()} loading={scheduleMutation.isPending}>
+              Schedule
+            </Button>
+          </Group>
+        </Stack>
+      </Modal>
+      </Stack>
+    </Container>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/fleet/RoutesPage.tsx b/apps/edr-freight-web/backoffice/src/pages/fleet/RoutesPage.tsx
index 30acf50ba..a40579027 100644
--- a/apps/edr-freight-web/backoffice/src/pages/fleet/RoutesPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/RoutesPage.tsx
@@ -1,5 +1,14 @@
 import { FormEvent, useMemo, useState } from "react";
-import { Ban, CircleCheck, Edit, Eye, Plus, Route as RouteIcon, Trash2 } from "lucide-react";
+import {
+  ArrowRight,
+  Ban,
+  CircleCheck,
+  Edit,
+  Eye,
+  Plus,
+  Route as RouteIcon,
+  Trash2,
+} from "lucide-react";
 import type { ColumnDef } from "@edr/ui-common";
 import {
   ActionIcon,
@@ -7,13 +16,16 @@ import {
   Box,
   Button,
   Card,
+  Divider,
   Group,
   Modal,
+  NumberInput,
   Select,
   SimpleGrid,
   Stack,
   Text,
   TextInput,
+  ThemeIcon,
   Tooltip,
 } from "@mantine/core";
 
@@ -26,22 +38,51 @@ import RuleEngineListFooter from "@/components/ruleEngine/RuleEngineListFooter";
 import { ruleEngineTable } from "@/components/ruleEngine/ruleEngineStyles";
 import { api } from "@/services/api";
 import { useToast } from "@/hooks/use-toast";
-import type { RouteRecord, YardRef } from "@/services/routes.service";
+import {
+  formatRouteLabel,
+  ROUTE_STATUS_OPTIONS,
+  totalRouteDistanceKm,
+  type RouteRecord,
+  type RouteStatus,
+  type YardRef,
+} from "@/services/routes.service";
 import { DataTable, DataTableFooter, usePagination } from "@edr/ui-common";
 
+type MilestoneFormRow = { yardId: string; distanceKm: string };
+
 type RouteFormState = {
-  name: string;
-  milestones: string[];
+  status: RouteStatus;
+  milestones: MilestoneFormRow[];
 };
 
-const emptyForm = (): RouteFormState => ({ name: "", milestones: ["", ""] });
+const emptyForm = (): RouteFormState => ({
+  status: "AVAILABLE",
+  milestones: [
+    { yardId: "", distanceKm: "0" },
+    { yardId: "", distanceKm: "" },
+  ],
+});
 
-const yardLabel = (yard?: YardRef | null) => (yard ? `${yard.label} (${yard.code})` : "—");
+const yardLabel = (yard?: YardRef | null) =>
+  yard ? `${yard.label} (${yard.code})` : "—";
 
-const routeStops = (route: RouteRecord) =>
-  (route.milestones ?? [])
-    .sort((left, right) => left.sequenceNo - right.sequenceNo)
-    .map((milestone) => milestone.yard?.label ?? milestone.yard?.code ?? milestone.yardId);
+const statusColor = (status: RouteStatus) => {
+  switch (status) {
+    case "AVAILABLE":
+      return "edr-green";
+    case "MAINTENANCE":
+      return "yellow";
+    case "DAMAGED":
+      return "red";
+    case "STOP_WORKING":
+      return "gray";
+    default:
+      return "gray";
+  }
+};
+
+const statusLabel = (status: RouteStatus) =>
+  ROUTE_STATUS_OPTIONS.find((o) => o.value === status)?.label ?? status;
 
 const normalizeRouteError = (error: unknown) => {
   const responseData = (error as { response?: { data?: unknown } })?.response?.data;
@@ -57,6 +98,60 @@ const normalizeRouteError = (error: unknown) => {
       : "Save failed";
 };
 
+function RouteTimeline({ route }: { route: RouteRecord }) {
+  const stops = [...(route.milestones ?? [])].sort(
+    (a, b) => a.sequenceNo - b.sequenceNo,
+  );
+  const total = totalRouteDistanceKm(route);
+
+  return (
+    <Stack gap="sm">
+      {stops.map((milestone, index) => {
+        const label =
+          milestone.yard?.label ?? milestone.yard?.code ?? milestone.yardId;
+        const role =
+          index === 0
+            ? "Origin"
+            : index === stops.length - 1
+              ? "Destination"
+              : `Milestone ${index}`;
+        const km = Number(milestone.distanceKm ?? 0);
+        return (
+          <Box key={milestone.id ?? `${milestone.yardId}-${index}`}>
+            {index > 0 && (
+              <Group gap={8} pl={18} py={6}>
+                <ThemeIcon size={22} radius="xl" variant="light" color="gray">
+                  <ArrowRight size={12} />
+                </ThemeIcon>
+                <Text size="xs" c="dimmed" fw={600}>
+                  {km} km
+                </Text>
+              </Group>
+            )}
+            <Group gap="sm" wrap="nowrap">
+              <Badge size="sm" variant="light" color={index === 0 ? "teal" : "gray"}>
+                {role}
+              </Badge>
+              <Text size="sm" fw={500}>
+                {label}
+              </Text>
+            </Group>
+          </Box>
+        );
+      })}
+      <Divider />
+      <Group justify="space-between">
+        <Text size="sm" fw={600}>
+          Total distance
+        </Text>
+        <Text size="sm" fw={700}>
+          {total} km
+        </Text>
+      </Group>
+    </Stack>
+  );
+}
+
 export default function RoutesPage() {
   const [search, setSearch] = useState("");
   const [formOpen, setFormOpen] = useState(false);
@@ -78,12 +173,14 @@ export default function RoutesPage() {
     if (!query) return routesQuery.data ?? [];
     return (routesQuery.data ?? []).filter((route) => {
       const searchable = [
-        route.name,
+        formatRouteLabel(route),
         route.originYard?.label,
         route.originYard?.code,
         route.destinationYard?.label,
         route.destinationYard?.code,
-        ...routeStops(route),
+        ...(route.milestones ?? []).map(
+          (m) => m.yard?.label ?? m.yard?.code ?? m.yardId,
+        ),
       ]
         .filter(Boolean)
         .join(" ")
@@ -99,7 +196,7 @@ export default function RoutesPage() {
   }, [filteredRoutes, pagination.pageIndex, pagination.pageSize]);
 
   const allRoutes = routesQuery.data ?? [];
-  const activeCount = allRoutes.filter((route) => route.isActive).length;
+  const availableCount = allRoutes.filter((r) => r.status === "AVAILABLE").length;
 
   const yardOptions = useMemo(
     () =>
@@ -110,6 +207,16 @@ export default function RoutesPage() {
     [yardsQuery.data],
   );
 
+  const formTotalKm = useMemo(
+    () =>
+      form.milestones.reduce(
+        (sum, row, index) =>
+          index === 0 ? sum : sum + Number(row.distanceKm || 0),
+        0,
+      ),
+    [form.milestones],
+  );
+
   const resetForm = () => {
     setFormOpen(false);
     setEditing(null);
@@ -125,41 +232,52 @@ export default function RoutesPage() {
   const openEdit = (route: RouteRecord) => {
     setEditing(route);
     setForm({
-      name: route.name,
-      milestones: (route.milestones ?? [])
-        .sort((left, right) => left.sequenceNo - right.sequenceNo)
-        .map((milestone) => milestone.yardId),
+      status: route.status,
+      milestones: [...(route.milestones ?? [])]
+        .sort((a, b) => a.sequenceNo - b.sequenceNo)
+        .map((m, index) => ({
+          yardId: m.yardId,
+          distanceKm: String(index === 0 ? 0 : (m.distanceKm ?? "")),
+        })),
     });
     setFormOpen(true);
   };
 
-  const setMilestone = (index: number, yardId: string) => {
+  const setMilestone = (index: number, patch: Partial<MilestoneFormRow>) => {
     setForm((current) => ({
       ...current,
-      milestones: current.milestones.map((value, currentIndex) =>
-        currentIndex === index ? yardId : value,
+      milestones: current.milestones.map((row, i) =>
+        i === index ? { ...row, ...patch } : row,
       ),
     }));
   };
 
   const addMilestone = () => {
-    setForm((current) => ({ ...current, milestones: [...current.milestones, ""] }));
+    setForm((current) => ({
+      ...current,
+      milestones: [...current.milestones, { yardId: "", distanceKm: "" }],
+    }));
   };
 
   const removeMilestone = (index: number) => {
     setForm((current) => ({
       ...current,
-      milestones: current.milestones.filter((_, currentIndex) => currentIndex !== index),
+      milestones: current.milestones.filter((_, i) => i !== index),
     }));
   };
 
+  const buildPayload = () => ({
+    status: form.status,
+    milestones: form.milestones.map((row, index) => ({
+      yardId: row.yardId,
+      distanceKm:
+        index === 0 ? 0 : row.distanceKm ? Number(row.distanceKm) : undefined,
+    })),
+  });
+
   const handleSubmit = async (event: FormEvent) => {
     event.preventDefault();
-    if (!form.name.trim()) {
-      toast({ title: "Save failed", description: "Route name is required", variant: "destructive" });
-      return;
-    }
-    if (form.milestones.length < 2 || form.milestones.some((yardId) => !yardId)) {
+    if (form.milestones.length < 2 || form.milestones.some((row) => !row.yardId)) {
       toast({
         title: "Save failed",
         description: "Select at least an origin and destination yard",
@@ -167,13 +285,20 @@ export default function RoutesPage() {
       });
       return;
     }
+    for (let i = 1; i < form.milestones.length; i++) {
+      const km = Number(form.milestones[i].distanceKm);
+      if (!form.milestones[i].distanceKm || Number.isNaN(km) || km < 0) {
+        toast({
+          title: "Save failed",
+          description: `Enter segment KM for stop ${i + 1}`,
+          variant: "destructive",
+        });
+        return;
+      }
+    }
 
     try {
-      const payload = {
-        name: form.name.trim(),
-        milestones: form.milestones.map((yardId) => ({ yardId })),
-        isActive: editing?.isActive ?? true,
-      };
+      const payload = buildPayload();
       if (editing) {
         await updateMutation.mutateAsync({ id: editing.id, data: payload });
         toast({ title: "Route updated" });
@@ -190,9 +315,19 @@ export default function RoutesPage() {
   const handleDeactivate = async (route: RouteRecord) => {
     try {
       await deactivateMutation.mutateAsync(route.id);
-      toast({ title: "Route deactivated" });
+      toast({ title: "Route marked stop working" });
     } catch {
-      toast({ title: "Deactivate failed", description: "Could not deactivate route", variant: "destructive" });
+      toast({ title: "Update failed", description: "Could not update route status", variant: "destructive" });
+    }
+  };
+
+  const handleStatusChange = async (route: RouteRecord, status: RouteStatus) => {
+    try {
+      await updateMutation.mutateAsync({ id: route.id, data: { status } });
+      setViewing((current) => (current?.id === route.id ? { ...current, status } : current));
+      toast({ title: "Status updated" });
+    } catch (error) {
+      toast({ title: "Update failed", description: normalizeRouteError(error), variant: "destructive" });
     }
   };
 
@@ -200,10 +335,14 @@ export default function RoutesPage() {
 
   const availableOptionsForIndex = (index: number) => {
     const selectedByOthers = new Set(
-      form.milestones.filter((value, currentIndex) => currentIndex !== index && value),
+      form.milestones
+        .filter((row, i) => i !== index && row.yardId)
+        .map((row) => row.yardId),
     );
     return yardOptions.filter(
-      (option) => option.value === form.milestones[index] || !selectedByOthers.has(option.value),
+      (option) =>
+        option.value === form.milestones[index]?.yardId ||
+        !selectedByOthers.has(option.value),
     );
   };
 
@@ -217,7 +356,16 @@ export default function RoutesPage() {
     const headerClassName = ruleEngineTable.headerCell;
     const cellClassName = ruleEngineTable.bodyCell;
     return [
-      { id: "name", header: "Name", meta: { headerClassName, cellClassName }, cell: ({ row }) => row.original.name },
+      {
+        id: "corridor",
+        header: "Corridor",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => (
+          <Text fw={600} size="sm">
+            {formatRouteLabel(row.original)}
+          </Text>
+        ),
+      },
       {
         id: "origin",
         header: "Origin",
@@ -231,18 +379,24 @@ export default function RoutesPage() {
         cell: ({ row }) => yardLabel(row.original.destinationYard),
       },
       {
-        id: "milestones",
-        header: "Milestones",
+        id: "distance",
+        header: "Total KM",
         meta: { headerClassName, cellClassName },
-        cell: ({ row }) => Math.max((row.original.milestones?.length ?? 0) - 2, 0),
+        cell: ({ row }) => `${totalRouteDistanceKm(row.original)} km`,
+      },
+      {
+        id: "milestones",
+        header: "Stops",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => row.original.milestones?.length ?? 0,
       },
       {
         id: "status",
         header: "Status",
         meta: { headerClassName, cellClassName },
         cell: ({ row }) => (
-          <Badge color={row.original.isActive ? "edr-green" : "gray"} variant="light" size="sm">
-            {row.original.isActive ? "Active" : "Inactive"}
+          <Badge color={statusColor(row.original.status)} variant="light" size="sm">
+            {statusLabel(row.original.status)}
           </Badge>
         ),
       },
@@ -262,11 +416,11 @@ export default function RoutesPage() {
                 <Edit size={16} />
               </ActionIcon>
             </Tooltip>
-            <Tooltip label="Deactivate">
+            <Tooltip label="Mark stop working">
               <ActionIcon
                 variant="subtle"
                 color="red"
-                disabled={!row.original.isActive || deactivateMutation.isPending}
+                disabled={row.original.status === "STOP_WORKING" || deactivateMutation.isPending}
                 onClick={() => handleDeactivate(row.original)}
               >
                 <Trash2 size={16} />
@@ -282,7 +436,7 @@ export default function RoutesPage() {
     <PageContainer>
       <PageHeader
         title="Routes"
-        subtitle="Define rail corridors and their ordered yard stops used by train scheduling."
+        subtitle="Define rail corridors, segment distances, and operational status for train scheduling."
         action={
           <Button leftSection={<Plus size={18} />} onClick={openCreate}>
             Add route
@@ -294,10 +448,10 @@ export default function RoutesPage() {
         loading={routesQuery.isLoading}
         items={[
           { label: "Total routes", value: allRoutes.length, icon: RouteIcon },
-          { label: "Active", value: activeCount, icon: CircleCheck, color: "edr-green" },
+          { label: "Available", value: availableCount, icon: CircleCheck, color: "edr-green" },
           {
-            label: "Inactive",
-            value: allRoutes.length - activeCount,
+            label: "Unavailable",
+            value: allRoutes.length - availableCount,
             icon: Ban,
             color: "gray",
           },
@@ -310,7 +464,7 @@ export default function RoutesPage() {
             <FleetToolbar
               search={search}
               onSearchChange={setSearch}
-              searchPlaceholder="Search routes…"
+              searchPlaceholder="Search corridors…"
               viewMode={viewMode}
               onViewModeChange={setViewMode}
             />
@@ -359,16 +513,13 @@ export default function RoutesPage() {
                     <Card key={route.id} radius="lg" padding="lg" withBorder>
                       <Stack gap="sm">
                         <Group justify="space-between">
-                          <Text fw={600}>{route.name}</Text>
-                          <Badge color={route.isActive ? "edr-green" : "gray"} variant="light" size="sm">
-                            {route.isActive ? "Active" : "Inactive"}
+                          <Text fw={600}>{formatRouteLabel(route)}</Text>
+                          <Badge color={statusColor(route.status)} variant="light" size="sm">
+                            {statusLabel(route.status)}
                           </Badge>
                         </Group>
                         <Text size="sm" c="dimmed">
-                          {yardLabel(route.originYard)} → {yardLabel(route.destinationYard)}
-                        </Text>
-                        <Text size="xs" c="dimmed">
-                          {Math.max((route.milestones?.length ?? 0) - 2, 0)} intermediate milestones
+                          {totalRouteDistanceKm(route)} km · {route.milestones?.length ?? 0} stops
                         </Text>
                         <Group gap={6} justify="flex-end">
                           <Button variant="light" size="compact-sm" onClick={() => setViewing(route)}>
@@ -405,26 +556,25 @@ export default function RoutesPage() {
       >
         <form onSubmit={handleSubmit}>
           <Stack gap="md">
-            <TextInput
-              label="Name"
-              value={form.name}
-              onChange={(e) => {
-                // Capture the value before the state updater runs — React may
-                // recycle the synthetic event, nulling currentTarget by the time
-                // the updater executes ("Cannot read properties of null").
-                const name = e.currentTarget.value;
-                setForm((current) => ({ ...current, name }));
-              }}
-            />
+            {editing && (
+              <Select
+                label="Status"
+                data={ROUTE_STATUS_OPTIONS}
+                value={form.status}
+                onChange={(value) =>
+                  value && setForm((current) => ({ ...current, status: value as RouteStatus }))
+                }
+              />
+            )}
             <Group justify="space-between">
               <Text size="sm" fw={500}>
-                Stops
+                Stops & segment distances
               </Text>
               <Button type="button" variant="light" size="compact-sm" onClick={addMilestone}>
                 Add milestone
               </Button>
             </Group>
-            {form.milestones.map((yardId, index) => {
+            {form.milestones.map((row, index) => {
               const role =
                 index === 0
                   ? "Origin"
@@ -432,18 +582,32 @@ export default function RoutesPage() {
                     ? "Destination"
                     : "Milestone";
               return (
-                <Group key={`${role}-${index}`} align="flex-end" wrap="nowrap">
-                  <Text w={100} size="sm" fw={500}>
+                <Group key={`${role}-${index}`} align="flex-end" wrap="nowrap" gap="sm">
+                  <Text w={90} size="sm" fw={500}>
                     {role}
                   </Text>
                   <Select
                     style={{ flex: 1 }}
                     data={availableOptionsForIndex(index)}
-                    value={yardId || null}
-                    onChange={(value) => value && setMilestone(index, value)}
+                    value={row.yardId || null}
+                    onChange={(value) => value && setMilestone(index, { yardId: value })}
                     placeholder="Select yard"
                     searchable
                   />
+                  {index > 0 ? (
+                    <NumberInput
+                      w={120}
+                      label="KM"
+                      min={0}
+                      decimalScale={2}
+                      value={row.distanceKm ? Number(row.distanceKm) : ""}
+                      onChange={(value) =>
+                        setMilestone(index, { distanceKm: String(value ?? "") })
+                      }
+                    />
+                  ) : (
+                    <Box w={120} />
+                  )}
                   <ActionIcon
                     variant="subtle"
                     color="red"
@@ -455,6 +619,9 @@ export default function RoutesPage() {
                 </Group>
               );
             })}
+            <Text size="sm" c="dimmed">
+              Total route distance: <strong>{formTotalKm} km</strong>
+            </Text>
             <Group justify="flex-end">
               <Button variant="default" type="button" onClick={resetForm}>
                 Cancel
@@ -470,44 +637,37 @@ export default function RoutesPage() {
       <Modal
         opened={Boolean(viewing)}
         onClose={() => setViewing(null)}
-        title={<Text fw={600}>Route details</Text>}
+        title={<Text fw={600}>{viewing ? formatRouteLabel(viewing) : "Route details"}</Text>}
         radius="lg"
         centered
+        size="md"
       >
         {viewing ? (
-          <Stack gap="sm">
+          <Stack gap="md">
+            <Group justify="space-between" align="flex-end">
+              <div>
+                <Text size="sm" fw={500}>
+                  Status
+                </Text>
+                <Badge mt={4} color={statusColor(viewing.status)} variant="light">
+                  {statusLabel(viewing.status)}
+                </Badge>
+              </div>
+              <Select
+                w={200}
+                label="Update status"
+                data={ROUTE_STATUS_OPTIONS}
+                value={viewing.status}
+                onChange={(value) =>
+                  value && handleStatusChange(viewing, value as RouteStatus)
+                }
+              />
+            </Group>
             <div>
-              <Text size="sm" fw={500}>
-                Name
+              <Text size="sm" fw={500} mb={8}>
+                Road timeline
               </Text>
-              <Text size="sm" c="dimmed">
-                {viewing.name}
-              </Text>
-            </div>
-            <div>
-              <Text size="sm" fw={500}>
-                Status
-              </Text>
-              <Text size="sm" c="dimmed">
-                {viewing.isActive ? "Active" : "Inactive"}
-              </Text>
-            </div>
-            <div>
-              <Text size="sm" fw={500}>
-                Stops
-              </Text>
-              <Stack gap={6} mt={6}>
-                {routeStops(viewing).map((stop, index, stops) => (
-                  <Text key={`${stop}-${index}`} size="sm" c="dimmed">
-                    {index === 0
-                      ? "Origin"
-                      : index === stops.length - 1
-                        ? "Destination"
-                        : `Milestone ${index}`}
-                    : {stop}
-                  </Text>
-                ))}
-              </Stack>
+              <RouteTimeline route={viewing} />
             </div>
           </Stack>
         ) : null}
diff --git a/apps/edr-freight-web/backoffice/src/pages/fleet/TrackingPage.tsx b/apps/edr-freight-web/backoffice/src/pages/fleet/TrackingPage.tsx
new file mode 100644
index 000000000..8230a7446
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/TrackingPage.tsx
@@ -0,0 +1,359 @@
+import { useState, useMemo } from 'react';
+import { useQuery } from '@tanstack/react-query';
+import { Container, Grid, Card, Stack, Group, Select, Text, Badge, Button, Box, Table, ThemeIcon, SimpleGrid } from '@mantine/core';
+import { MapPin, Navigation, Radio, Activity } from 'lucide-react';
+import Breadcrumbs from '@/components/ui/Breadcrumbs';
+import { QUERY_KEYS } from '@/constants/QUERY_KEYS';
+import { vehiclesService } from '@/services/vehicles.service';
+import { freightBrand } from '@/theme/freight-brand';
+
+interface Vehicle {
+  id: string;
+  registrationNumber: string;
+  plateNumber: string;
+  manufacturer: string;
+  model: string;
+  status?: string;
+}
+
+interface GPSLocation {
+  lat: number;
+  lng: number;
+  speed?: number;
+  heading?: number;
+  lastUpdate?: string;
+}
+
+// Mock GPS data for demo
+const generateMockGPS = (index: number): GPSLocation => ({
+  lat: 9.0 + Math.random() * 0.5,
+  lng: 38.7 + Math.random() * 0.5,
+  speed: Math.floor(Math.random() * 120),
+  heading: Math.floor(Math.random() * 360),
+  lastUpdate: new Date(Date.now() - Math.random() * 300000).toLocaleTimeString(),
+});
+
+export function TrackingPage() {
+  const [selectedVehicleId, setSelectedVehicleId] = useState<string | null>(null);
+  const [mapCenter] = useState({ lat: 9.0, lng: 38.8 });
+  const mapZoom = 10;
+
+  const { data: vehicles = [] } = useQuery({
+    queryKey: QUERY_KEYS.VEHICLES.list(),
+    queryFn: async () => {
+      const res = await vehiclesService.getAll({ limit: 1000 });
+      return res.data || [];
+    },
+  });
+
+  // Generate mock GPS data for each vehicle
+  const vehiclesWithGPS = useMemo(() => {
+    return (vehicles as Vehicle[]).map((v, idx) => ({
+      ...v,
+      gps: generateMockGPS(idx),
+    }));
+  }, [vehicles]);
+
+  // For demo: show all vehicles as trackable (or filter by ACTIVE if status data available)
+  const trackableVehicles = useMemo(
+    () => vehiclesWithGPS.slice(0, 10), // Limit to first 10 for demo
+    [vehiclesWithGPS]
+  );
+
+  const selectedVehicle = trackableVehicles.find(v => v.id === selectedVehicleId);
+  const vehicleOptions = useMemo(
+    () => trackableVehicles.map(v => ({ label: v.registrationNumber, value: v.id })),
+    [trackableVehicles]
+  );
+
+  // Map dimensions
+  const mapWidth = 800;
+  const mapHeight = 500;
+  const pixelsPerLat = mapHeight / 0.6;
+  const pixelsPerLng = mapWidth / 0.6;
+
+  const getMapCoords = (lat: number, lng: number) => ({
+    x: ((lng - (mapCenter.lng - 0.3)) * pixelsPerLng),
+    y: ((mapCenter.lat + 0.3 - lat) * pixelsPerLat),
+  });
+
+  return (
+    <Container size="xl" py="xl" px="lg">
+      <Breadcrumbs items={[{ label: 'Fleet' }, { label: 'Vehicle Tracking' }]} />
+
+      <Stack gap="xl">
+        <Group justify="space-between">
+          <div>
+            <Text fw={700} size="xl">
+              Real-Time Vehicle Tracking
+            </Text>
+            <Text c="dimmed" size="sm">
+              Monitor vehicle locations, speed, and status
+            </Text>
+          </div>
+        </Group>
+
+        <Grid>
+          {/* Map Section */}
+          <Grid.Col span={{ base: 12, lg: 8 }}>
+            <Card withBorder p="lg">
+              <Card.Section p="md" withBorder>
+                <Group justify="space-between">
+                  <Text fw={500}>Map View</Text>
+                  <Group gap="xs">
+                    <Badge color="edr-green" leftSection={<Radio size={12} />}>
+                      {trackableVehicles.length} Tracked
+                    </Badge>
+                  </Group>
+                </Group>
+              </Card.Section>
+
+              <Card.Section p="md">
+                <Box
+                  pos="relative"
+                  style={{
+                    width: mapWidth,
+                    height: mapHeight,
+                    backgroundColor: '#f0f8f7',
+                    border: `2px solid ${freightBrand.primary}`,
+                    borderRadius: '8px',
+                    overflow: 'hidden',
+                  }}
+                >
+                  {/* Grid background */}
+                  <svg
+                    width={mapWidth}
+                    height={mapHeight}
+                    style={{ position: 'absolute', top: 0, left: 0 }}
+                  >
+                    {/* Latitude lines */}
+                    {[0, 1, 2, 3, 4, 5, 6].map(i => (
+                      <line
+                        key={`lat-${i}`}
+                        x1={0}
+                        y1={(i / 6) * mapHeight}
+                        x2={mapWidth}
+                        y2={(i / 6) * mapHeight}
+                        stroke="#e0e0e0"
+                        strokeWidth={1}
+                      />
+                    ))}
+                    {/* Longitude lines */}
+                    {[0, 1, 2, 3, 4, 5, 6].map(i => (
+                      <line
+                        key={`lng-${i}`}
+                        x1={(i / 6) * mapWidth}
+                        y1={0}
+                        x2={(i / 6) * mapWidth}
+                        y2={mapHeight}
+                        stroke="#e0e0e0"
+                        strokeWidth={1}
+                      />
+                    ))}
+                  </svg>
+
+                  {/* Vehicle markers */}
+                  {trackableVehicles.map((vehicle) => {
+                    const coords = getMapCoords(vehicle.gps.lat, vehicle.gps.lng);
+                    const isSelected = vehicle.id === selectedVehicleId;
+
+                    return (
+                      <Box
+                        key={vehicle.id}
+                        pos="absolute"
+                        style={{
+                          left: coords.x - 15,
+                          top: coords.y - 15,
+                          width: 30,
+                          height: 30,
+                          cursor: 'pointer',
+                          zIndex: isSelected ? 100 : 10,
+                        }}
+                        onClick={() => setSelectedVehicleId(vehicle.id)}
+                        title={vehicle.registrationNumber}
+                      >
+                        <Box
+                          pos="absolute"
+                          inset={0}
+                          style={{
+                            backgroundColor: isSelected ? freightBrand.primary : '#3498db',
+                            borderRadius: '50%',
+                            border: isSelected ? `3px solid ${freightBrand.primaryDark}` : 'none',
+                            display: 'flex',
+                            alignItems: 'center',
+                            justifyContent: 'center',
+                            color: 'white',
+                            fontSize: '16px',
+                            boxShadow: isSelected ? `0 0 0 8px ${freightBrand.ring}` : 'none',
+                          }}
+                        >
+                          <Navigation size={16} />
+                        </Box>
+                      </Box>
+                    );
+                  })}
+
+                  {/* Map labels */}
+                  <Box pos="absolute" bottom={8} left={8} style={{ zIndex: 50 }}>
+                    <Text size="xs" c="dimmed">
+                      📍 Addis Ababa, Ethiopia
+                    </Text>
+                  </Box>
+                </Box>
+              </Card.Section>
+            </Card>
+          </Grid.Col>
+
+          {/* Sidebar */}
+          <Grid.Col span={{ base: 12, lg: 4 }}>
+            <Stack gap="md">
+              {/* Vehicle Selector */}
+              <Card withBorder p="lg">
+                <Stack gap="md">
+                  <Select
+                    label="Track Vehicle"
+                    placeholder="Select a vehicle to track"
+                    data={vehicleOptions}
+                    value={selectedVehicleId}
+                    onChange={setSelectedVehicleId}
+                    searchable
+                  />
+                  {selectedVehicle && (
+                    <Box p="md" style={{ backgroundColor: freightBrand.mutedBg, borderRadius: '8px' }}>
+                      <Stack gap="sm">
+                        <div>
+                          <Text size="sm" c="dimmed">
+                            Registration
+                          </Text>
+                          <Text fw={600}>{selectedVehicle.registrationNumber}</Text>
+                        </div>
+                        <div>
+                          <Text size="sm" c="dimmed">
+                            Vehicle
+                          </Text>
+                          <Text fw={600}>
+                            {selectedVehicle.manufacturer} {selectedVehicle.model}
+                          </Text>
+                        </div>
+                        <div>
+                          <Text size="sm" c="dimmed">
+                            Status
+                          </Text>
+                          <Badge color={selectedVehicle.status === 'ACTIVE' ? 'edr-green' : 'gray'}>
+                            {selectedVehicle.status || 'Unknown'}
+                          </Badge>
+                        </div>
+                      </Stack>
+                    </Box>
+                  )}
+                </Stack>
+              </Card>
+
+              {/* GPS Details */}
+              {selectedVehicle && (
+                <Card withBorder p="lg">
+                  <Stack gap="md">
+                    <Group justify="space-between">
+                      <Text fw={500}>GPS Location</Text>
+                      <Badge color="edr-green" leftSection={<Activity size={12} />}>
+                        Live
+                      </Badge>
+                    </Group>
+
+                    <SimpleGrid cols={2} spacing="sm">
+                      <Box p="sm" style={{ backgroundColor: '#f8f9fa', borderRadius: '8px' }}>
+                        <Text size="xs" c="dimmed">
+                          Latitude
+                        </Text>
+                        <Text fw={600} size="sm">
+                          {selectedVehicle.gps.lat.toFixed(4)}°
+                        </Text>
+                      </Box>
+                      <Box p="sm" style={{ backgroundColor: '#f8f9fa', borderRadius: '8px' }}>
+                        <Text size="xs" c="dimmed">
+                          Longitude
+                        </Text>
+                        <Text fw={600} size="sm">
+                          {selectedVehicle.gps.lng.toFixed(4)}°
+                        </Text>
+                      </Box>
+                      <Box p="sm" style={{ backgroundColor: '#f8f9fa', borderRadius: '8px' }}>
+                        <Text size="xs" c="dimmed">
+                          Speed
+                        </Text>
+                        <Text fw={600} size="sm">
+                          {selectedVehicle.gps.speed} km/h
+                        </Text>
+                      </Box>
+                      <Box p="sm" style={{ backgroundColor: '#f8f9fa', borderRadius: '8px' }}>
+                        <Text size="xs" c="dimmed">
+                          Heading
+                        </Text>
+                        <Text fw={600} size="sm">
+                          {selectedVehicle.gps.heading}°
+                        </Text>
+                      </Box>
+                    </SimpleGrid>
+
+                    <div>
+                      <Text size="xs" c="dimmed">
+                        Last Update
+                      </Text>
+                      <Text fw={500}>{selectedVehicle.gps.lastUpdate}</Text>
+                    </div>
+
+                    <Button color="edr-green" fullWidth leftSection={<MapPin size={16} />}>
+                      View Full History
+                    </Button>
+                  </Stack>
+                </Card>
+              )}
+
+              {/* Tracked Vehicles List */}
+              <Card withBorder p="lg">
+                <Stack gap="md">
+                  <Text fw={500}>Tracked Vehicles ({trackableVehicles.length})</Text>
+                  <div style={{ maxHeight: '300px', overflowY: 'auto' }}>
+                    <Table size="sm">
+                      <Table.Tbody>
+                        {trackableVehicles.map(v => (
+                          <Table.Tr
+                            key={v.id}
+                            style={{
+                              cursor: 'pointer',
+                              backgroundColor: v.id === selectedVehicleId ? freightBrand.mutedBg : 'transparent',
+                            }}
+                            onClick={() => setSelectedVehicleId(v.id)}
+                          >
+                            <Table.Td>
+                              <Stack gap={0}>
+                                <Text size="sm" fw={600}>
+                                  {v.registrationNumber}
+                                </Text>
+                                <Text size="xs" c="dimmed">
+                                  {v.gps.speed} km/h
+                                </Text>
+                              </Stack>
+                            </Table.Td>
+                            <Table.Td align="right">
+                              <Badge
+                                color={v.status === 'ACTIVE' ? 'edr-green' : 'gray'}
+                                size="sm"
+                              >
+                                {v.status || 'N/A'}
+                              </Badge>
+                            </Table.Td>
+                          </Table.Tr>
+                        ))}
+                      </Table.Tbody>
+                    </Table>
+                  </div>
+                </Stack>
+              </Card>
+            </Stack>
+          </Grid.Col>
+        </Grid>
+      </Stack>
+    </Container>
+  );
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/fleet/format.ts b/apps/edr-freight-web/backoffice/src/pages/fleet/format.ts
new file mode 100644
index 000000000..6193ca58c
--- /dev/null
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/format.ts
@@ -0,0 +1,16 @@
+/** Shared formatting helpers for the fleet-management pages. */
+
+/** Format a number as Ethiopian Birr, e.g. 12345.6 → "ETB 12,346". */
+export function formatETB(amount: number, fractionDigits = 0): string {
+  const value = Number.isFinite(amount) ? amount : 0;
+  return `ETB ${value.toLocaleString("en-US", {
+    minimumFractionDigits: fractionDigits,
+    maximumFractionDigits: fractionDigits,
+  })}`;
+}
+
+/** Safe percentage of `part` over `total`, rounded, 0 when total is 0. */
+export function pct(part: number, total: number): number {
+  if (!total || !Number.isFinite(total) || !Number.isFinite(part)) return 0;
+  return Math.round((part / total) * 100);
+}
diff --git a/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx b/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
index 569511d30..a33d9a3c2 100644
--- a/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
@@ -4,6 +4,7 @@ import {
   ChevronRight,
   Eye,
   MoreHorizontal,
+  PackageCheck,
   Printer,
   RefreshCw,
   Ruler,
@@ -35,6 +36,7 @@ import {
 
 import { ruleEngineTable } from "@/components/ruleEngine/ruleEngineStyles";
 import { FirstMileContainerAllocationTable } from "@/components/FirstMileContainerAllocationTable";
+import { ReceiveInventoryModal } from "@/components/warehouses/ReceiveInventoryModal";
 import { QUERY_KEYS } from "@/constants/QUERY_KEYS";
 import { useToast } from "@/hooks/use-toast";
 import {
@@ -338,6 +340,8 @@ const FirstMilePage = () => {
   const [distanceValue, setDistanceValue] = useState("");
   const [invoiceOpen, setInvoiceOpen] = useState(false);
   const [invoiceRecord, setInvoiceRecord] = useState<FirstMileRecord | null>(null);
+  const [warehouseReceiveOpen, setWarehouseReceiveOpen] = useState(false);
+  const [warehouseReceiveRecord, setWarehouseReceiveRecord] = useState<FirstMileRecord | null>(null);
 
   const [containerAllocationOpen, setContainerAllocationOpen] = useState(false);
   const [containerAllocationFirstMileId, setContainerAllocationFirstMileId] = useState<string | null>(null);
@@ -441,10 +445,10 @@ const FirstMilePage = () => {
   });
 
   const allocateMutation = useMutation({
-    mutationFn: (data) => apiClient.post(`/first-mile/${containerAllocationFirstMileId}/allocate-containers`, data),
+    mutationFn: (data) => api.post(`/first-mile/${containerAllocationFirstMileId}/allocate-containers`, data),
     onSuccess: () => {
       toast({ title: "Containers allocated" });
-      void qc.invalidateQueries({ queryKey: QUERY_KEYS.FIRST_MILE.detail(containerAllocationFirstMileId ?? "") });
+      void qc.invalidateQueries({ queryKey: QUERY_KEYS.FIRST_MILE.byId(containerAllocationFirstMileId ?? "") });
       setContainerAllocationOpen(false);
       setContainerAllocationFirstMileId(null);
     },
@@ -527,6 +531,16 @@ const FirstMilePage = () => {
     setInvoiceRecord(null);
   };
 
+  const openWarehouseReceive = (record: FirstMileRecord) => {
+    setWarehouseReceiveRecord(record);
+    setWarehouseReceiveOpen(true);
+  };
+
+  const closeWarehouseReceive = () => {
+    setWarehouseReceiveOpen(false);
+    setWarehouseReceiveRecord(null);
+  };
+
   const openContainerAllocation = (firstMileId: string) => {
     setContainerAllocationFirstMileId(firstMileId);
     setContainerAllocationOpen(true);
@@ -771,9 +785,25 @@ const FirstMilePage = () => {
         meta: { headerClassName, cellClassName },
         cell: ({ row }) => {
           const hasDistance = row.original.exactKm != null && row.original.exactKm > 0;
+          const isPaid = (row.original as any).paid;
           if (!hasDistance) {
             return <Text c="dimmed">—</Text>;
           }
+          if (isPaid) {
+            return (
+              <Group gap="xs" wrap="nowrap">
+                <UnstyledButton
+                  onClick={() => openInvoice(row.original)}
+                  c="blue"
+                  fw={500}
+                  style={{ textDecoration: "underline", cursor: "pointer" }}
+                >
+                  #345
+                </UnstyledButton>
+                <Badge color="green" variant="light" size="sm">Paid</Badge>
+              </Group>
+            );
+          }
           return (
             <UnstyledButton
               onClick={() => openInvoice(row.original)}
@@ -813,6 +843,7 @@ const FirstMilePage = () => {
           const assigned = isAssigned(row.original);
           const nextStatus = NEXT_STATUS[row.original.status];
           const canPrint = row.original.status !== "PAYMENT_PENDING";
+          const canReceiveToWarehouse = row.original.status === "RECEIVED_TO_PORT";
           return (
             <Group gap={4} justify="flex-end" wrap="nowrap">
               <Menu position="bottom-end" width={200} withinPortal>
@@ -851,6 +882,13 @@ const FirstMilePage = () => {
                   >
                     View detail
                   </Menu.Item>
+                  <Menu.Item
+                    leftSection={<PackageCheck size={15} />}
+                    disabled={!canReceiveToWarehouse}
+                    onClick={() => openWarehouseReceive(row.original)}
+                  >
+                    Receive to warehouse
+                  </Menu.Item>
                   <Menu.Item
                     leftSection={<Ruler size={15} />}
                     onClick={() => openDistance(row.original.id)}
@@ -1039,6 +1077,19 @@ const FirstMilePage = () => {
         </Stack>
       </Modal>
 
+      <ReceiveInventoryModal
+        opened={warehouseReceiveOpen}
+        onClose={closeWarehouseReceive}
+        mode="bulk"
+        direction="EXPORT"
+        bookingId={warehouseReceiveRecord?.bookingId}
+        bookingLabel={warehouseReceiveRecord ? bookingRef(warehouseReceiveRecord) : undefined}
+        onReceived={() => {
+          void qc.invalidateQueries({ queryKey: QUERY_KEYS.FIRST_MILE.list() });
+          closeWarehouseReceive();
+        }}
+      />
+
       {/* Accept Booking modal — step 1: booking list, step 2: details + vehicle */}
       <Modal
         opened={acceptOpen}
diff --git a/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx b/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
index 3de5e578e..da0bc281b 100644
--- a/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
@@ -31,7 +31,7 @@ import {
   TextInput,
   UnstyledButton,
 } from "@mantine/core";
-import type { ArrivalQueueItem } from "@/types/warehouse";
+import type { ArrivalQueueItem, ImportUnloadedItem, WarehouseInventoryItem } from "@/types/warehouse";
 import { warehouseService } from "@/services/warehouse.service";
 
 import { ruleEngineTable } from "@/components/ruleEngine/ruleEngineStyles";
@@ -44,8 +44,10 @@ import {
   lastMileService,
 } from "@/services/last-mile.service";
 import { vehiclesService } from "@/services/vehicles.service";
+import { driversService, type Driver } from "@/services/drivers.service";
 import { ratesService } from "@/services/rates.service";
 import { LastMileContainerAllocationTable, type LastMileContainerRow } from "@/components/LastMileContainerAllocationTable";
+import { ReleaseOrderModal, type ReleaseOrderTruckPrefill } from "@/components/warehouses/ReleaseOrderModal";
 import { api } from "@/auth/http";
 
 const formatPrice = (amount: number) =>
@@ -110,6 +112,59 @@ const requestedDate = (r: LastMileRecord) => {
 const serviceTypeName = (r: LastMileRecord) =>
   r.booking?.serviceType?.label ?? r.booking?.serviceType?.name ?? "—";
 
+const toReleaseInventoryItem = (row: ImportUnloadedItem): WarehouseInventoryItem =>
+  ({
+    id: row.id,
+    bookingId: row.bookingId,
+    quantity: 1,
+    weight: Number(row.weight) || 0,
+    grnNumber: row.grnNumber,
+    status: row.currentStatus,
+    arrivedAt: row.arrivalTime,
+    unloadedAt: row.arrivalTime,
+    inspectionStatus: row.inspectionStatus,
+    releaseDate: row.releaseDate,
+    releaseOrderReference: row.releaseOrderReference,
+    handoverDocumentReference: row.handoverDocumentReference,
+    handoverDocumentDate: row.handoverDocumentDate,
+    deliveredAt: row.deliveredAt,
+    booking: row.bookingId
+      ? {
+          id: row.bookingId,
+          reference: row.bookingReference ?? row.bookingId,
+          tradeDirection: "IMPORT",
+          lastMileDeliveryAddress: row.lastMileRequested ? row.pickupOption : null,
+          customerTruckPlateNumber: row.customerTruckPlateNumber,
+          customerTruckDriverName: row.customerTruckDriverName,
+          customerTruckType: row.customerTruckType,
+          customerTruckContainerNumber: row.customerTruckContainerNumber,
+          customerTruckAssignedAt: row.customerTruckAssignedAt,
+        }
+      : null,
+  }) as unknown as WarehouseInventoryItem;
+
+const releasePrefillFromLastMile = (
+  record: LastMileRecord,
+  row?: ImportUnloadedItem | null,
+  driversById?: Map<string, Driver>,
+): ReleaseOrderTruckPrefill => {
+  const vehicle = record.vehicle;
+  const truckType = [vehicle?.manufacturer, vehicle?.model].filter(Boolean).join(" ").trim();
+  const assignedDriver = vehicle?.assignedDriverId ? driversById?.get(vehicle.assignedDriverId) : undefined;
+  const assignedDriverName = assignedDriver
+    ? `${assignedDriver.firstName ?? ""} ${assignedDriver.lastName ?? ""}`.trim()
+    : "";
+  return {
+    truckPlateNumber: vehicle?.powerPlateNo || vehicle?.plateNumber || null,
+    trailerPlateNumber: vehicle?.trailerPlateNo || null,
+    driverName: vehicle?.assignedDriverName || assignedDriverName || null,
+    driverLicense: assignedDriver?.licenseNumber || null,
+    driverPhone: assignedDriver?.phoneNumber || null,
+    truckType: vehicle?.vehicleType || truckType || null,
+    containerNumber: row?.containerNumber ?? null,
+  };
+};
+
 const InfoRow = ({ label, value }: { label: string; value: string }) => (
   <Stack gap={2}>
     <Text size="xs" c="dimmed" tt="uppercase" fw={600}>{label}</Text>
@@ -325,6 +380,8 @@ const LastMilePage = () => {
 
   const [allocationOpen, setAllocationOpen] = useState(false);
   const [allocationContainers, setAllocationContainers] = useState<LastMileContainerRow[]>([]);
+  const [releaseItem, setReleaseItem] = useState<WarehouseInventoryItem | null>(null);
+  const [releaseTruckPrefill, setReleaseTruckPrefill] = useState<ReleaseOrderTruckPrefill | null>(null);
 
   const { data: listData, isLoading } = useQuery({
     queryKey: QUERY_KEYS.LAST_MILE.list(),
@@ -352,6 +409,27 @@ const LastMilePage = () => {
 
   const records = listData?.data ?? [];
 
+  const needsDriverLookup = records.some((record) => record.vehicle?.assignedDriverId);
+
+  const { data: driversData } = useQuery({
+    queryKey: ["drivers", "list", "ACTIVE"],
+    queryFn: async () => {
+      const res = await driversService.getAll({ status: "ACTIVE" });
+      return res.data;
+    },
+    enabled: needsDriverLookup,
+  });
+
+  const driversById = useMemo(
+    () => new Map((driversData ?? []).map((driver) => [driver.id, driver])),
+    [driversData],
+  );
+
+  const { data: pickupReadyRows = [] } = useQuery({
+    queryKey: ["warehouse-inventory", "import-pickup-ready-queue"],
+    queryFn: () => warehouseService.importPickupReadyQueue().then((r) => r.data),
+  });
+
   const vehicleOptions = useMemo(
     () =>
       (Array.isArray(vehiclesData) ? vehiclesData : []).map((v) => {
@@ -395,7 +473,7 @@ const LastMilePage = () => {
       api.post(`/last-mile/${activeId}/allocate-containers`, data),
     onSuccess: () => {
       toast({ title: "Containers allocated", variant: "default" });
-      void qc.invalidateQueries({ queryKey: QUERY_KEYS.LAST_MILE.detail(activeId ?? "") });
+      void qc.invalidateQueries({ queryKey: QUERY_KEYS.LAST_MILE.byId(activeId ?? "") });
       closeAllocation();
     },
     onError: () => {
@@ -533,6 +611,15 @@ const LastMilePage = () => {
     [records, activeId],
   );
 
+  const pickupReadyByBooking = useMemo(() => {
+    const map = new Map<string, ImportUnloadedItem>();
+    for (const row of pickupReadyRows) {
+      if (row.bookingId) map.set(row.bookingId, row);
+      if (row.bookingReference) map.set(row.bookingReference, row);
+    }
+    return map;
+  }, [pickupReadyRows]);
+
   const selectedIds = useMemo(
     () => Object.keys(rowSelection).filter((id) => rowSelection[id]),
     [rowSelection],
@@ -569,6 +656,7 @@ const LastMilePage = () => {
     const term = search.trim().toLowerCase();
     return records.filter((r) => {
       if (!matchesFilter(r)) return false;
+      if (filterPostPaymentPending && !(r.remainingPayment > 0)) return false;
       if (!term) return true;
       return [bookingRef(r), customerName(r), deliveryLocation(r), cargoDesc(r)]
         .join(" ")
@@ -649,6 +737,37 @@ const LastMilePage = () => {
     setTripSlipOpen(true);
   };
 
+  const openTruckArrival = (record: LastMileRecord) => {
+    if (!isAssigned(record)) {
+      toast({
+        title: "Assign a truck first",
+        description: "Truck arrival opens after a last-mile vehicle is assigned.",
+        variant: "destructive",
+      });
+      return;
+    }
+
+    const row = pickupReadyByBooking.get(record.bookingId) ?? pickupReadyByBooking.get(bookingRef(record));
+    if (!row) {
+      toast({
+        title: "Import inventory is not pickup-ready",
+        description: `${bookingRef(record)} must be unloaded and pass inspection before truck arrival.`,
+        variant: "destructive",
+      });
+      return;
+    }
+
+    setReleaseTruckPrefill(releasePrefillFromLastMile(record, row, driversById));
+    setReleaseItem(toReleaseInventoryItem(row));
+  };
+
+  const closeTruckArrival = () => {
+    setReleaseItem(null);
+    setReleaseTruckPrefill(null);
+    void qc.invalidateQueries({ queryKey: ["warehouse-inventory"] });
+    void qc.invalidateQueries({ queryKey: QUERY_KEYS.LAST_MILE.ROOT });
+  };
+
   const printTripSlip = () => {
     if (!tripSlipRecord) return;
     const win = window.open("", "_blank", "width=820,height=920");
@@ -751,9 +870,25 @@ const LastMilePage = () => {
         meta: { headerClassName, cellClassName },
         cell: ({ row }) => {
           const hasDistance = row.original.exactKm != null && row.original.exactKm > 0;
+          const isPaid = (row.original as any).paid;
           if (!hasDistance) {
             return <Text c="dimmed">—</Text>;
           }
+          if (isPaid) {
+            return (
+              <Group gap="xs" wrap="nowrap">
+                <UnstyledButton
+                  onClick={() => openInvoice(row.original)}
+                  c="blue"
+                  fw={500}
+                  style={{ textDecoration: "underline", cursor: "pointer" }}
+                >
+                  #345
+                </UnstyledButton>
+                <Badge color="green" variant="light" size="sm">Paid</Badge>
+              </Group>
+            );
+          }
           return (
             <UnstyledButton
               onClick={() => openInvoice(row.original)}
@@ -793,6 +928,9 @@ const LastMilePage = () => {
           const assigned = isAssigned(row.original);
           const nextStatus = NEXT_STATUS[row.original.status];
           const canPrint = row.original.status !== "PAYMENT_PENDING";
+          const releaseRow =
+            pickupReadyByBooking.get(row.original.bookingId) ?? pickupReadyByBooking.get(bookingRef(row.original));
+          const truckArrivalLabel = releaseRow?.releaseOrderReference ? "Truck Leaving" : "Truck Arrival";
           return (
             <Group gap={4} justify="flex-end" wrap="nowrap">
               <Menu position="bottom-end" width={200} withinPortal>
@@ -824,6 +962,13 @@ const LastMilePage = () => {
                   >
                     Reassign
                   </Menu.Item>
+                  <Menu.Item
+                    leftSection={<Truck size={15} />}
+                    disabled={!assigned}
+                    onClick={() => openTruckArrival(row.original)}
+                  >
+                    {truckArrivalLabel}
+                  </Menu.Item>
                   <Menu.Divider />
                   <Menu.Item
                     leftSection={<Eye size={15} />}
@@ -853,7 +998,7 @@ const LastMilePage = () => {
       },
     ];
   // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [vehicleOptions]);
+  }, [vehicleOptions, pickupReadyByBooking]);
 
   return (
     <Stack gap="md">
@@ -1342,6 +1487,13 @@ const LastMilePage = () => {
           </Group>
         </Stack>
       </Modal>
+
+      <ReleaseOrderModal
+        opened={Boolean(releaseItem)}
+        onClose={closeTruckArrival}
+        item={releaseItem}
+        truckPrefill={releaseTruckPrefill}
+      />
     </Stack>
   );
 };
diff --git a/apps/edr-freight-web/backoffice/src/pages/ruleEngine/CargoTypesPage.tsx b/apps/edr-freight-web/backoffice/src/pages/ruleEngine/CargoTypesPage.tsx
index 890796758..2568c76f7 100644
--- a/apps/edr-freight-web/backoffice/src/pages/ruleEngine/CargoTypesPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/ruleEngine/CargoTypesPage.tsx
@@ -51,7 +51,6 @@ interface CargoNode extends RuleEngineRecord {
   cargoTypeName?: string;
   code?: string;
   parentGroupId?: string | null;
-  showFreeTextBox?: boolean;
   requiresDirectorApproval?: boolean;
   /** How this cargo is measured (PER_TON / PER_ITEM); null for groups/unset. */
   unitOfMeasure?: string | null;
@@ -80,7 +79,6 @@ const FORM_FIELDS: FormFieldDef[] = [
       { label: "Per item (break-bulk)", value: "PER_ITEM" },
     ],
   },
-  { name: "showFreeTextBox", label: "Show free text box", type: "boolean" },
   { name: "requiresDirectorApproval", label: "Requires director approval", type: "boolean" },
   { name: "isActive", label: "Active", type: "boolean" },
 ];
@@ -474,19 +472,6 @@ function CargoRow({
                   </Badge>
                 </Tooltip>
               ) : null}
-              {node.showFreeTextBox ? (
-                <Tooltip label="Shows a free-text box on booking" withArrow>
-                  <Badge
-                    size="xs"
-                    variant="light"
-                    color="blue"
-                    radius="sm"
-                    leftSection={<FileText size={11} />}
-                  >
-                    Free text
-                  </Badge>
-                </Tooltip>
-              ) : null}
               {node.unitOfMeasure ? (
                 <Tooltip label="How bookings measure this cargo" withArrow>
                   <Badge size="xs" variant="light" color="teal" radius="sm">
diff --git a/apps/edr-freight-web/backoffice/src/pages/ruleEngine/config/resources.ts b/apps/edr-freight-web/backoffice/src/pages/ruleEngine/config/resources.ts
index 1740cfbe6..8016dfcc9 100644
--- a/apps/edr-freight-web/backoffice/src/pages/ruleEngine/config/resources.ts
+++ b/apps/edr-freight-web/backoffice/src/pages/ruleEngine/config/resources.ts
@@ -11,6 +11,7 @@ export type ColumnFormat =
   | "rateStatus"
   | "date"
   | "number"
+  | "currency"
   | "entityLabel"
   | "rateLabel";
 
@@ -36,6 +37,8 @@ export interface FormFieldDef {
   placeholder?: string;
   description?: string;
   disabled?: boolean;
+  /** Trailing unit label shown inside the input (e.g. "USD" on a rate value). */
+  suffix?: string;
   /** Hide this field when another field currently equals one of these values. */
   hideWhen?: { field: string; equals: string[] };
   /**
@@ -174,7 +177,6 @@ export const RULE_ENGINE_RESOURCES: RuleEngineResourceConfig[] = [
         optional: true,
         placeholder: "Select parent cargo type (optional)",
       },
-      { name: "showFreeTextBox", label: "Show free text box", type: "boolean" },
       { name: "requiresDirectorApproval", label: "Requires director approval", type: "boolean" },
       { name: "isActive", label: "Active", type: "boolean" },
     ],
@@ -402,7 +404,7 @@ export const RULE_ENGINE_RESOURCES: RuleEngineResourceConfig[] = [
     columns: [
       { id: "appliesTo", header: "Applies to", accessorKey: "appliesTo", format: "code" },
       { id: "trigger", header: "Trigger", accessorKey: "trigger" },
-      { id: "rateValue", header: "Value", accessorKey: "rateValue", format: "number" },
+      { id: "rateValue", header: "Value", accessorKey: "rateValue", format: "currency" },
       { id: "rateUnit", header: "Unit", accessorKey: "rateUnit" },
       { id: "status", header: "Status", accessorKey: "status", format: "rateStatus" },
       { id: "effectiveFrom", header: "From", accessorKey: "effectiveFrom", format: "date" },
@@ -454,7 +456,7 @@ export const RULE_ENGINE_RESOURCES: RuleEngineResourceConfig[] = [
         placeholder: "Select bulk commodity (optional)",
         showWhen: { field: "appliesTo", equals: ["BULK", "INTERCITY"] },
       },
-      { name: "rateValue", label: "Rate value", type: "number", required: true },
+      { name: "rateValue", label: "Rate value", type: "number", required: true, suffix: "USD" },
       { name: "rateUnit", label: "Rate unit", type: "select", required: true, options: RATE_UNITS },
       { name: "effectiveFrom", label: "Effective from", type: "date", required: true },
       { name: "effectiveTo", label: "Effective to", type: "date" },
diff --git a/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2DetailPage.tsx b/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2DetailPage.tsx
index aa594fdd0..9319e6a01 100644
--- a/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2DetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2DetailPage.tsx
@@ -9,6 +9,8 @@ import {
   RingProgress,
   Stack,
   Text,
+  Textarea,
+  TextInput,
   ThemeIcon,
   Title,
 } from "@mantine/core";
@@ -88,6 +90,10 @@ export default function TrainScheduleV2DetailPage() {
   const [previewResult, setPreviewResult] = useState<TrainSchedulePreviewResponse | null>(null);
   const [containerPlacements, setContainerPlacements] = useState<ContainerPlacement[]>([]);
   const [maintenanceOpen, setMaintenanceOpen] = useState(false);
+  const [gatepassSecuredAt, setGatepassSecuredAt] = useState("");
+  const [gatepassReference, setGatepassReference] = useState("");
+  const [gatepassFileUrl, setGatepassFileUrl] = useState("");
+  const [gatepassNotes, setGatepassNotes] = useState("");
   const autoPreviewedRef = useRef(false);
 
   const detailQuery = useQuery(
@@ -98,6 +104,42 @@ export default function TrainScheduleV2DetailPage() {
   );
   const schedule = detailQuery.data;
   const freightType: FreightType | undefined = schedule?.freightType as FreightType | undefined;
+  const isDjiboutiPort = (value?: string | null) =>
+    ["DJIBOUTI", "DORALEH", "DMP", "DCT", "NAGAD"].some((token) =>
+      (value ?? "").toUpperCase().includes(token),
+    );
+  const gatepassApplies = Boolean(
+    schedule &&
+      ((schedule.direction === "IMPORT" &&
+        isDjiboutiPort(`${schedule.originStation?.code ?? ""} ${schedule.originStation?.label ?? ""}`)) ||
+        (schedule.direction === "EXPORT" &&
+          isDjiboutiPort(`${schedule.destinationStation?.code ?? ""} ${schedule.destinationStation?.label ?? ""}`))),
+  );
+  const gatepassQuery = useQuery({
+    queryKey: ["train-scheduling", "gatepass", scheduleId],
+    queryFn: () => trainSchedulingService.getImportDjiboutiOperation(scheduleId as string),
+    enabled: Boolean(scheduleId && gatepassApplies),
+  });
+  const secureGatepass = useMutation({
+    mutationFn: () =>
+      trainSchedulingService.grantImportDjiboutiGatepass(scheduleId as string, {
+        securedAt: gatepassSecuredAt ? new Date(gatepassSecuredAt).toISOString() : undefined,
+        reference: gatepassReference.trim() || undefined,
+        fileUrl: gatepassFileUrl.trim() || undefined,
+        notes: gatepassNotes.trim() || undefined,
+      }),
+    onSuccess: () => {
+      toast({ title: "Gate pass secured" });
+      void gatepassQuery.refetch();
+    },
+    onError: (error) => {
+      toast({
+        title: "Gate pass failed",
+        description: parseError(error, "Could not secure gate pass"),
+        variant: "destructive",
+      });
+    },
+  });
 
   const eligibleFilters = useMemo(
     () =>
@@ -133,6 +175,16 @@ export default function TrainScheduleV2DetailPage() {
         : trainSchedulingService.downloadImportDjiboutiLoadListDocument(id),
   });
 
+  useEffect(() => {
+    const operation = gatepassQuery.data;
+    if (!operation) return;
+    const secured = operation.gatepassSecuredAt ?? operation.gatepassGrantedAt;
+    setGatepassSecuredAt(secured ? new Date(secured).toISOString().slice(0, 16) : "");
+    setGatepassReference(operation.documents?.GATE_PASS?.reference ?? "");
+    setGatepassFileUrl(operation.documents?.GATE_PASS?.fileUrl ?? "");
+    setGatepassNotes(operation.documents?.GATE_PASS?.notes ?? operation.notes ?? "");
+  }, [gatepassQuery.data]);
+
   const assignedIds = useMemo(
     () => (schedule?.bookings ?? []).map((b) => b.id),
     [schedule?.bookings],
@@ -899,6 +951,83 @@ export default function TrainScheduleV2DetailPage() {
         ]}
       />
 
+      {gatepassApplies ? (
+        <Paper radius="xl" p="lg" withBorder>
+          <Stack gap="md">
+            <Group justify="space-between" align="flex-start" wrap="wrap">
+              <Group gap="md" align="flex-start" wrap="nowrap">
+                <ThemeIcon
+                  size={44}
+                  radius="md"
+                  variant="light"
+                  color={gatepassQuery.data?.gatepassStatus === "SECURED" ? "edr-green" : "orange"}
+                >
+                  <FileText size={22} />
+                </ThemeIcon>
+                <Stack gap={4}>
+                  <Group gap="sm">
+                    <Title order={4} fw={700}>
+                      Djibouti Port gate pass
+                    </Title>
+                    <Badge
+                      color={gatepassQuery.data?.gatepassStatus === "SECURED" ? "green" : "orange"}
+                      variant="light"
+                    >
+                      {gatepassQuery.data?.gatepassStatus ?? "NOT_SECURED"}
+                    </Badge>
+                  </Group>
+                  <Text size="sm" c="dimmed">
+                    {schedule.direction === "IMPORT"
+                      ? "Secure before dispatch from Djibouti."
+                      : "Secure after dispatch before Djibouti Port entry / unloading."}
+                  </Text>
+                </Stack>
+              </Group>
+              {gatepassQuery.isLoading ? <Loader size="sm" /> : null}
+            </Group>
+
+            <Group align="flex-end" grow>
+              <TextInput
+                label="Secured date"
+                type="datetime-local"
+                value={gatepassSecuredAt}
+                onChange={(event) => setGatepassSecuredAt(event.currentTarget.value)}
+              />
+              <TextInput
+                label="Document reference"
+                placeholder="Optional"
+                value={gatepassReference}
+                onChange={(event) => setGatepassReference(event.currentTarget.value)}
+              />
+              <TextInput
+                label="Document URL"
+                placeholder="Optional upload/link"
+                value={gatepassFileUrl}
+                onChange={(event) => setGatepassFileUrl(event.currentTarget.value)}
+              />
+            </Group>
+            <Textarea
+              label="Notes"
+              placeholder="Optional"
+              autosize
+              minRows={2}
+              value={gatepassNotes}
+              onChange={(event) => setGatepassNotes(event.currentTarget.value)}
+            />
+            <Group justify="flex-end">
+              <Button
+                color="edr-green"
+                leftSection={<CheckCircle2 size={16} />}
+                loading={secureGatepass.isPending}
+                onClick={() => secureGatepass.mutate()}
+              >
+                Save as Secured
+              </Button>
+            </Group>
+          </Stack>
+        </Paper>
+      ) : null}
+
       <Paper radius="xl" p="lg">
         <Stack gap="lg">
           {/* Workflow header with ring progress */}
diff --git a/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2ListPage.tsx b/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2ListPage.tsx
index 899777fda..23ff7ebf3 100644
--- a/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2ListPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2ListPage.tsx
@@ -42,6 +42,7 @@ import {
 } from "@/components/trainScheduling/scheduleVisuals";
 import { useMutation, useQuery } from "@tanstack/react-query";
 import { api } from "@/services/api";
+import { formatRouteLabel } from "@/services/routes.service";
 import { useToast } from "@/hooks/use-toast";
 import type { TrainScheduleListItem } from "@/types/trainScheduling";
 import { DataTable, DataTableFooter, usePagination } from "@edr/ui-common";
@@ -88,7 +89,9 @@ export default function TrainScheduleV2ListPage() {
   const schedulesQuery = useQuery(
     api.trainScheduling.scheduleList.queryOptions({ input: {} }),
   );
-  const routesQuery = useQuery(api.routes.list.queryOptions());
+  const routesQuery = useQuery(
+    api.routes.list.queryOptions({ input: { status: "AVAILABLE" } }),
+  );
   const locomotivesQuery = useQuery(
     api.trainScheduling.availableLocomotives.queryOptions({
       input: { routeId: routeId || undefined },
@@ -97,10 +100,7 @@ export default function TrainScheduleV2ListPage() {
   const create = useMutation(api.trainScheduling.createSchedule.mutationOptions());
   const cancel = useMutation(api.trainScheduling.cancelSchedule.mutationOptions());
 
-  const activeRoutes = useMemo(
-    () => (routesQuery.data ?? []).filter((r) => r.isActive),
-    [routesQuery.data],
-  );
+  const activeRoutes = useMemo(() => routesQuery.data ?? [], [routesQuery.data]);
 
   const selectedRoute = activeRoutes.find((r) => r.id === routeId);
 
@@ -529,7 +529,7 @@ export default function TrainScheduleV2ListPage() {
           <Select
             label="Route"
             placeholder="Select route"
-            data={activeRoutes.map((r) => ({ value: r.id, label: r.name }))}
+            data={activeRoutes.map((r) => ({ value: r.id, label: formatRouteLabel(r) }))}
             value={routeId || null}
             onChange={(v) => setRouteId(v ?? "")}
             searchable
diff --git a/apps/edr-freight-web/backoffice/src/pages/warehouses/ArrivalQueuePage.tsx b/apps/edr-freight-web/backoffice/src/pages/warehouses/ArrivalQueuePage.tsx
index 4de1f5369..606796a44 100644
--- a/apps/edr-freight-web/backoffice/src/pages/warehouses/ArrivalQueuePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/warehouses/ArrivalQueuePage.tsx
@@ -1,4 +1,4 @@
-import { Fragment, useState } from 'react';
+import { Fragment, useEffect, useMemo, useState } from 'react';
 import {
   Badge,
   Button,
@@ -6,6 +6,7 @@ import {
   Container,
   Group,
   Loader,
+  Select,
   Stack,
   Table,
   Text,
@@ -21,11 +22,17 @@ import {
 } from '@/components/warehouses';
 import {
   useAutoUnloadArrivedBookings,
+  useAllWarehouseYards,
+  useAllWarehouseZones,
   useImportArriveQueue,
   useImportTrainItems,
+  useWarehouses,
 } from '@/hooks/useWarehouses';
 import { useToast } from '@/hooks/use-toast';
-import type { AutoUnloadArrivedResult, ImportTrain, ImportTrainItem } from '@/types/warehouse';
+import type { AutoUnloadArrivedResult, ImportTrain, ImportTrainItem, Warehouse, WarehouseYard, WarehouseZone } from '@/types/warehouse';
+
+type UnloadAssignment = { bookingId: string; warehouseId: string; yardId: string; zoneId: string };
+type AssignmentDraft = Partial<Omit<UnloadAssignment, 'bookingId'>>;
 
 const getErrorMessage = (error: unknown) => {
   if (error && typeof error === 'object' && 'response' in error) {
@@ -43,8 +50,54 @@ const getPendingUnloadBookings = (train: ImportTrain) =>
 const isFullyUnloaded = (train: ImportTrain) =>
   Boolean(train.fullyUnloaded) || (train.totalBookings > 0 && getPendingUnloadBookings(train) === 0);
 
-function ImportTrainDetailRows({ scheduleId }: { scheduleId: string }) {
+const locationTypesForFreight = (freightType: string | null | undefined) => {
+  const normalized = (freightType ?? '').toUpperCase();
+  if (normalized === 'CONTAINER') {
+    return { yardTypes: ['CONTAINER_YARD', 'GENERAL_CARGO_YARD'], zoneTypes: ['CONTAINER_ZONE', 'GENERAL_CARGO_ZONE'] };
+  }
+  return { yardTypes: ['BULK_YARD', 'GENERAL_CARGO_YARD'], zoneTypes: ['BULK_ZONE', 'GENERAL_CARGO_ZONE'] };
+};
+
+const isContainerFreight = (freightType: string | null | undefined) =>
+  (freightType ?? '').toUpperCase() === 'CONTAINER';
+
+function isUnloadPending(item: ImportTrainItem) {
+  return !item.currentStatus || item.currentStatus === 'RECEIVED';
+}
+
+function ImportTrainDetailRows({
+  scheduleId,
+  warehouses,
+  yards,
+  zones,
+  assignments,
+  onAssignmentChange,
+  onReadyChange,
+}: {
+  scheduleId: string;
+  warehouses: Warehouse[];
+  yards: WarehouseYard[];
+  zones: WarehouseZone[];
+  assignments: Record<string, AssignmentDraft>;
+  onAssignmentChange: (bookingId: string, draft: AssignmentDraft) => void;
+  onReadyChange: (ready: boolean) => void;
+}) {
   const { data: items = [], isLoading } = useImportTrainItems(scheduleId);
+  const warehouseOptions = useMemo(
+    () => warehouses.map((warehouse) => ({ value: warehouse.id, label: `${warehouse.name} (${warehouse.code})` })),
+    [warehouses],
+  );
+
+  useEffect(() => {
+    const pending = items.filter(isUnloadPending);
+    onReadyChange(
+      pending.length > 0 &&
+        pending.every((item) => {
+          const draft = assignments[item.bookingId];
+          return Boolean(draft?.warehouseId && draft.yardId && draft.zoneId);
+        }),
+    );
+  }, [assignments, items]);
 
   if (isLoading) {
     return (
@@ -73,12 +126,26 @@ function ImportTrainDetailRows({ scheduleId }: { scheduleId: string }) {
           <Table.Th>Weight</Table.Th>
           <Table.Th>Arrival</Table.Th>
           <Table.Th>Status</Table.Th>
+          <Table.Th>Warehouse</Table.Th>
+          <Table.Th>Yard</Table.Th>
+          <Table.Th>Zone</Table.Th>
           <Table.Th>Inspection</Table.Th>
           <Table.Th>Pickup</Table.Th>
         </Table.Tr>
       </Table.Thead>
       <Table.Tbody>
-        {items.map((item: ImportTrainItem) => (
+        {items.map((item: ImportTrainItem) => {
+          const draft = assignments[item.bookingId] ?? {};
+          const { yardTypes, zoneTypes } = locationTypesForFreight(item.freightType);
+          const yardOptions = yards
+            .filter((yard) => yard.warehouseId === draft.warehouseId && yardTypes.includes(yard.type))
+            .map((yard) => ({ value: yard.id, label: `${yard.name} (${yard.code})` }));
+          const zoneOptions = zones
+            .filter((zone) => zone.yardId === draft.yardId && zoneTypes.includes(zone.type))
+            .map((zone) => ({ value: zone.id, label: `${zone.name} (${zone.code})` }));
+          const pending = isUnloadPending(item);
+
+          return (
           <Table.Tr key={item.bookingId}>
             <Table.Td>
               <Text size="sm" fw={600}>
@@ -95,6 +162,41 @@ function ImportTrainDetailRows({ scheduleId }: { scheduleId: string }) {
                 {item.currentStatus ?? 'PENDING'}
               </Badge>
             </Table.Td>
+            <Table.Td>
+              <Select
+                placeholder="Warehouse"
+                data={warehouseOptions}
+                value={draft.warehouseId ?? null}
+                onChange={(value) => onAssignmentChange(item.bookingId, { warehouseId: value ?? undefined })}
+                searchable
+                disabled={!pending}
+                w={210}
+              />
+            </Table.Td>
+            <Table.Td>
+              <Select
+                placeholder={isContainerFreight(item.freightType) ? 'Container yard' : 'Bulk yard'}
+                data={yardOptions}
+                value={draft.yardId ?? null}
+                onChange={(value) =>
+                  onAssignmentChange(item.bookingId, { ...draft, yardId: value ?? undefined, zoneId: undefined })
+                }
+                searchable
+                disabled={!pending || !draft.warehouseId}
+                w={190}
+              />
+            </Table.Td>
+            <Table.Td>
+              <Select
+                placeholder={isContainerFreight(item.freightType) ? 'Container zone' : 'Bulk zone'}
+                data={zoneOptions}
+                value={draft.zoneId ?? null}
+                onChange={(value) => onAssignmentChange(item.bookingId, { ...draft, zoneId: value ?? undefined })}
+                searchable
+                disabled={!pending || !draft.yardId}
+                w={190}
+              />
+            </Table.Td>
             <Table.Td>
               <Badge variant="light" color={item.inspectionStatus === 'PASSED' ? 'green' : 'gray'} size="sm">
                 {item.inspectionStatus ?? 'Not inspected'}
@@ -102,7 +204,8 @@ function ImportTrainDetailRows({ scheduleId }: { scheduleId: string }) {
             </Table.Td>
             <Table.Td>{item.pickupOption.replace(/_/g, ' ')}</Table.Td>
           </Table.Tr>
-        ))}
+          );
+        })}
       </Table.Tbody>
     </Table>
   );
@@ -112,11 +215,36 @@ function ImportTrainDetailRows({ scheduleId }: { scheduleId: string }) {
 export default function ArrivalQueuePage() {
   const { toast } = useToast();
   const { data: trains = [], isLoading } = useImportArriveQueue();
+  const { data: warehouses = [], isLoading: warehousesLoading } = useWarehouses({ status: 'ACTIVE' });
+  const { data: yards = [] } = useAllWarehouseYards();
+  const { data: zones = [] } = useAllWarehouseZones();
   const autoUnload = useAutoUnloadArrivedBookings();
   const [openScheduleId, setOpenScheduleId] = useState<string | null>(null);
   const [busyScheduleId, setBusyScheduleId] = useState<string | null>(null);
+  const [assignmentsBySchedule, setAssignmentsBySchedule] = useState<Record<string, Record<string, AssignmentDraft>>>({});
+  const [readyBySchedule, setReadyBySchedule] = useState<Record<string, boolean>>({});
 
   const unloadTrain = async (train: ImportTrain) => {
+    const assignments = Object.entries(assignmentsBySchedule[train.scheduleId] ?? {})
+      .filter((entry): entry is [string, Required<AssignmentDraft>] =>
+        Boolean(entry[1].warehouseId && entry[1].yardId && entry[1].zoneId),
+      )
+      .map(([bookingId, draft]) => ({
+        bookingId,
+        warehouseId: draft.warehouseId,
+        yardId: draft.yardId,
+        zoneId: draft.zoneId,
+      }));
+
+    if (!readyBySchedule[train.scheduleId] || assignments.length === 0) {
+      toast({
+        variant: 'destructive',
+        title: 'Assign locations',
+        description: 'Select warehouse, yard and zone for each pending booking before unloading.',
+      });
+      return;
+    }
+
     if (isFullyUnloaded(train)) {
       toast({
         title: 'Already unloaded',
@@ -127,7 +255,9 @@ export default function ArrivalQueuePage() {
 
     setBusyScheduleId(train.scheduleId);
     try {
-      const res = (await autoUnload.mutateAsync(train.scheduleId)) as { data: AutoUnloadArrivedResult };
+      const res = (await autoUnload.mutateAsync({ scheduleId: train.scheduleId, assignments })) as {
+        data: AutoUnloadArrivedResult;
+      };
       const result = res.data;
       const alreadyUnloaded = result.unloadedCount === 0 && result.skippedCount > 0 && result.failedCount === 0;
       const firstReason = result.results.find((item) => item.reason)?.reason;
@@ -169,10 +299,12 @@ export default function ArrivalQueuePage() {
 
         <Card withBorder radius="md" padding="lg">
           <Group justify="space-between" mb="md">
-            <Text fw={600}>{trains.length} arrived import train(s)</Text>
-            <Text size="sm" c="dimmed">
-              Open a train to review assigned bookings, then auto unload it.
-            </Text>
+            <Stack gap={2}>
+              <Text fw={600}>{trains.length} arrived import train(s)</Text>
+              <Text size="sm" c="dimmed">
+                Open a train, assign each booking to a warehouse yard and zone, then unload it.
+              </Text>
+            </Stack>
           </Group>
 
           {isLoading ? (
@@ -254,7 +386,7 @@ export default function ArrivalQueuePage() {
                                 color={fullyUnloaded ? 'gray' : 'orange'}
                                 leftSection={busyScheduleId === train.scheduleId ? <PackageOpen size={14} /> : <Truck size={14} />}
                                 loading={busyScheduleId === train.scheduleId}
-                                disabled={fullyUnloaded || train.totalBookings === 0}
+                                disabled={fullyUnloaded || train.totalBookings === 0 || !readyBySchedule[train.scheduleId] || warehousesLoading}
                                 onClick={() => unloadTrain(train)}
                               >
                                 {fullyUnloaded ? 'Already Unloaded' : 'Auto Unload'}
@@ -265,7 +397,27 @@ export default function ArrivalQueuePage() {
                         {isOpen && (
                           <Table.Tr>
                             <Table.Td colSpan={10} bg="var(--mantine-color-gray-0)">
-                              <ImportTrainDetailRows scheduleId={train.scheduleId} />
+                              <ImportTrainDetailRows
+                                scheduleId={train.scheduleId}
+                                warehouses={warehouses}
+                                yards={yards}
+                                zones={zones}
+                                assignments={assignmentsBySchedule[train.scheduleId] ?? {}}
+                                onAssignmentChange={(bookingId, draft) =>
+                                  setAssignmentsBySchedule((current) => ({
+                                    ...current,
+                                    [train.scheduleId]: {
+                                      ...(current[train.scheduleId] ?? {}),
+                                      [bookingId]: draft.warehouseId
+                                        ? draft
+                                        : {},
+                                    },
+                                  }))
+                                }
+                                onReadyChange={(ready) =>
+                                  setReadyBySchedule((current) => ({ ...current, [train.scheduleId]: ready }))
+                                }
+                              />
                             </Table.Td>
                           </Table.Tr>
                         )}
diff --git a/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseInvoicesPage.tsx b/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseInvoicesPage.tsx
index 0f9496e3c..6f4c16594 100644
--- a/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseInvoicesPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseInvoicesPage.tsx
@@ -1,4 +1,4 @@
-import { useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import {
   ActionIcon,
   Badge,
@@ -15,7 +15,8 @@ import {
   Text,
   TextInput,
 } from '@mantine/core';
-import { Ban, CreditCard, DoorOpen, Download, Eye, Receipt, Search } from 'lucide-react';
+import { Ban, CreditCard, DoorOpen, Download, ExternalLink, Eye, Receipt, Search } from 'lucide-react';
+import { useNavigate } from 'react-router-dom';
 import { DataTable, type ColumnDef } from '@edr/ui-common';
 
 import { PageContainer, PageHeader } from '@/components/page';
@@ -28,10 +29,11 @@ import { useToast } from '@/hooks/use-toast';
 import {
   WAREHOUSE_INVOICE_STATUSES,
   type WarehouseFeeInvoice,
+  type WarehouseGatewayPaymentMethod,
   type WarehouseInvoiceStatus,
 } from '@/types/warehouse';
 import { openPdfBlob } from '@/components/warehouses/pdf';
-import { buildWarehouseExitPaperPdf, buildWarehouseInvoicePdf } from '@/components/warehouses/warehousePdf';
+import { buildWarehouseExitPaperPdf } from '@/components/warehouses/warehousePdf';
 import { extractErrorMessage } from '@/components/warehouses/options';
 
 const STATUS_COLOR: Record<WarehouseInvoiceStatus, string> = {
@@ -155,6 +157,7 @@ export default function WarehouseInvoicesPage() {
 
 function InvoiceDetailModal({ id, onClose }: { id: string | null; onClose: () => void }) {
   const { toast } = useToast();
+  const navigate = useNavigate();
   const { data: inv, isLoading } = useQuery(
     api.warehouses.invoice.queryOptions({
       input: { id: id ?? '' },
@@ -162,23 +165,51 @@ function InvoiceDetailModal({ id, onClose }: { id: string | null; onClose: () =>
     }),
   );
   const pay = useMutation(api.warehouses.payInvoice.mutationOptions());
+  const payOnline = useMutation(api.warehouses.payInvoiceOnline.mutationOptions());
   const cancel = useMutation(api.warehouses.cancelInvoice.mutationOptions());
   const gateClear = useMutation(api.warehouses.gateClearance.mutationOptions());
   const [payAmount, setPayAmount] = useState<number | ''>('');
   const [driverName, setDriverName] = useState('');
   const [driverPhone, setDriverPhone] = useState('');
+  const [gatewayMethod, setGatewayMethod] = useState<WarehouseGatewayPaymentMethod>('TELEBIRR');
+  const [payerAccount, setPayerAccount] = useState('');
 
   const canPay = inv && (inv.status === 'ISSUED' || inv.status === 'PARTIALLY_PAID');
   const canGateClear = inv?.status === 'PAID' && Boolean(inv.inventoryId);
 
+  useEffect(() => {
+    setGatewayMethod(inv?.currency === 'USD' ? 'WAAFI' : 'TELEBIRR');
+    setPayerAccount('');
+  }, [inv?.id, inv?.currency]);
+
   const downloadInvoicePdf = async (invoice: WarehouseFeeInvoice) => {
-    const blob = buildWarehouseInvoicePdf(invoice, 'INVOICE');
-    openPdfBlob(blob, `warehouse-invoice-${invoice.invoiceNumber}.pdf`);
+    const pdfWindow = window.open('', '_blank');
+    try {
+      const { data } = await warehouseService.downloadInvoiceDocument(invoice.id);
+      openPdfBlob(data, `warehouse-invoice-${invoice.invoiceNumber}.pdf`, pdfWindow);
+    } catch (error) {
+      pdfWindow?.close();
+      toast({
+        variant: 'destructive',
+        title: 'Download failed',
+        description: extractErrorMessage(error),
+      });
+    }
   };
 
   const downloadReceiptPdf = async (invoice: WarehouseFeeInvoice) => {
-    const blob = buildWarehouseInvoicePdf(invoice, 'RECEIPT');
-    openPdfBlob(blob, `warehouse-receipt-${invoice.invoiceNumber}.pdf`);
+    const pdfWindow = window.open('', '_blank');
+    try {
+      const { data } = await warehouseService.downloadInvoiceReceipt(invoice.id);
+      openPdfBlob(data, `warehouse-receipt-${invoice.invoiceNumber}.pdf`, pdfWindow);
+    } catch (error) {
+      pdfWindow?.close();
+      toast({
+        variant: 'destructive',
+        title: 'Download failed',
+        description: extractErrorMessage(error),
+      });
+    }
   };
 
   const getExitPaperContext = async (invoice: WarehouseFeeInvoice) => {
@@ -280,6 +311,34 @@ function InvoiceDetailModal({ id, onClose }: { id: string | null; onClose: () =>
     }
   };
 
+  const handleOnlinePay = async () => {
+    if (!inv) return;
+    try {
+      const currentUrl = window.location.href;
+      const result = await payOnline.mutateAsync({
+        id: inv.id,
+        payload: {
+          method: gatewayMethod,
+          platform: 'web',
+          payerAccount: payerAccount.trim() || undefined,
+          returnUrl: currentUrl,
+          failureUrl: currentUrl,
+        },
+      });
+      const url = result.clientAction?.url;
+      if (url) {
+        window.location.href = url;
+        return;
+      }
+      toast({
+        title: 'Payment initiated',
+        description: 'No redirect URL was returned by the payment provider.',
+      });
+    } catch (e) {
+      toast({ variant: 'destructive', title: 'Payment failed', description: extractErrorMessage(e) });
+    }
+  };
+
   const handleCancel = async () => {
     if (!inv) return;
     try {
@@ -337,7 +396,31 @@ function InvoiceDetailModal({ id, onClose }: { id: string | null; onClose: () =>
 
           {canPay && (
             <>
-              <Divider label="Record payment" labelPosition="left" />
+              <Divider label="Online payment" labelPosition="left" />
+              <Group align="flex-end">
+                <Select
+                  label="Provider"
+                  value={gatewayMethod}
+                  onChange={(v) => setGatewayMethod((v as WarehouseGatewayPaymentMethod) ?? 'TELEBIRR')}
+                  data={[
+                    { value: 'TELEBIRR', label: 'Telebirr' },
+                    { value: 'WAAFI', label: 'Waafi' },
+                  ]}
+                  style={{ flex: 1 }}
+                />
+                <TextInput
+                  label="Wallet phone / account"
+                  value={payerAccount}
+                  onChange={(e) => setPayerAccount(e.currentTarget.value)}
+                  placeholder="Optional"
+                  style={{ flex: 1 }}
+                />
+                <Button leftSection={<CreditCard size={16} />} loading={payOnline.isPending} onClick={handleOnlinePay}>
+                  Pay with {gatewayMethod === 'WAAFI' ? 'Waafi' : 'Telebirr'}
+                </Button>
+              </Group>
+
+              <Divider label="Record manual payment" labelPosition="left" />
               <Group align="flex-end">
                 <NumberInput
                   label="Amount"
@@ -366,6 +449,20 @@ function InvoiceDetailModal({ id, onClose }: { id: string | null; onClose: () =>
           )}
 
           <Group justify="flex-end" mt="sm">
+            {inv.bookingId && (
+              <Button
+                variant="subtle"
+                color="gray"
+                leftSection={<ExternalLink size={16} />}
+                onClick={() =>
+                  navigate(
+                    `/dashboard/booking-requests/${inv.bookingId}#warehouse-payments`,
+                  )
+                }
+              >
+                View booking
+              </Button>
+            )}
             <Button
               variant="light"
               color="gray"
diff --git a/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseRulesPage.tsx b/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseRulesPage.tsx
index 3d07bf5d0..7d1dbc555 100644
--- a/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseRulesPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseRulesPage.tsx
@@ -18,6 +18,8 @@ import {
 } from '@mantine/core';
 import { Info, Plus, Trash2 } from 'lucide-react';
 
+import { useQuery } from '@tanstack/react-query';
+
 import { PageContainer, PageHeader } from '@/components/page';
 import { useToast } from '@/hooks/use-toast';
 import {
@@ -29,7 +31,9 @@ import {
   useDeleteFeeRule,
   useFeeRules,
 } from '@/hooks/useWarehouses';
+import { api } from '@/services/api';
 import { FEE_RULE_TYPES, type FeeRuleType } from '@/types/warehouse';
+import { extractErrorMessage } from '@/components/warehouses/options';
 
 const FREIGHT = [
   { value: 'CONTAINER', label: 'Container' },
@@ -38,6 +42,7 @@ const FREIGHT = [
 const TRADE = [
   { value: 'IMPORT', label: 'Import' },
   { value: 'EXPORT', label: 'Export' },
+  { value: 'BOTH', label: 'Import & Export' },
   { value: 'DOMESTIC', label: 'Domestic' },
 ];
 const CURRENCIES = [
@@ -53,6 +58,23 @@ const numberValue = (value: string | number, fallback = 0) => {
 };
 const anyLabel = (value: string, label: string) => value.trim() || `Any ${label}`;
 const dash = '-';
+type CodeOptionSource = {
+  id?: string;
+  code?: string;
+  cargoTypeName?: string;
+  label?: string;
+  name?: string;
+};
+
+const codeOptions = (rows: unknown[]) =>
+  (rows as CodeOptionSource[])
+    .filter((row) => row.code)
+    .map((row) => ({
+      value: row.code as string,
+      label: `${row.cargoTypeName ?? row.label ?? row.name ?? row.code} (${row.code})`,
+    }));
+
+const isUnknownTiersError = (error: unknown) => extractErrorMessage(error).includes('property tiers should not exist');
 
 export default function WarehouseRulesPage() {
   return (
@@ -319,6 +341,12 @@ function AllocationRules() {
 function FeeRules() {
   const { toast } = useToast();
   const { data, isLoading } = useFeeRules();
+  const { data: cargoTypes = [], isLoading: cargoTypesLoading } = useQuery(
+    api.cargoTypes.list.queryOptions({ staleTime: Infinity }),
+  );
+  const { data: containerTypes = [], isLoading: containerTypesLoading } = useQuery(
+    api.containerTypes.list.queryOptions({ staleTime: Infinity }),
+  );
   const create = useCreateFeeRule();
   const remove = useDeleteFeeRule();
   const [open, setOpen] = useState(false);
@@ -328,11 +356,56 @@ function FeeRules() {
     freightType: '',
     tradeDirection: '',
     cargoTypeCode: '',
+    containerType: '',
     freeDays: 3,
     ratePerDay: 0,
+    tiers: [] as Array<{ fromDay: number; toDay: number | null; ratePerDay: number }>,
     currency: 'USD',
   });
   const rules = data ?? [];
+  const cargoTypeOptions = codeOptions(cargoTypes);
+  const containerTypeOptions = codeOptions(containerTypes);
+  const isBulkRule = form.freightType === 'BULK';
+  const isContainerRule = form.freightType === 'CONTAINER';
+
+  const resetForm = () =>
+    setForm({
+      name: '',
+      ruleType: 'DEMURRAGE_FEE',
+      freightType: '',
+      tradeDirection: '',
+      cargoTypeCode: '',
+      containerType: '',
+      freeDays: 3,
+      ratePerDay: 0,
+      tiers: [],
+      currency: 'USD',
+    });
+
+  const addTier = () =>
+    setForm((f) => {
+      const last = f.tiers[f.tiers.length - 1];
+      const fromDay = last?.toDay ? last.toDay + 1 : f.tiers.length ? last.fromDay + 1 : f.freeDays + 1;
+      return {
+        ...f,
+        tiers: [...f.tiers, { fromDay, toDay: fromDay, ratePerDay: f.ratePerDay || 0 }],
+      };
+    });
+
+  const updateTier = (
+    index: number,
+    patch: Partial<{ fromDay: number; toDay: number | null; ratePerDay: number }>,
+  ) =>
+    setForm((f) => ({
+      ...f,
+      tiers: f.tiers.map((tier, i) => (i === index ? { ...tier, ...patch } : tier)),
+    }));
+
+  const removeTier = (index: number) =>
+    setForm((f) => ({
+      ...f,
+      tiers: f.tiers.filter((_, i) => i !== index),
+    }));
 
   const submit = async () => {
     if (!form.name.trim()) {
@@ -340,18 +413,68 @@ function FeeRules() {
       return;
     }
 
-    await create.mutateAsync({
+    const tiers = form.tiers.map((tier) => ({
+      fromDay: tier.fromDay,
+      toDay: tier.toDay || null,
+      ratePerDay: tier.ratePerDay,
+    }));
+    for (const [index, tier] of tiers.entries()) {
+      if (!Number.isInteger(tier.fromDay) || tier.fromDay < 1) {
+        toast({ variant: 'destructive', title: `Tier ${index + 1}: from day must be at least 1` });
+        return;
+      }
+      if (tier.toDay != null && tier.toDay < tier.fromDay) {
+        toast({ variant: 'destructive', title: `Tier ${index + 1}: to day must be after from day` });
+        return;
+      }
+      if (tier.ratePerDay < 0) {
+        toast({ variant: 'destructive', title: `Tier ${index + 1}: amount must be zero or greater` });
+        return;
+      }
+    }
+
+    const payload = {
       name: form.name.trim(),
       ruleType: form.ruleType,
       freightType: clean(form.freightType) ?? null,
       tradeDirection: clean(form.tradeDirection) ?? null,
-      cargoTypeCode: clean(form.cargoTypeCode) ?? null,
+      cargoTypeCode: isBulkRule ? (clean(form.cargoTypeCode) ?? null) : null,
+      containerType: isContainerRule ? (clean(form.containerType) ?? null) : null,
       freeDays: form.freeDays,
       ratePerDay: form.ratePerDay,
       currency: form.currency || 'USD',
-    } as never);
-    toast({ title: 'Fee rule created' });
-    setOpen(false);
+      ...(tiers.length ? { tiers } : {}),
+    };
+
+    try {
+      await create.mutateAsync(payload as never);
+      toast({ title: 'Fee rule created' });
+      setOpen(false);
+      resetForm();
+    } catch (error) {
+      if (tiers.length && isUnknownTiersError(error)) {
+        const legacyPayload: Omit<typeof payload, 'tiers'> = {
+          name: payload.name,
+          ruleType: payload.ruleType,
+          freightType: payload.freightType,
+          tradeDirection: payload.tradeDirection,
+          cargoTypeCode: payload.cargoTypeCode,
+          containerType: payload.containerType,
+          freeDays: payload.freeDays,
+          ratePerDay: payload.ratePerDay,
+          currency: payload.currency,
+        };
+        await create.mutateAsync(legacyPayload as never);
+        toast({
+          title: 'Fee rule created without tiers',
+          description: 'The connected API does not support progressive tiers yet. Deploy the warehouse fee tier migration/API to save tier rows.',
+        });
+        setOpen(false);
+        resetForm();
+        return;
+      }
+      toast({ variant: 'destructive', title: 'Create failed', description: extractErrorMessage(error) });
+    }
   };
 
   return (
@@ -370,7 +493,7 @@ function FeeRules() {
           <Loader />
         </Group>
       ) : (
-        <Table.ScrollContainer minWidth={900}>
+        <Table.ScrollContainer minWidth={1100}>
           <Table striped highlightOnHover verticalSpacing="sm">
             <Table.Thead>
               <Table.Tr>
@@ -378,6 +501,9 @@ function FeeRules() {
                 <Table.Th>Name</Table.Th>
                 <Table.Th>Freight</Table.Th>
                 <Table.Th>Trade</Table.Th>
+                <Table.Th>Cargo</Table.Th>
+                <Table.Th>Container</Table.Th>
+                <Table.Th>Location scope</Table.Th>
                 <Table.Th>Free days</Table.Th>
                 <Table.Th>Rate / day</Table.Th>
                 <Table.Th>Active</Table.Th>
@@ -395,6 +521,20 @@ function FeeRules() {
                   <Table.Td>{rule.name}</Table.Td>
                   <Table.Td>{rule.freightType ?? dash}</Table.Td>
                   <Table.Td>{rule.tradeDirection ?? dash}</Table.Td>
+                  <Table.Td>{rule.cargoTypeCode ?? dash}</Table.Td>
+                  <Table.Td>{rule.containerType ?? dash}</Table.Td>
+                  <Table.Td>
+                    {[rule.facilityId, rule.warehouseId, rule.yardId, rule.zoneId].some(Boolean) ? (
+                      <Stack gap={2}>
+                        {rule.facilityId && <Text size="xs">Facility: {rule.facilityId}</Text>}
+                        {rule.warehouseId && <Text size="xs">Warehouse: {rule.warehouseId}</Text>}
+                        {rule.yardId && <Text size="xs">Yard: {rule.yardId}</Text>}
+                        {rule.zoneId && <Text size="xs">Zone: {rule.zoneId}</Text>}
+                      </Stack>
+                    ) : (
+                      dash
+                    )}
+                  </Table.Td>
                   <Table.Td>{rule.freeDays}</Table.Td>
                   <Table.Td>
                     {Number(rule.ratePerDay).toLocaleString()} {rule.currency}
@@ -454,7 +594,14 @@ function FeeRules() {
               label="Freight type"
               data={FREIGHT}
               value={form.freightType || null}
-              onChange={(value) => setForm((f) => ({ ...f, freightType: selectValue(value) }))}
+              onChange={(value) =>
+                setForm((f) => ({
+                  ...f,
+                  freightType: selectValue(value),
+                  cargoTypeCode: value === 'BULK' ? f.cargoTypeCode : '',
+                  containerType: value === 'CONTAINER' ? f.containerType : '',
+                }))
+              }
               clearable
             />
             <Select
@@ -464,15 +611,31 @@ function FeeRules() {
               onChange={(value) => setForm((f) => ({ ...f, tradeDirection: selectValue(value) }))}
               clearable
             />
-            <TextInput
-              label="Cargo type code"
-              value={form.cargoTypeCode}
-              onChange={(e) => {
-                const value = e.currentTarget.value;
-                setForm((f) => ({ ...f, cargoTypeCode: value }));
-              }}
-            />
+            {isBulkRule && (
+              <Select
+                label="Cargo type"
+                placeholder={cargoTypesLoading ? 'Loading cargo types...' : 'Any cargo'}
+                data={cargoTypeOptions}
+                value={form.cargoTypeCode || null}
+                onChange={(value) => setForm((f) => ({ ...f, cargoTypeCode: selectValue(value) }))}
+                searchable
+                clearable
+                disabled={cargoTypesLoading}
+              />
+            )}
           </Group>
+          {isContainerRule && (
+            <Select
+              label="Container type"
+              placeholder={containerTypesLoading ? 'Loading container types...' : 'Any container'}
+              data={containerTypeOptions}
+              value={form.containerType || null}
+              onChange={(value) => setForm((f) => ({ ...f, containerType: selectValue(value) }))}
+              searchable
+              clearable
+              disabled={containerTypesLoading}
+            />
+          )}
           <Group grow>
             <NumberInput
               label="Free days"
@@ -494,6 +657,51 @@ function FeeRules() {
               allowDeselect={false}
             />
           </Group>
+          <Stack gap="xs">
+            <Group justify="space-between">
+              <Text size="sm" fw={600}>
+                Progressive tariff tiers
+              </Text>
+              <Button variant="light" size="xs" leftSection={<Plus size={14} />} onClick={addTier}>
+                Add tier
+              </Button>
+            </Group>
+            {form.tiers.map((tier, index) => (
+              <Group key={index} grow align="end">
+                <NumberInput
+                  label="From day"
+                  min={1}
+                  value={tier.fromDay}
+                  onChange={(value) => updateTier(index, { fromDay: numberValue(value, 1) || 1 })}
+                />
+                <NumberInput
+                  label="To day"
+                  min={tier.fromDay}
+                  value={tier.toDay ?? ''}
+                  placeholder="Open"
+                  onChange={(value) =>
+                    updateTier(index, {
+                      toDay: value === '' ? null : numberValue(value, tier.fromDay),
+                    })
+                  }
+                />
+                <NumberInput
+                  label="Amount / day"
+                  min={0}
+                  value={tier.ratePerDay}
+                  onChange={(value) => updateTier(index, { ratePerDay: numberValue(value) })}
+                />
+                <ActionIcon variant="subtle" color="red" onClick={() => removeTier(index)} title="Remove tier">
+                  <Trash2 size={16} />
+                </ActionIcon>
+              </Group>
+            ))}
+            {form.tiers.length === 0 && (
+              <Text size="xs" c="dimmed">
+                No stepped tiers. The flat rate per day is used after the free days.
+              </Text>
+            )}
+          </Stack>
           <Group justify="flex-end" mt="sm">
             <Button variant="default" onClick={() => setOpen(false)}>
               Cancel
diff --git a/apps/edr-freight-web/backoffice/src/services/api.ts b/apps/edr-freight-web/backoffice/src/services/api.ts
index 01569882a..d7a60179c 100644
--- a/apps/edr-freight-web/backoffice/src/services/api.ts
+++ b/apps/edr-freight-web/backoffice/src/services/api.ts
@@ -84,6 +84,7 @@ import type {
   InventoryInquiryFilter,
   InventoryInquiryResult,
   InventoryMovement,
+  InitiateWarehouseInvoicePaymentPayload,
   LoadableWagon,
   LoadInventoryPayload,
   LoadPassedExportResult,
@@ -102,6 +103,7 @@ import type {
   WarehouseActivityLog,
   WarehouseDashboard,
   WarehouseFeeInvoice,
+  WarehouseInvoicePaymentResponse,
   WarehouseFilter,
   WarehouseInventoryItem,
   WarehouseInvoiceFilter,
@@ -943,12 +945,19 @@ export const api = {
       () => INVENTORY_INVALIDATIONS,
     ),
 
-    autoUnloadArrivedBookings: endpoint<string, AutoUnloadArrivedResult>(
+    autoUnloadArrivedBookings: endpoint<
+      {
+        scheduleId: string;
+        warehouseId?: string;
+        assignments?: { bookingId: string; warehouseId: string; yardId: string; zoneId: string }[];
+      },
+      AutoUnloadArrivedResult
+    >(
       "warehouse-inventory",
       "auto-unload-arrived-bookings",
-      (scheduleId) =>
+      ({ scheduleId, warehouseId, assignments }) =>
         warehouseService
-          .autoUnloadArrivedBookings(scheduleId)
+          .autoUnloadArrivedBookings({ scheduleId, warehouseId, assignments })
           .then((r) => r.data),
       undefined,
       () => INVENTORY_INVALIDATIONS,
@@ -1111,6 +1120,18 @@ export const api = {
       () => [["warehouse-fee-invoices"], ["warehouse-inventory"]],
     ),
 
+    payInvoiceOnline: endpoint<
+      { id: string; payload: InitiateWarehouseInvoicePaymentPayload },
+      WarehouseInvoicePaymentResponse
+    >(
+      "warehouse-fee-invoices",
+      "pay-online",
+      ({ id, payload }) =>
+        warehouseService.payInvoiceOnline(id, payload).then((r) => r.data),
+      undefined,
+      () => [["warehouse-fee-invoices"], ["warehouse-inventory"]],
+    ),
+
     gateClearance: endpoint<string, WarehouseInventoryItem>(
       "warehouse-fee-invoices",
       "gate-clearance",
@@ -1122,8 +1143,14 @@ export const api = {
   },
 
   routes: {
-    list: endpoint<void, RouteRecord[]>("routes", "list", () =>
-      routesService.getAll().then((r) => r.data),
+    list: endpoint<{ status?: import("./routes.service").RouteStatus } | void, RouteRecord[]>(
+      "routes",
+      "list",
+      (input) =>
+        routesService
+          .getAll(input?.status ? { status: input.status } : undefined)
+          .then((r) => r.data),
+      (input) => ["routes", input?.status ?? "all"],
     ),
 
     yards: endpoint<void, YardRef[]>(
diff --git a/apps/edr-freight-web/backoffice/src/services/bookings.service.ts b/apps/edr-freight-web/backoffice/src/services/bookings.service.ts
index 354b176b3..5e5329571 100644
--- a/apps/edr-freight-web/backoffice/src/services/bookings.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/bookings.service.ts
@@ -301,6 +301,105 @@ export const bookingsService = {
 
   governmentExpedite: (id: string) =>
     postBooking<BookingDetail>(B.GOVERNMENT_EXPEDITE(id)),
+
+  getClearance: async (id: string): Promise<Freight.ClearanceView> => {
+    const response = await client.get(B.CLEARANCE(id));
+    return unwrap(response.data) as Freight.ClearanceView;
+  },
+
+  uploadDeclaration: async (
+    id: string,
+    files: Record<string, File | null>,
+  ): Promise<BookingDetail> => {
+    const form = new FormData();
+    for (const [key, file] of Object.entries(files)) {
+      if (file) form.append(key, file);
+    }
+    const response = await client.post(B.CLEARANCE_DECLARATION(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as BookingDetail;
+  },
+
+  adviseDuty: async (
+    id: string,
+    payload: {
+      dutyRequired: boolean;
+      amount?: number;
+      currency?: string;
+      declarationSerial?: string;
+      attachment?: File | null;
+    },
+  ): Promise<BookingDetail> => {
+    const form = new FormData();
+    form.append("dutyRequired", String(payload.dutyRequired));
+    if (payload.amount != null) form.append("amount", String(payload.amount));
+    if (payload.currency) form.append("currency", payload.currency);
+    if (payload.declarationSerial) {
+      form.append("declarationSerial", payload.declarationSerial);
+    }
+    if (payload.attachment) form.append("attachment", payload.attachment);
+    const response = await client.post(B.CLEARANCE_DUTY(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as BookingDetail;
+  },
+
+  finalizePreClearance: (id: string) =>
+    postBooking<BookingDetail>(B.CLEARANCE_FINALIZE_PRE(id)),
+
+  uploadTransitPermit: async (
+    id: string,
+    files: Record<string, File | null>,
+  ): Promise<BookingDetail> => {
+    const form = new FormData();
+    for (const [key, file] of Object.entries(files)) {
+      if (file) form.append(key, file);
+    }
+    const response = await client.post(B.CLEARANCE_TRANSIT_PERMIT(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as BookingDetail;
+  },
+
+  uploadDeliveryOrder: async (id: string, file: File): Promise<BookingDetail> => {
+    const form = new FormData();
+    form.append("file", file);
+    const response = await client.post(B.CLEARANCE_DELIVERY_ORDER(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as BookingDetail;
+  },
+
+  uploadReleaseOrder: async (
+    id: string,
+    file: File,
+    vesselDepartureDate: string,
+  ): Promise<{ hold?: boolean; holdReason?: string }> => {
+    const form = new FormData();
+    form.append("file", file);
+    form.append("vesselDepartureDate", vesselDepartureDate);
+    const response = await client.post(B.CLEARANCE_RELEASE_ORDER(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as { hold?: boolean; holdReason?: string };
+  },
+
+  requestRoAmendment: (id: string, note?: string) =>
+    postBooking<BookingDetail>(B.CLEARANCE_RO_AMENDMENT(id), { note }),
+
+  confirmExportRelease: (id: string) =>
+    postBooking<BookingDetail>(B.CLEARANCE_EXPORT_RELEASE(id), {}),
+
+  getEtClearanceQueue: async (): Promise<BookingDetail[]> => {
+    const response = await client.get(B.CLEARANCE_ET_QUEUE);
+    return (unwrap(response.data) ?? []) as BookingDetail[];
+  },
+
+  getDjClearanceQueue: async (): Promise<BookingDetail[]> => {
+    const response = await client.get(B.CLEARANCE_DJ_QUEUE);
+    return (unwrap(response.data) ?? []) as BookingDetail[];
+  },
 };
 
 async function ensurePdfBlob(blob: Blob): Promise<Blob> {
diff --git a/apps/edr-freight-web/backoffice/src/services/contracts.service.ts b/apps/edr-freight-web/backoffice/src/services/contracts.service.ts
index c34d08b48..465cc302d 100644
--- a/apps/edr-freight-web/backoffice/src/services/contracts.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/contracts.service.ts
@@ -159,6 +159,13 @@ export const contractsService = {
     return unwrap(response.data) as ContractView;
   },
 
+  downloadContractDocument: async (id: string): Promise<Blob> => {
+    const response = await client.get(C.CONTRACT_DOCUMENT(id), {
+      responseType: "blob",
+    });
+    return response.data as Blob;
+  },
+
   signContract: (id: string, payload: SignContractPayload) =>
     postContract<Freight.IContract>(C.CONTRACT_SIGN(id), payload),
 
@@ -200,6 +207,132 @@ export const contractsService = {
   finalizeClearance: (id: string) =>
     postContract<Freight.IContract>(C.CLEARANCE_FINALIZE(id)),
 
+  getEtClearanceQueue: async (): Promise<PaginatedContracts> => {
+    const response = await client.get<PaginatedContracts>(C.CLEARANCE_ET_QUEUE);
+    const data = unwrap(response.data);
+    return {
+      items: (data.items ?? []) as Freight.IContract[],
+      total: data.total ?? 0,
+    };
+  },
+
+  getDjClearanceQueue: async (): Promise<PaginatedContracts> => {
+    const response = await client.get<PaginatedContracts>(C.CLEARANCE_DJ_QUEUE);
+    const data = unwrap(response.data);
+    return {
+      items: (data.items ?? []) as Freight.IContract[],
+      total: data.total ?? 0,
+    };
+  },
+
+  uploadDeclaration: async (
+    id: string,
+    files: Record<string, File | null>,
+  ): Promise<Freight.IContract> => {
+    const form = new FormData();
+    for (const [key, file] of Object.entries(files)) {
+      if (file) form.append(key, file);
+    }
+    const response = await client.post(C.CLEARANCE_DECLARATION(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as Freight.IContract;
+  },
+
+  adviseContractDuty: async (
+    id: string,
+    payload: {
+      dutyRequired: boolean;
+      amount?: number;
+      currency?: string;
+      declarationSerial?: string;
+      attachment?: File | null;
+    },
+  ): Promise<Freight.IContract> => {
+    const form = new FormData();
+    form.append("dutyRequired", String(payload.dutyRequired));
+    if (payload.amount != null) form.append("amount", String(payload.amount));
+    if (payload.currency) form.append("currency", payload.currency);
+    if (payload.declarationSerial) {
+      form.append("declarationSerial", payload.declarationSerial);
+    }
+    if (payload.attachment) form.append("attachment", payload.attachment);
+    const response = await client.post(C.CLEARANCE_DUTY(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as Freight.IContract;
+  },
+
+  finalizePreClearance: (id: string) =>
+    postContract<Freight.IContract>(C.CLEARANCE_FINALIZE_PRE(id)),
+
+  uploadContractTransitPermit: async (
+    id: string,
+    files: Record<string, File | null>,
+  ): Promise<Freight.IContract> => {
+    const form = new FormData();
+    for (const [key, file] of Object.entries(files)) {
+      if (file) form.append(key, file);
+    }
+    const response = await client.post(C.CLEARANCE_TRANSIT_PERMIT(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as Freight.IContract;
+  },
+
+  uploadDeliveryOrder: async (
+    id: string,
+    file: File,
+  ): Promise<Freight.IContract> => {
+    const form = new FormData();
+    form.append("file", file);
+    const response = await client.post(C.CLEARANCE_DELIVERY_ORDER(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as Freight.IContract;
+  },
+
+  uploadReleaseOrder: async (
+    id: string,
+    file: File,
+    vesselDepartureDate: string,
+  ): Promise<{ contract: Freight.IContract; hold: boolean; holdReason?: string }> => {
+    const form = new FormData();
+    form.append("file", file);
+    form.append("vesselDepartureDate", vesselDepartureDate);
+    const response = await client.post(C.CLEARANCE_RELEASE_ORDER(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data) as {
+      contract: Freight.IContract;
+      hold: boolean;
+      holdReason?: string;
+    };
+  },
+
+  requestRoAmendment: (id: string, note?: string) =>
+    postContract<Freight.IContract>(C.CLEARANCE_RO_AMENDMENT(id), { note }),
+
+  confirmExportRelease: (id: string) =>
+    postContract<Freight.IContract>(C.CLEARANCE_EXPORT_RELEASE(id)),
+
+  finalizeExportClearance: (id: string) =>
+    postContract<Freight.IContract>(C.CLEARANCE_FINALIZE_EXPORT(id)),
+
+  uploadTransportDocument: async (
+    bookingId: string,
+    files: Record<string, File | null>,
+  ) => {
+    const form = new FormData();
+    for (const [key, file] of Object.entries(files)) {
+      if (file) form.append(key, file);
+    }
+    const response = await client.post(C.BOOKING_TRANSPORT_DOCUMENT(bookingId), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return unwrap(response.data);
+  },
+
   // ── Path A self-clearance (Operations review) ──
   getOpsClearanceQueue: async (): Promise<PaginatedContracts> => {
     const response = await client.get<PaginatedContracts>(
diff --git a/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts b/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts
index cb9e61b52..046db87e1 100644
--- a/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts
@@ -29,9 +29,12 @@ export interface LastMileVehicle {
   plateNumber: string;
   manufacturer: string;
   model: string;
+  vehicleType?: string | null;
   code?: string | null;
   powerPlateNo?: string | null;
   trailerPlateNo?: string | null;
+  assignedDriverId?: string | null;
+  assignedDriverName?: string | null;
 }
 
 export interface LastMileRecord {
diff --git a/apps/edr-freight-web/backoffice/src/services/routes.service.ts b/apps/edr-freight-web/backoffice/src/services/routes.service.ts
index 52832913d..26c340e83 100644
--- a/apps/edr-freight-web/backoffice/src/services/routes.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/routes.service.ts
@@ -2,6 +2,8 @@ import { api as apiClient } from '../auth/http';
 
 import { URL_CONSTANTS } from '@/constants/URLS';
 
+export type RouteStatus = 'AVAILABLE' | 'MAINTENANCE' | 'DAMAGED' | 'STOP_WORKING';
+
 export interface YardRef {
   id: string;
   code: string;
@@ -14,32 +16,54 @@ export interface RouteMilestone {
   routeId: string;
   yardId: string;
   sequenceNo: number;
+  distanceKm?: number | null;
   yard?: YardRef | null;
 }
 
 export interface RouteRecord {
   id: string;
-  name: string;
+  status: RouteStatus;
   originYardId: string;
   destinationYardId: string;
-  isActive: boolean;
   originYard?: YardRef | null;
   destinationYard?: YardRef | null;
   milestones?: RouteMilestone[];
 }
 
 export interface SaveRoutePayload {
-  name: string;
-  milestones: Array<{ yardId: string }>;
-  isActive?: boolean;
+  milestones: Array<{ yardId: string; distanceKm?: number }>;
+  status?: RouteStatus;
 }
 
+export function formatRouteLabel(route: RouteRecord): string {
+  const origin =
+    route.originYard?.code ?? route.originYard?.label ?? 'Origin';
+  const dest =
+    route.destinationYard?.code ?? route.destinationYard?.label ?? 'Destination';
+  return `${origin} → ${dest}`;
+}
+
+export function totalRouteDistanceKm(route: RouteRecord): number {
+  return (route.milestones ?? []).reduce(
+    (sum, m) => sum + Number(m.distanceKm ?? 0),
+    0,
+  );
+}
+
+export const ROUTE_STATUS_OPTIONS: Array<{ value: RouteStatus; label: string }> = [
+  { value: 'AVAILABLE', label: 'Available' },
+  { value: 'MAINTENANCE', label: 'Maintenance' },
+  { value: 'DAMAGED', label: 'Damaged' },
+  { value: 'STOP_WORKING', label: 'Stop working' },
+];
+
 interface YardListResponse {
   data: YardRef[];
 }
 
 export const routesService = {
-  getAll: () => apiClient.get<RouteRecord[]>(URL_CONSTANTS.ROUTES.BASE),
+  getAll: (params?: { status?: RouteStatus; search?: string }) =>
+    apiClient.get<RouteRecord[]>(URL_CONSTANTS.ROUTES.BASE, { params }),
   getById: (id: string) => apiClient.get<RouteRecord>(URL_CONSTANTS.ROUTES.BY_ID(id)),
   create: (data: SaveRoutePayload) => apiClient.post(URL_CONSTANTS.ROUTES.BASE, data),
   update: (id: string, data: Partial<SaveRoutePayload>) =>
diff --git a/apps/edr-freight-web/backoffice/src/services/vehicles.service.ts b/apps/edr-freight-web/backoffice/src/services/vehicles.service.ts
index b9d5129e3..d3805df1a 100644
--- a/apps/edr-freight-web/backoffice/src/services/vehicles.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/vehicles.service.ts
@@ -26,6 +26,8 @@ export interface Vehicle {
   capacity: number;
   status: VehicleStatus;
   description?: string | null;
+  assignedDriverId?: string | null;
+  assignedDriverName?: string | null;
   code?: string | null;
   powerPlateNo?: string | null;
   trailerPlateNo?: string | null;
diff --git a/apps/edr-freight-web/backoffice/src/services/warehouse.service.ts b/apps/edr-freight-web/backoffice/src/services/warehouse.service.ts
index 5aca5bd3f..e8e2fac88 100644
--- a/apps/edr-freight-web/backoffice/src/services/warehouse.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/warehouse.service.ts
@@ -18,6 +18,8 @@ import type {
   WarehouseFeeInvoice,
   WarehouseInvoiceFilter,
   PayInvoicePayload,
+  InitiateWarehouseInvoicePaymentPayload,
+  WarehouseInvoicePaymentResponse,
   BookingScheduleView,
   InventoryFilter,
   InventoryInquiryFilter,
@@ -171,10 +173,14 @@ export const warehouseService = {
     apiClient.get<ImportTrain[]>(URL_CONSTANTS.WAREHOUSE_INVENTORY.IMPORT_ARRIVE_QUEUE),
   importTrainItems: (scheduleId: string) =>
     apiClient.get<ImportTrainItem[]>(URL_CONSTANTS.WAREHOUSE_INVENTORY.IMPORT_TRAIN_ITEMS(scheduleId)),
-  autoUnloadArrivedBookings: (scheduleId: string) =>
+  autoUnloadArrivedBookings: (payload: {
+    scheduleId: string;
+    warehouseId?: string;
+    assignments?: { bookingId: string; warehouseId: string; yardId: string; zoneId: string }[];
+  }) =>
     apiClient.post<AutoUnloadArrivedResult>(
       URL_CONSTANTS.WAREHOUSE_INVENTORY.IMPORT_AUTO_UNLOAD_ARRIVED,
-      { scheduleId },
+      payload,
     ),
   importUnloadedQueue: () =>
     apiClient.get<ImportUnloadedItem[]>(URL_CONSTANTS.WAREHOUSE_INVENTORY.IMPORT_UNLOADED_QUEUE),
@@ -294,6 +300,8 @@ export const warehouseService = {
     apiClient.patch<WarehouseFeeInvoice>(URL_CONSTANTS.WAREHOUSE_INVOICES.CANCEL(id)),
   payInvoice: (id: string, payload: PayInvoicePayload) =>
     apiClient.post<WarehouseFeeInvoice>(URL_CONSTANTS.WAREHOUSE_INVOICES.PAY(id), payload),
+  payInvoiceOnline: (id: string, payload: InitiateWarehouseInvoicePaymentPayload) =>
+    apiClient.post<WarehouseInvoicePaymentResponse>(URL_CONSTANTS.WAREHOUSE_INVOICES.PAY_ONLINE(id), payload),
   gateClearance: (inventoryId: string) =>
     apiClient.post<WarehouseInventoryItem>(URL_CONSTANTS.WAREHOUSE_INVOICES.GATE_CLEARANCE(inventoryId), {}),
 };
diff --git a/apps/edr-freight-web/backoffice/src/types/booking.ts b/apps/edr-freight-web/backoffice/src/types/booking.ts
index 2bb33e8f8..298e749c7 100644
--- a/apps/edr-freight-web/backoffice/src/types/booking.ts
+++ b/apps/edr-freight-web/backoffice/src/types/booking.ts
@@ -177,6 +177,7 @@ export interface BookingDetail {
   equipmentReturn?: string;
   customsClearingEnabled?: boolean;
   customsClearingAgent?: string | null;
+  contractKind?: "ONE_TIME" | "GENERAL" | null;
   contractSummary?: string | null;
   latestChangeRequestNote?: string | null;
   nextStep?: BookingNextStep | null;
diff --git a/apps/edr-freight-web/backoffice/src/types/trainScheduling.ts b/apps/edr-freight-web/backoffice/src/types/trainScheduling.ts
index fceed16c1..59fb88b1d 100644
--- a/apps/edr-freight-web/backoffice/src/types/trainScheduling.ts
+++ b/apps/edr-freight-web/backoffice/src/types/trainScheduling.ts
@@ -400,6 +400,7 @@ export interface TrainScheduleDetail {
 }
 
 export type ImportDjiboutiDocumentType =
+  | "GATE_PASS"
   | "DELIVERY_ORDER"
   | "PORT_INVOICE"
   | "DJIBOUTI_T1"
@@ -422,6 +423,7 @@ export interface ImportDjiboutiOperation {
   status: {
     documentsComplete: boolean;
     missingDocuments: ImportDjiboutiDocumentType[];
+    gatepassStatus: "SECURED" | "NOT_SECURED";
     gatepassGranted: boolean;
     readyForLoading: boolean;
     loadedOnTrain: boolean;
@@ -430,6 +432,8 @@ export interface ImportDjiboutiOperation {
   };
   documents: Partial<Record<ImportDjiboutiDocumentType, ImportDjiboutiDocumentRecord>>;
   gatepassGrantedAt: string | null;
+  gatepassSecuredAt?: string | null;
+  gatepassStatus: "SECURED" | "NOT_SECURED";
   readyForLoadingAt: string | null;
   loadedOnTrainAt: string | null;
   departedFromDjiboutiAt: string | null;
@@ -448,6 +452,10 @@ export interface UploadImportDjiboutiDocumentPayload {
 }
 
 export interface ImportDjiboutiActionPayload {
+  securedAt?: string;
+  fileId?: string;
+  fileUrl?: string;
+  reference?: string;
   notes?: string;
   performedBy?: string;
 }
diff --git a/apps/edr-freight-web/backoffice/src/types/warehouse.ts b/apps/edr-freight-web/backoffice/src/types/warehouse.ts
index e324f299a..fdaeee556 100644
--- a/apps/edr-freight-web/backoffice/src/types/warehouse.ts
+++ b/apps/edr-freight-web/backoffice/src/types/warehouse.ts
@@ -223,6 +223,11 @@ export interface InventoryBookingRef {
   tradeDirection?: string | null;
   // Present when the customer requested last-mile (door) delivery — gates the Last Mile action.
   lastMileDeliveryAddress?: string | null;
+  customerTruckPlateNumber?: string | null;
+  customerTruckDriverName?: string | null;
+  customerTruckType?: string | null;
+  customerTruckContainerNumber?: string | null;
+  customerTruckAssignedAt?: string | null;
 }
 
 export interface InventoryMovement {
@@ -398,6 +403,11 @@ export interface EligibleBooking {
   firstMileDriverPhone: string | null;
   firstMileDriverLicenseNumber: string | null;
   firstMileTruckType: string | null;
+  customerTruckPlateNumber: string | null;
+  customerTruckDriverName: string | null;
+  customerTruckType: string | null;
+  customerTruckContainerNumber: string | null;
+  customerTruckAssignedAt: string | null;
 }
 
 export interface BulkReceivePayload {
@@ -433,6 +443,7 @@ export interface TruckEntrancePayload {
   packagingType?: string;
   unitCount?: number;
   grossWeightKg?: number;
+  weighingRequired?: boolean;
   netWeightKg?: number;
   volumeDimensions?: string;
   conditionAtReceipt?: string;
@@ -442,7 +453,7 @@ export interface TruckEntrancePayload {
   driverPhone: string;
   driverLicenseNumber?: string;
   truckType?: string;
-  entranceTareWeightKg: number;
+  entranceTareWeightKg?: number;
   exitTareWeightKg?: number;
   driverSignatoryName?: string;
   warehouseManagerName?: string;
@@ -573,6 +584,11 @@ export interface ImportUnloadedItem {
   inspectionStatus: string | null;
   pickupOption: string;
   lastMileRequested: boolean;
+  customerTruckPlateNumber: string | null;
+  customerTruckDriverName: string | null;
+  customerTruckType: string | null;
+  customerTruckContainerNumber: string | null;
+  customerTruckAssignedAt: string | null;
   currentStatus: string;
   releaseDate: string | null;
   releaseOrderReference: string | null;
@@ -589,6 +605,7 @@ export interface ImportTrainItem {
   wagonNumber: string | null;
   sequenceNo: number | null;
   allocatedWeightTons: number | null;
+  freightType: string | null;
   containerNumber: string | null;
   cargoType: string | null;
   weight: number | null;
@@ -738,11 +755,25 @@ export interface FeeRule {
   zoneId?: string | null;
   freeDays: number;
   ratePerDay: number;
+  tiers?: FeeRuleTier[];
   currency: string;
   isActive: boolean;
 }
 export type SaveFeeRulePayload = Omit<FeeRule, 'id'>;
 
+export interface FeeRuleTier {
+  fromDay: number;
+  toDay: number | null;
+  ratePerDay: number;
+}
+
+export interface FeePreviewTier extends FeeRuleTier {
+  appliedFromDay: number;
+  appliedToDay: number;
+  days: number;
+  amount: number;
+}
+
 export interface FeePreview {
   ruleType: FeeRuleType;
   ruleId: string | null;
@@ -760,6 +791,7 @@ export interface FeePreview {
   containerCount: number;
   billableUnits: number;
   amount: number;
+  tiers?: FeePreviewTier[];
 }
 
 export interface AllocationPreviewResult {
@@ -868,6 +900,27 @@ export interface PayInvoicePayload {
   driverPhone?: string;
 }
 
+export type WarehouseGatewayPaymentMethod = 'TELEBIRR' | 'WAAFI';
+
+export interface InitiateWarehouseInvoicePaymentPayload {
+  method: WarehouseGatewayPaymentMethod;
+  platform?: 'web' | 'mobile';
+  payerAccount?: string;
+  returnUrl?: string;
+  failureUrl?: string;
+}
+
+export interface WarehouseInvoicePaymentResponse {
+  intentId: string;
+  status?: string;
+  merchantOrderId?: string;
+  clientAction?: {
+    type?: string;
+    url?: string;
+    [key: string]: unknown;
+  };
+}
+
 // ── Payloads ───────────────────────────────────────────────────────────────
 
 export interface SaveWarehousePayload {
diff --git a/apps/edr-freight-web/portal/package.json b/apps/edr-freight-web/portal/package.json
index 960531fda..c445d67e9 100644
--- a/apps/edr-freight-web/portal/package.json
+++ b/apps/edr-freight-web/portal/package.json
@@ -16,6 +16,7 @@
     "@edr/ui-common": "workspace:*",
     "@hookform/resolvers": "^5.4.0",
     "@mantine/core": "^9.3.0",
+    "@mantine/dates": "^9.3.0",
     "@mantine/hooks": "^9.3.0",
     "@tanstack/react-query": "^5.59.0",
     "@tria-plc/iamui": "file:../../../local-packages/tria-plc-iamui-0.1.1.tgz",
diff --git a/apps/edr-freight-web/portal/src/App.tsx b/apps/edr-freight-web/portal/src/App.tsx
index 05c942290..02be21620 100644
--- a/apps/edr-freight-web/portal/src/App.tsx
+++ b/apps/edr-freight-web/portal/src/App.tsx
@@ -42,6 +42,7 @@ import ContractViewPage from "./pages/contracts/ContractViewPage";
 import ContractsList from "./pages/contracts/ContractsList";
 import NewContractPage from "./pages/contracts/NewContractPage";
 import NewShipmentPage from "./pages/contracts/NewShipmentPage";
+import NewShipmentRequestPage from "./pages/contracts/NewShipmentRequestPage";
 import CheckPaymentPage from "./pages/payments/CheckPaymentPage";
 import PaymentFailurePage from "./pages/payments/PaymentFailurePage";
 import PaymentSuccessPage from "./pages/payments/PaymentSuccessPage";
@@ -272,6 +273,14 @@ const App = () => {
             />
             <Route path="/contracts" element={<ContractsList />} />
             <Route path="/contracts/new" element={<NewContractPage />} />
+            <Route
+              path="/contracts/:id/edit"
+              element={<NewContractPage mode="edit" />}
+            />
+            <Route
+              path="/contracts/:id/shipment-requests/new"
+              element={<NewShipmentRequestPage />}
+            />
             <Route
               path="/contracts/:id/bookings/new"
               element={<NewShipmentPage />}
diff --git a/apps/edr-freight-web/portal/src/components/AppLayout.tsx b/apps/edr-freight-web/portal/src/components/AppLayout.tsx
index 2d7fcd469..5f4de9f87 100644
--- a/apps/edr-freight-web/portal/src/components/AppLayout.tsx
+++ b/apps/edr-freight-web/portal/src/components/AppLayout.tsx
@@ -796,7 +796,7 @@ export function AppLayout({
       {/* ── Main ── */}
       <AppShell.Main
         style={{
-          backgroundColor: "#F1F5F9",
+          backgroundColor: "##f8fafc",
         }}
       >
         {children}
diff --git a/apps/edr-freight-web/portal/src/components/contracts/ClearanceAdHocUploadSection.tsx b/apps/edr-freight-web/portal/src/components/contracts/ClearanceAdHocUploadSection.tsx
new file mode 100644
index 000000000..5d4c4a5fd
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/components/contracts/ClearanceAdHocUploadSection.tsx
@@ -0,0 +1,88 @@
+import { Box, Button, Group, Stack, Text, TextInput } from "@mantine/core";
+import { Plus, Trash2 } from "lucide-react";
+
+import { PortalFileDropzone } from "@/components/contracts/PortalFileDropzone";
+import { INK } from "@/pages/contracts/contract-ui";
+
+export type AdHocDoc = { name: string; file: File | null };
+
+export function ClearanceAdHocUploadSection({
+  rows,
+  onAdd,
+  onRemove,
+  onNameChange,
+  onFileChange,
+  onPreview,
+}: {
+  rows: AdHocDoc[];
+  onAdd: () => void;
+  onRemove: (index: number) => void;
+  onNameChange: (index: number, name: string) => void;
+  onFileChange: (index: number, file: File | null) => void;
+  onPreview?: (file: { name: string; url: string; mimeType?: string | null }) => void;
+}) {
+  return (
+    <Box mt="lg">
+      <Group justify="space-between" align="center" mb="sm">
+        <Box>
+          <Text fz={13} fw={700} style={{ color: INK }}>
+            Additional documents
+          </Text>
+          <Text fz={12} c="dimmed">
+            Optional supporting files not listed above.
+          </Text>
+        </Box>
+        <Button
+          size="compact-sm"
+          variant="light"
+          color="edr-green"
+          leftSection={<Plus size={14} />}
+          onClick={onAdd}
+        >
+          Add document
+        </Button>
+      </Group>
+      <Stack gap="md">
+        {rows.map((row, i) => (
+          <Box
+            key={i}
+            p="md"
+            style={{
+              borderRadius: 14,
+              border: "1px solid #E6ECF2",
+              background: "#FAFCFE",
+            }}
+          >
+            <Stack gap="sm">
+              <Group justify="space-between" wrap="nowrap">
+                <TextInput
+                  label="Document name"
+                  placeholder="e.g. Special permit"
+                  value={row.name}
+                  onChange={(e) => onNameChange(i, e.currentTarget.value)}
+                  style={{ flex: 1 }}
+                  radius="md"
+                />
+                <Button
+                  variant="subtle"
+                  color="red"
+                  mt={24}
+                  leftSection={<Trash2 size={14} />}
+                  onClick={() => onRemove(i)}
+                >
+                  Remove
+                </Button>
+              </Group>
+              <PortalFileDropzone
+                label="File"
+                value={row.file}
+                onChange={(file) => onFileChange(i, file)}
+                onPreview={onPreview}
+              />
+            </Stack>
+          </Box>
+        ))}
+      </Stack>
+    </Box>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/components/contracts/ClearanceDocumentUploadCard.tsx b/apps/edr-freight-web/portal/src/components/contracts/ClearanceDocumentUploadCard.tsx
new file mode 100644
index 000000000..6e8bbe1c2
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/components/contracts/ClearanceDocumentUploadCard.tsx
@@ -0,0 +1,210 @@
+import {
+  Badge,
+  Box,
+  Button,
+  Group,
+  Paper,
+  Stack,
+  Text,
+  ThemeIcon,
+} from "@mantine/core";
+import {
+  AlertCircle,
+  CheckCircle2,
+  Clock,
+  Download,
+  Eye,
+  FileText,
+} from "lucide-react";
+import { isViewable } from "@edr/ui-common";
+
+import { PortalFileDropzone } from "@/components/contracts/PortalFileDropzone";
+import { fileViewUrl } from "@/constants/apiConfig";
+import { BORDER, GREEN, INK } from "@/pages/contracts/contract-ui";
+
+type ReviewStatus = "PENDING" | "APPROVED" | "QUERIED" | null;
+
+export interface ClearanceDocumentUploadCardProps {
+  label: string;
+  required?: boolean;
+  reviewStatus?: ReviewStatus;
+  note?: string | null;
+  uploadedFile?: { id: string; name: string } | null;
+  stagedFile?: File | null;
+  canUpload?: boolean;
+  onStageFile?: (file: File | null) => void;
+  onPreview?: (file: { name: string; url: string; mimeType?: string | null }) => void;
+}
+
+function StatusBadge({ status, hasFile }: { status?: ReviewStatus; hasFile: boolean }) {
+  if (status === "APPROVED") {
+    return (
+      <Badge
+        size="sm"
+        variant="light"
+        color="edr-green"
+        leftSection={<CheckCircle2 size={12} />}
+        radius="sm"
+      >
+        Approved
+      </Badge>
+    );
+  }
+  if (status === "QUERIED") {
+    return (
+      <Badge
+        size="sm"
+        variant="light"
+        color="red"
+        leftSection={<AlertCircle size={12} />}
+        radius="sm"
+      >
+        Needs correction
+      </Badge>
+    );
+  }
+  if (hasFile) {
+    return (
+      <Badge
+        size="sm"
+        variant="light"
+        color="blue"
+        leftSection={<Clock size={12} />}
+        radius="sm"
+      >
+        Under review
+      </Badge>
+    );
+  }
+  return (
+    <Badge size="sm" variant="light" color="gray" radius="sm">
+      Not uploaded
+    </Badge>
+  );
+}
+
+export function ClearanceDocumentUploadCard({
+  label,
+  required = false,
+  reviewStatus = null,
+  note,
+  uploadedFile,
+  stagedFile = null,
+  canUpload = false,
+  onStageFile,
+  onPreview,
+}: ClearanceDocumentUploadCardProps) {
+  const queried = reviewStatus === "QUERIED";
+  const approved = reviewStatus === "APPROVED";
+  const showUpload = canUpload && !approved && onStageFile;
+  const viewUrl = uploadedFile ? fileViewUrl(uploadedFile.id) : null;
+  const canPreviewUploaded =
+    uploadedFile &&
+    viewUrl &&
+    isViewable({ name: uploadedFile.name, url: viewUrl });
+
+  return (
+    <Paper
+      withBorder
+      radius="lg"
+      p="md"
+      style={{
+        borderColor: queried ? "#F0B4B4" : uploadedFile ? `${GREEN}55` : BORDER,
+        background: queried
+          ? "linear-gradient(160deg, #FDF4F4 0%, #FFFFFF 70%)"
+          : uploadedFile
+            ? "linear-gradient(160deg, #F6FBF8 0%, #FFFFFF 70%)"
+            : "#fff",
+      }}
+    >
+      <Stack gap="sm">
+        <Group justify="space-between" align="flex-start" wrap="nowrap">
+          <Group gap={12} wrap="nowrap" style={{ minWidth: 0 }}>
+            <ThemeIcon
+              variant="light"
+              color={queried ? "red" : uploadedFile ? "edr-green" : "gray"}
+              radius="md"
+              size={42}
+            >
+              <FileText size={20} />
+            </ThemeIcon>
+            <Box style={{ minWidth: 0 }}>
+              <Text fz={14} fw={700} style={{ color: INK }} truncate>
+                {label}
+                {required ? (
+                  <Text component="span" c="red" inherit>
+                    {" "}
+                    *
+                  </Text>
+                ) : null}
+              </Text>
+              {uploadedFile && !stagedFile ? (
+                <Text fz={12} c="dimmed" truncate mt={2}>
+                  {uploadedFile.name}
+                </Text>
+              ) : null}
+            </Box>
+          </Group>
+          <StatusBadge status={reviewStatus} hasFile={Boolean(uploadedFile)} />
+        </Group>
+
+        {queried && note ? (
+          <Box
+            p="sm"
+            style={{
+              borderRadius: 10,
+              background: "#FEF2F2",
+              border: "1px solid #F0B4B4",
+            }}
+          >
+            <Text fz={12} fw={600} c="red.8">
+              Reviewer note
+            </Text>
+            <Text fz={12} c="red.7" mt={4}>
+              {note}
+            </Text>
+          </Box>
+        ) : null}
+
+        {uploadedFile && !stagedFile ? (
+          <Group gap={8}>
+            {canPreviewUploaded && onPreview ? (
+              <Button
+                size="compact-sm"
+                variant="light"
+                color="edr-green"
+                leftSection={<Eye size={14} />}
+                onClick={() =>
+                  onPreview({ name: uploadedFile.name, url: viewUrl! })
+                }
+              >
+                View
+              </Button>
+            ) : null}
+            <Button
+              size="compact-sm"
+              variant="default"
+              component="a"
+              href={fileViewUrl(uploadedFile.id, true)}
+              download={uploadedFile.name}
+              leftSection={<Download size={14} />}
+            >
+              Download
+            </Button>
+          </Group>
+        ) : null}
+
+        {showUpload ? (
+          <PortalFileDropzone
+            label={uploadedFile || stagedFile ? "Replace file" : "Upload file"}
+            description="PDF or image — drag and drop or browse."
+            value={stagedFile}
+            onChange={onStageFile}
+            replaceMode={Boolean(uploadedFile)}
+            onPreview={onPreview}
+          />
+        ) : null}
+      </Stack>
+    </Paper>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/components/contracts/ClearanceUploadedDocumentsPanel.tsx b/apps/edr-freight-web/portal/src/components/contracts/ClearanceUploadedDocumentsPanel.tsx
new file mode 100644
index 000000000..e3d8ff724
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/components/contracts/ClearanceUploadedDocumentsPanel.tsx
@@ -0,0 +1,393 @@
+import { useMemo } from "react";
+import {
+  Badge,
+  Box,
+  Button,
+  Group,
+  Paper,
+  Stack,
+  Tabs,
+  Text,
+  ThemeIcon,
+  Tooltip,
+} from "@mantine/core";
+import { Download, Eye, FileText, Receipt, Ship, Truck } from "lucide-react";
+import type { Freight } from "@edr/types";
+import { isViewable } from "@edr/ui-common";
+
+import { BORDER, GREEN, INK } from "@/pages/contracts/contract-ui";
+
+type TabValue = Freight.ClearanceWorkflowFileCategory;
+
+type TabConfig = {
+  value: TabValue;
+  label: string;
+  icon: typeof FileText;
+  emptyHint: string;
+};
+
+function tabConfigForTradeDirection(tradeDirection: string): TabConfig[] {
+  if (tradeDirection === "EXPORT") {
+    return [
+      {
+        value: "declaration",
+        label: "Declaration",
+        icon: FileText,
+        emptyHint:
+          "Global Logistics will upload your customs declaration documents here once they are ready.",
+      },
+      {
+        value: "djibouti",
+        label: "Release order",
+        icon: Ship,
+        emptyHint: "The release order will appear here once Global Logistics Djibouti uploads it.",
+      },
+      {
+        value: "transit",
+        label: "Transit Permit",
+        icon: Truck,
+        emptyHint:
+          "The transit permit will appear here after your booking is created and wagons are allocated.",
+      },
+    ];
+  }
+
+  return [
+    {
+      value: "declaration",
+      label: "Declaration",
+      icon: FileText,
+      emptyHint:
+        "Global Logistics will upload your customs declaration documents here once they are ready.",
+    },
+    {
+      value: "duty",
+      label: "Duty notice",
+      icon: Receipt,
+      emptyHint: "Your duty/tax notice and payment slip will appear here when available.",
+    },
+    {
+      value: "transit",
+      label: "Transit Permit",
+      icon: Truck,
+      emptyHint: "The transit permit will appear here once Global Logistics uploads it.",
+    },
+  ];
+}
+
+function defaultSubtitle(tradeDirection: string): string {
+  return tradeDirection === "EXPORT"
+    ? "Declaration, release order, and transit permit shared during your clearance."
+    : "Declaration, duty notice, and transit permit shared during your clearance.";
+}
+
+const OWNER_LABELS: Record<Freight.ClearanceWorkflowFileOwner, string> = {
+  customer: "You",
+  gl_et: "Global Logistics Ethiopia",
+  gl_dj: "Global Logistics Djibouti",
+};
+
+function fileTypeChip(name: string): { ext: string; color: string } {
+  const dot = name.lastIndexOf(".");
+  const ext = dot >= 0 ? name.slice(dot + 1).toUpperCase() : "FILE";
+  const color =
+    ext === "PDF"
+      ? "#D64545"
+      : ["PNG", "JPG", "JPEG", "GIF", "WEBP", "SVG"].includes(ext)
+        ? "#2F9E6E"
+        : "#6B7C8E";
+  return { ext: ext.slice(0, 4), color };
+}
+
+export interface ClearanceUploadedDocumentsPanelProps {
+  files: Freight.ClearanceWorkflowFile[];
+  tradeDirection?: string;
+  onView: (file: { name: string; url: string; mimeType?: string }) => void;
+  onDownload?: (file: { id: string; name: string }) => void;
+  title?: string;
+  subtitle?: string;
+  embedded?: boolean;
+}
+
+export function ClearanceUploadedDocumentsPanel({
+  files,
+  tradeDirection = "IMPORT",
+  onView,
+  onDownload,
+  title = "Customs documents",
+  subtitle,
+  embedded = false,
+}: ClearanceUploadedDocumentsPanelProps) {
+  const tabConfig = useMemo(
+    () => tabConfigForTradeDirection(tradeDirection),
+    [tradeDirection],
+  );
+  const isExport = tradeDirection === "EXPORT";
+  const visibleFiles = useMemo(
+    () => (isExport ? files.filter((f) => f.category !== "duty") : files),
+    [files, isExport],
+  );
+  const uploadedCount = visibleFiles.filter((f) => f.file).length;
+
+  const defaultTab =
+    tabConfig.find((tab) =>
+      visibleFiles.some((f) => f.category === tab.value && f.file),
+    )?.value ?? tabConfig[0]?.value ?? "declaration";
+
+  const resolvedSubtitle = subtitle ?? defaultSubtitle(tradeDirection);
+
+  const content = (
+    <Tabs defaultValue={defaultTab} keepMounted={false}>
+      <Tabs.List mb="md" style={{ flexWrap: "wrap", gap: 6 }}>
+        {tabConfig.map((tab) => {
+          const count = visibleFiles.filter(
+            (f) => f.category === tab.value && f.file,
+          ).length;
+          const Icon = tab.icon;
+          return (
+            <Tabs.Tab
+              key={tab.value}
+              value={tab.value}
+              leftSection={<Icon size={14} />}
+              rightSection={
+                count > 0 ? (
+                  <Badge size="xs" variant="light" color="edr-green" circle>
+                    {count}
+                  </Badge>
+                ) : undefined
+              }
+              styles={{
+                tab: { borderRadius: 10, fontWeight: 600, padding: "8px 14px" },
+              }}
+            >
+              {tab.label}
+            </Tabs.Tab>
+          );
+        })}
+      </Tabs.List>
+
+      {tabConfig.map((tab) => {
+        const items = visibleFiles.filter(
+          (f) => f.category === tab.value && f.file,
+        );
+        const Icon = tab.icon;
+
+        return (
+          <Tabs.Panel key={tab.value} value={tab.value}>
+            {items.length > 0 ? (
+              <Stack gap={10}>
+                {items.map((item) => (
+                  <WorkflowFileRow
+                    key={item.code}
+                    item={item}
+                    onView={onView}
+                    onDownload={onDownload}
+                  />
+                ))}
+              </Stack>
+            ) : (
+              <EmptyTabState icon={Icon} hint={tab.emptyHint} />
+            )}
+          </Tabs.Panel>
+        );
+      })}
+    </Tabs>
+  );
+
+  if (embedded) return content;
+
+  return (
+    <Paper
+      withBorder
+      radius="lg"
+      p="lg"
+      style={{
+        borderColor: "#CDEBDD",
+        background: "linear-gradient(160deg, #F6FBF8 0%, #FFFFFF 55%)",
+        boxShadow: "0 4px 18px rgba(14,163,113,0.06)",
+      }}
+    >
+      <Group gap={10} mb={4} wrap="nowrap">
+        <Box
+          style={{
+            width: 36,
+            height: 36,
+            borderRadius: 10,
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            background: `${GREEN}18`,
+            color: GREEN,
+          }}
+        >
+          <FileText size={18} />
+        </Box>
+        <Box>
+          <Group gap={8} wrap="nowrap">
+            <Text fw={700} fz={15} style={{ color: INK }}>
+              {title}
+            </Text>
+            {uploadedCount > 0 ? (
+              <Badge size="sm" variant="light" color="edr-green" radius="sm">
+                {uploadedCount} file{uploadedCount === 1 ? "" : "s"}
+              </Badge>
+            ) : null}
+          </Group>
+          <Text fz={12} c="dimmed" mt={2}>
+            {resolvedSubtitle}
+          </Text>
+        </Box>
+      </Group>
+      <Box mt="md">{content}</Box>
+    </Paper>
+  );
+}
+
+function WorkflowFileRow({
+  item,
+  onView,
+  onDownload,
+}: {
+  item: Freight.ClearanceWorkflowFile;
+  onView: (file: { name: string; url: string; mimeType?: string }) => void;
+  onDownload?: (file: { id: string; name: string }) => void;
+}) {
+  const file = item.file;
+  if (!file) return null;
+
+  const { ext, color } = fileTypeChip(file.name);
+  const canPreview = isViewable({ name: file.name, url: file.url });
+
+  return (
+    <Group
+      justify="space-between"
+      wrap="nowrap"
+      p="sm"
+      style={{
+        borderRadius: 14,
+        border: `1px solid ${GREEN}44`,
+        background: "linear-gradient(135deg, #F2FBF6 0%, #FFFFFF 72%)",
+      }}
+    >
+      <Group gap={12} wrap="nowrap" style={{ minWidth: 0 }}>
+        <Box
+          style={{
+            width: 44,
+            height: 44,
+            flexShrink: 0,
+            borderRadius: 10,
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "center",
+            justifyContent: "center",
+            background: `${color}14`,
+            color,
+          }}
+        >
+          <FileText size={16} />
+          <Text fz={8} fw={800} mt={1} style={{ letterSpacing: "0.04em" }}>
+            {ext}
+          </Text>
+        </Box>
+        <Box style={{ minWidth: 0 }}>
+          <Text fz={14} fw={600} style={{ color: INK }} truncate>
+            {item.label}
+          </Text>
+          <Group gap={6} wrap="nowrap" mt={3}>
+            <Badge size="xs" variant="light" color="edr-green" radius="sm">
+              Uploaded
+            </Badge>
+            <Badge size="xs" variant="light" color="gray" radius="sm" tt="none">
+              {OWNER_LABELS[item.uploadedBy]}
+            </Badge>
+          </Group>
+          <Text fz={12} c="dimmed" truncate mt={2}>
+            {file.name}
+          </Text>
+        </Box>
+      </Group>
+      <Group gap={6} wrap="nowrap">
+        {canPreview ? (
+          <Tooltip label="Preview">
+            <Button
+              size="compact-xs"
+              variant="light"
+              color="edr-green"
+              radius="md"
+              leftSection={<Eye size={13} />}
+              onClick={() => onView({ name: file.name, url: file.url })}
+            >
+              View
+            </Button>
+          </Tooltip>
+        ) : null}
+        {onDownload ? (
+          <Tooltip label="Download">
+            <Button
+              size="compact-xs"
+              variant="default"
+              radius="md"
+              leftSection={<Download size={13} />}
+              onClick={() => onDownload({ id: file.id, name: file.name })}
+            >
+              Download
+            </Button>
+          </Tooltip>
+        ) : null}
+      </Group>
+    </Group>
+  );
+}
+
+function EmptyTabState({
+  icon: Icon,
+  hint,
+}: {
+  icon: typeof FileText;
+  hint: string;
+}) {
+  return (
+    <Box
+      py={36}
+      px="md"
+      style={{
+        borderRadius: 14,
+        border: `1px dashed ${BORDER}`,
+        background: "#FAFCFE",
+        textAlign: "center",
+      }}
+    >
+      <Stack gap={8} align="center">
+        <ThemeIcon variant="light" color="gray" radius="xl" size={44}>
+          <Icon size={20} />
+        </ThemeIcon>
+        <Text fz={13} c="dimmed" maw={360}>
+          {hint}
+        </Text>
+      </Stack>
+    </Box>
+  );
+}
+
+/** @deprecated Use ClearanceUploadedDocumentsPanel for phased customs UI. */
+export function ClearanceWorkflowFilesSection({
+  files,
+  onView,
+  onDownload,
+  title,
+}: {
+  files: Freight.ClearanceWorkflowFile[];
+  onView: (file: { name: string; url: string; mimeType?: string }) => void;
+  onDownload?: (file: { id: string; name: string }) => void;
+  title?: string;
+}) {
+  if (files.length === 0) return null;
+  return (
+    <ClearanceUploadedDocumentsPanel
+      files={files}
+      onView={onView}
+      onDownload={onDownload}
+      title={title}
+    />
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/components/contracts/ContractSignSuccessModal.tsx b/apps/edr-freight-web/portal/src/components/contracts/ContractSignSuccessModal.tsx
new file mode 100644
index 000000000..903568634
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/components/contracts/ContractSignSuccessModal.tsx
@@ -0,0 +1,43 @@
+import { Button, Group, Modal, Stack, Text, ThemeIcon } from "@mantine/core";
+import { CheckCircle2 } from "lucide-react";
+
+export interface ContractSignSuccessModalProps {
+  opened: boolean;
+  onClose: () => void;
+  reference: string;
+  message?: string;
+  confirmLabel?: string;
+}
+
+export function ContractSignSuccessModal({
+  opened,
+  onClose,
+  reference,
+  message = "Your signature has been recorded on the contract.",
+  confirmLabel = "Back to contract",
+}: ContractSignSuccessModalProps) {
+  return (
+    <Modal
+      opened={opened}
+      onClose={onClose}
+      title="Contract signed successfully"
+      centered
+      radius="lg"
+    >
+      <Stack gap="md" align="center" ta="center">
+        <ThemeIcon size={56} radius="xl" color="edr-green" variant="light">
+          <CheckCircle2 size={28} />
+        </ThemeIcon>
+        <Text fw={600}>{reference}</Text>
+        <Text size="sm" c="dimmed">
+          {message}
+        </Text>
+        <Group justify="center" mt="xs">
+          <Button color="edr-green" onClick={onClose}>
+            {confirmLabel}
+          </Button>
+        </Group>
+      </Stack>
+    </Modal>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/components/contracts/PortalFileDropzone.tsx b/apps/edr-freight-web/portal/src/components/contracts/PortalFileDropzone.tsx
new file mode 100644
index 000000000..018637bd9
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/components/contracts/PortalFileDropzone.tsx
@@ -0,0 +1,232 @@
+import { useEffect, useMemo, useRef, useState } from "react";
+import {
+  ActionIcon,
+  Box,
+  Button,
+  Group,
+  Stack,
+  Text,
+  ThemeIcon,
+  UnstyledButton,
+} from "@mantine/core";
+import { Eye, FileText, Trash2, UploadCloud } from "lucide-react";
+import { isViewable } from "@edr/ui-common";
+
+import { BORDER, GREEN, INK } from "@/pages/contracts/contract-ui";
+
+export interface PortalFileDropzoneProps {
+  label: string;
+  description?: string;
+  value: File | null;
+  onChange: (file: File | null) => void;
+  accept?: string;
+  onPreview?: (file: { name: string; url: string; mimeType?: string | null }) => void;
+  disabled?: boolean;
+  replaceMode?: boolean;
+}
+
+function formatBytes(bytes: number): string {
+  if (bytes === 0) return "0 B";
+  const k = 1024;
+  const sizes = ["B", "KB", "MB", "GB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return `${parseFloat((bytes / k ** i).toFixed(1))} ${sizes[i]}`;
+}
+
+function isImageFile(file: File): boolean {
+  if (file.type.startsWith("image/")) return true;
+  const ext = file.name.split(".").pop()?.toLowerCase() ?? "";
+  return ["png", "jpg", "jpeg", "webp", "gif", "bmp", "svg"].includes(ext);
+}
+
+export function PortalFileDropzone({
+  label,
+  description,
+  value,
+  onChange,
+  accept = "application/pdf,image/*",
+  onPreview,
+  disabled = false,
+  replaceMode = false,
+}: PortalFileDropzoneProps) {
+  const inputRef = useRef<HTMLInputElement>(null);
+  const [dragOver, setDragOver] = useState(false);
+
+  const previewUrl = useMemo(
+    () => (value ? URL.createObjectURL(value) : null),
+    [value],
+  );
+
+  useEffect(() => {
+    return () => {
+      if (previewUrl) URL.revokeObjectURL(previewUrl);
+    };
+  }, [previewUrl]);
+
+  const pickFile = (file: File | null) => {
+    if (disabled) return;
+    onChange(file);
+  };
+
+  const handleDrop = (e: React.DragEvent) => {
+    e.preventDefault();
+    setDragOver(false);
+    if (disabled) return;
+    const file = e.dataTransfer.files[0];
+    if (file) pickFile(file);
+  };
+
+  if (value && previewUrl) {
+    const canPreview =
+      onPreview && isViewable({ name: value.name, url: previewUrl, mimeType: value.type });
+    const image = isImageFile(value);
+
+    return (
+      <Stack gap={6}>
+        <Text fz={13} fw={700} style={{ color: INK }}>
+          {label}
+        </Text>
+        <Group
+          gap={12}
+          wrap="nowrap"
+          p="sm"
+          style={{
+            borderRadius: 14,
+            border: `1px solid ${GREEN}`,
+            background: "linear-gradient(135deg, #F2FBF6 0%, #fff 75%)",
+            minWidth: 0,
+          }}
+        >
+          {image ? (
+            <UnstyledButton
+              onClick={() =>
+                canPreview &&
+                onPreview?.({ name: value.name, url: previewUrl, mimeType: value.type })
+              }
+              style={{
+                width: 52,
+                height: 52,
+                flexShrink: 0,
+                borderRadius: 10,
+                overflow: "hidden",
+                border: `1px solid ${BORDER}`,
+                cursor: canPreview ? "pointer" : "default",
+              }}
+            >
+              <img
+                src={previewUrl}
+                alt=""
+                style={{ width: "100%", height: "100%", objectFit: "cover" }}
+              />
+            </UnstyledButton>
+          ) : (
+            <ThemeIcon variant="light" color="edr-green" radius="md" size={52}>
+              <FileText size={22} />
+            </ThemeIcon>
+          )}
+          <Box style={{ minWidth: 0, flex: 1 }}>
+            <Text fz={11} fw={700} c="edr-green" tt="uppercase">
+              Ready to upload
+            </Text>
+            <Text fz={13} fw={600} style={{ color: INK }} truncate>
+              {value.name}
+            </Text>
+            <Text fz={11} c="dimmed">
+              {formatBytes(value.size)}
+            </Text>
+          </Box>
+          <Group gap={6} wrap="nowrap">
+            {canPreview ? (
+              <Button
+                size="compact-xs"
+                variant="light"
+                color="edr-green"
+                leftSection={<Eye size={13} />}
+                onClick={() =>
+                  onPreview({ name: value.name, url: previewUrl, mimeType: value.type })
+                }
+              >
+                Preview
+              </Button>
+            ) : null}
+            <ActionIcon
+              variant="subtle"
+              color="red"
+              radius="md"
+              aria-label="Remove file"
+              onClick={() => pickFile(null)}
+              disabled={disabled}
+            >
+              <Trash2 size={15} />
+            </ActionIcon>
+          </Group>
+        </Group>
+      </Stack>
+    );
+  }
+
+  return (
+    <Stack gap={6}>
+      <Text fz={13} fw={700} style={{ color: INK }}>
+        {label}
+      </Text>
+      {description ? (
+        <Text fz={12} c="dimmed">
+          {description}
+        </Text>
+      ) : null}
+      <Box
+        onDragOver={(e) => {
+          e.preventDefault();
+          if (!disabled) setDragOver(true);
+        }}
+        onDragLeave={() => setDragOver(false)}
+        onDrop={handleDrop}
+        onClick={() => !disabled && inputRef.current?.click()}
+        style={{
+          borderRadius: 14,
+          border: `2px dashed ${dragOver ? GREEN : BORDER}`,
+          background: dragOver ? "#F2FBF6" : "#FAFCFE",
+          padding: "28px 20px",
+          textAlign: "center",
+          cursor: disabled ? "not-allowed" : "pointer",
+          opacity: disabled ? 0.6 : 1,
+          transition: "border-color 120ms ease, background 120ms ease",
+        }}
+      >
+        <input
+          ref={inputRef}
+          type="file"
+          accept={accept}
+          hidden
+          disabled={disabled}
+          onChange={(e) => pickFile(e.target.files?.[0] ?? null)}
+        />
+        <Stack gap={8} align="center">
+          <ThemeIcon
+            variant="light"
+            color={dragOver ? "edr-green" : "gray"}
+            radius="xl"
+            size={48}
+          >
+            <UploadCloud size={24} />
+          </ThemeIcon>
+          <Box>
+            <Text fz={13} fw={600} style={{ color: INK }}>
+              {dragOver
+                ? "Drop to upload"
+                : replaceMode
+                  ? "Drag & drop to replace"
+                  : "Drag & drop your file here"}
+            </Text>
+            <Text fz={12} c="dimmed" mt={4}>
+              or{" "}
+              <span style={{ color: GREEN, fontWeight: 700 }}>browse</span> — PDF or
+              image
+            </Text>
+          </Box>
+        </Stack>
+      </Box>
+    </Stack>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/components/customer-actions/ContractClearanceAction.tsx b/apps/edr-freight-web/portal/src/components/customer-actions/ContractClearanceAction.tsx
new file mode 100644
index 000000000..58fef65e3
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/components/customer-actions/ContractClearanceAction.tsx
@@ -0,0 +1,77 @@
+import { useMemo } from "react";
+import { useQuery } from "@tanstack/react-query";
+import { Button, Modal, Text, type ButtonProps } from "@mantine/core";
+import { AlertCircle, Upload } from "lucide-react";
+
+import { api } from "@/services/api";
+import { ContractClearancePanel } from "@/pages/contracts/ContractClearancePanel";
+import { ModalSafeWrapper } from "./ModalSafeWrapper";
+import { useDisclosure } from "@mantine/hooks";
+
+interface ContractClearanceActionProps {
+  contractId: string;
+  label?: string;
+  size?: ButtonProps["size"];
+  urgent?: boolean;
+}
+
+export function ContractClearanceAction({
+  contractId,
+  label: labelProp,
+  size = "xs",
+  urgent = false,
+}: ContractClearanceActionProps) {
+  const [opened, { open, close }] = useDisclosure(false);
+
+  const { data: clearance } = useQuery({
+    ...api.contracts.getClearance.queryOptions({ input: { id: contractId } }),
+    enabled: opened,
+  });
+
+  const label = useMemo(() => {
+    if (labelProp) return labelProp;
+    const docs = clearance?.documents ?? [];
+    const queried = docs.filter(
+      (d) => d.uploadedBy === "customer" && d.reviewStatus === "QUERIED",
+    ).length;
+    if (queried > 0) return "Update clearance";
+    return urgent ? "Upload clearance" : "Manage clearance";
+  }, [labelProp, clearance, urgent]);
+
+  const Icon = urgent || label.includes("Update") ? AlertCircle : Upload;
+
+  return (
+    <ModalSafeWrapper>
+      <Button
+        size={size}
+        radius="md"
+        fw={700}
+        fz={13}
+        color="edr-green"
+        leftSection={<Icon size={14} />}
+        onClick={(e) => {
+          e.stopPropagation();
+          open();
+        }}
+      >
+        {label}
+      </Button>
+
+      <Modal
+        opened={opened}
+        onClose={close}
+        title={
+          <Text fw={700} fz={16}>
+            Clearance documents
+          </Text>
+        }
+        size="xl"
+        radius="md"
+        centered
+        overlayProps={{ blur: 2, backgroundOpacity: 0.55 }}
+      >
+        <ContractClearancePanel contractId={contractId} bare />
+      </Modal>
+    </ModalSafeWrapper>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/components/customer-actions/ContractCustomerAction.tsx b/apps/edr-freight-web/portal/src/components/customer-actions/ContractCustomerAction.tsx
new file mode 100644
index 000000000..e91f897b4
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/components/customer-actions/ContractCustomerAction.tsx
@@ -0,0 +1,97 @@
+import { Button, Group, type ButtonProps } from "@mantine/core";
+import type { ReactNode } from "react";
+import { useNavigate } from "react-router-dom";
+
+import type { Freight } from "@edr/types";
+
+import { PayNowButton } from "@/pages/bookings/payments/PayNowButton";
+import { ContractClearanceAction } from "./ContractClearanceAction";
+import { deriveContractCustomerAction } from "./deriveContractCustomerAction";
+
+interface ContractCustomerActionProps {
+  contract: Freight.IContract;
+  bookings: Freight.IBooking[];
+  size?: ButtonProps["size"];
+  /** Extra props for list-row button styling (ContractsList). */
+  listStyle?: boolean;
+}
+
+export function ContractCustomerAction({
+  contract,
+  bookings,
+  size = "xs",
+  listStyle = false,
+}: ContractCustomerActionProps) {
+  const navigate = useNavigate();
+  const action = deriveContractCustomerAction(contract, bookings);
+
+  const buttonStyles = listStyle
+    ? {
+        root: {
+          fontWeight: 600,
+          fontSize: 13,
+          paddingInline: 14,
+          whiteSpace: "nowrap" as const,
+          boxShadow: action.primary
+            ? "0 1px 2px rgba(14,163,113,0.25)"
+            : "none",
+        },
+      }
+    : undefined;
+
+  if (action.type === "clearance") {
+    return (
+      <ContractClearanceAction
+        contractId={action.contractId}
+        label={action.label}
+        size={size}
+        urgent={action.urgent}
+      />
+    );
+  }
+
+  if (action.type === "pay") {
+    return <PayNowButton booking={action.booking} label={action.label} size={size} />;
+  }
+
+  const Icon = action.icon;
+  const variant = action.primary ? "filled" : "light";
+
+  return (
+    <Button
+      size={size}
+      radius="md"
+      h={listStyle ? 34 : undefined}
+      variant={variant}
+      color="edr-green"
+      leftSection={<Icon size={15} />}
+      onClick={(e) => {
+        e.stopPropagation();
+        navigate(action.to);
+      }}
+      styles={buttonStyles}
+      fw={listStyle ? undefined : 700}
+      fz={listStyle ? undefined : 13}
+    >
+      {action.label}
+    </Button>
+  );
+}
+
+/** Action column cell: doc button + primary customer action. */
+export function ContractCustomerActionCell({
+  contract,
+  bookings,
+  docButton,
+}: {
+  contract: Freight.IContract;
+  bookings: Freight.IBooking[];
+  docButton: ReactNode;
+}) {
+  return (
+    <Group gap={8} wrap="nowrap" justify="flex-end">
+      {docButton}
+      <ContractCustomerAction contract={contract} bookings={bookings} size="sm" listStyle />
+    </Group>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/components/customer-actions/ModalSafeWrapper.tsx b/apps/edr-freight-web/portal/src/components/customer-actions/ModalSafeWrapper.tsx
new file mode 100644
index 000000000..422afe7e4
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/components/customer-actions/ModalSafeWrapper.tsx
@@ -0,0 +1,15 @@
+import { Box } from "@mantine/core";
+import type { ReactNode } from "react";
+
+/**
+ * Wrap inline row actions that open Mantine modals. Modals portal to document
+ * body but React synthetic events still bubble through the component tree —
+ * without this, clicks inside the modal can trigger a parent row's navigate.
+ */
+export function ModalSafeWrapper({ children }: { children: ReactNode }) {
+  return (
+    <Box component="span" onClick={(e) => e.stopPropagation()}>
+      {children}
+    </Box>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/components/customer-actions/deriveContractCustomerAction.ts b/apps/edr-freight-web/portal/src/components/customer-actions/deriveContractCustomerAction.ts
new file mode 100644
index 000000000..48fb19943
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/components/customer-actions/deriveContractCustomerAction.ts
@@ -0,0 +1,190 @@
+import type { Freight } from "@edr/types";
+import type { LucideIcon } from "lucide-react";
+import {
+  CreditCard,
+  Eye,
+  FileSignature,
+  PackagePlus,
+  PencilLine,
+  RotateCcw,
+  Upload,
+} from "lucide-react";
+
+import { getContractBookingAction } from "@/pages/contracts/contract-booking-action";
+
+const CLEARANCE_IN_PROGRESS_STATUSES = [
+  "AWAITING_CLEARANCE_DOCUMENTS",
+  "CLEARANCE_UNDER_REVIEW",
+];
+
+export function contractNeedsClearanceAction(c: Freight.IContract): {
+  show: boolean;
+  urgent: boolean;
+} {
+  const clearance = (c as { clearanceStatus?: string }).clearanceStatus;
+  const ready =
+    clearance === "CLEARANCE_READY_FOR_BOOKING" ||
+    clearance === "SELF_CLEARED" ||
+    clearance === "ACTIVE_SHIPMENT_IN_PROGRESS";
+  if (ready) return { show: false, urgent: false };
+
+  const awaiting =
+    c.status === "AWAITING_CLEARANCE_DOCUMENTS" ||
+    clearance === "AWAITING_DOCUMENTS";
+  const inProgress =
+    CLEARANCE_IN_PROGRESS_STATUSES.includes(c.status) ||
+    clearance === "AWAITING_DOCUMENTS" ||
+    clearance === "DOCUMENTS_UNDER_REVIEW";
+
+  return { show: inProgress, urgent: awaiting };
+}
+
+export type ContractCustomerAction =
+  | {
+      type: "sign";
+      label: string;
+      to: string;
+      primary: boolean;
+      icon: LucideIcon;
+    }
+  | {
+      type: "navigate";
+      label: string;
+      to: string;
+      primary: boolean;
+      icon: LucideIcon;
+    }
+  | {
+      type: "clearance";
+      contractId: string;
+      label: string;
+      primary: boolean;
+      icon: LucideIcon;
+      urgent: boolean;
+    }
+  | {
+      type: "pay";
+      booking: Freight.IBooking;
+      label: string;
+      primary: boolean;
+      icon: LucideIcon;
+    };
+
+function findPayableBookingForContract(
+  contractId: string,
+  bookings: Freight.IBooking[],
+): Freight.IBooking | null {
+  return (
+    bookings.find((b) => {
+      if (b.contractId !== contractId) return false;
+      if (b.paymentStatus === "PAID") return false;
+      const isGeneral = b.bookingType === "GENERAL_CONTRACT";
+      return isGeneral
+        ? b.status === "FULLY_EXECUTED"
+        : b.status === "SELECTED_FOR_BATCH";
+    }) ?? null
+  );
+}
+
+/** Single best customer action for a contract row (list / home). */
+export function deriveContractCustomerAction(
+  contract: Freight.IContract,
+  bookings: Freight.IBooking[],
+): ContractCustomerAction {
+  const id = contract.id;
+
+  if (contract.status === "CONTRACT_READY") {
+    return {
+      type: "sign",
+      label: "View & sign",
+      to: `/contracts/${id}/view`,
+      primary: true,
+      icon: FileSignature,
+    };
+  }
+
+  if (contract.status === "CHANGES_REQUESTED") {
+    return {
+      type: "navigate",
+      label: "Edit & resubmit",
+      to: `/contracts/${id}`,
+      primary: true,
+      icon: PencilLine,
+    };
+  }
+
+  const payable = findPayableBookingForContract(id, bookings);
+  if (payable) {
+    return {
+      type: "pay",
+      booking: payable,
+      label: "Pay now",
+      primary: true,
+      icon: CreditCard,
+    };
+  }
+
+  const clr = contractNeedsClearanceAction(contract);
+  if (clr.show) {
+    return {
+      type: "clearance",
+      contractId: id,
+      label: clr.urgent ? "Upload clearance" : "Update clearance",
+      primary: true,
+      icon: Upload,
+      urgent: clr.urgent,
+    };
+  }
+
+  if (
+    contract.customsClearingEnabled &&
+    ["CLEARANCE_READY_FOR_BOOKING", "ACTIVE_SHIPMENT_IN_PROGRESS"].includes(
+      contract.status,
+    )
+  ) {
+    return {
+      type: "navigate",
+      label: "View",
+      to: `/contracts/${id}`,
+      primary: false,
+      icon: Eye,
+    };
+  }
+
+  const bookingAction = getContractBookingAction(contract, bookings);
+  if (bookingAction.kind === "book") {
+    return {
+      type: "navigate",
+      label: "Book shipment",
+      to: bookingAction.to,
+      primary: true,
+      icon: PackagePlus,
+    };
+  }
+  if (bookingAction.kind === "rebook") {
+    return {
+      type: "navigate",
+      label: "Re-book shipment",
+      to: bookingAction.to,
+      primary: true,
+      icon: RotateCcw,
+    };
+  }
+  if (bookingAction.kind === "request") {
+    return {
+      type: "navigate",
+      label: "Request shipment",
+      to: bookingAction.to,
+      primary: true,
+      icon: PackagePlus,
+    };
+  }
+
+  return {
+    type: "navigate",
+    label: "View",
+    to: `/contracts/${id}`,
+    primary: false,
+    icon: Eye,
+  };
+}
diff --git a/apps/edr-freight-web/portal/src/constants/URLS.ts b/apps/edr-freight-web/portal/src/constants/URLS.ts
index 22f2a441b..b02ae63bf 100644
--- a/apps/edr-freight-web/portal/src/constants/URLS.ts
+++ b/apps/edr-freight-web/portal/src/constants/URLS.ts
@@ -118,11 +118,13 @@ export const URL_CONSTANTS = {
     CONFIRM_SUBMIT: (id: string) => `/api/contracts/${id}/confirm-submit`,
     CONTRACT_GENERATE: (id: string) => `/api/contracts/${id}/contract/generate`,
     CONTRACT_VIEW: (id: string) => `/api/contracts/${id}/contract/view`,
+    CONTRACT_DOCUMENT: (id: string) => `/api/contracts/${id}/contract/document`,
     CONTRACT_SIGN: (id: string) => `/api/contracts/${id}/contract/sign`,
     RENEW: (id: string) => `/api/contracts/${id}/renew`,
     CLEARANCE: (id: string) => `/api/contracts/${id}/clearance`,
     CLEARANCE_DOCUMENTS: (id: string) =>
       `/api/contracts/${id}/clearance/documents`,
+    CLEARANCE_DUTY_SLIP: (id: string) => `/api/contracts/${id}/clearance/duty-slip`,
     BOOKINGS: (id: string) => `/api/contracts/${id}/bookings`,
     MILESTONES: (id: string) => `/api/contracts/${id}/milestones`,
     BOOKING_MILESTONES: (bookingId: string) =>
@@ -130,6 +132,9 @@ export const URL_CONSTANTS = {
     BOOKING_DUTY_SLIP: (bookingId: string) =>
       `/api/contracts/bookings/${bookingId}/duty-slip`,
     CAPACITY: (id: string) => `/api/contracts/${id}/capacity`,
+    BOOKING_REQUESTS: (id: string) => `/api/contracts/${id}/booking-requests`,
+    BOOKING_REQUEST_CANCEL: (reqId: string) =>
+      `/api/contracts/booking-requests/${reqId}/cancel`,
   },
 
   TRAIN_SCHEDULING: {
@@ -147,6 +152,16 @@ export const URL_CONSTANTS = {
   BILLING: {
     MY_INVOICES: "/api/billing/my-invoices",
     MY_INVOICE_BY_ID: (id: string) => `/api/billing/my-invoices/${id}`,
+    MY_INVOICE_DOCUMENT: (id: string) => `/api/billing/my-invoices/${id}/document`,
+    MY_INVOICE_RECEIPT: (id: string) => `/api/billing/my-invoices/${id}/receipt`,
     PAY_INVOICE: (id: string) => `/api/billing/my-invoices/${id}/pay`,
   },
+
+  WAREHOUSE_INVOICES: {
+    FOR_BOOKING: (bookingId: string) =>
+      `/api/bookings/${bookingId}/warehouse-fee-invoices`,
+    BY_ID: (id: string) => `/api/warehouse-fee-invoices/${id}`,
+    DOCUMENT: (id: string) => `/api/warehouse-fee-invoices/${id}/document`,
+    RECEIPT: (id: string) => `/api/warehouse-fee-invoices/${id}/receipt`,
+  },
 };
diff --git a/apps/edr-freight-web/portal/src/constants/apiConfig.ts b/apps/edr-freight-web/portal/src/constants/apiConfig.ts
index 07496364b..a285a8fd2 100644
--- a/apps/edr-freight-web/portal/src/constants/apiConfig.ts
+++ b/apps/edr-freight-web/portal/src/constants/apiConfig.ts
@@ -1,5 +1,4 @@
-export const API_BASE_URL = 'https://edrfreightapi.triaplc.com';
-//export const API_BASE_URL = 'http://localhost:3001';
+export const API_BASE_URL = import.meta.env.VITE_BASE_API_URL;
 
 /**
  * URL that streams an uploaded file through the API by its UUID. Routes the
diff --git a/apps/edr-freight-web/portal/src/hooks/useScrollToHash.ts b/apps/edr-freight-web/portal/src/hooks/useScrollToHash.ts
new file mode 100644
index 000000000..90f704c16
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/hooks/useScrollToHash.ts
@@ -0,0 +1,30 @@
+import { useEffect } from "react";
+import { useLocation } from "react-router-dom";
+
+/**
+ * Scroll to the element whose `id` matches the URL hash. Retries for a short
+ * window so it still lands on sections that mount after an async fetch (the app
+ * has no router-level hash handling). Deep-link targets give a card an `id`.
+ */
+export function useScrollToHash(): void {
+  const { hash } = useLocation();
+
+  useEffect(() => {
+    if (!hash) return;
+    const id = decodeURIComponent(hash.slice(1));
+    let tries = 0;
+    let timer: ReturnType<typeof setTimeout>;
+
+    const tick = () => {
+      const el = document.getElementById(id);
+      if (el) {
+        el.scrollIntoView({ behavior: "smooth", block: "start" });
+        return;
+      }
+      if (tries++ < 20) timer = setTimeout(tick, 100);
+    };
+
+    timer = setTimeout(tick, 100);
+    return () => clearTimeout(timer);
+  }, [hash]);
+}
diff --git a/apps/edr-freight-web/portal/src/main.tsx b/apps/edr-freight-web/portal/src/main.tsx
index 56d6838df..d932bb0f3 100644
--- a/apps/edr-freight-web/portal/src/main.tsx
+++ b/apps/edr-freight-web/portal/src/main.tsx
@@ -4,6 +4,7 @@ import { BrowserRouter } from "react-router-dom";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { MantineProvider } from "@mantine/core";
 import "@mantine/core/styles.css";
+import "@mantine/dates/styles.css";
 import "@edr/ui-common/styles.css";
 import "../index.css";
 import "@edr/ui-common/theme.css";
diff --git a/apps/edr-freight-web/portal/src/pages/MyPortalPage/MyPortalPage.tsx b/apps/edr-freight-web/portal/src/pages/MyPortalPage/MyPortalPage.tsx
index c9e073eb5..5cc4fe5cf 100644
--- a/apps/edr-freight-web/portal/src/pages/MyPortalPage/MyPortalPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/MyPortalPage/MyPortalPage.tsx
@@ -90,6 +90,11 @@ export default function MyPortalPage() {
         dashboardLoading={dashboardQuery.isPending}
       />
 
+      {/* <ActionNeededSection
+        items={deriveActionItems(allContracts, allBookings)}
+        contracts={allContracts}
+      /> */}
+
       {/* Contracts + shipments side by side — the two primary tables. */}
       <Grid align="stretch">
         <Grid.Col span={{ base: 12, lg: 6 }}>
diff --git a/apps/edr-freight-web/portal/src/pages/MyPortalPage/actions.ts b/apps/edr-freight-web/portal/src/pages/MyPortalPage/actions.ts
index 82ab6d5a6..833aa6ce7 100644
--- a/apps/edr-freight-web/portal/src/pages/MyPortalPage/actions.ts
+++ b/apps/edr-freight-web/portal/src/pages/MyPortalPage/actions.ts
@@ -1,5 +1,7 @@
 import type { Freight } from "@edr/types";
 
+import { contractNeedsClearanceAction } from "@/components/customer-actions/deriveContractCustomerAction";
+
 /** A pending customer action surfaced on the home "needs attention" card. */
 export interface ActionItem {
   id: string;
@@ -15,46 +17,11 @@ export interface ActionItem {
   urgent?: boolean;
 }
 
-// Contract statuses that mean clearance is in progress (Path A or B). A queried
-// document flips the contract back to AWAITING_CLEARANCE_DOCUMENTS, but the panel
-// also allows re-upload while UNDER_REVIEW — so surface both as actionable.
-const CLEARANCE_IN_PROGRESS_STATUSES = [
-  "AWAITING_CLEARANCE_DOCUMENTS",
-  "CLEARANCE_UNDER_REVIEW",
-];
-
-/**
- * Whether a contract has a clearance step that needs the customer to upload /
- * re-upload documents. Uses contract status AND clearanceStatus so a query is
- * caught even if only one field reflects it. Excludes the ready / completed gates.
- */
-function contractNeedsClearance(c: Freight.IContract): {
-  show: boolean;
-  urgent: boolean;
-} {
-  const clearance = (c as { clearanceStatus?: string }).clearanceStatus;
-  const ready =
-    clearance === "CLEARANCE_READY_FOR_BOOKING" ||
-    clearance === "SELF_CLEARED" ||
-    clearance === "ACTIVE_SHIPMENT_IN_PROGRESS";
-  if (ready) return { show: false, urgent: false };
-
-  const awaiting =
-    c.status === "AWAITING_CLEARANCE_DOCUMENTS" ||
-    clearance === "AWAITING_DOCUMENTS";
-  const inProgress =
-    CLEARANCE_IN_PROGRESS_STATUSES.includes(c.status) ||
-    clearance === "AWAITING_DOCUMENTS" ||
-    clearance === "DOCUMENTS_UNDER_REVIEW";
-
-  return { show: inProgress, urgent: awaiting };
-}
-
 /**
  * Derive the list of pending customer actions from the customer's contracts and
  * bookings. A contract in AWAITING_CLEARANCE_DOCUMENTS (initial upload or a
  * re-upload after a query) is flagged urgent so the home card shows an upload
- * button. See {@link contractNeedsClearance}.
+ * button. See {@link contractNeedsClearanceAction}.
  */
 export function deriveActionItems(
   contracts: Freight.IContract[],
@@ -73,7 +40,7 @@ export function deriveActionItems(
       });
       continue;
     }
-    const clr = contractNeedsClearance(c);
+    const clr = contractNeedsClearanceAction(c);
     if (clr.show) {
       items.push({
         id: `clearance-${c.id}`,
diff --git a/apps/edr-freight-web/portal/src/pages/MyPortalPage/components/ActionNeededSection.tsx b/apps/edr-freight-web/portal/src/pages/MyPortalPage/components/ActionNeededSection.tsx
index 743b8d89b..a68a72280 100644
--- a/apps/edr-freight-web/portal/src/pages/MyPortalPage/components/ActionNeededSection.tsx
+++ b/apps/edr-freight-web/portal/src/pages/MyPortalPage/components/ActionNeededSection.tsx
@@ -1,6 +1,6 @@
 import { useMemo, useState } from "react";
 import { useNavigate } from "react-router-dom";
-import { useMutation, useQueries } from "@tanstack/react-query";
+import { useMutation, useQueries, useQuery } from "@tanstack/react-query";
 import { Badge, Box, Button, Group, Modal, Stack, Text } from "@mantine/core";
 import {
   AlertTriangle,
@@ -13,7 +13,10 @@ import {
 import type { Freight } from "@edr/types";
 
 import { api } from "@/services/api";
+import { ModalSafeWrapper } from "@/components/customer-actions/ModalSafeWrapper";
 import { paymentsService, type PaymentMethod } from "@/services/payments.service";
+import { invoicesService } from "@/services/invoices.service";
+import { isPayable } from "@/pages/billing/invoice-ui";
 import { ContractClearancePanel } from "@/pages/contracts/ContractClearancePanel";
 import { PaymentMethodModal } from "@/pages/bookings/BookingDetailPage/components/PaymentMethodModal";
 import { Card } from "./Card";
@@ -117,17 +120,37 @@ export function ActionNeededSection({
     [clearanceItems, baseItems],
   ).sort((a, b) => Number(b.urgent ?? 0) - Number(a.urgent ?? 0));
 
-  // Mirror ReadonlyBookingView: POST /payments/initiate returns the provider's
-  // redirect (clientAction.url); fall back to the public checkout page.
+  // Billing is invoice-centric — resolve the booking's currently payable
+  // invoice before paying it (mirrors ReadonlyBookingView).
+  const { data: payItemInvoices = [] } = useQuery({
+    queryKey: ["booking-invoices", payItem?.targetId],
+    queryFn: () => invoicesService.listForSource("booking", payItem!.targetId),
+    enabled: payItem !== null,
+  });
+  const payableInvoiceId = payItemInvoices.find((inv) =>
+    isPayable(inv.status),
+  )?.id;
+
   const payMutation = useMutation({
-    mutationFn: (method: PaymentMethod) =>
-      api.payments.initiate.call({ bookingId: payItem!.targetId, method }),
+    mutationFn: (method: PaymentMethod) => {
+      if (!payableInvoiceId) {
+        throw new Error(
+          "No payable invoice found for this booking yet. Please refresh or contact support.",
+        );
+      }
+      return api.invoices.pay.call({
+        id: payableInvoiceId,
+        payload: { method, platform: "web" },
+      });
+    },
     onSuccess: (data, method) => {
-      const bookingId = payItem!.targetId;
       const url =
         data?.clientAction?.type === "REDIRECT" && data.clientAction.url
           ? data.clientAction.url
-          : paymentsService.checkoutUrl({ bookingId, method });
+          : paymentsService.checkoutUrlForInvoice({
+              invoiceId: payableInvoiceId!,
+              method,
+            });
       window.location.href = url;
     },
   });
@@ -246,43 +269,45 @@ export function ActionNeededSection({
         })}
       </Stack>
 
-      <Modal
-        opened={clearanceId !== null}
-        onClose={() => setClearanceId(null)}
-        title={
-          <Text fw={700} fz={16}>
-            Clearance documents
-          </Text>
-        }
-        size="xl"
-        radius="md"
-        centered
-        overlayProps={{ blur: 2, backgroundOpacity: 0.55 }}
-      >
-        {clearanceId && (
-          <ContractClearancePanel contractId={clearanceId} bare />
-        )}
-      </Modal>
-
-      <PaymentMethodModal
-        opened={payItem !== null}
-        onClose={() => {
-          if (!payMutation.isPending) {
-            setPayItem(null);
-            payMutation.reset();
+      <ModalSafeWrapper>
+        <Modal
+          opened={clearanceId !== null}
+          onClose={() => setClearanceId(null)}
+          title={
+            <Text fw={700} fz={16}>
+              Clearance documents
+            </Text>
           }
-        }}
-        currency={undefined}
-        processing={payMutation.isPending}
-        error={
-          payMutation.isError
-            ? payMutation.error instanceof Error
-              ? payMutation.error.message
-              : "Could not start payment. Please try again."
-            : null
-        }
-        onConfirm={(method) => payMutation.mutate(method)}
-      />
+          size="xl"
+          radius="md"
+          centered
+          overlayProps={{ blur: 2, backgroundOpacity: 0.55 }}
+        >
+          {clearanceId && (
+            <ContractClearancePanel contractId={clearanceId} bare />
+          )}
+        </Modal>
+
+        <PaymentMethodModal
+          opened={payItem !== null}
+          onClose={() => {
+            if (!payMutation.isPending) {
+              setPayItem(null);
+              payMutation.reset();
+            }
+          }}
+          currency={undefined}
+          processing={payMutation.isPending}
+          error={
+            payMutation.isError
+              ? payMutation.error instanceof Error
+                ? payMutation.error.message
+                : "Could not start payment. Please try again."
+              : null
+          }
+          onConfirm={(method) => payMutation.mutate(method)}
+        />
+      </ModalSafeWrapper>
     </Card>
   );
 }
diff --git a/apps/edr-freight-web/portal/src/pages/MyPortalPage/components/RecentContractsSection.tsx b/apps/edr-freight-web/portal/src/pages/MyPortalPage/components/RecentContractsSection.tsx
index 14ac28b2b..95a7fb19f 100644
--- a/apps/edr-freight-web/portal/src/pages/MyPortalPage/components/RecentContractsSection.tsx
+++ b/apps/edr-freight-web/portal/src/pages/MyPortalPage/components/RecentContractsSection.tsx
@@ -1,13 +1,13 @@
 import { Box, Button, Group, Skeleton, Stack, Text } from "@mantine/core";
 import { memo } from "react";
 import { useNavigate } from "react-router-dom";
-import { ArrowRight, FileSignature, Package, Plus, RefreshCw } from "lucide-react";
+import { Plus } from "lucide-react";
 import type { Freight } from "@edr/types";
+import { ContractCustomerAction } from "@/components/customer-actions/ContractCustomerAction";
 import {
   ContractDocButton,
   ContractStatusBadge,
 } from "@/pages/contracts/contract-ui";
-import { getContractBookingAction } from "@/pages/contracts/contract-booking-action";
 import { Card } from "./Card";
 import { EmptyState } from "./EmptyState";
 
@@ -64,8 +64,6 @@ export const RecentContractsSection = memo(function RecentContractsSection({
           {contracts.map((c) => {
             const isGeneral = c.contractKind === "GENERAL";
             const isContainer = c.freightType === "CONTAINER";
-            const canSign = c.status === "CONTRACT_READY";
-            const bookingAction = getContractBookingAction(c, bookings);
             return (
               <Group
                 key={c.id}
@@ -96,52 +94,11 @@ export const RecentContractsSection = memo(function RecentContractsSection({
                     onClick={(e) => e.stopPropagation()}
                   />
                   <ContractStatusBadge status={c.status} />
-                  {canSign ? (
-                    <Button
-                      size="xs"
-                      radius="md"
-                      color="edr-green"
-                      leftSection={<FileSignature size={13} />}
-                      onClick={(e) => {
-                        e.stopPropagation();
-                        navigate(`/contracts/${c.id}`);
-                      }}
-                    >
-                      Sign
-                    </Button>
-                  ) : bookingAction.kind !== "none" ? (
-                    <Button
-                      size="xs"
-                      radius="md"
-                      color="edr-green"
-                      leftSection={
-                        bookingAction.kind === "rebook" ? (
-                          <RefreshCw size={13} />
-                        ) : (
-                          <Package size={13} />
-                        )
-                      }
-                      onClick={(e) => {
-                        e.stopPropagation();
-                        navigate(bookingAction.to);
-                      }}
-                    >
-                      {bookingAction.kind === "rebook" ? "Re-book" : "Book"}
-                    </Button>
-                  ) : (
-                    <Button
-                      size="xs"
-                      radius="md"
-                      variant="default"
-                      rightSection={<ArrowRight size={13} />}
-                      onClick={(e) => {
-                        e.stopPropagation();
-                        navigate(`/contracts/${c.id}`);
-                      }}
-                    >
-                      Open
-                    </Button>
-                  )}
+                  <ContractCustomerAction
+                    contract={c}
+                    bookings={bookings}
+                    size="xs"
+                  />
                 </Group>
               </Group>
             );
diff --git a/apps/edr-freight-web/portal/src/pages/MyPortalPage/constants.ts b/apps/edr-freight-web/portal/src/pages/MyPortalPage/constants.ts
index ea5567ab8..44ec5809e 100644
--- a/apps/edr-freight-web/portal/src/pages/MyPortalPage/constants.ts
+++ b/apps/edr-freight-web/portal/src/pages/MyPortalPage/constants.ts
@@ -518,9 +518,12 @@ export const INVOICE_BADGE: Record<
   { label: string; bg: string; text: string }
 > = {
   [Freight.InvoiceStatus.Draft]: { label: "Draft", bg: "edr-slate-soft", text: "edr-slate" },
+  [Freight.InvoiceStatus.Issued]: { label: "Due soon", bg: "edr-amber-soft", text: "edr-amber-text" },
   [Freight.InvoiceStatus.Pending]: { label: "Due soon", bg: "edr-amber-soft", text: "edr-amber-text" },
+  [Freight.InvoiceStatus.PartiallyPaid]: { label: "Partially paid", bg: "edr-amber-soft", text: "edr-amber-text" },
   [Freight.InvoiceStatus.Paid]: { label: "Paid", bg: "edr-soft", text: "edr-green.7" },
   [Freight.InvoiceStatus.Overdue]: { label: "Overdue", bg: "edr-red-soft", text: "edr-red" },
   [Freight.InvoiceStatus.Cancelled]: { label: "Cancelled", bg: "edr-slate-soft", text: "edr-slate" },
   [Freight.InvoiceStatus.Refunded]: { label: "Refunded", bg: "edr-blue-soft", text: "edr-blue" },
+  [Freight.InvoiceStatus.Expired]: { label: "Expired", bg: "edr-red-soft", text: "edr-red" },
 };
diff --git a/apps/edr-freight-web/portal/src/pages/billing/InvoiceDetailPage.tsx b/apps/edr-freight-web/portal/src/pages/billing/InvoiceDetailPage.tsx
index 510c7aad7..888a09c1a 100644
--- a/apps/edr-freight-web/portal/src/pages/billing/InvoiceDetailPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/billing/InvoiceDetailPage.tsx
@@ -1,3 +1,4 @@
+import { useEffect, useState } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 import { useMutation, useQuery } from "@tanstack/react-query";
 import {
@@ -9,15 +10,32 @@ import {
   Group,
   Loader,
   Paper,
+  Select,
   SimpleGrid,
   Stack,
   Table,
   Text,
   Title,
 } from "@mantine/core";
-import { ArrowLeft, CreditCard, Info } from "lucide-react";
+import {
+  ArrowLeft,
+  CreditCard,
+  Download,
+  ExternalLink,
+  Receipt,
+} from "lucide-react";
+import { useState } from "react";
+import toast from "react-hot-toast";
 
 import { api } from "@/services/api";
+import { invoicesService } from "@/services/invoices.service";
+import {
+  paymentsService,
+  type PaymentMethod,
+} from "@/services/payments.service";
+import { warehouseInvoicesService } from "@/services/warehouse-invoices.service";
+import { PaymentMethodModal } from "@/pages/bookings/BookingDetailPage/components/PaymentMethodModal";
+import { saveBlob } from "@/utils/download";
 import { formatCurrency } from "@/lib/currency";
 import { BORDER, INK, MUTED } from "../contracts/contract-ui";
 import {
@@ -31,7 +49,12 @@ import {
 function MetaItem({ label, value }: { label: string; value: string }) {
   return (
     <Box>
-      <Text fz={11} fw={700} c={MUTED} style={{ textTransform: "uppercase", letterSpacing: "0.05em" }}>
+      <Text
+        fz={11}
+        fw={700}
+        c={MUTED}
+        style={{ textTransform: "uppercase", letterSpacing: "0.05em" }}
+      >
         {label}
       </Text>
       <Text fz={14} mt={4} style={{ color: INK }}>
@@ -44,19 +67,35 @@ function MetaItem({ label, value }: { label: string; value: string }) {
 export default function InvoiceDetailPage() {
   const { id = "" } = useParams();
   const navigate = useNavigate();
+  const [paymentMethod, setPaymentMethod] = useState<"TELEBIRR" | "WAAFI">("TELEBIRR");
 
-  const { data: invoice, isLoading, isError } = useQuery(
-    api.invoices.get.queryOptions({ input: { id } }),
-  );
+  const {
+    data: invoice,
+    isLoading,
+    isError,
+  } = useQuery(api.invoices.get.queryOptions({ input: { id } }));
 
-  const payMutation = useMutation(
-    api.invoices.pay.mutationOptions({
-      onSuccess: (res) => {
-        const url = res.clientAction?.url;
-        if (url) window.location.href = url;
-      },
-    }),
-  );
+  const [payModalOpen, setPayModalOpen] = useState(false);
+
+  // Ownership-checked: POST /billing/my-invoices/:id/pay only ever charges
+  // one of the signed-in customer's own invoices (unlike the admin-facing
+  // /payments/initiate, which takes any invoiceId with no ownership check).
+  const payMutation = useMutation({
+    mutationFn: (method: PaymentMethod) =>
+      api.invoices.pay.call({ id, payload: { method, platform: "web" } }),
+    onSuccess: (data, method) => {
+      const redirectUrl =
+        data?.clientAction?.type === "REDIRECT" && data.clientAction.url
+          ? data.clientAction.url
+          : paymentsService.checkoutUrlForInvoice({ invoiceId: id, method });
+      window.location.href = redirectUrl;
+    },
+  });
+
+  useEffect(() => {
+    if (!invoice) return;
+    setPaymentMethod(invoice.currency === "USD" ? "WAAFI" : "TELEBIRR");
+  }, [invoice?.currency]);
 
   if (isLoading) {
     return (
@@ -88,11 +127,64 @@ export default function InvoiceDetailPage() {
 
   const payable = isPayable(invoice.status);
   const lines = invoice.lines ?? [];
+  const amountDue = Number(invoice.balanceAmount ?? invoice.totalAmount);
 
   const handlePay = () => {
+<<<<<<< HEAD
     const returnUrl = `${window.location.origin}/payment/success`;
     const failureUrl = `${window.location.origin}/payment/failure`;
-    payMutation.mutate({ id, payload: { returnUrl, failureUrl } });
+    payMutation.mutate({ id, payload: { method: paymentMethod, returnUrl, failureUrl } });
+=======
+    setPayModalOpen(true);
+  };
+
+  const hasReceipt = Number(invoice.paidAmount) > 0;
+  const canViewSource =
+    invoice.source === "booking" || invoice.source === "warehouse";
+
+  const downloadInvoice = async () => {
+    try {
+      saveBlob(
+        await invoicesService.downloadDocument(id),
+        `invoice-${invoice.invoiceNumber}.pdf`,
+      );
+    } catch {
+      toast.error("Invoice PDF isn't ready yet. Contact EDR if this persists.");
+    }
+  };
+
+  const downloadReceipt = async () => {
+    try {
+      saveBlob(
+        await invoicesService.downloadReceipt(id),
+        `receipt-${invoice.invoiceNumber}.pdf`,
+      );
+    } catch {
+      toast.error("Receipt isn't available yet.");
+    }
+  };
+
+  // The source link: a booking invoice goes straight to the booking; a warehouse
+  // fee invoice resolves its booking (via the warehouse view) and deep-links to
+  // that booking's warehouse-payments section.
+  const viewSource = async () => {
+    if (invoice.source === "booking") {
+      navigate(`/bookings/${invoice.sourceId}`);
+      return;
+    }
+    if (invoice.source === "warehouse") {
+      try {
+        const wh = await warehouseInvoicesService.get(invoice.id);
+        if (wh?.bookingId) {
+          navigate(`/bookings/${wh.bookingId}#warehouse-payments`);
+          return;
+        }
+      } catch {
+        /* fall through to the toast below */
+      }
+      toast.error("This invoice's source isn't linked to a booking.");
+    }
+>>>>>>> 03740ee719f22f9617379a652b26f13b6870f671
   };
 
   return (
@@ -112,37 +204,109 @@ export default function InvoiceDetailPage() {
         {/* Header */}
         <Group justify="space-between" align="flex-start" wrap="wrap" gap="md">
           <Group gap={12} align="center" wrap="wrap">
-            <Title order={1} fw={800} fz={26} style={{ letterSpacing: "-0.01em" }}>
+            <Title
+              order={1}
+              fw={800}
+              fz={26}
+              style={{ letterSpacing: "-0.01em" }}
+            >
               {invoice.invoiceNumber}
             </Title>
             <InvoiceStatusBadge status={invoice.status} />
           </Group>
+<<<<<<< HEAD
           {payable && (
+            <Group align="flex-end" gap="sm">
+              <Select
+                label="Payment provider"
+                value={paymentMethod}
+                onChange={(value) => setPaymentMethod((value as "TELEBIRR" | "WAAFI") ?? "TELEBIRR")}
+                data={[
+                  { value: "TELEBIRR", label: "Telebirr" },
+                  { value: "WAAFI", label: "Waafi" },
+                ]}
+                w={170}
+              />
+=======
+          <Group gap={8} wrap="wrap">
+            {canViewSource && (
+              <Button
+                variant="default"
+                radius="md"
+                size="md"
+                leftSection={<ExternalLink size={16} />}
+                onClick={viewSource}
+                styles={{
+                  root: { fontWeight: 600, height: 42, paddingInline: 16 },
+                }}
+              >
+                View source
+              </Button>
+            )}
             <Button
-              color="edr-green"
+              variant="default"
               radius="md"
               size="md"
-              leftSection={<CreditCard size={16} />}
-              loading={payMutation.isPending}
-              onClick={handlePay}
-              styles={{ root: { fontWeight: 600, height: 42, paddingInline: 18 } }}
+              leftSection={<Download size={16} />}
+              onClick={downloadInvoice}
+              styles={{
+                root: { fontWeight: 600, height: 42, paddingInline: 16 },
+              }}
             >
-              Pay {formatCurrency(Number(invoice.totalAmount), invoice.currency)}
+              Download invoice
             </Button>
+            {hasReceipt && (
+              <Button
+                variant="subtle"
+                color="gray"
+                radius="md"
+                size="md"
+                leftSection={<Receipt size={16} />}
+                onClick={downloadReceipt}
+                styles={{
+                  root: { fontWeight: 600, height: 42, paddingInline: 16 },
+                }}
+              >
+                Receipt
+              </Button>
+            )}
+            {payable && (
+>>>>>>> 03740ee719f22f9617379a652b26f13b6870f671
+              <Button
+                color="edr-green"
+                radius="md"
+                size="md"
+                leftSection={<CreditCard size={16} />}
+                loading={payMutation.isPending}
+                onClick={handlePay}
+<<<<<<< HEAD
+                styles={{ root: { fontWeight: 600, height: 42, paddingInline: 18 } }}
+              >
+                Pay {formatCurrency(amountDue, invoice.currency)}
+              </Button>
+            </Group>
           )}
+=======
+                styles={{
+                  root: { fontWeight: 600, height: 42, paddingInline: 18 },
+                }}
+              >
+                Pay{" "}
+                {formatCurrency(Number(invoice.totalAmount), invoice.currency)}
+              </Button>
+            )}
+          </Group>
+>>>>>>> 03740ee719f22f9617379a652b26f13b6870f671
         </Group>
 
-        {payMutation.isError && (
-          <Alert color="red" icon={<Info size={16} />} title="Payment could not be started">
-            Please try again, or contact support if the problem persists.
-          </Alert>
-        )}
-
         {/* Summary */}
         <Paper withBorder radius="lg" p="lg" style={{ borderColor: BORDER }}>
           <SimpleGrid cols={{ base: 1, sm: 2, md: 4 }} spacing="lg">
             <MetaItem label="Billed To" value={billedTo(invoice)} />
-            <MetaItem label="Source" value={`${titleCase(invoice.source)} · ${invoice.type}`} />
+            <MetaItem
+              label="Source"
+              value={`${titleCase(invoice.source)} · ${invoice.type}`}
+            />
             <MetaItem label="Issued" value={fmtDate(invoice.issuedAt)} />
             <MetaItem label="Due" value={fmtDate(invoice.dueAt)} />
           </SimpleGrid>
@@ -150,7 +314,12 @@ export default function InvoiceDetailPage() {
           <Divider my="lg" color={BORDER} />
 
           <Group justify="space-between" align="center">
-            <Text fz={14} fw={700} c={MUTED} style={{ textTransform: "uppercase", letterSpacing: "0.05em" }}>
+            <Text
+              fz={14}
+              fw={700}
+              c={MUTED}
+              style={{ textTransform: "uppercase", letterSpacing: "0.05em" }}
+            >
               Total
             </Text>
             <Text fz={24} fw={800} style={{ color: INK }}>
@@ -241,6 +410,30 @@ export default function InvoiceDetailPage() {
             </Table>
           </Box>
         </Paper>
+
+        <PaymentMethodModal
+          opened={payModalOpen}
+          onClose={() => {
+            if (!payMutation.isPending) {
+              setPayModalOpen(false);
+              payMutation.reset();
+            }
+          }}
+          amountLabel={formatCurrency(
+            Number(invoice.totalAmount),
+            invoice.currency,
+          )}
+          currency={invoice.currency}
+          processing={payMutation.isPending}
+          error={
+            payMutation.isError
+              ? payMutation.error instanceof Error
+                ? payMutation.error.message
+                : "Could not start payment. Please try again."
+              : null
+          }
+          onConfirm={(method) => payMutation.mutate(method)}
+        />
       </Stack>
     </Box>
   );
diff --git a/apps/edr-freight-web/portal/src/pages/billing/invoice-ui.tsx b/apps/edr-freight-web/portal/src/pages/billing/invoice-ui.tsx
index 1e19b1c9a..dac9cb18c 100644
--- a/apps/edr-freight-web/portal/src/pages/billing/invoice-ui.tsx
+++ b/apps/edr-freight-web/portal/src/pages/billing/invoice-ui.tsx
@@ -5,7 +5,9 @@ import type { PortalInvoice } from "@/services/invoices.service";
 
 /** Statuses a customer can still pay. */
 export const PAYABLE_STATUSES: Freight.InvoiceStatus[] = [
+  Freight.InvoiceStatus.Issued,
   Freight.InvoiceStatus.Pending,
+  Freight.InvoiceStatus.PartiallyPaid,
   Freight.InvoiceStatus.Overdue,
 ];
 
@@ -17,11 +19,14 @@ const STATUS_STYLE: Record<
   { label: string; bg: string; fg: string }
 > = {
   [Freight.InvoiceStatus.Draft]: { label: "Draft", bg: "#EEF2F6", fg: "#64748B" },
+  [Freight.InvoiceStatus.Issued]: { label: "Due", bg: "#FEF3E2", fg: "#B45309" },
   [Freight.InvoiceStatus.Pending]: { label: "Due", bg: "#FEF3E2", fg: "#B45309" },
+  [Freight.InvoiceStatus.PartiallyPaid]: { label: "Partially paid", bg: "#FEF9E7", fg: "#A16207" },
   [Freight.InvoiceStatus.Paid]: { label: "Paid", bg: "#E6F7EF", fg: "#0A6F4D" },
   [Freight.InvoiceStatus.Overdue]: { label: "Overdue", bg: "#FDECEC", fg: "#C0392B" },
   [Freight.InvoiceStatus.Cancelled]: { label: "Cancelled", bg: "#EEF2F6", fg: "#64748B" },
   [Freight.InvoiceStatus.Refunded]: { label: "Refunded", bg: "#EAF1FB", fg: "#2563EB" },
+  [Freight.InvoiceStatus.Expired]: { label: "Expired", bg: "#FBEAE7", fg: "#C0392B" },
 };
 
 export function InvoiceStatusBadge({ status }: { status: Freight.InvoiceStatus }) {
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingClearanceWorkflowBanner.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingClearanceWorkflowBanner.tsx
new file mode 100644
index 000000000..b4dc80074
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingClearanceWorkflowBanner.tsx
@@ -0,0 +1,176 @@
+import { useState } from "react";
+import { Alert, Anchor, Button, FileInput, Group, Paper, Stack, Text } from "@mantine/core";
+import { AlertTriangle, Download, Receipt, Upload } from "lucide-react";
+import { useQuery } from "@tanstack/react-query";
+import toast from "react-hot-toast";
+import type { Freight } from "@edr/types";
+
+import { bookingsService } from "@/services/bookings.service";
+import { fileViewUrl } from "@/constants/apiConfig";
+import { ClearancePhaseStepper } from "../contracts/ClearancePhaseStepper";
+import { ClearanceUploadedDocumentsPanel } from "@/components/contracts/ClearanceUploadedDocumentsPanel";
+import { useFileViewer } from "@/hooks/useFileViewer";
+
+const BORDER = "#E6ECF2";
+
+export function BookingClearanceWorkflowBanner({
+  booking,
+}: {
+  booking: Freight.IBooking;
+}) {
+  const isPhased =
+    booking.customsClearingEnabled &&
+    booking.bookingType === "GENERAL_CONTRACT";
+
+  const { view, viewer } = useFileViewer();
+
+  const { data: clearance, refetch } = useQuery({
+    queryKey: ["booking-clearance", booking.id],
+    queryFn: () => bookingsService.getClearance(booking.id),
+    enabled: isPhased,
+  });
+
+  if (!isPhased || !clearance) return null;
+
+  const dutyPaid = clearance.milestones?.some(
+    (m) => m.milestoneCode === "DUTY_TAX_PAID" && m.status === "COMPLETED",
+  );
+  const dutyPending =
+    clearance.dutyRequired &&
+    clearance.dutyAdvice &&
+    !dutyPaid;
+
+  return (
+    <Paper withBorder radius="lg" p="lg" style={{ borderColor: BORDER }}>
+      <Stack gap="md">
+        <Text fw={700} size="sm">
+          Clearance progress
+        </Text>
+        <ClearancePhaseStepper
+          clearance={clearance as Freight.ContractClearanceView}
+          tradeDirection={booking.tradeDirection}
+          compact
+        />
+
+        {clearance.roHold && clearance.roHoldReason ? (
+          <Alert color="orange" icon={<AlertTriangle size={16} />} title="Release Order on hold">
+            {clearance.roHoldReason}
+          </Alert>
+        ) : null}
+
+        {clearance.nextAction?.actor === "CUSTOMER" ? (
+          <Alert color="blue" variant="light">
+            {clearance.nextAction.action}
+          </Alert>
+        ) : null}
+
+        {dutyPending && clearance.dutyAdvice ? (
+          <DutyAdvicePanel
+            dutyAdvice={clearance.dutyAdvice}
+            bookingId={booking.id}
+            onUploaded={() => void refetch()}
+          />
+        ) : null}
+
+        {clearance.operationReady ? (
+          <Alert color="green" variant="light">
+            Clearance is complete. You may proceed to request your operation date.
+          </Alert>
+        ) : null}
+
+        <ClearanceUploadedDocumentsPanel
+          embedded
+          files={clearance.workflowFiles ?? []}
+          title="Customs documents"
+          onView={(f) => view(f)}
+          onDownload={({ id, name }) => {
+            const a = document.createElement("a");
+            a.href = fileViewUrl(id, true);
+            a.download = name;
+            a.click();
+          }}
+        />
+      </Stack>
+      {viewer}
+    </Paper>
+  );
+}
+
+function DutyAdvicePanel({
+  dutyAdvice,
+  bookingId,
+  onUploaded,
+}: {
+  dutyAdvice: NonNullable<Freight.ClearanceView["dutyAdvice"]>;
+  bookingId: string;
+  onUploaded: () => void;
+}) {
+  const [file, setFile] = useState<File | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  return (
+    <Paper withBorder radius="md" p="md" bg="#FFFBF0">
+      <Stack gap="sm">
+        <GroupLabel icon={Receipt} text="Duty / tax payment" />
+        <Text size="sm">
+          Amount due:{" "}
+          <strong>
+            {dutyAdvice.amount.toLocaleString()} {dutyAdvice.currency}
+          </strong>
+          {dutyAdvice.declarationSerial
+            ? ` · Payment code: ${dutyAdvice.declarationSerial}`
+            : null}
+        </Text>
+        {dutyAdvice.noticeFile ? (
+          <Anchor
+            href={fileViewUrl(dutyAdvice.noticeFile.id, true)}
+            target="_blank"
+            rel="noopener noreferrer"
+            size="sm"
+          >
+            <Group gap={6} wrap="nowrap">
+              <Download size={14} />
+              Download duty notice ({dutyAdvice.noticeFile.name})
+            </Group>
+          </Anchor>
+        ) : null}
+        <Text size="sm" c="dimmed">
+          Pay the amount above, then upload your payment slip so clearance can continue.
+        </Text>
+        <FileInput label="Payment slip" value={file} onChange={setFile} size="sm" />
+        <Button
+          color="orange"
+          loading={loading}
+          disabled={!file}
+          leftSection={<Upload size={16} />}
+          onClick={async () => {
+            if (!file) return;
+            setLoading(true);
+            try {
+              await bookingsService.uploadBookingClearanceDutySlip(bookingId, file);
+              toast.success("Payment slip uploaded");
+              onUploaded();
+            } catch (e) {
+              toast.error(e instanceof Error ? e.message : "Upload failed");
+            } finally {
+              setLoading(false);
+            }
+          }}
+        >
+          Submit payment slip
+        </Button>
+      </Stack>
+    </Paper>
+  );
+}
+
+function GroupLabel({ icon: Icon, text }: { icon: typeof Receipt; text: string }) {
+  return (
+    <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
+      <Icon size={16} />
+      <Text fw={600} size="sm">
+        {text}
+      </Text>
+    </div>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/ReadonlyBookingView.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/ReadonlyBookingView.tsx
index 065ee8385..f0f75f537 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/ReadonlyBookingView.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/ReadonlyBookingView.tsx
@@ -1,5 +1,5 @@
 import { Box, Group, Text } from "@mantine/core";
-import { useMutation } from "@tanstack/react-query";
+import { useMutation, useQuery } from "@tanstack/react-query";
 import { CreditCard, Download, Eye } from "lucide-react";
 import { useState } from "react";
 import { useNavigate } from "react-router-dom";
@@ -8,7 +8,9 @@ import { isViewable } from "@edr/ui-common";
 import { api } from "@/services/api";
 import { fileViewUrl } from "@/constants/apiConfig";
 import { useFileViewer } from "@/hooks/useFileViewer";
+import { invoicesService } from "@/services/invoices.service";
 import { paymentsService, type PaymentMethod } from "@/services/payments.service";
+import { isPayable } from "@/pages/billing/invoice-ui";
 import type { Freight } from "@edr/types";
 
 import { ApproveDeliveryButton } from "../delivery/ApproveDeliveryButton";
@@ -16,6 +18,7 @@ import { ActivityCard } from "./components/ActivityCard";
 import { ClearanceCard } from "./components/ClearanceCard";
 import { ContainersCard } from "./components/ContainersCard";
 import { ContractCard } from "./components/ContractCard";
+import { CustomerTruckAssignmentCard } from "./components/CustomerTruckAssignmentCard";
 import { DocRow, IconSquare } from "./components/Documents";
 import { KeyFactsStrip } from "./components/KeyFactsStrip";
 import { BodyGrid, CardTitle, PageShell, SectionCard } from "./components/layout";
@@ -24,19 +27,28 @@ import {
   ConsolidationPairedNotice,
   ConsolidationWaitingBanner,
 } from "./components/Notices";
+import { BookingPaymentPanel } from "./components/BookingPaymentPanel";
 import { HeaderButton, PageHeader } from "./components/PageHeader";
-import { PaymentDeadlineCard } from "./components/PaymentDeadlineCard";
 import { PaymentMethodModal } from "./components/PaymentMethodModal";
-import { PaymentCard } from "./components/pricing";
 import { ScheduleCard } from "./components/ScheduleCard";
+import { WarehousePaymentsSection } from "./components/WarehousePaymentsSection";
 import { ShipmentDetailsCard } from "./components/ShipmentDetailsCard";
 import { ShipmentTrackingCard } from "./components/ShipmentTrackingCard";
 import { StatusHero } from "./components/StatusHero";
 import { SupportCard } from "./components/SupportCard";
 import { fmtDate, isNegative, priceTotal } from "./utils";
+import { useScrollToHash } from "@/hooks/useScrollToHash";
 
-export function ReadonlyBookingView({ booking }: { booking: Freight.IBooking }) {
+export function ReadonlyBookingView({
+  booking,
+  onBookingUpdated,
+}: {
+  booking: Freight.IBooking;
+  onBookingUpdated?: () => void;
+}) {
   const navigate = useNavigate();
+  // Deep-link support: e.g. /bookings/:id#warehouse-payments from an invoice.
+  useScrollToHash();
   const status = booking.status as string;
   const [payModalOpen, setPayModalOpen] = useState(false);
   const { view, viewer } = useFileViewer();
@@ -48,17 +60,41 @@ export function ReadonlyBookingView({ booking }: { booking: Freight.IBooking })
     : "/contracts/new";
   const onRebook = () => navigate(rebookTo);
 
-  // POST /payments/initiate creates the intent and returns the provider's
-  // redirect URL (clientAction.url). Send the browser straight there; fall back
-  // to the public /payments/checkout page if no redirect URL came back.
+  // Billing is invoice-centric — resolve the booking's currently payable
+  // invoice (same query/key BookingPaymentPanel uses, so this shares its
+  // cache) and pay it through the ownership-checked portal route.
+  const { data: bookingInvoices = [] } = useQuery({
+    queryKey: ["booking-invoices", booking.id],
+    queryFn: () => invoicesService.listForSource("booking", booking.id),
+  });
+  const payableInvoiceId = bookingInvoices.find((inv) =>
+    isPayable(inv.status),
+  )?.id;
+
+  // POST /billing/my-invoices/:id/pay creates the intent and returns the
+  // provider's redirect URL (clientAction.url). Send the browser straight
+  // there; fall back to the public /payments/checkout page if no redirect
+  // URL came back.
   const payMutation = useMutation({
-    mutationFn: (method: PaymentMethod) =>
-      api.payments.initiate.call({ bookingId: booking.id, method }),
+    mutationFn: (method: PaymentMethod) => {
+      if (!payableInvoiceId) {
+        throw new Error(
+          "No payable invoice found for this booking yet. Please refresh or contact support.",
+        );
+      }
+      return api.invoices.pay.call({
+        id: payableInvoiceId,
+        payload: { method, platform: "web" },
+      });
+    },
     onSuccess: (data, method) => {
       const redirectUrl =
         data?.clientAction?.type === "REDIRECT" && data.clientAction.url
           ? data.clientAction.url
-          : paymentsService.checkoutUrl({ bookingId: booking.id, method });
+          : paymentsService.checkoutUrlForInvoice({
+              invoiceId: payableInvoiceId!,
+              method,
+            });
       window.location.href = redirectUrl;
     },
   });
@@ -73,7 +109,19 @@ export function ReadonlyBookingView({ booking }: { booking: Freight.IBooking })
     (isGeneralContract
       ? status === "FULLY_EXECUTED"
       : status === "SELECTED_FOR_BATCH");
-  const canApproveDelivery = status === "COMPLETED";
+  const canApproveDelivery =
+    status === "COMPLETED" ||
+    (status === "TRUCK_ASSIGNED" && Boolean(booking.customerTruckArrivedAt));
+  const usesCustomerTruck =
+    booking.tradeDirection === "IMPORT"
+      ? !booking.lastMileDeliveryAddress
+      : booking.tradeDirection === "EXPORT"
+        ? !booking.firstMilePickupAddress
+        : !booking.firstMilePickupAddress && !booking.lastMileDeliveryAddress;
+  const canAssignCustomerTruck =
+    booking.paymentStatus === "PAID" &&
+    usesCustomerTruck &&
+    ["PAID", "IN_TRANSIT", "COMPLETED", "TRUCK_ASSIGNED"].includes(status);
   const showCountdown = canPay && !!booking.paymentDeadline;
   const isExpired = status === "EXPIRED";
   const isPendingConsolidation = status === "PENDING_CONSOLIDATION";
@@ -164,6 +212,14 @@ export function ReadonlyBookingView({ booking }: { booking: Freight.IBooking })
 
             <ShipmentTrackingCard bookingId={booking.id} />
 
+            {canAssignCustomerTruck && (
+              <CustomerTruckAssignmentCard
+                booking={booking}
+                onAssigned={onBookingUpdated ?? (() => {})}
+              />
+            )}
+            <WarehousePaymentsSection bookingId={booking.id} />
+
             {booking.files && booking.files.length > 0 && (
               <SectionCard>
                 <Group justify="space-between" align="center" mb="md">
@@ -215,14 +271,13 @@ export function ReadonlyBookingView({ booking }: { booking: Freight.IBooking })
         }
         right={
           <>
-            {showCountdown && (
-              <PaymentDeadlineCard
-                paymentDeadline={booking.paymentDeadline!}
-                onPay={() => setPayModalOpen(true)}
-                paying={payMutation.isPending}
-              />
-            )}
-            <PaymentCard booking={booking} pricing={pricing} />
+            <BookingPaymentPanel
+              booking={booking}
+              pricing={pricing}
+              onPay={() => setPayModalOpen(true)}
+              paying={payMutation.isPending}
+              showCountdown={showCountdown}
+            />
             <ScheduleCard
               booking={booking}
               title="Consignment & Schedule"
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/BookingPaymentPanel.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/BookingPaymentPanel.tsx
new file mode 100644
index 000000000..d969f7a53
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/BookingPaymentPanel.tsx
@@ -0,0 +1,370 @@
+import { ActionIcon, Box, Button, Group, Stack, Text } from "@mantine/core";
+import { useQuery } from "@tanstack/react-query";
+import {
+  CheckCircle2,
+  CreditCard,
+  Download,
+  FileText,
+  Receipt,
+  Timer,
+} from "lucide-react";
+import { useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
+import toast from "react-hot-toast";
+
+import type { Freight } from "@edr/types";
+
+import { invoicesService, type PortalInvoice } from "@/services/invoices.service";
+import { InvoiceStatusBadge, titleCase } from "@/pages/billing/invoice-ui";
+import { saveBlob } from "@/utils/download";
+
+import { fmtDate, priceLineItems, priceTotal, type Pricing } from "../utils";
+import { CardTitle, SectionCard } from "./layout";
+
+const Divider = () => <Box my={16} h={1} w="100%" bg="#EEF2F6" />;
+
+// ── Pay-window countdown ─────────────────────────────────────────────────────
+
+interface Remaining {
+  days: number;
+  hours: number;
+  minutes: number;
+  seconds: number;
+  expired: boolean;
+}
+
+function getRemaining(deadlineMs: number): Remaining {
+  const diff = deadlineMs - Date.now();
+  if (diff <= 0) return { days: 0, hours: 0, minutes: 0, seconds: 0, expired: true };
+  const total = Math.floor(diff / 1000);
+  return {
+    days: Math.floor(total / 86400),
+    hours: Math.floor((total % 86400) / 3600),
+    minutes: Math.floor((total % 3600) / 60),
+    seconds: total % 60,
+    expired: false,
+  };
+}
+
+function Segment({ value, label }: { value: number; label: string }) {
+  return (
+    <Stack gap={2} align="center" style={{ minWidth: 52 }}>
+      <Text fz="26px" fw={800} c="#10202F" lh={1} style={{ fontVariantNumeric: "tabular-nums" }}>
+        {String(value).padStart(2, "0")}
+      </Text>
+      <Text fz="10.5px" fw={700} c="#9AA8B5" tt="uppercase" style={{ letterSpacing: "0.6px" }}>
+        {label}
+      </Text>
+    </Stack>
+  );
+}
+
+function Countdown({
+  deadline,
+  onPay,
+  paying,
+}: {
+  deadline: string;
+  onPay?: () => void;
+  paying?: boolean;
+}) {
+  const deadlineMs = new Date(deadline).getTime();
+  const [remaining, setRemaining] = useState<Remaining>(() => getRemaining(deadlineMs));
+
+  useEffect(() => {
+    setRemaining(getRemaining(deadlineMs));
+    const interval = setInterval(() => {
+      const next = getRemaining(deadlineMs);
+      setRemaining(next);
+      if (next.expired) clearInterval(interval);
+    }, 1000);
+    return () => clearInterval(interval);
+  }, [deadlineMs]);
+
+  if (remaining.expired) {
+    return (
+      <Text fz="13.5px" c="#6B7C8E">
+        The payment window has closed. Move this booking to another schedule or
+        contact support.
+      </Text>
+    );
+  }
+
+  return (
+    <>
+      <Group justify="space-between" wrap="nowrap" px={4}>
+        <Segment value={remaining.days} label="Days" />
+        <Segment value={remaining.hours} label="Hrs" />
+        <Segment value={remaining.minutes} label="Min" />
+        <Segment value={remaining.seconds} label="Sec" />
+      </Group>
+      <Text mt={12} fz="12px" c="#9AA8B5">
+        Deadline:{" "}
+        {new Date(deadline).toLocaleString(undefined, {
+          month: "short",
+          day: "numeric",
+          hour: "2-digit",
+          minute: "2-digit",
+        })}
+      </Text>
+      {onPay && (
+        <Button
+          fullWidth
+          mt={14}
+          radius={10}
+          color="edr-green"
+          leftSection={<CreditCard size={17} />}
+          onClick={onPay}
+          loading={paying}
+          styles={{ root: { height: 46 }, label: { fontSize: 13.5, fontWeight: 700 } }}
+        >
+          Pay now
+        </Button>
+      )}
+    </>
+  );
+}
+
+// ── Merged payment panel ─────────────────────────────────────────────────────
+
+/**
+ * One card covering the whole payment story for a booking: the live pay-window
+ * countdown (when open), the price breakdown, and the invoice(s) — each with a
+ * link to its detail page and a download. Replaces the separate deadline +
+ * breakdown cards.
+ */
+export function BookingPaymentPanel({
+  booking,
+  pricing,
+  onPay,
+  paying,
+  showCountdown,
+}: {
+  booking: Freight.IBooking;
+  pricing: Pricing;
+  onPay?: () => void;
+  paying?: boolean;
+  showCountdown?: boolean;
+}) {
+  const navigate = useNavigate();
+  const paid = booking.paymentStatus === "PAID";
+  const isAdjusted =
+    booking.adjustedTotalAmount !== null &&
+    booking.adjustedTotalAmount !== undefined;
+  const currency = pricing?.currency ?? booking.paymentCurrency;
+  const total = isAdjusted
+    ? `${Number(booking.adjustedTotalAmount).toLocaleString()} ${currency}`
+    : priceTotal(pricing);
+  const items = priceLineItems(pricing);
+
+  const { data: invoices = [] } = useQuery({
+    queryKey: ["booking-invoices", booking.id],
+    queryFn: () => invoicesService.listForSource("booking", booking.id),
+  });
+  // The invoice worth a prominent "Download" — the first issued one, else any.
+  const primary =
+    invoices.find((inv) => inv.status !== "DRAFT") ?? invoices[0];
+  const primaryPaid = primary ? Number(primary.paidAmount) > 0 : false;
+
+  const downloadInvoice = async (inv: PortalInvoice) => {
+    try {
+      saveBlob(
+        await invoicesService.downloadDocument(inv.id),
+        `invoice-${inv.invoiceNumber}.pdf`,
+      );
+    } catch {
+      toast.error("Invoice PDF isn't ready yet. Contact EDR if this persists.");
+    }
+  };
+
+  const downloadReceipt = async (inv: PortalInvoice) => {
+    try {
+      saveBlob(
+        await invoicesService.downloadReceipt(inv.id),
+        `receipt-${inv.invoiceNumber}.pdf`,
+      );
+    } catch {
+      toast.error("Receipt isn't available yet.");
+    }
+  };
+
+  return (
+    <SectionCard p={22}>
+      <Group justify="space-between" align="center">
+        <CardTitle>Payment</CardTitle>
+        <Group
+          component="span"
+          gap={6}
+          align="center"
+          wrap="nowrap"
+          style={{
+            display: "inline-flex",
+            borderRadius: 999,
+            padding: "5px 11px",
+            fontSize: 11.5,
+            fontWeight: 700,
+            backgroundColor: paid ? "#ECF6F1" : showCountdown ? "#FEF6E6" : "#FDF3E0",
+            color: paid ? "#0A6F4D" : showCountdown ? "#B07D14" : "#9A5B00",
+            border: paid ? "1px solid #CDEBDD" : undefined,
+          }}
+        >
+          {paid ? <CheckCircle2 size={13} /> : showCountdown ? <Timer size={13} /> : null}
+          {paid
+            ? "Paid"
+            : showCountdown
+              ? "Pay window open"
+              : (booking.paymentStatus?.replace(/_/g, " ") ?? "Pending")}
+        </Group>
+      </Group>
+
+      {showCountdown && booking.paymentDeadline && (
+        <Box mt={16}>
+          <Countdown
+            deadline={booking.paymentDeadline}
+            onPay={onPay}
+            paying={paying}
+          />
+          <Divider />
+        </Box>
+      )}
+
+      <Box mt={showCountdown ? 0 : 12}>
+        <Text fz="26px" fw={800} c="#10202F">
+          {total}
+        </Text>
+        {isAdjusted && (
+          <Box
+            component="span"
+            mt={6}
+            style={{
+              display: "inline-block",
+              borderRadius: 6,
+              backgroundColor: "#EAF1FB",
+              padding: "3px 8px",
+              fontSize: 11,
+              fontWeight: 700,
+              color: "#2E5B96",
+            }}
+          >
+            Adjusted by EDR
+          </Box>
+        )}
+        {isAdjusted && booking.adjustmentReason && (
+          <Text mt={6} fz="12.5px" c="#6B7C8E">
+            {booking.adjustmentReason}
+          </Text>
+        )}
+        {paid && (
+          <Text mt={4} fz="12.5px" c="#9AA8B5">
+            Paid · {fmtDate(booking.updatedAt)}
+          </Text>
+        )}
+      </Box>
+
+      {items.length > 0 && (
+        <>
+          <Divider />
+          <Stack gap={11}>
+            {items.map((it) => (
+              <Group key={it.label} justify="space-between" wrap="nowrap">
+                <Text fz="13px" c="#6B7C8E">
+                  {it.label}
+                </Text>
+                <Text fz="13px" fw={600} c="#10202F">
+                  {it.value}
+                </Text>
+              </Group>
+            ))}
+          </Stack>
+          <Group
+            justify="space-between"
+            mt={12}
+            pt={14}
+            style={{ borderTop: "1px solid #EEF2F6" }}
+          >
+            <Text fz="14px" fw={800} c="#10202F">
+              {isAdjusted ? "Adjusted total" : "Total"}
+            </Text>
+            <Text fz="15px" fw={800} c="#10202F">
+              {total}
+            </Text>
+          </Group>
+        </>
+      )}
+
+      {invoices.length > 0 && (
+        <>
+          <Divider />
+          <Group justify="space-between" align="center" mb={10}>
+            <CardTitle>Invoices</CardTitle>
+            <Text fz="12px" c="#9AA8B5">
+              {invoices.length}
+            </Text>
+          </Group>
+          <Stack gap={10}>
+            {invoices.map((inv) => (
+              <Group key={inv.id} justify="space-between" wrap="nowrap">
+                <Box style={{ minWidth: 0 }}>
+                  <Text
+                    fz="13px"
+                    fw={700}
+                    c="#10202F"
+                    style={{ cursor: "pointer" }}
+                    onClick={() => navigate(`/billing/${inv.id}`)}
+                  >
+                    {inv.invoiceNumber}
+                  </Text>
+                  <Text fz="12px" c="#9AA8B5">
+                    {titleCase(inv.type)}
+                  </Text>
+                </Box>
+                <Group gap={8} wrap="nowrap">
+                  <InvoiceStatusBadge status={inv.status} />
+                  <ActionIcon
+                    variant="subtle"
+                    color="gray"
+                    aria-label="Download invoice"
+                    onClick={() => downloadInvoice(inv)}
+                  >
+                    <Download size={16} />
+                  </ActionIcon>
+                </Group>
+              </Group>
+            ))}
+          </Stack>
+        </>
+      )}
+
+      {primary && (
+        <Button
+          fullWidth
+          mt={16}
+          variant="default"
+          radius={10}
+          leftSection={<FileText size={17} color="#475569" />}
+          onClick={() => downloadInvoice(primary)}
+          styles={{
+            root: { height: 46 },
+            label: { fontSize: 13.5, fontWeight: 700, color: "#10202F" },
+          }}
+        >
+          Download invoice
+        </Button>
+      )}
+      {primary && primaryPaid && (
+        <Button
+          fullWidth
+          mt={8}
+          variant="subtle"
+          color="gray"
+          radius={10}
+          leftSection={<Receipt size={17} />}
+          onClick={() => downloadReceipt(primary)}
+          styles={{ root: { height: 42 }, label: { fontSize: 13, fontWeight: 700 } }}
+        >
+          Download receipt
+        </Button>
+      )}
+    </SectionCard>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/ClearanceCard.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/ClearanceCard.tsx
index 84836a900..8f055e79a 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/ClearanceCard.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/ClearanceCard.tsx
@@ -6,6 +6,7 @@ import type { Freight } from "@edr/types";
 
 import { ClearanceFlow } from "@/pages/bookings/clearance/ClearanceFlow";
 import { useClearanceFlow } from "@/pages/bookings/clearance/useClearanceFlow";
+import { BookingClearanceWorkflowBanner } from "@/pages/bookings/BookingClearanceWorkflowBanner";
 
 import { CardTitle, SectionCard } from "./layout";
 
@@ -43,7 +44,8 @@ export function ClearanceCard({ booking }: { booking: Freight.IBooking }) {
 
   return (
     <SectionCard>
-      <Group justify="space-between" align="center" mb="md">
+      <BookingClearanceWorkflowBanner booking={booking} />
+      <Group justify="space-between" align="center" mb="md" mt="md">
         <CardTitle>Clearance documents</CardTitle>
       </Group>
 
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/CustomerTruckAssignmentCard.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/CustomerTruckAssignmentCard.tsx
new file mode 100644
index 000000000..37e65ab2b
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/CustomerTruckAssignmentCard.tsx
@@ -0,0 +1,151 @@
+import { Alert, Button, Group, Select, SimpleGrid, Stack, Text, TextInput } from "@mantine/core";
+import { useMutation } from "@tanstack/react-query";
+import type { Freight } from "@edr/types";
+import { Download, Lock, Truck } from "lucide-react";
+import { useState } from "react";
+
+import { api } from "@/services/api";
+
+import { CardTitle, SectionCard } from "./layout";
+
+const TRUCK_TYPES = ["Flatbed", "Container Chassis", "Lowboy", "Box Truck", "Tipper"];
+const ISO_CONTAINER_PATTERN = /^[A-Z]{4}\d{7}$/;
+
+const downloadBlob = (blob: Blob, filename: string) => {
+  const url = URL.createObjectURL(blob);
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = filename;
+  document.body.appendChild(link);
+  link.click();
+  link.remove();
+  URL.revokeObjectURL(url);
+};
+
+export function CustomerTruckAssignmentCard({
+  booking,
+  onAssigned,
+}: {
+  booking: Freight.IBooking;
+  onAssigned: () => void;
+}) {
+  const assigned = Boolean(booking.customerTruckAssignedAt);
+  const [truckPlateNumber, setTruckPlateNumber] = useState(booking.customerTruckPlateNumber ?? "");
+  const [driverName, setDriverName] = useState(booking.customerTruckDriverName ?? "");
+  const [truckType, setTruckType] = useState(booking.customerTruckType ?? "");
+  const [containerNumberToLoad, setContainerNumberToLoad] = useState(
+    booking.customerTruckContainerNumber ?? "",
+  );
+  const [error, setError] = useState<string | null>(null);
+
+  const assignMutation = useMutation(api.bookings.assignCustomerTruck.mutationOptions());
+  const downloadMutation = useMutation(api.bookings.downloadCustomerTruckFreightOrder.mutationOptions());
+
+  const submit = async () => {
+    const payload = {
+      truckPlateNumber: truckPlateNumber.trim().toUpperCase(),
+      driverName: driverName.trim(),
+      truckType: truckType.trim(),
+      containerNumberToLoad: containerNumberToLoad.trim().toUpperCase(),
+    };
+    if (!payload.truckPlateNumber || !payload.driverName || !payload.truckType || !payload.containerNumberToLoad) {
+      setError("All truck assignment fields are required.");
+      return;
+    }
+    if (!ISO_CONTAINER_PATTERN.test(payload.containerNumberToLoad)) {
+      setError("Container number must match ISO format, e.g. ABCD1234567.");
+      return;
+    }
+    setError(null);
+    await assignMutation.mutateAsync({ id: booking.id, payload });
+    onAssigned();
+  };
+
+  const downloadFreightOrder = async () => {
+    const blob = await downloadMutation.mutateAsync({ id: booking.id });
+    downloadBlob(blob, `freight-order-${booking.reference}.pdf`);
+  };
+
+  return (
+    <SectionCard>
+      <Stack gap="md">
+        <Group justify="space-between" align="center">
+          <Group gap={10}>
+            <Truck size={18} color="#0a9f6a" />
+            <CardTitle>External Truck Assignment</CardTitle>
+          </Group>
+          {assigned && (
+            <Group gap={6} c="#0a9f6a">
+              <Lock size={14} />
+              <Text size="sm" fw={700}>
+                Truck Assigned
+              </Text>
+            </Group>
+          )}
+        </Group>
+
+        {error && (
+          <Alert color="red" variant="light">
+            {error}
+          </Alert>
+        )}
+        {assignMutation.isError && (
+          <Alert color="red" variant="light">
+            {assignMutation.error instanceof Error
+              ? assignMutation.error.message
+              : "Truck assignment failed."}
+          </Alert>
+        )}
+
+        <SimpleGrid cols={{ base: 1, sm: 2 }} spacing="sm">
+          <TextInput
+            label="Truck Plate Number"
+            required
+            value={truckPlateNumber}
+            onChange={(e) => setTruckPlateNumber(e.currentTarget.value)}
+            readOnly={assigned}
+          />
+          <TextInput
+            label="Driver Name"
+            required
+            value={driverName}
+            onChange={(e) => setDriverName(e.currentTarget.value)}
+            readOnly={assigned}
+          />
+          <Select
+            label="Truck Type"
+            required
+            data={TRUCK_TYPES}
+            value={truckType || null}
+            onChange={(value) => setTruckType(value ?? "")}
+            disabled={assigned}
+          />
+          <TextInput
+            label="Container Number to Load"
+            required
+            value={containerNumberToLoad}
+            onChange={(e) => setContainerNumberToLoad(e.currentTarget.value.toUpperCase())}
+            readOnly={assigned}
+          />
+        </SimpleGrid>
+
+        <Group justify="flex-end">
+          {assigned ? (
+            <Button
+              leftSection={<Download size={16} />}
+              color="edr-green"
+              onClick={downloadFreightOrder}
+              loading={downloadMutation.isPending}
+            >
+              Generate Freight Order Copies
+            </Button>
+          ) : (
+            <Button color="edr-green" onClick={submit} loading={assignMutation.isPending}>
+              Verify & Submit Assignment
+            </Button>
+          )}
+        </Group>
+      </Stack>
+    </SectionCard>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/PaymentDeadlineCard.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/PaymentDeadlineCard.tsx
deleted file mode 100644
index 54f900ab5..000000000
--- a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/PaymentDeadlineCard.tsx
+++ /dev/null
@@ -1,151 +0,0 @@
-import { Box, Button, Group, Stack, Text } from "@mantine/core";
-import { CreditCard, Timer } from "lucide-react";
-import { useEffect, useState } from "react";
-
-import { CardTitle, SectionCard } from "./layout";
-
-interface Remaining {
-  days: number;
-  hours: number;
-  minutes: number;
-  seconds: number;
-  expired: boolean;
-}
-
-function getRemaining(deadlineMs: number): Remaining {
-  const diff = deadlineMs - Date.now();
-  if (diff <= 0) {
-    return { days: 0, hours: 0, minutes: 0, seconds: 0, expired: true };
-  }
-  const totalSeconds = Math.floor(diff / 1000);
-  return {
-    days: Math.floor(totalSeconds / 86400),
-    hours: Math.floor((totalSeconds % 86400) / 3600),
-    minutes: Math.floor((totalSeconds % 3600) / 60),
-    seconds: totalSeconds % 60,
-    expired: false,
-  };
-}
-
-function Segment({ value, label }: { value: number; label: string }) {
-  return (
-    <Stack gap={2} align="center" style={{ minWidth: 52 }}>
-      <Text
-        fz="28px"
-        fw={800}
-        c="#10202F"
-        lh={1}
-        style={{ fontVariantNumeric: "tabular-nums" }}
-      >
-        {String(value).padStart(2, "0")}
-      </Text>
-      <Text fz="10.5px" fw={700} c="#9AA8B5" tt="uppercase" className="tracking-[0.6px]">
-        {label}
-      </Text>
-    </Stack>
-  );
-}
-
-export function PaymentDeadlineCard({
-  paymentDeadline,
-  onPay,
-  paying,
-}: {
-  /** ISO timestamp marking the end of the pay window. */
-  paymentDeadline: string;
-  onPay?: () => void;
-  paying?: boolean;
-}) {
-  const deadlineMs = new Date(paymentDeadline).getTime();
-  const [remaining, setRemaining] = useState<Remaining>(() => getRemaining(deadlineMs));
-
-  useEffect(() => {
-    setRemaining(getRemaining(deadlineMs));
-    const interval = setInterval(() => {
-      const next = getRemaining(deadlineMs);
-      setRemaining(next);
-      if (next.expired) clearInterval(interval);
-    }, 1000);
-    return () => clearInterval(interval);
-  }, [deadlineMs]);
-
-  const accentBg = remaining.expired ? "#FBEAE7" : "#FEF6E6";
-  const accentFg = remaining.expired ? "#C0392B" : "#B07D14";
-
-  return (
-    <SectionCard
-      p={22}
-      style={
-        remaining.expired
-          ? undefined
-          : { borderColor: "#F2E4C4", boxShadow: "0 0 0 1px #FBEAC2" }
-      }
-    >
-      <Group justify="space-between" align="center">
-        <CardTitle>Payment deadline</CardTitle>
-        <Group
-          component="span"
-          gap={6}
-          align="center"
-          wrap="nowrap"
-          style={{
-            display: "inline-flex",
-            borderRadius: 999,
-            padding: "5px 11px",
-            fontSize: 11.5,
-            fontWeight: 700,
-            backgroundColor: accentBg,
-            color: accentFg,
-          }}
-        >
-          <Timer size={13} />
-          {remaining.expired ? "Expired" : "Pay window open"}
-        </Group>
-      </Group>
-
-      {remaining.expired ? (
-        <Text mt={14} fz="13.5px" c="#6B7C8E">
-          The payment window has closed. Move this booking to another schedule or
-          contact support.
-        </Text>
-      ) : (
-        <>
-          <Group justify="space-between" mt={16} wrap="nowrap" px={4}>
-            <Segment value={remaining.days} label="Days" />
-            <Segment value={remaining.hours} label="Hrs" />
-            <Segment value={remaining.minutes} label="Min" />
-            <Segment value={remaining.seconds} label="Sec" />
-          </Group>
-          <Text mt={14} fz="12.5px" c="#9AA8B5" ta="center">
-            Complete payment before the window closes to secure your slot.
-          </Text>
-          {onPay && (
-            <Button
-              fullWidth
-              mt={16}
-              radius={10}
-              color="edr-green"
-              leftSection={<CreditCard size={17} />}
-              onClick={onPay}
-              loading={paying}
-              styles={{ root: { height: 46 }, label: { fontSize: 13.5, fontWeight: 700 } }}
-            >
-              Pay now
-            </Button>
-          )}
-        </>
-      )}
-
-      <Box mt={16} h={1} w="100%" bg="#EEF2F6" />
-      <Text mt={12} fz="12px" c="#9AA8B5">
-        Deadline:{" "}
-        {new Date(paymentDeadline).toLocaleString(undefined, {
-          month: "short",
-          day: "numeric",
-          hour: "2-digit",
-          minute: "2-digit",
-        })}
-      </Text>
-    </SectionCard>
-  );
-}
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/WarehousePaymentsSection.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/WarehousePaymentsSection.tsx
new file mode 100644
index 000000000..146e31c1e
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/WarehousePaymentsSection.tsx
@@ -0,0 +1,156 @@
+import { ActionIcon, Box, Group, Stack, Text } from "@mantine/core";
+import { useQuery } from "@tanstack/react-query";
+import { Download, Receipt } from "lucide-react";
+import toast from "react-hot-toast";
+
+import {
+  warehouseInvoicesService,
+  type PortalWarehouseInvoice,
+} from "@/services/warehouse-invoices.service";
+import { saveBlob } from "@/utils/download";
+
+import { CardTitle, SectionCard } from "./layout";
+
+const money = (amount: number | string | null | undefined, currency: string) =>
+  `${Number(amount ?? 0).toLocaleString()} ${currency}`;
+
+const STATUS_STYLE: Record<string, { bg: string; fg: string }> = {
+  DRAFT: { bg: "#EEF2F6", fg: "#64748B" },
+  ISSUED: { bg: "#FEF3E2", fg: "#B45309" },
+  PARTIALLY_PAID: { bg: "#FEF9E7", fg: "#A16207" },
+  PAID: { bg: "#E6F7EF", fg: "#0A6F4D" },
+  CANCELLED: { bg: "#EEF2F6", fg: "#64748B" },
+};
+
+function StatusPill({ status }: { status: string }) {
+  const s = STATUS_STYLE[status] ?? { bg: "#EEF2F6", fg: "#64748B" };
+  return (
+    <Box
+      style={{
+        display: "inline-flex",
+        alignItems: "center",
+        padding: "3px 9px",
+        borderRadius: 999,
+        background: s.bg,
+        color: s.fg,
+        fontSize: 11,
+        fontWeight: 700,
+        whiteSpace: "nowrap",
+      }}
+    >
+      {status.replace(/_/g, " ")}
+    </Box>
+  );
+}
+
+/**
+ * Warehouse fee invoices linked to this booking — display + PDF download only.
+ * Paying them online is tracked separately (in-system demurrage/storage
+ * payment). Renders nothing when the booking has no warehouse fees. Carries
+ * `id="warehouse-payments"` so the invoice detail page can deep-link here.
+ */
+export function WarehousePaymentsSection({ bookingId }: { bookingId: string }) {
+  const { data: invoices = [] } = useQuery({
+    queryKey: ["booking-warehouse-invoices", bookingId],
+    queryFn: () => warehouseInvoicesService.listForBooking(bookingId),
+  });
+
+  if (invoices.length === 0) return null;
+
+  const download = async (inv: PortalWarehouseInvoice) => {
+    try {
+      saveBlob(
+        await warehouseInvoicesService.downloadDocument(inv.id),
+        `warehouse-invoice-${inv.invoiceNumber}.pdf`,
+      );
+    } catch {
+      toast.error("Warehouse invoice PDF isn't ready yet.");
+    }
+  };
+
+  const downloadReceipt = async (inv: PortalWarehouseInvoice) => {
+    try {
+      saveBlob(
+        await warehouseInvoicesService.downloadReceipt(inv.id),
+        `warehouse-receipt-${inv.invoiceNumber}.pdf`,
+      );
+    } catch {
+      toast.error("Receipt isn't available yet.");
+    }
+  };
+
+  return (
+    <SectionCard id="warehouse-payments">
+      <Group justify="space-between" align="center" mb="md">
+        <CardTitle>Warehouse payments</CardTitle>
+        <Text fz="12.5px" fw={600} c="#9AA8B5">
+          {invoices.length} {invoices.length === 1 ? "invoice" : "invoices"}
+        </Text>
+      </Group>
+      <Stack gap={12}>
+        {invoices.map((inv) => {
+          const detail = [
+            inv.invoiceType?.replace(/_/g, " "),
+            inv.cargoDescription ??
+              inv.containerNumber ??
+              inv.inventoryReference ??
+              undefined,
+          ]
+            .filter(Boolean)
+            .join(" · ");
+          return (
+            <Group
+              key={inv.id}
+              justify="space-between"
+              align="flex-start"
+              wrap="nowrap"
+              style={{
+                border: "1px solid #EEF2F6",
+                borderRadius: 12,
+                padding: "12px 14px",
+              }}
+            >
+              <Box style={{ minWidth: 0 }}>
+                <Group gap={8} wrap="nowrap">
+                  <Text fz="13.5px" fw={700} c="#10202F">
+                    {inv.invoiceNumber}
+                  </Text>
+                  <StatusPill status={inv.status} />
+                </Group>
+                {detail && (
+                  <Text fz="12px" c="#9AA8B5" mt={2}>
+                    {detail}
+                  </Text>
+                )}
+                <Text fz="12.5px" c="#6B7C8E" mt={4}>
+                  Total {money(inv.totalAmount, inv.currency)} · Balance{" "}
+                  {money(inv.balanceAmount, inv.currency)}
+                </Text>
+              </Box>
+              <Group gap={6} wrap="nowrap">
+                <ActionIcon
+                  variant="subtle"
+                  color="gray"
+                  aria-label="Download invoice"
+                  onClick={() => download(inv)}
+                >
+                  <Download size={16} />
+                </ActionIcon>
+                {Number(inv.paidAmount) > 0 && (
+                  <ActionIcon
+                    variant="subtle"
+                    color="gray"
+                    aria-label="Download receipt"
+                    onClick={() => downloadReceipt(inv)}
+                  >
+                    <Receipt size={16} />
+                  </ActionIcon>
+                )}
+              </Group>
+            </Group>
+          );
+        })}
+      </Stack>
+    </SectionCard>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/layout.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/layout.tsx
index 92281a032..6cf70da5f 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/layout.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/layout.tsx
@@ -36,6 +36,7 @@ export function BodyGrid({ left, right }: { left: ReactNode; right: ReactNode })
 interface SectionCardProps extends PaperProps {
   children: ReactNode;
   ref?: Ref<HTMLDivElement>;
+  id?: string;
 }
 
 export function SectionCard({ children, ref, style, ...props }: SectionCardProps) {
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/pricing.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/pricing.tsx
index 93d843065..8c4ab9bcb 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/pricing.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/components/pricing.tsx
@@ -1,9 +1,7 @@
 import { Box, Group, Stack, Text } from "@mantine/core";
-import { CheckCircle2, Clock } from "lucide-react";
+import { Clock } from "lucide-react";
 
-import type { Freight } from "@edr/types";
-
-import { fmtDate, priceLineItems, priceTotal, type Pricing } from "../utils";
+import { priceLineItems, priceTotal, type Pricing } from "../utils";
 import { CardTitle, SectionCard } from "./layout";
 
 function LineItems({ pricing }: { pricing: Pricing }) {
@@ -107,113 +105,6 @@ export function EstimateCard({
   );
 }
 
-export function PaymentCard({
-  booking,
-  pricing,
-}: {
-  booking: Freight.IBooking;
-  pricing: Pricing;
-}) {
-  const paid = booking.paymentStatus === "PAID";
-  // Customer sees the grand total plus the price breakdown that makes it up.
-  // A staff adjustment, when present, overrides the computed total and is
-  // flagged with an "Adjusted by EDR" badge.
-  const isAdjusted =
-    booking.adjustedTotalAmount !== null &&
-    booking.adjustedTotalAmount !== undefined;
-  const currency = pricing?.currency ?? booking.paymentCurrency;
-  const total = isAdjusted
-    ? `${Number(booking.adjustedTotalAmount).toLocaleString()} ${currency}`
-    : priceTotal(pricing);
-  const hasItems = priceLineItems(pricing).length > 0;
-
-  return (
-    <SectionCard p={22}>
-      <Group justify="space-between" align="center">
-        <CardTitle>Payment</CardTitle>
-        <Group
-          component="span"
-          gap={6}
-          align="center"
-          wrap="nowrap"
-          style={{
-            display: "inline-flex",
-            borderRadius: 999,
-            padding: "5px 11px",
-            fontSize: 11.5,
-            fontWeight: 700,
-            backgroundColor: paid ? "#ECF6F1" : "#FDF3E0",
-            color: paid ? "#0A6F4D" : "#9A5B00",
-            border: paid ? "1px solid #CDEBDD" : undefined,
-          }}
-        >
-          {paid && <CheckCircle2 size={13} />}
-          {paid
-            ? "Paid"
-            : (booking.paymentStatus?.replace(/_/g, " ") ?? "Pending")}
-        </Group>
-      </Group>
-      <Box mt={12}>
-        <Text fz="26px" fw={800} c="#10202F">
-          {total}
-        </Text>
-        {isAdjusted && (
-          <Box
-            component="span"
-            mt={6}
-            style={{
-              display: "inline-block",
-              borderRadius: 6,
-              backgroundColor: "#EAF1FB",
-              padding: "3px 8px",
-              fontSize: 11,
-              fontWeight: 700,
-              color: "#2E5B96",
-            }}
-          >
-            Adjusted by EDR
-          </Box>
-        )}
-        {isAdjusted && booking.adjustmentReason && (
-          <Text mt={6} fz="12.5px" c="#6B7C8E">
-            {booking.adjustmentReason}
-          </Text>
-        )}
-        {paid && (
-          <Text mt={4} fz="12.5px" c="#9AA8B5">
-            Paid · {fmtDate(booking.updatedAt)}
-          </Text>
-        )}
-      </Box>
-      {hasItems && (
-        <>
-          <Divider />
-          <LineItems pricing={pricing} />
-          <Group
-            justify="space-between"
-            mt={12}
-            pt={14}
-            style={{ borderTop: "1px solid #EEF2F6" }}
-          >
-            <Text fz="14px" fw={800} c="#10202F">
-              {isAdjusted ? "Adjusted total" : "Total"}
-            </Text>
-            <Text fz="15px" fw={800} c="#10202F">
-              {total}
-            </Text>
-          </Group>
-        </>
-      )}
-      {/* <Button */}
-      {/*   fullWidth */}
-      {/*   mt={16} */}
-      {/*   variant="default" */}
-      {/*   radius={10} */}
-      {/*   leftSection={<FileText size={17} color="#475569" />} */}
-      {/*   styles={{ root: { height: 46 }, label: { fontSize: 13.5, fontWeight: 700, color: "#10202F" } }} */}
-      {/* > */}
-      {/*   Download invoice */}
-      {/* </Button> */}
-    </SectionCard>
-  );
-}
+// The booking payment card (countdown + breakdown + invoices + download) now
+// lives in ./BookingPaymentPanel. EstimateCard above stays for the draft and
+// changes-requested views, which only show an estimate.
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/index.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/index.tsx
index 46f1d1921..a06a89ca0 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/index.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage/index.tsx
@@ -94,5 +94,5 @@ export default function BookingDetailPage() {
       <DraftBookingView booking={booking} onBookingUpdated={refetchBooking} />
     );
   }
-  return <ReadonlyBookingView booking={booking} />;
+  return <ReadonlyBookingView booking={booking} onBookingUpdated={refetchBooking} />;
 }
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/EditBookingPage.tsx b/apps/edr-freight-web/portal/src/pages/bookings/EditBookingPage.tsx
index e9cdf1bf2..cce837bc6 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/EditBookingPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/EditBookingPage.tsx
@@ -29,9 +29,7 @@ import {
   Check,
   Download,
   FileText,
-  Flame,
   MapPin,
-  Snowflake,
   Truck,
   Upload,
   X,
@@ -48,6 +46,7 @@ import {
   BOOKING_DOCS_SETTING,
   BookingFormInputValues,
   bookingFormSchema,
+  filterBookableServices,
   getRouteDirection,
   initialBookingFormValues,
   type BookingDocuments,
@@ -102,6 +101,8 @@ function defaultContainerTypeForSize(
 interface BookingContainerRow {
   quantity: number;
   vgmPerUnitTons: number | string;
+  hazardousQuantity?: number | string | null;
+  reeferQuantity?: number | string | null;
   containerType?: {
     sizeFt?: number | null;
     label?: string | null;
@@ -150,6 +151,8 @@ function mapBookingToFormValues(
     cargoWeight: String(booking.cargoTotalWeightVgm ?? ""),
     isHazardous: booking.isHazardous ?? false,
     isRefrigerated: booking.isRefrigerated ?? false,
+    bulkHazardousQty: String(Number(booking.bulkHazardousQuantity ?? 0)),
+    bulkReeferQty: String(Number(booking.bulkReeferQuantity ?? 0)),
     paymentCurrency:
       booking.paymentCurrency === "ETB" ? "ETB" : "USD",
     scheduledDate: booking.scheduledDate
@@ -183,10 +186,16 @@ function mapBookingToFormValues(
               ? bc.containerType.label
               : (bc.containerType?.code ??
                 defaultContainerTypeForSize(referenceData, size));
+            const hazQty = Number(bc.hazardousQuantity ?? 0);
+            const reeQty = Number(bc.reeferQuantity ?? 0);
             return {
               type: size,
               containerType: typeName,
               qty: String(bc.quantity ?? 1),
+              isHazardous: hazQty > 0,
+              hazardousQty: String(hazQty),
+              isReefer: reeQty > 0,
+              reeferQty: String(reeQty),
               vgm: String(Number(bc.vgmPerUnitTons ?? 0)),
             };
           })
@@ -195,6 +204,10 @@ function mapBookingToFormValues(
               type: "20ft" as const,
               containerType: defaultContainerTypeForSize(referenceData, "20ft"),
               qty: "1",
+              isHazardous: false,
+              hazardousQty: "0",
+              isReefer: false,
+              reeferQty: "0",
               vgm: "",
             },
           ];
@@ -343,6 +356,7 @@ export default function EditBookingPage() {
   const originYard = form.watch("originYard");
   const destinationYard = form.watch("destinationYard");
   const serviceTypeId = form.watch("serviceTypeId");
+  const operationType = form.watch("operationType");
   const firstMileEnabled = form.watch("firstMile.enabled");
   const lastMileEnabled = form.watch("lastMile.enabled");
   const customsClearingEnabled = form.watch("customsClearingEnabled");
@@ -352,6 +366,12 @@ export default function EditBookingPage() {
     () => referenceData?.service.find((s) => s.id === serviceTypeId),
     [serviceTypeId, referenceData],
   );
+
+  const bookableServices = useMemo(
+    () => filterBookableServices(referenceData?.service, operationType),
+    [referenceData, operationType],
+  );
+
   const showFirstMile = Boolean(
     selectedService?.includesFirstMile && firstMileEnabled,
   );
@@ -435,7 +455,27 @@ export default function EditBookingPage() {
             : "IMPORT",
       cargoTypeId: data.cargoType === "container" ? undefined : cargoTypeId,
       cargoTotalWeightVgm: totalWeight,
-      isHazardous: data.isHazardous,
+      // Containers: booking-level flags are the OR of the per-container switches;
+      // bulk uses the route-step toggles.
+      isHazardous:
+        data.cargoType === "container"
+          ? data.containers.some((c) => c.isHazardous)
+          : data.isHazardous,
+      isReefer:
+        data.cargoType === "container"
+          ? data.containers.some((c) => c.isReefer)
+          : data.isRefrigerated,
+      // Bulk-only hazardous / refrigerated amount in the cargo's unit.
+      ...(data.cargoType === "bulk"
+        ? {
+            bulkHazardousQuantity: data.isHazardous
+              ? Number(data.bulkHazardousQty || 0)
+              : 0,
+            bulkReeferQuantity: data.isRefrigerated
+              ? Number(data.bulkReeferQty || 0)
+              : 0,
+          }
+        : {}),
       paymentCurrency: data.paymentCurrency,
       freightType:
         data.cargoType === "container"
@@ -446,6 +486,8 @@ export default function EditBookingPage() {
           ? data.containers.map((c) => ({
               containerTypeId: findContainerTypeId(c.containerType),
               quantity: Number(c.qty || 1),
+              hazardousQuantity: c.isHazardous ? Number(c.hazardousQty || 0) : 0,
+              reeferQuantity: c.isReefer ? Number(c.reeferQty || 0) : 0,
               vgmPerUnitTons: Number(c.vgm || 0),
             }))
           : [],
@@ -602,9 +644,10 @@ export default function EditBookingPage() {
                   error={fieldState.error}
                   label="Service Type *"
                   placeholder="Select service type..."
-                  data={(referenceData?.service ?? [])
-                    .filter((s) => s.canBeBookedAlone)
-                    .map((s) => ({ value: s.id, label: s.serviceName }))}
+                  data={bookableServices.map((s) => ({
+                    value: s.id,
+                    label: s.serviceName,
+                  }))}
                 />
               )}
             />
@@ -857,35 +900,9 @@ export default function EditBookingPage() {
             </Stack>
           )}
 
-          <Paper withBorder radius="md">
-            <Controller
-              name="isHazardous"
-              control={form.control}
-              render={({ field }) => (
-                <ToggleRow
-                  icon={<Flame size={16} color="#E03131" />}
-                  title="Hazardous Material"
-                  description="Applies a Hazard Surcharge to the final bill."
-                  checked={field.value}
-                  onChange={field.onChange}
-                />
-              )}
-            />
-            <Divider />
-            <Controller
-              name="isRefrigerated"
-              control={form.control}
-              render={({ field }) => (
-                <ToggleRow
-                  icon={<Snowflake size={16} color="#1C7ED6" />}
-                  title="Refrigerated Cargo"
-                  description="Temperature-controlled transport applies a Refrigerator Surcharge."
-                  checked={field.value}
-                  onChange={field.onChange}
-                />
-              )}
-            />
-          </Paper>
+          {/* Cargo handling (hazardous / refrigerated, with per-unit amounts)
+              now lives in the Cargo tab via Step5CargoDetails — no separate
+              toggles here, to avoid duplicate controls that diverge. */}
         </Stack>
         </Tabs.Panel>
 
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/NewBookingPage.tsx b/apps/edr-freight-web/portal/src/pages/bookings/NewBookingPage.tsx
index cbc16d2ab..80ed05eb0 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/NewBookingPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/NewBookingPage.tsx
@@ -422,9 +422,8 @@ export default function NewBookingPage() {
 
     const cargoTypeId = data.cargoType === "bulk" ? childId : undefined;
 
-    const cargoFreeText = bulkChild?.show_free_text_box
-      ? data.cargoFreeText
-      : undefined;
+    const cargoFreeText =
+      data.cargoType === "bulk" ? data.cargoFreeText : undefined;
 
     const serviceType = referenceData?.service.find(
       (s) => s.id === data.serviceTypeId,
@@ -458,10 +457,28 @@ export default function NewBookingPage() {
       // Day-level pool: the customer picks only a day (scheduledDate); the batch
       // engine assigns the train, so no trainScheduleId is sent.
       cargoTotalWeightVgm: totalWeight,
-      isHazardous: data.isHazardous,
-      // Reefer is a customer choice for bulk only; container reefer is decided by
-      // the container type on the backend, so never send it for containers.
-      isReefer: data.cargoType === "bulk" ? data.isRefrigerated : false,
+      // Booking-level flags drive the HAZARD / REEFER surcharge triggers. For
+      // containers they're the OR of the per-container switches; for bulk they
+      // come from the cargo-step toggles.
+      isHazardous:
+        data.cargoType === "container"
+          ? data.containers.some((c) => c.isHazardous)
+          : data.isHazardous,
+      isReefer:
+        data.cargoType === "container"
+          ? data.containers.some((c) => c.isReefer)
+          : data.isRefrigerated,
+      // Bulk-only: the hazardous / refrigerated amount in the cargo's unit.
+      ...(data.cargoType === "bulk"
+        ? {
+            bulkHazardousQuantity: data.isHazardous
+              ? Number(data.bulkHazardousQty || 0)
+              : 0,
+            bulkReeferQuantity: data.isRefrigerated
+              ? Number(data.bulkReeferQty || 0)
+              : 0,
+          }
+        : {}),
       freightType:
         data.cargoType === "container"
           ? ("CONTAINER" as const)
@@ -471,6 +488,9 @@ export default function NewBookingPage() {
           ? data.containers.map((c) => ({
             containerTypeId: findContainerTypeId(c.containerType),
             quantity: Number(c.qty || 1),
+            // Per-line breakdown: how many of this line are hazardous / reefer.
+            hazardousQuantity: c.isHazardous ? Number(c.hazardousQty || 0) : 0,
+            reeferQuantity: c.isReefer ? Number(c.reeferQty || 0) : 0,
             // Weight (VGM) is not collected at the wizard — captured in operations.
             vgmPerUnitTons: 0,
           }))
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/clearance/ClearanceFlow.tsx b/apps/edr-freight-web/portal/src/pages/bookings/clearance/ClearanceFlow.tsx
index 4400df5eb..86566eba0 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/clearance/ClearanceFlow.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/clearance/ClearanceFlow.tsx
@@ -1,12 +1,9 @@
 import {
   Alert,
   Box,
-  Button,
-  FileButton,
   Group,
   Stack,
   Text,
-  TextInput,
 } from "@mantine/core";
 import {
   AlertCircle,
@@ -15,58 +12,22 @@ import {
   Download,
   Eye,
   FileText,
-  Plus,
-  Upload,
 } from "lucide-react";
 
 import type { Freight } from "@edr/types";
 import { isViewable } from "@edr/ui-common";
 
 import { IconSquare } from "../BookingDetailPage/components/Documents";
+import {
+  ClearanceAdHocUploadSection,
+} from "@/components/contracts/ClearanceAdHocUploadSection";
+import { ClearanceDocumentUploadCard } from "@/components/contracts/ClearanceDocumentUploadCard";
 import { fileViewUrl } from "@/constants/apiConfig";
 import { useFileViewer } from "@/hooks/useFileViewer";
 import { OperationDatePicker } from "./OperationDatePicker";
 import type { ClearanceFlowController } from "./useClearanceFlow";
 
-const GREEN = "#0A6F4D";
-
-function StatusPill({ doc }: { doc: Freight.ClearanceDocument }) {
-  if (doc.reviewStatus === "APPROVED") {
-    return (
-      <Group gap={6} c={GREEN}>
-        <CheckCircle2 size={15} />
-        <Text fz="12px" fw={600} c={GREEN}>
-          Approved
-        </Text>
-      </Group>
-    );
-  }
-  if (doc.reviewStatus === "QUERIED") {
-    return (
-      <Group gap={6} c="#C0392B">
-        <AlertCircle size={15} />
-        <Text fz="12px" fw={600} c="#C0392B">
-          Queried
-        </Text>
-      </Group>
-    );
-  }
-  if (doc.file) {
-    return (
-      <Group gap={6} c="#2E5B96">
-        <Clock size={15} />
-        <Text fz="12px" fw={600} c="#2E5B96">
-          Pending review
-        </Text>
-      </Group>
-    );
-  }
-  return (
-    <Text fz="12px" fw={600} c="#9AA8B5">
-      Not uploaded
-    </Text>
-  );
-}
+const BORDER = "#E6ECF2";
 
 interface ClearanceFlowProps {
   booking: Freight.IBooking;
@@ -101,6 +62,7 @@ export function ClearanceFlow({ booking, flow, footer }: ClearanceFlowProps) {
     missingRequired,
     stagePending,
     addAdHocRow,
+    removeAdHocRow,
     setAdHocName,
     setAdHocFile,
     scheduledDate,
@@ -143,84 +105,32 @@ export function ClearanceFlow({ booking, flow, footer }: ClearanceFlowProps) {
         </Alert>
       )}
 
-      <Stack gap={10}>
+      <Stack gap="md">
+        <Box>
+          <Text fz={13} fw={700} c="#10202F">
+            Your clearance documents
+          </Text>
+          <Text fz={12} c="dimmed" mt={4}>
+            Upload each required document below. Items marked * are mandatory.
+          </Text>
+        </Box>
         {customerDocs.map((doc) => (
-          <Box
+          <ClearanceDocumentUploadCard
             key={doc.fileKey}
-            className="rounded-xl"
-            style={{ border: "1px solid #E6ECF2", padding: 12 }}
-          >
-            <Group justify="space-between" align="center" wrap="nowrap">
-              <Group gap={10} wrap="nowrap" style={{ minWidth: 0 }}>
-                <Box c="#2E5B96">
-                  <FileText size={18} />
-                </Box>
-                <Box style={{ minWidth: 0 }}>
-                  <Text fz="13.5px" fw={600} c="#10202F" truncate>
-                    {doc.label}
-                    {doc.required ? " *" : ""}
-                  </Text>
-                  {doc.file && (
-                    <Text fz="12px" c="dimmed" truncate>
-                      {doc.file.name}
-                    </Text>
-                  )}
-                </Box>
-              </Group>
-              <Group gap={10} wrap="nowrap">
-                <StatusPill doc={doc} />
-                {doc.file &&
-                  isViewable({
-                    name: doc.file.name,
-                    url: fileViewUrl(doc.file.id),
-                  }) && (
-                    <IconSquare
-                      icon={<Eye size={15} />}
-                      onClick={() =>
-                        view({
-                          name: doc.file!.name,
-                          url: fileViewUrl(doc.file!.id),
-                        })
-                      }
-                    />
-                  )}
-                {doc.file && (
-                  <IconSquare
-                    href={fileViewUrl(doc.file.id, true)}
-                    icon={<Download size={15} />}
-                  />
-                )}
-                {canUpload && doc.reviewStatus !== "APPROVED" && (
-                  <FileButton
-                    onChange={(f) => f && stagePending(doc.fileKey, f)}
-                    accept="application/pdf,image/*"
-                  >
-                    {(props) => (
-                      <Button
-                        {...props}
-                        size="compact-xs"
-                        variant="light"
-                        color="edr-green"
-                        leftSection={<Upload size={13} />}
-                      >
-                        {pending[doc.fileKey] ? "Selected" : "Upload"}
-                      </Button>
-                    )}
-                  </FileButton>
-                )}
-              </Group>
-            </Group>
-            {doc.reviewStatus === "QUERIED" && doc.note && (
-              <Text fz="12px" c="#C0392B" mt={6}>
-                Query: {doc.note}
-              </Text>
-            )}
-            {pending[doc.fileKey] && (
-              <Text fz="12px" c={GREEN} mt={6}>
-                Ready to upload: {pending[doc.fileKey].name}
-              </Text>
-            )}
-          </Box>
+            label={doc.label}
+            required={doc.required}
+            reviewStatus={doc.reviewStatus}
+            note={doc.note}
+            uploadedFile={doc.file}
+            stagedFile={pending[doc.fileKey] ?? null}
+            canUpload={canUpload}
+            onStageFile={
+              canUpload && doc.reviewStatus !== "APPROVED"
+                ? (file) => stagePending(doc.fileKey, file)
+                : undefined
+            }
+            onPreview={view}
+          />
         ))}
       </Stack>
 
@@ -237,16 +147,37 @@ export function ClearanceFlow({ booking, flow, footer }: ClearanceFlowProps) {
                 justify="space-between"
                 wrap="nowrap"
                 className="rounded-xl"
-                style={{ border: "1px solid #E6ECF2", padding: 10 }}
+                style={{ border: `1px solid ${BORDER}`, padding: 10 }}
               >
-                <Text fz="13px" c="#10202F" truncate>
-                  {doc.label}
-                </Text>
+                <Group gap={10} wrap="nowrap" style={{ minWidth: 0 }}>
+                  <Box c="#2E5B96">
+                    <FileText size={18} />
+                  </Box>
+                  <Text fz="13px" c="#10202F" truncate>
+                    {doc.label}
+                  </Text>
+                </Group>
                 {doc.file ? (
-                  <IconSquare
-                    href={fileViewUrl(doc.file.id, true)}
-                    icon={<Download size={15} />}
-                  />
+                  <Group gap={8} wrap="nowrap">
+                    {isViewable({
+                      name: doc.file.name,
+                      url: fileViewUrl(doc.file.id),
+                    }) && (
+                      <IconSquare
+                        icon={<Eye size={15} />}
+                        onClick={() =>
+                          view({
+                            name: doc.file!.name,
+                            url: fileViewUrl(doc.file!.id),
+                          })
+                        }
+                      />
+                    )}
+                    <IconSquare
+                      href={fileViewUrl(doc.file.id, true)}
+                      icon={<Download size={15} />}
+                    />
+                  </Group>
                 ) : (
                   <Text fz="12px" c="#9AA8B5">
                     Pending
@@ -258,48 +189,16 @@ export function ClearanceFlow({ booking, flow, footer }: ClearanceFlowProps) {
         </>
       )}
 
-      {/* Ad-hoc / additional documents. */}
-      {canUpload && (
-        <Box mt="lg">
-          <Group justify="space-between" align="center" mb={8}>
-            <Text fz="12.5px" fw={700} c="#10202F">
-              Additional documents
-            </Text>
-            <Button
-              size="compact-xs"
-              variant="light"
-              color="edr-green"
-              leftSection={<Plus size={13} />}
-              onClick={addAdHocRow}
-            >
-              Add document
-            </Button>
-          </Group>
-          <Stack gap={8}>
-            {adHoc.map((row, i) => (
-              <Group key={i} gap={8} wrap="nowrap">
-                <TextInput
-                  placeholder="Document name"
-                  value={row.name}
-                  onChange={(e) => setAdHocName(i, e.currentTarget.value)}
-                  style={{ flex: 1 }}
-                  radius="md"
-                />
-                <FileButton
-                  onChange={(f) => setAdHocFile(i, f)}
-                  accept="application/pdf,image/*"
-                >
-                  {(props) => (
-                    <Button {...props} variant="default" radius="md">
-                      {row.file ? row.file.name.slice(0, 14) : "Choose file"}
-                    </Button>
-                  )}
-                </FileButton>
-              </Group>
-            ))}
-          </Stack>
-        </Box>
-      )}
+      {canUpload ? (
+        <ClearanceAdHocUploadSection
+          rows={adHoc}
+          onAdd={addAdHocRow}
+          onRemove={removeAdHocRow}
+          onNameChange={setAdHocName}
+          onFileChange={setAdHocFile}
+          onPreview={view}
+        />
+      ) : null}
 
       {uploadMutation.isError && (
         <Alert color="red" radius="md" icon={<AlertCircle size={16} />} mt="md">
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/clearance/useClearanceFlow.ts b/apps/edr-freight-web/portal/src/pages/bookings/clearance/useClearanceFlow.ts
index e8380c8ec..ab9560ac6 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/clearance/useClearanceFlow.ts
+++ b/apps/edr-freight-web/portal/src/pages/bookings/clearance/useClearanceFlow.ts
@@ -97,11 +97,19 @@ export function useClearanceFlow(booking: Freight.IBooking) {
 
   // --- staged-upload mutators ----------------------------------------------
 
-  const stagePending = (fileKey: string, file: File) =>
-    setPending((p) => ({ ...p, [fileKey]: file }));
+  const stagePending = (fileKey: string, file: File | null) =>
+    setPending((p) => {
+      if (file) return { ...p, [fileKey]: file };
+      const next = { ...p };
+      delete next[fileKey];
+      return next;
+    });
 
   const addAdHocRow = () => setAdHoc((r) => [...r, { name: "", file: null }]);
 
+  const removeAdHocRow = (index: number) =>
+    setAdHoc((rows) => rows.filter((_, j) => j !== index));
+
   const setAdHocName = (index: number, name: string) =>
     setAdHoc((rows) =>
       rows.map((r, j) => (j === index ? { ...r, name } : r)),
@@ -148,6 +156,7 @@ export function useClearanceFlow(booking: Freight.IBooking) {
     canSubmit,
     stagePending,
     addAdHocRow,
+    removeAdHocRow,
     setAdHocName,
     setAdHocFile,
     // schedule
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/delivery/ApproveDeliveryButton.tsx b/apps/edr-freight-web/portal/src/pages/bookings/delivery/ApproveDeliveryButton.tsx
index 0f0ded4ef..e9ee31722 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/delivery/ApproveDeliveryButton.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/delivery/ApproveDeliveryButton.tsx
@@ -21,6 +21,17 @@ const errorMessage = (error: unknown) => {
   return error instanceof Error ? error.message : "Could not approve delivery";
 };
 
+const downloadBlob = (blob: Blob, filename: string) => {
+  const url = URL.createObjectURL(blob);
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = filename;
+  document.body.appendChild(link);
+  link.click();
+  link.remove();
+  URL.revokeObjectURL(url);
+};
+
 export function ApproveDeliveryButton({
   bookingId,
   stopPropagation,
@@ -32,10 +43,19 @@ export function ApproveDeliveryButton({
   const navigate = useNavigate();
   const queryClient = useQueryClient();
 
+  const handoverMutation = useMutation(api.bookings.downloadHandoverDocument.mutationOptions());
+
   const mutation = useMutation({
     ...api.bookings.approveDelivery.mutationOptions(),
-    onSuccess: async () => {
-      toast.success("Delivery approved and handover signed");
+    onSuccess: async (result) => {
+      try {
+        const blob = await handoverMutation.mutateAsync({ inventoryId: result.inventoryId });
+        downloadBlob(blob, `handover-${bookingId}.pdf`);
+        toast.success("Delivery approved and signed handover downloaded");
+      } catch {
+        toast.success("Delivery approved and handover signed");
+        toast.error("Signed handover document could not be downloaded");
+      }
       await Promise.all([
         queryClient.invalidateQueries({ queryKey: api.bookings.get.queryKey({ id: bookingId }) }),
         queryClient.invalidateQueries({ queryKey: api.bookings.list.queryKey() }),
@@ -48,6 +68,8 @@ export function ApproveDeliveryButton({
       toast.error(message);
       if (message.toLowerCase().includes("save your signature")) {
         navigate("/signature");
+      } else if (/demurrage|storage|warehouse invoice|fully paid/i.test(message)) {
+        navigate("/billing");
       }
     },
   });
@@ -64,7 +86,7 @@ export function ApproveDeliveryButton({
       variant={variant}
       color="edr-green"
       leftSection={<CheckCircle2 size={16} />}
-      loading={mutation.isPending}
+      loading={mutation.isPending || handoverMutation.isPending}
       onClick={handleClick}
     >
       Approve delivery
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/schema.ts b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/schema.ts
index 84b8172c6..2b902bdc8 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/schema.ts
+++ b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/schema.ts
@@ -169,6 +169,11 @@ export const bookingFormSchema = z
     cargoFreeText: z.string(),
     isHazardous: z.boolean(),
     isRefrigerated: z.boolean(),
+    // Bulk-only: how much of the cargo is hazardous / refrigerated, in the
+    // commodity's unit (tons for PER_TON, item count for PER_ITEM). Bounded by
+    // cargoWeight in superRefine when the matching flag is on.
+    bulkHazardousQty: z.string().default("0"),
+    bulkReeferQty: z.string().default("0"),
     containers: z.array(
       z.object({
         type: z.enum(["20ft", "40ft"]),
@@ -178,6 +183,13 @@ export const bookingFormSchema = z
           .refine((q) => q.length !== 0, "Quantity is required.")
           .refine((q) => !isNaN(+q), "Enter a valid Number")
           .refine((qty) => Number(qty) >= 1, "Must be greater than 0"),
+        // Per-line hazmat/reefer: how many of this line's containers are
+        // hazardous / refrigerated. The flag drives whether the quantity input
+        // shows; the quantity (bounded by qty above) is validated in superRefine.
+        isHazardous: z.boolean().default(false),
+        hazardousQty: z.string().default("0"),
+        isReefer: z.boolean().default(false),
+        reeferQty: z.string().default("0"),
         // Weight (VGM) is NOT collected at the wizard — it is captured later in
         // operations. Kept optional so existing payload code stays valid.
         vgm: z.string().default("0"),
@@ -253,9 +265,48 @@ export const bookingFormSchema = z
           message: "Select a Cargo type.",
         });
       }
+      // Bulk hazardous / refrigerated amounts, when their flag is on, must be
+      // 1..cargoWeight (in the commodity's own unit). cargoWeight itself is
+      // validated above, so here we just bound the portion against it.
+      const cargoQty = Number(data.cargoWeight);
+      const boundBulkPortion = (
+        on: boolean,
+        raw: string,
+        path: "bulkHazardousQty" | "bulkReeferQty",
+        noun: string,
+      ) => {
+        if (!on) return;
+        const v = Number(raw);
+        if (!raw || Number.isNaN(v) || v < 1) {
+          ctx.addIssue({
+            code: "custom",
+            path: [path],
+            message: `Enter how much is ${noun} (at least 1).`,
+          });
+        } else if (!Number.isNaN(cargoQty) && cargoQty > 0 && v > cargoQty) {
+          ctx.addIssue({
+            code: "custom",
+            path: [path],
+            message: `Can't exceed the cargo quantity (${cargoQty}).`,
+          });
+        }
+      };
+      boundBulkPortion(
+        data.isHazardous,
+        data.bulkHazardousQty,
+        "bulkHazardousQty",
+        "hazardous",
+      );
+      boundBulkPortion(
+        data.isRefrigerated,
+        data.bulkReeferQty,
+        "bulkReeferQty",
+        "refrigerated",
+      );
     }
     if (data.cargoType === "container") {
       data.containers.forEach((c, i) => {
+        const lineQty = Number(c.qty);
         if (!c.qty || +c.qty < 1) {
           ctx.addIssue({
             code: "custom",
@@ -263,6 +314,40 @@ export const bookingFormSchema = z
             message: "Enter at least 1 container.",
           });
         }
+        // When a per-line flag is on, its quantity must be 1..lineQty: at least
+        // one affected container, never more than the line holds.
+        if (c.isHazardous) {
+          const h = Number(c.hazardousQty);
+          if (!c.hazardousQty || Number.isNaN(h) || h < 1) {
+            ctx.addIssue({
+              code: "custom",
+              path: ["containers", i, "hazardousQty"],
+              message: "Enter how many are hazardous (at least 1).",
+            });
+          } else if (!Number.isNaN(lineQty) && h > lineQty) {
+            ctx.addIssue({
+              code: "custom",
+              path: ["containers", i, "hazardousQty"],
+              message: `Can't exceed the ${lineQty} container(s) in this line.`,
+            });
+          }
+        }
+        if (c.isReefer) {
+          const r = Number(c.reeferQty);
+          if (!c.reeferQty || Number.isNaN(r) || r < 1) {
+            ctx.addIssue({
+              code: "custom",
+              path: ["containers", i, "reeferQty"],
+              message: "Enter how many are refrigerated (at least 1).",
+            });
+          } else if (!Number.isNaN(lineQty) && r > lineQty) {
+            ctx.addIssue({
+              code: "custom",
+              path: ["containers", i, "reeferQty"],
+              message: `Can't exceed the ${lineQty} container(s) in this line.`,
+            });
+          }
+        }
       });
     }
   });
@@ -301,7 +386,20 @@ export const initialBookingFormValues: DeepPartial<BookingFormValues> = {
   cargoFreeText: "",
   isHazardous: false,
   isRefrigerated: false,
-  containers: [{ type: "20ft", containerType: "", qty: "1", vgm: "0" }],
+  bulkHazardousQty: "0",
+  bulkReeferQty: "0",
+  containers: [
+    {
+      type: "20ft",
+      containerType: "",
+      qty: "1",
+      isHazardous: false,
+      hazardousQty: "0",
+      isReefer: false,
+      reeferQty: "0",
+      vgm: "0",
+    },
+  ],
   documents: {},
   notes: "",
 };
@@ -320,14 +418,23 @@ export const stepFields: Record<number, Array<Path<BookingFormValues>>> = {
     "firstMile",
     "lastMile",
   ],
-  3: ["cargoType", "cargoWeight", "cargoTypePath", "containers"],
+  3: [
+    "cargoType",
+    "cargoWeight",
+    "cargoTypePath",
+    "containers",
+    // Cargo-handling flags + their bulk amounts now live in the Cargo step,
+    // under the quantity where the unit (tons/items) is known.
+    "isHazardous",
+    "isRefrigerated",
+    "bulkHazardousQty",
+    "bulkReeferQty",
+  ],
   4: [
     "originYard",
     "destinationYard",
     "primaryRouteQuantity",
     "extraRoutes",
-    "isHazardous",
-    "isRefrigerated",
     // Estimated shipment date now lives in the Route step (one-time bookings only).
     "scheduledDate",
   ],
@@ -339,6 +446,12 @@ export interface ContainerConfig {
   type: "20ft" | "40ft";
   containerType: string;
   qty: string;
+  // Per-line hazmat/reefer breakdown. Optional on the watched input shape: the
+  // schema defaults them, so a restored draft may omit them.
+  isHazardous?: boolean;
+  hazardousQty?: string;
+  isReefer?: boolean;
+  reeferQty?: string;
   // Optional: VGM is captured later in operations, not at the wizard, and the
   // form schema defaults it — so the watched input shape has it as optional.
   vgm?: string;
@@ -469,6 +582,24 @@ export function operationToProfileType(
   return "freight_forwarder";
 }
 
+export type BookableService = Freight.BookingReferenceData["service"][number];
+
+/**
+ * Services the customer may pick in the wizard. Intercity (domestic) corridors
+ * have no customs clearance, so customs-bundled services are excluded.
+ */
+export function filterBookableServices(
+  services: BookableService[] | undefined,
+  operationType: OperationType | undefined,
+): BookableService[] {
+  if (!services) return [];
+  return services.filter((s) => {
+    if (!s.canBeBookedAlone) return false;
+    if (operationType === "intercity" && s.includesCustoms) return false;
+    return true;
+  });
+}
+
 export function calcWagons(containers: ContainerConfig[]) {
   const Ft20Wagons = containers
     .filter((c) => c.type === "20ft")
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/shared.tsx b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/shared.tsx
index 8c461997f..2de959e5f 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/shared.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/shared.tsx
@@ -7,6 +7,7 @@ import {
   InputBase,
   Paper,
   Select,
+  Switch,
   Text,
   Title,
   useCombobox,
@@ -358,6 +359,81 @@ export function SelectField({
   );
 }
 
+/**
+ * Icon + title + description row with a trailing Switch, in a card that tints
+ * green when on. Used for the cargo-handling toggles (hazardous / reefer) on the
+ * Route step and per container on the Cargo step. `children` renders below the
+ * row when the switch is on (e.g. a bounded quantity input).
+ */
+export function ToggleRow({
+  icon,
+  iconBg,
+  iconColor,
+  title,
+  description,
+  checked,
+  onChange,
+  children,
+}: {
+  icon: ReactNode;
+  iconBg: string;
+  iconColor: string;
+  title: string;
+  description: string;
+  checked: boolean;
+  onChange: (v: boolean) => void;
+  children?: ReactNode;
+}) {
+  return (
+    <Box
+      px={16}
+      py={13}
+      style={{
+        borderRadius: 14,
+        border: `1.5px solid ${checked ? "#CDEBDD" : BORDER}`,
+        background: checked ? "#F6FBF8" : "#fff",
+        transition: "all 150ms ease",
+      }}
+    >
+      <Group justify="space-between" align="center" wrap="nowrap">
+        <Group gap={13} align="center" wrap="nowrap">
+          <Box
+            style={{
+              width: 38,
+              height: 38,
+              borderRadius: 11,
+              flexShrink: 0,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              background: iconBg,
+              color: iconColor,
+            }}
+          >
+            {icon}
+          </Box>
+          <Box>
+            <Text fz={14} fw={700} c={INK}>
+              {title}
+            </Text>
+            <Text fz={12} c={MUTED} style={{ lineHeight: 1.4 }}>
+              {description}
+            </Text>
+          </Box>
+        </Group>
+        <Switch
+          checked={checked}
+          onChange={(e) => onChange(e.currentTarget.checked)}
+          color="edr-green"
+          size="md"
+          style={{ flexShrink: 0 }}
+        />
+      </Group>
+      {checked && children ? <Box mt={12}>{children}</Box> : null}
+    </Box>
+  );
+}
+
 interface AsyncComboboxOption {
   value: string;
   label: string;
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step2-service-type.tsx b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step2-service-type.tsx
index 2b72393f6..b77f9d36b 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step2-service-type.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step2-service-type.tsx
@@ -3,7 +3,7 @@ import type { ReactNode } from "react";
 import { Check, FileText, Info, Layers, Train, Truck } from "lucide-react";
 import { useEffect, useRef } from "react";
 import { Controller, type UseFormReturn } from "react-hook-form";
-import { BookingFormInputValues, type BookingFormValues } from "./schema";
+import { BookingFormInputValues, type BookingFormValues, filterBookableServices } from "./schema";
 import {
   fieldStyles,
   OptionFieldError,
@@ -31,6 +31,7 @@ export function Step2ServiceType({
   referenceData?: Freight.BookingReferenceData;
 }) {
   const serviceTypeId = form.watch("serviceTypeId");
+  const operationType = form.watch("operationType");
   const serviceType = referenceData?.service.find(
     (s) => s.id === serviceTypeId,
   );
@@ -74,6 +75,20 @@ export function Step2ServiceType({
 
   const showServiceSections =
     serviceType != null || includesFirstMile || includesLastMile;
+
+  const bookableServices = filterBookableServices(
+    referenceData?.service,
+    operationType,
+  );
+
+  useEffect(() => {
+    const currentId = form.getValues("serviceTypeId");
+    if (!currentId) return;
+    if (!bookableServices.some((s) => s.id === currentId)) {
+      form.setValue("serviceTypeId", "", { shouldValidate: true });
+    }
+  }, [operationType, bookableServices, form]);
+
   return (
     <StepCard>
       <StepHeader
@@ -88,9 +103,7 @@ export function Step2ServiceType({
         render={({ field, fieldState }) => (
           <div>
             <div className="grid gap-3 sm:grid-cols-2">
-              {referenceData?.service
-                .filter((s) => s.canBeBookedAlone)
-                .map((s) => (
+              {bookableServices.map((s) => (
                   <ServiceTypeCard
                     key={s.id}
                     selected={field.value === s.id}
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step4-route.tsx b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step4-route.tsx
index 85453ccb5..783162a35 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step4-route.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step4-route.tsx
@@ -2,21 +2,17 @@ import type { Freight } from "@edr/types";
 import {
   Box,
   Button,
-  Divider,
   Group,
   Skeleton,
   Stack,
-  Switch,
   Text,
-  TextInput,
 } from "@mantine/core";
+import { DatePickerInput } from "@mantine/dates";
 import {
   CalendarDays,
-  Flame,
   MapPin,
   Plus,
   Route as RouteIcon,
-  Snowflake,
   Trash2,
 } from "lucide-react";
 import { useCallback, useEffect, useMemo } from "react";
@@ -168,16 +164,8 @@ export function Step4Route({
   // A general contract can cover several routes, but each route is just an
   // (origin, destination) pair — the same shape as the one-time route. The
   // contracted quantity comes from the cargo step, so no per-route quantity or
-  // distance is collected here.
-  const cargoType = form.watch("cargoType");
-
-  // The reefer toggle only exists for bulk; if the customer switches to
-  // containers, drop any reefer flag they set so it can't ride along unseen.
-  useEffect(() => {
-    if (cargoType !== "bulk" && form.getValues("isRefrigerated")) {
-      form.setValue("isRefrigerated", false);
-    }
-  }, [cargoType, form]);
+  // distance is collected here. Cargo handling (hazardous / refrigerated) also
+  // lives in the Cargo step now, not here.
 
   // Earliest selectable shipment date (today, local) for the date input's `min`.
   const todayISODate = useMemo(() => {
@@ -240,21 +228,26 @@ export function Step4Route({
           {/* Estimated shipment date — one-time bookings only. General contracts
               pick the date per order drawn against the contract later. */}
           {!isGeneralContract && (
-            <Box style={{ maxWidth: 280 }}>
+            <Box w="100%">
               <Controller
                 name="scheduledDate"
                 control={form.control}
                 render={({ field, fieldState }) => (
-                  <TextInput
-                    type="date"
+                  <DatePickerInput
+                    w="100%"
                     label="Estimated shipment date *"
                     description="A planning estimate. You'll confirm the actual date when you request the operation."
-                    min={todayISODate}
+                    placeholder="Pick a date"
+                    minDate={todayISODate}
                     leftSection={<CalendarDays size={16} />}
                     error={fieldState.error?.message}
-                    value={field.value ?? ""}
-                    onChange={(e) => field.onChange(e.currentTarget.value)}
+                    // Mantine v9 DatePickerInput uses string (YYYY-MM-DD) values,
+                    // matching the form's `scheduledDate` string directly.
+                    value={field.value || null}
+                    onChange={(v) => field.onChange(v ?? "")}
+                    onBlur={field.onBlur}
                     radius="md"
+                    popoverProps={{ withinPortal: true }}
                   />
                 )}
               />
@@ -360,116 +353,10 @@ export function Step4Route({
         </Box>
       )}
 
-      <Divider my={22} color="#EEF2F6" />
-
-      <StepLabel>Cargo handling</StepLabel>
-      <Stack gap={12} mt={12}>
-        <Controller
-          name="isHazardous"
-          control={form.control}
-          render={({ field }) => (
-            <ToggleRow
-              icon={<Flame size={18} />}
-              iconBg="#FBEAE7"
-              iconColor="#C0392B"
-              title="Hazardous Material"
-              description="Applies a hazard surcharge to the final bill."
-              checked={field.value}
-              onChange={(v) => field.onChange(v)}
-            />
-          )}
-        />
-        {/* Reefer is a customer choice for bulk freight only. For containers the
-            reefer surcharge is driven by the container type, so the toggle is
-            hidden there to avoid a control that doesn't affect the price. */}
-        {cargoType === "bulk" && (
-          <Controller
-            name="isRefrigerated"
-            control={form.control}
-            render={({ field }) => (
-              <ToggleRow
-                icon={<Snowflake size={18} />}
-                iconBg="#E9F0F8"
-                iconColor="#2E5B96"
-                title="Refrigerated Cargo"
-                description="Temperature-controlled transport applies a refrigeration surcharge."
-                checked={field.value}
-                onChange={(v) => field.onChange(v)}
-              />
-            )}
-          />
-        )}
-      </Stack>
     </StepCard>
   );
 }
 
-function ToggleRow({
-  icon,
-  iconBg,
-  iconColor,
-  title,
-  description,
-  checked,
-  onChange,
-}: {
-  icon: React.ReactNode;
-  iconBg: string;
-  iconColor: string;
-  title: string;
-  description: string;
-  checked: boolean;
-  onChange: (v: boolean) => void;
-}) {
-  return (
-    <Group
-      justify="space-between"
-      align="center"
-      wrap="nowrap"
-      px={16}
-      py={13}
-      style={{
-        borderRadius: 14,
-        border: `1.5px solid ${checked ? "#CDEBDD" : "#E6ECF2"}`,
-        background: checked ? "#F6FBF8" : "#fff",
-        transition: "all 150ms ease",
-      }}
-    >
-      <Group gap={13} align="center" wrap="nowrap">
-        <Box
-          style={{
-            width: 38,
-            height: 38,
-            borderRadius: 11,
-            flexShrink: 0,
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            background: iconBg,
-            color: iconColor,
-          }}
-        >
-          {icon}
-        </Box>
-        <Box>
-          <Text fz={14} fw={700} c="#10202F">
-            {title}
-          </Text>
-          <Text fz={12} c="#6B7C8E" style={{ lineHeight: 1.4 }}>
-            {description}
-          </Text>
-        </Box>
-      </Group>
-      <Switch
-        checked={checked}
-        onChange={(e) => onChange(e.currentTarget.checked)}
-        color="edr-green"
-        size="md"
-      />
-    </Group>
-  );
-}
-
 function LoadingSkeleton() {
   return (
     <div className="space-y-4 rounded-xl border border-gray-200 p-4">
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step5-cargo-details.tsx b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step5-cargo-details.tsx
index f3af690a3..a02138373 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step5-cargo-details.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step5-cargo-details.tsx
@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useRef } from "react";
 import { Controller, useFieldArray, type UseFormReturn } from "react-hook-form";
-import { Package, Plus, Trash2, Weight } from "lucide-react";
+import { Flame, Package, Plus, Snowflake, Trash2, Weight } from "lucide-react";
 import { ActionIcon, Button, Skeleton, Text, TextInput } from "@mantine/core";
 import type { Freight } from "@edr/types";
 import {
@@ -17,6 +17,7 @@ import {
   StepCard,
   StepHeader,
   StepLabel,
+  ToggleRow,
 } from "./shared";
 
 type BookingForm = UseFormReturn<
@@ -114,6 +115,59 @@ export function Step5CargoDetails({
     );
   }, [referenceData, parentId]);
 
+  // ── Bulk hazmat/reefer (whole-cargo portion) helpers ──────────────────────
+  // The bulk amounts are in the commodity's own unit and bounded by cargoWeight.
+  const bulkUnitLabel = isPerItem ? "items" : "tons";
+  const bulkCargoQty = () =>
+    Math.max(0, Number(form.getValues("cargoWeight") ?? 0) || 0);
+  const bulkMax = () => bulkCargoQty() || undefined;
+  // Default a switched-on portion to the whole cargo amount.
+  const bulkDefaultQty = () => {
+    const q = bulkCargoQty();
+    return q > 0 ? String(q) : "1";
+  };
+  // Clamp a typed value into 0..cargoWeight (items round down). Empty stays empty
+  // so the field can be cleared; the schema then flags it as required.
+  const clampToBulk = (raw: string) => {
+    if (raw === "") return "";
+    const n = Number(raw);
+    if (Number.isNaN(n)) return raw;
+    const cap = bulkCargoQty();
+    const stepped = isPerItem ? Math.floor(n) : n;
+    const bounded = cap > 0 ? Math.min(cap, stepped) : stepped;
+    return Math.max(0, bounded).toString();
+  };
+
+  // ── Per-line hazmat/reefer quantity helpers ───────────────────────────────
+  // The line quantity (number of containers in this line) is the upper bound for
+  // both the hazardous and the refrigerated counts.
+  const lineQtyOf = (index: number) =>
+    Math.max(1, Number(form.getValues(`containers.${index}.qty`) ?? 1) || 1);
+  const lineMax = (index: number) => lineQtyOf(index);
+  // When a flag is switched on, default its count to the whole line.
+  const defaultLineQty = (index: number) => lineQtyOf(index).toString();
+  // Clamp a typed value into 1..lineQty (empty stays empty so the field can be
+  // cleared; the schema flags an empty value as required while the switch is on).
+  const clampToLine = (raw: string, index: number) => {
+    if (raw === "") return "";
+    const n = Number(raw);
+    if (Number.isNaN(n)) return raw;
+    return Math.min(lineQtyOf(index), Math.max(1, Math.floor(n))).toString();
+  };
+  // After the line quantity changes, pull any active count back within bounds.
+  const clampDependentQty = (index: number, newLineQty: number) => {
+    const max = Math.max(1, newLineQty);
+    (["hazardousQty", "reeferQty"] as const).forEach((key) => {
+      const cur = Number(form.getValues(`containers.${index}.${key}`) ?? 0);
+      if (cur > max) {
+        form.setValue(`containers.${index}.${key}`, max.toString(), {
+          shouldDirty: true,
+          shouldValidate: true,
+        });
+      }
+    });
+  };
+
   if (isLoading) {
     return (
       <StepCard>
@@ -223,7 +277,7 @@ export function Step5CargoDetails({
             />
           )}
 
-          {selectedCommodity?.show_free_text_box && (
+          {selectedCommodity && (
             <Controller
               name="cargoFreeText"
               control={form.control}
@@ -250,6 +304,25 @@ export function Step5CargoDetails({
               render={({ field, fieldState }) => (
                 <TextInput
                   {...field}
+                  onChange={(e) => {
+                    field.onChange(e);
+                    // Pull any active bulk hazmat/reefer portion back within the
+                    // new cargo amount so it can't outlive a shrink.
+                    const cap = Number(e.currentTarget.value);
+                    if (!Number.isNaN(cap)) {
+                      (["bulkHazardousQty", "bulkReeferQty"] as const).forEach(
+                        (key) => {
+                          const cur = Number(form.getValues(key) ?? 0);
+                          if (cap > 0 && cur > cap) {
+                            form.setValue(key, String(cap), {
+                              shouldDirty: true,
+                              shouldValidate: true,
+                            });
+                          }
+                        },
+                      );
+                    }
+                  }}
                   id="cargoWeight"
                   type="number"
                   label={isPerItem ? "Quantity (Items) *" : "Quantity (Tons) *"}
@@ -275,6 +348,111 @@ export function Step5CargoDetails({
               )}
             />
           )}
+
+          {/* Cargo handling — how much of the cargo is hazardous / refrigerated,
+              in the SAME unit as the quantity above (tons or items). Shown once a
+              commodity is chosen so the unit is known; general contracts handle
+              handling per order. */}
+          {selectedCommodity && !isGeneralContract && (
+            <div className="grid gap-3 sm:grid-cols-2">
+              <Controller
+                name="isHazardous"
+                control={form.control}
+                render={({ field: hazField }) => (
+                  <ToggleRow
+                    icon={<Flame size={18} />}
+                    iconBg="#FBEAE7"
+                    iconColor="#C0392B"
+                    title="Hazardous"
+                    description={`Part of this cargo is hazardous (in ${bulkUnitLabel}).`}
+                    checked={!!hazField.value}
+                    onChange={(v) => {
+                      hazField.onChange(v);
+                      form.setValue(
+                        "bulkHazardousQty",
+                        v ? bulkDefaultQty() : "0",
+                        { shouldDirty: true, shouldValidate: true },
+                      );
+                    }}
+                  >
+                    <Controller
+                      name="bulkHazardousQty"
+                      control={form.control}
+                      render={({ field: hq, fieldState }) => (
+                        <TextInput
+                          type="number"
+                          size="sm"
+                          label={
+                            isPerItem
+                              ? "How many items are hazardous?"
+                              : "How many tons are hazardous?"
+                          }
+                          min={isPerItem ? 1 : 0}
+                          max={bulkMax()}
+                          step={isPerItem ? 1 : 0.01}
+                          value={hq.value ?? ""}
+                          onChange={(e) =>
+                            hq.onChange(clampToBulk(e.currentTarget.value))
+                          }
+                          onBlur={hq.onBlur}
+                          error={fieldState.error?.message}
+                          radius="md"
+                        />
+                      )}
+                    />
+                  </ToggleRow>
+                )}
+              />
+              <Controller
+                name="isRefrigerated"
+                control={form.control}
+                render={({ field: reeField }) => (
+                  <ToggleRow
+                    icon={<Snowflake size={18} />}
+                    iconBg="#E9F0F8"
+                    iconColor="#2E5B96"
+                    title="Refrigerated"
+                    description={`Part of this cargo needs reefer transport (in ${bulkUnitLabel}).`}
+                    checked={!!reeField.value}
+                    onChange={(v) => {
+                      reeField.onChange(v);
+                      form.setValue(
+                        "bulkReeferQty",
+                        v ? bulkDefaultQty() : "0",
+                        { shouldDirty: true, shouldValidate: true },
+                      );
+                    }}
+                  >
+                    <Controller
+                      name="bulkReeferQty"
+                      control={form.control}
+                      render={({ field: rq, fieldState }) => (
+                        <TextInput
+                          type="number"
+                          size="sm"
+                          label={
+                            isPerItem
+                              ? "How many items are refrigerated?"
+                              : "How many tons are refrigerated?"
+                          }
+                          min={isPerItem ? 1 : 0}
+                          max={bulkMax()}
+                          step={isPerItem ? 1 : 0.01}
+                          value={rq.value ?? ""}
+                          onChange={(e) =>
+                            rq.onChange(clampToBulk(e.currentTarget.value))
+                          }
+                          onBlur={rq.onBlur}
+                          error={fieldState.error?.message}
+                          radius="md"
+                        />
+                      )}
+                    />
+                  </ToggleRow>
+                )}
+              />
+            </div>
+          )}
         </div>
       )}
 
@@ -364,53 +542,61 @@ export function Step5CargoDetails({
                   <Controller
                     name={`containers.${index}.qty`}
                     control={form.control}
-                    render={({ field: qtyField, fieldState }) => (
-                      <div>
-                        <Text size="sm" fw={500} mb={4}>
-                          Quantity *
-                        </Text>
-                        <div className="flex items-center gap-2">
-                          <button
-                            type="button"
-                            onClick={() =>
-                              qtyField.onChange(
-                                Math.max(
-                                  1,
-                                  Number(qtyField.value ?? 1) - 1,
-                                ).toString(),
-                              )
-                            }
-                            className="flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border border-gray-200 bg-white text-sm font-medium transition hover:bg-gray-50"
-                          >
-                            −
-                          </button>
-                          <input
-                            value={qtyField.value ?? 1}
-                            onChange={(e) => qtyField.onChange(e.target.value)}
-                            onBlur={qtyField.onBlur}
-                            type="number"
-                            min={1}
-                            className="h-9 w-full rounded-lg border border-gray-200 bg-white px-3 text-center text-sm outline-none focus:border-emerald-500 focus:ring-1 focus:ring-emerald-500"
-                          />
-                          <button
-                            type="button"
-                            onClick={() =>
-                              qtyField.onChange(
-                                (Number(qtyField.value ?? 1) + 1).toString(),
-                              )
-                            }
-                            className="flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border border-gray-200 bg-white text-sm font-medium transition hover:bg-gray-50"
-                          >
-                            +
-                          </button>
-                        </div>
-                        {fieldState.error?.message && (
-                          <Text size="xs" c="red" mt={4}>
-                            {fieldState.error.message}
+                    render={({ field: qtyField, fieldState }) => {
+                      // Keep the per-line hazmat/reefer quantities within the new
+                      // line quantity whenever it drops, so an old larger value
+                      // can't outlive a shrink.
+                      const setQty = (next: number) => {
+                        const n = Math.max(1, next);
+                        qtyField.onChange(n.toString());
+                        clampDependentQty(index, n);
+                      };
+                      return (
+                        <div>
+                          <Text size="sm" fw={500} mb={4}>
+                            Quantity *
                           </Text>
-                        )}
-                      </div>
-                    )}
+                          <div className="flex items-center gap-2">
+                            <button
+                              type="button"
+                              onClick={() =>
+                                setQty(Number(qtyField.value ?? 1) - 1)
+                              }
+                              className="flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border border-gray-200 bg-white text-sm font-medium transition hover:bg-gray-50"
+                            >
+                              −
+                            </button>
+                            <input
+                              value={qtyField.value ?? 1}
+                              onChange={(e) => {
+                                qtyField.onChange(e.target.value);
+                                const n = Number(e.target.value);
+                                if (!Number.isNaN(n) && n >= 1)
+                                  clampDependentQty(index, n);
+                              }}
+                              onBlur={qtyField.onBlur}
+                              type="number"
+                              min={1}
+                              className="h-9 w-full rounded-lg border border-gray-200 bg-white px-3 text-center text-sm outline-none focus:border-emerald-500 focus:ring-1 focus:ring-emerald-500"
+                            />
+                            <button
+                              type="button"
+                              onClick={() =>
+                                setQty(Number(qtyField.value ?? 1) + 1)
+                              }
+                              className="flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border border-gray-200 bg-white text-sm font-medium transition hover:bg-gray-50"
+                            >
+                              +
+                            </button>
+                          </div>
+                          {fieldState.error?.message && (
+                            <Text size="xs" c="red" mt={4}>
+                              {fieldState.error.message}
+                            </Text>
+                          )}
+                        </div>
+                      );
+                    }}
                   />
 
                   <Controller
@@ -431,6 +617,101 @@ export function Step5CargoDetails({
                     )}
                   />
                 </div>
+
+                {/* Per-container hazmat / reefer. Each switch reveals a bounded
+                    "how many of this line" input (1..line quantity). */}
+                <div className="grid gap-3 sm:grid-cols-2">
+                  <Controller
+                    name={`containers.${index}.isHazardous`}
+                    control={form.control}
+                    render={({ field: hazField }) => (
+                      <ToggleRow
+                        icon={<Flame size={18} />}
+                        iconBg="#FBEAE7"
+                        iconColor="#C0392B"
+                        title="Hazardous"
+                        description="Some of these containers carry hazardous cargo."
+                        checked={!!hazField.value}
+                        onChange={(v) => {
+                          hazField.onChange(v);
+                          form.setValue(
+                            `containers.${index}.hazardousQty`,
+                            v ? defaultLineQty(index) : "0",
+                            { shouldDirty: true, shouldValidate: true },
+                          );
+                        }}
+                      >
+                        <Controller
+                          name={`containers.${index}.hazardousQty`}
+                          control={form.control}
+                          render={({ field: hq, fieldState }) => (
+                            <TextInput
+                              type="number"
+                              size="sm"
+                              label="How many hazardous?"
+                              min={1}
+                              max={lineMax(index)}
+                              value={hq.value ?? ""}
+                              onChange={(e) =>
+                                hq.onChange(
+                                  clampToLine(e.currentTarget.value, index),
+                                )
+                              }
+                              onBlur={hq.onBlur}
+                              error={fieldState.error?.message}
+                              radius="md"
+                            />
+                          )}
+                        />
+                      </ToggleRow>
+                    )}
+                  />
+                  <Controller
+                    name={`containers.${index}.isReefer`}
+                    control={form.control}
+                    render={({ field: reeField }) => (
+                      <ToggleRow
+                        icon={<Snowflake size={18} />}
+                        iconBg="#E9F0F8"
+                        iconColor="#2E5B96"
+                        title="Refrigerated"
+                        description="Some of these containers need reefer transport."
+                        checked={!!reeField.value}
+                        onChange={(v) => {
+                          reeField.onChange(v);
+                          form.setValue(
+                            `containers.${index}.reeferQty`,
+                            v ? defaultLineQty(index) : "0",
+                            { shouldDirty: true, shouldValidate: true },
+                          );
+                        }}
+                      >
+                        <Controller
+                          name={`containers.${index}.reeferQty`}
+                          control={form.control}
+                          render={({ field: rq, fieldState }) => (
+                            <TextInput
+                              type="number"
+                              size="sm"
+                              label="How many refrigerated?"
+                              min={1}
+                              max={lineMax(index)}
+                              value={rq.value ?? ""}
+                              onChange={(e) =>
+                                rq.onChange(
+                                  clampToLine(e.currentTarget.value, index),
+                                )
+                              }
+                              onBlur={rq.onBlur}
+                              error={fieldState.error?.message}
+                              radius="md"
+                            />
+                          )}
+                        />
+                      </ToggleRow>
+                    )}
+                  />
+                </div>
               </div>
             ))}
           </div>
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step8-review.tsx b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step8-review.tsx
index f658b84cd..a789943c2 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step8-review.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/new-booking-form/step8-review.tsx
@@ -204,6 +204,12 @@ export function Step8Review({
 
   // Bulk PER_ITEM cargo is a whole item count, not tons — label it accordingly.
   const isPerItem = selectedCommodity?.unit_of_measure === "PER_ITEM";
+  const bulkUnit = isPerItem ? "items" : "tons";
+  const bulkUnitAmount = (raw?: string) => {
+    const n = Number(raw ?? 0);
+    if (Number.isNaN(n)) return "0";
+    return isPerItem ? String(Math.round(n)) : n.toFixed(1);
+  };
   const totalQuantityRow = isPerItem
     ? {
         label: "Total quantity",
@@ -306,7 +312,16 @@ export function Step8Review({
             <DetailRow
               label="Modifiers"
               value={
-                [values.isHazardous && "Hazardous", values.isRefrigerated && "Refrigerated"]
+                (values.cargoType === "container"
+                  ? [
+                      values.containers.some((c) => c.isHazardous) && "Hazardous",
+                      values.containers.some((c) => c.isReefer) && "Refrigerated",
+                    ]
+                  : [
+                      values.isHazardous && "Hazardous",
+                      values.isRefrigerated && "Refrigerated",
+                    ]
+                )
                   .filter(Boolean)
                   .join(", ") || "None"
               }
@@ -377,12 +392,26 @@ export function Step8Review({
                 value={totalQuantityRow.value}
               />
             )}
+            {values.cargoType === "bulk" && values.isHazardous && (
+              <DetailRow
+                label="Hazardous"
+                value={`${bulkUnitAmount(values.bulkHazardousQty)} ${bulkUnit}`}
+              />
+            )}
+            {values.cargoType === "bulk" && values.isRefrigerated && (
+              <DetailRow
+                label="Refrigerated"
+                value={`${bulkUnitAmount(values.bulkReeferQty)} ${bulkUnit}`}
+              />
+            )}
             {values.cargoType === "container" && values.containers.length > 0 && (
               <Table mt="sm" withTableBorder withColumnBorders fz="sm">
                 <Table.Thead>
                   <Table.Tr>
                     <Table.Th>Type</Table.Th>
                     <Table.Th>Qty</Table.Th>
+                    <Table.Th>Hazardous</Table.Th>
+                    <Table.Th>Refrigerated</Table.Th>
                   </Table.Tr>
                 </Table.Thead>
                 <Table.Tbody>
@@ -392,6 +421,12 @@ export function Step8Review({
                       <Table.Tr key={i}>
                         <Table.Td>{c.containerType || c.type}</Table.Td>
                         <Table.Td>{c.qty}</Table.Td>
+                        <Table.Td>
+                          {c.isHazardous ? `${c.hazardousQty} of ${c.qty}` : "—"}
+                        </Table.Td>
+                        <Table.Td>
+                          {c.isReefer ? `${c.reeferQty} of ${c.qty}` : "—"}
+                        </Table.Td>
                       </Table.Tr>
                     ))}
                 </Table.Tbody>
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/payments/PayNowButton.tsx b/apps/edr-freight-web/portal/src/pages/bookings/payments/PayNowButton.tsx
index ae1615b94..fca38aec7 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/payments/PayNowButton.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/payments/PayNowButton.tsx
@@ -3,6 +3,7 @@ import { CreditCard } from "lucide-react";
 
 import { Freight } from "@edr/types";
 
+import { ModalSafeWrapper } from "@/components/customer-actions/ModalSafeWrapper";
 import { PaymentMethodModal } from "../BookingDetailPage/components/PaymentMethodModal";
 import { priceTotal } from "../BookingDetailPage/utils";
 import { useBookingPayment } from "./useBookingPayment";
@@ -29,7 +30,7 @@ export function PayNowButton({
   const pricing = booking.pricingBreakdown;
 
   return (
-    <>
+    <ModalSafeWrapper>
       <Button
         size={size}
         radius="md"
@@ -56,6 +57,6 @@ export function PayNowButton({
         error={pay.error}
         onConfirm={pay.confirm}
       />
-    </>
+    </ModalSafeWrapper>
   );
 }
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/payments/useBookingPayment.ts b/apps/edr-freight-web/portal/src/pages/bookings/payments/useBookingPayment.ts
index ddaa05906..9725fea12 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/payments/useBookingPayment.ts
+++ b/apps/edr-freight-web/portal/src/pages/bookings/payments/useBookingPayment.ts
@@ -1,4 +1,4 @@
-import { useMutation } from "@tanstack/react-query";
+import { useMutation, useQuery } from "@tanstack/react-query";
 import { useState } from "react";
 
 import { api } from "@/services/api";
@@ -6,24 +6,45 @@ import {
   paymentsService,
   type PaymentMethod,
 } from "@/services/payments.service";
+import { invoicesService } from "@/services/invoices.service";
+import { isPayable } from "@/pages/billing/invoice-ui";
 
 /**
  * Shared payment flow for a single booking: opens the method modal, fires
- * POST /payments/initiate, and redirects the browser to the provider (or the
- * fallback checkout page). Reused by the booking detail page, the booking list,
- * and the home page so "Pay now" behaves identically everywhere.
+ * POST /billing/my-invoices/:id/pay for the booking's currently payable
+ * invoice, and redirects the browser to the provider (or the fallback
+ * checkout page). Reused by the booking detail page, the booking list, and
+ * the home page so "Pay now" behaves identically everywhere.
  */
 export function useBookingPayment(bookingId: string) {
   const [modalOpen, setModalOpen] = useState(false);
 
+  const { data: invoices = [] } = useQuery({
+    queryKey: ["booking-invoices", bookingId],
+    queryFn: () => invoicesService.listForSource("booking", bookingId),
+  });
+  const payableInvoiceId = invoices.find((inv) => isPayable(inv.status))?.id;
+
   const mutation = useMutation({
-    mutationFn: (method: PaymentMethod) =>
-      api.payments.initiate.call({ bookingId, method }),
+    mutationFn: (method: PaymentMethod) => {
+      if (!payableInvoiceId) {
+        throw new Error(
+          "No payable invoice found for this booking yet. Please refresh or contact support.",
+        );
+      }
+      return api.invoices.pay.call({
+        id: payableInvoiceId,
+        payload: { method, platform: "web" },
+      });
+    },
     onSuccess: (data, method) => {
       const redirectUrl =
         data?.clientAction?.type === "REDIRECT" && data.clientAction.url
           ? data.clientAction.url
-          : paymentsService.checkoutUrl({ bookingId, method });
+          : paymentsService.checkoutUrlForInvoice({
+              invoiceId: payableInvoiceId!,
+              method,
+            });
       window.location.href = redirectUrl;
     },
   });
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/ClearancePhaseStepper.tsx b/apps/edr-freight-web/portal/src/pages/contracts/ClearancePhaseStepper.tsx
new file mode 100644
index 000000000..f9429a3e6
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/pages/contracts/ClearancePhaseStepper.tsx
@@ -0,0 +1,112 @@
+import { Check } from "lucide-react";
+import { Box, Group, Stack, Text } from "@mantine/core";
+import type { Freight } from "@edr/types";
+
+const BRAND_GREEN = "var(--freight-brand, #0A6F4D)";
+
+const PHASE_LABELS: Record<string, string> = {
+  CUSTOMER_INTAKE: "Customer docs",
+  GL_ET_REVIEW: "GL ET review",
+  GL_DJ_COLLECTION: "GL Djibouti DO",
+  GL_ET_OUTPUT: "Declaration",
+  CUSTOMER_DUTY: "Duty / customer pays",
+  GL_ET_POST_CLEARANCE: "Transit & finalize",
+  GL_DJ_LOADING: "Loading",
+  POST_TRANSIT: "Transit",
+};
+
+const IMPORT_PHASES = [
+  "CUSTOMER_INTAKE",
+  "GL_ET_REVIEW",
+  "GL_ET_OUTPUT",
+  "CUSTOMER_DUTY",
+  "GL_ET_POST_CLEARANCE",
+  "GL_DJ_COLLECTION",
+] as const;
+
+const EXPORT_PHASES = [
+  "CUSTOMER_INTAKE",
+  "GL_ET_REVIEW",
+  "GL_DJ_COLLECTION",
+  "GL_ET_OUTPUT",
+  "GL_ET_POST_CLEARANCE",
+] as const;
+
+function phaseIndex(phases: readonly string[], current?: string | null): number {
+  if (!current) return 0;
+  const idx = phases.indexOf(current);
+  return idx >= 0 ? idx : 0;
+}
+
+export function ClearancePhaseStepper({
+  clearance,
+  tradeDirection,
+  compact = false,
+}: {
+  clearance?: Freight.ContractClearanceView | null;
+  tradeDirection?: string;
+  compact?: boolean;
+}) {
+  const phases = tradeDirection === "EXPORT" ? EXPORT_PHASES : IMPORT_PHASES;
+  const current = clearance?.phase ?? phases[0];
+  const activeIdx = phaseIndex(phases, current);
+
+  return (
+    <Group gap={0} wrap="nowrap" align="flex-start" style={{ overflowX: "auto" }}>
+      {phases.map((phase, index) => {
+        const isComplete = index < activeIdx;
+        const isActive = index === activeIdx;
+        const isLast = index === phases.length - 1;
+
+        return (
+          <Box key={phase} style={{ flex: isLast ? "0 0 auto" : 1, minWidth: compact ? 72 : 88 }}>
+            <Group gap={0} wrap="nowrap" align="center">
+              <Stack gap={4} align="center" style={{ flexShrink: 0 }}>
+                <Box
+                  style={{
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    width: compact ? 28 : 34,
+                    height: compact ? 28 : 34,
+                    borderRadius: "50%",
+                    background: isComplete ? BRAND_GREEN : isActive ? "white" : "var(--mantine-color-gray-1)",
+                    border: isActive
+                      ? `2px solid ${BRAND_GREEN}`
+                      : isComplete
+                        ? "2px solid transparent"
+                        : "2px solid var(--mantine-color-gray-3)",
+                    color: isComplete ? "white" : isActive ? BRAND_GREEN : "var(--mantine-color-gray-5)",
+                  }}
+                >
+                  {isComplete ? <Check size={compact ? 14 : 16} strokeWidth={3} /> : null}
+                </Box>
+                <Text
+                  size={compact ? "10px" : "xs"}
+                  fw={isActive ? 600 : 500}
+                  c={isActive ? "edr-green.7" : isComplete ? "dark" : "dimmed"}
+                  ta="center"
+                  style={{ whiteSpace: "nowrap" }}
+                >
+                  {PHASE_LABELS[phase] ?? phase}
+                </Text>
+              </Stack>
+              {!isLast && (
+                <Box
+                  style={{
+                    flex: 1,
+                    height: 2,
+                    marginInline: 6,
+                    marginBottom: compact ? 16 : 20,
+                    borderRadius: 2,
+                    background: isComplete ? BRAND_GREEN : "var(--mantine-color-gray-2)",
+                  }}
+                />
+              )}
+            </Group>
+          </Box>
+        );
+      })}
+    </Group>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/ContractClearanceFlow.tsx b/apps/edr-freight-web/portal/src/pages/contracts/ContractClearanceFlow.tsx
index 3c1abf133..b0bee36d2 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/ContractClearanceFlow.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/ContractClearanceFlow.tsx
@@ -69,7 +69,12 @@ export default function ContractClearanceFlow() {
           </Group>
         </Group>
 
-        {id && <ContractClearancePanel contractId={id} />}
+        {id && (
+          <ContractClearancePanel
+            contractId={id}
+            tradeDirection={contract?.tradeDirection ?? "IMPORT"}
+          />
+        )}
       </Stack>
     </Box>
   );
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/ContractClearancePanel.tsx b/apps/edr-freight-web/portal/src/pages/contracts/ContractClearancePanel.tsx
index 6aa01e2e0..6fc88c678 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/ContractClearancePanel.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/ContractClearancePanel.tsx
@@ -1,17 +1,15 @@
-import { useEffect, useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import {
   Alert,
   Box,
   Button,
   Center,
-  FileButton,
   Group,
   Loader,
   Paper,
   Stack,
   Text,
-  TextInput,
 } from "@mantine/core";
 import {
   AlertCircle,
@@ -19,56 +17,26 @@ import {
   Clock,
   Download,
   Eye,
-  FileText,
-  Plus,
   Upload,
 } from "lucide-react";
 
-import type { Freight } from "@edr/types";
 import { isViewable } from "@edr/ui-common";
 import { api } from "@/services/api";
 import { fileViewUrl } from "@/constants/apiConfig";
+import {
+  ClearanceAdHocUploadSection,
+  type AdHocDoc,
+} from "@/components/contracts/ClearanceAdHocUploadSection";
+import { ClearanceDocumentUploadCard } from "@/components/contracts/ClearanceDocumentUploadCard";
+import { ClearanceUploadedDocumentsPanel } from "@/components/contracts/ClearanceUploadedDocumentsPanel";
 import { useFileViewer } from "@/hooks/useFileViewer";
 import { IconSquare } from "@/pages/bookings/BookingDetailPage/components/Documents";
 
-const GREEN = "#0A6F4D";
 const BORDER = "#E6ECF2";
 
-type AdHocDoc = { name: string; file: File | null };
-
-function StatusPill({ doc }: { doc: Freight.ContractClearanceDocument }) {
-  if (doc.reviewStatus === "APPROVED") {
-    return (
-      <Group gap={6} c={GREEN}>
-        <CheckCircle2 size={15} />
-        <Text fz="12px" fw={600} c={GREEN}>
-          Approved
-        </Text>
-      </Group>
-    );
-  }
-  if (doc.reviewStatus === "QUERIED") {
-    return (
-      <Group gap={6} c="#C0392B">
-        <AlertCircle size={15} />
-        <Text fz="12px" fw={600} c="#C0392B">
-          Query
-        </Text>
-      </Group>
-    );
-  }
-  if (doc.file) {
-    return (
-      <Text fz="12px" fw={600} c="#6B7C8E">
-        Uploaded
-      </Text>
-    );
-  }
-  return null;
-}
-
 export interface ContractClearancePanelProps {
   contractId: string;
+  tradeDirection?: string;
   /** Show the loading state without the surrounding Paper (e.g. inside a modal). */
   bare?: boolean;
 }
@@ -82,6 +50,7 @@ export interface ContractClearancePanelProps {
  */
 export function ContractClearancePanel({
   contractId,
+  tradeDirection = "IMPORT",
   bare,
 }: ContractClearancePanelProps) {
   const queryClient = useQueryClient();
@@ -156,8 +125,13 @@ export function ContractClearancePanel({
     ? hasStagedFiles && missingRequired.length === 0
     : hasStagedFiles;
 
-  const stagePending = (fileKey: string, file: File) =>
-    setPending((p) => ({ ...p, [fileKey]: file }));
+  const stagePending = (fileKey: string, file: File | null) =>
+    setPending((p) => {
+      if (file) return { ...p, [fileKey]: file };
+      const next = { ...p };
+      delete next[fileKey];
+      return next;
+    });
 
   const submitDocuments = () => {
     const files: Record<string, File | null> = { ...pending };
@@ -219,89 +193,32 @@ export function ContractClearancePanel({
       )}
 
       {/* Required customer documents */}
-      <Stack gap={10}>
+      <Stack gap="md">
+        <Box>
+          <Text fz={13} fw={700} c="#10202F">
+            Your clearance documents
+          </Text>
+          <Text fz={12} c="dimmed" mt={4}>
+            Upload each required document below. Items marked * are mandatory.
+          </Text>
+        </Box>
         {customerDocs.map((doc) => (
-          <Box
+          <ClearanceDocumentUploadCard
             key={doc.fileKey}
-            className="rounded-xl"
-            style={{
-              border:
-                doc.reviewStatus === "QUERIED"
-                  ? "1px solid #F0B4B4"
-                  : `1px solid ${BORDER}`,
-              background: doc.reviewStatus === "QUERIED" ? "#FDF4F4" : "#fff",
-              padding: 12,
-            }}
-          >
-            <Group justify="space-between" align="center" wrap="nowrap">
-              <Group gap={10} wrap="nowrap" style={{ minWidth: 0 }}>
-                <Box c="#2E5B96">
-                  <FileText size={18} />
-                </Box>
-                <Box style={{ minWidth: 0 }}>
-                  <Text fz="13.5px" fw={600} c="#10202F" truncate>
-                    {doc.label}
-                    {doc.required ? " *" : ""}
-                  </Text>
-                  {doc.file && (
-                    <Text fz="12px" c="dimmed" truncate>
-                      {doc.file.name}
-                    </Text>
-                  )}
-                </Box>
-              </Group>
-              <Group gap={10} wrap="nowrap">
-                <StatusPill doc={doc} />
-                {doc.file &&
-                  isViewable({
-                    name: doc.file.name,
-                    url: fileViewUrl(doc.file.id),
-                  }) && (
-                    <IconSquare
-                      icon={<Eye size={15} />}
-                      onClick={() =>
-                        view({
-                          name: doc.file!.name,
-                          url: fileViewUrl(doc.file!.id),
-                        })
-                      }
-                    />
-                  )}
-                {doc.file && (
-                  <IconSquare
-                    href={fileViewUrl(doc.file.id, true)}
-                    icon={<Download size={15} />}
-                  />
-                )}
-                {canUpload && doc.reviewStatus !== "APPROVED" && (
-                  <FileButton
-                    onChange={(f) => f && stagePending(doc.fileKey, f)}
-                    accept="application/pdf,image/*"
-                  >
-                    {(props) => (
-                      <Button
-                        {...props}
-                        size="compact-xs"
-                        variant="light"
-                        color="edr-green"
-                        leftSection={<Upload size={13} />}
-                      >
-                        {pending[doc.fileKey] ? "Selected" : "Upload"}
-                      </Button>
-                    )}
-                  </FileButton>
-                )}
-              </Group>
-            </Group>
-            {doc.reviewStatus === "QUERIED" && doc.note && (
-              <Text fz="12px" c="#C0392B" mt={6}>
-                Query: {doc.note}
-              </Text>
-            )}
-            {pending[doc.fileKey] && (
-              <StagedFilePreview file={pending[doc.fileKey]} onPreview={view} />
-            )}
-          </Box>
+            label={doc.label}
+            required={doc.required}
+            reviewStatus={doc.reviewStatus}
+            note={doc.note}
+            uploadedFile={doc.file}
+            stagedFile={pending[doc.fileKey] ?? null}
+            canUpload={canUpload}
+            onStageFile={
+              canUpload && doc.reviewStatus !== "APPROVED"
+                ? (file) => stagePending(doc.fileKey, file)
+                : undefined
+            }
+            onPreview={view}
+          />
         ))}
         {customerDocs.length === 0 && (
           <Text fz="sm" c="dimmed">
@@ -360,63 +277,36 @@ export function ContractClearancePanel({
         </>
       )}
 
-      {/* Ad-hoc / additional documents. */}
-      {canUpload && (
-        <Box mt="lg">
-          <Group justify="space-between" align="center" mb={8}>
-            <Text fz="12.5px" fw={700} c="#10202F">
-              Additional documents
-            </Text>
-            <Button
-              size="compact-xs"
-              variant="light"
-              color="edr-green"
-              leftSection={<Plus size={13} />}
-              onClick={() => setAdHoc((r) => [...r, { name: "", file: null }])}
-            >
-              Add document
-            </Button>
-          </Group>
-          <Stack gap={8}>
-            {adHoc.map((row, i) => (
-              <Box key={i}>
-                <Group gap={8} wrap="nowrap">
-                  <TextInput
-                    placeholder="Document name"
-                    value={row.name}
-                    onChange={(e) =>
-                      setAdHoc((rows) =>
-                        rows.map((r, j) =>
-                          j === i ? { ...r, name: e.currentTarget.value } : r,
-                        ),
-                      )
-                    }
-                    style={{ flex: 1 }}
-                    radius="md"
-                  />
-                  <FileButton
-                    onChange={(f) =>
-                      setAdHoc((rows) =>
-                        rows.map((r, j) => (j === i ? { ...r, file: f } : r)),
-                      )
-                    }
-                    accept="application/pdf,image/*"
-                  >
-                    {(props) => (
-                      <Button {...props} variant="default" radius="md">
-                        {row.file ? row.file.name.slice(0, 14) : "Choose file"}
-                      </Button>
-                    )}
-                  </FileButton>
-                </Group>
-                {row.file && (
-                  <StagedFilePreview file={row.file} onPreview={view} />
-                )}
-              </Box>
-            ))}
-          </Stack>
-        </Box>
-      )}
+      <Box mt="lg">
+        <ClearanceUploadedDocumentsPanel
+          embedded
+          tradeDirection={tradeDirection}
+          files={clearance?.workflowFiles ?? []}
+          title="Customs workflow documents"
+          onView={(f) => view(f)}
+          onDownload={({ id, name }) => {
+            const a = document.createElement("a");
+            a.href = fileViewUrl(id, true);
+            a.download = name;
+            a.click();
+          }}
+        />
+      </Box>
+
+      {canUpload ? (
+        <ClearanceAdHocUploadSection
+          rows={adHoc}
+          onAdd={() => setAdHoc((r) => [...r, { name: "", file: null }])}
+          onRemove={(i) => setAdHoc((rows) => rows.filter((_, j) => j !== i))}
+          onNameChange={(i, name) =>
+            setAdHoc((rows) => rows.map((r, j) => (j === i ? { ...r, name } : r)))
+          }
+          onFileChange={(i, file) =>
+            setAdHoc((rows) => rows.map((r, j) => (j === i ? { ...r, file } : r)))
+          }
+          onPreview={view}
+        />
+      ) : null}
 
       {uploadMutation.isError && (
         <Alert color="red" radius="md" icon={<AlertCircle size={16} />} mt="md">
@@ -427,10 +317,11 @@ export function ContractClearancePanel({
       )}
 
       {canUpload && (
-        <Group justify="flex-end" mt="lg">
+        <Group justify="flex-end" mt="xl">
           <Button
             color="edr-green"
             radius="md"
+            size="md"
             leftSection={<Upload size={16} />}
             disabled={!canSubmit}
             loading={uploadMutation.isPending}
@@ -454,99 +345,4 @@ export function ContractClearancePanel({
   );
 }
 
-/**
- * A compact preview chip for a locally-staged (not-yet-uploaded) clearance file.
- * Shows an image thumbnail (or a file glyph) plus a Preview button that opens the
- * file in the shared viewer via a local object URL. The URL is minted once per
- * File and revoked on unmount.
- */
-function StagedFilePreview({
-  file,
-  onPreview,
-}: {
-  file: File;
-  onPreview: (f: { name: string; url: string; mimeType?: string | null }) => void;
-}) {
-  const url = useMemo(() => URL.createObjectURL(file), [file]);
-  useEffect(() => () => URL.revokeObjectURL(url), [url]);
-
-  const isImage =
-    file.type.startsWith("image/") ||
-    ["png", "jpg", "jpeg", "webp", "gif", "bmp", "svg"].includes(
-      file.name.split(".").pop()?.toLowerCase() ?? "",
-    );
-  const canPreview = isViewable({ name: file.name, url, mimeType: file.type });
-
-  return (
-    <Group
-      gap={10}
-      wrap="nowrap"
-      mt={8}
-      p={8}
-      style={{
-        borderRadius: 12,
-        border: `1px dashed ${GREEN}`,
-        background: "#F2FBF6",
-        minWidth: 0,
-      }}
-    >
-      {isImage ? (
-        <Box
-          onClick={() => onPreview({ name: file.name, url, mimeType: file.type })}
-          style={{
-            width: 40,
-            height: 40,
-            flexShrink: 0,
-            borderRadius: 8,
-            overflow: "hidden",
-            border: `1px solid ${BORDER}`,
-            cursor: "pointer",
-          }}
-        >
-          <img
-            src={url}
-            alt=""
-            style={{ width: "100%", height: "100%", objectFit: "cover" }}
-          />
-        </Box>
-      ) : (
-        <Box
-          style={{
-            width: 40,
-            height: 40,
-            flexShrink: 0,
-            borderRadius: 8,
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            background: "#E7F6EE",
-            color: GREEN,
-          }}
-        >
-          <FileText size={18} />
-        </Box>
-      )}
-      <Box style={{ minWidth: 0, flex: 1 }}>
-        <Text fz="12px" fw={700} c={GREEN}>
-          Ready to upload
-        </Text>
-        <Text fz="12px" c="#10202F" truncate>
-          {file.name}
-        </Text>
-      </Box>
-      {canPreview && (
-        <Button
-          size="compact-xs"
-          variant="subtle"
-          color="edr-green"
-          leftSection={<Eye size={13} />}
-          onClick={() => onPreview({ name: file.name, url, mimeType: file.type })}
-        >
-          Preview
-        </Button>
-      )}
-    </Group>
-  );
-}
-
 export default ContractClearancePanel;
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/ContractClearanceWorkflowBanner.tsx b/apps/edr-freight-web/portal/src/pages/contracts/ContractClearanceWorkflowBanner.tsx
new file mode 100644
index 000000000..736cc67e4
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/pages/contracts/ContractClearanceWorkflowBanner.tsx
@@ -0,0 +1,225 @@
+import { useState } from "react";
+import { Alert, Box, Button, Group, Paper, Stack, Text } from "@mantine/core";
+import { AlertTriangle, Download, Receipt, Upload } from "lucide-react";
+import { useQuery } from "@tanstack/react-query";
+import toast from "react-hot-toast";
+import type { Freight } from "@edr/types";
+
+import { ClearanceUploadedDocumentsPanel } from "@/components/contracts/ClearanceUploadedDocumentsPanel";
+import { PortalFileDropzone } from "@/components/contracts/PortalFileDropzone";
+import { contractsService } from "@/services/contracts.service";
+import { fileViewUrl } from "@/constants/apiConfig";
+import { useFileViewer } from "@/hooks/useFileViewer";
+import { BORDER, INK } from "./contract-ui";
+import { ClearancePhaseStepper } from "./ClearancePhaseStepper";
+
+function downloadWorkflowFile({ id, name }: { id: string; name: string }) {
+  const a = document.createElement("a");
+  a.href = fileViewUrl(id, true);
+  a.download = name;
+  a.click();
+}
+
+export function ContractClearanceWorkflowBanner({
+  contract,
+}: {
+  contract: Freight.IContract;
+}) {
+  const { view, viewer } = useFileViewer();
+  const isPhased =
+    contract.customsClearingEnabled && contract.contractKind === "ONE_TIME";
+
+  const { data: clearance, refetch } = useQuery({
+    queryKey: ["contract-clearance", contract.id],
+    queryFn: () => contractsService.getClearance(contract.id),
+    enabled: isPhased,
+  });
+
+  if (!isPhased || !clearance) return null;
+
+  const dutyPaid = clearance.milestones?.some(
+    (m) => m.milestoneCode === "DUTY_TAX_PAID" && m.status === "COMPLETED",
+  );
+  const dutyPending =
+    clearance.dutyRequired &&
+    clearance.dutyAdvice &&
+    !dutyPaid;
+
+  return (
+    <>
+      <Paper withBorder radius="lg" p="lg" style={{ borderColor: BORDER }}>
+        <Stack gap="md">
+          <Text fw={700} size="sm" style={{ color: INK }}>
+            Clearance progress
+          </Text>
+          <ClearancePhaseStepper
+            clearance={clearance}
+            tradeDirection={contract.tradeDirection}
+            compact
+          />
+
+          {clearance.roHold && clearance.roHoldReason ? (
+            <Alert color="orange" icon={<AlertTriangle size={16} />} title="Release Order on hold">
+              {clearance.roHoldReason}
+            </Alert>
+          ) : null}
+
+          {clearance.nextAction?.actor === "CUSTOMER" ? (
+            <Alert color="blue" variant="light">
+              {clearance.nextAction.action}
+            </Alert>
+          ) : null}
+
+          {dutyPending && clearance.dutyAdvice ? (
+            <DutyAdvicePanel
+              dutyAdvice={clearance.dutyAdvice}
+              contractId={contract.id}
+              onUploaded={() => void refetch()}
+              onPreview={view}
+            />
+          ) : null}
+
+          <ClearanceUploadedDocumentsPanel
+            embedded
+            tradeDirection={contract.tradeDirection ?? "IMPORT"}
+            files={clearance.workflowFiles ?? []}
+            onView={view}
+            onDownload={downloadWorkflowFile}
+          />
+
+          {clearance.bookingReady ? (
+            <Alert color="green" variant="light">
+              Clearance is complete. Global Logistics will create your shipment booking shortly.
+            </Alert>
+          ) : null}
+        </Stack>
+      </Paper>
+      {viewer}
+    </>
+  );
+}
+
+function DutyAdvicePanel({
+  dutyAdvice,
+  contractId,
+  onUploaded,
+  onPreview,
+}: {
+  dutyAdvice: NonNullable<Freight.ContractClearanceView["dutyAdvice"]>;
+  contractId: string;
+  onUploaded: () => void;
+  onPreview: (file: { name: string; url: string; mimeType?: string | null }) => void;
+}) {
+  const [file, setFile] = useState<File | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  return (
+    <Paper
+      withBorder
+      radius="lg"
+      p="md"
+      style={{
+        borderColor: "#F5D9A8",
+        background: "linear-gradient(160deg, #FFFBF0 0%, #FFFFFF 70%)",
+      }}
+    >
+      <Stack gap="md">
+        <Group gap={8} wrap="nowrap">
+          <Box
+            style={{
+              width: 32,
+              height: 32,
+              borderRadius: 8,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              background: "#FFF3D6",
+              color: "#C77F09",
+            }}
+          >
+            <Receipt size={16} />
+          </Box>
+          <Text fw={700} fz={14} style={{ color: INK }}>
+            Duty / tax payment
+          </Text>
+        </Group>
+
+        <Paper withBorder radius="md" p="sm" bg="#fff">
+          <Text fz={13} style={{ color: INK }}>
+            Amount due:{" "}
+            <strong>
+              {dutyAdvice.amount.toLocaleString()} {dutyAdvice.currency}
+            </strong>
+            {dutyAdvice.declarationSerial
+              ? ` · Payment code: ${dutyAdvice.declarationSerial}`
+              : null}
+          </Text>
+          {dutyAdvice.noticeFile ? (
+            <Group gap={8} mt={8}>
+              <Button
+                size="compact-xs"
+                variant="light"
+                color="orange"
+                leftSection={<Download size={14} />}
+                component="a"
+                href={fileViewUrl(dutyAdvice.noticeFile.id, true)}
+                download={dutyAdvice.noticeFile.name}
+              >
+                Download duty notice
+              </Button>
+              <Button
+                size="compact-xs"
+                variant="subtle"
+                color="gray"
+                onClick={() =>
+                  onPreview({
+                    name: dutyAdvice.noticeFile!.name,
+                    url: fileViewUrl(dutyAdvice.noticeFile!.id),
+                  })
+                }
+              >
+                Preview notice
+              </Button>
+            </Group>
+          ) : null}
+        </Paper>
+
+        <Text fz={13} c="dimmed">
+          Pay the amount above, then upload your payment slip so clearance can continue.
+        </Text>
+
+        <PortalFileDropzone
+          label="Payment slip"
+          description="Upload proof of duty/tax payment (PDF or image)."
+          value={file}
+          onChange={setFile}
+          onPreview={onPreview}
+        />
+
+        <Button
+          color="orange"
+          loading={loading}
+          disabled={!file}
+          leftSection={<Upload size={16} />}
+          fullWidth
+          onClick={async () => {
+            if (!file) return;
+            setLoading(true);
+            try {
+              await contractsService.uploadContractDutySlip(contractId, file);
+              toast.success("Payment slip uploaded");
+              setFile(null);
+              onUploaded();
+            } catch (e) {
+              toast.error(e instanceof Error ? e.message : "Upload failed");
+            } finally {
+              setLoading(false);
+            }
+          }}
+        >
+          Submit payment slip
+        </Button>
+      </Stack>
+    </Paper>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/ContractDetailPage.tsx b/apps/edr-freight-web/portal/src/pages/contracts/ContractDetailPage.tsx
index 4e40313c9..a64d67d74 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/ContractDetailPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/ContractDetailPage.tsx
@@ -1,5 +1,10 @@
 import { useEffect, useMemo, useState } from "react";
-import { useNavigate, useParams, useSearchParams } from "react-router-dom";
+import {
+  Navigate,
+  useNavigate,
+  useParams,
+  useSearchParams,
+} from "react-router-dom";
 import { useQuery } from "@tanstack/react-query";
 import {
   Badge,
@@ -21,8 +26,10 @@ import {
   ArrowLeft,
   CalendarClock,
   CheckCircle2,
+  ChevronRight,
   Download,
   Eye,
+  FileBadge,
   FileSignature,
   FileText,
   Flame,
@@ -41,12 +48,18 @@ import { Modal } from "@mantine/core";
 import { useDisclosure } from "@mantine/hooks";
 import { isViewable, type ViewableFile } from "@edr/ui-common";
 import type { Freight } from "@edr/types";
+import { clearanceWorkflowFileLabel } from "@edr/types";
 import { api } from "@/services/api";
+import { contractsService } from "@/services/contracts.service";
 import { fileViewUrl } from "@/constants/apiConfig";
 import { useFileViewer } from "@/hooks/useFileViewer";
+import toast from "react-hot-toast";
 import { labelForDocCode } from "@/pages/bookings/resubmit";
 import { ContractClearancePanel } from "./ContractClearancePanel";
+import { ContractClearanceWorkflowBanner } from "./ContractClearanceWorkflowBanner";
+import { ClearanceUploadedDocumentsPanel } from "@/components/contracts/ClearanceUploadedDocumentsPanel";
 import { formatRateUnit } from "./new-contract-form/unit-rates";
+import { getContractBookingAction } from "./contract-booking-action";
 import {
   BORDER,
   ContractStatusBadge,
@@ -71,14 +84,19 @@ const CLEARANCE_UPLOAD_STATUSES = [
 
 type ContractFile = NonNullable<Freight.IContract["files"]>[number];
 
+// Business-license document codes — surfaced as their own section so they stand
+// out from the rest of the onboarding/profile set.
+const BUSINESS_LICENSE_DOC_CODES = new Set([
+  "business_license",
+  "commercial_license",
+  "investment_license",
+]);
+
 // Onboarding / company-profile document codes seeded in file-upload-settings.
 // These get attached to the contract at creation and belong under "Profile
 // documents" rather than the clearance set.
 const PROFILE_DOC_CODES = new Set([
   "tin_certificate",
-  "commercial_license",
-  "business_license",
-  "investment_license",
   "national_id",
   "national_id_passport",
   "passport",
@@ -97,18 +115,21 @@ interface DocGroup {
  * groups are dropped so the tab only renders sections that have files.
  */
 function groupContractDocuments(files: ContractFile[]): DocGroup[] {
+  const businessLicense: ContractFile[] = [];
   const profile: ContractFile[] = [];
   const clearance: ContractFile[] = [];
   for (const f of files) {
     // The generated contract PDF lives in the contract list / home rows, not
     // here. Signature images are baked into that PDF — skip both.
     if (f.code === "contract" || f.code.startsWith("signature_")) continue;
+    else if (BUSINESS_LICENSE_DOC_CODES.has(f.code)) businessLicense.push(f);
     else if (PROFILE_DOC_CODES.has(f.code)) profile.push(f);
     else clearance.push(f);
   }
   return [
-    { key: "profile", title: "Profile documents", files: profile },
     { key: "clearance", title: "Clearance documents", files: clearance },
+    { key: "businessLicense", title: "Business license", files: businessLicense },
+    { key: "profile", title: "Profile documents", files: profile },
   ].filter((g) => g.files.length > 0);
 }
 
@@ -146,17 +167,36 @@ export default function ContractDetailPage() {
     enabled: !!id,
   });
 
-  // Clearance view — drives the "documents need correction" alert / query count.
+  // Clearance view — drives queries alert, workflow documents, and duty panels.
   const inClearance =
     !!contract && CLEARANCE_UPLOAD_STATUSES.includes(contract.status);
+  const isPhasedCustomsClearance =
+    !!contract &&
+    contract.customsClearingEnabled &&
+    contract.contractKind === "ONE_TIME";
   const { data: clearanceView } = useQuery({
     ...api.contracts.getClearance.queryOptions({ input: { id: id! } }),
-    enabled: !!id && inClearance,
+    enabled: !!id && (inClearance || isPhasedCustomsClearance),
   });
+  const workflowFiles = clearanceView?.workflowFiles ?? [];
+  const workflowFileCount = workflowFiles.filter((f) => f.file).length;
   const queriedCount = (clearanceView?.documents ?? []).filter(
     (d) => d.uploadedBy === "customer" && d.reviewStatus === "QUERIED",
   ).length;
 
+  const showShipmentRequests =
+    !!contract &&
+    contract.contractKind === "GENERAL" &&
+    contract.customsClearingEnabled;
+  const { data: shipmentRequests = [] } = useQuery({
+    queryKey: ["contract-booking-requests", id],
+    queryFn: () => contractsService.listBookingRequests(id!),
+    enabled: !!id && showShipmentRequests,
+  });
+  const activeShipmentRequests = shipmentRequests.filter(
+    (r) => r.status === "PENDING" || r.status === "ACCEPTED",
+  );
+
   const contractBookings = useMemo(
     () =>
       (bookingsPage?.items ?? []).filter(
@@ -193,6 +233,13 @@ export default function ContractDetailPage() {
     );
   }
 
+  // Staff returned the contract for changes — send the customer to the full edit
+  // wizard (edit any term + replace documents → resubmit) rather than the
+  // read-only detail.
+  if (contract.status === "CHANGES_REQUESTED") {
+    return <Navigate to={`/contracts/${contract.id}/edit`} replace />;
+  }
+
   const isContainer = contract.freightType === "CONTAINER";
   const isGeneral = contract.contractKind === "GENERAL";
   const routes = contract.routes ?? [];
@@ -202,6 +249,22 @@ export default function ContractDetailPage() {
   // The generated contract PDF — surfaced via a dedicated "View contract" button
   // in the header (it's excluded from the Documents tab groups).
   const contractPdf = files.find((f) => f.code === "contract");
+  const hasContractDocument = Boolean(contractPdf || contract.contractGeneratedAt);
+
+  const downloadContractPdf = async () => {
+    if (!contract?.id) return;
+    try {
+      const blob = await contractsService.downloadContractDocument(contract.id);
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = contractPdf?.name ?? `contract-${contract.reference}.pdf`;
+      a.click();
+      URL.revokeObjectURL(url);
+    } catch {
+      toast.error("Could not download contract PDF.");
+    }
+  };
 
   const canSign = contract.status === "CONTRACT_READY";
   const customsPath = contract.customsClearingEnabled;
@@ -214,6 +277,8 @@ export default function ContractDetailPage() {
     contract.status === "CLEARANCE_READY_FOR_BOOKING";
   const canBookShipment =
     !customsPath && PATH_A_BOOKABLE.includes(contract.status);
+  const bookingAction = getContractBookingAction(contract, contractBookings);
+  const canRequestShipment = bookingAction.kind === "request";
   // Customs + clearance finalized: GL is preparing the booking — surface a
   // status notice instead of any action.
   const glPreparingBooking = customsPath && clearanceFinalized;
@@ -282,6 +347,28 @@ export default function ContractDetailPage() {
                 </Button>
               )
             )}
+            {hasContractDocument && (
+              <Button
+                variant="default"
+                radius="md"
+                size="md"
+                leftSection={<Download size={16} />}
+                onClick={() => void downloadContractPdf()}
+              >
+                Download PDF
+              </Button>
+            )}
+            {canRequestShipment && (
+              <Button
+                color="edr-green"
+                radius="md"
+                size="md"
+                leftSection={<PackagePlus size={16} />}
+                onClick={() => navigate(bookingAction.to)}
+              >
+                Request shipment
+              </Button>
+            )}
             {canBookShipment && (
               <Button
                 color="edr-green"
@@ -404,7 +491,7 @@ export default function ContractDetailPage() {
               active={tab === "documents"}
               icon={<Download size={16} />}
               label="Documents"
-              count={files.length}
+              count={files.length + (isPhasedCustomsClearance ? workflowFileCount : 0)}
             />
             <DetailTab
               value="bookings"
@@ -428,17 +515,6 @@ export default function ContractDetailPage() {
                 routes[0]?.destinationYard?.label ?? "—"
               }`}
             />
-            <MetaItem
-              label="Estimated shipment"
-              icon={<CalendarClock size={15} color={MUTED} />}
-              value={
-                contract.estimatedShipmentDate
-                  ? new Date(
-                      contract.estimatedShipmentDate,
-                    ).toLocaleDateString()
-                  : "—"
-              }
-            />
             <MetaItem
               label="Customs clearance"
               icon={<FileText size={15} color={MUTED} />}
@@ -503,6 +579,10 @@ export default function ContractDetailPage() {
           </Paper>
         )}
 
+        {customsPath && contract.contractKind === "ONE_TIME" ? (
+          <ContractClearanceWorkflowBanner contract={contract} />
+        ) : null}
+
         {canUploadClearance && (
           <Paper
             withBorder
@@ -766,6 +846,25 @@ export default function ContractDetailPage() {
 
           {/* ── Documents tab ─────────────────────────────────────────── */}
           <Tabs.Panel value="documents">
+            <Stack gap="lg">
+              {isPhasedCustomsClearance ? (
+                <ClearanceUploadedDocumentsPanel
+                  files={workflowFiles}
+                  tradeDirection={contract.tradeDirection ?? "IMPORT"}
+                  onView={view}
+                  onDownload={async (f) => {
+                    try {
+                      const a = document.createElement("a");
+                      a.href = fileViewUrl(f.id, true);
+                      a.download = f.name;
+                      a.click();
+                    } catch {
+                      toast.error("Could not download file.");
+                    }
+                  }}
+                />
+              ) : null}
+
             <Card
               withBorder
               radius="lg"
@@ -852,10 +951,103 @@ export default function ContractDetailPage() {
                 </Stack>
               )}
             </Card>
+            </Stack>
           </Tabs.Panel>
 
           {/* ── Bookings tab ──────────────────────────────────────────── */}
           <Tabs.Panel value="bookings">
+            {showShipmentRequests && (
+              <Card
+                withBorder
+                radius="lg"
+                p="lg"
+                mb="md"
+                style={{ borderColor: BORDER, boxShadow: CARD_SHADOW }}
+              >
+                <Group justify="space-between" align="center" mb="md">
+                  <SectionLabel>Shipment requests</SectionLabel>
+                  {canRequestShipment && (
+                    <Button
+                      color="edr-green"
+                      radius="md"
+                      size="xs"
+                      leftSection={<PackagePlus size={14} />}
+                      onClick={() => navigate(bookingAction.to)}
+                    >
+                      New request
+                    </Button>
+                  )}
+                </Group>
+                {activeShipmentRequests.length === 0 ? (
+                  <Text fz={13} c="dimmed">
+                    {canRequestShipment
+                      ? "No pending shipment requests. Submit a request when you are ready to ship."
+                      : "Shipment requests appear here once the contract is active."}
+                  </Text>
+                ) : (
+                  <Stack gap={10}>
+                    {activeShipmentRequests.map((req) => (
+                      <Group
+                        key={req.id}
+                        justify="space-between"
+                        wrap="nowrap"
+                        p="sm"
+                        style={{
+                          borderRadius: 12,
+                          border: `1px solid ${BORDER}`,
+                          cursor: req.createdBookingId ? "pointer" : "default",
+                        }}
+                        onClick={() => {
+                          if (req.createdBookingId) {
+                            navigate(`/bookings/${req.createdBookingId}`);
+                          }
+                        }}
+                      >
+                        <Group gap={12} wrap="nowrap" style={{ minWidth: 0 }}>
+                          <CalendarClock
+                            size={16}
+                            color={MUTED}
+                            style={{ flexShrink: 0 }}
+                          />
+                          <Box style={{ minWidth: 0 }}>
+                            <Text fz={14} fw={700} style={{ color: INK }} truncate>
+                              {req.reference}
+                            </Text>
+                            <Text fz={12} c="dimmed">
+                              {req.scheduledDate
+                                ? `Preferred date: ${req.scheduledDate}`
+                                : "No preferred date"}
+                              {req.notes ? ` · ${req.notes}` : ""}
+                            </Text>
+                          </Box>
+                        </Group>
+                        <Group gap="xs" wrap="nowrap">
+                          <Badge
+                            size="sm"
+                            radius="md"
+                            variant="light"
+                            color={
+                              req.status === "ACCEPTED"
+                                ? "teal"
+                                : req.status === "REJECTED"
+                                  ? "red"
+                                  : "yellow"
+                            }
+                          >
+                            {req.status === "ACCEPTED" && req.createdBookingId
+                              ? "Booking created"
+                              : req.status}
+                          </Badge>
+                          {req.createdBookingId ? (
+                            <ChevronRight size={16} color={MUTED} />
+                          ) : null}
+                        </Group>
+                      </Group>
+                    ))}
+                  </Stack>
+                )}
+              </Card>
+            )}
             <Card
               withBorder
               radius="lg"
@@ -955,7 +1147,11 @@ export default function ContractDetailPage() {
         centered
         overlayProps={{ blur: 2, backgroundOpacity: 0.55 }}
       >
-        <ContractClearancePanel contractId={contract.id} bare />
+        <ContractClearancePanel
+          contractId={contract.id}
+          tradeDirection={contract.tradeDirection ?? "IMPORT"}
+          bare
+        />
       </Modal>
     </Box>
   );
@@ -973,12 +1169,14 @@ const KEY_FACT_ACCENT: Record<string, string> = {
 
 // Per-section accent + icon for the Documents tab groups.
 const DOC_GROUP_ACCENT: Record<string, string> = {
-  profile: "#2B6CB0",
   clearance: "#C77F09",
+  businessLicense: "#0A6F4D",
+  profile: "#2B6CB0",
 };
 const DOC_GROUP_ICON: Record<string, LucideIcon> = {
-  profile: FileText,
   clearance: Upload,
+  businessLicense: FileBadge,
+  profile: FileText,
 };
 
 /**
@@ -1096,7 +1294,8 @@ function DocFileRow({
   file: ContractFile;
   onView: (f: ViewableFile) => void;
 }) {
-  const kind = labelForDocCode(file.code);
+  const kind =
+    clearanceWorkflowFileLabel(file.code) ?? labelForDocCode(file.code);
   const { ext, color } = fileTypeChip(file.name, file.mimeType);
   const viewable = isViewable({
     name: file.name,
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/ContractViewPage.tsx b/apps/edr-freight-web/portal/src/pages/contracts/ContractViewPage.tsx
index e04e5aa3c..29bdef371 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/ContractViewPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/ContractViewPage.tsx
@@ -1,9 +1,11 @@
-import { useRef, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import {
+  Alert,
   Box,
   Button,
+  Checkbox,
   Group,
   Image,
   Loader,
@@ -13,18 +15,20 @@ import {
   Text,
   TextInput,
 } from "@mantine/core";
-import { ArrowLeft, FileSignature, Printer } from "lucide-react";
+import { ArrowLeft, Download, FileSignature, Printer } from "lucide-react";
 import toast from "react-hot-toast";
 
+import { ContractSignSuccessModal } from "@/components/contracts/ContractSignSuccessModal";
 import { ContractSignaturePad } from "@/components/bookings/ContractSignaturePad";
 import { contractsService } from "@/services/contracts.service";
 import { api } from "@/services/api";
 
+const CONSENT_TEXT =
+  "I have read the entire contract and agree to its terms.";
+
 /**
- * Customer contract preview + sign. Customers must open and read the generated
- * contract here before signing — there is no sign action on the detail page or
- * the contract list. Signing is only possible once the contract is generated
- * and ready (CONTRACT_READY).
+ * Customer contract preview + sign. Customers must scroll through the full
+ * contract and accept the terms before signing.
  */
 export default function ContractViewPage() {
   const { id } = useParams<{ id: string }>();
@@ -33,11 +37,12 @@ export default function ContractViewPage() {
   const iframeRef = useRef<HTMLIFrameElement>(null);
 
   const [signOpen, setSignOpen] = useState(false);
+  const [successOpen, setSuccessOpen] = useState(false);
   const [signerName, setSignerName] = useState("");
   const [signatureData, setSignatureData] = useState<string | null>(null);
-  // Offer the saved signature for approval first; the customer can draw a fresh
-  // one instead.
   const [drawNew, setDrawNew] = useState(false);
+  const [hasScrolledToBottom, setHasScrolledToBottom] = useState(false);
+  const [agreedToTerms, setAgreedToTerms] = useState(false);
 
   const { data, isLoading, isError, refetch } = useQuery({
     queryKey: ["contract-view", id],
@@ -47,6 +52,48 @@ export default function ContractViewPage() {
 
   const savedSignatureImage = data?.savedSignature?.signatureImageUrl ?? null;
   const usingSaved = Boolean(savedSignatureImage) && !drawNew;
+  const canProceedToSign = hasScrolledToBottom && agreedToTerms;
+
+  const checkScrollBottom = useCallback(() => {
+    try {
+      const win = iframeRef.current?.contentWindow;
+      if (!win?.document?.documentElement) return;
+      const el = win.document.documentElement;
+      const threshold = 48;
+      if (el.scrollHeight <= el.clientHeight + threshold) {
+        setHasScrolledToBottom(true);
+        return;
+      }
+      if (el.scrollTop + el.clientHeight >= el.scrollHeight - threshold) {
+        setHasScrolledToBottom(true);
+      }
+    } catch {
+      /* srcDoc is same-origin; ignore edge cases */
+    }
+  }, []);
+
+  const handleIframeLoad = () => {
+    checkScrollBottom();
+    try {
+      const win = iframeRef.current?.contentWindow;
+      win?.addEventListener("scroll", checkScrollBottom);
+    } catch {
+      /* ignore */
+    }
+  };
+
+  useEffect(() => {
+    return () => {
+      try {
+        iframeRef.current?.contentWindow?.removeEventListener(
+          "scroll",
+          checkScrollBottom,
+        );
+      } catch {
+        /* ignore */
+      }
+    };
+  }, [checkScrollBottom]);
 
   const signMutation = useMutation({
     mutationFn: () =>
@@ -56,11 +103,11 @@ export default function ContractViewPage() {
           ? (savedSignatureImage as string)
           : (signatureData as string),
         signerDisplayName: signerName.trim(),
-        consentText: "I agree to the terms of this contract.",
+        consentText: CONSENT_TEXT,
       }),
     onSuccess: () => {
-      toast.success("Contract signed successfully");
       setSignOpen(false);
+      setSuccessOpen(true);
       void refetch();
       void qc.invalidateQueries({
         queryKey: api.contracts.get.queryKey({ id: id! }),
@@ -70,6 +117,7 @@ export default function ContractViewPage() {
   });
 
   const openSign = () => {
+    if (!canProceedToSign) return;
     setSignerName(data?.savedSignature?.signerDisplayName ?? "");
     setSignatureData(null);
     setDrawNew(false);
@@ -85,6 +133,21 @@ export default function ContractViewPage() {
 
   const handlePrint = () => iframeRef.current?.contentWindow?.print();
 
+  const downloadPdf = useCallback(async () => {
+    if (!id) return;
+    try {
+      const blob = await contractsService.downloadContractDocument(id);
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = `contract-${data?.reference ?? id}.pdf`;
+      a.click();
+      URL.revokeObjectURL(url);
+    } catch {
+      toast.error("Could not download contract PDF.");
+    }
+  }, [id, data?.reference]);
+
   if (isLoading) {
     return (
       <Group justify="center" mih="40vh" align="center">
@@ -105,7 +168,7 @@ export default function ContractViewPage() {
   }
 
   return (
-    <Box p={{ base: "md", md: "xl" }}>
+    <Box p={{ base: "md", md: "xl" }} pb={data.canSignCustomer ? 120 : undefined}>
       <Box maw={920} mx="auto">
         <Group justify="space-between" wrap="wrap" gap="sm" mb="md">
           <Button
@@ -124,23 +187,28 @@ export default function ContractViewPage() {
             >
               Print
             </Button>
-            {data.canSignCustomer && (
-              <Button
-                color="edr-green"
-                leftSection={<FileSignature size={16} />}
-                onClick={openSign}
-              >
-                {usingSaved ? "Approve & sign" : "Sign contract"}
-              </Button>
-            )}
+            <Button
+              variant="default"
+              leftSection={<Download size={16} />}
+              onClick={() => void downloadPdf()}
+            >
+              Download PDF
+            </Button>
           </Group>
         </Group>
 
+        {data.canSignCustomer && !hasScrolledToBottom && (
+          <Alert color="blue" variant="light" radius="md" mb="md">
+            Please scroll through the entire contract before signing.
+          </Alert>
+        )}
+
         <Paper withBorder radius="lg" p={0} style={{ overflow: "hidden" }}>
           <iframe
             ref={iframeRef}
             srcDoc={data.html}
             title="Contract document"
+            onLoad={handleIframeLoad}
             style={{
               width: "100%",
               minHeight: "80vh",
@@ -151,6 +219,49 @@ export default function ContractViewPage() {
         </Paper>
       </Box>
 
+      {data.canSignCustomer && hasScrolledToBottom && (
+        <Paper
+          withBorder
+          radius="lg"
+          p="md"
+          style={{
+            position: "fixed",
+            bottom: 0,
+            left: 0,
+            right: 0,
+            zIndex: 100,
+            borderTop: "1px solid var(--mantine-color-gray-3)",
+            background: "var(--mantine-color-body)",
+          }}
+        >
+          <Box maw={920} mx="auto">
+            <Stack gap="sm">
+              <Checkbox
+                checked={agreedToTerms}
+                onChange={(e) => setAgreedToTerms(e.currentTarget.checked)}
+                disabled={!hasScrolledToBottom}
+                label={CONSENT_TEXT}
+                description={
+                  hasScrolledToBottom
+                    ? "You may now sign the contract."
+                    : "Read the full contract above before you can agree and sign."
+                }
+              />
+              <Group justify="flex-end">
+                <Button
+                  color="edr-green"
+                  leftSection={<FileSignature size={16} />}
+                  disabled={!canProceedToSign}
+                  onClick={openSign}
+                >
+                  {usingSaved ? "Approve & sign" : "Sign contract"}
+                </Button>
+              </Group>
+            </Stack>
+          </Box>
+        </Paper>
+      )}
+
       <Modal
         opened={signOpen}
         onClose={() => setSignOpen(false)}
@@ -217,6 +328,16 @@ export default function ContractViewPage() {
           </Group>
         </Stack>
       </Modal>
+
+      <ContractSignSuccessModal
+        opened={successOpen}
+        reference={data.reference}
+        message="Your signature has been recorded. EDR staff will counter-sign to complete the contract."
+        onClose={() => {
+          setSuccessOpen(false);
+          navigate(`/contracts/${id}`);
+        }}
+      />
     </Box>
   );
 }
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/ContractsList.tsx b/apps/edr-freight-web/portal/src/pages/contracts/ContractsList.tsx
index 653eeca78..fbb8ac0ce 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/ContractsList.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/ContractsList.tsx
@@ -19,27 +19,20 @@ import {
   CheckCircle2,
   ChevronLeft,
   ChevronRight,
-  Eye,
-  FileSignature,
   FileStack,
   Inbox,
   Package,
-  PackagePlus,
-  PencilLine,
   Plus,
-  RotateCcw,
   Search,
   Timer,
-  Upload,
   Weight,
   X,
-  type LucideIcon,
 } from "lucide-react";
 
 import { api } from "@/services/api";
+import { ContractCustomerAction } from "@/components/customer-actions/ContractCustomerAction";
 import type { ContractListFilter } from "@/services/contracts.service";
 import type { Freight } from "@edr/types";
-import { getContractBookingAction } from "./contract-booking-action";
 import { usePagination } from "@edr/ui-common";
 import {
   BORDER,
@@ -60,89 +53,6 @@ function primaryRoute(contract: Freight.IContract) {
   };
 }
 
-// Customs (Path B) statuses where the customer still needs to upload / manage
-// clearance docs. Once finalized (CLEARANCE_READY_FOR_BOOKING) the row falls
-// through to the Book action instead.
-const PATH_B_CLEARANCE_STATUSES = [
-  "AWAITING_CLEARANCE_DOCUMENTS",
-  "CLEARANCE_UNDER_REVIEW",
-];
-
-interface RowAction {
-  label: string;
-  to: string;
-  primary: boolean;
-  icon: LucideIcon;
-}
-
-/** The single most relevant next action for a customer's contract row. */
-function getCustomerRowAction(
-  contract: Freight.IContract,
-  bookings: Freight.IBooking[],
-): RowAction {
-  const id = contract.id;
-  if (contract.status === "CONTRACT_READY") {
-    return {
-      label: "View & sign",
-      to: `/contracts/${id}/view`,
-      primary: true,
-      icon: FileSignature,
-    };
-  }
-  if (contract.status === "CHANGES_REQUESTED") {
-    return {
-      label: "Edit & resubmit",
-      to: `/contracts/${id}`,
-      primary: true,
-      icon: PencilLine,
-    };
-  }
-  if (
-    contract.customsClearingEnabled &&
-    PATH_B_CLEARANCE_STATUSES.includes(contract.status)
-  ) {
-    return {
-      label: "Upload clearance",
-      to: `/contracts/${id}/clearance`,
-      primary: true,
-      icon: Upload,
-    };
-  }
-  // Customs (Path B), clearance finalized: Global Logistics creates the booking
-  // on the customer's behalf — the customer only views the contract.
-  if (
-    contract.customsClearingEnabled &&
-    ["CLEARANCE_READY_FOR_BOOKING", "ACTIVE_SHIPMENT_IN_PROGRESS"].includes(
-      contract.status,
-    )
-  ) {
-    return {
-      label: "View",
-      to: `/contracts/${id}`,
-      primary: false,
-      icon: Eye,
-    };
-  }
-  const booking = getContractBookingAction(contract, bookings);
-  if (booking.kind === "book") {
-    return {
-      label: "Book shipment",
-      to: booking.to,
-      primary: true,
-      icon: PackagePlus,
-    };
-  }
-  if (booking.kind === "rebook") {
-    return {
-      label: "Re-book shipment",
-      to: booking.to,
-      primary: true,
-      icon: RotateCcw,
-    };
-  }
-  return { label: "View", to: `/contracts/${id}`, primary: false, icon: Eye };
-}
-
 export default function ContractsList() {
   const navigate = useNavigate();
   const { pagination, setPagination } = usePagination({ pageSize: 10 });
@@ -473,7 +383,6 @@ export default function ContractsList() {
                     const tradeLabel = dir
                       ? dir.charAt(0) + dir.slice(1).toLowerCase()
                       : "—";
-                    const action = getCustomerRowAction(c, bookings);
                     return (
                       <Table.Tr
                         key={c.id}
@@ -565,31 +474,12 @@ export default function ContractsList() {
                               contract={c}
                               onClick={(e) => e.stopPropagation()}
                             />
-                            <Button
+                            <ContractCustomerAction
+                              contract={c}
+                              bookings={bookings}
                               size="sm"
-                              radius="md"
-                              h={34}
-                              variant={action.primary ? "filled" : "light"}
-                              color="edr-green"
-                              leftSection={<action.icon size={15} />}
-                              onClick={(e) => {
-                                e.stopPropagation();
-                                navigate(action.to);
-                              }}
-                              styles={{
-                                root: {
-                                  fontWeight: 600,
-                                  fontSize: 13,
-                                  paddingInline: 14,
-                                  whiteSpace: "nowrap",
-                                  boxShadow: action.primary
-                                    ? "0 1px 2px rgba(14,163,113,0.25)"
-                                    : "none",
-                                },
-                              }}
-                            >
-                              {action.label}
-                            </Button>
+                              listStyle
+                            />
                           </Group>
                         </Table.Td>
                       </Table.Tr>
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/NewContractPage.tsx b/apps/edr-freight-web/portal/src/pages/contracts/NewContractPage.tsx
index 5a623e296..7dde7666b 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/NewContractPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/NewContractPage.tsx
@@ -28,15 +28,22 @@ import {
   Upload,
   XCircle,
 } from "lucide-react";
-import { useMemo, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 import { useForm } from "react-hook-form";
-import { Navigate, useLocation, useNavigate } from "react-router-dom";
+import {
+  Navigate,
+  useLocation,
+  useNavigate,
+  useParams,
+} from "react-router-dom";
 import useAuth from "@/hooks/useAuth";
 import {
   CONTRACT_STEPS,
+  EDIT_CONTRACT_STEPS,
   ContractFormInputValues,
   contractFormSchema,
   contractStepFields,
+  editContractStepFields,
   initialContractFormValues,
   OPERATION_TYPES,
   type ContractFormValues,
@@ -47,6 +54,12 @@ import {
   operationToProfileType,
   operationToTradeDirection,
 } from "./new-contract-form/helpers";
+import { contractToFormValues } from "./new-contract-form/contractToForm";
+import {
+  ContractDocsEditor,
+  documentSettingCode,
+  missingRequiredDocKeys,
+} from "./new-contract-form/ContractDocsEditor";
 import { PROFILE_TYPE_LABELS } from "@/constants/profileMode";
 import type { ProfileTypeValue } from "@/services/companies.service";
 import { StepIndicator } from "./new-contract-form/StepIndicator";
@@ -55,7 +68,6 @@ import {
   useContractDraft,
 } from "./new-contract-form/useContractDraft";
 import {
-  Step0OperationType,
   Step1ContractType,
   Step2ServiceType,
   Step3CargoScope,
@@ -67,14 +79,42 @@ import { formatRateUnit } from "./new-contract-form/unit-rates";
 
 type PriceModalMode = "submit" | "draft";
 
-export default function NewContractPage() {
+/**
+ * The contract wizard, used both to create a new contract and — in `edit` mode —
+ * to edit & resubmit a contract staff returned with CHANGES_REQUESTED. Edit mode
+ * hydrates the form from the saved contract, lets the customer change any term
+ * and replace documents, then runs the same update → price → submit flow.
+ */
+export default function NewContractPage({
+  mode = "create",
+}: {
+  mode?: "create" | "edit";
+}) {
   const navigate = useNavigate();
   const queryClient = useQueryClient();
+  const { id: editId } = useParams<{ id: string }>();
+  const isEdit = mode === "edit" && Boolean(editId);
   const [step, setStep] = useState(0);
   const auth = useAuth();
   const { data: referenceData, isLoading: refDataLoading } = useQuery(
     api.bookings.referenceData.queryOptions(),
   );
+  const { data: editContract } = useQuery({
+    ...api.contracts.get.queryOptions({ input: { id: editId ?? "" } }),
+    enabled: isEdit,
+  });
+  // Onboarding document requirements — used in edit mode to block resubmit until
+  // every required document is on file (existing or freshly attached).
+  const editDocSettingQuery = useQuery({
+    ...api.fileUploadSettings.getByCode.queryOptions({
+      input: {
+        code: documentSettingCode(
+          auth.company?.company?.nationality as string | null | undefined,
+        ),
+      },
+    }),
+    enabled: isEdit,
+  });
 
   // Contract creation is gated on profile approval, same as bookings.
   if (!auth.isPending && auth.company && !auth.canBook) {
@@ -105,7 +145,17 @@ export default function NewContractPage() {
 
   const [pricingData, setPricingData] =
     useState<GenerateContractPriceResponse | null>(null);
-  const [priceContractId, setPriceContractId] = useState<string | null>(null);
+  // In edit mode the contract already exists, so seed its id — this makes
+  // persistAndPriceMutation take the UPDATE branch instead of creating anew.
+  const [priceContractId, setPriceContractId] = useState<string | null>(
+    isEdit ? (editId ?? null) : null,
+  );
+  // Documents freshly attached on the review step (edit mode only). Merged into
+  // the form's `documents` map before the contract is updated.
+  const [editDocuments, setEditDocuments] = useState<
+    Record<string, File | File[] | null>
+  >({});
+  const [showDocErrors, setShowDocErrors] = useState(false);
   const [priceModalMode, setPriceModalMode] = useState<PriceModalMode | null>(
     null,
   );
@@ -164,7 +214,7 @@ export default function NewContractPage() {
       clearContractDraft();
       setPriceModalMode(null);
       queryClient.invalidateQueries({ queryKey: api.contracts.list.queryKey() });
-      navigate(`/contracts/${priceContractId}`);
+      navigate("/contracts");
     },
   });
 
@@ -178,7 +228,7 @@ export default function NewContractPage() {
       setPriceChangeResult(null);
       setPriceModalMode(null);
       queryClient.invalidateQueries({ queryKey: api.contracts.list.queryKey() });
-      navigate(`/contracts/${priceContractId}`);
+      navigate("/contracts");
     },
   });
 
@@ -205,13 +255,39 @@ export default function NewContractPage() {
   const location = useLocation();
   const startFresh =
     (location.state as { fresh?: boolean } | null)?.fresh === true;
-  useContractDraft({ form, step, setStep, fresh: startFresh });
+  useContractDraft({
+    form,
+    step,
+    setStep,
+    fresh: startFresh,
+    enabled: !isEdit,
+  });
+
+  // Edit mode: hydrate the form from the saved contract once both the contract
+  // and the reference data (needed to rebuild the cargo-type path) have loaded.
+  const hydratedRef = useRef(false);
+  useEffect(() => {
+    if (!isEdit || hydratedRef.current) return;
+    if (!editContract || !referenceData) return;
+    hydratedRef.current = true;
+    const forwarderProfile =
+      (auth.company?.company?.companyProfiles ?? []).find(
+        (p) => p.id === editContract.companyProfileId,
+      )?.type === "freight_forwarder";
+    form.reset(
+      contractToFormValues(editContract, referenceData, forwarderProfile),
+    );
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isEdit, editContract, referenceData]);
 
   const originYard = form.watch("originYard");
   const destinationYard = form.watch("destinationYard");
   const operationType = form.watch("operationType");
 
-  const visibleSteps = useMemo(() => CONTRACT_STEPS, []);
+  const visibleSteps = useMemo(
+    () => (isEdit ? EDIT_CONTRACT_STEPS : CONTRACT_STEPS),
+    [isEdit],
+  );
   const visibleStepIds = useMemo<number[]>(
     () => visibleSteps.map((s) => s.id),
     [visibleSteps],
@@ -239,19 +315,43 @@ export default function NewContractPage() {
     );
   }, [originYard, destinationYard, operationType, referenceData]);
 
+  // type -> status ("active" = approved | "pending" = awaiting staff approval)
+  // for the company's operational profiles. Drives both the select-time gate and
+  // the per-option dropdown badges.
+  const profileStatusByType = useMemo(() => {
+    const m = new Map<string, string>();
+    for (const p of auth.company?.company?.companyProfiles ?? [])
+      m.set(p.type, p.status);
+    return m;
+  }, [auth.company]);
   const profileTypes = useMemo(
-    () => (auth.company?.company?.companyProfiles ?? []).map((p) => p.type),
-    [auth.company],
+    () => [...profileStatusByType.keys()],
+    [profileStatusByType],
   );
 
   // All operation types are always selectable. Picking one the company has no
   // profile for prompts a license upload that creates the profile on the fly
-  // (mirrors the header "Add service" flow).
+  // (mirrors the header "Add service" flow); picking one backed by a not-yet-
+  // approved profile is blocked with an "awaiting approval" notice.
   const allowedOperations = useMemo<OperationType[]>(
     () => [...OPERATION_TYPES],
     [],
   );
 
+  // Approval state of the profile each operation maps to — used for the dropdown
+  // badges. Intercity rides any customer profile, so always "approved".
+  const operationStatus = useMemo(
+    () =>
+      (op: OperationType): "approved" | "pending" | "missing" => {
+        if (op === "intercity") return "approved";
+        const target = operationToProfileType(op, profileTypes);
+        const status = profileStatusByType.get(target);
+        if (!status) return "missing";
+        return status === "active" ? "approved" : "pending";
+      },
+    [profileStatusByType, profileTypes],
+  );
+
   // Create-profile modal state (license upload → createProfileAndSwitch).
   const [createTarget, setCreateTarget] = useState<ProfileTypeValue | null>(
     null,
@@ -260,6 +360,13 @@ export default function NewContractPage() {
     useState<OperationType | null>(null);
   const [licenseFiles, setLicenseFiles] = useState<File[]>([]);
   const [createError, setCreateError] = useState<string | null>(null);
+  // After a license is uploaded the new profile comes back "pending", so the
+  // create-profile modal switches to an "awaiting approval" success state.
+  const [licenseSubmitted, setLicenseSubmitted] = useState(false);
+  // Set when the user picks an operation whose profile exists but isn't approved
+  // yet — drives the "awaiting approval" block modal.
+  const [pendingApprovalProfile, setPendingApprovalProfile] =
+    useState<ProfileTypeValue | null>(null);
 
   const createProfileMutation = useMutation({
     mutationFn: async ({
@@ -275,11 +382,13 @@ export default function NewContractPage() {
       }
     },
     onSuccess: () => {
-      // The operation was already set on the form when the modal opened.
-      setCreateTarget(null);
-      setPendingOperation(null);
+      // The new profile comes back "pending", so the user can't proceed under
+      // this operation yet: revert the select and switch the modal to its
+      // "awaiting approval" success state (kept open until the user dismisses).
+      form.setValue("operationType", undefined as never, { shouldDirty: true });
       setLicenseFiles([]);
       setCreateError(null);
+      setLicenseSubmitted(true);
     },
     onError: (err) => {
       setCreateError(
@@ -292,15 +401,25 @@ export default function NewContractPage() {
     // Intercity (domestic) runs on any existing customer profile — no switch.
     if (op === "intercity") return;
     const target = operationToProfileType(op, profileTypes) as ProfileTypeValue;
-    const hasProfile = profileTypes.includes(target);
-    if (!hasProfile) {
-      // No matching profile — collect a license and create one.
+    const status = profileStatusByType.get(target);
+
+    if (!status) {
+      // Case 3 — no matching profile: collect a license and create one.
       setPendingOperation(op);
       setCreateTarget(target);
       setLicenseFiles([]);
       setCreateError(null);
+      setLicenseSubmitted(false);
       return;
     }
+    if (status !== "active") {
+      // Case 2 — profile exists but isn't approved yet: block + revert the
+      // select so an unusable operation is never left chosen.
+      setPendingApprovalProfile(target);
+      form.setValue("operationType", undefined as never, { shouldDirty: true });
+      return;
+    }
+    // Case 1 — approved: proceed, switching the active profile if needed.
     if (auth.activeProfileType !== target) {
       void auth.switchMode(target as never);
     }
@@ -324,6 +443,17 @@ export default function NewContractPage() {
     setPendingOperation(null);
     setLicenseFiles([]);
     setCreateError(null);
+    setLicenseSubmitted(false);
+  };
+
+  // Dismiss the post-submit "awaiting approval" success state. The select was
+  // already reverted on success — just close and reset the modal.
+  const handleCreateProfileDone = () => {
+    setCreateTarget(null);
+    setPendingOperation(null);
+    setLicenseFiles([]);
+    setCreateError(null);
+    setLicenseSubmitted(false);
   };
 
   const createTargetLabel = createTarget
@@ -338,10 +468,24 @@ export default function NewContractPage() {
   }, [auth.company, auth.activeCompanyProfileId]);
 
   async function handleContinue() {
-    const valid = await form.trigger(contractStepFields[step], {
-      shouldFocus: true,
-    });
-    if (!valid) return;
+    const stepFields = isEdit ? editContractStepFields : contractStepFields;
+    const fields = stepFields[step];
+    if (fields.length > 0) {
+      const valid = await form.trigger(fields, { shouldFocus: true });
+      if (!valid) return;
+    }
+    if (isEdit && step === 2 && editContract) {
+      const missing = missingRequiredDocKeys(
+        editDocSettingQuery.data,
+        editContract,
+        editDocuments,
+      );
+      if (missing.length > 0) {
+        setShowDocErrors(true);
+        return;
+      }
+      setShowDocErrors(false);
+    }
     goToStep(1);
   }
 
@@ -416,13 +560,6 @@ export default function NewContractPage() {
       isHazardous: data.isHazardous,
       // Reefer is a contract-level flag for both container and bulk.
       isReefer: data.isRefrigerated,
-      ...(data.estimatedShipmentDate
-        ? {
-            estimatedShipmentDate: new Date(
-              data.estimatedShipmentDate,
-            ).toISOString(),
-          }
-        : {}),
       ...(data.previousContractRef
         ? { renewalOfId: data.previousContractRef }
         : {}),
@@ -466,6 +603,25 @@ export default function NewContractPage() {
 
   const handleSubmitContract = form.handleSubmit((data) => {
     try {
+      // Edit mode: all required documents must be on file (already uploaded or
+      // freshly attached) before resubmitting, and freshly attached files are
+      // merged into the form's documents map so the update sends them.
+      if (isEdit && editContract) {
+        const missing = missingRequiredDocKeys(
+          editDocSettingQuery.data,
+          editContract,
+          editDocuments,
+        );
+        if (missing.length > 0) {
+          setShowDocErrors(true);
+          return;
+        }
+        setShowDocErrors(false);
+        form.setValue("documents", {
+          ...(form.getValues("documents") ?? {}),
+          ...editDocuments,
+        });
+      }
       const apiPayload = buildApiPayload(data);
       persistAndPriceMutation.mutate({
         payload: apiPayload,
@@ -511,20 +667,23 @@ export default function NewContractPage() {
       >
         <Box>
           <Title order={1} fw={800} fz={26} style={{ letterSpacing: "-0.01em" }}>
-            New Contract
+            {isEdit ? "Edit Contract" : "New Contract"}
           </Title>
           <Text size="sm" c="edr-muted" mt={4}>
-            Define your freight contract — scope, routes, and unit rates. Book
-            shipments against it after signing.
+            {isEdit
+              ? "Update your contract details and documents, then resubmit it for EDR staff review."
+              : "Define your freight contract — scope, routes, and unit rates. Book shipments against it after signing."}
           </Text>
         </Box>
         <Button
           variant="default"
           radius="md"
           leftSection={<ChevronLeft size={16} />}
-          onClick={() => navigate("/contracts")}
+          onClick={() =>
+            navigate(isEdit && editId ? `/contracts/${editId}` : "/contracts")
+          }
         >
-          Back to Contracts
+          {isEdit ? "Back to Contract" : "Back to Contracts"}
         </Button>
       </Group>
 
@@ -535,6 +694,20 @@ export default function NewContractPage() {
         onSubmit={(e) => e.preventDefault()}
       >
         <Box flex={1} p="24px">
+          {isEdit && (
+            <Alert
+              color="orange"
+              radius="lg"
+              variant="light"
+              icon={<AlertCircle size={18} />}
+              title="A reviewer asked for changes"
+              mb="lg"
+            >
+              Update any contract detail or document that needs to change, then
+              resubmit the contract for review.
+            </Alert>
+          )}
+
           <Box mb="lg">
             <StepIndicator step={step} steps={visibleSteps} />
           </Box>
@@ -565,12 +738,13 @@ export default function NewContractPage() {
                 description="Define the operation, contract kind, and the service this contract is for."
               />
               <Stack gap={24}>
-                <Step0OperationType
+                <Step1ContractType
                   form={form}
+                  referenceData={referenceData}
                   allowedOperations={allowedOperations}
-                  onSelect={handleOperationSelect}
+                  onOperationSelect={handleOperationSelect}
+                  operationStatus={operationStatus}
                 />
-                <Step1ContractType form={form} referenceData={referenceData} />
                 <Step2ServiceType referenceData={referenceData} form={form} />
               </Stack>
             </StepCard>
@@ -598,9 +772,34 @@ export default function NewContractPage() {
             </StepCard>
           )}
 
-          {/* Step 2 — Documents. */}
-          {/* Step 2 — Review & Submit. */}
-          {step === 2 && (
+          {/* Step 2 (edit) — Documents. */}
+          {step === 2 && isEdit && editContract && (
+            <StepCard>
+              <StepHeader
+                title="Contract Documents"
+                description="Upload or replace the documents required for this contract before resubmitting."
+              />
+              <ContractDocsEditor
+                contract={editContract}
+                value={editDocuments}
+                onChange={setEditDocuments}
+                errors={
+                  showDocErrors
+                    ? Object.fromEntries(
+                        missingRequiredDocKeys(
+                          editDocSettingQuery.data,
+                          editContract,
+                          editDocuments,
+                        ).map((k) => [k, "Required"]),
+                      )
+                    : {}
+                }
+              />
+            </StepCard>
+          )}
+
+          {/* Step 2 (create) / Step 3 (edit) — Review & Submit. */}
+          {((step === 2 && !isEdit) || (step === 3 && isEdit)) && (
             <Step8Review
               form={form}
               setStep={setStep}
@@ -625,6 +824,7 @@ export default function NewContractPage() {
                 persistAndPriceMutation.isPending &&
                 persistAndPriceMutation.variables?.mode === "submit"
               }
+              isEdit={isEdit}
             />
           )}
         </Box>
@@ -891,47 +1091,116 @@ export default function NewContractPage() {
 
       {/* Create-profile modal — opens when the chosen operation type has no
           matching company profile yet. Collects a license, creates the profile,
-          and switches to it (mirrors the header "Add service" flow). */}
+          then shows an "awaiting approval" state (the new profile is pending). */}
       <Modal
         opened={createTarget !== null}
         onClose={() => {
-          if (!createProfileMutation.isPending) handleCreateProfileCancel();
+          if (createProfileMutation.isPending) return;
+          if (licenseSubmitted) handleCreateProfileDone();
+          else handleCreateProfileCancel();
         }}
-        title={`Set up your ${createTargetLabel} profile`}
+        title={
+          licenseSubmitted
+            ? "Awaiting approval"
+            : `Set up your ${createTargetLabel} profile`
+        }
+        centered
+        radius="lg"
+      >
+        {licenseSubmitted ? (
+          <Stack gap="md">
+            <Group gap={10} align="flex-start" wrap="nowrap">
+              <Box
+                style={{
+                  width: 38,
+                  height: 38,
+                  flexShrink: 0,
+                  borderRadius: 11,
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  background: "#ECF6F1",
+                  color: "#0A6F4D",
+                }}
+              >
+                <Check size={18} />
+              </Box>
+              <Text size="sm" c="dimmed">
+                License submitted. Your {createTargetLabel.toLowerCase()} profile
+                is now awaiting staff approval. We'll notify you once it's
+                approved — then you can create this contract as{" "}
+                {createTargetLabel.toLowerCase()}.
+              </Text>
+            </Group>
+            <Group justify="flex-end" gap="sm">
+              <Button color="edr-green" onClick={handleCreateProfileDone}>
+                Got it
+              </Button>
+            </Group>
+          </Stack>
+        ) : (
+          <Stack gap="md">
+            <Text size="sm" c="dimmed">
+              You don't have a {createTargetLabel.toLowerCase()} profile yet. Add
+              your business license to create one. It goes to staff for approval
+              before you can use it.
+            </Text>
+            <FileInput
+              label="Business license"
+              multiple
+              clearable
+              accept="application/pdf,image/png,image/jpeg"
+              leftSection={<Upload size={16} />}
+              placeholder="Select license file(s)"
+              value={licenseFiles}
+              onChange={(files) => setLicenseFiles(files ?? [])}
+              error={createError ?? undefined}
+            />
+            <Group justify="flex-end" gap="sm">
+              <Button
+                variant="default"
+                onClick={handleCreateProfileCancel}
+                disabled={createProfileMutation.isPending}
+              >
+                Cancel
+              </Button>
+              <Button
+                color="edr-green"
+                onClick={handleCreateProfileConfirm}
+                loading={createProfileMutation.isPending}
+              >
+                Submit license
+              </Button>
+            </Group>
+          </Stack>
+        )}
+      </Modal>
+
+      {/* Awaiting-approval modal — the chosen operation maps to a profile that
+          exists but isn't approved yet. The select was already reverted. */}
+      <Modal
+        opened={pendingApprovalProfile !== null}
+        onClose={() => setPendingApprovalProfile(null)}
+        title="Awaiting approval"
         centered
         radius="lg"
       >
         <Stack gap="md">
           <Text size="sm" c="dimmed">
-            You don't have a {createTargetLabel.toLowerCase()} profile yet. Add
-            your business license to create one and continue this contract as{" "}
-            {createTargetLabel.toLowerCase()}.
+            Your{" "}
+            {pendingApprovalProfile
+              ? (PROFILE_TYPE_LABELS[pendingApprovalProfile] ??
+                pendingApprovalProfile)
+              : ""}{" "}
+            profile was submitted and is under staff review. You can start a
+            contract under it once it's approved.
           </Text>
-          <FileInput
-            label="Business license"
-            multiple
-            clearable
-            accept="application/pdf,image/png,image/jpeg"
-            leftSection={<Upload size={16} />}
-            placeholder="Select license file(s)"
-            value={licenseFiles}
-            onChange={(files) => setLicenseFiles(files ?? [])}
-            error={createError ?? undefined}
-          />
           <Group justify="flex-end" gap="sm">
-            <Button
-              variant="default"
-              onClick={handleCreateProfileCancel}
-              disabled={createProfileMutation.isPending}
-            >
-              Cancel
-            </Button>
             <Button
               color="edr-green"
-              onClick={handleCreateProfileConfirm}
-              loading={createProfileMutation.isPending}
+              onClick={() => setPendingApprovalProfile(null)}
             >
-              Create &amp; continue
+              OK
             </Button>
           </Group>
         </Stack>
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/NewShipmentPage.tsx b/apps/edr-freight-web/portal/src/pages/contracts/NewShipmentPage.tsx
index f179016cd..b72244368 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/NewShipmentPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/NewShipmentPage.tsx
@@ -45,8 +45,8 @@ import { formatRateUnit } from "./new-contract-form/unit-rates";
 import {
   ShipmentFormInputValues,
   ShipmentFormValues,
+  createShipmentFormSchema,
   initialShipmentFormValues,
-  shipmentFormSchema,
 } from "./new-shipment-form/schema";
 import { computeShipmentTotal } from "./new-shipment-form/total";
 import { ContractCapacityNotice } from "./new-shipment-form/ContractCapacityNotice";
@@ -58,37 +58,11 @@ type ShipmentForm = ReturnType<
 export default function NewShipmentPage() {
   const { id } = useParams<{ id: string }>();
   const navigate = useNavigate();
-  const queryClient = useQueryClient();
-
-  // Holds the validated values awaiting price confirmation. When set, the price
-  // modal is open. The customer confirms (books) or rejects (back to the form
-  // to edit and re-book).
-  const [pendingValues, setPendingValues] = useState<ShipmentFormValues | null>(
-    null,
-  );
 
   const { data: contract, isLoading } = useQuery(
     api.contracts.get.queryOptions({ input: { id: id! }, enabled: !!id }),
   );
 
-  const form = useForm<ShipmentFormInputValues, any, ShipmentFormValues>({
-    defaultValues: initialShipmentFormValues,
-    resolver: zodResolver(shipmentFormSchema),
-    mode: "onChange",
-  });
-
-  const submitMutation = useMutation({
-    mutationFn: (dto: Freight.CreateBookingUnderContractDto) =>
-      api.contracts.createBookingUnderContract.call({ id: id!, dto }),
-    onSuccess: (booking) => {
-      queryClient.invalidateQueries({ queryKey: api.bookings.list.queryKey() });
-      queryClient.invalidateQueries({
-        queryKey: api.contracts.get.queryKey({ id: id! }),
-      });
-      navigate(`/bookings/${booking.id}`);
-    },
-  });
-
   if (isLoading) {
     return (
       <Center mih={400} p="xl">
@@ -112,9 +86,6 @@ export default function NewShipmentPage() {
     );
   }
 
-  // Customs (Path B) contracts are booked by Global Logistics on behalf of the
-  // customer — the customer never books one himself. Block the form entirely and
-  // point back to the clearance workspace.
   if (contract.customsClearingEnabled) {
     return (
       <Box p="xl">
@@ -140,10 +111,60 @@ export default function NewShipmentPage() {
     );
   }
 
+  return <NewShipmentBookingForm contract={contract} contractId={id!} />;
+}
+
+function bulkUnitOfMeasure(
+  contract: Freight.IContract,
+): "PER_TON" | "PER_ITEM" {
+  const hasPerItem = contract.pricingBreakdown?.lineItems?.some(
+    (li) => li.unit === "per_item",
+  );
+  return hasPerItem ? "PER_ITEM" : "PER_TON";
+}
+
+function NewShipmentBookingForm({
+  contract,
+  contractId,
+}: {
+  contract: Freight.IContract;
+  contractId: string;
+}) {
+  const navigate = useNavigate();
+  const queryClient = useQueryClient();
+  const [pendingValues, setPendingValues] = useState<ShipmentFormValues | null>(
+    null,
+  );
+
+  const form = useForm<ShipmentFormInputValues, any, ShipmentFormValues>({
+    defaultValues: initialShipmentFormValues,
+    resolver: zodResolver(
+      createShipmentFormSchema({
+        isContainer: contract.freightType === "CONTAINER",
+        isHazardous: contract.isHazardous ?? false,
+        isReefer: contract.isReefer ?? false,
+        unitOfMeasure: bulkUnitOfMeasure(contract),
+      }),
+    ),
+    mode: "onChange",
+  });
+
+  const submitMutation = useMutation({
+    mutationFn: (dto: Freight.CreateBookingUnderContractDto) =>
+      api.contracts.createBookingUnderContract.call({ id: contractId, dto }),
+    onSuccess: (booking) => {
+      queryClient.invalidateQueries({ queryKey: api.bookings.list.queryKey() });
+      queryClient.invalidateQueries({
+        queryKey: api.contracts.get.queryKey({ id: contractId }),
+      });
+      navigate(`/bookings/${booking.id}`);
+    },
+  });
+
   function buildDto(
     values: ShipmentFormValues,
   ): Freight.CreateBookingUnderContractDto {
-    const isContainer = contract!.freightType === "CONTAINER";
+    const isContainer = contract.freightType === "CONTAINER";
     return {
       ...(values.contractRouteId
         ? { contractRouteId: values.contractRouteId }
@@ -168,7 +189,7 @@ export default function NewShipmentPage() {
         : {
             bulkLines: [
               {
-                cargoTypeId: contract!.cargoScope?.[0]?.cargoTypeId ?? null,
+                cargoTypeId: contract.cargoScope?.[0]?.cargoTypeId ?? null,
                 cargoWeightTons: values.cargoWeightTons
                   ? Number(values.cargoWeightTons)
                   : undefined,
@@ -177,6 +198,8 @@ export default function NewShipmentPage() {
                   : undefined,
                 hazardousQuantity:
                   Number(values.bulkHazardousQuantity || 0) || undefined,
+                reeferQuantity:
+                  Number(values.bulkReeferQuantity || 0) || undefined,
               },
             ],
           }),
@@ -568,8 +591,9 @@ function ScheduleStep({
           render={({ field, fieldState }) => (
             <Box>
               <StepLabel>Shipment day *</StepLabel>
-              <Box mt={10}>
+              <Box mt={10} w="100%">
                 <OperationDatePicker
+                  fullWidth
                   availableDays={availableDays ?? []}
                   isLoading={isLoading}
                   value={field.value ?? ""}
@@ -721,6 +745,24 @@ function CargoStep({
             )}
           />
         )}
+        {contract.isReefer && (
+          <Controller
+            name="bulkReeferQuantity"
+            control={form.control}
+            render={({ field, fieldState }) => (
+              <TextInput
+                {...field}
+                type="number"
+                label="Refrigerated quantity"
+                min={0}
+                step={1}
+                error={fieldState.error?.message}
+                radius={10}
+                styles={fieldStyles}
+              />
+            )}
+          />
+        )}
       </Stack>
     </StepCard>
   );
@@ -805,12 +847,13 @@ function ContainerLineEditor({
           <Controller
             name={`containers.${index}.hazardousQuantity`}
             control={form.control}
-            render={({ field }) => (
+            render={({ field, fieldState }) => (
               <TextInput
                 {...field}
                 type="number"
                 label="Hazardous qty"
                 min={0}
+                error={fieldState.error?.message}
                 radius={10}
                 styles={fieldStyles}
               />
@@ -821,12 +864,13 @@ function ContainerLineEditor({
           <Controller
             name={`containers.${index}.reeferQuantity`}
             control={form.control}
-            render={({ field }) => (
+            render={({ field, fieldState }) => (
               <TextInput
                 {...field}
                 type="number"
                 label="Reefer qty"
                 min={0}
+                error={fieldState.error?.message}
                 radius={10}
                 styles={fieldStyles}
               />
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/NewShipmentRequestPage.tsx b/apps/edr-freight-web/portal/src/pages/contracts/NewShipmentRequestPage.tsx
new file mode 100644
index 000000000..38924251e
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/pages/contracts/NewShipmentRequestPage.tsx
@@ -0,0 +1,151 @@
+import { useState } from "react";
+import { useNavigate, useParams } from "react-router-dom";
+import { useMutation, useQuery } from "@tanstack/react-query";
+import {
+  Box,
+  Button,
+  Group,
+  Loader,
+  NumberInput,
+  Paper,
+  Stack,
+  Text,
+  Textarea,
+  Title,
+} from "@mantine/core";
+import { ArrowLeft, CalendarDays, Send } from "lucide-react";
+import toast from "react-hot-toast";
+import type { Freight } from "@edr/types";
+import { DatePickerInput } from "@mantine/dates";
+
+import { contractsService } from "@/services/contracts.service";
+
+const BORDER = "#E6ECF2";
+
+export default function NewShipmentRequestPage() {
+  const { id } = useParams<{ id: string }>();
+  const navigate = useNavigate();
+  const [scheduledDate, setScheduledDate] = useState("");
+  const [quantity, setQuantity] = useState<number | string>(1);
+  const [notes, setNotes] = useState("");
+
+  const { data: contract, isLoading } = useQuery({
+    queryKey: ["contract", id],
+    queryFn: () => contractsService.get(id!),
+    enabled: Boolean(id),
+  });
+
+  const { data: capacity } = useQuery({
+    queryKey: ["contract-capacity", id],
+    queryFn: () => contractsService.getCapacity(id!),
+    enabled: Boolean(id) && contract?.contractKind === "GENERAL",
+  });
+
+  const submit = useMutation({
+    mutationFn: (dto: Freight.CreateBookingRequestDto) =>
+      contractsService.submitBookingRequest(id!, dto),
+    onSuccess: () => {
+      toast.success("Shipment request submitted");
+      navigate(`/contracts/${id}`);
+    },
+    onError: (e: Error) => toast.error(e.message || "Could not submit request"),
+  });
+
+  if (isLoading || !contract) {
+    return (
+      <Group justify="center" py={80}>
+        <Loader color="teal" />
+      </Group>
+    );
+  }
+
+  const isContainer = contract.freightType === "CONTAINER";
+  const route = contract.routes?.[0];
+
+  const handleSubmit = () => {
+    const dto: Freight.CreateBookingRequestDto = {
+      contractRouteId: route?.id,
+      scheduledDate: scheduledDate || undefined,
+      notes: notes.trim() || undefined,
+    };
+
+    if (isContainer) {
+      const size = contract.cargoScope?.[0]?.containerSize ?? "20FT";
+      dto.containers = [
+        {
+          containerSize: size,
+          quantity: Number(quantity) || 1,
+        },
+      ];
+    } else {
+      dto.bulk = {
+        cargoTypeId: contract.cargoScope?.[0]?.cargoTypeId ?? null,
+        cargoWeightTons: Number(quantity) || undefined,
+      };
+    }
+
+    submit.mutate(dto);
+  };
+
+  return (
+    <Box style={{ padding: "28px 32px 40px", maxWidth: 720, margin: "0 auto" }}>
+      <Stack gap="lg">
+        <Group gap="md">
+          <Button variant="subtle" color="gray" onClick={() => navigate(`/contracts/${id}`)}>
+            <ArrowLeft size={18} />
+          </Button>
+          <div>
+            <Title order={3}>Request shipment</Title>
+            <Text size="sm" c="dimmed">
+              {contract.reference} — Global Logistics will review and create your booking.
+            </Text>
+          </div>
+        </Group>
+
+        <Paper withBorder radius="lg" p="xl" style={{ borderColor: BORDER }}>
+          <Stack gap="md">
+            <DatePickerInput
+              label="Preferred shipment date"
+              placeholder="Pick a date"
+              leftSection={<CalendarDays size={16} />}
+              minDate={new Date().toISOString().slice(0, 10)}
+              value={scheduledDate || null}
+              onChange={(v) => setScheduledDate(v ?? "")}
+              radius="md"
+              popoverProps={{ withinPortal: true }}
+            />
+
+            <NumberInput
+              label={isContainer ? "Number of containers" : "Cargo weight (tons)"}
+              value={quantity}
+              onChange={setQuantity}
+              min={1}
+            />
+
+            {capacity?.length ? (
+              <Text size="xs" c="dimmed">
+                Remaining capacity is shown on the contract — GL will validate your request.
+              </Text>
+            ) : null}
+
+            <Textarea
+              label="Notes (optional)"
+              value={notes}
+              onChange={(e) => setNotes(e.currentTarget.value)}
+              minRows={2}
+            />
+
+            <Button
+              color="teal"
+              leftSection={<Send size={16} />}
+              loading={submit.isPending}
+              onClick={handleSubmit}
+            >
+              Submit shipment request
+            </Button>
+          </Stack>
+        </Paper>
+      </Stack>
+    </Box>
+  );
+}
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/contract-booking-action.ts b/apps/edr-freight-web/portal/src/pages/contracts/contract-booking-action.ts
index b5c1c9e9c..0c449ad5f 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/contract-booking-action.ts
+++ b/apps/edr-freight-web/portal/src/pages/contracts/contract-booking-action.ts
@@ -15,7 +15,7 @@ export const TERMINAL_BOOKING_STATUSES = [
 /** Path A statuses where a customer (no customs) may book against the contract. */
 const PATH_A_BOOKABLE = ["FULLY_EXECUTED", "CONTRACT_ACTIVE"];
 
-export type ContractBookingActionKind = "book" | "rebook" | "none";
+export type ContractBookingActionKind = "book" | "rebook" | "request" | "none";
 
 export interface ContractBookingAction {
   kind: ContractBookingActionKind;
@@ -35,8 +35,19 @@ export function getContractBookingAction(
   contract: Freight.IContract,
   bookings: Freight.IBooking[],
 ): ContractBookingAction {
-  // Customs (Path B) contracts are booked by Global Logistics on behalf of the
-  // customer — the customer never gets a Book button for them.
+  // GENERAL + customs: customer submits a shipment request; GL creates the booking.
+  if (
+    contract.customsClearingEnabled &&
+    contract.contractKind === "GENERAL" &&
+    contract.status === "CONTRACT_ACTIVE"
+  ) {
+    return {
+      kind: "request",
+      to: `/contracts/${contract.id}/shipment-requests/new`,
+    };
+  }
+
+  // Other customs (ONE_TIME): booked by GL — no customer action.
   if (contract.customsClearingEnabled) return { kind: "none", to: "" };
   if (!PATH_A_BOOKABLE.includes(contract.status)) return { kind: "none", to: "" };
 
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/ContractDocsEditor.tsx b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/ContractDocsEditor.tsx
new file mode 100644
index 000000000..e491cd88a
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/ContractDocsEditor.tsx
@@ -0,0 +1,192 @@
+import { useMemo } from "react";
+import { Box, Button, Group, Loader, Stack, Text } from "@mantine/core";
+import { SmartFileInput } from "@edr/ui-common";
+import { CheckCircle2, Download, FileText } from "lucide-react";
+
+import type { Freight } from "@edr/types";
+import { useQuery } from "@tanstack/react-query";
+import useAuth from "@/hooks/useAuth";
+import { api } from "@/services/api";
+import { fileViewUrl } from "@/constants/apiConfig";
+import { labelForDocCode } from "@/pages/bookings/resubmit/resubmitDocs";
+import { BORDER, GREEN, INK } from "../contract-ui";
+
+type DocumentsValue = Record<string, File | File[] | null>;
+type ContractFile = NonNullable<Freight.IContract["files"]>[number];
+
+/** Onboarding document setting code for the company's nationality. */
+function documentSettingCode(nationality: string | null | undefined): string {
+  return nationality === "foreign"
+    ? "company_onboarding_documents_foreign"
+    : "company_onboarding_documents_ethiopian";
+}
+
+function hasFile(value: File | File[] | null | undefined): boolean {
+  if (!value) return false;
+  return Array.isArray(value) ? value.length > 0 : true;
+}
+
+/** One row per distinct doc code already on the contract (latest upload). */
+function dedupeLatestByCode(files: ContractFile[]): ContractFile[] {
+  const order: string[] = [];
+  const latest = new Map<string, ContractFile>();
+  for (const f of files) {
+    if (f.code === "contract" || f.code.startsWith("signature_")) continue;
+    if (!latest.has(f.code)) order.push(f.code);
+    latest.set(f.code, f);
+  }
+  return order.map((c) => latest.get(c)!);
+}
+
+/**
+ * Document replace/upload block for an existing contract. Lists the documents
+ * already on file (latest upload per code) and renders the onboarding-driven
+ * `SmartFileInput` so the customer can replace any of them or attach any
+ * required document that isn't on file yet. Used on the contract wizard's review
+ * step when editing a CHANGES_REQUESTED contract.
+ *
+ * The keys returned through `onChange` are doc-setting field keys; the parent
+ * wizard merges them into the form's `documents` map, which is uploaded with the
+ * contract update.
+ */
+export function ContractDocsEditor({
+  contract,
+  value,
+  onChange,
+  errors,
+}: {
+  contract: Freight.IContract;
+  value: DocumentsValue;
+  onChange: (next: DocumentsValue) => void;
+  errors?: Record<string, string>;
+}) {
+  const auth = useAuth();
+
+  const nationality = auth.company?.company?.nationality as
+    | string
+    | null
+    | undefined;
+  const settingQuery = useQuery(
+    api.fileUploadSettings.getByCode.queryOptions({
+      input: { code: documentSettingCode(nationality) },
+    }),
+  );
+
+  const files = contract.files ?? [];
+  const onFile = useMemo(() => dedupeLatestByCode(files), [files]);
+
+  return (
+    <Stack gap="md">
+      {onFile.length > 0 && (
+        <Stack gap={8}>
+          <Text fz={13} fw={700} style={{ color: INK }}>
+            Already on file
+          </Text>
+          {onFile.map((file) => (
+            <Group
+              key={file.id}
+              gap={12}
+              align="center"
+              wrap="nowrap"
+              className="rounded-xl"
+              style={{ border: `1px solid ${BORDER}`, padding: "10px 14px" }}
+            >
+              <Box
+                style={{
+                  flexShrink: 0,
+                  width: 34,
+                  height: 34,
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  borderRadius: 9,
+                  backgroundColor: "#EAF1FB",
+                  color: "#2E5B96",
+                }}
+              >
+                <FileText size={17} />
+              </Box>
+              <Box style={{ minWidth: 0, flex: 1 }}>
+                <Text fz="13px" fw={600} style={{ color: INK }} truncate>
+                  {labelForDocCode(file.code)}
+                </Text>
+                <Text fz="12px" c="dimmed" truncate>
+                  {file.name}
+                </Text>
+              </Box>
+              <Group gap={8} wrap="nowrap">
+                <Group gap={5} c={GREEN}>
+                  <CheckCircle2 size={14} />
+                  <Text fz="11.5px" fw={600} c={GREEN}>
+                    On file
+                  </Text>
+                </Group>
+                <Button
+                  component="a"
+                  href={fileViewUrl(file.id, true)}
+                  variant="default"
+                  size="compact-xs"
+                  radius="md"
+                  leftSection={<Download size={13} />}
+                >
+                  Download
+                </Button>
+              </Group>
+            </Group>
+          ))}
+        </Stack>
+      )}
+
+      <Box>
+        <Text fz={13} fw={700} style={{ color: INK }} mb="xs">
+          Update documents
+        </Text>
+        <Text fz="12px" c="dimmed" mb="sm">
+          Replace any document you need to change. Documents marked required must
+          be on file before you can resubmit.
+        </Text>
+
+        {settingQuery.isLoading ? (
+          <Group justify="center" py="lg">
+            <Loader size="sm" color="edr-green" />
+          </Group>
+        ) : settingQuery.data ? (
+          <SmartFileInput
+            file={settingQuery.data}
+            value={value}
+            onChange={onChange}
+            errors={errors}
+          />
+        ) : (
+          <Text fz="13px" c="dimmed">
+            No document requirements are configured for your account. You can
+            resubmit using the documents already on file.
+          </Text>
+        )}
+      </Box>
+    </Stack>
+  );
+}
+
+/**
+ * Keys of the documents the onboarding setting marks required that are neither
+ * already on the contract nor freshly attached in `documents`. Empty means the
+ * customer may resubmit.
+ */
+export function missingRequiredDocKeys(
+  setting: Freight.IFileUploadSetting | undefined,
+  contract: Freight.IContract,
+  documents: DocumentsValue,
+): string[] {
+  const fields = setting?.fields ?? [];
+  const existingCodes = new Set((contract.files ?? []).map((f) => f.code));
+  return fields
+    .filter((f) => f.isRequired)
+    .filter(
+      (f) => !existingCodes.has(f.fileKey) && !hasFile(documents[f.fileKey]),
+    )
+    .map((f) => f.fileKey);
+}
+
+export { documentSettingCode, hasFile, dedupeLatestByCode };
+export default ContractDocsEditor;
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/contractToForm.ts b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/contractToForm.ts
new file mode 100644
index 000000000..8916ef67d
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/contractToForm.ts
@@ -0,0 +1,140 @@
+import type { Freight } from "@edr/types";
+import type { ContractFormInputValues, OperationType } from "./schema";
+import { initialContractFormValues } from "./schema";
+
+/**
+ * Trade direction → base operation type. The freight-forwarder variants
+ * (import_ff / export_ff) are selected by the caller when the contract is
+ * stamped to a freight_forwarder profile (see `isForwarderProfile`).
+ */
+function directionToOperation(
+  direction: Freight.ContractTradeDirection,
+  isForwarderProfile: boolean,
+): OperationType {
+  if (direction === "IMPORT") return isForwarderProfile ? "import_ff" : "import";
+  if (direction === "EXPORT") return isForwarderProfile ? "export_ff" : "export";
+  return "intercity";
+}
+
+/**
+ * Rebuild the cargo-type path `[groupId, commodityId]` from a flat cargoTypeId
+ * by locating which reference cargo-type group owns it.
+ */
+function cargoTypePathFor(
+  cargoTypeId: string | null | undefined,
+  referenceData: Freight.BookingReferenceData | undefined,
+): string[] {
+  if (!cargoTypeId || !referenceData?.cargo_type) return [];
+  for (const group of referenceData.cargo_type) {
+    if (group.children?.some((c) => c.id === cargoTypeId)) {
+      return [group.id, cargoTypeId];
+    }
+  }
+  return [];
+}
+
+/**
+ * Inverse of `buildApiPayload` in NewContractPage: hydrate the contract wizard
+ * form from a saved contract so a customer can edit a CHANGES_REQUESTED (or
+ * DRAFT) contract in the same UI used to create it. Missing fields fall back to
+ * `initialContractFormValues`. Files are not mapped — the wizard's `documents`
+ * map only holds freshly attached replacements; existing files are listed
+ * separately by `ContractDocsEditor`.
+ */
+export function contractToFormValues(
+  contract: Freight.IContract,
+  referenceData: Freight.BookingReferenceData | undefined,
+  isForwarderProfile: boolean,
+): Partial<ContractFormInputValues> {
+  const isContainer = contract.freightType === "CONTAINER";
+  const isGeneral = contract.contractKind === "GENERAL";
+
+  const routes = [...(contract.routes ?? [])].sort(
+    (a, b) => a.sortOrder - b.sortOrder,
+  );
+  const primaryRoute = routes[0];
+  const extraRoutes = isGeneral
+    ? routes.slice(1).map((r) => ({
+        originYard: r.originYardId,
+        destinationYard: r.destinationYardId,
+      }))
+    : [];
+
+  const scope = contract.cargoScope ?? [];
+
+  // Container scope: one row per enabled size, with per-size caps for GENERAL.
+  const enabledContainerSizes = isContainer
+    ? scope
+        .map((s) => s.containerSize)
+        .filter((s): s is string => Boolean(s))
+    : [];
+  const containerSizeCaps: Record<string, number> = {};
+  if (isContainer && isGeneral) {
+    for (const s of scope) {
+      if (s.containerSize && s.quantityCap != null) {
+        containerSizeCaps[s.containerSize] = s.quantityCap;
+      }
+    }
+  }
+
+  // Bulk scope: a single commodity row.
+  const bulkRow = !isContainer ? scope[0] : undefined;
+  const cargoTypePath = bulkRow
+    ? cargoTypePathFor(bulkRow.cargoTypeId, referenceData)
+    : [];
+
+  const hasFirstMile = Boolean(contract.firstMilePickupAddress);
+  const hasLastMile = Boolean(contract.lastMileDeliveryAddress);
+
+  return {
+    ...initialContractFormValues,
+
+    operationType: directionToOperation(
+      contract.tradeDirection,
+      isForwarderProfile,
+    ),
+    contractKind: isGeneral ? "general_contract" : "one_time",
+    contractType: contract.renewalOfId ? "renewal" : "new",
+    previousContractRef: contract.renewalOfId ?? "",
+
+    serviceTypeId: contract.serviceTypeId,
+    paymentCurrency:
+      contract.paymentCurrency === "ETB" ? "ETB" : "USD",
+
+    firstMile: {
+      enabled: hasFirstMile,
+      pickUpAddress: contract.firstMilePickupAddress ?? "",
+      exactLocation: "",
+      lat: contract.firstMilePickupLat ?? null,
+      lng: contract.firstMilePickupLng ?? null,
+    },
+    lastMile: {
+      enabled: hasLastMile,
+      deliveryAddress: contract.lastMileDeliveryAddress ?? "",
+      exactLocation: "",
+      lat: contract.lastMileDeliveryLat ?? null,
+      lng: contract.lastMileDeliveryLng ?? null,
+    },
+    customsClearingEnabled: contract.customsClearingEnabled,
+    customsClearingAgent: contract.customsClearingAgent ?? "",
+
+    cargoType: isContainer ? "container" : "bulk",
+    enabledContainerSizes:
+      enabledContainerSizes as ContractFormInputValues["enabledContainerSizes"],
+    containerSizeCaps,
+    cargoTypePath,
+    cargoFreeText: bulkRow?.cargoFreeText ?? "",
+    bulkQuantityCap:
+      isGeneral && bulkRow?.quantityCap != null ? bulkRow.quantityCap : 0,
+    isHazardous: contract.isHazardous,
+    isRefrigerated: contract.isReefer,
+
+    originYard: primaryRoute?.originYardId ?? "",
+    destinationYard: primaryRoute?.destinationYardId ?? "",
+    extraRoutes,
+
+    documents: {},
+  };
+}
+
+export default contractToFormValues;
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/helpers.ts b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/helpers.ts
index 1f24d467e..742cba482 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/helpers.ts
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/helpers.ts
@@ -6,4 +6,5 @@ export {
   operationToTradeDirection,
   operationToProfileType,
   getRouteDirection,
+  filterBookableServices,
 } from "@/pages/bookings/new-booking-form/schema";
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/schema.ts b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/schema.ts
index 015517f07..df0705e68 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/schema.ts
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/schema.ts
@@ -11,6 +11,14 @@ export const CONTRACT_STEPS = [
   { id: 2, label: "Review & Submit", short: "Review" },
 ] as const;
 
+/** Edit flow (CHANGES_REQUESTED): documents on step 2, review on step 3. */
+export const EDIT_CONTRACT_STEPS = [
+  { id: 0, label: "Setup", short: "Setup" },
+  { id: 1, label: "Cargo & Route", short: "Cargo & Route" },
+  { id: 2, label: "Documents", short: "Documents" },
+  { id: 3, label: "Review & Submit", short: "Review" },
+] as const;
+
 export const OPERATION_TYPES = [
   "import",
   "export",
@@ -187,8 +195,6 @@ export const contractFormSchema = z
         }),
       )
       .default([]),
-    // Non-binding estimate. The binding scheduled date is captured at booking.
-    estimatedShipmentDate: z.string().default(""),
 
     documents: z.record(z.string(), z.any()).default({}),
     notes: z.string().default(""),
@@ -222,15 +228,6 @@ export const contractFormSchema = z
     },
   )
   .superRefine((data, ctx) => {
-    // Estimated shipment date is a planning value and is required for all
-    // contracts (doc §7 step 4).
-    if (!data.estimatedShipmentDate.trim()) {
-      ctx.addIssue({
-        code: "custom",
-        path: ["estimatedShipmentDate"],
-        message: "Select an estimated shipment date.",
-      });
-    }
     if (data.cargoType === "container") {
       // Container scope: at least one enabled size.
       if (data.enabledContainerSizes.length === 0) {
@@ -255,6 +252,12 @@ export const contractFormSchema = z
           path: ["cargoTypePath"],
           message: "Select a commodity.",
         });
+      } else if (!data.cargoFreeText?.trim()) {
+        ctx.addIssue({
+          code: "custom",
+          path: ["cargoFreeText"],
+          message: "Describe the cargo.",
+        });
       }
     }
   });
@@ -287,7 +290,6 @@ export const initialContractFormValues: DeepPartial<ContractFormValues> = {
   originYard: "",
   destinationYard: "",
   extraRoutes: [],
-  estimatedShipmentDate: "",
 
   documents: {},
   notes: "",
@@ -311,7 +313,7 @@ export const contractStepFields: Record<
     "firstMile",
     "lastMile",
   ],
-  // Step 1 — Cargo & Route: scope, sizes, flags, origin/destination, date.
+  // Step 1 — Cargo & Route: scope, sizes, flags, origin/destination.
   1: [
     "cargoType",
     "enabledContainerSizes",
@@ -324,9 +326,20 @@ export const contractStepFields: Record<
     "originYard",
     "destinationYard",
     "extraRoutes",
-    "estimatedShipmentDate",
   ],
   // Step 2 — Review & Submit. (The separate Documents step was removed — the
   // company profile documents are attached to the contract automatically.)
   2: ["notes"],
 };
+
+/** Field validation per step when editing a CHANGES_REQUESTED contract. */
+export const editContractStepFields: Record<
+  number,
+  Array<Path<ContractFormValues>>
+> = {
+  0: contractStepFields[0],
+  1: contractStepFields[1],
+  // Step 2 — Documents: validated via missingRequiredDocKeys in the wizard.
+  2: [],
+  3: ["notes"],
+};
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step1-contract-type.tsx b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step1-contract-type.tsx
index 7ffb38e97..c86e17fc5 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step1-contract-type.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step1-contract-type.tsx
@@ -3,11 +3,13 @@ import type { Freight } from "@edr/types";
 import { useQuery } from "@tanstack/react-query";
 import { useMemo, useState } from "react";
 import { Controller, type UseFormReturn } from "react-hook-form";
-import { Select, Stack, Text } from "@mantine/core";
+import { Badge, Group, Select, Stack, Text } from "@mantine/core";
 import {
   CONTRACT_KIND_OPTIONS,
   ContractFormInputValues,
+  OPERATION_TYPE_OPTIONS,
   type ContractFormValues,
+  type OperationType,
 } from "./schema";
 import { AlertBox, AsyncComboboxField, fieldStyles } from "./shared";
 
@@ -31,11 +33,22 @@ interface PreviousContractOption {
 export function Step1ContractType({
   form,
   referenceData,
+  allowedOperations,
+  onOperationSelect,
+  operationStatus,
 }: {
   form: ContractForm;
   referenceData?: Freight.BookingReferenceData;
+  allowedOperations: OperationType[];
+  onOperationSelect?: (op: OperationType) => void;
+  /** Approval state of the profile each operation maps to (for the badges). */
+  operationStatus?: (op: OperationType) => "approved" | "pending" | "missing";
 }) {
   const contractType = form.watch("contractType");
+
+  const operationData = OPERATION_TYPE_OPTIONS.filter((opt) =>
+    allowedOperations.includes(opt.value),
+  ).map((opt) => ({ value: opt.value, label: opt.label }));
   const previousContractRef = form.watch("previousContractRef");
   const [searchQuery, setSearchQuery] = useState("");
 
@@ -167,38 +180,81 @@ export function Step1ContractType({
 
   return (
     <Stack gap={16}>
-      <div className="grid gap-4 sm:grid-cols-2">
+      {allowedOperations.length === 0 && (
+        <AlertBox tone="error">
+          Your company has no operational profile yet. Complete onboarding to
+          register as an importer, exporter, or freight forwarder.
+        </AlertBox>
+      )}
+
+      {/* Operation Type + Contract Kind + New/Renewal on one wrapping row. Each
+          field keeps a sensible min width and flexes to fill / wrap below on
+          narrow screens. */}
+      <div className="flex flex-wrap gap-4">
+        <Controller
+          name="operationType"
+          control={form.control}
+          render={({ field, fieldState }) => (
+            <Select
+              className="flex-1 min-w-[200px]"
+              label="Operation Type *"
+              placeholder="Select an operation…"
+              data={operationData}
+              value={field.value || null}
+              onChange={(v) => {
+                if (!v) return;
+                field.onChange(v);
+                onOperationSelect?.(v as OperationType);
+              }}
+              onBlur={field.onBlur}
+              error={fieldState.error?.message}
+              allowDeselect={false}
+              radius={10}
+              checkIconPosition="right"
+              comboboxProps={{ withinPortal: true, shadow: "md", radius: "md" }}
+              styles={fieldStyles}
+              renderOption={({ option }) => {
+                const status = operationStatus?.(option.value as OperationType);
+                return (
+                  <Group justify="space-between" gap="sm" wrap="nowrap" w="100%">
+                    <Text fz={14}>{option.label}</Text>
+                    {status === "pending" && (
+                      <Badge size="xs" color="yellow" variant="light" radius="sm">
+                        Pending
+                      </Badge>
+                    )}
+                    {status === "missing" && (
+                      <Badge size="xs" color="gray" variant="light" radius="sm">
+                        Add license
+                      </Badge>
+                    )}
+                  </Group>
+                );
+              }}
+            />
+          )}
+        />
+
         <Controller
           name="contractKind"
           control={form.control}
-          render={({ field }) => {
-            const selected = CONTRACT_KIND_OPTIONS.find(
-              (o) => o.value === (field.value ?? "one_time"),
-            );
-            return (
-              <div>
-                <Select
-                  label="Contract Kind *"
-                  data={CONTRACT_KIND_OPTIONS.map((o) => ({
-                    value: o.value,
-                    label: o.label,
-                  }))}
-                  value={field.value ?? "one_time"}
-                  onChange={(v) => field.onChange(v ?? "one_time")}
-                  allowDeselect={false}
-                  radius={10}
-                  checkIconPosition="right"
-                  comboboxProps={{ withinPortal: true, shadow: "md", radius: "md" }}
-                  styles={fieldStyles}
-                />
-                {selected && (
-                  <Text fz={12} c="#6B7C8E" mt={6}>
-                    {selected.description}
-                  </Text>
-                )}
-              </div>
-            );
-          }}
+          render={({ field }) => (
+            <Select
+              className="flex-1 min-w-[200px]"
+              label="Contract Kind *"
+              data={CONTRACT_KIND_OPTIONS.map((o) => ({
+                value: o.value,
+                label: o.label,
+              }))}
+              value={field.value ?? "one_time"}
+              onChange={(v) => field.onChange(v ?? "one_time")}
+              allowDeselect={false}
+              radius={10}
+              checkIconPosition="right"
+              comboboxProps={{ withinPortal: true, shadow: "md", radius: "md" }}
+              styles={fieldStyles}
+            />
+          )}
         />
 
         <Controller
@@ -206,6 +262,7 @@ export function Step1ContractType({
           control={form.control}
           render={({ field, fieldState }) => (
             <Select
+              className="flex-1 min-w-[200px]"
               label="New or Renewal *"
               placeholder="Select…"
               data={CONTRACT_TYPE_OPTIONS}
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step2-service-type.tsx b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step2-service-type.tsx
index 3d9bd4ec1..3ea87135f 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step2-service-type.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step2-service-type.tsx
@@ -14,6 +14,7 @@ import {
 import { useEffect, useMemo, useRef } from "react";
 import { Controller, type UseFormReturn } from "react-hook-form";
 import { ContractFormInputValues, type ContractFormValues } from "./schema";
+import { filterBookableServices } from "./helpers";
 import { fieldStyles, StepLabel } from "./shared";
 import { PaymentCurrencyField } from "./payment-currency-field";
 import { LocationPicker } from "@/pages/bookings/new-booking-form/LocationPicker";
@@ -132,7 +133,7 @@ function ServiceTypeSelector({
           </Text>
         </Box>
       ) : (
-        <div className="grid gap-3 sm:grid-cols-2">
+        <div className="grid gap-3 grid-cols-2 sm:grid-cols-3 lg:grid-cols-4">
           {services.map((s) => {
             const selected = s.id === value;
             return (
@@ -147,8 +148,8 @@ function ServiceTypeSelector({
                   position: "relative",
                   textAlign: "left",
                   cursor: "pointer",
-                  padding: 16,
-                  borderRadius: 16,
+                  padding: 12,
+                  borderRadius: 14,
                   border: `1.5px solid ${selected ? GREEN : error ? "#F0B4B4" : BORDER}`,
                   background: selected ? GREEN_SOFT : "#fff",
                   boxShadow: selected
@@ -162,10 +163,10 @@ function ServiceTypeSelector({
                 <Box
                   style={{
                     position: "absolute",
-                    top: 12,
-                    right: 12,
-                    width: 22,
-                    height: 22,
+                    top: 10,
+                    right: 10,
+                    width: 18,
+                    height: 18,
                     borderRadius: 999,
                     display: "flex",
                     alignItems: "center",
@@ -175,16 +176,16 @@ function ServiceTypeSelector({
                     transition: "all 160ms ease",
                   }}
                 >
-                  {selected ? <Check size={13} color="#fff" strokeWidth={3} /> : null}
+                  {selected ? <Check size={11} color="#fff" strokeWidth={3} /> : null}
                 </Box>
 
-                <Group gap={11} align="flex-start" wrap="nowrap" mb={10}>
+                <Group gap={9} align="flex-start" wrap="nowrap" mb={8}>
                   <Box
                     style={{
-                      width: 42,
-                      height: 42,
+                      width: 34,
+                      height: 34,
                       flexShrink: 0,
-                      borderRadius: 12,
+                      borderRadius: 10,
                       display: "flex",
                       alignItems: "center",
                       justifyContent: "center",
@@ -193,21 +194,15 @@ function ServiceTypeSelector({
                       transition: "all 160ms ease",
                     }}
                   >
-                    <Container size={20} strokeWidth={2} />
+                    <Container size={17} strokeWidth={2} />
                   </Box>
-                  <Box style={{ minWidth: 0, paddingRight: 24 }}>
-                    <Text fz={14.5} fw={750} c={INK} style={{ lineHeight: 1.25 }}>
+                  <Box style={{ minWidth: 0, paddingRight: 20 }}>
+                    <Text fz={13} fw={700} c={INK} style={{ lineHeight: 1.25 }}>
                       {s.serviceName}
                     </Text>
                   </Box>
                 </Group>
 
-                {s.description ? (
-                  <Text fz={12.5} c={MUTED} mb={11} style={{ lineHeight: 1.45 }}>
-                    {s.description}
-                  </Text>
-                ) : null}
-
                 <Group gap={6} wrap="wrap">
                   {serviceFeatures(s).map((f) => (
                     <FeatureChip
@@ -241,6 +236,7 @@ export function Step2ServiceType({
   referenceData?: Freight.BookingReferenceData;
 }) {
   const serviceTypeId = form.watch("serviceTypeId");
+  const operationType = form.watch("operationType");
   const serviceType = referenceData?.service.find(
     (s) => s.id === serviceTypeId,
   );
@@ -251,29 +247,40 @@ export function Step2ServiceType({
   const lastMileEnabled = form.watch("lastMile.enabled");
 
   const prevServiceType = useRef(serviceType);
-  useEffect(() => {
-    form.setValue(
-      "firstMile",
-      { enabled: false, pickUpAddress: "", exactLocation: "", lat: null, lng: null },
-      { shouldValidate: true },
-    );
-  }, [includesFirstMile]);
-
-  useEffect(() => {
-    form.setValue(
-      "lastMile",
-      { enabled: false, deliveryAddress: "", exactLocation: "", lat: null, lng: null },
-      { shouldValidate: true },
-    );
-  }, [includesLastMile]);
-
-  // Customs clearance bundling is driven by the service: includesCustoms → the
-  // contract follows Path B (clearance docs after sign); otherwise Path A.
   useEffect(() => {
     const prev = prevServiceType.current;
     prevServiceType.current = serviceType;
     if (!prev || prev === serviceType) return;
 
+    if (!includesFirstMile) {
+      form.setValue(
+        "firstMile",
+        {
+          enabled: false,
+          pickUpAddress: "",
+          exactLocation: "",
+          lat: null,
+          lng: null,
+        },
+        { shouldValidate: true },
+      );
+    }
+    if (!includesLastMile) {
+      form.setValue(
+        "lastMile",
+        {
+          enabled: false,
+          deliveryAddress: "",
+          exactLocation: "",
+          lat: null,
+          lng: null,
+        },
+        { shouldValidate: true },
+      );
+    }
+
+    // Customs clearance bundling is driven by the service: includesCustoms → the
+    // contract follows Path B (clearance docs after sign); otherwise Path A.
     if (includesCustoms) {
       form.setValue("customsClearingEnabled", true, { shouldDirty: true });
       form.setValue("customsClearingAgent", "", { shouldDirty: true });
@@ -281,16 +288,24 @@ export function Step2ServiceType({
       form.setValue("customsClearingEnabled", false, { shouldDirty: true });
       form.setValue("customsClearingAgent", "", { shouldDirty: true });
     }
-  }, [serviceTypeId, form]);
+  }, [serviceType, includesFirstMile, includesLastMile, includesCustoms, form]);
 
   const showServiceSections =
     serviceType != null || includesFirstMile || includesLastMile;
 
   const standaloneServices = useMemo(
-    () => (referenceData?.service ?? []).filter((s) => s.canBeBookedAlone),
-    [referenceData],
+    () => filterBookableServices(referenceData?.service, operationType),
+    [referenceData, operationType],
   );
 
+  useEffect(() => {
+    const currentId = form.getValues("serviceTypeId");
+    if (!currentId) return;
+    if (!standaloneServices.some((s) => s.id === currentId)) {
+      form.setValue("serviceTypeId", "", { shouldValidate: true });
+    }
+  }, [operationType, standaloneServices, form]);
+
   return (
     <Stack gap={18}>
       <Controller
@@ -315,6 +330,9 @@ export function Step2ServiceType({
         <Stack gap={12}>
           <StepLabel>Trucking & customs options</StepLabel>
 
+          {/* First mile, last mile and customs sit side by side on one wrapping
+              row; each keeps a min width and stacks below on narrow screens. */}
+          <div className="flex flex-wrap gap-3 [&>*]:flex-1 [&>*]:min-w-[280px]">
           {includesFirstMile && (
             <Controller
               name="firstMile.enabled"
@@ -577,6 +595,7 @@ export function Step2ServiceType({
               )}
             />
           )}
+          </div>
         </Stack>
       )}
     </Stack>
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step3-cargo-scope.tsx b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step3-cargo-scope.tsx
index 9cda1985d..5f13d889a 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step3-cargo-scope.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step3-cargo-scope.tsx
@@ -11,6 +11,7 @@ import {
   Stack,
   Switch,
   Text,
+  TextInput,
 } from "@mantine/core";
 import type { Freight } from "@edr/types";
 import {
@@ -73,13 +74,6 @@ export function Step3CargoScope({
     }
   }, [parentId, form]);
 
-  // Clear reefer when switching to container (container reefer is per-booking).
-  useEffect(() => {
-    if (cargoType !== "bulk" && form.getValues("isRefrigerated")) {
-      form.setValue("isRefrigerated", false);
-    }
-  }, [cargoType, form]);
-
   const freightTypeGroups = useMemo(() => {
     if (!referenceData?.cargo_type) return [];
     return referenceData.cargo_type.filter(
@@ -210,6 +204,23 @@ export function Step3CargoScope({
               )}
             />
           )}
+
+          {parentId && commodityOptions.length > 0 && (
+            <Controller
+              name="cargoFreeText"
+              control={form.control}
+              render={({ field, fieldState }) => (
+                <TextInput
+                  {...field}
+                  label="Cargo description *"
+                  placeholder="e.g. Charcoal, Wheat, etc."
+                  error={fieldState.error?.message}
+                  radius={10}
+                  styles={fieldStyles}
+                />
+              )}
+            />
+          )}
         </Stack>
       )}
 
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step4-route.tsx b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step4-route.tsx
index d678dd318..1e9ead268 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step4-route.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step4-route.tsx
@@ -1,6 +1,6 @@
 import type { Freight } from "@edr/types";
-import { Box, Button, Group, Skeleton, Stack, Text, TextInput } from "@mantine/core";
-import { CalendarDays, MapPin, Plus, Trash2 } from "lucide-react";
+import { Box, Button, Group, Skeleton, Stack, Text } from "@mantine/core";
+import { MapPin, Plus, Trash2 } from "lucide-react";
 import { useCallback, useEffect, useMemo } from "react";
 import {
   Controller,
@@ -125,12 +125,6 @@ export function Step4Route({
 
   const stationSelectDisabled = yardOptions.length === 0;
 
-  const todayISODate = useMemo(() => {
-    const now = new Date();
-    const tz = now.getTimezoneOffset() * 60000;
-    return new Date(now.getTime() - tz).toISOString().slice(0, 10);
-  }, []);
-
   return (
     <Stack gap={16}>
       {isLoading ? (
@@ -177,27 +171,6 @@ export function Step4Route({
             </div>
           )}
 
-          {/* Estimated shipment date — a planning value for every contract. The
-              binding scheduled date is captured later at booking time. */}
-          <Box style={{ maxWidth: 280 }}>
-            <Controller
-              name="estimatedShipmentDate"
-              control={form.control}
-              render={({ field, fieldState }) => (
-                <TextInput
-                  type="date"
-                  label="Estimated shipment date *"
-                  description="A non-binding planning estimate. The actual shipment date is chosen when you book against this contract."
-                  min={todayISODate}
-                  leftSection={<CalendarDays size={16} />}
-                  error={fieldState.error?.message}
-                  value={field.value ?? ""}
-                  onChange={(e) => field.onChange(e.currentTarget.value)}
-                  radius="md"
-                />
-              )}
-            />
-          </Box>
         </div>
       )}
 
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step8-review.tsx b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step8-review.tsx
index 7fbf45d71..8f53b1b64 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step8-review.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/step8-review.tsx
@@ -9,9 +9,7 @@ import {
   Text,
   Textarea,
 } from "@mantine/core";
-import { format } from "date-fns";
 import {
-  Calendar,
   CheckCircle2,
   Circle,
   ClipboardCheck,
@@ -188,6 +186,8 @@ export function Step8Review({
   onSubmit,
   saveDraftPending = false,
   submitPending = false,
+  documentsEditor,
+  isEdit = false,
 }: {
   form: ContractForm;
   /** Retained for caller compatibility; the review page is read-only. */
@@ -201,6 +201,14 @@ export function Step8Review({
   onSubmit?: () => void;
   saveDraftPending?: boolean;
   submitPending?: boolean;
+  /**
+   * Document replace/upload block, shown only when editing an existing contract
+   * (resubmit after CHANGES_REQUESTED). Omitted for fresh creation, where docs
+   * come from the company profile automatically.
+   */
+  documentsEditor?: React.ReactNode;
+  /** Editing an existing contract (resubmit) rather than creating a new one. */
+  isEdit?: boolean;
 }) {
   const values = form.watch();
   const serviceType = referenceData?.service.find(
@@ -238,10 +246,6 @@ export function Step8Review({
     referenceData?.yard.find((y) => y.id === values.destinationYard)?.name ??
     values.destinationYard;
 
-  const scheduleLabel = values.estimatedShipmentDate
-    ? format(new Date(values.estimatedShipmentDate), "EEEE, MMM d, yyyy")
-    : "—";
-
   const directionLabel = direction
     ? direction.charAt(0) + direction.slice(1).toLowerCase()
     : "—";
@@ -343,17 +347,17 @@ export function Step8Review({
                     : directionLabel
                 }
               />
-              <SummaryItem
-                icon={<Calendar size={18} />}
-                label="Estimated shipment"
-                value={scheduleLabel}
-              />
               <SummaryItem
                 icon={<Package size={18} />}
                 label="Cargo scope"
                 value={
                   <>
                     {cargoValue || "—"}
+                    {values.cargoType === "bulk" && values.cargoFreeText?.trim() && (
+                      <Text fz="sm" c="dimmed" mt={4}>
+                        {values.cargoFreeText}
+                      </Text>
+                    )}
                     {values.cargoType === "container" &&
                       (values.enabledContainerSizes ?? []).length > 0 && (
                         <Group gap={6} mt={6}>
@@ -410,6 +414,16 @@ export function Step8Review({
                     : "Not requested"
                 }
               />
+              <SummaryItem
+                icon={<Package size={18} />}
+                label="Hazardous cargo"
+                value={values.isHazardous ? "Yes" : "No"}
+              />
+              <SummaryItem
+                icon={<Package size={18} />}
+                label="Refrigerated"
+                value={values.isRefrigerated ? "Yes" : "No"}
+              />
               <SummaryItem
                 icon={<FileText size={18} />}
                 label="Documents"
@@ -429,6 +443,17 @@ export function Step8Review({
             />
           )}
 
+          {documentsEditor && (
+            <Paper
+              radius={18}
+              p="lg"
+              withBorder
+              style={{ borderColor: "var(--mantine-color-edr-border-0)" }}
+            >
+              {documentsEditor}
+            </Paper>
+          )}
+
           <Controller
             name="notes"
             control={form.control}
@@ -464,10 +489,6 @@ export function Step8Review({
                   done={Boolean(values.originYard && values.destinationYard)}
                   label="Route selected"
                 />
-                <ReadinessItem
-                  done={Boolean(values.estimatedShipmentDate)}
-                  label="Estimated date selected"
-                />
                 <ReadinessItem
                   done={
                     values.cargoType === "container"
@@ -485,9 +506,13 @@ export function Step8Review({
 
             <Paper radius={20} p="lg" withBorder bg="white">
               <Text size="sm" c="dimmed" mb="md">
-                {pricing
-                  ? "Review your unit-rate quotation. Approve to submit the contract for EDR staff review."
-                  : "Ready to submit. You'll review the unit-rate quotation before final submission."}
+                {isEdit
+                  ? pricing
+                    ? "Review your updated unit-rate quotation. Approve to resubmit the contract for EDR staff review."
+                    : "Ready to resubmit. You'll review the unit-rate quotation before final resubmission."
+                  : pricing
+                    ? "Review your unit-rate quotation. Approve to submit the contract for EDR staff review."
+                    : "Ready to submit. You'll review the unit-rate quotation before final submission."}
               </Text>
               <Stack gap="sm">
                 <Button
@@ -501,20 +526,28 @@ export function Step8Review({
                   loading={submitPending}
                   disabled={submitPending}
                 >
-                  {pricing ? "Approve quotation & submit" : "Submit"}
-                </Button>
-                <Button
-                  type="button"
-                  variant="outline"
-                  color="edr-green"
-                  radius="md"
-                  fullWidth
-                  onClick={onSaveDraft}
-                  loading={saveDraftPending}
-                  disabled={submitPending}
-                >
-                  Save as draft
+                  {isEdit
+                    ? pricing
+                      ? "Approve quotation & resubmit"
+                      : "Resubmit"
+                    : pricing
+                      ? "Approve quotation & submit"
+                      : "Submit"}
                 </Button>
+                {!isEdit && (
+                  <Button
+                    type="button"
+                    variant="outline"
+                    color="edr-green"
+                    radius="md"
+                    fullWidth
+                    onClick={onSaveDraft}
+                    loading={saveDraftPending}
+                    disabled={submitPending}
+                  >
+                    Save as draft
+                  </Button>
+                )}
               </Stack>
             </Paper>
           </Stack>
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/steps.tsx b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/steps.tsx
index e40b33a4f..0226ccadd 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/steps.tsx
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/steps.tsx
@@ -1,4 +1,3 @@
-export { Step0OperationType } from "./step0-operation-type";
 export { Step1ContractType } from "./step1-contract-type";
 export { Step2ServiceType } from "./step2-service-type";
 export { Step3CargoScope } from "./step3-cargo-scope";
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/useContractDraft.ts b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/useContractDraft.ts
index 7c44b7382..a94e77168 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/useContractDraft.ts
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-contract-form/useContractDraft.ts
@@ -58,14 +58,22 @@ export function useContractDraft({
   step,
   setStep,
   fresh,
+  enabled = true,
 }: {
   form: ContractForm;
   step: number;
   setStep: (step: number) => void;
   fresh: boolean;
+  /**
+   * When false the draft is neither restored nor persisted — used in edit mode,
+   * where the server contract is the source of truth and the localStorage key is
+   * shared with the create flow.
+   */
+  enabled?: boolean;
 }): { clearDraft: () => void } {
   const restoredRef = useRef(false);
   useEffect(() => {
+    if (!enabled) return;
     if (restoredRef.current) return;
     restoredRef.current = true;
 
@@ -107,6 +115,7 @@ export function useContractDraft({
   };
 
   useEffect(() => {
+    if (!enabled) return;
     if (!restoredRef.current) return;
     const sub = form.watch(() => {
       if (timerRef.current) clearTimeout(timerRef.current);
@@ -117,9 +126,10 @@ export function useContractDraft({
       if (timerRef.current) clearTimeout(timerRef.current);
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [form]);
+  }, [form, enabled]);
 
   useEffect(() => {
+    if (!enabled) return;
     if (!restoredRef.current) return;
     write();
     // eslint-disable-next-line react-hooks/exhaustive-deps
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-shipment-form/schema.ts b/apps/edr-freight-web/portal/src/pages/contracts/new-shipment-form/schema.ts
index 33fbe30c7..ac182113f 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-shipment-form/schema.ts
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-shipment-form/schema.ts
@@ -14,6 +14,13 @@ export const SHIPMENT_STEPS = [
   { id: 3, label: "Review", short: "Review" },
 ] as const;
 
+export interface ShipmentValidationContext {
+  isContainer: boolean;
+  isHazardous: boolean;
+  isReefer: boolean;
+  unitOfMeasure?: "PER_TON" | "PER_ITEM";
+}
+
 const containerUnitSchema = z.object({
   containerNumber: z.string().min(1, "Container number is required."),
   sealNumber: z.string().default(""),
@@ -34,38 +41,109 @@ const containerLineSchema = z.object({
   units: z.array(containerUnitSchema).default([]),
 });
 
-export const shipmentFormSchema = z
-  .object({
-    contractRouteId: z.string().default(""),
-    scheduledDate: z.string().default(""),
-    // Container shipment lines (one per size). Empty for bulk contracts.
-    containers: z.array(containerLineSchema).default([]),
-    // Bulk shipment amount — tons or item count depending on the commodity.
-    cargoWeightTons: z.string().default(""),
-    itemCount: z.string().default(""),
-    bulkHazardousQuantity: z.string().default("0"),
-    notes: z.string().default(""),
-  })
-  .superRefine((data, ctx) => {
+const shipmentFormBase = z.object({
+  contractRouteId: z.string().default(""),
+  scheduledDate: z.string().default(""),
+  containers: z.array(containerLineSchema).default([]),
+  cargoWeightTons: z.string().default(""),
+  itemCount: z.string().default(""),
+  bulkHazardousQuantity: z.string().default("0"),
+  bulkReeferQuantity: z.string().default("0"),
+  notes: z.string().default(""),
+});
+
+export function createShipmentFormSchema(ctx: ShipmentValidationContext) {
+  return shipmentFormBase.superRefine((data, refineCtx) => {
     if (!data.scheduledDate.trim()) {
-      ctx.addIssue({
+      refineCtx.addIssue({
         code: "custom",
         path: ["scheduledDate"],
         message: "Select a shipment date.",
       });
     }
-    data.containers.forEach((line, i) => {
-      const qty = Number(line.quantity || 0);
-      // Each container must have one unit with a number + VGM.
-      if (qty >= 1 && line.units.length < qty) {
-        ctx.addIssue({
-          code: "custom",
-          path: ["containers", i, "units"],
-          message: `Enter details for all ${qty} container(s).`,
-        });
-      }
-    });
+
+    if (ctx.isContainer) {
+      data.containers.forEach((line, i) => {
+        const qty = Number(line.quantity || 0);
+        if (qty >= 1 && line.units.length < qty) {
+          refineCtx.addIssue({
+            code: "custom",
+            path: ["containers", i, "units"],
+            message: `Enter details for all ${qty} container(s).`,
+          });
+        }
+        if (ctx.isHazardous) {
+          const h = Number(line.hazardousQuantity || 0);
+          if (h > qty) {
+            refineCtx.addIssue({
+              code: "custom",
+              path: ["containers", i, "hazardousQuantity"],
+              message: `Can't exceed the ${qty} container(s) in this line.`,
+            });
+          }
+        }
+        if (ctx.isReefer) {
+          const r = Number(line.reeferQuantity || 0);
+          if (r > qty) {
+            refineCtx.addIssue({
+              code: "custom",
+              path: ["containers", i, "reeferQuantity"],
+              message: `Can't exceed the ${qty} container(s) in this line.`,
+            });
+          }
+        }
+      });
+    } else {
+      const bulkCap =
+        ctx.unitOfMeasure === "PER_ITEM"
+          ? Number(data.itemCount || 0)
+          : Number(data.cargoWeightTons || 0);
+
+      const boundBulkPortion = (
+        on: boolean,
+        raw: string,
+        path: "bulkHazardousQuantity" | "bulkReeferQuantity",
+        noun: string,
+      ) => {
+        if (!on) return;
+        const v = Number(raw || 0);
+        if (raw && !Number.isNaN(v) && bulkCap > 0 && v > bulkCap) {
+          refineCtx.addIssue({
+            code: "custom",
+            path: [path],
+            message: `Can't exceed the cargo quantity (${bulkCap}).`,
+          });
+        } else if (on && raw && !Number.isNaN(v) && v < 0) {
+          refineCtx.addIssue({
+            code: "custom",
+            path: [path],
+            message: `Enter a valid ${noun} quantity.`,
+          });
+        }
+      };
+
+      boundBulkPortion(
+        ctx.isHazardous,
+        data.bulkHazardousQuantity,
+        "bulkHazardousQuantity",
+        "hazardous",
+      );
+      boundBulkPortion(
+        ctx.isReefer,
+        data.bulkReeferQuantity,
+        "bulkReeferQuantity",
+        "refrigerated",
+      );
+    }
   });
+}
+
+/** Default schema for type inference; runtime uses createShipmentFormSchema. */
+export const shipmentFormSchema = createShipmentFormSchema({
+  isContainer: false,
+  isHazardous: false,
+  isReefer: false,
+});
 
 export type ShipmentFormValues = z.infer<typeof shipmentFormSchema>;
 export type ShipmentFormInputValues = z.input<typeof shipmentFormSchema>;
@@ -77,6 +155,7 @@ export const initialShipmentFormValues: DeepPartial<ShipmentFormValues> = {
   cargoWeightTons: "",
   itemCount: "",
   bulkHazardousQuantity: "0",
+  bulkReeferQuantity: "0",
   notes: "",
 };
 
@@ -85,7 +164,13 @@ export const shipmentStepFields: Record<
   Array<Path<ShipmentFormValues>>
 > = {
   0: ["contractRouteId"],
-  1: ["containers", "cargoWeightTons", "itemCount", "bulkHazardousQuantity"],
+  1: [
+    "containers",
+    "cargoWeightTons",
+    "itemCount",
+    "bulkHazardousQuantity",
+    "bulkReeferQuantity",
+  ],
   2: ["scheduledDate"],
   3: ["notes"],
 };
diff --git a/apps/edr-freight-web/portal/src/pages/contracts/new-shipment-form/total.ts b/apps/edr-freight-web/portal/src/pages/contracts/new-shipment-form/total.ts
index 95affc54c..501da7ed2 100644
--- a/apps/edr-freight-web/portal/src/pages/contracts/new-shipment-form/total.ts
+++ b/apps/edr-freight-web/portal/src/pages/contracts/new-shipment-form/total.ts
@@ -99,6 +99,32 @@ export function computeShipmentTotal(
         amount: rate.unitPrice * qty,
       });
     }
+    const hazardQty = Number(values.bulkHazardousQuantity || 0);
+    const reeferQty = Number(values.bulkReeferQuantity || 0);
+    if (contract.isHazardous && hazardQty > 0) {
+      const hz = rateFor((i) => i.conditionalOn === "is_hazardous");
+      if (hz) {
+        lines.push({
+          label: hz.label,
+          unitPrice: hz.unitPrice,
+          unit: hz.unit,
+          quantity: hazardQty,
+          amount: hz.unitPrice * hazardQty,
+        });
+      }
+    }
+    if (contract.isReefer && reeferQty > 0) {
+      const rf = rateFor((i) => i.conditionalOn === "is_reefer");
+      if (rf) {
+        lines.push({
+          label: rf.label,
+          unitPrice: rf.unitPrice,
+          unit: rf.unit,
+          quantity: reeferQty,
+          amount: rf.unitPrice * reeferQty,
+        });
+      }
+    }
   }
 
   const total = lines.reduce((s, l) => s + l.amount, 0);
diff --git a/apps/edr-freight-web/portal/src/services/api.ts b/apps/edr-freight-web/portal/src/services/api.ts
index 7c9c44b99..304ceaf89 100644
--- a/apps/edr-freight-web/portal/src/services/api.ts
+++ b/apps/edr-freight-web/portal/src/services/api.ts
@@ -11,6 +11,7 @@ import {
   type ApproveDeliveryResponse,
   BookingListFilter,
   CreateBookingPayload,
+  type CustomerTruckAssignmentPayload,
   GeneratePriceResponse,
   SubmitBookingResponse,
 } from "./bookings.service";
@@ -210,6 +211,25 @@ export const api = {
       ({ id }) => bookingsService.tracking(id),
     ),
 
+    assignCustomerTruck: endpoint<
+      { id: string; payload: CustomerTruckAssignmentPayload },
+      Freight.IBooking
+    >("bookings", "assignCustomerTruck", ({ id, payload }) =>
+      bookingsService.assignCustomerTruck(id, payload),
+    ),
+
+    downloadCustomerTruckFreightOrder: endpoint<{ id: string }, Blob>(
+      "bookings",
+      "downloadCustomerTruckFreightOrder",
+      ({ id }) => bookingsService.downloadCustomerTruckFreightOrder(id),
+    ),
+
+    downloadHandoverDocument: endpoint<{ inventoryId: string }, Blob>(
+      "bookings",
+      "downloadHandoverDocument",
+      ({ inventoryId }) => bookingsService.downloadHandoverDocument(inventoryId),
+    ),
+
     create: endpoint<
       { payload: CreateBookingPayload; documents?: BookingDocuments },
       Freight.IBooking
diff --git a/apps/edr-freight-web/portal/src/services/bookings.service.ts b/apps/edr-freight-web/portal/src/services/bookings.service.ts
index 54e710f65..f075b981c 100644
--- a/apps/edr-freight-web/portal/src/services/bookings.service.ts
+++ b/apps/edr-freight-web/portal/src/services/bookings.service.ts
@@ -79,6 +79,13 @@ export interface ApproveDeliveryResponse {
   signerDisplayName: string;
 }
 
+export interface CustomerTruckAssignmentPayload {
+  truckPlateNumber: string;
+  driverName: string;
+  truckType: string;
+  containerNumberToLoad: string;
+}
+
 export interface BookingListFilter {
   status?: string;
   /** Comma-separated statuses (overrides `status` when set). */
@@ -111,6 +118,30 @@ export const bookingsService = {
     const { data } = await client.get(`/api/bookings/${id}`);
     return data.data;
   },
+  assignCustomerTruck: async (
+    id: string,
+    payload: CustomerTruckAssignmentPayload,
+  ): Promise<Freight.IBooking> => {
+    const { data } = await client.post(
+      `/api/bookings/${id}/customer-truck-assignment`,
+      payload,
+    );
+    return data.data;
+  },
+  downloadCustomerTruckFreightOrder: async (id: string): Promise<Blob> => {
+    const { data } = await client.get(
+      `/api/bookings/${id}/customer-truck-assignment/freight-order`,
+      { responseType: "blob" },
+    );
+    return data;
+  },
+  downloadHandoverDocument: async (inventoryId: string): Promise<Blob> => {
+    const { data } = await client.get(
+      `/api/warehouse-inventory/${inventoryId}/handover-document`,
+      { responseType: "blob" },
+    );
+    return data;
+  },
   tracking: async (id: string): Promise<Freight.IBookingTracking> => {
     const { data } = await client.get(`/api/bookings/${id}/tracking`);
     return data.data;
@@ -224,6 +255,18 @@ export const bookingsService = {
     return data.data;
   },
 
+  uploadBookingClearanceDutySlip: async (
+    id: string,
+    file: File,
+  ): Promise<Freight.IBooking> => {
+    const form = new FormData();
+    form.append("file", file);
+    const { data } = await client.post(`/api/bookings/${id}/clearance/duty-slip`, form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return data.data ?? data;
+  },
+
   getContractView: async (id: string): Promise<ContractView> => {
     const { data } = await client.get(B.CONTRACT_VIEW(id));
     return data.data ?? data;
diff --git a/apps/edr-freight-web/portal/src/services/contracts.service.ts b/apps/edr-freight-web/portal/src/services/contracts.service.ts
index c6a4acbb4..b83c379a7 100644
--- a/apps/edr-freight-web/portal/src/services/contracts.service.ts
+++ b/apps/edr-freight-web/portal/src/services/contracts.service.ts
@@ -203,6 +203,13 @@ export const contractsService = {
     return data.data ?? data;
   },
 
+  downloadContractDocument: async (id: string): Promise<Blob> => {
+    const { data } = await client.get(C.CONTRACT_DOCUMENT(id), {
+      responseType: "blob",
+    });
+    return data;
+  },
+
   signContract: async (
     id: string,
     payload: SignContractPayload,
@@ -239,6 +246,36 @@ export const contractsService = {
     return data.data ?? data;
   },
 
+  uploadContractDutySlip: async (
+    id: string,
+    file: File,
+  ): Promise<Freight.IContract> => {
+    const form = new FormData();
+    form.append("file", file);
+    const { data } = await client.post(C.CLEARANCE_DUTY_SLIP(id), form, {
+      headers: { "Content-Type": "multipart/form-data" },
+    });
+    return data.data ?? data;
+  },
+
+  listBookingRequests: async (id: string): Promise<Freight.IBookingRequest[]> => {
+    const { data } = await client.get(C.BOOKING_REQUESTS(id));
+    return data.data ?? data;
+  },
+
+  submitBookingRequest: async (
+    id: string,
+    dto: Freight.CreateBookingRequestDto,
+  ): Promise<Freight.IBookingRequest> => {
+    const { data } = await client.post(C.BOOKING_REQUESTS(id), dto);
+    return data.data ?? data;
+  },
+
+  cancelBookingRequest: async (reqId: string): Promise<Freight.IBookingRequest> => {
+    const { data } = await client.post(C.BOOKING_REQUEST_CANCEL(reqId), {});
+    return data.data ?? data;
+  },
+
   // ── Booking under contract (Path A customer) ──
   createBookingUnderContract: async (
     id: string,
diff --git a/apps/edr-freight-web/portal/src/services/invoices.service.ts b/apps/edr-freight-web/portal/src/services/invoices.service.ts
index 99b1d0dee..2ee18ec4e 100644
--- a/apps/edr-freight-web/portal/src/services/invoices.service.ts
+++ b/apps/edr-freight-web/portal/src/services/invoices.service.ts
@@ -29,12 +29,39 @@ export const invoicesService = {
     return data.data ?? data;
   },
 
+  /** The customer's invoices for one source record (e.g. a booking). */
+  listForSource: async (
+    source: string,
+    sourceId: string,
+  ): Promise<PortalInvoice[]> => {
+    const { data } = await client.get(B.MY_INVOICES, {
+      params: { source, sourceId },
+    });
+    return data.data ?? data;
+  },
+
   /** One of the customer's invoices, with its line items. */
   get: async (id: string): Promise<PortalInvoiceDetail> => {
     const { data } = await client.get(B.MY_INVOICE_BY_ID(id));
     return data.data ?? data;
   },
 
+  /** The sealed invoice PDF for one of the customer's invoices. */
+  downloadDocument: async (id: string): Promise<Blob> => {
+    const { data } = await client.get(B.MY_INVOICE_DOCUMENT(id), {
+      responseType: "blob",
+    });
+    return data;
+  },
+
+  /** The sealed payment-receipt PDF (available once paid). */
+  downloadReceipt: async (id: string): Promise<Blob> => {
+    const { data } = await client.get(B.MY_INVOICE_RECEIPT(id), {
+      responseType: "blob",
+    });
+    return data;
+  },
+
   /** Initiate gateway payment for an open invoice; returns the client action. */
   pay: async (
     id: string,
diff --git a/apps/edr-freight-web/portal/src/services/payments.service.ts b/apps/edr-freight-web/portal/src/services/payments.service.ts
index 119aea4ed..c62e31108 100644
--- a/apps/edr-freight-web/portal/src/services/payments.service.ts
+++ b/apps/edr-freight-web/portal/src/services/payments.service.ts
@@ -17,7 +17,7 @@ export type PaymentMethod =
 export type PaymentPlatform = "web" | "mobile";
 
 export interface InitiatePaymentPayload {
-  bookingId: string;
+  invoiceId: string;
   method: PaymentMethod;
   platform?: PaymentPlatform;
   payerAccount?: string;
@@ -67,6 +67,25 @@ function buildCheckoutUrl(payload: {
   return `${base}${P.CHECKOUT}?${params.toString()}`;
 }
 
+/**
+ * Checkout fallback keyed by invoice id — matches `GET /payments/checkout`,
+ * which reads `invoiceId` (billing is invoice-centric; there is no
+ * `bookingId` param on that route).
+ */
+function buildCheckoutUrlForInvoice(payload: {
+  invoiceId: string;
+  method: PaymentMethod;
+  platform?: PaymentPlatform;
+}): string {
+  const base = API_BASE_URL.replace(/\/$/, "");
+  const params = new URLSearchParams({
+    invoiceId: payload.invoiceId,
+    method: payload.method,
+    platform: payload.platform ?? "web",
+  });
+  return `${base}${P.CHECKOUT}?${params.toString()}`;
+}
+
 export const paymentsService = {
   initiate: async (
     payload: InitiatePaymentPayload,
@@ -84,4 +103,5 @@ export const paymentsService = {
   },
 
   checkoutUrl: buildCheckoutUrl,
+  checkoutUrlForInvoice: buildCheckoutUrlForInvoice,
 };
diff --git a/apps/edr-freight-web/portal/src/services/warehouse-invoices.service.ts b/apps/edr-freight-web/portal/src/services/warehouse-invoices.service.ts
new file mode 100644
index 000000000..f1fa4e841
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/services/warehouse-invoices.service.ts
@@ -0,0 +1,54 @@
+import { URL_CONSTANTS } from "@/constants/URLS";
+import { client } from "../utils/api";
+
+const W = URL_CONSTANTS.WAREHOUSE_INVOICES;
+
+/**
+ * A warehouse fee invoice as the freight API projects it for the customer
+ * (the historical `WarehouseFeeInvoice` view shape — a subset is used here).
+ */
+export interface PortalWarehouseInvoice {
+  id: string;
+  invoiceNumber: string;
+  invoiceType: string;
+  status: string;
+  currency: string;
+  totalAmount: number | string;
+  paidAmount: number | string;
+  balanceAmount: number | string;
+  issuedAt?: string | null;
+  dueDate?: string | null;
+  paidAt?: string | null;
+  bookingId?: string | null;
+  inventoryId?: string | null;
+  bookingReference?: string | null;
+  inventoryReference?: string | null;
+  cargoDescription?: string | null;
+  containerNumber?: string | null;
+}
+
+export const warehouseInvoicesService = {
+  /** Warehouse fee invoices linked to a booking (via its inventory items). */
+  listForBooking: async (bookingId: string): Promise<PortalWarehouseInvoice[]> => {
+    const { data } = await client.get(W.FOR_BOOKING(bookingId));
+    return data.data ?? data;
+  },
+
+  /** A single warehouse fee invoice (carries `bookingId` for source linking). */
+  get: async (id: string): Promise<PortalWarehouseInvoice> => {
+    const { data } = await client.get(W.BY_ID(id));
+    return data.data ?? data;
+  },
+
+  /** The sealed warehouse fee invoice PDF. */
+  downloadDocument: async (id: string): Promise<Blob> => {
+    const { data } = await client.get(W.DOCUMENT(id), { responseType: "blob" });
+    return data;
+  },
+
+  /** The sealed warehouse fee payment receipt PDF (available once paid). */
+  downloadReceipt: async (id: string): Promise<Blob> => {
+    const { data } = await client.get(W.RECEIPT(id), { responseType: "blob" });
+    return data;
+  },
+};
diff --git a/apps/edr-freight-web/portal/src/utils/download.ts b/apps/edr-freight-web/portal/src/utils/download.ts
new file mode 100644
index 000000000..594513566
--- /dev/null
+++ b/apps/edr-freight-web/portal/src/utils/download.ts
@@ -0,0 +1,11 @@
+/** Trigger a browser download of a Blob under `filename`. */
+export function saveBlob(blob: Blob, filename: string): void {
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = filename;
+  document.body.appendChild(a);
+  a.click();
+  a.remove();
+  URL.revokeObjectURL(url);
+}
diff --git a/apps/edr-passenger-api/.env.example b/apps/edr-passenger-api/.env.example
index 328023c28..aaed09659 100644
--- a/apps/edr-passenger-api/.env.example
+++ b/apps/edr-passenger-api/.env.example
@@ -43,6 +43,13 @@ JWT_ACCESS_TOKEN_EXPIRES=1h
 JWT_REFRESH_TOKEN_SECRET=<change-me-min-32-chars>
 JWT_REFRESH_TOKEN_EXPIRES=7d
 
+# @tria-plc IAM forgot-password flow — the reset link sent via SMS is
+# ${FE_BASE_URL}/reset-password?email=..&userId=..&verificationCode=..
+# Point at the backoffice web app. Without it the link starts with "undefined/".
+FE_BASE_URL=http://localhost:5184
+# OTP/reset-link TTL in minutes (IAM default: 30)
+INVITATION_EXPIRY_DATE=30
+
 # SendGrid
 SENDGRID_API_KEY=
 SENDGRID_FROM_EMAIL=noreply@edr-platform.com
@@ -151,7 +158,10 @@ FAYDA_TOKEN_ENDPOINT=
 FAYDA_USERINFO_ENDPOINT=
 # Base64 of the RSA private JWK (JSON). Secret — never commit a real value.
 FAYDA_PRIVATE_KEY_BASE64=
+# OAuth redirect_uri passed to eSignet for MOBILE clients (the app calls /complete directly).
 FAYDA_REDIRECT_URI=
+# OAuth redirect_uri passed to eSignet for WEB clients. Defaults to FAYDA_REDIRECT_URI when unset.
+FAYDA_WEB_REDIRECT_URI=
 # Optional (defaults shown)
 FAYDA_SCOPE=openid profile email
 FAYDA_ACR_VALUES=mosip:idp:acr:generated-code
@@ -160,6 +170,15 @@ FAYDA_SESSION_TTL_MINUTES=10
 
 GITHUB_PACKAGE_TOKEN=<your-github-packages-token>
 
+# --- Seeding -----------------------------------------------------------------
+# Set both to true on first run (or when resetting) to seed org, roles, and
+# default backoffice staff users. Safe to leave true — all operations are idempotent.
+# Login endpoint for backoffice users: POST /v1/auth/login
+SEED_EDR_PASSENGER_ORG=false
+SEED_PASSENGER_STAFF=false
+# Plain-text password set on seeded staff accounts. Defaults to '12345678' if unset.
+DEFAULT_PASSWORD=Admin@1234
+
 # --- Notification broker (RabbitMQ) -----------------------------------------------------------------
 # Set RABBITMQ_ENABLED=false to skip connection entirely (dev without a local broker).
 RABBITMQ_ENABLED=false
diff --git a/apps/edr-passenger-api/src/seed/edr-passenger-org.seeder.ts b/apps/edr-passenger-api/src/seed/edr-passenger-org.seeder.ts
index 1bade05ae..5cc4e8878 100644
--- a/apps/edr-passenger-api/src/seed/edr-passenger-org.seeder.ts
+++ b/apps/edr-passenger-api/src/seed/edr-passenger-org.seeder.ts
@@ -42,6 +42,7 @@ export class EdrPassengerOrgSeeder {
       await this.ensureRoles(manager, EDR_PASSENGER_ROLES);
       await this.ensureRolePermissions(manager, EDR_PASSENGER_ROLES);
       await this.ensureSuperAdminPermissions(manager);
+      await this.ensurePositions(manager, organization.id);
     });
 
     this.logger.log(`Ensured EDR passenger organization seed for '${EDR_ORG_KEY}'`);
@@ -122,21 +123,51 @@ export class EdrPassengerOrgSeeder {
     const roleByKey = new Map(roles.map((r) => [r.key, r]));
     const permByKey = new Map(permissions.map((p) => [p.key, p]));
 
-    const links = seedRoles.flatMap((seedRole) => {
+    let totalUpserted = 0;
+    let totalPruned = 0;
+
+    for (const seedRole of seedRoles) {
       const role = roleByKey.get(seedRole.key);
       if (!role) throw new Error(`missing_role:${seedRole.key}`);
 
-      return seedRole.permissionKeys.map((key) => {
-        const perm = permByKey.get(key);
-        if (!perm) throw new Error(`missing_permission:${key}`);
-        return { roleId: role.id, permissionId: perm.id };
-      });
-    });
+      const desiredPermissionIds = new Set(
+        seedRole.permissionKeys.map((key) => {
+          const perm = permByKey.get(key);
+          if (!perm) throw new Error(`missing_permission:${key}`);
+          return perm.id as string;
+        }),
+      );
 
-    await manager.getRepository(RolePermission).upsert(links, {
-      conflictPaths: { roleId: true, permissionId: true },
-    });
-    this.logger.log(`Ensured ${links.length} passenger role-permission links`);
+      // Remove links that are no longer in this role's preset
+      const existing = await manager.getRepository(RolePermission).find({
+        where: { roleId: role.id as string },
+        select: { permissionId: true },
+      });
+      const toRemove = existing
+        .map((rp) => rp.permissionId as string)
+        .filter((permId) => !desiredPermissionIds.has(permId));
+
+      if (toRemove.length > 0) {
+        await manager.getRepository(RolePermission).delete(
+          toRemove.map((permissionId) => ({ roleId: role.id as string, permissionId })),
+        );
+        totalPruned += toRemove.length;
+      }
+
+      // Upsert the full desired set
+      const links = [...desiredPermissionIds].map((permissionId) => ({
+        roleId: role.id as string,
+        permissionId,
+      }));
+      await manager.getRepository(RolePermission).upsert(links, {
+        conflictPaths: { roleId: true, permissionId: true },
+      });
+      totalUpserted += links.length;
+    }
+
+    this.logger.log(
+      `Synced passenger role-permission links: ${totalUpserted} upserted, ${totalPruned} pruned`,
+    );
   }
 
   private async ensureSuperAdminPermissions(manager: EntityManager) {
@@ -163,4 +194,34 @@ export class EdrPassengerOrgSeeder {
     );
     this.logger.log(`Ensured ${permissions.length} passenger permissions on super_admin`);
   }
+
+  private async ensurePositions(manager: EntityManager, organizationId: string) {
+    const positions = [
+      { key: 'edr_passenger_director',           name: { en: 'Director',                 am: 'ዳይሬክተር' },              rank: 1 },
+      { key: 'edr_passenger_finance_manager',    name: { en: 'Finance Manager',          am: 'የፋይናንስ ሥራ አስኪያጅ' },    rank: 2 },
+      { key: 'edr_passenger_finance_officer',    name: { en: 'Finance Officer',          am: 'የፋይናንስ ኦፊሰር' },        rank: 3 },
+      { key: 'edr_passenger_team_leader',        name: { en: 'Team Leader',              am: 'ቡድን መሪ' },              rank: 4 },
+      { key: 'edr_passenger_station_master',     name: { en: 'Station Master',           am: 'ጣቢያ ሃላፊ' },            rank: 5 },
+      { key: 'edr_passenger_station_supervisor', name: { en: 'Station Supervisor',       am: 'ጣቢያ ተቆጣጣሪ' },          rank: 6 },
+      { key: 'edr_passenger_ticket_officer',     name: { en: 'Passenger Ticket Officer', am: 'የተሳፋሪ ቲኬት ኦፊሰር' },     rank: 7 },
+      { key: 'edr_passenger_operational_staff',  name: { en: 'Operational Staff',        am: 'ስራ ሰራተኛ' },            rank: 8 },
+    ];
+
+    let created = 0;
+    for (const pos of positions) {
+      const existing = await manager.query<Array<{ id: string }>>(
+        `SELECT id FROM iam.positions WHERE key = $1 AND organization_id = $2 LIMIT 1`,
+        [pos.key, organizationId],
+      );
+      if (existing.length === 0) {
+        await manager.query(
+          `INSERT INTO iam.positions (id, name, key, rank, organization_id, unit_id, position_type_id, created_at, updated_at)
+           VALUES (gen_random_uuid(), $1::jsonb, $2, $3, $4::uuid, NULL, NULL, NOW(), NOW())`,
+          [JSON.stringify(pos.name), pos.key, pos.rank, organizationId],
+        );
+        created++;
+      }
+    }
+    this.logger.log(`Ensured ${positions.length} passenger positions (${created} newly created)`);
+  }
 }
diff --git a/apps/edr-passenger-api/src/seed/edr-passenger.seed.ts b/apps/edr-passenger-api/src/seed/edr-passenger.seed.ts
index cd178139a..578cf66ff 100644
--- a/apps/edr-passenger-api/src/seed/edr-passenger.seed.ts
+++ b/apps/edr-passenger-api/src/seed/edr-passenger.seed.ts
@@ -30,15 +30,25 @@ export const EDR_PASSENGER_ROLES: PassengerSeedRole[] = [
     permissionKeys: [...ROLE_PERMISSION_PRESETS.backofficeAdmin],
   },
   {
-    key: 'edr_passenger_backoffice_staff',
-    name: { en: 'EDR Passenger Backoffice Staff' },
-    permissionKeys: [...ROLE_PERMISSION_PRESETS.backofficeStaff],
+    key: 'edr_passenger_station_master',
+    name: { en: 'EDR Passenger Station Master' },
+    permissionKeys: [...ROLE_PERMISSION_PRESETS.stationMaster],
+  },
+  {
+    key: 'edr_passenger_ticket_officer',
+    name: { en: 'EDR Passenger Ticket Officer' },
+    permissionKeys: [...ROLE_PERMISSION_PRESETS.ticketOfficer],
   },
   {
     key: 'edr_passenger_agent',
     name: { en: 'EDR Passenger Agent' },
     permissionKeys: [...ROLE_PERMISSION_PRESETS.agent],
   },
+  {
+    key: 'edr_passenger_backoffice_staff',
+    name: { en: 'EDR Passenger Backoffice Staff' },
+    permissionKeys: [...ROLE_PERMISSION_PRESETS.backofficeStaff],
+  },
   {
     key: 'edr_passenger_finance',
     name: { en: 'EDR Passenger Finance' },
diff --git a/apps/edr-passenger-api/src/seed/passenger-permissions.registry.ts b/apps/edr-passenger-api/src/seed/passenger-permissions.registry.ts
index d6a804b3a..bab7787b9 100644
--- a/apps/edr-passenger-api/src/seed/passenger-permissions.registry.ts
+++ b/apps/edr-passenger-api/src/seed/passenger-permissions.registry.ts
@@ -87,29 +87,42 @@ export const PASSENGER_PERMS = {
 export const ROLE_PERMISSION_PRESETS = {
   backofficeAdmin: [...PASSENGER_PERMISSION_KEYS],
 
-  backofficeStaff: [
+  stationMaster: [
     PASSENGER_PERMS.bookings.view,
     PASSENGER_PERMS.bookings.manage,
-    PASSENGER_PERMS.bookings.cancel,
-    PASSENGER_PERMS.passengers.view,
-    PASSENGER_PERMS.passengers.manage,
     PASSENGER_PERMS.tickets.view,
     PASSENGER_PERMS.tickets.manage,
-    PASSENGER_PERMS.payments.viewAll,
-    PASSENGER_PERMS.reports.view,
-    PASSENGER_PERMS.dashboard.view,
-    PASSENGER_PERMS.notifications.send,
+    PASSENGER_PERMS.passengers.view,
     PASSENGER_PERMS.agents.view,
-    PASSENGER_PERMS.fraud.view,
     PASSENGER_PERMS.audit.view,
+    PASSENGER_PERMS.notifications.send,
+    PASSENGER_PERMS.dashboard.view,
+  ],
+
+  ticketOfficer: [
+    PASSENGER_PERMS.tickets.view,
+    PASSENGER_PERMS.tickets.manage,
+    PASSENGER_PERMS.bookings.view,
+    PASSENGER_PERMS.passengers.view,
+    PASSENGER_PERMS.dashboard.view,
   ],
 
   agent: [
     PASSENGER_PERMS.bookings.view,
     PASSENGER_PERMS.bookings.manage,
+    PASSENGER_PERMS.bookings.cancel,
     PASSENGER_PERMS.passengers.view,
     PASSENGER_PERMS.tickets.view,
+    PASSENGER_PERMS.tickets.manage,
     PASSENGER_PERMS.payments.refund,
+    PASSENGER_PERMS.dashboard.view,
+  ],
+
+  backofficeStaff: [
+    PASSENGER_PERMS.bookings.view,
+    PASSENGER_PERMS.passengers.view,
+    PASSENGER_PERMS.tickets.view,
+    PASSENGER_PERMS.dashboard.view,
   ],
 
   finance: [
diff --git a/apps/edr-passenger-web/backoffice/src/app/login/page.tsx b/apps/edr-passenger-web/backoffice/src/app/login/page.tsx
index b2c90d275..f104db3da 100644
--- a/apps/edr-passenger-web/backoffice/src/app/login/page.tsx
+++ b/apps/edr-passenger-web/backoffice/src/app/login/page.tsx
@@ -5,9 +5,10 @@ import { useRouter } from 'next/navigation';
 import { useAuthStore } from '@/lib/auth-store';
 import { useTheme } from '@/lib/theme-store';
 import {
-  Eye, EyeOff, Sun, Moon, ArrowRight, Loader2,
-  TicketCheck, Users, TrendingUp, ShieldCheck,
+  Eye, EyeOff, Sun, Moon, ArrowRight, ArrowLeft, Loader2,
+  TicketCheck, Users, TrendingUp, ShieldCheck, MailCheck,
 } from 'lucide-react';
+import { iamAuthApi } from '@/lib/api/auth';
 
 const EDR_GREEN = 'rgb(20, 113, 76)';
 
@@ -28,6 +29,13 @@ export default function LoginPage() {
   const [emailFocused, setEmailFocused]       = useState(false);
   const [passwordFocused, setPasswordFocused] = useState(false);
 
+  const [view, setView]                   = useState<'login' | 'forgot'>('login');
+  const [forgotEmail, setForgotEmail]     = useState('');
+  const [forgotLoading, setForgotLoading] = useState(false);
+  const [forgotError, setForgotError]     = useState('');
+  const [forgotSent, setForgotSent]       = useState(false);
+  const [forgotFocused, setForgotFocused] = useState(false);
+
   const router         = useRouter();
   const { login }      = useAuthStore();
   const { isDark, toggleTheme } = useTheme();
@@ -53,6 +61,31 @@ export default function LoginPage() {
     }
   };
 
+  const handleForgotSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setForgotLoading(true);
+    setForgotError('');
+    try {
+      await iamAuthApi.forgotPassword(forgotEmail);
+      setForgotSent(true);
+    } catch (err: any) {
+      const msg = err.response?.data?.message || err.message || '';
+      setForgotError(
+        msg === 'user_not_found'
+          ? 'No account found with that email address.'
+          : msg || 'Failed to send the reset link. Please try again.'
+      );
+    } finally {
+      setForgotLoading(false);
+    }
+  };
+
+  const backToLogin = () => {
+    setView('login');
+    setForgotError('');
+    setForgotSent(false);
+  };
+
   if (!isMounted) return null;
 
   return (
@@ -94,6 +127,8 @@ export default function LoginPage() {
         {/* Form area */}
         <div className="flex-1 flex items-center justify-center px-8 py-10 lg:px-10 xl:px-14">
           <div className="w-full max-w-xs">
+            {view === 'login' ? (
+            <>
 
             {/* Heading */}
             <div className="mb-8 animate-fade-up" style={{ animationDelay: '0ms' }}>
@@ -171,6 +206,15 @@ export default function LoginPage() {
                     {showPassword ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
                   </button>
                 </div>
+                <div className="flex justify-end mt-2">
+                  <button
+                    type="button"
+                    onClick={() => { setView('forgot'); setForgotEmail(email); setError(''); }}
+                    className="text-xs font-medium text-[rgb(20,113,76)] hover:underline"
+                  >
+                    Forgot password?
+                  </button>
+                </div>
               </div>
 
               {/* Submit */}
@@ -206,6 +250,112 @@ export default function LoginPage() {
                 </p>
               </div>
             </div>
+            </>
+            ) : (
+            <>
+
+            {/* Heading */}
+            <div className="mb-8 animate-fade-up" style={{ animationDelay: '0ms' }}>
+              <h2 className="text-2xl font-bold text-gray-900 dark:text-white tracking-tight">
+                Reset your password
+              </h2>
+              <p className="text-sm text-gray-500 dark:text-gray-400 mt-1">
+                Enter your email address and we&apos;ll send a reset link to the phone number on your account.
+              </p>
+            </div>
+
+            {forgotSent ? (
+              <div className="space-y-5 animate-fade-up">
+                <div className="flex items-start gap-3 rounded-xl bg-emerald-50 dark:bg-emerald-950/40 border border-emerald-200 dark:border-emerald-900/60 px-4 py-3">
+                  <MailCheck className="w-4 h-4 mt-0.5 text-emerald-600 dark:text-emerald-400 flex-shrink-0" />
+                  <p className="text-sm text-emerald-700 dark:text-emerald-300">
+                    A password reset link has been sent via SMS. Open it to set a new password — the link expires in 30 minutes.
+                  </p>
+                </div>
+                <button
+                  type="button"
+                  onClick={backToLogin}
+                  className="w-full flex items-center justify-center gap-2 py-3 px-4 rounded-xl font-semibold text-sm text-white transition-all duration-200"
+                  style={{ background: `linear-gradient(135deg, rgb(20,113,76) 0%, rgb(16,143,96) 100%)` }}
+                >
+                  <ArrowLeft className="w-4 h-4" />
+                  Back to sign in
+                </button>
+              </div>
+            ) : (
+              <>
+                {/* Error */}
+                {forgotError && (<div className="animate-fade-up" style={{ animationDelay: '60ms' }}>
+                  <div className="mb-5 flex items-start gap-3 rounded-xl bg-red-50 dark:bg-red-950/40 border border-red-200 dark:border-red-900/60 px-4 py-3">
+                    <div className="flex-shrink-0 mt-0.5 w-4 h-4 rounded-full bg-red-500 flex items-center justify-center">
+                      <span className="text-white text-[10px] font-bold">!</span>
+                    </div>
+                    <p className="text-sm text-red-700 dark:text-red-300">{forgotError}</p>
+                  </div></div>
+                )}
+
+                <form onSubmit={handleForgotSubmit} className="space-y-4 animate-fade-up" style={{ animationDelay: '80ms' }}>
+                  {/* Email field */}
+                  <div>
+                    <label className="block text-xs font-semibold text-gray-600 dark:text-gray-400 uppercase tracking-wider mb-2">
+                      Email address
+                    </label>
+                    <div className={`relative rounded-xl transition-all duration-200 ${
+                      forgotFocused
+                        ? 'ring-2 ring-[rgb(20,113,76)] ring-offset-0'
+                        : 'ring-1 ring-gray-200 dark:ring-gray-800'
+                    }`}>
+                      <input
+                        type="email"
+                        value={forgotEmail}
+                        onChange={(e) => { setForgotEmail(e.target.value); setForgotError(''); }}
+                        onFocus={() => setForgotFocused(true)}
+                        onBlur={() => setForgotFocused(false)}
+                        className="w-full px-4 py-3 rounded-xl bg-white dark:bg-gray-900 text-gray-900 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-600 text-sm focus:outline-none"
+                        placeholder="name@edr.com"
+                        required
+                        autoComplete="email"
+                      />
+                    </div>
+                  </div>
+
+                  {/* Submit */}
+                  <button
+                    type="submit"
+                    disabled={forgotLoading || !forgotEmail}
+                    className="group w-full mt-2 flex items-center justify-center gap-2 py-3 px-4 rounded-xl font-semibold text-sm text-white transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed"
+                    style={{ background: forgotLoading || !forgotEmail
+                      ? 'rgb(20,113,76)'
+                      : `linear-gradient(135deg, rgb(20,113,76) 0%, rgb(16,143,96) 100%)`
+                    }}
+                  >
+                    {forgotLoading ? (
+                      <>
+                        <Loader2 className="w-4 h-4 animate-spin" />
+                        Sending…
+                      </>
+                    ) : (
+                      <>
+                        Send reset link
+                        <ArrowRight className="w-4 h-4 transition-transform duration-200 group-hover:translate-x-0.5" />
+                      </>
+                    )}
+                  </button>
+                </form>
+
+                <button
+                  type="button"
+                  onClick={backToLogin}
+                  className="mt-6 flex items-center gap-1.5 text-sm text-gray-500 dark:text-gray-400 hover:text-[rgb(20,113,76)] transition-colors animate-fade-up"
+                  style={{ animationDelay: '120ms' }}
+                >
+                  <ArrowLeft className="w-4 h-4" />
+                  Back to sign in
+                </button>
+              </>
+            )}
+            </>
+            )}
           </div>
         </div>
 
diff --git a/apps/edr-passenger-web/backoffice/src/app/providers.tsx b/apps/edr-passenger-web/backoffice/src/app/providers.tsx
index 663a52e05..5130e8ec4 100644
--- a/apps/edr-passenger-web/backoffice/src/app/providers.tsx
+++ b/apps/edr-passenger-web/backoffice/src/app/providers.tsx
@@ -1,15 +1,15 @@
-'use client';
+"use client";
 
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { useState, useEffect } from 'react';
-import { useTheme } from '@/lib/theme-store';
-import { useAuthStore } from '@/lib/auth-store';
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { useState, useEffect } from "react";
+import { useTheme } from "@/lib/theme-store";
+import { useAuthStore } from "@/lib/auth-store";
 
 function ThemeProvider({ children }: { children: React.ReactNode }) {
   const { isDark, setTheme } = useTheme();
 
   useEffect(() => {
-    document.documentElement.classList.toggle('dark', isDark);
+    document.documentElement.classList.toggle("dark", isDark);
   }, [isDark]);
 
   return <>{children}</>;
@@ -26,14 +26,16 @@ function AuthProvider({ children }: { children: React.ReactNode }) {
 }
 
 export default function Providers({ children }: { children: React.ReactNode }) {
-  const [queryClient] = useState(() => new QueryClient({
-    defaultOptions: {
-      queries: {
-        staleTime: 60 * 1000,
-        refetchOnWindowFocus: false,
-      },
-    },
-  }));
+  const [queryClient] = useState(
+    () =>
+      new QueryClient({
+        defaultOptions: {
+          queries: {
+            staleTime: 60 * 1000,
+          },
+        },
+      }),
+  );
 
   return (
     <QueryClientProvider client={queryClient}>
diff --git a/apps/edr-passenger-web/backoffice/src/app/reset-password/page.tsx b/apps/edr-passenger-web/backoffice/src/app/reset-password/page.tsx
new file mode 100644
index 000000000..62e81322c
--- /dev/null
+++ b/apps/edr-passenger-web/backoffice/src/app/reset-password/page.tsx
@@ -0,0 +1,228 @@
+'use client';
+
+import { Suspense, useState } from 'react';
+import { useRouter, useSearchParams } from 'next/navigation';
+import Link from 'next/link';
+import { Eye, EyeOff, ArrowRight, ArrowLeft, Loader2, CheckCircle2 } from 'lucide-react';
+import { iamAuthApi } from '@/lib/api/auth';
+
+function ResetPasswordForm() {
+  const router = useRouter();
+  const searchParams = useSearchParams();
+
+  const email = searchParams.get('email') || '';
+  const userId = searchParams.get('userId') || '';
+  const verificationCode = searchParams.get('verificationCode') || '';
+  const linkValid = Boolean(email && userId && verificationCode);
+
+  const [newPassword, setNewPassword]         = useState('');
+  const [confirmPassword, setConfirmPassword] = useState('');
+  const [showPassword, setShowPassword]       = useState(false);
+  const [loading, setLoading]                 = useState(false);
+  const [error, setError]                     = useState('');
+  const [success, setSuccess]                 = useState(false);
+  const [newFocused, setNewFocused]           = useState(false);
+  const [confirmFocused, setConfirmFocused]   = useState(false);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setError('');
+    if (newPassword.length < 6) {
+      setError('Password must be at least 6 characters.');
+      return;
+    }
+    if (newPassword !== confirmPassword) {
+      setError('Passwords do not match.');
+      return;
+    }
+    setLoading(true);
+    try {
+      await iamAuthApi.resetPassword({ userId, email, verificationCode, newPassword, confirmPassword });
+      setSuccess(true);
+      setTimeout(() => router.push('/login'), 2000);
+    } catch (err: any) {
+      const msg = err.response?.data?.message || err.message || '';
+      setError(msg || 'Failed to reset password. The link may have expired — request a new one from the sign-in page.');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-gray-50 dark:bg-gray-950 px-8 py-10">
+      <div className="w-full max-w-xs">
+
+        {/* Logo */}
+        <div className="flex items-center gap-2.5 mb-10">
+          <div className="w-8 h-8 rounded-lg bg-[rgb(20,113,76)] flex items-center justify-center shadow-md shadow-[rgb(20,113,76)]/30">
+            <svg className="w-4 h-4 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
+              <path strokeLinecap="round" strokeLinejoin="round" d="M12 2C8 2 5 5 5 8v8l2 2h10l2-2V8c0-3-3-6-7-6z" />
+              <path strokeLinecap="round" strokeLinejoin="round" d="M8 17v2M16 17v2M5 12h14" />
+              <circle cx="9" cy="9" r="1" fill="currentColor" />
+              <circle cx="15" cy="9" r="1" fill="currentColor" />
+            </svg>
+          </div>
+          <div>
+            <div className="text-xs font-bold text-gray-900 dark:text-white tracking-wide leading-none">ETHIO-DJIBOUTI</div>
+            <div className="text-[12px] text-gray-400 dark:text-gray-500 tracking-widest uppercase leading-none mt-0.5">Railway</div>
+          </div>
+        </div>
+
+        {!linkValid ? (
+          <div className="animate-fade-up">
+            <h2 className="text-2xl font-bold text-gray-900 dark:text-white tracking-tight">
+              Invalid reset link
+            </h2>
+            <p className="text-sm text-gray-500 dark:text-gray-400 mt-2">
+              This password reset link is invalid or incomplete. Request a new one from the sign-in page.
+            </p>
+            <Link
+              href="/login"
+              className="mt-6 inline-flex items-center gap-1.5 text-sm font-medium text-[rgb(20,113,76)] hover:underline"
+            >
+              <ArrowLeft className="w-4 h-4" />
+              Back to sign in
+            </Link>
+          </div>
+        ) : success ? (
+          <div className="animate-fade-up">
+            <div className="flex items-start gap-3 rounded-xl bg-emerald-50 dark:bg-emerald-950/40 border border-emerald-200 dark:border-emerald-900/60 px-4 py-3">
+              <CheckCircle2 className="w-4 h-4 mt-0.5 text-emerald-600 dark:text-emerald-400 flex-shrink-0" />
+              <p className="text-sm text-emerald-700 dark:text-emerald-300">
+                Password reset successfully. Redirecting to sign in…
+              </p>
+            </div>
+            <Link
+              href="/login"
+              className="mt-6 inline-flex items-center gap-1.5 text-sm font-medium text-[rgb(20,113,76)] hover:underline"
+            >
+              Go to sign in
+              <ArrowRight className="w-4 h-4" />
+            </Link>
+          </div>
+        ) : (
+          <>
+            {/* Heading */}
+            <div className="mb-8 animate-fade-up">
+              <h2 className="text-2xl font-bold text-gray-900 dark:text-white tracking-tight">
+                Set a new password
+              </h2>
+              <p className="text-sm text-gray-500 dark:text-gray-400 mt-1">
+                Choose a new password for <span className="font-medium text-gray-700 dark:text-gray-300">{email}</span>.
+              </p>
+            </div>
+
+            {/* Error */}
+            {error && (
+              <div className="mb-5 flex items-start gap-3 rounded-xl bg-red-50 dark:bg-red-950/40 border border-red-200 dark:border-red-900/60 px-4 py-3 animate-fade-up">
+                <div className="flex-shrink-0 mt-0.5 w-4 h-4 rounded-full bg-red-500 flex items-center justify-center">
+                  <span className="text-white text-[10px] font-bold">!</span>
+                </div>
+                <p className="text-sm text-red-700 dark:text-red-300">{error}</p>
+              </div>
+            )}
+
+            <form onSubmit={handleSubmit} className="space-y-4 animate-fade-up">
+              {/* New password */}
+              <div>
+                <label className="block text-xs font-semibold text-gray-600 dark:text-gray-400 uppercase tracking-wider mb-2">
+                  New password
+                </label>
+                <div className={`relative rounded-xl transition-all duration-200 ${
+                  newFocused
+                    ? 'ring-2 ring-[rgb(20,113,76)] ring-offset-0'
+                    : 'ring-1 ring-gray-200 dark:ring-gray-800'
+                }`}>
+                  <input
+                    type={showPassword ? 'text' : 'password'}
+                    value={newPassword}
+                    onChange={(e) => { setNewPassword(e.target.value); setError(''); }}
+                    onFocus={() => setNewFocused(true)}
+                    onBlur={() => setNewFocused(false)}
+                    className="w-full px-4 py-3 pr-11 rounded-xl bg-white dark:bg-gray-900 text-gray-900 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-600 text-sm focus:outline-none"
+                    placeholder="••••••••••"
+                    required
+                    minLength={6}
+                    autoComplete="new-password"
+                  />
+                  <button
+                    type="button"
+                    onClick={() => setShowPassword(!showPassword)}
+                    className="absolute right-3 top-1/2 -translate-y-1/2 w-7 h-7 flex items-center justify-center rounded-lg text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-all"
+                    aria-label="Toggle password visibility"
+                  >
+                    {showPassword ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
+                  </button>
+                </div>
+              </div>
+
+              {/* Confirm password */}
+              <div>
+                <label className="block text-xs font-semibold text-gray-600 dark:text-gray-400 uppercase tracking-wider mb-2">
+                  Confirm new password
+                </label>
+                <div className={`relative rounded-xl transition-all duration-200 ${
+                  confirmFocused
+                    ? 'ring-2 ring-[rgb(20,113,76)] ring-offset-0'
+                    : 'ring-1 ring-gray-200 dark:ring-gray-800'
+                }`}>
+                  <input
+                    type={showPassword ? 'text' : 'password'}
+                    value={confirmPassword}
+                    onChange={(e) => { setConfirmPassword(e.target.value); setError(''); }}
+                    onFocus={() => setConfirmFocused(true)}
+                    onBlur={() => setConfirmFocused(false)}
+                    className="w-full px-4 py-3 rounded-xl bg-white dark:bg-gray-900 text-gray-900 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-600 text-sm focus:outline-none"
+                    placeholder="••••••••••"
+                    required
+                    minLength={6}
+                    autoComplete="new-password"
+                  />
+                </div>
+              </div>
+
+              {/* Submit */}
+              <button
+                type="submit"
+                disabled={loading || !newPassword || !confirmPassword}
+                className="group w-full mt-2 flex items-center justify-center gap-2 py-3 px-4 rounded-xl font-semibold text-sm text-white transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed"
+                style={{ background: loading || !newPassword || !confirmPassword
+                  ? 'rgb(20,113,76)'
+                  : `linear-gradient(135deg, rgb(20,113,76) 0%, rgb(16,143,96) 100%)`
+                }}
+              >
+                {loading ? (
+                  <>
+                    <Loader2 className="w-4 h-4 animate-spin" />
+                    Resetting…
+                  </>
+                ) : (
+                  <>
+                    Reset password
+                    <ArrowRight className="w-4 h-4 transition-transform duration-200 group-hover:translate-x-0.5" />
+                  </>
+                )}
+              </button>
+            </form>
+
+            <Link
+              href="/login"
+              className="mt-6 inline-flex items-center gap-1.5 text-sm text-gray-500 dark:text-gray-400 hover:text-[rgb(20,113,76)] transition-colors animate-fade-up"
+            >
+              <ArrowLeft className="w-4 h-4" />
+              Back to sign in
+            </Link>
+          </>
+        )}
+      </div>
+    </div>
+  );
+}
+
+export default function ResetPasswordPage() {
+  return (
+    <Suspense fallback={null}>
+      <ResetPasswordForm />
+    </Suspense>
+  );
+}
diff --git a/apps/edr-passenger-web/backoffice/src/components/layout/ChangePasswordModal.tsx b/apps/edr-passenger-web/backoffice/src/components/layout/ChangePasswordModal.tsx
new file mode 100644
index 000000000..5641643fd
--- /dev/null
+++ b/apps/edr-passenger-web/backoffice/src/components/layout/ChangePasswordModal.tsx
@@ -0,0 +1,141 @@
+'use client';
+
+import { useState } from 'react';
+import { useMutation } from '@tanstack/react-query';
+import { CheckCircle2 } from 'lucide-react';
+import Modal from '@/components/ui/Modal';
+import ActionButton from '@/components/ui/ActionButton';
+import { iamAuthApi } from '@/lib/api/auth';
+
+interface ChangePasswordModalProps {
+  isOpen: boolean;
+  onClose: () => void;
+}
+
+export default function ChangePasswordModal({ isOpen, onClose }: ChangePasswordModalProps) {
+  const [oldPassword, setOldPassword]         = useState('');
+  const [newPassword, setNewPassword]         = useState('');
+  const [confirmPassword, setConfirmPassword] = useState('');
+  const [error, setError]                     = useState('');
+  const [success, setSuccess]                 = useState(false);
+
+  const changePasswordMutation = useMutation({
+    mutationFn: () => iamAuthApi.changePassword({ oldPassword, newPassword, confirmPassword }),
+    onSuccess: () => {
+      setSuccess(true);
+      setTimeout(() => handleClose(), 1500);
+    },
+    onError: (err: any) => {
+      const msg = err.response?.data?.message || '';
+      if (err.response?.status === 401) {
+        setError('Current password is incorrect.');
+      } else if (msg === 'new_password_same_as_old') {
+        setError('New password must be different from the current password.');
+      } else if (msg === 'new_passwords_do_not_match') {
+        setError('New passwords do not match.');
+      } else {
+        setError(msg || 'Failed to change password. Please try again.');
+      }
+    },
+  });
+
+  const handleClose = () => {
+    setOldPassword('');
+    setNewPassword('');
+    setConfirmPassword('');
+    setError('');
+    setSuccess(false);
+    onClose();
+  };
+
+  const handleSubmit = () => {
+    setError('');
+    if (newPassword.length < 6) {
+      setError('New password must be at least 6 characters.');
+      return;
+    }
+    if (newPassword !== confirmPassword) {
+      setError('New passwords do not match.');
+      return;
+    }
+    if (newPassword === oldPassword) {
+      setError('New password must be different from the current password.');
+      return;
+    }
+    changePasswordMutation.mutate();
+  };
+
+  return (
+    <Modal isOpen={isOpen} onClose={handleClose} title="Change Password">
+      <form
+        onSubmit={(e) => { e.preventDefault(); handleSubmit(); }}
+        className="space-y-4"
+      >
+        {success && (
+          <div className="flex items-start gap-3 rounded-lg bg-emerald-50 dark:bg-emerald-900/20 border border-emerald-200 dark:border-emerald-800 px-4 py-3">
+            <CheckCircle2 className="w-4 h-4 mt-0.5 text-emerald-600 dark:text-emerald-400 flex-shrink-0" />
+            <p className="text-sm text-emerald-700 dark:text-emerald-300">Password changed successfully.</p>
+          </div>
+        )}
+
+        {error && (
+          <div className="rounded-lg bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 px-4 py-3">
+            <p className="text-sm text-red-700 dark:text-red-300">{error}</p>
+          </div>
+        )}
+
+        <div>
+          <label className="label">Current Password *</label>
+          <input
+            type="password"
+            className="input"
+            value={oldPassword}
+            onChange={(e) => { setOldPassword(e.target.value); setError(''); }}
+            placeholder="Enter current password"
+            autoComplete="current-password"
+            required
+          />
+        </div>
+        <div>
+          <label className="label">New Password *</label>
+          <input
+            type="password"
+            className="input"
+            value={newPassword}
+            onChange={(e) => { setNewPassword(e.target.value); setError(''); }}
+            placeholder="Enter new password"
+            autoComplete="new-password"
+            minLength={6}
+            required
+          />
+        </div>
+        <div>
+          <label className="label">Confirm New Password *</label>
+          <input
+            type="password"
+            className="input"
+            value={confirmPassword}
+            onChange={(e) => { setConfirmPassword(e.target.value); setError(''); }}
+            placeholder="Re-enter new password"
+            autoComplete="new-password"
+            minLength={6}
+            required
+          />
+        </div>
+
+        <div className="flex justify-end gap-2 pt-4">
+          <ActionButton type="button" variant="secondary" onClick={handleClose}>
+            Cancel
+          </ActionButton>
+          <ActionButton
+            type="submit"
+            loading={changePasswordMutation.isPending}
+            disabled={success || !oldPassword || !newPassword || !confirmPassword}
+          >
+            Change Password
+          </ActionButton>
+        </div>
+      </form>
+    </Modal>
+  );
+}
diff --git a/apps/edr-passenger-web/backoffice/src/components/layout/Header.tsx b/apps/edr-passenger-web/backoffice/src/components/layout/Header.tsx
index 0e87eec43..f4547c69e 100644
--- a/apps/edr-passenger-web/backoffice/src/components/layout/Header.tsx
+++ b/apps/edr-passenger-web/backoffice/src/components/layout/Header.tsx
@@ -1,16 +1,18 @@
 'use client';
 
-import { Bell, LogOut, Moon, Sun, ChevronDown, HelpCircle } from 'lucide-react';
+import { Bell, LogOut, Moon, Sun, ChevronDown, HelpCircle, KeyRound } from 'lucide-react';
 import { useAuthStore } from '@/lib/auth-store';
 import { useTheme } from '@/lib/theme-store';
 import { useState } from 'react';
 import Link from 'next/link';
+import ChangePasswordModal from '@/components/layout/ChangePasswordModal';
 
 export default function Header() {
   const { user, logout } = useAuthStore();
   const { isDark, toggleTheme } = useTheme();
   const [showUserMenu, setShowUserMenu] = useState(false);
   const [showNotifications, setShowNotifications] = useState(false);
+  const [showChangePassword, setShowChangePassword] = useState(false);
 
   return (
     <header className="flex h-16 items-center justify-between border-b border-gray-200 dark:border-slate-700 bg-white dark:bg-slate-900 px-6 shadow-sm">
@@ -108,6 +110,16 @@ export default function Header() {
                 >
                   Settings
                 </Link>
+                <button
+                  onClick={() => {
+                    setShowUserMenu(false);
+                    setShowChangePassword(true);
+                  }}
+                  className="flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm text-foreground hover:bg-gray-100 dark:hover:bg-slate-800 transition-colors"
+                >
+                  <KeyRound className="h-4 w-4" />
+                  Change Password
+                </button>
                 <button
                   onClick={() => {
                     logout();
@@ -123,6 +135,11 @@ export default function Header() {
           )}
         </div>
       </div>
+
+      <ChangePasswordModal
+        isOpen={showChangePassword}
+        onClose={() => setShowChangePassword(false)}
+      />
     </header>
   );
 }
diff --git a/apps/edr-passenger-web/backoffice/src/lib/api/auth.ts b/apps/edr-passenger-web/backoffice/src/lib/api/auth.ts
new file mode 100644
index 000000000..1fe1eccbb
--- /dev/null
+++ b/apps/edr-passenger-web/backoffice/src/lib/api/auth.ts
@@ -0,0 +1,26 @@
+import axios from 'axios';
+
+const API_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:4000';
+
+
+export const iamAuthApi = {
+  forgotPassword: (email: string) =>
+    axios.post(`${API_URL}/v1/auth/forgot-password`, { email }),
+
+  resetPassword: (data: {
+    userId: string;
+    email: string;
+    verificationCode: string;
+    newPassword: string;
+    confirmPassword: string;
+  }) => axios.patch(`${API_URL}/v1/auth/set-password`, data),
+
+  changePassword: (data: {
+    oldPassword: string;
+    newPassword: string;
+    confirmPassword: string;
+  }) =>
+    axios.patch(`${API_URL}/v1/auth/change-password`, data, {
+      headers: { Authorization: `Bearer ${localStorage.getItem('auth_token')}` },
+    }),
+};
diff --git a/apps/edr-passenger-web/backoffice/src/middleware.ts b/apps/edr-passenger-web/backoffice/src/middleware.ts
index 0b437d112..7e8a1545d 100644
--- a/apps/edr-passenger-web/backoffice/src/middleware.ts
+++ b/apps/edr-passenger-web/backoffice/src/middleware.ts
@@ -1,6 +1,6 @@
 import { NextRequest, NextResponse } from 'next/server';
 
-const PUBLIC_PATHS = ['/login'];
+const PUBLIC_PATHS = ['/login', '/reset-password'];
 
 export function middleware(request: NextRequest) {
   const { pathname } = request.nextUrl;
diff --git a/apps/edr-passenger-web/portal/public/packages/kulubi.jpeg b/apps/edr-passenger-web/portal/public/packages/kulubi.jpeg
new file mode 100644
index 000000000..5c11fb5b3
Binary files /dev/null and b/apps/edr-passenger-web/portal/public/packages/kulubi.jpeg differ
diff --git a/apps/edr-passenger-web/portal/src/app/booking/auth-check/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/auth-check/page.tsx
index 0ef5c74ec..43775b1c7 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/auth-check/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/auth-check/page.tsx
@@ -3,6 +3,7 @@
 import { useEffect, useState } from 'react';
 import { useRouter } from 'next/navigation';
 import { useAuthStore } from '@/lib/auth-store';
+import { useBookingStore } from '@/lib/booking-store';
 import { LogIn, UserPlus, ChevronLeft } from 'lucide-react';
 
 function Tooltip({ children, content }: { children: React.ReactNode; content: string[] }) {
@@ -41,6 +42,23 @@ function Tooltip({ children, content }: { children: React.ReactNode; content: st
 export default function AuthCheckPage() {
   const router = useRouter();
   const { isAuthenticated, initialize } = useAuthStore();
+  const searchCriteria = useBookingStore((s) => s.searchCriteria);
+
+  const buildResultsUrl = () => {
+    if (!searchCriteria) return '/booking/results';
+    const params = new URLSearchParams({
+      tripType: searchCriteria.tripType,
+      origin: searchCriteria.originStationId,
+      destination: searchCriteria.destinationStationId,
+      date: searchCriteria.departureDate,
+      adults: searchCriteria.adultCount.toString(),
+      children: searchCriteria.childCount.toString(),
+      nationality: searchCriteria.nationality,
+    });
+    if (searchCriteria.returnDate) params.set('returnDate', searchCriteria.returnDate);
+    if (searchCriteria.promoCode) params.set('promoCode', searchCriteria.promoCode);
+    return `/booking/results?${params}`;
+  };
 
   useEffect(() => {
     initialize();
@@ -94,7 +112,7 @@ export default function AuthCheckPage() {
 
         <div className="mt-8 text-center">
           <button
-            onClick={() => router.push('/booking/results')}
+            onClick={() => router.push(buildResultsUrl())}
             className="inline-flex items-center gap-1.5 text-sm text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-200 transition-colors"
           >
             <ChevronLeft className="w-4 h-4" />
diff --git a/apps/edr-passenger-web/portal/src/app/booking/detail/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/detail/page.tsx
index 452484901..f01ab89c6 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/detail/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/detail/page.tsx
@@ -18,6 +18,7 @@ import {
   Wallet
 } from 'lucide-react';
 import { format } from 'date-fns';
+import { formatTime, getTimePeriod } from '@/utils/format';
 import QRCode from 'qrcode.react';
 
 function BookingDetailContent() {
@@ -234,10 +235,10 @@ function BookingDetailContent() {
                       {/* Origin */}
                       <div className="pb-8">
                         <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                          {booking.schedule?.departureAt ? format(new Date(booking.schedule.departureAt), 'HH:mm') : '--:--'}
+                          {booking.schedule?.departureAt ? formatTime(booking.schedule.departureAt) : '--:--'}
                         </div>
                         <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                          {booking.schedule?.departureAt ? format(new Date(booking.schedule.departureAt), 'EEE, MMM d') : 'N/A'}
+                          {booking.schedule?.departureAt ? `${format(new Date(booking.schedule.departureAt), 'EEE, MMM d')} · ${getTimePeriod(booking.schedule.departureAt)}` : 'N/A'}
                         </div>
                         <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                           {booking.schedule?.origin?.name}
@@ -267,10 +268,10 @@ function BookingDetailContent() {
                       {/* Destination */}
                       <div>
                         <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                          {booking.schedule?.arrivalAt ? format(new Date(booking.schedule.arrivalAt), 'HH:mm') : '--:--'}
+                          {booking.schedule?.arrivalAt ? formatTime(booking.schedule.arrivalAt) : '--:--'}
                         </div>
                         <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                          {booking.schedule?.arrivalAt ? format(new Date(booking.schedule.arrivalAt), 'EEE, MMM d') : 'N/A'}
+                          {booking.schedule?.arrivalAt ? `${format(new Date(booking.schedule.arrivalAt), 'EEE, MMM d')} · ${getTimePeriod(booking.schedule.arrivalAt)}` : 'N/A'}
                         </div>
                         <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                           {booking.schedule?.destination?.name}
@@ -493,10 +494,10 @@ function BookingDetailContent() {
                   {/* Origin */}
                   <div className="pb-8">
                     <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                      {booking.schedule?.departureAt ? format(new Date(booking.schedule.departureAt), 'HH:mm') : '--:--'}
+                      {booking.schedule?.departureAt ? formatTime(booking.schedule.departureAt) : '--:--'}
                     </div>
                     <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                      {booking.schedule?.departureAt ? format(new Date(booking.schedule.departureAt), 'EEE, MMM d') : 'N/A'}
+                      {booking.schedule?.departureAt ? `${format(new Date(booking.schedule.departureAt), 'EEE, MMM d')} · ${getTimePeriod(booking.schedule.departureAt)}` : 'N/A'}
                     </div>
                     <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                       {booking.schedule?.origin?.name}
@@ -526,10 +527,10 @@ function BookingDetailContent() {
                   {/* Destination */}
                   <div>
                     <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                      {booking.schedule?.arrivalAt ? format(new Date(booking.schedule.arrivalAt), 'HH:mm') : '--:--'}
+                      {booking.schedule?.arrivalAt ? formatTime(booking.schedule.arrivalAt) : '--:--'}
                     </div>
                     <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                      {booking.schedule?.arrivalAt ? format(new Date(booking.schedule.arrivalAt), 'EEE, MMM d') : 'N/A'}
+                      {booking.schedule?.arrivalAt ? `${format(new Date(booking.schedule.arrivalAt), 'EEE, MMM d')} · ${getTimePeriod(booking.schedule.arrivalAt)}` : 'N/A'}
                     </div>
                     <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                       {booking.schedule?.destination?.name}
diff --git a/apps/edr-passenger-web/portal/src/app/booking/passengers/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/passengers/page.tsx
index a15bba6cf..d5857ac98 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/passengers/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/passengers/page.tsx
@@ -8,7 +8,7 @@ import { useBookingStore } from '@/lib/booking-store';
 import { useAuthStore } from '@/lib/auth-store';
 import { apiClient } from '@/lib/api-client';
 import { useState, useEffect, useRef } from 'react';
-import { CheckCircle, ExternalLink, Loader2, CalendarDays, X, Globe, ChevronLeft } from 'lucide-react';
+import { CheckCircle, ExternalLink, Loader2, CalendarDays, X, Globe, ChevronLeft, AlertCircle } from 'lucide-react';
 import { gregorianToEthiopian, ethiopianToGregorian, ETHIOPIAN_MONTHS, getDaysInEthiopianMonth } from '@/lib/ethiopian-calendar';
 
 const GC_MONTHS = ['January','February','March','April','May','June','July','August','September','October','November','December'];
@@ -17,24 +17,73 @@ function daysInGCMonth(y: number, m: number) {
   return new Date(y, m, 0).getDate();
 }
 
+const ADULT_MIN_AGE = 6;   // adults must be older than 5 years
+const CHILD_MAX_AGE = 5;   // children must be 5 years old or younger
+const ADULT_MAX_AGE_SPAN = 110;
+const ADULT_DEFAULT_YEAR = 2000;
+
+// ─── fayda passenger tracking ───────────────────────────────────────────────
+// Fayda's OAuth redirect can land back on this route either inside the popup
+// window we opened, or — on browsers/mobile contexts that refuse to open a
+// popup — as a full-page navigation of this same tab. React state doesn't
+// survive that reload, so we track which passenger triggered the verification
+// in sessionStorage, which does survive same-tab navigation.
+const FAYDA_PENDING_INDEX_KEY = 'edr_fayda_pending_passenger_index';
+
+function getPendingFaydaIndex(): number | null {
+  if (typeof window === 'undefined') return null;
+  const raw = window.sessionStorage.getItem(FAYDA_PENDING_INDEX_KEY);
+  if (raw === null) return null;
+  const parsed = parseInt(raw, 10);
+  return Number.isNaN(parsed) ? null : parsed;
+}
+
+function setPendingFaydaIndex(index: number) {
+  if (typeof window === 'undefined') return;
+  window.sessionStorage.setItem(FAYDA_PENDING_INDEX_KEY, String(index));
+}
+
+function clearPendingFaydaIndex() {
+  if (typeof window === 'undefined') return;
+  window.sessionStorage.removeItem(FAYDA_PENDING_INDEX_KEY);
+}
+
+// Fayda may return gender as "MALE"/"M" etc — normalize to the form's expected values
+function normalizeFaydaGender(raw: unknown): 'Male' | 'Female' | '' {
+  const g = String(raw || '').trim().toUpperCase();
+  if (g === 'MALE' || g === 'M') return 'Male';
+  if (g === 'FEMALE' || g === 'F') return 'Female';
+  return '';
+}
+
 function DobPickerModal({
   value,
   onChange,
   error,
+  passengerType = 'ADULT',
 }: {
   value: string;
   onChange: (iso: string) => void;
   error?: string;
+  passengerType?: 'ADULT' | 'CHILD';
 }) {
   const [open, setOpen] = useState(false);
   const [manualMode, setManualMode] = useState(false);
   const [calType, setCalType] = useState<'gregorian' | 'ethiopian'>('gregorian');
+  const isChild = passengerType === 'CHILD';
   const currentYear = new Date().getFullYear();
   const currentEthYear = gregorianToEthiopian(new Date()).year;
 
+  // Selectable year bounds, scoped to passenger type so the picker can't produce an invalid age
+  const minGCYear = isChild ? currentYear - CHILD_MAX_AGE : currentYear - ADULT_MAX_AGE_SPAN;
+  const maxGCYear = isChild ? currentYear : currentYear - ADULT_MIN_AGE;
+  const minEthYear = isChild ? currentEthYear - CHILD_MAX_AGE : currentEthYear - ADULT_MAX_AGE_SPAN;
+  const maxEthYear = isChild ? currentEthYear : currentEthYear - ADULT_MIN_AGE;
+
   // Parse stored ISO value (always Gregorian)
   const parsed = value ? value.split('-') : [];
-  const initGCYear  = parsed[0] ? parseInt(parsed[0]) : currentYear - 25;
+  const defaultGCYear = isChild ? maxGCYear : Math.min(Math.max(ADULT_DEFAULT_YEAR, minGCYear), maxGCYear);
+  const initGCYear  = parsed[0] ? parseInt(parsed[0]) : defaultGCYear;
   const initGCMonth = parsed[1] ? parseInt(parsed[1]) : 1;
   const initGCDay   = parsed[2] ? parseInt(parsed[2]) : 1;
 
@@ -44,7 +93,7 @@ function DobPickerModal({
   const [selGCDay,   setSelGCDay]   = useState(initGCDay);
 
   // Ethiopian drum state — initialise from parsed value if present
-  const initEth = value ? gregorianToEthiopian(new Date(initGCYear, initGCMonth - 1, initGCDay)) : { year: currentEthYear - 25, month: 1, day: 1 };
+  const initEth = value ? gregorianToEthiopian(new Date(initGCYear, initGCMonth - 1, initGCDay)) : { year: isChild ? maxEthYear : Math.min(Math.max(ADULT_DEFAULT_YEAR - 8, minEthYear), maxEthYear), month: 1, day: 1 };
   const [selEthYear,  setSelEthYear]  = useState(initEth.year);
   const [selEthMonth, setSelEthMonth] = useState(initEth.month);
   const [selEthDay,   setSelEthDay]   = useState(initEth.day);
@@ -60,8 +109,8 @@ function DobPickerModal({
   const gcSafeDay  = Math.min(selGCDay,  gcMaxDay);
   const ethSafeDay = Math.min(selEthDay, ethMaxDay);
 
-  const gcYears   = Array.from({ length: 100 }, (_, i) => currentYear - i);
-  const ethYears  = Array.from({ length: 100 }, (_, i) => currentEthYear - i);
+  const gcYears   = Array.from({ length: maxGCYear - minGCYear + 1 }, (_, i) => maxGCYear - i);
+  const ethYears  = Array.from({ length: maxEthYear - minEthYear + 1 }, (_, i) => maxEthYear - i);
   const gcMonths  = GC_MONTHS.map((m, i) => ({ label: m, value: i + 1 }));
   const ethMonths = ETHIOPIAN_MONTHS.map((m, i) => ({ label: m, value: i + 1 }));
   const gcDays    = Array.from({ length: gcMaxDay  }, (_, i) => i + 1);
@@ -115,11 +164,11 @@ function DobPickerModal({
 
   const gcDayHandler   = useRef(makeScrollHandler(dayRef,   setSelGCDay,   () => Array.from({ length: daysInGCMonth(selGCYear, selGCMonth) }, (_, i) => i + 1))).current;
   const gcMonthHandler = useRef(makeScrollHandler(monthRef, setSelGCMonth, () => GC_MONTHS.map((_, i) => i + 1))).current;
-  const gcYearHandler  = useRef(makeScrollHandler(yearRef,  setSelGCYear,  () => Array.from({ length: 100 }, (_, i) => new Date().getFullYear() - i))).current;
+  const gcYearHandler  = useRef(makeScrollHandler(yearRef,  setSelGCYear,  () => gcYears)).current;
 
   const ethDayHandler   = useRef(makeScrollHandler(dayRef,   setSelEthDay,   () => Array.from({ length: getDaysInEthiopianMonth(selEthYear, selEthMonth) }, (_, i) => i + 1))).current;
   const ethMonthHandler = useRef(makeScrollHandler(monthRef, setSelEthMonth, () => ETHIOPIAN_MONTHS.map((_, i) => i + 1))).current;
-  const ethYearHandler  = useRef(makeScrollHandler(yearRef,  setSelEthYear,  () => Array.from({ length: 100 }, (_, i) => gregorianToEthiopian(new Date()).year - i))).current;
+  const ethYearHandler  = useRef(makeScrollHandler(yearRef,  setSelEthYear,  () => ethYears)).current;
 
   const confirm = () => {
     let gregDate: Date;
@@ -137,16 +186,20 @@ function DobPickerModal({
 
   const confirmManual = () => {
     const d = parseInt(manDay), m = parseInt(manMonth), y = parseInt(manYear);
-    if (!d || !m || !y || m < 1 || m > 12 || d < 1 || d > daysInGCMonth(y, m) || y < currentYear - 110 || y > currentYear) return;
+    if (!d || !m || !y || m < 1 || m > 12 || d < 1 || d > daysInGCMonth(y, m) || y < minGCYear || y > maxGCYear) return;
     onChange(`${y}-${String(m).padStart(2,'0')}-${String(d).padStart(2,'0')}`);
     setOpen(false);
   };
 
   const manualValid = (() => {
     const d = parseInt(manDay), m = parseInt(manMonth), y = parseInt(manYear);
-    return d >= 1 && m >= 1 && m <= 12 && y >= currentYear - 110 && y <= currentYear && d <= daysInGCMonth(y, m);
+    return d >= 1 && m >= 1 && m <= 12 && y >= minGCYear && y <= maxGCYear && d <= daysInGCMonth(y, m);
   })();
 
+  const manualRangeMessage = isChild
+    ? `Child's date of birth must fall between ${minGCYear} and ${maxGCYear} (age 5 or younger)`
+    : `Adult's date of birth must fall between ${minGCYear} and ${maxGCYear} (age older than 5)`;
+
   // Display: always show Gregorian ISO as human-readable, with calendar label
   const displayValue = (() => {
     if (!value) return '';
@@ -276,11 +329,12 @@ function DobPickerModal({
                   </div>
                   <div>
                     <label className="block text-xs font-semibold text-gray-500 uppercase tracking-wide mb-1.5">Year</label>
-                    <input type="number" min={currentYear - 110} max={currentYear} value={manYear} onChange={(e) => setManYear(e.target.value)} placeholder="YYYY" className="input-field text-center text-lg font-semibold" />
+                    <input type="number" min={minGCYear} max={maxGCYear} value={manYear} onChange={(e) => setManYear(e.target.value)} placeholder="YYYY" className="input-field text-center text-lg font-semibold" />
                   </div>
                 </div>
+                <p className="text-xs text-gray-400">Valid years: {minGCYear} – {maxGCYear}</p>
                 {manDay && manMonth && manYear && !manualValid && (
-                  <p className="text-red-500 text-xs">Please enter a valid Gregorian date</p>
+                  <p className="text-red-500 text-xs">{manualRangeMessage}</p>
                 )}
               </div>
             ) : (
@@ -453,6 +507,21 @@ function PhoneInput({
   );
 }
 
+// ─── age calculation ─────────────────────────────────────────────────────────
+
+function calculateAge(dateOfBirth: string): number | null {
+  if (!dateOfBirth) return null;
+  const dob = new Date(dateOfBirth);
+  if (isNaN(dob.getTime())) return null;
+  const today = new Date();
+  let age = today.getFullYear() - dob.getFullYear();
+  const monthDiff = today.getMonth() - dob.getMonth();
+  if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < dob.getDate())) {
+    age--;
+  }
+  return age;
+}
+
 // ─── passenger zod schema ──────────────────────────────────────────────────────
 
 const passengerSchema = z.object({
@@ -460,8 +529,6 @@ const passengerSchema = z.object({
   dateOfBirth: z.string().min(1, 'Date of birth is required'),
   gender: z.string().min(1, 'Gender is required'),
   nationality: z.string().min(1, 'Nationality is required'),
-  phone: z.string(),
-  email: z.string().optional(),
   nationalId: z.string().optional(),
   passportNumber: z.string().optional(),
   passportCountry: z.string().optional(),
@@ -475,16 +542,6 @@ const passengerSchema = z.object({
   if (data.gender !== 'Male' && data.gender !== 'Female') {
     ctx.addIssue({ code: z.ZodIssueCode.custom, message: 'Gender is required', path: ['gender'] });
   }
-  if (data.email && data.email.trim().length > 0) {
-    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-    if (!emailRegex.test(data.email)) {
-      ctx.addIssue({ code: z.ZodIssueCode.custom, message: 'Invalid email format', path: ['email'] });
-    }
-  }
-  const phoneError = validatePhone(data.phone, data.nationality);
-  if (phoneError) {
-    ctx.addIssue({ code: z.ZodIssueCode.custom, message: phoneError, path: ['phone'] });
-  }
   const isNonEthiopian = data.nationality !== 'ETHIOPIAN' && data.nationality !== 'Ethiopian';
   if (isNonEthiopian) {
     if (!data.passportNumber || data.passportNumber.trim().length === 0) {
@@ -496,12 +553,41 @@ const passengerSchema = z.object({
   }
 });
 
-const formSchema = z.object({
-  passengers: z.array(passengerSchema),
-  createAccount: z.boolean(),
-});
+function createFormSchema(adultCount: number) {
+  return z.object({
+    passengers: z.array(passengerSchema),
+    createAccount: z.boolean(),
+    contactPhone: z.string(),
+    contactEmail: z.string(),
+  }).superRefine((data, ctx) => {
+    if (!data.contactEmail || data.contactEmail.trim().length === 0) {
+      ctx.addIssue({ code: z.ZodIssueCode.custom, message: 'Contact email is required', path: ['contactEmail'] });
+    } else {
+      const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+      if (!emailRegex.test(data.contactEmail)) {
+        ctx.addIssue({ code: z.ZodIssueCode.custom, message: 'Invalid email format', path: ['contactEmail'] });
+      }
+    }
+    const contactNationality = data.passengers[0]?.nationality || 'ETHIOPIAN';
+    const phoneError = validatePhone(data.contactPhone, contactNationality);
+    if (phoneError) {
+      ctx.addIssue({ code: z.ZodIssueCode.custom, message: phoneError, path: ['contactPhone'] });
+    }
 
-type FormData = z.infer<typeof formSchema>;
+    data.passengers.forEach((p, i) => {
+      const age = calculateAge(p.dateOfBirth);
+      if (age === null) return;
+      const isAdult = i < adultCount;
+      if (isAdult && age <= 5) {
+        ctx.addIssue({ code: z.ZodIssueCode.custom, message: 'Adult passengers must be older than 5 years', path: ['passengers', i, 'dateOfBirth'] });
+      } else if (!isAdult && age > 5) {
+        ctx.addIssue({ code: z.ZodIssueCode.custom, message: 'Child passengers must be 5 years old or younger', path: ['passengers', i, 'dateOfBirth'] });
+      }
+    });
+  });
+}
+
+type FormData = z.infer<ReturnType<typeof createFormSchema>>;
 
 export default function PassengersPage() {
   const router = useRouter();
@@ -509,17 +595,24 @@ export default function PassengersPage() {
   const { user, isAuthenticated, updateUser } = useAuthStore();
   const isInitialized = useAuthStore((s) => s.isInitialized);
   const [faydaEnabled, setFaydaEnabled] = useState(true);
-  const [verificationStatus, setVerificationStatus] = useState<Record<number, 'success' | 'error'>>({});
+  const [verificationStatus, setVerificationStatus] = useState<Record<number, 'pending' | 'success' | 'error'>>({});
+  const [faydaErrors, setFaydaErrors] = useState<Record<number, string>>({});
+  // The passenger currently mid-verification (popup open / awaiting callback). Only one
+  // passenger can verify at a time so a stray callback can never be misapplied to the
+  // wrong passenger's form.
+  const [verifyingIndex, setVerifyingIndex] = useState<number | null>(null);
   const [saving, setSaving] = useState(false);
+  const [submitError, setSubmitError] = useState<string | null>(null);
   const [formInitialized, setFormInitialized] = useState(false);
   const [faydaParams, setFaydaParams] = useState<{ code: string; state: string } | null>(null);
   const [faydaCompleting, setFaydaCompleting] = useState(false);
 
 
   const totalPassengers = (searchCriteria?.adultCount || 1) + (searchCriteria?.childCount || 0);
+  const adultCount = searchCriteria?.adultCount || 1;
 
   const { register, control, handleSubmit, setValue, watch, formState: { errors } } = useForm<FormData>({
-    resolver: zodResolver(formSchema as any),
+    resolver: zodResolver(createFormSchema(adultCount) as any),
     mode: 'onChange',
     defaultValues: {
       passengers: Array.from({ length: totalPassengers }, (_, i) => {
@@ -530,8 +623,6 @@ export default function PassengersPage() {
             dateOfBirth: stored.dateOfBirth || '',
             gender: (stored.gender as any) || undefined,
             nationality: stored.nationality || searchCriteria?.nationality || 'ETHIOPIAN',
-            phone: stored.phone || '',
-            email: stored.email || '',
             nationalId: stored.nationalId || '',
             passportNumber: stored.passportNumber || '',
             passportCountry: stored.passportCountry || '',
@@ -547,8 +638,6 @@ export default function PassengersPage() {
           dateOfBirth: '',
           gender: undefined,
           nationality: searchCriteria?.nationality || 'ETHIOPIAN',
-          phone: '',
-          email: '',
           nationalId: '',
           passportNumber: '',
           passportCountry: '',
@@ -556,10 +645,12 @@ export default function PassengersPage() {
           passportExpiryDate: '',
           passportIssuingAuthority: '',
           faydaVerified: false,
-          formExpanded: false,
+          formExpanded: i >= adultCount,
         };
       }),
       createAccount: false,
+      contactPhone: storedPassengers[0]?.phone || '',
+      contactEmail: storedPassengers[0]?.email || '',
     },
   });
 
@@ -584,15 +675,24 @@ export default function PassengersPage() {
     const params = new URLSearchParams(window.location.search);
     const code = params.get('code');
     const state = params.get('state');
-    if (code && state) setFaydaParams({ code, state });
+    if (code && state) {
+      setFaydaParams({ code, state });
+      const pendingIndex = getPendingFaydaIndex();
+      if (pendingIndex !== null) setVerifyingIndex(pendingIndex);
+    }
   }, []);
 
-  // Complete Fayda verification once the form is ready and callback params are present
+  // Complete Fayda verification once the form is ready and callback params are present.
+  // This effect runs whenever this route reloads with ?code&state — which happens either
+  // inside the verification popup, or, if the browser refused to open a popup, as a full
+  // navigation of this same tab. Either way, the index of the passenger who started the
+  // verification was stashed in sessionStorage before redirecting, so it survives the reload.
   useEffect(() => {
     if (!faydaParams || !formInitialized) return;
 
     const complete = async () => {
       setFaydaCompleting(true);
+      const targetIndex = getPendingFaydaIndex() ?? 0;
       try {
         const response: any = await apiClient.get(
           `/fayda/verification/complete?code=${encodeURIComponent(faydaParams.code)}&state=${encodeURIComponent(faydaParams.state)}`
@@ -600,25 +700,50 @@ export default function PassengersPage() {
 
         if (response?.success && response?.data?.verified) {
           const d = response.data;
-          // Convert "1980/12/01" → "1980-12-01"
-          const dob = d.birthdate ? (d.birthdate as string).replace(/\//g, '-') : '';
+          const faydaSub: string | undefined = d.sub || d.faydaSub || d.fin;
 
-          setValue('passengers.0.name', d.fullName || '', { shouldValidate: true });
-          if (dob) setValue('passengers.0.dateOfBirth', dob, { shouldValidate: true });
-          if (d.email) setValue('passengers.0.email', d.email, { shouldValidate: true });
-          if (d.phoneNumber) setValue('passengers.0.phone', d.phoneNumber, { shouldValidate: true });
-          setValue('passengers.0.faydaVerified', true);
-          setValue('passengers.0.formExpanded', true);
-          setVerificationStatus((prev) => ({ ...prev, 0: 'success' }));
+          // A single Fayda identity can't be reused across two different passengers.
+          const usedByOther = faydaSub && passengers.some(
+            (p, i) => i !== targetIndex && (p as any).faydaSub === faydaSub,
+          );
 
-          // Remove code/state from the URL so a refresh doesn't re-trigger
-          router.replace('/booking/passengers');
+          if (usedByOther) {
+            setFaydaErrors((prev) => ({ ...prev, [targetIndex]: 'This Fayda identity is already linked to another passenger on this booking.' }));
+            setVerificationStatus((prev) => ({ ...prev, [targetIndex]: 'error' }));
+          } else {
+            // Convert "1980/12/01" → "1980-12-01"
+            const dob = d.birthdate ? (d.birthdate as string).replace(/\//g, '-') : '';
+
+            setValue(`passengers.${targetIndex}.name`, d.fullName || '', { shouldValidate: true });
+            if (dob) setValue(`passengers.${targetIndex}.dateOfBirth`, dob, { shouldValidate: true });
+            const normalizedGender = normalizeFaydaGender(d.gender);
+            if (normalizedGender) setValue(`passengers.${targetIndex}.gender`, normalizedGender, { shouldValidate: true });
+            if (faydaSub) setValue(`passengers.${targetIndex}.faydaSub`, faydaSub);
+            // Contact info is shared across all passengers — only fill it in if nobody has
+            // entered it yet, so verifying passenger 2 can't clobber passenger 1's contact.
+            if (d.email && !watch('contactEmail')) setValue('contactEmail', d.email, { shouldValidate: true });
+            if (d.phoneNumber && !watch('contactPhone')) setValue('contactPhone', d.phoneNumber, { shouldValidate: true });
+            setValue(`passengers.${targetIndex}.faydaVerified`, true);
+            setValue(`passengers.${targetIndex}.formExpanded`, true);
+            setVerificationStatus((prev) => ({ ...prev, [targetIndex]: 'success' }));
+            setFaydaErrors((prev) => { const next = { ...prev }; delete next[targetIndex]; return next; });
+          }
+        } else {
+          setVerificationStatus((prev) => ({ ...prev, [targetIndex]: 'error' }));
+          setFaydaErrors((prev) => ({ ...prev, [targetIndex]: 'Fayda verification could not be completed. Please try again or enter details manually.' }));
         }
+
+        // Remove code/state from the URL so a refresh doesn't re-trigger
+        router.replace('/booking/passengers');
       } catch (error) {
         console.error('Failed to complete Fayda verification:', error);
+        setVerificationStatus((prev) => ({ ...prev, [targetIndex]: 'error' }));
+        setFaydaErrors((prev) => ({ ...prev, [targetIndex]: 'Fayda verification failed. Please try again or enter details manually.' }));
       } finally {
         setFaydaCompleting(false);
         setFaydaParams(null);
+        setVerifyingIndex(null);
+        clearPendingFaydaIndex();
       }
     };
 
@@ -656,8 +781,8 @@ export default function PassengersPage() {
         setValue('passengers.0.dateOfBirth', passengerData?.dateOfBirth || user.dateOfBirth || '');
         if (passengerData?.gender || user.gender) setValue('passengers.0.gender', (passengerData?.gender || user.gender) as any);
         setValue('passengers.0.nationality', passengerData?.nationality || user.nationality || 'ETHIOPIAN');
-        if (passengerData?.phone || user.phone) setValue('passengers.0.phone', passengerData?.phone || user.phone || '');
-        if (passengerData?.email || user.email) setValue('passengers.0.email', passengerData?.email || user.email || '');
+        if (passengerData?.phone || user.phone) setValue('contactPhone', passengerData?.phone || user.phone || '');
+        if (passengerData?.email || user.email) setValue('contactEmail', passengerData?.email || user.email || '');
         if (passengerData?.passportNumber) setValue('passengers.0.passportNumber', passengerData.passportNumber);
         if (passengerData?.passportCountry) setValue('passengers.0.passportCountry', passengerData.passportCountry);
         if (passengerData?.passportIssueDate) setValue('passengers.0.passportIssueDate', passengerData.passportIssueDate);
@@ -678,6 +803,16 @@ export default function PassengersPage() {
 
   const openFaydaVerification = async (index: number) => {
     if (typeof window === 'undefined') return;
+    // Only one passenger can verify at a time — this keeps the status poll below
+    // (which has no passenger identifier of its own) unambiguous about who it belongs to.
+    if (verifyingIndex !== null) return;
+
+    setVerifyingIndex(index);
+    setVerificationStatus((prev) => ({ ...prev, [index]: 'pending' }));
+    setFaydaErrors((prev) => { const next = { ...prev }; delete next[index]; return next; });
+    // Persist which passenger this is for so it survives a full-page redirect/reload
+    // if the browser can't open a popup (e.g. some mobile browsers).
+    setPendingFaydaIndex(index);
 
     try {
       const response: any = await apiClient.post('/fayda/verification/start', {
@@ -698,33 +833,67 @@ export default function PassengersPage() {
         `width=${width},height=${height},left=${left},top=${top},scrollbars=yes,resizable=yes`
       );
 
+      if (!popup) {
+        setVerificationStatus((prev) => ({ ...prev, [index]: 'error' }));
+        setFaydaErrors((prev) => ({ ...prev, [index]: 'Unable to open the Fayda verification window. Please allow pop-ups and try again.' }));
+        setVerifyingIndex(null);
+        clearPendingFaydaIndex();
+        return;
+      }
+
       const checkPopup = setInterval(async () => {
-        if (popup?.closed) {
+        if (popup.closed) {
           clearInterval(checkPopup);
           try {
             const statusResponse: any = await apiClient.get('/fayda/verification/status');
             if (statusResponse.verified) {
-              setValue(`passengers.${index}.name`, statusResponse.fullName || '');
-              setValue(`passengers.${index}.faydaVerified`, true);
-              setValue(`passengers.${index}.formExpanded`, true);
-              setVerificationStatus({ ...verificationStatus, [index]: 'success' });
+              const faydaSub: string | undefined = statusResponse.sub || statusResponse.faydaSub || statusResponse.fin;
+              const usedByOther = faydaSub && passengers.some(
+                (p, i) => i !== index && (p as any).faydaSub === faydaSub,
+              );
 
-              if (index === 0 && isAuthenticated) {
-                updateUser({
-                  fullName: statusResponse.fullName,
-                  faydaVerified: true,
-                  faydaVerifiedAt: statusResponse.verifiedAt,
-                });
+              if (usedByOther) {
+                setVerificationStatus((prev) => ({ ...prev, [index]: 'error' }));
+                setFaydaErrors((prev) => ({ ...prev, [index]: 'This Fayda identity is already linked to another passenger on this booking.' }));
+              } else {
+                setValue(`passengers.${index}.name`, statusResponse.fullName || '', { shouldValidate: true });
+                if (statusResponse.dateOfBirth) setValue(`passengers.${index}.dateOfBirth`, statusResponse.dateOfBirth, { shouldValidate: true });
+                const normalizedGender = normalizeFaydaGender(statusResponse.gender);
+                if (normalizedGender) setValue(`passengers.${index}.gender`, normalizedGender, { shouldValidate: true });
+                if (faydaSub) setValue(`passengers.${index}.faydaSub`, faydaSub);
+                setValue(`passengers.${index}.faydaVerified`, true);
+                setValue(`passengers.${index}.formExpanded`, true);
+                setVerificationStatus((prev) => ({ ...prev, [index]: 'success' }));
+                setFaydaErrors((prev) => { const next = { ...prev }; delete next[index]; return next; });
+
+                if (index === 0 && isAuthenticated) {
+                  updateUser({
+                    fullName: statusResponse.fullName,
+                    faydaVerified: true,
+                    faydaVerifiedAt: statusResponse.verifiedAt,
+                  });
+                }
               }
+            } else {
+              setVerificationStatus((prev) => ({ ...prev, [index]: 'error' }));
+              setFaydaErrors((prev) => ({ ...prev, [index]: 'Fayda verification was not completed. Please try again or enter details manually.' }));
             }
           } catch (error) {
             console.error('Failed to get verification status:', error);
+            setVerificationStatus((prev) => ({ ...prev, [index]: 'error' }));
+            setFaydaErrors((prev) => ({ ...prev, [index]: 'Failed to confirm verification status. Please try again or enter details manually.' }));
+          } finally {
+            setVerifyingIndex(null);
+            clearPendingFaydaIndex();
           }
         }
       }, 1000);
     } catch (error) {
       console.error('Failed to start Fayda verification:', error);
-      alert('Failed to start verification. Please try again.');
+      setVerificationStatus((prev) => ({ ...prev, [index]: 'error' }));
+      setFaydaErrors((prev) => ({ ...prev, [index]: 'Failed to start verification. Please try again.' }));
+      setVerifyingIndex(null);
+      clearPendingFaydaIndex();
     }
   };
 
@@ -732,8 +901,15 @@ export default function PassengersPage() {
     setValue(`passengers.${index}.formExpanded`, !passengers[index].formExpanded);
   };
 
+  const onInvalid = () => {
+    // Sections still behind the Fayda verify screen stay collapsed here — they only expand
+    // when the user explicitly clicks "Skip for now" / "Enter details manually".
+    setSubmitError('Please fix the highlighted errors before continuing.');
+  };
+
   const onSubmit = async (data: FormData) => {
     setSaving(true);
+    setSubmitError(null);
     try {
       let passengerId = '';
       
@@ -759,8 +935,8 @@ export default function PassengersPage() {
         passportIssueDate: p.passportIssueDate,
         passportExpiryDate: p.passportExpiryDate,
         passportIssuingAuthority: p.passportIssuingAuthority,
-        phone: p.phone || '',
-        email: p.email || '',
+        phone: data.contactPhone,
+        email: data.contactEmail,
         isPrimaryPassenger: i === 0,
         passengerId: i === 0 && passengerId ? passengerId : undefined,
       }))
@@ -809,7 +985,9 @@ export default function PassengersPage() {
           <div className="max-w-lg mx-auto text-center">
             <Loader2 className="w-8 h-8 animate-spin mx-auto text-blue-600" />
             <p className="text-gray-600 dark:text-gray-400 mt-4">
-              {faydaCompleting ? 'Completing Fayda verification...' : 'Loading passenger details...'}
+              {faydaCompleting
+                ? `Completing Fayda verification for Passenger ${(verifyingIndex ?? 0) + 1}...`
+                : 'Loading passenger details...'}
             </p>
           </div>
         </div>
@@ -823,22 +1001,26 @@ export default function PassengersPage() {
         <div className="max-w-6xl mx-auto">
           <h1 className="text-3xl font-bold mb-6 text-gray-900 dark:text-gray-100">Passenger details</h1>
 
-          <form onSubmit={handleSubmit(onSubmit)} className="space-y-6">
+          <form onSubmit={handleSubmit(onSubmit, onInvalid)} className="space-y-6">
             {fields.map((field, index) => {
               const isEthiopian = passengers[index]?.nationality === 'ETHIOPIAN';
               const isFormExpanded = passengers[index]?.formExpanded;
               const status = verificationStatus[index];
               const isPrimaryPassenger = index === 0;
+              const isChildPassenger = index >= adultCount;
               const isLoggedInAndVerified = isPrimaryPassenger && isAuthenticated && user?.faydaVerified;
               const isLoggedInNotVerified = isPrimaryPassenger && isAuthenticated && !user?.faydaVerified;
-              const showVerifyButton = isEthiopian && faydaEnabled && !isFormExpanded && !isLoggedInAndVerified;
-              const showManualEntryLink = isEthiopian && !faydaEnabled && !isFormExpanded;
+              const showVerifyButton = isEthiopian && faydaEnabled && !isFormExpanded && !isLoggedInAndVerified && !isChildPassenger;
+              const showManualEntryLink = isEthiopian && !faydaEnabled && !isFormExpanded && !isChildPassenger;
+              const isVerifyingThis = verifyingIndex === index;
+              const isVerifyingOther = verifyingIndex !== null && verifyingIndex !== index;
+              const faydaError = faydaErrors[index];
 
               return (
                 <div key={field.id} className="card">
                   <h3 className="text-lg font-semibold mb-4 text-gray-900 dark:text-gray-100">
                     Passenger {index + 1} {index === 0 && '(Primary)'}
-                    {index < (searchCriteria.adultCount || 1) ? ' - Adult' : ' - Child'}
+                    {isChildPassenger ? ' - Child' : ' - Adult'}
                     <span className="ml-2 text-sm font-normal text-gray-600 dark:text-gray-400">
                       ({isEthiopian ? 'Ethiopian' : searchCriteria.nationality === 'DJIBOUTIAN' ? 'Djiboutian' : 'Other'})
                     </span>
@@ -853,18 +1035,40 @@ export default function PassengersPage() {
                           </p>
                         </div>
                       )}
+                      {faydaError && (
+                        <div className="mb-4 p-3 bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-800 rounded-lg flex items-center gap-2">
+                          <AlertCircle className="w-4 h-4 text-red-600 dark:text-red-400 flex-shrink-0" />
+                          <p className="text-sm text-red-700 dark:text-red-300">{faydaError}</p>
+                        </div>
+                      )}
                       <button
                         type="button"
                         onClick={() => openFaydaVerification(index)}
-                        className="btn-primary flex items-center justify-center gap-2 mx-auto"
+                        disabled={isVerifyingThis || isVerifyingOther}
+                        className="btn-primary flex items-center justify-center gap-2 mx-auto disabled:opacity-50 disabled:cursor-not-allowed"
                       >
-                        <ExternalLink className="w-5 h-5" />
-                        {isLoggedInNotVerified ? 'Verify with Fayda' : 'Verify with Fayda'}
+                        {isVerifyingThis ? (
+                          <>
+                            <Loader2 className="w-5 h-5 animate-spin" />
+                            Waiting for verification...
+                          </>
+                        ) : (
+                          <>
+                            <ExternalLink className="w-5 h-5" />
+                            Verify with Fayda
+                          </>
+                        )}
                       </button>
+                      {isVerifyingOther && (
+                        <p className="text-xs text-gray-400 dark:text-gray-500 mt-2">
+                          Finish verifying Passenger {(verifyingIndex ?? 0) + 1} first
+                        </p>
+                      )}
                       <button
                         type="button"
                         onClick={() => toggleForm(index)}
-                        className="text-sm text-gray-500 dark:text-gray-400 hover:underline mt-3 block mx-auto"
+                        disabled={isVerifyingThis}
+                        className="text-sm text-gray-500 dark:text-gray-400 hover:underline mt-3 block mx-auto disabled:opacity-50 disabled:cursor-not-allowed"
                       >
                         Skip for now
                       </button>
@@ -889,10 +1093,16 @@ export default function PassengersPage() {
                           {status === 'success' && (
                             <div className="p-3 bg-green-50 dark:bg-green-900/30 border border-green-200 dark:border-green-800 rounded-lg mb-4">
                               <p className="text-green-700 dark:text-green-300 text-sm flex items-center gap-2">
-                                <CheckCircle className="w-4 h-4" /> Verified with Fayda
+                                <CheckCircle className="w-4 h-4" /> Verified with Fayda — details auto-filled below
                               </p>
                             </div>
                           )}
+                          {status === 'error' && faydaError && (
+                            <div className="p-3 bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-800 rounded-lg mb-4 flex items-center gap-2">
+                              <AlertCircle className="w-4 h-4 text-red-600 dark:text-red-400 flex-shrink-0" />
+                              <p className="text-red-700 dark:text-red-300 text-sm">{faydaError}</p>
+                            </div>
+                          )}
 
                           <div className="grid md:grid-cols-2 gap-4">
                             {/* Full Name */}
@@ -915,6 +1125,7 @@ export default function PassengersPage() {
                                 value={passengers[index]?.dateOfBirth || ''}
                                 onChange={(iso) => setValue(`passengers.${index}.dateOfBirth`, iso, { shouldValidate: true })}
                                 error={errors.passengers?.[index]?.dateOfBirth?.message}
+                                passengerType={isChildPassenger ? 'CHILD' : 'ADULT'}
                               />
                             </div>
 
@@ -944,32 +1155,6 @@ export default function PassengersPage() {
                                 disabled
                               />
                             </div>
-
-                            {/* Phone */}
-                            <div>
-                              <label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Phone Number *</label>
-                              <PhoneInput
-                                nationality={passengers[index]?.nationality || 'ETHIOPIAN'}
-                                storedValue={passengers[index]?.phone || ''}
-                                onInterimChange={(v) => setValue(`passengers.${index}.phone`, v)}
-                                onNormalized={(v) => setValue(`passengers.${index}.phone`, v, { shouldValidate: true })}
-                                error={errors.passengers?.[index]?.phone?.message}
-                              />
-                            </div>
-
-                            {/* Email */}
-                            <div>
-                              <label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Email</label>
-                              <input
-                                type="email"
-                                {...register(`passengers.${index}.email`)}
-                                className={`input-field ${errors.passengers?.[index]?.email ? 'border-red-500' : ''}`}
-                                placeholder="email@example.com"
-                              />
-                              {errors.passengers?.[index]?.email && (
-                                <p className="text-red-500 text-xs mt-1">{errors.passengers[index]?.email?.message}</p>
-                              )}
-                            </div>
                           </div>
                         </>
                       ) : (
@@ -995,6 +1180,7 @@ export default function PassengersPage() {
                                 value={passengers[index]?.dateOfBirth || ''}
                                 onChange={(iso) => setValue(`passengers.${index}.dateOfBirth`, iso, { shouldValidate: true })}
                                 error={errors.passengers?.[index]?.dateOfBirth?.message}
+                                passengerType={isChildPassenger ? 'CHILD' : 'ADULT'}
                               />
                             </div>
 
@@ -1024,32 +1210,6 @@ export default function PassengersPage() {
                                 disabled
                               />
                             </div>
-
-                            {/* Phone */}
-                            <div>
-                              <label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Phone Number *</label>
-                              <PhoneInput
-                                nationality={passengers[index]?.nationality || 'OTHER'}
-                                storedValue={passengers[index]?.phone || ''}
-                                onInterimChange={(v) => setValue(`passengers.${index}.phone`, v)}
-                                onNormalized={(v) => setValue(`passengers.${index}.phone`, v, { shouldValidate: true })}
-                                error={errors.passengers?.[index]?.phone?.message}
-                              />
-                            </div>
-
-                            {/* Email */}
-                            <div>
-                              <label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Email</label>
-                              <input
-                                type="email"
-                                {...register(`passengers.${index}.email`)}
-                                className={`input-field ${errors.passengers?.[index]?.email ? 'border-red-500' : ''}`}
-                                placeholder="email@example.com"
-                              />
-                              {errors.passengers?.[index]?.email && (
-                                <p className="text-red-500 text-xs mt-1">{errors.passengers[index]?.email?.message}</p>
-                              )}
-                            </div>
                           </div>
 
                           {/* Passport fields */}
@@ -1106,7 +1266,41 @@ export default function PassengersPage() {
                 </div>
               );
             })}
-            
+
+            <div className="card">
+              <h3 className="text-lg font-semibold mb-1 text-gray-900 dark:text-gray-100">Contact Information</h3>
+              <p className="text-sm text-gray-500 dark:text-gray-400 mb-4">
+                This phone number and email will be used for booking and ticketing communication for all passengers.
+              </p>
+              <div className="grid md:grid-cols-2 gap-4">
+                {/* Contact Phone */}
+                <div>
+                  <label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Phone Number *</label>
+                  <PhoneInput
+                    nationality={passengers[0]?.nationality || searchCriteria?.nationality || 'ETHIOPIAN'}
+                    storedValue={watch('contactPhone') || ''}
+                    onInterimChange={(v) => setValue('contactPhone', v)}
+                    onNormalized={(v) => setValue('contactPhone', v, { shouldValidate: true })}
+                    error={errors.contactPhone?.message}
+                  />
+                </div>
+
+                {/* Contact Email */}
+                <div>
+                  <label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">Email *</label>
+                  <input
+                    type="email"
+                    {...register('contactEmail')}
+                    className={`input-field ${errors.contactEmail ? 'border-red-500' : ''}`}
+                    placeholder="email@example.com"
+                  />
+                  {errors.contactEmail && (
+                    <p className="text-red-500 text-xs mt-1">{errors.contactEmail.message}</p>
+                  )}
+                </div>
+              </div>
+            </div>
+
             {!isAuthenticated && (
               <div className="card">
                 <label className="flex items-center gap-2 cursor-pointer">
@@ -1116,6 +1310,13 @@ export default function PassengersPage() {
               </div>
             )}
 
+            {submitError && (
+              <div className="p-3 bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-800 rounded-lg flex items-center gap-2">
+                <AlertCircle className="w-4 h-4 text-red-600 dark:text-red-400 flex-shrink-0" />
+                <p className="text-sm text-red-700 dark:text-red-300">{submitError}</p>
+              </div>
+            )}
+
             <div className="flex gap-4">
               <button type="button" onClick={() => {
                 const params = new URLSearchParams({
@@ -1132,8 +1333,10 @@ export default function PassengersPage() {
                 <ChevronLeft className="w-4 h-4" />
                 Back
               </button>
-              <button type="submit" className="btn-primary flex-1" disabled={saving}>
-                {saving ? 'Saving...' : 'Continue to seat selection'}
+              <button type="submit" className="btn-primary flex-1 flex items-center justify-center gap-2" disabled={saving}>
+                {saving
+                  ? <Loader2 className="w-4 h-4 animate-spin" />
+                  : 'Continue to seat selection'}
               </button>
             </div>
           </form>
diff --git a/apps/edr-passenger-web/portal/src/app/booking/payment/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/payment/page.tsx
index 989516839..730d2ad92 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/payment/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/payment/page.tsx
@@ -8,6 +8,8 @@ import { apiClient } from "@/lib/api-client";
 import { useState, useEffect } from "react";
 import { PaymentMethod } from "@/types";
 import { format } from "date-fns";
+import { formatTime, getTimePeriod } from '@/utils/format';
+import { calculatePassengerFare, isChild, isFirstChild, formatFare } from '@/utils/fare-utils';
 import {
   CreditCard,
   Smartphone,
@@ -65,21 +67,21 @@ export default function PaymentPage() {
     enabled: !!selectedMethod && !!bookingId,
   });
 
-  // Fallback: estimate from local store while API hasn't responded yet
-  const outboundBaseFare = isRoundTrip && outboundSchedule ? passengers.reduce(
-    (sum) => sum + (outboundSchedule.baseFareAdult || 0),
-    0,
-  ) : 0;
+  // Fallback: estimate from local store while API hasn't responded yet.
+  // Uses the same first-child-free calculation as the review page so the
+  // breakdown shown here matches what the passenger already saw there.
+  const outboundBaseFare = isRoundTrip && outboundSchedule ? passengers.reduce((sum, _, i) => {
+    return sum + calculatePassengerFare(passengers, i, outboundSchedule.baseFareAdult || 0);
+  }, 0) : 0;
 
-  const inboundBaseFare = isRoundTrip && inboundSchedule ? passengers.reduce(
-    (sum) => sum + (inboundSchedule.baseFareAdult || 0),
-    0,
-  ) : 0;
+  const inboundBaseFare = isRoundTrip && inboundSchedule ? passengers.reduce((sum, _, i) => {
+    return sum + calculatePassengerFare(passengers, i, inboundSchedule.baseFareAdult || 0);
+  }, 0) : 0;
 
-  const baseFare = isRoundTrip ? (outboundBaseFare + inboundBaseFare) : passengers.reduce(
-    (sum) => sum + (selectedSchedule?.baseFareAdult || 0),
-    0,
-  );
+  const baseFare = isRoundTrip ? (outboundBaseFare + inboundBaseFare) : passengers.reduce((sum, _, i) => {
+    const farePerPassenger = selectedSchedule?.baseFareAdult || (selectedSchedule as any)?.fareAdult || (selectedSchedule as any)?.price || 0;
+    return sum + calculatePassengerFare(passengers, i, farePerPassenger);
+  }, 0);
 
   // API returns amount in major units (e.g. 11602.5 DJF); convert to minor for display consistency
   const totalAmount = bookingAmountData != null
@@ -203,10 +205,12 @@ export default function PaymentPage() {
           <div className="flex-1 flex flex-col pl-2">
             <div className="pb-5">
               <div className="text-lg font-bold text-gray-900 dark:text-white">
-                {schedule?.departureTime ? format(new Date(schedule.departureTime), 'HH:mm') : '--:--'}
+                {schedule?.departureTime ? formatTime(schedule.departureTime) : '--:--'}
               </div>
               <div className="text-xs text-gray-500 dark:text-gray-400">
-                {schedule?.departureTime ? format(new Date(schedule.departureTime), 'EEE, MMM d') : ''}
+                {schedule?.departureTime
+                  ? `${format(new Date(schedule.departureTime), 'EEE, MMM d')} · ${getTimePeriod(schedule.departureTime)}`
+                  : ''}
               </div>
               <div className="text-sm font-semibold text-gray-900 dark:text-white mt-1">{schedule?.origin}</div>
             </div>
@@ -216,10 +220,12 @@ export default function PaymentPage() {
             </div>
             <div>
               <div className="text-lg font-bold text-gray-900 dark:text-white">
-                {schedule?.arrivalTime ? format(new Date(schedule.arrivalTime), 'HH:mm') : '--:--'}
+                {schedule?.arrivalTime ? formatTime(schedule.arrivalTime) : '--:--'}
               </div>
               <div className="text-xs text-gray-500 dark:text-gray-400">
-                {schedule?.arrivalTime ? format(new Date(schedule.arrivalTime), 'EEE, MMM d') : ''}
+                {schedule?.arrivalTime
+                  ? `${format(new Date(schedule.arrivalTime), 'EEE, MMM d')} · ${getTimePeriod(schedule.arrivalTime)}`
+                  : ''}
               </div>
               <div className="text-sm font-semibold text-gray-900 dark:text-white mt-1">{schedule?.destination}</div>
             </div>
@@ -240,7 +246,9 @@ export default function PaymentPage() {
     <div className="card space-y-4">
       <h2 className="text-base font-bold text-gray-900 dark:text-gray-100 pb-2 border-b border-gray-100 dark:border-gray-800">
         Order summary
-        <span className="ml-2 text-xs font-normal text-gray-500 dark:text-gray-400">Ref: {pnr}</span>
+        <span className="ml-2 text-xs font-normal text-gray-500 dark:text-gray-400">
+          Ref: <span className="font-bold text-gray-900 dark:text-gray-100">{pnr}</span>
+        </span>
       </h2>
 
       {isRoundTrip ? (
@@ -254,14 +262,58 @@ export default function PaymentPage() {
         <JourneyLeg schedule={selectedSchedule} label="Your journey" />
       )}
 
-      <div className="pt-2 border-t-2 border-gray-200 dark:border-gray-700 space-y-1.5">
-        <div className="flex justify-between text-sm text-gray-600 dark:text-gray-400">
-          <span>Passengers</span>
-          <span className="font-medium text-gray-900 dark:text-gray-100">
-            {passengers.length} passenger{passengers.length !== 1 ? 's' : ''}
-          </span>
-        </div>
-        <div className="flex justify-between items-center pt-1">
+      {/* Fare breakdown — same first-child-free logic as the review page */}
+      <div className="pt-2 border-t-2 border-gray-200 dark:border-gray-700 space-y-2">
+        <h3 className="text-sm font-bold text-gray-900 dark:text-gray-100">Fare breakdown</h3>
+        {passengers.map((p, i) => {
+          const outFare = outboundSchedule?.baseFareAdult || 0;
+          const inFare = inboundSchedule?.baseFareAdult || 0;
+          const onewayFare = selectedSchedule?.baseFareAdult || 0;
+
+          const outboundFare = calculatePassengerFare(passengers, i, outFare);
+          const inboundFare = calculatePassengerFare(passengers, i, inFare);
+          const oneWayFare = calculatePassengerFare(passengers, i, onewayFare);
+
+          const passengerTotal = isRoundTrip ? outboundFare + inboundFare : oneWayFare;
+          const isChildPassenger = isChild(p);
+          const isFreeChild = isChildPassenger && isFirstChild(passengers, i);
+
+          return (
+            <div key={i} className="border-b border-gray-100 dark:border-gray-800 pb-2 last:border-0">
+              <div className="flex justify-between mb-0.5">
+                <span className="text-sm font-medium text-gray-900 dark:text-gray-100 truncate max-w-[60%]">
+                  {p.name || `Passenger ${i + 1}`}
+                  {isChildPassenger && (
+                    <span className={`text-xs font-semibold ml-1 ${
+                      isFreeChild ? 'text-green-600' : 'text-blue-600'
+                    }`}>
+                      ({isFreeChild ? 'CHILD - FREE' : 'CHILD'})
+                    </span>
+                  )}
+                </span>
+                <span className="text-sm font-semibold text-gray-900 dark:text-gray-100">
+                  {formatFare(passengerTotal, displayCurrency)}
+                </span>
+              </div>
+              {isRoundTrip && (
+                <div className="pl-3 space-y-0.5 text-xs text-gray-500 dark:text-gray-400">
+                  <div className="flex justify-between">
+                    <span>Outbound {isFreeChild ? '(Free)' : ''}</span>
+                    <span>{formatFare(outboundFare, displayCurrency)}</span>
+                  </div>
+                  <div className="flex justify-between">
+                    <span>Return {isFreeChild ? '(Free)' : ''}</span>
+                    <span>{formatFare(inboundFare, displayCurrency)}</span>
+                  </div>
+                </div>
+              )}
+            </div>
+          );
+        })}
+      </div>
+
+      <div className="pt-2 border-t-2 border-gray-200 dark:border-gray-700">
+        <div className="flex justify-between items-center">
           <span className="font-bold text-gray-900 dark:text-gray-100">Total</span>
           <span className="text-xl font-bold text-primary flex items-center gap-1.5">
             {loadingAmount && (
@@ -311,6 +363,22 @@ export default function PaymentPage() {
         <div className="max-w-6xl mx-auto">
           <h1 className="text-2xl font-bold mb-4 text-gray-900 dark:text-gray-100">Complete payment</h1>
 
+          {/* Reservation confirmation banner */}
+          <div className="card bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 mb-4 flex items-start gap-3">
+            <CheckCircle className="w-6 h-6 text-green-600 dark:text-green-400 flex-shrink-0 mt-0.5" />
+            <div>
+              <p className="text-sm font-semibold text-green-800 dark:text-green-300">
+                Your booking is successfully reserved
+              </p>
+              <p className="text-sm text-green-700 dark:text-green-400 mt-0.5">
+                Booking Reference: <span className="font-bold">{pnr}</span>
+              </p>
+              <p className="text-xs text-green-700/80 dark:text-green-400/80 mt-1">
+                Please complete the payment below to confirm your booking. Your seats are held temporarily until payment is completed.
+              </p>
+            </div>
+          </div>
+
           {/* Payment Processing Overlay */}
           {isProcessing && (
             <div className="fixed inset-0 bg-black/60 flex items-center justify-center z-50">
diff --git a/apps/edr-passenger-web/portal/src/app/booking/payment/telebirr/failure/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/payment/telebirr/failure/page.tsx
index 04c2d8251..773afc79f 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/payment/telebirr/failure/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/payment/telebirr/failure/page.tsx
@@ -3,7 +3,7 @@
 import { useSearchParams, useRouter } from 'next/navigation';
 import { usePaymentStore } from '@/lib/payment-store';
 import { useEffect, Suspense } from 'react';
-import { XCircle, Loader2, RefreshCw, ChevronLeft } from 'lucide-react';
+import { XCircle, Loader2, ChevronLeft } from 'lucide-react';
 
 function TelebirrFailureContent() {
   const router = useRouter();
@@ -30,11 +30,6 @@ function TelebirrFailureContent() {
         {merchantOrderId && <p className="text-xs text-gray-400 mb-1">Order ID: {merchantOrderId}</p>}
         {trxRef && <p className="text-xs text-gray-400 mb-4">Ref: {trxRef}</p>}
         <div className="flex flex-col gap-3 mt-4">
-          <button onClick={() => router.push('/booking/payment')}
-            className="btn-primary w-full flex items-center justify-center gap-2">
-            <RefreshCw className="w-4 h-4" />
-            Try Again
-          </button>
           <button onClick={() => router.push('/booking/review')}
             className="btn-secondary w-full flex items-center justify-center gap-2">
             <ChevronLeft className="w-4 h-4" />
diff --git a/apps/edr-passenger-web/portal/src/app/booking/payment/waafi/failure/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/payment/waafi/failure/page.tsx
index 1e49d5889..6a32c388b 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/payment/waafi/failure/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/payment/waafi/failure/page.tsx
@@ -3,7 +3,7 @@
 import { useSearchParams, useRouter } from 'next/navigation';
 import { usePaymentStore } from '@/lib/payment-store';
 import { useEffect, Suspense } from 'react';
-import { XCircle, Loader2, RefreshCw, ChevronLeft } from 'lucide-react';
+import { XCircle, Loader2, ChevronLeft } from 'lucide-react';
 
 function WaafiFailureContent() {
   const router = useRouter();
@@ -33,11 +33,6 @@ function WaafiFailureContent() {
           <p className="text-xs text-gray-400 mb-4">Ref: {referenceId || transactionId}</p>
         )}
         <div className="flex flex-col gap-3 mt-4">
-          <button onClick={() => router.push('/booking/payment')}
-            className="btn-primary w-full flex items-center justify-center gap-2">
-            <RefreshCw className="w-4 h-4" />
-            Try Again
-          </button>
           <button onClick={() => router.push('/booking/review')}
             className="btn-secondary w-full flex items-center justify-center gap-2">
             <ChevronLeft className="w-4 h-4" />
diff --git a/apps/edr-passenger-web/portal/src/app/booking/results/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/results/page.tsx
index 2f053d98c..810e0689a 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/results/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/results/page.tsx
@@ -7,6 +7,7 @@ import { useBookingStore } from '@/lib/booking-store';
 import { Schedule } from '@/types';
 import { ArrowRight, Clock, Calendar, Users, ChevronLeft, Check, X, MapPin, Gift, Train, Bed, Armchair, Star } from 'lucide-react';
 import { format } from 'date-fns';
+import { formatTime, getTimePeriod } from '@/utils/format';
 import { useState, useEffect } from 'react';
 
 export default function ResultsPage() {
@@ -19,6 +20,10 @@ export default function ResultsPage() {
   );
   const [classModal, setClassModal] = useState<Schedule | null>(null);
   const [promoData, setPromoData] = useState<{ code: string; discount: string; message: string } | null>(null);
+  const [roundTripStep, setRoundTripStep] = useState<'outbound' | 'inbound'>(() => {
+    const { outboundSchedule, searchCriteria: sc } = useBookingStore.getState();
+    return outboundSchedule && sc?.tripType === 'ROUND_TRIP' ? 'inbound' : 'outbound';
+  });
 
   const searchCriteria = useBookingStore((s) => s.searchCriteria);
   const setSearchCriteria = useBookingStore((s) => s.setSearchCriteria);
@@ -28,7 +33,7 @@ export default function ResultsPage() {
     destinationStationId: searchParams.get('destination') || searchCriteria?.destinationStationId || '',
     date: searchParams.get('date') || searchCriteria?.departureDate || '',
     returnDate: searchParams.get('returnDate') || searchCriteria?.returnDate,
-    journeyType: searchParams.get('tripType') === 'ROUND_TRIP' ? 'ROUND_TRIP' : 'ONE_WAY',
+    journeyType: (searchParams.get('tripType') ?? searchCriteria?.tripType ?? 'ONE_WAY') === 'ROUND_TRIP' ? 'ROUND_TRIP' : 'ONE_WAY',
     adultCount: parseInt(searchParams.get('adults') || '') || searchCriteria?.adultCount || 1,
     childCount: parseInt(searchParams.get('children') || '') || searchCriteria?.childCount || 0,
     nationality: searchParams.get('nationality') || searchCriteria?.nationality || 'ETHIOPIAN',
@@ -111,6 +116,8 @@ export default function ResultsPage() {
       return response;
     },
     enabled: !!searchData.originStationId && !!searchData.destinationStationId,
+    staleTime: 0,
+    gcTime: 0,
   });
 
   const isRoundTrip = searchData.journeyType === 'ROUND_TRIP';
@@ -188,18 +195,13 @@ export default function ResultsPage() {
       seatClassName: (selectedCoachType as any).seatClassName || selectedCoachType.name,
     };
 
-    // For round trip, store outbound and wait for inbound selection
+    // For round trip, store outbound and advance to inbound step
     if (isRoundTrip && isOutbound) {
       setOutboundScheduleData(scheduleData);
       setOutboundSchedule(scheduleData);
       setClassModal(null);
-      // Scroll to inbound section
-      setTimeout(() => {
-        const inboundSection = document.getElementById('inbound-section');
-        if (inboundSection) {
-          inboundSection.scrollIntoView({ behavior: 'smooth', block: 'start' });
-        }
-      }, 100);
+      setRoundTripStep('inbound');
+      window.scrollTo({ top: 0, behavior: 'smooth' });
       return;
     }
 
@@ -256,10 +258,10 @@ export default function ResultsPage() {
             <div className="flex items-center gap-4">
               <div className="text-center">
                 <div className="text-3xl font-bold text-gray-900 dark:text-gray-100">
-                  {schedule.departureAt ? format(new Date(schedule.departureAt), 'HH:mm') : '--:--'}
+                  {schedule.departureAt ? formatTime(schedule.departureAt) : '--:--'}
                 </div>
                 <div className="text-xs text-gray-500 dark:text-gray-400 mt-0.5">
-                  {schedule.departureAt ? format(new Date(schedule.departureAt), 'MMM d') : ''}
+                  {schedule.departureAt ? `${format(new Date(schedule.departureAt), 'MMM d')} · ${getTimePeriod(schedule.departureAt)}` : ''}
                 </div>
                 <div className="text-sm text-gray-600 dark:text-gray-400 mt-1">{schedule.origin?.name || 'Origin'}</div>
               </div>
@@ -283,10 +285,10 @@ export default function ResultsPage() {
 
               <div className="text-center">
                 <div className="text-3xl font-bold text-gray-900 dark:text-gray-100">
-                  {schedule.arrivalAt ? format(new Date(schedule.arrivalAt), 'HH:mm') : '--:--'}
+                  {schedule.arrivalAt ? formatTime(schedule.arrivalAt) : '--:--'}
                 </div>
                 <div className="text-xs text-gray-500 dark:text-gray-400 mt-0.5 flex items-center justify-center gap-1">
-                  <span>{schedule.arrivalAt ? format(new Date(schedule.arrivalAt), 'MMM d') : ''}</span>
+                  <span>{schedule.arrivalAt ? `${format(new Date(schedule.arrivalAt), 'MMM d')} · ${getTimePeriod(schedule.arrivalAt)}` : ''}</span>
                   {isNextDay && <span className="text-orange-500 font-medium">(+1)</span>}
                 </div>
                 <div className="text-sm text-gray-600 dark:text-gray-400 mt-1">{schedule.destination?.name || 'Destination'}</div>
@@ -699,6 +701,33 @@ export default function ResultsPage() {
               Modify search
             </button>
             <h1 className="section-title">Available schedules</h1>
+            {isRoundTrip && (
+              <div className="flex items-center gap-3 mt-4">
+                <div className={`flex items-center gap-2 px-4 py-2 rounded-full text-sm font-semibold transition-all ${
+                  roundTripStep === 'inbound'
+                    ? 'bg-green-100 dark:bg-green-900/30 text-green-700 dark:text-green-300'
+                    : 'bg-primary text-white shadow-md shadow-primary/30'
+                }`}>
+                  {roundTripStep === 'inbound'
+                    ? <Check className="w-3.5 h-3.5" />
+                    : <span className="text-xs leading-none">1</span>}
+                  <span>Outbound</span>
+                </div>
+                <div className="flex items-center gap-1">
+                  <div className="w-4 h-0.5 bg-gray-300 dark:bg-gray-600" />
+                  <ArrowRight className="w-3 h-3 text-gray-400" />
+                  <div className="w-4 h-0.5 bg-gray-300 dark:bg-gray-600" />
+                </div>
+                <div className={`flex items-center gap-2 px-4 py-2 rounded-full text-sm font-semibold transition-all ${
+                  roundTripStep === 'inbound'
+                    ? 'bg-primary text-white shadow-md shadow-primary/30'
+                    : 'bg-gray-100 dark:bg-gray-800 text-gray-400 dark:text-gray-500'
+                }`}>
+                  <span className="text-xs leading-none">2</span>
+                  <span>Return</span>
+                </div>
+              </div>
+            )}
             <div className="hidden sm:flex flex-wrap items-center gap-4 text-gray-600 dark:text-gray-400 mt-3">
               <div className="flex items-center gap-2">
                 <Calendar className="w-4 h-4" />
@@ -718,39 +747,74 @@ export default function ResultsPage() {
           </div>
 
           <div className="space-y-8">
-            {outboundSchedules.length > 0 && (
-              <div>
-                {isRoundTrip && (
+            {isRoundTrip ? (
+              roundTripStep === 'outbound' ? (
+                <div>
                   <div className="mb-4">
                     <h2 className="text-xl font-bold text-gray-900 dark:text-white flex items-center gap-2">
                       <ArrowRight className="w-5 h-5 text-primary" />
-                      Outbound Journey
+                      Select Outbound Journey
                     </h2>
                     <p className="text-sm text-gray-500 dark:text-gray-400 mt-1">
                       {searchData.date ? format(new Date(searchData.date), 'EEEE, MMMM d, yyyy') : ''}
                     </p>
                   </div>
-                )}
-                <div className="space-y-4">
-                  {outboundSchedules.map((schedule: Schedule) => renderScheduleCard(schedule, true))}
+                  <div className="space-y-4">
+                    {outboundSchedules.map((schedule: Schedule) => renderScheduleCard(schedule, true))}
+                  </div>
                 </div>
-              </div>
-            )}
-
-            {isRoundTrip && inboundSchedules.length > 0 && outboundScheduleData && (
-              <div id="inbound-section">
-                <div className="mb-4">
-                  <h2 className="text-xl font-bold text-gray-900 dark:text-white flex items-center gap-2">
-                    <ArrowRight className="w-5 h-5 text-primary rotate-180" />
-                    Return Journey
-                  </h2>
-                  <p className="text-sm text-gray-500 dark:text-gray-400 mt-1">
-                    {searchData.returnDate ? format(new Date(searchData.returnDate), 'EEEE, MMMM d, yyyy') : ''}
-                  </p>
-                </div>
-                <div className="space-y-4">
-                  {inboundSchedules.map((schedule: Schedule) => renderScheduleCard(schedule))}
+              ) : (
+                <div>
+                  {outboundScheduleData && (
+                    <div className="mb-6 bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 rounded-xl p-4 flex items-center justify-between">
+                      <div className="flex items-center gap-3">
+                        <div className="w-8 h-8 bg-green-100 dark:bg-green-900/40 rounded-full flex items-center justify-center flex-shrink-0">
+                          <Check className="w-4 h-4 text-green-600 dark:text-green-400" />
+                        </div>
+                        <div>
+                          <p className="text-sm font-semibold text-green-900 dark:text-green-200">Outbound journey selected</p>
+                          <p className="text-xs text-green-700 dark:text-green-400 mt-0.5">
+                            {outboundScheduleData.origin} → {outboundScheduleData.destination}
+                            {outboundScheduleData.selectedSeatClassName ? ` · ${outboundScheduleData.selectedSeatClassName}` : ''}
+                          </p>
+                        </div>
+                      </div>
+                      <button
+                        onClick={() => {
+                          setRoundTripStep('outbound');
+                          const prevId = outboundScheduleData?.id;
+                          setOutboundScheduleData(null);
+                          if (prevId) {
+                            setSelectedCoachTypes(prev => {
+                              const next = { ...prev };
+                              delete next[prevId];
+                              return next;
+                            });
+                          }
+                        }}
+                        className="text-xs font-semibold text-primary hover:underline flex-shrink-0 ml-4"
+                      >
+                        Change
+                      </button>
+                    </div>
+                  )}
+                  <div className="mb-4">
+                    <h2 className="text-xl font-bold text-gray-900 dark:text-white flex items-center gap-2">
+                      <ArrowRight className="w-5 h-5 text-primary rotate-180" />
+                      Select Return Journey
+                    </h2>
+                    <p className="text-sm text-gray-500 dark:text-gray-400 mt-1">
+                      {searchData.returnDate ? format(new Date(searchData.returnDate), 'EEEE, MMMM d, yyyy') : ''}
+                    </p>
+                  </div>
+                  <div className="space-y-4" id="inbound-section">
+                    {inboundSchedules.map((schedule: Schedule) => renderScheduleCard(schedule, false))}
+                  </div>
                 </div>
+              )
+            ) : (
+              <div className="space-y-4">
+                {outboundSchedules.map((schedule: Schedule) => renderScheduleCard(schedule, true))}
               </div>
             )}
           </div>
diff --git a/apps/edr-passenger-web/portal/src/app/booking/review/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/review/page.tsx
index 67422ad69..3e7abd2d3 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/review/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/review/page.tsx
@@ -6,6 +6,7 @@ import { useAuthStore } from '@/lib/auth-store';
 import { useMutation } from '@tanstack/react-query';
 import { apiClient } from '@/lib/api-client';
 import { format } from 'date-fns';
+import { formatTime, getTimePeriod } from '@/utils/format';
 import { useState, useEffect } from 'react';
 import { ChevronLeft } from 'lucide-react';
 import { calculatePassengerFare, isChild, isFirstChild, formatFare } from '@/utils/fare-utils';
@@ -93,6 +94,14 @@ export default function ReviewPage() {
     return suffix ? `${base}${suffix}` : base;
   };
 
+  // The seat class/category is chosen once per leg (coach type selected on /booking/seats),
+  // so every seat on that leg shares it — no need to look it up per-seat.
+  const formatSeatClass = (schedule: any): string => {
+    const raw = schedule?.selectedSeatClassName || schedule?.seatClassName || schedule?.selectedSeatClass;
+    if (!raw) return 'Standard';
+    return String(raw).replace(/_/g, ' ');
+  };
+
   useEffect(() => {
     const fetchSeatDetails = async () => {
       try {
@@ -525,10 +534,12 @@ export default function ReviewPage() {
                     {/* Origin */}
                     <div className="pb-8">
                       <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                        {outboundSchedule.departureTime ? format(new Date(outboundSchedule.departureTime), 'HH:mm') : '--:--'}
+                        {outboundSchedule.departureTime ? formatTime(outboundSchedule.departureTime) : '--:--'}
                       </div>
                       <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                        {outboundSchedule.departureTime ? format(new Date(outboundSchedule.departureTime), 'EEE, MMM d') : 'N/A'}
+                        {outboundSchedule.departureTime
+                          ? `${format(new Date(outboundSchedule.departureTime), 'EEE, MMM d')} · ${getTimePeriod(outboundSchedule.departureTime)}`
+                          : 'N/A'}
                       </div>
                       <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                         {outboundSchedule.origin}
@@ -556,10 +567,12 @@ export default function ReviewPage() {
                     {/* Destination */}
                     <div>
                       <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                        {outboundSchedule.arrivalTime ? format(new Date(outboundSchedule.arrivalTime), 'HH:mm') : '--:--'}
+                        {outboundSchedule.arrivalTime ? formatTime(outboundSchedule.arrivalTime) : '--:--'}
                       </div>
                       <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                        {outboundSchedule.arrivalTime ? format(new Date(outboundSchedule.arrivalTime), 'EEE, MMM d') : 'N/A'}
+                        {outboundSchedule.arrivalTime
+                          ? `${format(new Date(outboundSchedule.arrivalTime), 'EEE, MMM d')} · ${getTimePeriod(outboundSchedule.arrivalTime)}`
+                          : 'N/A'}
                       </div>
                       <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                         {outboundSchedule.destination}
@@ -598,10 +611,12 @@ export default function ReviewPage() {
                     {/* Origin */}
                     <div className="pb-8">
                       <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                        {inboundSchedule.departureTime ? format(new Date(inboundSchedule.departureTime), 'HH:mm') : '--:--'}
+                        {inboundSchedule.departureTime ? formatTime(inboundSchedule.departureTime) : '--:--'}
                       </div>
                       <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                        {inboundSchedule.departureTime ? format(new Date(inboundSchedule.departureTime), 'EEE, MMM d') : 'N/A'}
+                        {inboundSchedule.departureTime
+                          ? `${format(new Date(inboundSchedule.departureTime), 'EEE, MMM d')} · ${getTimePeriod(inboundSchedule.departureTime)}`
+                          : 'N/A'}
                       </div>
                       <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                         {inboundSchedule.origin}
@@ -629,10 +644,12 @@ export default function ReviewPage() {
                     {/* Destination */}
                     <div>
                       <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                        {inboundSchedule.arrivalTime ? format(new Date(inboundSchedule.arrivalTime), 'HH:mm') : '--:--'}
+                        {inboundSchedule.arrivalTime ? formatTime(inboundSchedule.arrivalTime) : '--:--'}
                       </div>
                       <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                        {inboundSchedule.arrivalTime ? format(new Date(inboundSchedule.arrivalTime), 'EEE, MMM d') : 'N/A'}
+                        {inboundSchedule.arrivalTime
+                          ? `${format(new Date(inboundSchedule.arrivalTime), 'EEE, MMM d')} · ${getTimePeriod(inboundSchedule.arrivalTime)}`
+                          : 'N/A'}
                       </div>
                       <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                         {inboundSchedule.destination}
@@ -671,10 +688,12 @@ export default function ReviewPage() {
                     {/* Origin */}
                     <div className="pb-8">
                       <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                        {selectedSchedule.departureTime ? format(new Date(selectedSchedule.departureTime), 'HH:mm') : '--:--'}
+                        {selectedSchedule.departureTime ? formatTime(selectedSchedule.departureTime) : '--:--'}
                       </div>
                       <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                        {selectedSchedule.departureTime ? format(new Date(selectedSchedule.departureTime), 'EEE, MMM d') : 'N/A'}
+                        {selectedSchedule.departureTime
+                          ? `${format(new Date(selectedSchedule.departureTime), 'EEE, MMM d')} · ${getTimePeriod(selectedSchedule.departureTime)}`
+                          : 'N/A'}
                       </div>
                       <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                         {selectedSchedule.origin}
@@ -702,10 +721,12 @@ export default function ReviewPage() {
                     {/* Destination */}
                     <div>
                       <div className="text-2xl font-bold text-gray-900 dark:text-white">
-                        {selectedSchedule.arrivalTime ? format(new Date(selectedSchedule.arrivalTime), 'HH:mm') : '--:--'}
+                        {selectedSchedule.arrivalTime ? formatTime(selectedSchedule.arrivalTime) : '--:--'}
                       </div>
                       <div className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
-                        {selectedSchedule.arrivalTime ? format(new Date(selectedSchedule.arrivalTime), 'EEE, MMM d') : 'N/A'}
+                        {selectedSchedule.arrivalTime
+                          ? `${format(new Date(selectedSchedule.arrivalTime), 'EEE, MMM d')} · ${getTimePeriod(selectedSchedule.arrivalTime)}`
+                          : 'N/A'}
                       </div>
                       <div className="text-base font-semibold text-gray-900 dark:text-white mt-2">
                         {selectedSchedule.destination}
@@ -736,18 +757,27 @@ export default function ReviewPage() {
                           <p className="font-semibold text-sm text-gray-900 dark:text-gray-100">
                             {(p as any).outboundSeatId ? (seatDetails[`outbound-${(p as any).outboundSeatId}`] || 'Loading...') : 'Auto-assign'}
                           </p>
+                          {(p as any).outboundSeatId && (
+                            <p className="text-[10px] text-gray-400 dark:text-gray-500 mt-0.5">{formatSeatClass(outboundSchedule)}</p>
+                          )}
                         </div>
                         <div className="bg-gray-50 dark:bg-gray-800 rounded-lg p-2">
                           <p className="text-xs text-gray-500 dark:text-gray-400">Return Seat</p>
                           <p className="font-semibold text-sm text-gray-900 dark:text-gray-100">
                             {(p as any).inboundSeatId ? (seatDetails[`inbound-${(p as any).inboundSeatId}`] || 'Loading...') : 'Auto-assign'}
                           </p>
+                          {(p as any).inboundSeatId && (
+                            <p className="text-[10px] text-gray-400 dark:text-gray-500 mt-0.5">{formatSeatClass(inboundSchedule)}</p>
+                          )}
                         </div>
                       </div>
                     ) : (
                       <div className="text-right">
                         <p className="text-sm text-gray-600 dark:text-gray-400">Seat</p>
                         <p className="font-medium text-gray-900 dark:text-gray-100">{p.seatId ? (seatDetails[p.seatId] || 'Loading...') : 'Auto-assign'}</p>
+                        {p.seatId && (
+                          <p className="text-[10px] text-gray-400 dark:text-gray-500 mt-0.5">{formatSeatClass(selectedSchedule)}</p>
+                        )}
                       </div>
                     )}
                   </div>
diff --git a/apps/edr-passenger-web/portal/src/app/booking/search/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/search/page.tsx
index bb6340d0a..92e0ced68 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/search/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/search/page.tsx
@@ -4,14 +4,13 @@ import { useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 import { useRouter, useSearchParams } from "next/navigation";
-import { useQuery } from "@tanstack/react-query";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { useAuthStore } from "@/lib/auth-store";
 import { apiClient } from "@/lib/api-client";
 import { useBookingStore } from "@/lib/booking-store";
 import { Station } from "@/types";
 import {
   MapPin,
-  ArrowRight,
   ArrowLeftRight,
   Plus,
   Minus,
@@ -23,7 +22,6 @@ import {
   X,
   ChevronLeft,
   Clock,
-  Zap,
 } from "lucide-react";
 import { useEffect, useRef, useState, useCallback } from "react";
 import ModernDatePicker from "@/components/ModernDatePicker";
@@ -79,12 +77,6 @@ const searchSchema = z
 
 type SearchForm = z.infer<typeof searchSchema>;
 
-const POPULAR_ROUTES = [
-  { from: "Sebeta", to: "Nagad", duration: "12h", icon: "🌆" },
-  { from: "Sebeta", to: "Diredawa", duration: "8h", icon: "🏔️" },
-  { from: "Diredawa", to: "Nagad", duration: "4h", icon: "🌊" },
-];
-
 // ─── Station Modal ────────────────────────────────────────────────────────────
 function StationModal({
   stations,
@@ -530,6 +522,8 @@ export default function SearchPage() {
   const router = useRouter();
   const searchParams = useSearchParams();
   const setSearchCriteria = useBookingStore((s) => s.setSearchCriteria);
+  const clearBooking = useBookingStore((s) => s.clearBooking);
+  const queryClient = useQueryClient();
   const { user, isAuthenticated } = useAuthStore();
 
   const [passengerModalOpen, setPassengerModalOpen] = useState(false);
@@ -701,7 +695,10 @@ export default function SearchPage() {
 
   const onSubmit = (data: SearchForm) => {
     setHasInteracted(true);
+    // Clear previous booking selections and search cache before starting a new search
+    clearBooking();
     setSearchCriteria(data);
+    queryClient.removeQueries({ queryKey: ["search"] });
     if (data.originStationId) saveRecent(data.originStationId);
     if (data.destinationStationId) saveRecent(data.destinationStationId);
     const params = new URLSearchParams({
@@ -723,20 +720,6 @@ export default function SearchPage() {
   const originStation = getStationById(originId);
   const destStation = getStationById(destId);
 
-  const handlePopularRoute = (fromName: string, toName: string) => {
-    const origin = stations.find((s) =>
-      s.name.toLowerCase().includes(fromName.toLowerCase()),
-    );
-    const dest = stations.find((s) =>
-      s.name.toLowerCase().includes(toName.toLowerCase()),
-    );
-    if (origin && dest) {
-      setValue("originStationId", origin.id);
-      setValue("destinationStationId", dest.id);
-      window.scrollTo({ top: 0, behavior: "smooth" });
-    }
-  };
-
   return (
     <div className="bg-gray-50 dark:bg-gray-950">
       {/* Passenger modal (mobile) */}
@@ -790,9 +773,15 @@ export default function SearchPage() {
       )}
 
       {/* ── 90vh hero with banner image ── */}
+      {/* Round trip stacks an extra Return Date field into the widget on mobile, which grows
+          upward from its bottom-anchored position — give the hero extra height there so the
+          widget's top edge doesn't creep up into the sticky header. */}
       <section
-        className="relative"
-        style={{ height: "90vh", minHeight: "560px" }}
+        className={`relative ${
+          tripType === "ROUND_TRIP"
+            ? "h-[calc(90vh+60px)] min-h-[670px] md:h-[90vh] md:min-h-[560px]"
+            : "h-[94vh] min-h-[560px]"
+        }`}
       >
         {/* Background image with zoom - fully isolated */}
         <div className="absolute inset-0 overflow-hidden">
@@ -956,7 +945,7 @@ export default function SearchPage() {
                       <label className="text-xs font-semibold text-gray-500 uppercase tracking-wide">
                         Date
                       </label>
-                      <div className="relative z-30">
+                      <div>
                         <ModernDatePicker
                           value={
                             departureDate
@@ -980,7 +969,7 @@ export default function SearchPage() {
                         <label className="text-xs font-semibold text-gray-500 uppercase tracking-wide">
                           Return Date
                         </label>
-                        <div className="relative z-20">
+                        <div>
                           <ModernDatePicker
                             value={
                               returnDate
@@ -1059,7 +1048,11 @@ export default function SearchPage() {
                               clearErrors("originStationId");
                               clearErrors("destinationStationId");
                             }}
-                            error={hasInteracted ? errors.originStationId?.message : undefined}
+                            error={
+                              hasInteracted
+                                ? errors.originStationId?.message
+                                : undefined
+                            }
                             onOpen={scrollWidgetIntoView}
                           />
                           {hasInteracted && errors.originStationId && (
@@ -1094,7 +1087,11 @@ export default function SearchPage() {
                               if (s.id) saveRecent(s.id);
                               clearErrors("destinationStationId");
                             }}
-                            error={hasInteracted ? errors.destinationStationId?.message : undefined}
+                            error={
+                              hasInteracted
+                                ? errors.destinationStationId?.message
+                                : undefined
+                            }
                             onOpen={scrollWidgetIntoView}
                           />
                           {hasInteracted && errors.destinationStationId && (
@@ -1110,7 +1107,7 @@ export default function SearchPage() {
                           <label className="text-xs font-semibold text-gray-500 uppercase tracking-wide">
                             Date
                           </label>
-                          <div className="relative z-30">
+                          <div>
                             <ModernDatePicker
                               value={
                                 departureDate
@@ -1191,7 +1188,11 @@ export default function SearchPage() {
                                 clearErrors("originStationId");
                                 clearErrors("destinationStationId");
                               }}
-                              error={hasInteracted ? errors.originStationId?.message : undefined}
+                              error={
+                                hasInteracted
+                                  ? errors.originStationId?.message
+                                  : undefined
+                              }
                               onOpen={scrollWidgetIntoView}
                             />
                             {hasInteracted && errors.originStationId && (
@@ -1226,7 +1227,11 @@ export default function SearchPage() {
                                 if (s.id) saveRecent(s.id);
                                 clearErrors("destinationStationId");
                               }}
-                              error={hasInteracted ? errors.destinationStationId?.message : undefined}
+                              error={
+                                hasInteracted
+                                  ? errors.destinationStationId?.message
+                                  : undefined
+                              }
                               onOpen={scrollWidgetIntoView}
                             />
                             {hasInteracted && errors.destinationStationId && (
@@ -1242,7 +1247,7 @@ export default function SearchPage() {
                             <label className="text-xs font-semibold text-gray-500 uppercase tracking-wide">
                               Departure
                             </label>
-                            <div className="relative z-30">
+                            <div>
                               <ModernDatePicker
                                 value={
                                   departureDate
@@ -1272,7 +1277,7 @@ export default function SearchPage() {
                             <label className="text-xs font-semibold text-gray-500 uppercase tracking-wide">
                               Return
                             </label>
-                            <div className="relative z-20">
+                            <div>
                               <ModernDatePicker
                                 value={
                                   returnDate
@@ -1497,142 +1502,6 @@ export default function SearchPage() {
         </div>
       </section>
 
-      {/* Popular Routes — below hero */}
-      <div className="bg-gray-50 dark:bg-gray-950 py-10">
-        <div className="container mx-auto px-4">
-          <div className="max-w-6xl mx-auto">
-            <div className="flex items-center gap-2 mb-4">
-              <Zap className="w-4 h-4 text-primary" />
-              <h2 className="text-base font-bold text-gray-900 dark:text-white">
-                Popular Routes
-              </h2>
-            </div>
-            <div className="grid grid-cols-1 sm:grid-cols-3 gap-3">
-              {POPULAR_ROUTES.map((route, idx) => (
-                <button
-                  key={idx}
-                  type="button"
-                  onClick={() => handlePopularRoute(route.from, route.to)}
-                  className="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded-xl p-4 hover:border-primary hover:shadow-md transition-all text-left active:scale-95"
-                >
-                  <div className="text-xl mb-2">{route.icon}</div>
-                  <div className="flex items-center gap-1.5 text-sm font-semibold text-gray-900 dark:text-white">
-                    <span>{route.from}</span>
-                    <ArrowRight className="w-3.5 h-3.5 text-primary flex-shrink-0" />
-                    <span>{route.to}</span>
-                  </div>
-                  <div className="text-xs text-gray-400 mt-1 flex items-center gap-1">
-                    <Clock className="w-3 h-3" />
-                    {route.duration} journey
-                  </div>
-                </button>
-              ))}
-            </div>
-          </div>
-        </div>
-      </div>
-
-      {/* Promotions Section */}
-      <div className="bg-white dark:bg-gray-900 py-12">
-        <div className="container mx-auto px-4">
-          <div className="max-w-6xl mx-auto">
-            <div className="flex items-center gap-2 mb-6">
-              <span className="text-lg">🎁</span>
-              <h2 className="text-base font-bold text-gray-900 dark:text-white">
-                Offers &amp; Promotions
-              </h2>
-            </div>
-            <div className="grid grid-cols-1 md:grid-cols-3 gap-5">
-              {/* Wide promo card */}
-              <div className="md:col-span-2 relative rounded-2xl overflow-hidden min-h-[220px] group cursor-pointer">
-                <div className="absolute inset-0 bg-gradient-to-br from-[rgb(14,80,54)] to-[rgb(20,140,90)]" />
-                <div
-                  className="absolute inset-0 opacity-10"
-                  style={{
-                    backgroundImage:
-                      "repeating-linear-gradient(45deg, transparent, transparent 20px, rgba(255,255,255,0.3) 20px, rgba(255,255,255,0.3) 21px)",
-                  }}
-                />
-                <div className="absolute inset-0 bg-gradient-to-r from-black/30 to-transparent" />
-                <div className="relative z-10 p-7 flex flex-col justify-between h-full min-h-[220px]">
-                  <div>
-                    <span className="inline-block px-3 py-1 bg-white/20 text-white text-xs font-semibold rounded-full mb-3 backdrop-blur-sm">
-                      Limited Time
-                    </span>
-                    <h3 className="text-2xl font-extrabold text-white leading-tight mb-2">
-                      20% Off Weekend
-                      <br />
-                      Travel
-                    </h3>
-                    <p className="text-white/70 text-sm max-w-xs">
-                      Book any weekend journey and save 20%. Valid for all seat
-                      classes.
-                    </p>
-                  </div>
-                  <div className="flex items-center justify-between mt-4">
-                    <span className="text-white/60 text-xs">
-                      Valid until 31 Dec 2024
-                    </span>
-                    <span className="flex items-center gap-1.5 text-white text-sm font-semibold group-hover:gap-3 transition-all">
-                      Book now <ArrowRight className="w-4 h-4" />
-                    </span>
-                  </div>
-                </div>
-              </div>
-
-              {/* Narrow promo cards */}
-              <div className="flex flex-col gap-5">
-                <div className="relative rounded-2xl overflow-hidden min-h-[100px] group cursor-pointer">
-                  <div className="absolute inset-0 bg-gradient-to-br from-amber-500 to-orange-600" />
-                  <div className="absolute inset-0 bg-gradient-to-r from-black/20 to-transparent" />
-                  <div className="relative z-10 p-5 flex flex-col justify-between h-full min-h-[100px]">
-                    <div>
-                      <span className="inline-block px-2.5 py-0.5 bg-white/25 text-white text-xs font-semibold rounded-full mb-2 backdrop-blur-sm">
-                        New
-                      </span>
-                      <h3 className="text-lg font-bold text-white leading-tight">
-                        Family Package
-                      </h3>
-                      <p className="text-white/75 text-xs mt-1">
-                        4 tickets for the price of 3
-                      </p>
-                    </div>
-                    <div className="flex items-center justify-end mt-3">
-                      <span className="flex items-center gap-1 text-white text-xs font-semibold group-hover:gap-2 transition-all">
-                        Learn more <ArrowRight className="w-3.5 h-3.5" />
-                      </span>
-                    </div>
-                  </div>
-                </div>
-
-                <div className="relative rounded-2xl overflow-hidden min-h-[100px] group cursor-pointer">
-                  <div className="absolute inset-0 bg-gradient-to-br from-blue-600 to-indigo-700" />
-                  <div className="absolute inset-0 bg-gradient-to-r from-black/20 to-transparent" />
-                  <div className="relative z-10 p-5 flex flex-col justify-between h-full min-h-[100px]">
-                    <div>
-                      <span className="inline-block px-2.5 py-0.5 bg-white/25 text-white text-xs font-semibold rounded-full mb-2 backdrop-blur-sm">
-                        Student
-                      </span>
-                      <h3 className="text-lg font-bold text-white leading-tight">
-                        Student Discount
-                      </h3>
-                      <p className="text-white/75 text-xs mt-1">
-                        15% off with valid student ID
-                      </p>
-                    </div>
-                    <div className="flex items-center justify-end mt-3">
-                      <span className="flex items-center gap-1 text-white text-xs font-semibold group-hover:gap-2 transition-all">
-                        Learn more <ArrowRight className="w-3.5 h-3.5" />
-                      </span>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
       <style jsx>{`
         @keyframes slide-up {
           from {
diff --git a/apps/edr-passenger-web/portal/src/app/booking/seats/page.tsx b/apps/edr-passenger-web/portal/src/app/booking/seats/page.tsx
index a02f00eec..d8fdd4da6 100644
--- a/apps/edr-passenger-web/portal/src/app/booking/seats/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/booking/seats/page.tsx
@@ -21,7 +21,7 @@ const buildSeatLabel = (seat: any): string => {
   return suffix ? `${base}${suffix}` : base;
 };
 
-const BedCard = memo(({ bed, isSelected, onToggle }: any) => {
+const BedCard = memo(({ bed, isSelected, isAssignedToOther, onToggle }: any) => {
   const seatLabel = bed.label || bed.seatNumber || bed.number || "?";
   const bedPosition = bed.bedPosition || "";
   const bedType =
@@ -30,21 +30,28 @@ const BedCard = memo(({ bed, isSelected, onToggle }: any) => {
       : bedPosition === "middle"
         ? "Middle"
         : "Lower";
+  const isDisabled = bed.status !== "AVAILABLE" || isAssignedToOther;
 
   return (
     <button
       onClick={() => onToggle(bed.id)}
-      disabled={bed.status !== "AVAILABLE"}
+      disabled={isDisabled}
       className={`relative flex flex-col items-center justify-center gap-1 px-3 py-2 rounded-lg transition-all ${
         isSelected
           ? "bg-blue-50 border-2 border-blue-500 dark:bg-blue-900/20 dark:border-blue-400"
-          : bed.status === "AVAILABLE"
-            ? "bg-green-50 border border-green-300 hover:bg-green-100 dark:bg-green-900/20 dark:border-green-700"
-            : bed.status === "BOOKED"
-              ? "bg-red-50 border border-red-300 cursor-not-allowed dark:bg-red-900/20 dark:border-red-700"
-              : "bg-gray-100 border border-gray-300 cursor-not-allowed dark:bg-gray-800 dark:border-gray-700"
+          : isAssignedToOther
+            ? "bg-purple-50 border border-purple-300 cursor-not-allowed dark:bg-purple-900/20 dark:border-purple-700"
+            : bed.status === "AVAILABLE"
+              ? "bg-green-50 border border-green-300 hover:bg-green-100 dark:bg-green-900/20 dark:border-green-700"
+              : bed.status === "BOOKED"
+                ? "bg-red-50 border border-red-300 cursor-not-allowed dark:bg-red-900/20 dark:border-red-700"
+                : "bg-gray-100 border border-gray-300 cursor-not-allowed dark:bg-gray-800 dark:border-gray-700"
       }`}
-      title={`Bed ${seatLabel} - ${bedType} - ${bed.status}`}
+      title={
+        isAssignedToOther
+          ? `Bed ${seatLabel} - already assigned to another passenger`
+          : `Bed ${seatLabel} - ${bedType} - ${bed.status}`
+      }
     >
       <Image src="/bed.png" alt="bed" width={32} height={32} className="object-contain" />
       <div className="text-xs font-bold text-gray-900 dark:text-white">
@@ -63,6 +70,7 @@ const SeatButton = memo(
   ({
     seat,
     isSelected,
+    isAssignedToOther,
     onToggle,
     isBedCoach,
     bedLabel,
@@ -71,22 +79,29 @@ const SeatButton = memo(
     const seatLabel = seat.number || seat.label || seat.seatNumber || "?";
     const bedWidth = "w-24";
     const width = isBedCoach ? bedWidth : "w-10";
+    const isDisabled = seat.status !== "AVAILABLE" || isAssignedToOther;
 
     return (
       <div className="flex flex-col items-center">
         <button
           onClick={() => onToggle(seat.id)}
-          disabled={seat.status !== "AVAILABLE"}
+          disabled={isDisabled}
           className={`${width} h-11 rounded flex items-center justify-center transition-all ${
             isSelected
               ? "bg-[rgb(20_113_76)] text-white shadow-md scale-105"
-              : seat.status === "AVAILABLE"
-                ? "bg-green-500 hover:bg-green-600 text-white cursor-pointer hover:shadow-md"
-                : seat.status === "HELD"
-                  ? "bg-yellow-500 text-white cursor-not-allowed opacity-75"
-                  : "bg-gray-500 text-white cursor-not-allowed opacity-60"
+              : isAssignedToOther
+                ? "bg-purple-400 text-white cursor-not-allowed opacity-75"
+                : seat.status === "AVAILABLE"
+                  ? "bg-green-500 hover:bg-green-600 text-white cursor-pointer hover:shadow-md"
+                  : seat.status === "HELD"
+                    ? "bg-yellow-500 text-white cursor-not-allowed opacity-75"
+                    : "bg-gray-500 text-white cursor-not-allowed opacity-60"
           }`}
-          title={`Seat ${seatLabel}${bedLabel} - ${seat.status} - ${coachSeatClass}`}
+          title={
+            isAssignedToOther
+              ? `Seat ${seatLabel}${bedLabel} - already assigned to another passenger`
+              : `Seat ${seatLabel}${bedLabel} - ${seat.status} - ${coachSeatClass}`
+          }
           style={
             isBedCoach
               ? seat.row % 2 === 1
@@ -122,7 +137,10 @@ export default function SeatsPage() {
     searchCriteria,
     bookingId,
   } = useBookingStore();
-  const [selectedSeats, setSelectedSeats] = useState<string[]>([]);
+  // Maps passenger index -> assigned seat id. A passenger can only get a seat while
+  // they are the "active" passenger, which prevents bulk/batch selection across passengers.
+  const [passengerSeatMap, setPassengerSeatMap] = useState<Record<number, string>>({});
+  const [activePassengerIndex, setActivePassengerIndex] = useState(0);
   const [selectedCoach, setSelectedCoach] = useState<string | null>(null);
   const [currentJourneyType, setCurrentJourneyType] = useState<
     "outbound" | "inbound"
@@ -344,71 +362,87 @@ export default function SeatsPage() {
     return seats;
   }, [allSeats, selectedCoachData, currentSchedule?.selectedSeatClass]);
 
-  const handleSeatClick = useCallback(
-    (seatId: string) => {
-      setSelectedSeats((prev) => {
-        if (prev.length < passengers.length) {
-          return [...prev, seatId];
-        } else {
-          return [seatId];
-        }
-      });
-    },
-    [passengers.length],
+  // Seats already claimed by any passenger in this journey leg
+  const assignedSeatIds = useMemo(
+    () => new Set(Object.values(passengerSeatMap)),
+    [passengerSeatMap],
   );
 
-  const handleContinue = async () => {
-    if (isRoundTrip && currentJourneyType === "outbound") {
-      if (selectedSeats.length > 0) {
-        try {
-          await holdMutation.mutateAsync(selectedSeats);
-          const updatedPassengers = passengers.map((p, i) => {
-            const seatData = validSeats?.find(
-              (s: any) => s.id === selectedSeats[i],
-            );
-            return {
-              ...p,
-              outboundSeatId: selectedSeats[i],
-              outboundSeatNumber: seatData ? buildSeatLabel(seatData) : '',
-            };
-          });
-          setPassengers(updatedPassengers);
-        } catch (error: any) {
-          setModalState({
-            isOpen: true,
-            title: "Seat Hold Failed",
-            message:
-              error?.response?.data?.message ||
-              "Failed to hold seats. Please try again.",
-            type: "error",
-          });
-          return;
-        }
-      }
-      setCurrentJourneyType("inbound");
-      setSelectedSeats([]);
-      setSelectedCoach(null);
-      return;
-    }
+  // The furthest passenger a user is allowed to jump to — cannot skip ahead of the
+  // first passenger who still needs a seat.
+  const firstUnassignedIndex = useMemo(
+    () => passengers.findIndex((_, i) => !passengerSeatMap[i]),
+    [passengers, passengerSeatMap],
+  );
+  const maxSelectableIndex =
+    firstUnassignedIndex === -1 ? passengers.length - 1 : firstUnassignedIndex;
 
-    if (selectedSeats.length > 0) {
+  const isSeatSelected = useCallback(
+    (seatId: string) => passengerSeatMap[activePassengerIndex] === seatId,
+    [passengerSeatMap, activePassengerIndex],
+  );
+
+  const isSeatAssignedToOther = useCallback(
+    (seatId: string) =>
+      Object.entries(passengerSeatMap).some(
+        ([idx, sid]) => Number(idx) !== activePassengerIndex && sid === seatId,
+      ),
+    [passengerSeatMap, activePassengerIndex],
+  );
+
+  const handleSelectPassenger = useCallback(
+    (index: number) => {
+      if (index > maxSelectableIndex) return; // no skipping ahead of unassigned passengers
+      setActivePassengerIndex(index);
+    },
+    [maxSelectableIndex],
+  );
+
+  const handleSeatClick = useCallback(
+    (seatId: string) => {
+      // Seat already claimed by a different passenger — never allow duplicate assignment
+      const takenByOther = Object.entries(passengerSeatMap).some(
+        ([idx, sid]) => Number(idx) !== activePassengerIndex && sid === seatId,
+      );
+      if (takenByOther) return;
+
+      const isDeselecting = passengerSeatMap[activePassengerIndex] === seatId;
+      const next = { ...passengerSeatMap };
+      if (isDeselecting) {
+        delete next[activePassengerIndex];
+      } else {
+        next[activePassengerIndex] = seatId;
+      }
+      setPassengerSeatMap(next);
+
+      if (!isDeselecting) {
+        // Move on to the next passenger who still needs a seat — one passenger at a time
+        const nextUnassigned = passengers.findIndex(
+          (_, i) => i !== activePassengerIndex && !next[i],
+        );
+        if (nextUnassigned !== -1) setActivePassengerIndex(nextUnassigned);
+      }
+    },
+    [passengerSeatMap, activePassengerIndex, passengers],
+  );
+
+  const allSeatsAssigned =
+    passengers.length > 0 &&
+    passengers.every((_, i) => !!passengerSeatMap[i]);
+
+  const handleContinue = async () => {
+    if (!allSeatsAssigned) return;
+    const seatIds = passengers.map((_, i) => passengerSeatMap[i]);
+
+    if (isRoundTrip && currentJourneyType === "outbound") {
       try {
-        await holdMutation.mutateAsync(selectedSeats);
+        await holdMutation.mutateAsync(seatIds);
         const updatedPassengers = passengers.map((p, i) => {
-          const seatData = validSeats?.find(
-            (s: any) => s.id === selectedSeats[i],
-          );
-          if (isRoundTrip && currentJourneyType === "inbound") {
-            return {
-              ...p,
-              inboundSeatId: selectedSeats[i],
-              inboundSeatNumber: seatData ? buildSeatLabel(seatData) : '',
-            };
-          }
+          const seatData = validSeats?.find((s: any) => s.id === seatIds[i]);
           return {
             ...p,
-            seatId: selectedSeats[i],
-            seatNumber: seatData ? buildSeatLabel(seatData) : '',
+            outboundSeatId: seatIds[i],
+            outboundSeatNumber: seatData ? buildSeatLabel(seatData) : '',
           };
         });
         setPassengers(updatedPassengers);
@@ -423,42 +457,32 @@ export default function SeatsPage() {
         });
         return;
       }
-    }
-    router.push("/booking/review");
-  };
-
-  const handleAutoAssign = async () => {
-    const availableSeats =
-      validSeats?.filter((s: any) => s.status === "AVAILABLE") || [];
-    if (availableSeats.length < passengers.length) {
-      setModalState({
-        isOpen: true,
-        title: "Not Enough Seats",
-        message: `Only ${availableSeats.length} seat(s) available in this coach, but you need ${passengers.length} seat(s). Please select another coach.`,
-        type: "warning",
-      });
+      setCurrentJourneyType("inbound");
+      setPassengerSeatMap({});
+      setActivePassengerIndex(0);
+      setSelectedCoach(null);
       return;
     }
 
-    const autoSelectedSeats = availableSeats
-      .slice(0, passengers.length)
-      .map((s: any) => s.id);
-    setSelectedSeats(autoSelectedSeats);
-
     try {
-      await holdMutation.mutateAsync(autoSelectedSeats);
+      await holdMutation.mutateAsync(seatIds);
       const updatedPassengers = passengers.map((p, i) => {
-        const seatData = availableSeats[i];
+        const seatData = validSeats?.find((s: any) => s.id === seatIds[i]);
+        if (isRoundTrip && currentJourneyType === "inbound") {
+          return {
+            ...p,
+            inboundSeatId: seatIds[i],
+            inboundSeatNumber: seatData ? buildSeatLabel(seatData) : '',
+          };
+        }
         return {
           ...p,
-          seatId: autoSelectedSeats[i],
+          seatId: seatIds[i],
           seatNumber: seatData ? buildSeatLabel(seatData) : '',
         };
       });
       setPassengers(updatedPassengers);
-      router.push("/booking/review");
     } catch (error: any) {
-      console.error("Failed to hold seats:", error);
       setModalState({
         isOpen: true,
         title: "Seat Hold Failed",
@@ -467,7 +491,38 @@ export default function SeatsPage() {
           "Failed to hold seats. Please try again.",
         type: "error",
       });
+      return;
     }
+    router.push("/booking/review");
+  };
+
+  const handleAutoAssign = () => {
+    const unassignedIndices = passengers
+      .map((_, i) => i)
+      .filter((i) => !passengerSeatMap[i]);
+
+    if (unassignedIndices.length === 0) return;
+
+    const availableSeats = (
+      validSeats?.filter((s: any) => s.status === "AVAILABLE") || []
+    ).filter((s: any) => !assignedSeatIds.has(s.id));
+
+    if (availableSeats.length < unassignedIndices.length) {
+      setModalState({
+        isOpen: true,
+        title: "Not Enough Seats",
+        message: `Only ${availableSeats.length} seat(s) available in this coach, but you need ${unassignedIndices.length} more seat(s). Please select another coach.`,
+        type: "warning",
+      });
+      return;
+    }
+
+    const next = { ...passengerSeatMap };
+    unassignedIndices.forEach((passengerIndex, offset) => {
+      next[passengerIndex] = availableSeats[offset].id;
+    });
+    setPassengerSeatMap(next);
+    setActivePassengerIndex(passengers.length - 1);
   };
 
   const handleBackToPassengers = () => {
@@ -494,8 +549,9 @@ export default function SeatsPage() {
   ]);
 
   useEffect(() => {
-    if (bookingId && selectedSeats.length > 0) {
-      bookSeatsMutation.mutate(selectedSeats);
+    const heldSeatIds = Object.values(passengerSeatMap);
+    if (bookingId && heldSeatIds.length > 0) {
+      bookSeatsMutation.mutate(heldSeatIds);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [bookingId]);
@@ -636,7 +692,8 @@ export default function SeatsPage() {
                               <div key={bed.id} className="relative">
                                 <BedCard
                                   bed={bed}
-                                  isSelected={selectedSeats.includes(bed.id)}
+                                  isSelected={isSeatSelected(bed.id)}
+                                isAssignedToOther={isSeatAssignedToOther(bed.id)}
                                   onToggle={handleSeatClick}
                                   bedLabel="U"
                                 />
@@ -661,7 +718,8 @@ export default function SeatsPage() {
                               <div key={bed.id} className="relative">
                                 <BedCard
                                   bed={bed}
-                                  isSelected={selectedSeats.includes(bed.id)}
+                                  isSelected={isSeatSelected(bed.id)}
+                                isAssignedToOther={isSeatAssignedToOther(bed.id)}
                                   onToggle={handleSeatClick}
                                   bedLabel="L"
                                 />
@@ -695,7 +753,8 @@ export default function SeatsPage() {
                               <BedCard
                                 key={bed.id}
                                 bed={bed}
-                                isSelected={selectedSeats.includes(bed.id)}
+                                isSelected={isSeatSelected(bed.id)}
+                                isAssignedToOther={isSeatAssignedToOther(bed.id)}
                                 onToggle={handleSeatClick}
                                 bedLabel="L"
                               />
@@ -713,7 +772,8 @@ export default function SeatsPage() {
                               <BedCard
                                 key={bed.id}
                                 bed={bed}
-                                isSelected={selectedSeats.includes(bed.id)}
+                                isSelected={isSeatSelected(bed.id)}
+                                isAssignedToOther={isSeatAssignedToOther(bed.id)}
                                 onToggle={handleSeatClick}
                                 bedLabel="L"
                               />
@@ -739,7 +799,8 @@ export default function SeatsPage() {
                               <BedCard
                                 key={bed.id}
                                 bed={bed}
-                                isSelected={selectedSeats.includes(bed.id)}
+                                isSelected={isSeatSelected(bed.id)}
+                                isAssignedToOther={isSeatAssignedToOther(bed.id)}
                                 onToggle={handleSeatClick}
                                 bedLabel="M"
                               />
@@ -757,7 +818,8 @@ export default function SeatsPage() {
                               <BedCard
                                 key={bed.id}
                                 bed={bed}
-                                isSelected={selectedSeats.includes(bed.id)}
+                                isSelected={isSeatSelected(bed.id)}
+                                isAssignedToOther={isSeatAssignedToOther(bed.id)}
                                 onToggle={handleSeatClick}
                                 bedLabel="M"
                               />
@@ -783,7 +845,8 @@ export default function SeatsPage() {
                               <BedCard
                                 key={bed.id}
                                 bed={bed}
-                                isSelected={selectedSeats.includes(bed.id)}
+                                isSelected={isSeatSelected(bed.id)}
+                                isAssignedToOther={isSeatAssignedToOther(bed.id)}
                                 onToggle={handleSeatClick}
                                 bedLabel="U"
                               />
@@ -801,7 +864,8 @@ export default function SeatsPage() {
                               <BedCard
                                 key={bed.id}
                                 bed={bed}
-                                isSelected={selectedSeats.includes(bed.id)}
+                                isSelected={isSeatSelected(bed.id)}
+                                isAssignedToOther={isSeatAssignedToOther(bed.id)}
                                 onToggle={handleSeatClick}
                                 bedLabel="U"
                               />
@@ -880,7 +944,8 @@ export default function SeatsPage() {
                       <SeatButton
                         key={seat.id}
                         seat={seat}
-                        isSelected={selectedSeats.includes(seat.id)}
+                        isSelected={isSeatSelected(seat.id)}
+                        isAssignedToOther={isSeatAssignedToOther(seat.id)}
                         onToggle={handleSeatClick}
                         isBedCoach={true}
                         bedLabel={getBedLabel(seat.bedPosition)}
@@ -992,7 +1057,8 @@ export default function SeatsPage() {
                       <SeatButton
                         key={seat.id}
                         seat={seat}
-                        isSelected={selectedSeats.includes(seat.id)}
+                        isSelected={isSeatSelected(seat.id)}
+                        isAssignedToOther={isSeatAssignedToOther(seat.id)}
                         onToggle={handleSeatClick}
                         isBedCoach={false}
                         bedLabel=""
@@ -1065,7 +1131,8 @@ export default function SeatsPage() {
     );
   }
 
-  const allSelected = selectedSeats.length === passengers.length;
+  const assignedCount = passengers.filter((_, i) => !!passengerSeatMap[i]).length;
+  const activePassenger = passengers[activePassengerIndex];
   const isBedCoach =
     selectedCoachData?.isBedCoach === true ||
     selectedCoachData?.rooms?.length > 0 ||
@@ -1081,18 +1148,18 @@ export default function SeatsPage() {
         </h3>
         <span
           className={`text-xs font-semibold px-2 py-0.5 rounded-full ${
-            allSelected
+            allSeatsAssigned
               ? "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400"
               : "bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400"
           }`}
         >
-          {selectedSeats.length}/{passengers.length} selected
+          {assignedCount}/{passengers.length} selected
         </span>
       </div>
       <p className="text-xs text-gray-500 dark:text-gray-400 mb-4">
-        {allSelected
+        {allSeatsAssigned
           ? "All seats selected — ready to continue"
-          : `Select ${passengers.length - selectedSeats.length} more seat(s)`}
+          : `Selecting seat for ${activePassenger?.name || `Passenger ${activePassengerIndex + 1}`} (${activePassengerIndex + 1} of ${passengers.length})`}
       </p>
 
       {/* Progress bar */}
@@ -1100,75 +1167,88 @@ export default function SeatsPage() {
         <div
           className="h-full bg-[rgb(20,113,76)] rounded-full transition-all duration-300"
           style={{
-            width: `${(selectedSeats.length / passengers.length) * 100}%`,
+            width: `${(assignedCount / passengers.length) * 100}%`,
           }}
         />
       </div>
 
       <div className="space-y-2 mb-5">
         {passengers.map((p, i) => {
-          const assignedSeat = selectedSeats[i]
-            ? validSeats?.find((s: any) => s.id === selectedSeats[i])
+          const assignedSeatId = passengerSeatMap[i];
+          const assignedSeat = assignedSeatId
+            ? validSeats?.find((s: any) => s.id === assignedSeatId)
             : null;
-          const seatLabel = assignedSeat
-            ? assignedSeat.number ||
-              assignedSeat.label ||
-              assignedSeat.seatNumber ||
-              "—"
-            : "—";
-          const bedLabel = assignedSeat
-            ? getBedLabel(assignedSeat.bedPosition)
-            : "";
+          const seatLabel = assignedSeat ? buildSeatLabel(assignedSeat) : "";
+          const isActive = i === activePassengerIndex;
+          const isClickable = i <= maxSelectableIndex;
           return (
-            <div
+            <button
               key={i}
-              className="flex items-center justify-between py-2 border-b border-gray-100 dark:border-gray-800 last:border-0"
+              type="button"
+              onClick={() => handleSelectPassenger(i)}
+              disabled={!isClickable}
+              className={`w-full flex items-center justify-between py-2 px-2 rounded-lg border text-left transition-all ${
+                isActive
+                  ? "border-[rgb(20,113,76)] bg-[rgb(20,113,76)]/5 dark:bg-[rgb(20,113,76)]/10"
+                  : "border-transparent"
+              } ${
+                isClickable
+                  ? "cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800/60"
+                  : "cursor-not-allowed opacity-50"
+              }`}
             >
-              <div className="flex items-center gap-2">
+              <div className="flex items-center gap-2 min-w-0">
                 <div
                   className={`w-6 h-6 rounded-full flex items-center justify-center text-xs font-bold flex-shrink-0 ${
                     assignedSeat
                       ? "bg-[rgb(20,113,76)] text-white"
-                      : "bg-gray-200 dark:bg-gray-700 text-gray-500"
+                      : isActive
+                        ? "bg-[rgb(20,113,76)]/20 text-[rgb(20,113,76)] ring-2 ring-[rgb(20,113,76)]"
+                        : "bg-gray-200 dark:bg-gray-700 text-gray-500"
                   }`}
                 >
                   {i + 1}
                 </div>
-                <span className="text-sm text-gray-700 dark:text-gray-300 truncate max-w-[120px]">
-                  {p.name}
-                </span>
+                <div className="min-w-0">
+                  <span className="text-sm text-gray-700 dark:text-gray-300 truncate block max-w-[120px]">
+                    {p.name}
+                  </span>
+                  {isActive && !assignedSeat && (
+                    <span className="text-[10px] font-semibold text-[rgb(20,113,76)] uppercase tracking-wide">
+                      Now selecting
+                    </span>
+                  )}
+                </div>
               </div>
               <span
-                className={`text-sm font-semibold ${
+                className={`text-sm font-semibold flex-shrink-0 ${
                   assignedSeat ? "text-[rgb(20,113,76)]" : "text-gray-400"
                 }`}
               >
-                {assignedSeat ? `${seatLabel}${bedLabel}` : "Not selected"}
+                {assignedSeat ? `Seat ${seatLabel}` : "Not Assigned"}
               </span>
-            </div>
+            </button>
           );
         })}
       </div>
 
       <button
         onClick={handleContinue}
-        disabled={selectedSeats.length === 0 || holdMutation.isPending}
+        disabled={!allSeatsAssigned || holdMutation.isPending}
         className="w-full py-3 bg-[rgb(20,113,76)] hover:bg-[rgb(16,89,60)] disabled:opacity-40 disabled:cursor-not-allowed text-white font-bold text-sm rounded-xl transition-all shadow-lg"
       >
         {holdMutation.isPending
           ? "Holding seats..."
           : isRoundTrip && currentJourneyType === "outbound"
             ? "Continue to Return Seats"
-            : allSelected
-              ? "Continue"
-              : "Continue with partial selection"}
+            : "Continue"}
       </button>
       <button
         onClick={handleAutoAssign}
-        disabled={holdMutation.isPending}
+        disabled={holdMutation.isPending || allSeatsAssigned}
         className="w-full mt-2 py-2.5 bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 disabled:opacity-40 text-gray-700 dark:text-gray-300 font-semibold text-sm rounded-xl transition-all"
       >
-        Auto-assign seats
+        Auto Assign Seats
       </button>
     </>
   );
@@ -1183,21 +1263,17 @@ export default function SeatsPage() {
         type={modalState.type}
       />
 
-      {/* Mobile summary bottom-sheet */}
-      {selectedSeats.length > 0 && (
-        <>
-          <div
-            className="fixed inset-x-0 bottom-0 z-50 lg:hidden bg-white dark:bg-gray-900 rounded-t-2xl shadow-2xl p-5"
-            style={{
-              animation: "seats-slide-up 0.25s cubic-bezier(0.32,0.72,0,1)",
-            }}
-          >
-            <div className="w-10 h-1 bg-gray-300 dark:bg-gray-600 rounded-full mx-auto mb-4" />
-            <SummaryContent />
-          </div>
-          <style>{`@keyframes seats-slide-up{from{transform:translateY(100%)}to{transform:translateY(0)}}`}</style>
-        </>
-      )}
+      {/* Mobile summary bottom-sheet — always visible so the active passenger is clear */}
+      <div
+        className="fixed inset-x-0 bottom-0 z-50 lg:hidden bg-white dark:bg-gray-900 rounded-t-2xl shadow-2xl p-5 max-h-[70vh] overflow-y-auto"
+        style={{
+          animation: "seats-slide-up 0.25s cubic-bezier(0.32,0.72,0,1)",
+        }}
+      >
+        <div className="w-10 h-1 bg-gray-300 dark:bg-gray-600 rounded-full mx-auto mb-4" />
+        <SummaryContent />
+      </div>
+      <style>{`@keyframes seats-slide-up{from{transform:translateY(100%)}to{transform:translateY(0)}}`}</style>
 
       <div className="min-h-screen bg-gray-50 dark:bg-gray-900">
         {/* Header */}
@@ -1211,15 +1287,22 @@ export default function SeatsPage() {
                 <ChevronLeft className="w-4 h-4" />
                 Back
               </button>
-              <h1 className="text-base font-bold text-gray-900 dark:text-white">
-                {isRoundTrip
-                  ? currentJourneyType === "outbound"
-                    ? "Select Outbound Seats"
-                    : "Select Return Seats"
-                  : "Select Seats"}
-              </h1>
+              <div className="text-center">
+                <h1 className="text-base font-bold text-gray-900 dark:text-white">
+                  {isRoundTrip
+                    ? currentJourneyType === "outbound"
+                      ? "Select Outbound Seats"
+                      : "Select Return Seats"
+                    : "Select Seats"}
+                </h1>
+                {!allSeatsAssigned && (
+                  <p className="text-xs text-gray-500 dark:text-gray-400">
+                    Now selecting: {activePassenger?.name || `Passenger ${activePassengerIndex + 1}`}
+                  </p>
+                )}
+              </div>
               <div className="text-sm font-semibold text-[rgb(20,113,76)]">
-                {selectedSeats.length}/{passengers.length}
+                {assignedCount}/{passengers.length}
               </div>
             </div>
           </div>
diff --git a/apps/edr-passenger-web/portal/src/app/packages/[id]/page.tsx b/apps/edr-passenger-web/portal/src/app/packages/[id]/page.tsx
new file mode 100644
index 000000000..8edd9f04a
--- /dev/null
+++ b/apps/edr-passenger-web/portal/src/app/packages/[id]/page.tsx
@@ -0,0 +1,913 @@
+"use client";
+
+import { useQuery } from "@tanstack/react-query";
+import { apiClient } from "@/lib/api-client";
+import { useParams, useRouter } from "next/navigation";
+import Image from "next/image";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+import {
+  ChevronLeft,
+  Calendar,
+  MapPin,
+  Users,
+  Clock,
+  Train,
+  Bus,
+  Check,
+  AlertCircle,
+  Loader2,
+  ArrowRight,
+  Tag,
+  Shield,
+  X,
+  CheckCircle2,
+  Phone,
+  Mail,
+  User,
+  FileText,
+} from "lucide-react";
+
+// ─── Types ────────────────────────────────────────────────────────────────────
+
+interface Station {
+  id: string;
+  code: string;
+  name: string;
+  city: string;
+  countryCode: string;
+}
+
+interface TrainInfo {
+  id: string;
+  number: string;
+  name: string;
+  operatorName: string;
+}
+
+interface Schedule {
+  id: string;
+  departureAt: string;
+  arrivalAt: string;
+  durationMinutes: number;
+  status: string;
+  stopsCount: number;
+  originStation: Station;
+  destinationStation: Station;
+  train: TrainInfo;
+}
+
+interface PriceTier {
+  id: string;
+  packageId: string;
+  seatType: string;
+  label: string;
+  priceMinor: number;
+  currency: string;
+  availableSeats: number;
+  bookedSeats: number;
+}
+
+interface PackageDetail {
+  id: string;
+  code: string;
+  name: string;
+  description: string | null;
+  status: string;
+  boardingTime: string;
+  departureTime: string;
+  arrivalTime: string;
+  totalCapacity: number;
+  bookedCount: number;
+  includedServices: string[];
+  coachConfiguration: string;
+  busTransferIncluded: boolean;
+  busTransferRoute: string | null;
+  validFrom: string;
+  validUntil: string;
+  priceTiers: PriceTier[];
+  outboundSchedule: Schedule;
+  returnSchedule: Schedule | null;
+}
+
+// ─── Helpers ──────────────────────────────────────────────────────────────────
+
+function fmt(iso: string, opts?: Intl.DateTimeFormatOptions): string {
+  try {
+    return new Date(iso).toLocaleDateString("en-US", opts ?? {
+      weekday: "short", month: "short", day: "numeric",
+    });
+  } catch { return iso; }
+}
+
+function fmtTime(iso: string): string {
+  try {
+    return new Date(iso).toLocaleTimeString("en-US", { hour: "numeric", minute: "2-digit", hour12: true });
+  } catch { return iso; }
+}
+
+function durationLabel(minutes: number): string {
+  const h = Math.floor(minutes / 60);
+  const m = minutes % 60;
+  return m ? `${h}h ${m}m` : `${h}h`;
+}
+
+function stripBullet(s: string): string {
+  return s.replace(/^[••\-\t\s]+/, "").trim();
+}
+
+function formatPrice(minor: number, currency: string): string {
+  return `${currency} ${(minor / 100).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
+}
+
+// ─── Inquiry form ────────────────────────────────────────────────────────────
+
+const inquirySchema = z.object({
+  travelerCount: z
+    .number({ invalid_type_error: "Enter a valid number" })
+    .int("Must be a whole number")
+    .min(1, "At least 1 traveler required")
+    .max(50, "Maximum 50 travelers per booking"),
+  contactName: z
+    .string()
+    .min(2, "Name must be at least 2 characters")
+    .max(100),
+  contactEmail: z
+    .string()
+    .min(1, "Email is required")
+    .email("Enter a valid email address"),
+  contactPhone: z
+    .string()
+    .min(7, "Enter a valid phone number")
+    .max(20, "Phone number too long")
+    .regex(/^[+\d\s\-()\\.]+$/, "Invalid phone number format"),
+  notes: z.string().max(500, "Notes must be under 500 characters").optional(),
+});
+
+type InquiryForm = z.infer<typeof inquirySchema>;
+
+interface InquiryModalProps {
+  packageId: string;
+  packageName: string;
+  tier: PriceTier;
+  onClose: () => void;
+}
+
+function InquiryModal({ packageId, packageName, tier, onClose }: InquiryModalProps) {
+  const [submitted, setSubmitted] = useState(false);
+  const [submitError, setSubmitError] = useState<string | null>(null);
+
+  const {
+    register,
+    handleSubmit,
+    formState: { errors, isSubmitting },
+  } = useForm<InquiryForm>({
+    resolver: zodResolver(inquirySchema as any),
+    defaultValues: { travelerCount: 1 },
+  });
+
+  const onSubmit = async (data: InquiryForm) => {
+    setSubmitError(null);
+    try {
+      await apiClient.post("/packages/inquiries", {
+        packageId,
+        priceTierId: tier.id,
+        travelerCount: data.travelerCount,
+        contactName: data.contactName,
+        contactEmail: data.contactEmail,
+        contactPhone: data.contactPhone,
+        notes: data.notes ?? "",
+      });
+      setSubmitted(true);
+    } catch (err: any) {
+      setSubmitError(
+        err?.response?.data?.message ||
+          "Something went wrong. Please try again.",
+      );
+    }
+  };
+
+  return (
+    <>
+      {/* Backdrop */}
+      <div
+        className="fixed inset-0 z-[90] bg-black/50 backdrop-blur-sm"
+        onClick={onClose}
+      />
+
+      {/* Modal */}
+      <div className="fixed inset-0 z-[100] flex items-end sm:items-center justify-center p-0 sm:p-4">
+        <div className="w-full sm:max-w-lg bg-white dark:bg-gray-900 rounded-t-3xl sm:rounded-2xl shadow-2xl overflow-hidden max-h-[92vh] flex flex-col">
+
+          {/* Header */}
+          <div className="flex items-center justify-between px-6 py-4 border-b border-gray-100 dark:border-gray-800 flex-shrink-0">
+            <div>
+              <h2 className="text-base font-bold text-gray-900 dark:text-white">
+                Book Package
+              </h2>
+              <p className="text-xs text-gray-400 mt-0.5 line-clamp-1">
+                {packageName.trim()}
+              </p>
+            </div>
+            <button
+              type="button"
+              onClick={onClose}
+              className="w-8 h-8 flex items-center justify-center rounded-full hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors"
+            >
+              <X className="w-4 h-4 text-gray-500" />
+            </button>
+          </div>
+
+          {/* Success state */}
+          {submitted ? (
+            <div className="flex-1 flex flex-col items-center justify-center px-6 py-12 text-center">
+              <div className="w-16 h-16 bg-green-50 dark:bg-green-900/20 rounded-full flex items-center justify-center mb-4">
+                <CheckCircle2 className="w-8 h-8 text-green-500" />
+              </div>
+              <h3 className="text-lg font-bold text-gray-900 dark:text-white mb-2">
+                Inquiry Submitted!
+              </h3>
+              <p className="text-sm text-gray-500 dark:text-gray-400 max-w-xs">
+                We&apos;ve received your booking inquiry. Our team will contact you
+                shortly to confirm your reservation.
+              </p>
+              <button
+                type="button"
+                onClick={onClose}
+                className="mt-6 px-6 py-2.5 bg-primary text-white text-sm font-semibold rounded-xl hover:bg-[rgb(16,89,60)] transition-colors"
+              >
+                Done
+              </button>
+            </div>
+          ) : (
+            <>
+              {/* Selected tier summary */}
+              <div className="px-6 py-3 bg-primary/5 border-b border-primary/10 flex-shrink-0">
+                <div className="flex items-center justify-between">
+                  <div>
+                    <p className="text-[10px] text-gray-400 uppercase tracking-wide font-semibold">
+                      Selected seat type
+                    </p>
+                    <p className="text-sm font-bold text-gray-900 dark:text-white mt-0.5">
+                      {tier.label.trim()}{" "}
+                      <span className="text-[10px] font-normal text-gray-400 bg-gray-100 dark:bg-gray-800 px-1.5 py-0.5 rounded ml-1">
+                        {tier.seatType.trim()}
+                      </span>
+                    </p>
+                  </div>
+                  <div className="text-right">
+                    <p className="text-[10px] text-gray-400 uppercase tracking-wide font-semibold">
+                      Per person
+                    </p>
+                    <p className="text-base font-extrabold text-primary mt-0.5">
+                      {formatPrice(tier.priceMinor, tier.currency)}
+                    </p>
+                  </div>
+                </div>
+              </div>
+
+              {/* Form */}
+              <form
+                onSubmit={handleSubmit(onSubmit)}
+                className="flex-1 overflow-y-auto scrollbar-hide px-6 py-5 space-y-4"
+              >
+                {/* Traveler count */}
+                <div>
+                  <label className="block text-xs font-semibold text-gray-700 dark:text-gray-300 mb-1.5">
+                    Number of Travelers <span className="text-red-500">*</span>
+                  </label>
+                  <div className="relative">
+                    <Users className="absolute left-3.5 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
+                    <input
+                      type="number"
+                      min={1}
+                      max={50}
+                      {...register("travelerCount", { valueAsNumber: true })}
+                      className={`w-full pl-10 pr-4 py-3 rounded-xl border-2 text-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-primary/30 transition-colors ${
+                        errors.travelerCount
+                          ? "border-red-400 focus:border-red-400"
+                          : "border-gray-200 dark:border-gray-700 focus:border-primary"
+                      }`}
+                    />
+                  </div>
+                  {errors.travelerCount && (
+                    <p className="text-xs text-red-500 mt-1">{errors.travelerCount.message}</p>
+                  )}
+                </div>
+
+                {/* Contact name */}
+                <div>
+                  <label className="block text-xs font-semibold text-gray-700 dark:text-gray-300 mb-1.5">
+                    Full Name <span className="text-red-500">*</span>
+                  </label>
+                  <div className="relative">
+                    <User className="absolute left-3.5 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
+                    <input
+                      type="text"
+                      placeholder="Your full name"
+                      {...register("contactName")}
+                      className={`w-full pl-10 pr-4 py-3 rounded-xl border-2 text-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary/30 transition-colors ${
+                        errors.contactName
+                          ? "border-red-400 focus:border-red-400"
+                          : "border-gray-200 dark:border-gray-700 focus:border-primary"
+                      }`}
+                    />
+                  </div>
+                  {errors.contactName && (
+                    <p className="text-xs text-red-500 mt-1">{errors.contactName.message}</p>
+                  )}
+                </div>
+
+                {/* Email */}
+                <div>
+                  <label className="block text-xs font-semibold text-gray-700 dark:text-gray-300 mb-1.5">
+                    Email Address <span className="text-red-500">*</span>
+                  </label>
+                  <div className="relative">
+                    <Mail className="absolute left-3.5 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
+                    <input
+                      type="email"
+                      placeholder="you@example.com"
+                      {...register("contactEmail")}
+                      className={`w-full pl-10 pr-4 py-3 rounded-xl border-2 text-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary/30 transition-colors ${
+                        errors.contactEmail
+                          ? "border-red-400 focus:border-red-400"
+                          : "border-gray-200 dark:border-gray-700 focus:border-primary"
+                      }`}
+                    />
+                  </div>
+                  {errors.contactEmail && (
+                    <p className="text-xs text-red-500 mt-1">{errors.contactEmail.message}</p>
+                  )}
+                </div>
+
+                {/* Phone */}
+                <div>
+                  <label className="block text-xs font-semibold text-gray-700 dark:text-gray-300 mb-1.5">
+                    Phone Number <span className="text-red-500">*</span>
+                  </label>
+                  <div className="relative">
+                    <Phone className="absolute left-3.5 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
+                    <input
+                      type="tel"
+                      placeholder="+251 912 345 678"
+                      {...register("contactPhone")}
+                      className={`w-full pl-10 pr-4 py-3 rounded-xl border-2 text-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary/30 transition-colors ${
+                        errors.contactPhone
+                          ? "border-red-400 focus:border-red-400"
+                          : "border-gray-200 dark:border-gray-700 focus:border-primary"
+                      }`}
+                    />
+                  </div>
+                  {errors.contactPhone && (
+                    <p className="text-xs text-red-500 mt-1">{errors.contactPhone.message}</p>
+                  )}
+                </div>
+
+                {/* Notes */}
+                <div>
+                  <label className="block text-xs font-semibold text-gray-700 dark:text-gray-300 mb-1.5">
+                    Additional Notes{" "}
+                    <span className="text-gray-400 font-normal">(optional)</span>
+                  </label>
+                  <div className="relative">
+                    <FileText className="absolute left-3.5 top-3.5 w-4 h-4 text-gray-400" />
+                    <textarea
+                      rows={3}
+                      placeholder="Any special requirements or questions..."
+                      {...register("notes")}
+                      className={`w-full pl-10 pr-4 py-3 rounded-xl border-2 text-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary/30 resize-none transition-colors ${
+                        errors.notes
+                          ? "border-red-400 focus:border-red-400"
+                          : "border-gray-200 dark:border-gray-700 focus:border-primary"
+                      }`}
+                    />
+                  </div>
+                  {errors.notes && (
+                    <p className="text-xs text-red-500 mt-1">{errors.notes.message}</p>
+                  )}
+                </div>
+
+                {/* API error */}
+                {submitError && (
+                  <div className="flex items-start gap-2.5 p-3.5 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-xl">
+                    <AlertCircle className="w-4 h-4 text-red-500 flex-shrink-0 mt-0.5" />
+                    <p className="text-xs text-red-600 dark:text-red-400">{submitError}</p>
+                  </div>
+                )}
+
+                {/* Submit */}
+                <div className="pt-1 pb-2">
+                  <button
+                    type="submit"
+                    disabled={isSubmitting}
+                    className="w-full py-3.5 bg-[rgb(20,113,76)] hover:bg-[rgb(16,89,60)] disabled:opacity-60 text-white font-bold text-sm rounded-xl transition-all shadow-lg flex items-center justify-center gap-2"
+                  >
+                    {isSubmitting ? (
+                      <>
+                        <Loader2 className="w-4 h-4 animate-spin" />
+                        Submitting...
+                      </>
+                    ) : (
+                      <>
+                        Submit Inquiry <ArrowRight className="w-4 h-4" />
+                      </>
+                    )}
+                  </button>
+                  <p className="text-[10px] text-gray-400 text-center mt-2">
+                    Our team will contact you shortly to confirm.
+                  </p>
+                </div>
+              </form>
+            </>
+          )}
+        </div>
+      </div>
+    </>
+  );
+}
+
+// ─── Journey Card ─────────────────────────────────────────────────────────────
+
+function JourneyCard({ schedule, label }: { schedule: Schedule; label: string }) {
+  const dep = new Date(schedule.departureAt);
+  const arr = new Date(schedule.arrivalAt);
+  const isSameDay = dep.toDateString() === arr.toDateString();
+
+  return (
+    <div className="bg-white dark:bg-gray-900 rounded-2xl border border-gray-100 dark:border-gray-800 overflow-hidden">
+      <div className="flex items-center gap-2 px-5 py-3 bg-gray-50 dark:bg-gray-800/60 border-b border-gray-100 dark:border-gray-800">
+        <Train className="w-4 h-4 text-primary" />
+        <span className="text-sm font-bold text-gray-800 dark:text-white">{label}</span>
+        <span className="ml-auto text-xs text-gray-400">{schedule.train.number}</span>
+      </div>
+
+      <div className="p-5">
+        {/* Route row */}
+        <div className="flex items-center gap-3">
+          {/* Origin */}
+          <div className="flex-1 min-w-0">
+            <p className="text-[10px] font-semibold text-gray-400 uppercase tracking-wide">From</p>
+            <p className="text-xl font-extrabold text-gray-900 dark:text-white truncate">
+              {schedule.originStation.code}
+            </p>
+            <p className="text-xs text-gray-500 truncate">{schedule.originStation.name.trim()}</p>
+          </div>
+
+          {/* Center: duration + arrow */}
+          <div className="flex flex-col items-center gap-1 flex-shrink-0">
+            <span className="text-[10px] text-gray-400 font-medium">
+              {durationLabel(schedule.durationMinutes)}
+            </span>
+            <div className="relative w-16 flex items-center">
+              <div className="h-px w-full bg-gray-200 dark:bg-gray-700" />
+              <ArrowRight className="w-3 h-3 text-primary absolute -right-1" />
+            </div>
+            <span className="text-[10px] text-gray-400">{schedule.stopsCount} stops</span>
+          </div>
+
+          {/* Destination */}
+          <div className="flex-1 min-w-0 text-right">
+            <p className="text-[10px] font-semibold text-gray-400 uppercase tracking-wide">To</p>
+            <p className="text-xl font-extrabold text-gray-900 dark:text-white truncate">
+              {schedule.destinationStation.code}
+            </p>
+            <p className="text-xs text-gray-500 truncate">{schedule.destinationStation.name.trim()}</p>
+          </div>
+        </div>
+
+        {/* Times */}
+        <div className="flex items-end justify-between mt-4 pt-4 border-t border-gray-100 dark:border-gray-800">
+          <div>
+            <p className="text-lg font-bold text-primary">{fmtTime(schedule.departureAt)}</p>
+            <p className="text-xs text-gray-400">{fmt(schedule.departureAt, { weekday: "short", month: "short", day: "numeric" })}</p>
+          </div>
+          <div className="text-right">
+            <p className="text-lg font-bold text-primary">
+              {fmtTime(schedule.arrivalAt)}
+              {!isSameDay && <sup className="text-[10px] text-orange-400 ml-0.5">+1</sup>}
+            </p>
+            <p className="text-xs text-gray-400">{fmt(schedule.arrivalAt, { weekday: "short", month: "short", day: "numeric" })}</p>
+          </div>
+        </div>
+
+        <p className="mt-2 text-xs text-gray-400">{schedule.train.name}</p>
+      </div>
+    </div>
+  );
+}
+
+// ─── Price Tiers Panel ────────────────────────────────────────────────────────
+
+function PriceTiersPanel({
+  tiers,
+  selectedTierId,
+  onSelect,
+  selectedTier,
+  onBookNow,
+}: {
+  tiers: PriceTier[];
+  selectedTierId: string | null;
+  onSelect: (id: string) => void;
+  selectedTier?: PriceTier;
+  onBookNow: () => void;
+}) {
+  return (
+    <div className="space-y-4">
+      <div className="bg-white dark:bg-gray-900 rounded-2xl p-5 border border-gray-100 dark:border-gray-800">
+        <h2 className="text-base font-bold text-gray-900 dark:text-white mb-4">
+          Select Seat Type
+        </h2>
+
+        {!tiers?.length ? (
+          <p className="text-sm text-gray-400 text-center py-4">
+            No price tiers available
+          </p>
+        ) : (
+          <div className="space-y-2.5">
+            {tiers.map((tier) => {
+              const soldOut = tier.availableSeats === 0;
+              const selected = tier.id === selectedTierId;
+              return (
+                <button
+                  key={tier.id}
+                  type="button"
+                  disabled={soldOut}
+                  onClick={() => onSelect(tier.id)}
+                  className={`w-full text-left rounded-xl border-2 p-3.5 transition-all ${
+                    soldOut
+                      ? "border-gray-200 dark:border-gray-700 opacity-50 cursor-not-allowed"
+                      : selected
+                        ? "border-primary bg-primary/5"
+                        : "border-gray-200 dark:border-gray-700 hover:border-primary/50 hover:shadow-sm"
+                  }`}
+                >
+                  {/* Row 1: radio + full label */}
+                  <div className="flex items-start gap-2.5">
+                    <div
+                      className={`w-4 h-4 rounded-full border-2 flex-shrink-0 flex items-center justify-center mt-0.5 transition-colors ${
+                        selected
+                          ? "border-primary bg-primary"
+                          : "border-gray-300 dark:border-gray-600"
+                      }`}
+                    >
+                      {selected && <div className="w-1.5 h-1.5 rounded-full bg-white" />}
+                    </div>
+                    <p className="text-sm font-semibold text-gray-900 dark:text-white leading-snug">
+                      {tier.label.trim()}
+                    </p>
+                  </div>
+
+                  {/* Row 2: seatType badge + seats + price */}
+                  <div className="flex items-center justify-between mt-2 pl-[26px]">
+                    <div className="flex items-center gap-2">
+                      <span className="text-[10px] font-bold text-gray-400 bg-gray-100 dark:bg-gray-800 px-1.5 py-0.5 rounded">
+                        {tier.seatType.trim()}
+                      </span>
+                      {soldOut ? (
+                        <span className="text-[10px] font-bold text-red-500 bg-red-50 dark:bg-red-900/20 px-1.5 py-0.5 rounded">
+                          SOLD OUT
+                        </span>
+                      ) : (
+                        <span className="text-[10px] text-gray-400">
+                          {tier.availableSeats} left
+                        </span>
+                      )}
+                    </div>
+                    <p className="text-sm font-extrabold text-primary">
+                      {formatPrice(tier.priceMinor, tier.currency)}
+                    </p>
+                  </div>
+                </button>
+              );
+            })}
+          </div>
+        )}
+      </div>
+
+      {/* Summary + CTA */}
+      {selectedTier && (
+        <div className="bg-white dark:bg-gray-900 rounded-2xl p-5 border border-primary/30 shadow-sm">
+          <div className="space-y-2 mb-4">
+            <div className="flex items-center justify-between">
+              <p className="text-xs text-gray-500 dark:text-gray-400">Seat type</p>
+              <p className="text-xs font-semibold text-gray-900 dark:text-white">
+                {selectedTier.label.trim()}
+              </p>
+            </div>
+            <div className="flex items-center justify-between">
+              <p className="text-xs text-gray-500 dark:text-gray-400">Price per person</p>
+              <p className="text-base font-extrabold text-primary">
+                {formatPrice(selectedTier.priceMinor, selectedTier.currency)}
+              </p>
+            </div>
+          </div>
+          <button
+            type="button"
+            onClick={onBookNow}
+            className="w-full py-3.5 bg-[rgb(20,113,76)] hover:bg-[rgb(16,89,60)] text-white font-bold text-sm rounded-xl transition-all shadow-lg flex items-center justify-center gap-2"
+          >
+            Book Now <ArrowRight className="w-4 h-4" />
+          </button>
+        </div>
+      )}
+    </div>
+  );
+}
+
+// ─── Main Page ────────────────────────────────────────────────────────────────
+
+export default function PackageDetailPage() {
+  const params = useParams();
+  const router = useRouter();
+  const id = params?.id as string;
+
+  const [selectedTierId, setSelectedTierId] = useState<string | null>(null);
+  const [inquiryOpen, setInquiryOpen] = useState(false);
+
+  const { data: pkg, isLoading, isError } = useQuery<PackageDetail>({
+    queryKey: ["package", id],
+    queryFn: async () =>
+      (await apiClient.get<PackageDetail>(`/packages/${id}`)) as PackageDetail,
+    enabled: !!id,
+  });
+
+  const selectedTier = pkg?.priceTiers?.find((t) => t.id === selectedTierId);
+
+  if (isLoading) {
+    return (
+      <div className="min-h-screen flex items-center justify-center bg-gray-50 dark:bg-gray-950">
+        <div className="text-center">
+          <Loader2 className="w-8 h-8 animate-spin text-primary mx-auto mb-3" />
+          <p className="text-sm text-gray-500">Loading package details...</p>
+        </div>
+      </div>
+    );
+  }
+
+  if (isError || !pkg) {
+    return (
+      <div className="min-h-screen flex items-center justify-center bg-gray-50 dark:bg-gray-950">
+        <div className="text-center">
+          <AlertCircle className="w-8 h-8 text-red-400 mx-auto mb-3" />
+          <p className="text-sm text-gray-500 mb-4">Unable to load package details.</p>
+          <button
+            onClick={() => router.back()}
+            className="text-sm text-primary font-medium flex items-center gap-1 mx-auto hover:underline"
+          >
+            <ChevronLeft className="w-4 h-4" /> Go back
+          </button>
+        </div>
+      </div>
+    );
+  }
+
+  const origin = pkg.outboundSchedule?.originStation;
+  const destination = pkg.outboundSchedule?.destinationStation;
+  const availableSeats = pkg.totalCapacity - pkg.bookedCount;
+
+  return (
+    <div className="min-h-screen bg-gray-50 dark:bg-gray-950">
+      {/* Inquiry modal */}
+      {inquiryOpen && selectedTier && (
+        <InquiryModal
+          packageId={pkg.id}
+          packageName={pkg.name}
+          tier={selectedTier}
+          onClose={() => setInquiryOpen(false)}
+        />
+      )}
+
+      {/* Hero */}
+      <div className="relative h-56 md:h-80 bg-gradient-to-br from-[rgb(14,80,54)] to-[rgb(20,140,90)] overflow-hidden">
+        <Image
+          src="/packages/kulubi.jpeg"
+          alt={pkg.name}
+          fill
+          className="object-cover"
+          sizes="100vw"
+          priority
+        />
+        <div className="absolute inset-0 bg-gradient-to-t from-black/75 via-black/20 to-transparent" />
+
+        <button
+          onClick={() => router.back()}
+          className="absolute top-4 left-4 flex items-center gap-1.5 text-white/90 hover:text-white bg-black/25 backdrop-blur-sm px-3 py-2 rounded-full text-sm font-medium transition-colors"
+        >
+          <ChevronLeft className="w-4 h-4" /> Back
+        </button>
+
+        <div className="absolute bottom-0 left-0 right-0 p-6">
+          <div className="max-w-4xl mx-auto">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="inline-block bg-white/20 text-white text-xs font-semibold px-2.5 py-1 rounded-full backdrop-blur-sm">
+                {pkg.code}
+              </span>
+              {pkg.status === "ACTIVE" && (
+                <span className="inline-block bg-green-500/90 text-white text-xs font-bold px-2.5 py-1 rounded-full">
+                  Active
+                </span>
+              )}
+            </div>
+            <h1 className="text-2xl md:text-3xl font-extrabold text-white leading-tight">
+              {pkg.name.trim()}
+            </h1>
+            {origin && destination && (
+              <div className="flex items-center gap-1.5 text-white/75 text-sm mt-2">
+                <MapPin className="w-4 h-4 flex-shrink-0" />
+                {origin.name.trim()}
+                <ArrowRight className="w-3.5 h-3.5" />
+                {destination.name.trim()}
+                {pkg.returnSchedule && (
+                  <span className="text-white/50 text-xs ml-1">· Round Trip</span>
+                )}
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+
+      <div className="max-w-4xl mx-auto px-4 py-8">
+        <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
+          {/* ── Main content ── */}
+          <div className="lg:col-span-2 space-y-5">
+
+            {/* Quick info strip */}
+            <div className="grid grid-cols-3 gap-3">
+              <div className="bg-white dark:bg-gray-900 rounded-xl p-4 border border-gray-100 dark:border-gray-800 text-center">
+                <Calendar className="w-5 h-5 text-primary mx-auto mb-1" />
+                <p className="text-[10px] text-gray-400 uppercase tracking-wide">Departure</p>
+                <p className="text-xs font-bold text-gray-800 dark:text-white mt-0.5">
+                  {fmt(pkg.departureTime, { month: "short", day: "numeric" })}
+                </p>
+              </div>
+              <div className="bg-white dark:bg-gray-900 rounded-xl p-4 border border-gray-100 dark:border-gray-800 text-center">
+                <Users className="w-5 h-5 text-primary mx-auto mb-1" />
+                <p className="text-[10px] text-gray-400 uppercase tracking-wide">Available</p>
+                <p className={`text-xs font-bold mt-0.5 ${availableSeats <= 20 ? "text-orange-500" : "text-gray-800 dark:text-white"}`}>
+                  {availableSeats} seats
+                </p>
+              </div>
+              <div className="bg-white dark:bg-gray-900 rounded-xl p-4 border border-gray-100 dark:border-gray-800 text-center">
+                <Tag className="w-5 h-5 text-primary mx-auto mb-1" />
+                <p className="text-[10px] text-gray-400 uppercase tracking-wide">From</p>
+                <p className="text-xs font-bold text-gray-800 dark:text-white mt-0.5">
+                  {pkg.priceTiers.length
+                    ? formatPrice(
+                        Math.min(...pkg.priceTiers.map((t) => t.priceMinor)),
+                        pkg.priceTiers[0].currency,
+                      )
+                    : "—"}
+                </p>
+              </div>
+            </div>
+
+            {/* Description */}
+            {pkg.description && (
+              <div className="bg-white dark:bg-gray-900 rounded-2xl p-6 border border-gray-100 dark:border-gray-800">
+                <h2 className="text-base font-bold text-gray-900 dark:text-white mb-3">
+                  About this Package
+                </h2>
+                <p className="text-sm text-gray-600 dark:text-gray-400 leading-relaxed">
+                  {pkg.description}
+                </p>
+              </div>
+            )}
+
+            {/* Outbound journey */}
+            {pkg.outboundSchedule && (
+              <JourneyCard schedule={pkg.outboundSchedule} label="Outbound Journey" />
+            )}
+
+            {/* Return journey */}
+            {pkg.returnSchedule && (
+              <JourneyCard schedule={pkg.returnSchedule} label="Return Journey" />
+            )}
+
+            {/* Bus transfer */}
+            {pkg.busTransferIncluded && (
+              <div className="bg-white dark:bg-gray-900 rounded-2xl p-5 border border-gray-100 dark:border-gray-800">
+                <div className="flex items-center gap-3">
+                  <div className="w-10 h-10 bg-amber-50 dark:bg-amber-900/20 rounded-xl flex items-center justify-center flex-shrink-0">
+                    <Bus className="w-5 h-5 text-amber-600 dark:text-amber-400" />
+                  </div>
+                  <div>
+                    <p className="text-sm font-bold text-gray-900 dark:text-white">
+                      Bus Transfer Included
+                    </p>
+                    {pkg.busTransferRoute && (
+                      <p className="text-xs text-gray-500 mt-0.5">
+                        {pkg.busTransferRoute.trim()}
+                      </p>
+                    )}
+                  </div>
+                  <Check className="w-5 h-5 text-green-500 ml-auto flex-shrink-0" />
+                </div>
+              </div>
+            )}
+
+            {/* Travel info */}
+            <div className="bg-white dark:bg-gray-900 rounded-2xl p-6 border border-gray-100 dark:border-gray-800">
+              <h2 className="text-base font-bold text-gray-900 dark:text-white mb-4">
+                Travel Information
+              </h2>
+              <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+                <InfoRow icon={<Clock className="w-4 h-4 text-primary" />} label="Boarding Time">
+                  {fmtTime(pkg.boardingTime)} · {fmt(pkg.boardingTime)}
+                </InfoRow>
+                <InfoRow icon={<Calendar className="w-4 h-4 text-primary" />} label="Departure Time">
+                  {fmtTime(pkg.departureTime)} · {fmt(pkg.departureTime)}
+                </InfoRow>
+                <InfoRow icon={<MapPin className="w-4 h-4 text-primary" />} label="Arrival">
+                  {fmtTime(pkg.arrivalTime)} · {fmt(pkg.arrivalTime)}
+                </InfoRow>
+                <InfoRow icon={<Users className="w-4 h-4 text-primary" />} label="Total Capacity">
+                  {pkg.totalCapacity} seats ({pkg.bookedCount} booked)
+                </InfoRow>
+                {pkg.coachConfiguration && (
+                  <InfoRow icon={<Train className="w-4 h-4 text-primary" />} label="Coach Config">
+                    {pkg.coachConfiguration.trim()}
+                  </InfoRow>
+                )}
+                <InfoRow icon={<Shield className="w-4 h-4 text-primary" />} label="Valid Period">
+                  {fmt(pkg.validFrom, { month: "short", day: "numeric" })} –{" "}
+                  {fmt(pkg.validUntil, { month: "short", day: "numeric", year: "numeric" })}
+                </InfoRow>
+              </div>
+            </div>
+
+            {/* Included services */}
+            {pkg.includedServices?.length > 0 && (
+              <div className="bg-white dark:bg-gray-900 rounded-2xl p-6 border border-gray-100 dark:border-gray-800">
+                <h2 className="text-base font-bold text-gray-900 dark:text-white mb-4">
+                  Included Services
+                </h2>
+                <ul className="space-y-2.5">
+                  {pkg.includedServices.map((svc, i) => (
+                    <li
+                      key={i}
+                      className="flex items-start gap-2.5 text-sm text-gray-600 dark:text-gray-400"
+                    >
+                      <Check className="w-4 h-4 text-green-500 flex-shrink-0 mt-0.5" />
+                      {stripBullet(svc)}
+                    </li>
+                  ))}
+                </ul>
+              </div>
+            )}
+
+            {/* Price tiers — mobile */}
+            <div className="lg:hidden">
+              <PriceTiersPanel
+                tiers={pkg.priceTiers}
+                selectedTierId={selectedTierId}
+                onSelect={setSelectedTierId}
+                selectedTier={selectedTier}
+                onBookNow={() => setInquiryOpen(true)}
+              />
+            </div>
+          </div>
+
+          {/* ── Sidebar — desktop ── */}
+          <div className="hidden lg:block">
+            <div className="sticky top-20">
+              <PriceTiersPanel
+                tiers={pkg.priceTiers}
+                selectedTierId={selectedTierId}
+                onSelect={setSelectedTierId}
+                selectedTier={selectedTier}
+                onBookNow={() => setInquiryOpen(true)}
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function InfoRow({
+  icon,
+  label,
+  children,
+}: {
+  icon: React.ReactNode;
+  label: string;
+  children: React.ReactNode;
+}) {
+  return (
+    <div className="flex items-start gap-3">
+      <div className="flex-shrink-0 mt-0.5">{icon}</div>
+      <div>
+        <p className="text-[10px] text-gray-400 uppercase tracking-wide font-semibold">
+          {label}
+        </p>
+        <p className="text-sm font-medium text-gray-700 dark:text-gray-300 mt-0.5">
+          {children}
+        </p>
+      </div>
+    </div>
+  );
+}
diff --git a/apps/edr-passenger-web/portal/src/app/page.tsx b/apps/edr-passenger-web/portal/src/app/page.tsx
index 5e717705f..93bf02fc2 100644
--- a/apps/edr-passenger-web/portal/src/app/page.tsx
+++ b/apps/edr-passenger-web/portal/src/app/page.tsx
@@ -1,10 +1,27 @@
 import { Suspense } from 'react';
+import { dehydrate, HydrationBoundary, QueryClient } from '@tanstack/react-query';
 import SearchPage from '@/app/booking/search/page';
+import PackagesSection from '@/components/PackagesSection';
+
+export default async function Home() {
+  const queryClient = new QueryClient();
+  const apiUrl = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:4000';
+
+  await queryClient.prefetchQuery({
+    queryKey: ['stations'],
+    queryFn: async () => {
+      const res = await fetch(`${apiUrl}/stations`, { next: { revalidate: 3600 } });
+      const json = await res.json();
+      return json?.data ?? json;
+    },
+  });
 
-export default function Home() {
   return (
-    <Suspense>
-      <SearchPage />
-    </Suspense>
+    <HydrationBoundary state={dehydrate(queryClient)}>
+      <Suspense>
+        <SearchPage />
+        <PackagesSection />
+      </Suspense>
+    </HydrationBoundary>
   );
 }
diff --git a/apps/edr-passenger-web/portal/src/components/AppHeader.tsx b/apps/edr-passenger-web/portal/src/components/AppHeader.tsx
index 6422e12fa..200b07222 100644
--- a/apps/edr-passenger-web/portal/src/components/AppHeader.tsx
+++ b/apps/edr-passenger-web/portal/src/components/AppHeader.tsx
@@ -31,7 +31,7 @@ export default function AppHeader() {
 
 
   return (
-    <header className="sticky top-0 z-50 bg-[rgb(20_113_76)] dark:bg-gray-900 border-b border-[rgb(16_89_60)] dark:border-gray-800 shadow-sm">
+    <header className="sticky top-0 z-[60] bg-[rgb(20_113_76)] dark:bg-gray-900 border-b border-[rgb(16_89_60)] dark:border-gray-800 shadow-sm">
       <div className="container mx-auto px-4">
         <div className="max-w-6xl mx-auto">
           <div className="flex items-center justify-between h-16">
diff --git a/apps/edr-passenger-web/portal/src/components/PackagesSection.tsx b/apps/edr-passenger-web/portal/src/components/PackagesSection.tsx
new file mode 100644
index 000000000..abadbe4e7
--- /dev/null
+++ b/apps/edr-passenger-web/portal/src/components/PackagesSection.tsx
@@ -0,0 +1,544 @@
+"use client";
+
+import { useQuery } from "@tanstack/react-query";
+import { apiClient } from "@/lib/api-client";
+import Link from "next/link";
+import Image from "next/image";
+import {
+  MapPin,
+  ArrowRight,
+  Shield,
+  Train,
+  Bus,
+  CheckCircle2,
+  Calendar,
+  Clock,
+} from "lucide-react";
+
+// ─── Types ────────────────────────────────────────────────────────────────────
+
+interface PriceTier {
+  id: string;
+  priceMinor: number;
+  currency: string;
+  availableSeats: number;
+}
+
+interface Station {
+  name: string;
+  city: string;
+  code: string;
+}
+
+interface Schedule {
+  originStation: Station;
+  destinationStation: Station;
+  departureAt: string;
+  durationMinutes: number;
+}
+
+interface HolidayPackage {
+  id: string;
+  code: string;
+  name: string;
+  description?: string | null;
+  status: string;
+  departureTime: string;
+  validFrom: string;
+  validUntil: string;
+  totalCapacity: number;
+  bookedCount: number;
+  includedServices?: string[];
+  busTransferIncluded?: boolean;
+  busTransferRoute?: string | null;
+  returnSchedule?: Schedule | null;
+  outboundSchedule?: Schedule;
+  priceTiers: PriceTier[];
+}
+
+// ─── Helpers ──────────────────────────────────────────────────────────────────
+
+function fmtDate(iso: string, opts?: Intl.DateTimeFormatOptions): string {
+  try {
+    return new Date(iso).toLocaleDateString(
+      "en-US",
+      opts ?? { month: "short", day: "numeric" },
+    );
+  } catch {
+    return iso;
+  }
+}
+
+function validityRange(from: string, until: string): string {
+  return `${fmtDate(from, { month: "short", day: "numeric" })} – ${fmtDate(until, { month: "short", day: "numeric", year: "numeric" })}`;
+}
+
+function daysUntil(iso: string): number {
+  return Math.max(
+    0,
+    Math.floor((new Date(iso).getTime() - Date.now()) / 86400000),
+  );
+}
+
+function minPrice(
+  tiers: PriceTier[],
+): { amount: number; currency: string } | null {
+  if (!tiers?.length) return null;
+  const min = tiers.reduce((a, b) => (a.priceMinor < b.priceMinor ? a : b));
+  return { amount: min.priceMinor / 100, currency: min.currency };
+}
+
+function fmtPrice(minor: number, currency: string): string {
+  return `${currency} ${(minor / 100).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
+}
+
+function stripBullet(s: string): string {
+  return s.replace(/^[•\-\t\s]+/, "").trim();
+}
+
+// ─── Urgency badge ────────────────────────────────────────────────────────────
+
+function UrgencyBadge({ until }: { until: string }) {
+  const days = daysUntil(until);
+  if (days > 14) return null;
+  return (
+    <span
+      className={`text-[10px] font-bold px-2.5 py-1 rounded-full ${
+        days <= 3
+          ? "bg-red-500 text-white animate-pulse"
+          : "bg-orange-400 text-white"
+      }`}
+    >
+      {days === 0 ? "Last day!" : `Closes in ${days}d`}
+    </span>
+  );
+}
+
+// ─── Availability bar ─────────────────────────────────────────────────────────
+
+function AvailBar({ booked, total }: { booked: number; total: number }) {
+  const pct = total > 0 ? Math.round(((total - booked) / total) * 100) : 100;
+  const low = pct <= 20;
+  return (
+    <div>
+      <div className="flex items-center justify-between text-[10px] text-gray-400 mb-1">
+        <span>
+          {total - booked} of {total} seats
+        </span>
+        <span className={low ? "text-orange-500 font-semibold" : ""}>
+          {pct}% available
+        </span>
+      </div>
+      <div className="h-1 bg-gray-100 dark:bg-gray-800 rounded-full overflow-hidden">
+        <div
+          className={`h-full rounded-full transition-all ${low ? "bg-orange-400" : "bg-primary"}`}
+          style={{ width: `${pct}%` }}
+        />
+      </div>
+    </div>
+  );
+}
+
+// ─── Featured Card (first package — full-width, image left) ───────────────────
+
+function FeaturedCard({ pkg }: { pkg: HolidayPackage }) {
+  const price = minPrice(pkg.priceTiers);
+  const origin = pkg.outboundSchedule?.originStation;
+  const dest = pkg.outboundSchedule?.destinationStation;
+  const days = daysUntil(pkg.validUntil);
+
+  return (
+    <Link href={`/packages/${pkg.id}`} className="group block">
+      <div className="relative bg-white dark:bg-gray-900 rounded-3xl overflow-hidden border border-gray-100 dark:border-gray-800 shadow-sm hover:shadow-2xl transition-all duration-500">
+        <div className="flex flex-col md:flex-row min-h-[340px]">
+          {/* ── Left: Image ── */}
+          <div className="relative md:w-[46%] h-64 md:h-auto flex-shrink-0 overflow-hidden">
+            <Image
+              src="/packages/kulubi.jpeg"
+              alt={pkg.name}
+              fill
+              className="object-cover group-hover:scale-105 transition-transform duration-700 ease-out"
+              sizes="(max-width: 768px) 100vw, 46vw"
+              priority
+            />
+            {/* Gradient overlay */}
+            <div className="absolute inset-0 bg-gradient-to-t from-black/60 via-black/10 to-transparent md:bg-gradient-to-r md:from-transparent md:via-transparent md:to-black/30" />
+
+            {/* Top-left badges */}
+            <div className="absolute top-4 left-4 flex flex-wrap gap-2">
+              <span className="flex items-center gap-1 bg-primary text-white text-[11px] font-bold px-3 py-1 rounded-full shadow">
+                ✦ Featured Package
+              </span>
+              <UrgencyBadge until={pkg.validUntil} />
+            </div>
+
+            {/* Bottom-left: round trip tag */}
+            {pkg.returnSchedule && (
+              <div className="absolute bottom-4 left-4">
+                <span className="flex items-center gap-1.5 bg-white/90 dark:bg-gray-900/90 backdrop-blur-sm text-gray-800 dark:text-white text-[11px] font-bold px-3 py-1.5 rounded-full shadow">
+                  <ArrowRight className="w-3 h-3 rotate-0" />
+                  <ArrowRight className="w-3 h-3 rotate-180 -ml-2" />
+                  Round Trip
+                </span>
+              </div>
+            )}
+
+          </div>
+
+          {/* ── Right: Content ── */}
+          <div className="flex-1 flex flex-col justify-between p-7 md:p-8">
+            {/* Top section */}
+            <div>
+              {/* Status */}
+              {pkg.status === "ACTIVE" && (
+                <span className="inline-flex items-center gap-1 text-[10px] font-bold text-green-700 bg-green-50 dark:bg-green-900/30 dark:text-green-400 px-2.5 py-1 rounded-full mb-3">
+                  <span className="w-1.5 h-1.5 rounded-full bg-green-500 inline-block" />
+                  Booking Open
+                </span>
+              )}
+
+              {/* Name */}
+              <h3 className="text-xl md:text-2xl font-extrabold text-gray-900 dark:text-white leading-tight mb-1.5">
+                {pkg.name.trim()}
+              </h3>
+
+              {/* Route */}
+              {origin && dest && (
+                <div className="flex items-center gap-1.5 text-sm text-gray-500 dark:text-gray-400 mb-5">
+                  <Train className="w-3.5 h-3.5 text-primary flex-shrink-0" />
+                  <span className="font-medium text-gray-700 dark:text-gray-300">
+                    {origin.name.trim()}
+                  </span>
+                  <ArrowRight className="w-3 h-3 flex-shrink-0" />
+                  <span className="font-medium text-gray-700 dark:text-gray-300">
+                    {dest.name.trim()}
+                  </span>
+                  {pkg.busTransferIncluded && (
+                    <>
+                      <span className="text-gray-300 dark:text-gray-600">
+                        +
+                      </span>
+                      <Bus className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />
+                      <span className="font-medium text-gray-600 dark:text-gray-400">
+                        {pkg.busTransferRoute?.trim() ?? "Bus transfer"}
+                      </span>
+                    </>
+                  )}
+                </div>
+              )}
+
+              {/* Info grid */}
+              <div className="grid grid-cols-2 gap-x-6 gap-y-3 mb-5">
+                <InfoPill
+                  icon={<Shield className="w-3.5 h-3.5 text-primary" />}
+                  label="Validity"
+                >
+                  {validityRange(pkg.validFrom, pkg.validUntil)}
+                </InfoPill>
+                <InfoPill
+                  icon={<Clock className="w-3.5 h-3.5 text-primary" />}
+                  label="Booking closes"
+                >
+                  <span
+                    className={days <= 7 ? "text-orange-500 font-semibold" : ""}
+                  >
+                    {fmtDate(pkg.validUntil, {
+                      month: "short",
+                      day: "numeric",
+                      year: "numeric",
+                    })}
+                    {days <= 14 && ` (${days}d left)`}
+                  </span>
+                </InfoPill>
+              </div>
+
+              {/* Service chips */}
+              {pkg.includedServices && pkg.includedServices.length > 0 && (
+                <div className="flex flex-wrap gap-1.5 mb-5">
+                  {pkg.includedServices.slice(0, 4).map((svc, i) => (
+                    <span
+                      key={i}
+                      className="inline-flex items-center gap-1 text-[10px] font-medium text-gray-600 dark:text-gray-400 bg-gray-50 dark:bg-gray-800 border border-gray-200 dark:border-gray-700 px-2.5 py-1 rounded-full"
+                    >
+                      <CheckCircle2 className="w-3 h-3 text-green-500 flex-shrink-0" />
+                      {stripBullet(svc).split(/\s+/).slice(0, 5).join(" ")}
+                    </span>
+                  ))}
+                  {pkg.includedServices.length > 4 && (
+                    <span className="text-[10px] text-gray-400 flex items-center px-1">
+                      +{pkg.includedServices.length - 4} more included
+                    </span>
+                  )}
+                </div>
+              )}
+            </div>
+
+            {/* Bottom: price + CTA */}
+            <div className="flex items-end justify-between pt-5 border-t border-gray-100 dark:border-gray-800">
+              {price ? (
+                <div>
+                  <p className="text-[10px] text-gray-400 uppercase tracking-wider font-medium">
+                    Starting from
+                  </p>
+                  <p className="text-3xl font-extrabold text-primary leading-none mt-1">
+                    {price.currency}{" "}
+                    <span className="text-2xl">
+                      {price.amount.toLocaleString(undefined, {
+                        minimumFractionDigits: 2,
+                        maximumFractionDigits: 2,
+                      })}
+                    </span>
+                  </p>
+                  <p className="text-[10px] text-gray-400 mt-1">
+                    {pkg.priceTiers.length} seat class
+                    {pkg.priceTiers.length !== 1 ? "es" : ""} available
+                  </p>
+                </div>
+              ) : (
+                <div />
+              )}
+              <span className="inline-flex items-center gap-2 bg-[rgb(20,113,76)] group-hover:bg-[rgb(16,89,60)] text-white text-sm font-bold px-6 py-3.5 rounded-xl shadow-lg group-hover:shadow-xl transition-all duration-200 group-hover:gap-3">
+                View Package
+                <ArrowRight className="w-4 h-4" />
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </Link>
+  );
+}
+
+// ─── Regular Package Card ─────────────────────────────────────────────────────
+
+function PackageCard({ pkg }: { pkg: HolidayPackage }) {
+  const price = minPrice(pkg.priceTiers);
+  const origin = pkg.outboundSchedule?.originStation;
+  const dest = pkg.outboundSchedule?.destinationStation;
+
+  return (
+    <Link href={`/packages/${pkg.id}`} className="group block h-full">
+      <div className="bg-white dark:bg-gray-900 rounded-2xl overflow-hidden border border-gray-200 dark:border-gray-800 hover:border-primary/60 hover:shadow-xl transition-all duration-300 flex flex-col h-full">
+        {/* Image / Gradient */}
+        <div className="relative h-44 overflow-hidden bg-gradient-to-br from-[rgb(14,80,54)] to-[rgb(20,140,90)] flex-shrink-0">
+          <div className="absolute inset-0 flex items-center justify-center">
+            <span className="text-6xl opacity-20">🌍</span>
+          </div>
+          <div className="absolute inset-0 bg-gradient-to-t from-black/50 via-transparent to-transparent" />
+
+          <div className="absolute top-3 left-3 flex items-center gap-2">
+            <UrgencyBadge until={pkg.validUntil} />
+          </div>
+
+          {pkg.returnSchedule && (
+            <div className="absolute bottom-3 left-3">
+              <span className="bg-white/90 dark:bg-gray-900/90 backdrop-blur-sm text-gray-800 dark:text-white text-[10px] font-bold px-2.5 py-1 rounded-full">
+                ↔ Round Trip
+              </span>
+            </div>
+          )}
+        </div>
+
+        {/* Content */}
+        <div className="flex flex-col flex-1 p-4">
+          <h3 className="font-bold text-gray-900 dark:text-white text-sm leading-snug mb-2.5 line-clamp-2">
+            {pkg.name.trim()}
+          </h3>
+
+          {/* Route */}
+          {origin && dest && (
+            <div className="flex items-center gap-1 text-xs text-gray-500 dark:text-gray-400 mb-2">
+              <MapPin className="w-3 h-3 text-primary flex-shrink-0" />
+              <span className="truncate">{origin.name.trim()}</span>
+              <ArrowRight className="w-3 h-3 flex-shrink-0 text-gray-300" />
+              <span className="truncate">{dest.name.trim()}</span>
+            </div>
+          )}
+
+          {/* Validity */}
+          <div className="flex items-center gap-1.5 text-xs text-gray-500 dark:text-gray-400 mb-3">
+            <Shield className="w-3.5 h-3.5 text-primary flex-shrink-0" />
+            <span>{validityRange(pkg.validFrom, pkg.validUntil)}</span>
+          </div>
+
+          {/* Departure */}
+          <div className="flex items-center gap-1.5 text-xs text-gray-500 dark:text-gray-400 mb-3">
+            <Calendar className="w-3.5 h-3.5 text-primary flex-shrink-0" />
+            <span>
+              Departs{" "}
+              {fmtDate(pkg.departureTime, {
+                weekday: "short",
+                month: "short",
+                day: "numeric",
+              })}
+            </span>
+          </div>
+
+          {/* Availability bar */}
+          <div className="mb-4">
+            <AvailBar booked={pkg.bookedCount} total={pkg.totalCapacity} />
+          </div>
+
+          {/* Price + CTA */}
+          <div className="mt-auto pt-3.5 border-t border-gray-100 dark:border-gray-800 flex items-center justify-between">
+            {price ? (
+              <div>
+                <p className="text-[10px] text-gray-400 uppercase tracking-wide">
+                  From
+                </p>
+                <p className="text-base font-extrabold text-primary">
+                  {fmtPrice(price.amount * 100, price.currency)}
+                </p>
+              </div>
+            ) : (
+              <div />
+            )}
+            <span className="text-xs text-primary font-bold flex items-center gap-1 group-hover:gap-2 transition-all">
+              View <ArrowRight className="w-3.5 h-3.5" />
+            </span>
+          </div>
+        </div>
+      </div>
+    </Link>
+  );
+}
+
+// ─── Skeletons ────────────────────────────────────────────────────────────────
+
+function FeaturedSkeleton() {
+  return (
+    <div className="rounded-3xl overflow-hidden border border-gray-100 dark:border-gray-800 animate-pulse flex flex-col md:flex-row min-h-[340px]">
+      <div className="md:w-[46%] h-64 md:h-auto bg-gray-200 dark:bg-gray-700 flex-shrink-0" />
+      <div className="flex-1 p-8 space-y-4">
+        <div className="h-4 bg-gray-200 dark:bg-gray-700 rounded w-1/4" />
+        <div className="h-7 bg-gray-200 dark:bg-gray-700 rounded w-3/4" />
+        <div className="h-4 bg-gray-200 dark:bg-gray-700 rounded w-1/2" />
+        <div className="grid grid-cols-2 gap-4 pt-2">
+          {[1, 2, 3, 4].map((i) => (
+            <div
+              key={i}
+              className="h-10 bg-gray-200 dark:bg-gray-700 rounded"
+            />
+          ))}
+        </div>
+        <div className="flex gap-2 pt-2">
+          {[1, 2, 3].map((i) => (
+            <div
+              key={i}
+              className="h-6 w-28 bg-gray-200 dark:bg-gray-700 rounded-full"
+            />
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function CardSkeleton() {
+  return (
+    <div className="rounded-2xl overflow-hidden border border-gray-100 dark:border-gray-800 animate-pulse">
+      <div className="h-44 bg-gray-200 dark:bg-gray-700" />
+      <div className="p-4 space-y-3">
+        <div className="h-4 bg-gray-200 dark:bg-gray-700 rounded w-3/4" />
+        <div className="h-3 bg-gray-200 dark:bg-gray-700 rounded w-1/2" />
+        <div className="h-3 bg-gray-200 dark:bg-gray-700 rounded w-2/3" />
+        <div className="h-1 bg-gray-200 dark:bg-gray-700 rounded" />
+      </div>
+    </div>
+  );
+}
+
+// ─── Info Pill (for featured card) ────────────────────────────────────────────
+
+function InfoPill({
+  icon,
+  label,
+  children,
+}: {
+  icon: React.ReactNode;
+  label: string;
+  children: React.ReactNode;
+}) {
+  return (
+    <div className="flex items-start gap-2">
+      <div className="flex-shrink-0 mt-0.5">{icon}</div>
+      <div className="min-w-0">
+        <p className="text-[10px] text-gray-400 uppercase tracking-wide font-semibold">
+          {label}
+        </p>
+        <p className="text-xs font-semibold text-gray-700 dark:text-gray-300 mt-0.5 leading-snug">
+          {children}
+        </p>
+      </div>
+    </div>
+  );
+}
+
+// ─── Section ──────────────────────────────────────────────────────────────────
+
+export default function PackagesSection() {
+  const {
+    data: packages,
+    isLoading,
+    isError,
+  } = useQuery<HolidayPackage[]>({
+    queryKey: ["packages"],
+    queryFn: async () =>
+      (await apiClient.get<HolidayPackage[]>("/packages")) as HolidayPackage[],
+    staleTime: 5 * 60 * 1000,
+  });
+
+  if (isError) return null;
+
+  const [featured, ...rest] = packages ?? [];
+
+  return (
+    <section className="bg-gray-50 dark:bg-gray-950 py-12">
+      <div className="container mx-auto px-4">
+        <div className="max-w-6xl mx-auto space-y-6">
+          {/* Section header */}
+          <div className="flex items-center justify-between">
+            <div className="flex items-center gap-2.5">
+              <span className="text-xl">🏖️</span>
+              <h2 className="text-base font-bold text-gray-900 dark:text-white">
+                Holiday Packages
+              </h2>
+            </div>
+          </div>
+
+          {/* Featured card */}
+          {isLoading ? (
+            <FeaturedSkeleton />
+          ) : featured ? (
+            <FeaturedCard pkg={featured} />
+          ) : null}
+
+          {/* Rest grid — 3 col desktop / 2 col tablet / 1 col mobile */}
+          {isLoading ? (
+            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-5">
+              {[1, 2, 3].map((i) => (
+                <CardSkeleton key={i} />
+              ))}
+            </div>
+          ) : rest.length > 0 ? (
+            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-5">
+              {rest.map((pkg) => (
+                <PackageCard key={pkg.id} pkg={pkg} />
+              ))}
+            </div>
+          ) : null}
+
+          {/* Empty state */}
+          {!isLoading && !isError && !packages?.length && (
+            <div className="py-16 text-center">
+              <span className="text-5xl block mb-3">🏖️</span>
+              <p className="text-sm text-gray-400">
+                No holiday packages available right now. Check back soon.
+              </p>
+            </div>
+          )}
+        </div>
+      </div>
+    </section>
+  );
+}
diff --git a/apps/edr-passenger-web/portal/src/components/SearchWidget.tsx b/apps/edr-passenger-web/portal/src/components/SearchWidget.tsx
index 85154558e..36bd545e6 100644
--- a/apps/edr-passenger-web/portal/src/components/SearchWidget.tsx
+++ b/apps/edr-passenger-web/portal/src/components/SearchWidget.tsx
@@ -146,7 +146,7 @@ export function SearchWidget({ fullWidth = false, onSearch }: SearchWidgetProps)
             </div>
 
             {/* Date */}
-            <div className="space-y-2 relative z-30 md:col-span-1">
+            <div className="space-y-2 md:col-span-1">
               <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 text-left">Date</label>
               <ModernDatePicker
                 value={watch('departureDate') ? new Date(watch('departureDate') + 'T00:00:00') : undefined}
diff --git a/apps/edr-passenger-web/portal/src/lib/generate-voucher.ts b/apps/edr-passenger-web/portal/src/lib/generate-voucher.ts
index 37dfa5ce9..4dd969d69 100644
--- a/apps/edr-passenger-web/portal/src/lib/generate-voucher.ts
+++ b/apps/edr-passenger-web/portal/src/lib/generate-voucher.ts
@@ -119,7 +119,7 @@ function drawJourneyLeg(doc: jsPDF, schedule: ScheduleInfo, label: string | null
 
   const dep = new Date(schedule.departureAt);
   doc.setFontSize(13); doc.setTextColor(...PRIMARY); doc.setFont('helvetica', 'bold');
-  doc.text(dep.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit', hour12: false }), margin + 5, y + 33);
+  doc.text(dep.toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit', hour12: true }), margin + 5, y + 33);
   doc.setFontSize(7);  doc.setTextColor(...MED); doc.setFont('helvetica', 'normal');
   doc.text(dep.toLocaleDateString('en-US', { weekday: 'short', month: 'short', day: 'numeric', year: 'numeric' }), margin + 5, y + 38);
 
@@ -143,7 +143,7 @@ function drawJourneyLeg(doc: jsPDF, schedule: ScheduleInfo, label: string | null
 
   const arr = new Date(schedule.arrivalAt);
   doc.setFontSize(13); doc.setTextColor(...PRIMARY); doc.setFont('helvetica', 'bold');
-  doc.text(arr.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit', hour12: false }), dx, y + 33);
+  doc.text(arr.toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit', hour12: true }), dx, y + 33);
   doc.setFontSize(7);  doc.setTextColor(...MED); doc.setFont('helvetica', 'normal');
   doc.text(arr.toLocaleDateString('en-US', { weekday: 'short', month: 'short', day: 'numeric', year: 'numeric' }), dx, y + 38);
 
diff --git a/apps/edr-passenger-web/portal/src/utils/format.ts b/apps/edr-passenger-web/portal/src/utils/format.ts
index 8e4294bfc..3743334ad 100644
--- a/apps/edr-passenger-web/portal/src/utils/format.ts
+++ b/apps/edr-passenger-web/portal/src/utils/format.ts
@@ -13,9 +13,17 @@ export const formatDate = (date: string | Date, formatStr: string = 'MMM dd, yyy
 };
 
 export const formatDateTime = (date: string | Date): string => {
-  return format(new Date(date), 'MMM dd, yyyy HH:mm');
+  return format(new Date(date), 'MMM dd, yyyy h:mm a');
 };
 
 export const formatTime = (date: string | Date): string => {
-  return format(new Date(date), 'HH:mm');
+  return format(new Date(date), 'h:mm a');
+};
+
+export const getTimePeriod = (date: string | Date): string => {
+  const hour = new Date(date).getHours();
+  if (hour >= 5 && hour < 12) return 'Morning';
+  if (hour >= 12 && hour < 17) return 'Afternoon';
+  if (hour >= 17 && hour < 21) return 'Evening';
+  return 'Night';
 };
diff --git a/packages/types/src/freight/clearance-files.catalog.ts b/packages/types/src/freight/clearance-files.catalog.ts
new file mode 100644
index 000000000..fe6e9ebbf
--- /dev/null
+++ b/packages/types/src/freight/clearance-files.catalog.ts
@@ -0,0 +1,130 @@
+/** Phased customs uploads stored by raw file `code` on contract/booking resources. */
+export type ClearanceWorkflowFileOwner = "customer" | "gl_et" | "gl_dj";
+
+export type ClearanceWorkflowFileCategory =
+  | "declaration"
+  | "duty"
+  | "transit"
+  | "djibouti";
+
+export interface ClearanceWorkflowFileCatalogEntry {
+  code: string;
+  label: string;
+  uploadedBy: ClearanceWorkflowFileOwner;
+  category: ClearanceWorkflowFileCategory;
+  /** Omit when the file applies to both directions. */
+  tradeDirection?: "IMPORT" | "EXPORT";
+}
+
+export const CLEARANCE_WORKFLOW_FILE_CATALOG: ClearanceWorkflowFileCatalogEntry[] = [
+  { code: "im4", label: "IM4 Declaration", uploadedBy: "gl_et", category: "declaration", tradeDirection: "IMPORT" },
+  { code: "im5", label: "IM5 Declaration", uploadedBy: "gl_et", category: "declaration", tradeDirection: "IMPORT" },
+  { code: "ex3", label: "EX3 Declaration", uploadedBy: "gl_et", category: "declaration", tradeDirection: "EXPORT" },
+  { code: "ex8", label: "EX8 Declaration", uploadedBy: "gl_et", category: "declaration", tradeDirection: "EXPORT" },
+  { code: "duty_tax_notice", label: "Duty / Tax Notice", uploadedBy: "gl_et", category: "duty" },
+  { code: "duty_tax_receipt", label: "Duty / Tax Payment Slip", uploadedBy: "customer", category: "duty" },
+  { code: "transit_permitted", label: "Transit Permit", uploadedBy: "gl_et", category: "transit", tradeDirection: "IMPORT" },
+  {
+    code: "export_transport_document",
+    label: "Transit Permit",
+    uploadedBy: "gl_et",
+    category: "transit",
+    tradeDirection: "EXPORT",
+  },
+  { code: "delivery_order", label: "Delivery Order", uploadedBy: "gl_dj", category: "djibouti", tradeDirection: "IMPORT" },
+  { code: "release_order", label: "Release Order", uploadedBy: "gl_dj", category: "djibouti", tradeDirection: "EXPORT" },
+];
+
+/** Legacy single-type declaration codes (still shown when already uploaded). */
+export const LEGACY_DECLARATION_FILE_CODES = ["im4", "im5", "ex3", "ex8"] as const;
+
+/** Multi-file declaration uploads use `declaration_0`, `declaration_1`, … */
+export const DECLARATION_FILE_PREFIX = "declaration_";
+
+export function isDeclarationFileCode(code: string | null | undefined): boolean {
+  if (!code) return false;
+  const lower = code.toLowerCase();
+  return (
+    (LEGACY_DECLARATION_FILE_CODES as readonly string[]).includes(lower) ||
+    lower === "declaration" ||
+    lower.startsWith(DECLARATION_FILE_PREFIX)
+  );
+}
+
+export interface ClearanceWorkflowFile {
+  code: string;
+  label: string;
+  uploadedBy: ClearanceWorkflowFileOwner;
+  category: ClearanceWorkflowFileCategory;
+  file: { id: string; name: string; url: string } | null;
+}
+
+const CATALOG_BY_CODE = new Map(
+  CLEARANCE_WORKFLOW_FILE_CATALOG.map((e) => [e.code, e]),
+);
+
+export function clearanceWorkflowFileLabel(code: string | null | undefined): string | null {
+  if (!code) return null;
+  return CATALOG_BY_CODE.get(code)?.label ?? null;
+}
+
+export function declarationFileLabel(code: string, index?: number): string {
+  const lower = code.toLowerCase();
+  const legacy = CATALOG_BY_CODE.get(lower);
+  if (legacy?.category === "declaration") return legacy.label;
+  if (lower.startsWith(DECLARATION_FILE_PREFIX) || lower === "declaration") {
+    return index != null ? `Declaration document ${index + 1}` : "Customs declaration";
+  }
+  return code;
+}
+
+/** Legacy single import transit permit code. */
+export const LEGACY_IMPORT_TRANSIT_PERMIT_CODE = "transit_permitted";
+
+/** Multi-file import transit permit uploads use `transit_permit_0`, `transit_permit_1`, … */
+export const TRANSIT_PERMIT_FILE_PREFIX = "transit_permit_";
+
+export function isImportTransitPermitFileCode(code: string | null | undefined): boolean {
+  if (!code) return false;
+  const lower = code.toLowerCase();
+  return (
+    lower === LEGACY_IMPORT_TRANSIT_PERMIT_CODE || lower.startsWith(TRANSIT_PERMIT_FILE_PREFIX)
+  );
+}
+
+export function transitPermitFileLabel(code: string, index?: number): string {
+  const lower = code.toLowerCase();
+  if (lower === LEGACY_IMPORT_TRANSIT_PERMIT_CODE) return "Transit Permit";
+  if (lower.startsWith(TRANSIT_PERMIT_FILE_PREFIX)) {
+    return index != null ? `Transit permit ${index + 1}` : "Transit Permit";
+  }
+  return code;
+}
+
+export const LEGACY_EXPORT_TRANSPORT_CODE = "export_transport_document";
+
+export function isExportTransportFileCode(code: string | null | undefined): boolean {
+  if (!code) return false;
+  const lower = code.toLowerCase();
+  return (
+    lower === LEGACY_EXPORT_TRANSPORT_CODE ||
+    lower.startsWith(`${LEGACY_EXPORT_TRANSPORT_CODE}_`)
+  );
+}
+
+export function exportTransportFileLabel(code: string, index?: number): string {
+  const lower = code.toLowerCase();
+  if (lower === LEGACY_EXPORT_TRANSPORT_CODE) return "Transit Permit";
+  if (lower.startsWith(`${LEGACY_EXPORT_TRANSPORT_CODE}_`)) {
+    return index != null ? `Transit permit ${index + 1}` : "Transit Permit";
+  }
+  return code;
+}
+
+export function catalogEntriesForTradeDirection(
+  tradeDirection: string,
+): ClearanceWorkflowFileCatalogEntry[] {
+  return CLEARANCE_WORKFLOW_FILE_CATALOG.filter(
+    (e) => !e.tradeDirection || e.tradeDirection === tradeDirection,
+  );
+}
diff --git a/packages/types/src/freight/contracts.ts b/packages/types/src/freight/contracts.ts
index 0dbadc50f..f4c0b3380 100644
--- a/packages/types/src/freight/contracts.ts
+++ b/packages/types/src/freight/contracts.ts
@@ -259,6 +259,39 @@ export interface ContractClearanceView {
   documents: ContractClearanceDocument[];
   /** True once every required customer document is APPROVED. */
   allApproved: boolean;
+  /** Current phased clearance step (ONE_TIME customs). */
+  phase?: ContractDocPhase | null;
+  /** Pre-booking milestone rows for this contract cycle. */
+  milestones?: IClearanceMilestone[];
+  /** What should happen next in the workflow. */
+  nextAction?: ClearanceNextAction | null;
+  dutyRequired?: boolean | null;
+  roHold?: boolean;
+  roHoldReason?: string | null;
+  vesselDepartureDate?: string | null;
+  roAmendmentRequestedAt?: string | null;
+  bookingReady?: boolean;
+  preClearanceFinalized?: boolean;
+  /** Export post-booking clearance finalized after transit permit upload. */
+  exportClearanceFinalized?: boolean;
+  linkedBookingId?: string | null;
+  dutyAdvice?: {
+    amount: number;
+    currency: string;
+    declarationSerial?: string | null;
+    noticeFile?: { id: string; name: string; url: string } | null;
+  } | null;
+  /** Phased customs uploads (IM4, DO, transit permit, etc.) with friendly labels. */
+  workflowFiles?: import("./clearance-files.catalog").ClearanceWorkflowFile[];
+}
+
+export type ClearanceActorRole = "CUSTOMER" | "GL_ET" | "GL_DJ" | "OPERATIONS";
+
+export interface ClearanceNextAction {
+  actor: ClearanceActorRole;
+  action: string;
+  milestoneCode?: string | null;
+  blockedReason?: string | null;
 }
 
 /** Phased clearance document upload slots (doc §5.13). */
@@ -334,6 +367,7 @@ export const IMPORT_MILESTONES = [
   "DECLARED",
   "DUTY_TAXES_ADVISED",
   "DUTY_TAX_PAID",
+  "TRANSIT_PERMIT_UPLOADED",
   "DO_COLLECTED",
   "WAGON_REQUESTED",
   "FREIGHT_PAYMENT_SETTLED",
@@ -366,6 +400,7 @@ export const EXPORT_MILESTONES = [
   "FREIGHT_PAYMENT_PENDING",
   "FREIGHT_PAYMENT_SETTLED",
   "WAGON_ALLOCATED",
+  "EXPORT_TRANSPORT_ISSUED",
   "CARGO_ARRIVED",
   "READY_FOR_LOADING",
   "LOADED",
@@ -411,7 +446,10 @@ export interface IContract extends BaseEntity {
     id: string;
     code: string;
     serviceName: string;
+    description?: string | null;
     canBeBookedAlone: boolean;
+    includesFirstMile?: boolean;
+    includesLastMile?: boolean;
     includesCustoms: boolean;
   } | null;
   paymentCurrency: string;
@@ -557,6 +595,7 @@ export interface CreateBulkLineDto {
   cargoWeightTons?: number;
   itemCount?: number;
   hazardousQuantity?: number;
+  reeferQuantity?: number;
 }
 
 /** Shipment booking created under a contract (Path A customer, Path B GL ET). */
@@ -614,6 +653,39 @@ export interface IBookingRequest extends BaseEntity {
   reviewedByStaffId?: string | null;
   reviewedAt?: string | null;
   reviewNote?: string | null;
+  /** Loaded contract relation (request detail response includes it). */
+  contract?: BookingRequestContract | null;
+}
+
+/** Customer (company) summary carried on a request's contract. */
+export interface BookingRequestCompany {
+  id: string;
+  name?: string | null;
+  tin?: string | null;
+  email?: string | null;
+  phone?: string | null;
+  address?: string | null;
+  contactPersonName?: string | null;
+  contactPersonPhone?: string | null;
+}
+
+/**
+ * The slice of the contract surfaced on the shipment-request detail page:
+ * identity, service type (mile/customs flags), customer, routes and cargo scope.
+ */
+export interface BookingRequestContract {
+  id: string;
+  reference: string;
+  contractKind: ContractKind;
+  tradeDirection: ContractTradeDirection;
+  freightType: ContractFreightType;
+  customsClearingEnabled: boolean;
+  paymentCurrency: string;
+  contractValidUntil?: string | null;
+  company?: BookingRequestCompany | null;
+  serviceType?: IContract["serviceType"];
+  routes?: IContractRoute[];
+  cargoScope?: IContractCargoScope[];
 }
 
 export interface CreateBookingRequestDto {
diff --git a/packages/types/src/freight/index.ts b/packages/types/src/freight/index.ts
index 171a294fb..7688c2e33 100644
--- a/packages/types/src/freight/index.ts
+++ b/packages/types/src/freight/index.ts
@@ -1,10 +1,12 @@
 import type { BaseEntity } from "../common";
+import { ClearanceNextAction, ContractDocPhase, IClearanceMilestone } from "./contracts";
 
 export * from "./dropdown_settings";
 export * from "./file_upload_settings";
 export * from "./overview";
 export * from "./etrade";
 export * from "./contracts";
+export * from "./clearance-files.catalog";
 
 export enum TradeDirection {
   IMPORT = "IMPORT",
@@ -89,6 +91,7 @@ export enum BookingStatus {
   Cancelled = "CANCELLED",
   PendingConsolidation = "PENDING_CONSOLIDATION",
   Consolidated = "CONSOLIDATED",
+  TruckAssigned = "TRUCK_ASSIGNED",
   /** General contract: paid umbrella contract that is accepting drawdown orders. */
   ContractActive = "CONTRACT_ACTIVE",
   /** General contract: closed because its quantity was exhausted (or period elapsed). */
@@ -140,6 +143,8 @@ export enum InvoiceStatus {
   Overdue = "OVERDUE",
   Cancelled = "CANCELLED",
   Refunded = "REFUNDED",
+  /** Pay window closed before settlement; terminal, cannot be paid. */
+  Expired = "EXPIRED",
 }
 
 /** Originating subsystem an invoice bills for; namespaces invoice events. */
@@ -147,14 +152,8 @@ export enum InvoiceSource {
   Booking = "booking",
   Warehouse = "warehouse",
   Demurrage = "demurrage",
-}
-
-/**
- * What an invoice bills for within its source — the discriminator when one
- * entity carries several invoices (e.g. a booking's up-front vs final charge).
- */
-export enum InvoiceType {
-  Prepaid = "PREPAID",
+  FirstMile = "firstmile",
+  LastMile = "lastmile"
 }
 
 export enum SchedulingStatus {
@@ -422,6 +421,12 @@ export interface IBooking extends BaseEntity {
   lastMileDeliveryAddress?: string | null;
   lastMileDeliveryLat?: number | null;
   lastMileDeliveryLng?: number | null;
+  customerTruckPlateNumber?: string | null;
+  customerTruckDriverName?: string | null;
+  customerTruckType?: string | null;
+  customerTruckContainerNumber?: string | null;
+  customerTruckAssignedAt?: string | null;
+  customerTruckArrivedAt?: string | null;
 
   customsClearingEnabled?: boolean;
   customsClearingAgent?: string | null;
@@ -436,6 +441,10 @@ export interface IBooking extends BaseEntity {
 
   isHazardous: boolean;
   isRefrigerated: boolean;
+  /** Bulk-only hazardous amount in the cargo's unit (tons/items); 0 otherwise. */
+  bulkHazardousQuantity?: number;
+  /** Bulk-only refrigerated amount in the cargo's unit (tons/items); 0 otherwise. */
+  bulkReeferQuantity?: number;
 
   tradeDirection: "IMPORT" | "EXPORT";
   paymentCurrency: string;
@@ -526,6 +535,26 @@ export interface ClearanceView {
   documents: ClearanceDocument[];
   /** True once every required customer document is APPROVED (the 100% gate). */
   allApproved: boolean;
+  /** Phased clearance (GENERAL + customs per-booking). */
+  phase?: ContractDocPhase | null;
+  milestones?: IClearanceMilestone[];
+  nextAction?: ClearanceNextAction | null;
+  dutyRequired?: boolean | null;
+  roHold?: boolean;
+  roHoldReason?: string | null;
+  vesselDepartureDate?: string | null;
+  roAmendmentRequestedAt?: string | null;
+  /** Boundary milestone complete — customer may proceed to operations. */
+  operationReady?: boolean;
+  preClearanceFinalized?: boolean;
+  dutyAdvice?: {
+    amount: number;
+    currency: string;
+    declarationSerial?: string | null;
+    noticeFile?: { id: string; name: string; url: string } | null;
+  } | null;
+  /** Phased customs uploads (IM4, DO, transit permit, etc.) with friendly labels. */
+  workflowFiles?: import("./clearance-files.catalog").ClearanceWorkflowFile[];
 }
 
 /** Company an invoice is billed to (minimal projection). */
@@ -564,6 +593,10 @@ export interface IInvoice extends BaseEntity {
   companyProfileId: string;
   companyProfile?: IInvoiceCompanyProfile;
   totalAmount: number;
+  /** Cumulative amount settled so far (supports partial payment). */
+  paidAmount: number;
+  /** Outstanding balance = totalAmount - paidAmount (0 once fully paid). */
+  balanceAmount: number;
   currency: string;
   status: InvoiceStatus;
   /** Originating subsystem: booking / warehouse / demurrage. */
@@ -631,7 +664,6 @@ export interface BookingReferenceCargoTypeChild {
   id: string;
   name: string;
   code: string;
-  show_free_text_box: boolean;
   /** How this cargo is measured (PER_TON / PER_ITEM); null when unset. */
   unit_of_measure?: CargoUnitOfMeasure | null;
 }
@@ -721,6 +753,10 @@ export interface CreateBookingContainerDto {
   containerTypeId: string;
   quantity: number;
   vgmPerUnitTons: number;
+  /** How many of this line's containers are hazardous (0..quantity). */
+  hazardousQuantity?: number;
+  /** How many of this line's containers are refrigerated (0..quantity). */
+  reeferQuantity?: number;
 }
 
 /** A contracted route+quantity line for a GENERAL contract. */
@@ -772,6 +808,10 @@ export interface CreateBookingDto {
   isHazardous?: boolean | undefined;
   /** Booking-level refrigerated flag (bulk freight only; containers derive reefer from the container type). */
   isReefer?: boolean | undefined;
+  /** Bulk-only: hazardous amount in the cargo's unit (tons or items), <= cargoTotalWeightVgm. */
+  bulkHazardousQuantity?: number | undefined;
+  /** Bulk-only: refrigerated amount in the cargo's unit (tons or items), <= cargoTotalWeightVgm. */
+  bulkReeferQuantity?: number | undefined;
   paymentCurrency: string;
   pnrCode?: string | undefined;
   startDate?: string | undefined;
diff --git a/packages/ui-common/src/components/OperationDatePicker/OperationDatePicker.tsx b/packages/ui-common/src/components/OperationDatePicker/OperationDatePicker.tsx
index ff4fc9c29..d8fbcaf85 100644
--- a/packages/ui-common/src/components/OperationDatePicker/OperationDatePicker.tsx
+++ b/packages/ui-common/src/components/OperationDatePicker/OperationDatePicker.tsx
@@ -16,6 +16,8 @@ export interface OperationDatePickerProps {
   value: string;
   /** Called with the picked `yyyy-MM-dd` day. */
   onChange: (date: string) => void;
+  /** Stretch to the full width of the parent container. */
+  fullWidth?: boolean;
 }
 
 /** `yyyy-MM-dd` for a local date. */
@@ -41,6 +43,8 @@ const MONTH_NAMES = [
   "December",
 ];
 
+const WEEKDAY_LABELS = ["MON", "TUE", "WED", "THU", "FRI", "SAT", "SUN"];
+
 /**
  * Presentational month calendar for picking a binding shipment day. Only the
  * `availableDays` (passed in by the caller, which owns the query) are
@@ -53,8 +57,8 @@ export function OperationDatePicker({
   isLoading = false,
   value,
   onChange,
+  fullWidth = false,
 }: OperationDatePickerProps) {
-  // First-of-month for the visible month; defaults to the current month.
   const [month, setMonth] = useState(() => {
     const now = new Date();
     return new Date(now.getFullYear(), now.getMonth(), 1);
@@ -67,7 +71,6 @@ export function OperationDatePicker({
 
   const cells = useMemo(() => {
     const first = new Date(month.getFullYear(), month.getMonth(), 1);
-    // Monday-first grid: JS getDay() Sun=0..Sat=6 → shift so Mon=0.
     const lead = (first.getDay() + 6) % 7;
     const start = new Date(first);
     start.setDate(first.getDate() - lead);
@@ -90,6 +93,11 @@ export function OperationDatePicker({
     });
   }, [month, departureDays, value]);
 
+  const availableInMonth = useMemo(
+    () => cells.filter((c) => c.inMonth && c.hasDeparture).length,
+    [cells],
+  );
+
   const shiftMonth = (delta: number) =>
     setMonth((m) => new Date(m.getFullYear(), m.getMonth() + delta, 1));
 
@@ -98,11 +106,25 @@ export function OperationDatePicker({
       style={{
         border: "1px solid #E6ECF2",
         borderRadius: 12,
-        padding: 14,
-        maxWidth: 340,
+        padding: fullWidth ? "12px 16px" : 14,
+        width: fullWidth ? "100%" : undefined,
+        maxWidth: fullWidth ? undefined : 340,
       }}
     >
-      <Group justify="space-between" align="center" mb="sm">
+      <Group
+        justify="space-between"
+        align="center"
+        mb="sm"
+        px={fullWidth ? 4 : 0}
+        style={
+          fullWidth
+            ? {
+                borderBottom: "1px solid #EEF2F6",
+                paddingBottom: 10,
+              }
+            : undefined
+        }
+      >
         <Button
           variant="default"
           size="xs"
@@ -112,9 +134,7 @@ export function OperationDatePicker({
         >
           <ChevronLeft size={15} />
         </Button>
-        <Text fz="13px" fw={700} c="#10202F">
-          {MONTH_NAMES[month.getMonth()]} {month.getFullYear()}
-        </Text>
+        <StackedMonthHeader month={month} availableCount={availableInMonth} />
         <Button
           variant="default"
           size="xs"
@@ -143,8 +163,8 @@ export function OperationDatePicker({
               marginBottom: 6,
             }}
           >
-            {["M", "T", "W", "T", "F", "S", "S"].map((d, i) => (
-              <Text key={i} ta="center" fz="10px" fw={700} c="#9AA8B5">
+            {WEEKDAY_LABELS.map((d) => (
+              <Text key={d} ta="center" fz="10px" fw={700} c="#9AA8B5">
                 {d}
               </Text>
             ))}
@@ -173,9 +193,11 @@ export function OperationDatePicker({
                     cursor: clickable ? "pointer" : "default",
                     border: c.selected
                       ? "1.5px solid #12B981"
-                      : clickable
-                        ? "1px solid #CDEBDD"
-                        : "1px solid transparent",
+                      : c.today
+                        ? "1.5px solid #94A3B8"
+                        : clickable
+                          ? "1px solid #CDEBDD"
+                          : "1px solid transparent",
                     background: c.selected
                       ? "#12B981"
                       : clickable
@@ -224,18 +246,30 @@ export function OperationDatePicker({
             })}
           </Box>
           {value && (
-            <Text fz="12px" c="#0A6F4D" fw={600} mt="sm">
-              Selected:{" "}
-              {new Date(value + "T00:00:00").toLocaleDateString(undefined, {
-                weekday: "short",
-                month: "short",
-                day: "numeric",
-                year: "numeric",
-              })}
-            </Text>
+            <Group
+              justify="center"
+              mt="sm"
+              py={6}
+              px={10}
+              style={{
+                borderRadius: 8,
+                background: "#F4FBF7",
+                border: "1px solid #CDEBDD",
+              }}
+            >
+              <Text fz="12px" c="#0A6F4D" fw={600}>
+                Selected:{" "}
+                {new Date(value + "T00:00:00").toLocaleDateString(undefined, {
+                  weekday: "short",
+                  month: "short",
+                  day: "numeric",
+                  year: "numeric",
+                })}
+              </Text>
+            </Group>
           )}
           {departureDays.size === 0 && (
-            <Text fz="12px" c="orange.7" mt="sm">
+            <Text fz="12px" c="orange.7" mt="sm" ta="center">
               No scheduled departures found for this route yet.
             </Text>
           )}
@@ -245,4 +279,23 @@ export function OperationDatePicker({
   );
 }
 
+function StackedMonthHeader({
+  month,
+  availableCount,
+}: {
+  month: Date;
+  availableCount: number;
+}) {
+  return (
+    <Box style={{ textAlign: "center" }}>
+      <Text fz="14px" fw={800} c="#10202F" lh={1.2}>
+        {MONTH_NAMES[month.getMonth()]} {month.getFullYear()}
+      </Text>
+      <Text fz="11px" c="#64748B" mt={2}>
+        {availableCount} available day{availableCount === 1 ? "" : "s"}
+      </Text>
+    </Box>
+  );
+}
+
 export default OperationDatePicker;
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index bd8c81c83..8051dab4a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -175,6 +175,9 @@ importers:
       '@types/supertest':
         specifier: ^6.0.2
         version: 6.0.3
+      '@types/vorpal':
+        specifier: ^1.12.8
+        version: 1.12.8
       jest:
         specifier: ^29.7.0
         version: 29.7.0(@types/node@20.19.42)(babel-plugin-macros@3.1.0)(ts-node@10.9.2(@types/node@20.19.42)(typescript@5.9.3))
@@ -196,6 +199,9 @@ importers:
       typescript:
         specifier: ^5.5.4
         version: 5.9.3
+      vorpal:
+        specifier: ^1.12.0
+        version: 1.12.0
 
   apps/edr-freight-web/backoffice:
     dependencies:
@@ -326,6 +332,9 @@ importers:
       '@mantine/core':
         specifier: ^9.3.0
         version: 9.3.0(@mantine/hooks@9.3.0(react@19.2.6))(@types/react@18.3.31)(react-dom@19.2.6(react@19.2.6))(react@19.2.6)
+      '@mantine/dates':
+        specifier: ^9.3.0
+        version: 9.3.2(@mantine/core@9.3.0(@mantine/hooks@9.3.0(react@19.2.6))(@types/react@18.3.31)(react-dom@19.2.6(react@19.2.6))(react@19.2.6))(@mantine/hooks@9.3.0(react@19.2.6))(dayjs@1.11.21)(react-dom@19.2.6(react@19.2.6))(react@19.2.6)
       '@mantine/hooks':
         specifier: ^9.3.0
         version: 9.3.0(react@19.2.6)
@@ -4406,6 +4415,9 @@ packages:
   '@types/validator@13.15.10':
     resolution: {integrity: sha512-T8L6i7wCuyoK8A/ZeLYt1+q0ty3Zb9+qbSSvrIVitzT3YjZqkTZ40IbRsPanlB4h1QB3JVL1SYCdR6ngtFYcuA==}
 
+  '@types/vorpal@1.12.8':
+    resolution: {integrity: sha512-Qt+Yxa1q6QCaYMxZFXlyPOF3ktIscTelNr1AFYuKM7/Dhlki4gvc476uFyA/hYvskSA6V8W+55x9FjlbAPcYdQ==}
+
   '@types/yargs-parser@21.0.3':
     resolution: {integrity: sha512-I4q9QU9MQv4oEOz4tAHJtNz1cwuLxn2F3xcc2iV5WdqLPpUnj30aUuxt1mAxYTG+oe8CZMV/+6rU4S4gRDzqtQ==}
 
@@ -4852,6 +4864,10 @@ packages:
     resolution: {integrity: sha512-zAfb1fokXsq4BoZBkL0eK+6MfFctbzX3R4UMcoWrL1n2WHewFKentTvOZv2P11u6P4NtW/V47hVjaN7fJiefOg==}
     engines: {node: '>=0.10.0'}
 
+  ansi-escapes@1.4.0:
+    resolution: {integrity: sha512-wiXutNjDUlNEDWHcYH3jtZUhd3c4/VojassD8zHdHCY13xbZy2XbW+NKQwA0tWGBVzDA9qEzYwfoSsWmviidhw==}
+    engines: {node: '>=0.10.0'}
+
   ansi-escapes@4.3.2:
     resolution: {integrity: sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==}
     engines: {node: '>=8'}
@@ -4892,6 +4908,10 @@ packages:
     resolution: {integrity: sha512-ewaIr5y+9CUTGFwZfpECUbFlGcC0GCw1oqR9RI6h1gQCd9Aj2GxSckCnPsVJnmfMZbwFYE+leZGASgkWl06Jow==}
     engines: {node: '>=0.10.0'}
 
+  ansi-regex@2.1.1:
+    resolution: {integrity: sha512-TIGnTpdo+E3+pCyAluZvtED5p5wCqLdezCyhPZzKPcxvFplEt4i+W7OONCKgeZFT3+y5NZZfOOS/Bdcanm1MYA==}
+    engines: {node: '>=0.10.0'}
+
   ansi-regex@5.0.1:
     resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==}
     engines: {node: '>=8'}
@@ -4908,6 +4928,10 @@ packages:
     resolution: {integrity: sha512-gWkLPDvHH2pC9YEKqp8dIl0mg3sRglMPvioqGDIOXiwxjxUwIJ1gF86E2o4R5yLNh8IAkwHbaMtASkJfkQ2hIA==}
     engines: {node: '>=0.10.0'}
 
+  ansi-styles@2.2.1:
+    resolution: {integrity: sha512-kmCevFghRiWM7HB5zTPULl4r9bVFSWjz62MhqizDGUrq2NWuNMQyuv4tHHoKJHs69M/MF64lEcHdYIocrdWQYA==}
+    engines: {node: '>=0.10.0'}
+
   ansi-styles@4.3.0:
     resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
     engines: {node: '>=8'}
@@ -5159,6 +5183,9 @@ packages:
       '@babel/core': ^7.0.0
       styled-components: '>= 2'
 
+  babel-polyfill@6.26.0:
+    resolution: {integrity: sha512-F2rZGQnAdaHWQ8YAoeRbukc7HS9QgdgeyJ0rQDd485v9opwuPvjpPFcOOT/WmkKTdgy9ESgSPXDcTNpzrGr6iQ==}
+
   babel-preset-current-node-syntax@1.2.0:
     resolution: {integrity: sha512-E/VlAEzRrsLEb2+dv8yp3bo4scof3l9nR4lrld+Iy5NyVqgVYUJnDAmunkhPMisRI32Qc4iRiz425d8vM++2fg==}
     peerDependencies:
@@ -5170,6 +5197,9 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0
 
+  babel-runtime@6.26.0:
+    resolution: {integrity: sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g==}
+
   balanced-match@1.0.2:
     resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
 
@@ -5422,6 +5452,10 @@ packages:
   chainsaw@0.1.0:
     resolution: {integrity: sha512-75kWfWt6MEKNC8xYXIdRpDehRYY/tNSgwKaJq+dbbDcxORuVrrQ+SEHoWsniVn9XPYfP4gmdWIeDk/4YNp1rNQ==}
 
+  chalk@1.1.3:
+    resolution: {integrity: sha512-U3lRVLMSlsCfjqYPbLyVv11M9CPW4I728d6TCKMAOJueEeB9/8o+eSsMnxPJD+Q+K909sdESg7C+tIkoH6on1A==}
+    engines: {node: '>=0.10.0'}
+
   chalk@4.1.2:
     resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==}
     engines: {node: '>=10'}
@@ -5490,6 +5524,10 @@ packages:
   classnames@2.5.1:
     resolution: {integrity: sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==}
 
+  cli-cursor@1.0.2:
+    resolution: {integrity: sha512-25tABq090YNKkF6JH7lcwO0zFJTRke4Jcq9iX2nr/Sz0Cjjv4gckmwlW6Ty/aoyFd6z3ysR2hMGC2GFugmBo6A==}
+    engines: {node: '>=0.10.0'}
+
   cli-cursor@3.1.0:
     resolution: {integrity: sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==}
     engines: {node: '>=8'}
@@ -5510,6 +5548,9 @@ packages:
     resolution: {integrity: sha512-nPdaFdQ0h/GEigbPClz11D0v/ZJEwxmeVZGeMo3Z5StPtUTkA9o1lD6QwoirYiSDzbcwn2XcjwmCp68W1IS4TA==}
     engines: {node: '>=18'}
 
+  cli-width@1.1.1:
+    resolution: {integrity: sha512-eMU2akIeEIkCxGXUNmDnJq1KzOIiPnJ+rKqRe6hcxE3vIOPvpMrBYOn/Bl7zNlYJj/zQxXquAnozHUCf9Whnsg==}
+
   cli-width@4.1.0:
     resolution: {integrity: sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==}
     engines: {node: '>= 12'}
@@ -5553,6 +5594,10 @@ packages:
   code-block-writer@13.0.3:
     resolution: {integrity: sha512-Oofo0pq3IKnsFtuHqSF7TqBfr71aeyZDVJ0HpmqB7FBM2qEigL0iPONSCZSO9pE9dZTAxANe5XHG9Uy0YMv8cg==}
 
+  code-point-at@1.1.0:
+    resolution: {integrity: sha512-RpAVKQA5T63xEj6/giIbUEtZwJ4UFIc3ZtvEkiaUERylqe8xb5IvqcgOurZLahv93CLKfxcw5YI+DZcUBRyLXA==}
+    engines: {node: '>=0.10.0'}
+
   codepage@1.15.0:
     resolution: {integrity: sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA==}
     engines: {node: '>=0.8'}
@@ -5697,6 +5742,10 @@ packages:
     resolution: {integrity: sha512-XgZ0pFcakEUlbwQEVNg3+QAis1FyTL3Qel9FYy8pSkQqoG3PNoT0bOCQtOXcOkur21r2Eq2kI+IE+gsmAEVlYw==}
     engines: {node: '>=0.10.0'}
 
+  core-js@2.6.12:
+    resolution: {integrity: sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==}
+    deprecated: core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
+
   core-js@3.49.0:
     resolution: {integrity: sha512-es1U2+YTtzpwkxVLwAFdSpaIMyQaq0PBgm3YD1W3Qpsn1NAmO3KSgZfu+oGSWVu6NvLHoHCV/aYcsE5wiB7ALg==}
 
@@ -6289,6 +6338,10 @@ packages:
   escape-html@1.0.3:
     resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==}
 
+  escape-string-regexp@1.0.5:
+    resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==}
+    engines: {node: '>=0.8.0'}
+
   escape-string-regexp@2.0.0:
     resolution: {integrity: sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==}
     engines: {node: '>=8'}
@@ -6499,6 +6552,10 @@ packages:
     resolution: {integrity: sha512-9Be3ZoN4LmYR90tUoVu2te2BsbzHfhJyfEiAVfz7N5/zv+jduIfLrV2xdQXOHbaD6KgpGdO9PRPM1Y4Q9QkPkA==}
     engines: {node: ^18.19.0 || >=20.5.0}
 
+  exit-hook@1.1.1:
+    resolution: {integrity: sha512-MsG3prOVw1WtLXAZbM3KiYtooKR1LvxHh3VHsVtIy0uiUu8usxgB/94DP2HxtD/661lLdB6yzQ09lGJSQr6nkg==}
+    engines: {node: '>=0.10.0'}
+
   exit@0.1.2:
     resolution: {integrity: sha512-Zk/eNKV2zbjpKzrsQ+n1G6poVbErQxJ0LBOJXaKZ1EViLzH+hrLu9cdXI4zw9dBQJslwBEpbQ2P1oS7nDxs6jQ==}
     engines: {node: '>= 0.8.0'}
@@ -6632,6 +6689,10 @@ packages:
   fflate@0.8.3:
     resolution: {integrity: sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA==}
 
+  figures@1.7.0:
+    resolution: {integrity: sha512-UxKlfCRuCBxSXU4C6t9scbDyWZ4VlaFFdojKtzJuSkuOBQ5CNFum+zZXFwHjo+CxBC1t6zlYPgHIgFjL8ggoEQ==}
+    engines: {node: '>=0.10.0'}
+
   figures@6.1.0:
     resolution: {integrity: sha512-d+l3qxjSesT4V7v2fh+QnmFnUWv9lSpjarhShNTgBOfA0ttejbQUAlHLitbjkoRiDulW0OPoQPYIGhIC8ohejg==}
     engines: {node: '>=18'}
@@ -6904,7 +6965,7 @@ packages:
   git-raw-commits@4.0.0:
     resolution: {integrity: sha512-ICsMM1Wk8xSGMowkOmPrzo2Fgmfo4bMHLNX6ytHjajRJUqvHOw/TFapQ+QG75c3X/tTDDhOSRPGC52dDbNM8FQ==}
     engines: {node: '>=16'}
-    deprecated: This package is no longer maintained. For the JavaScript API, please use @conventional-changelog/git-client instead.
+    deprecated: Deprecated and no longer maintained. Use @conventional-changelog/git-client instead.
     hasBin: true
 
   glob-parent@5.1.2:
@@ -6989,6 +7050,10 @@ packages:
     engines: {node: '>=0.4.7'}
     hasBin: true
 
+  has-ansi@2.0.0:
+    resolution: {integrity: sha512-C8vBJ8DwUCx19vhm7urhTuUsr4/IyP6l4VzNQDv+ryHQObW3TTTp9yB68WpYgRe2bbaGuZ/se74IqFeVnMnLZg==}
+    engines: {node: '>=0.10.0'}
+
   has-bigints@1.1.0:
     resolution: {integrity: sha512-R3pbpkcIqv2Pm3dUwgjclDRVmWpTJW2DcMzcIhEXEx1oh/CEMObMm3KLmRJOdvhM7o4uQBnwr8pzRK2sJWIqfg==}
     engines: {node: '>= 0.4'}
@@ -7185,6 +7250,10 @@ packages:
     resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==}
     engines: {node: '>=0.8.19'}
 
+  in-publish@2.0.1:
+    resolution: {integrity: sha512-oDM0kUSNFC31ShNxHKUyfZKy8ZeXZBWMjMdZHKLOk13uvT27VTL/QzRGfRUcevJhpkZAvlhPYuXkF7eNWrtyxQ==}
+    hasBin: true
+
   inflight@1.0.6:
     resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==}
     deprecated: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
@@ -7214,6 +7283,9 @@ packages:
       react-dom:
         optional: true
 
+  inquirer@0.11.0:
+    resolution: {integrity: sha512-LIwC+g/fJbmKhDm341+RqDIV4jPf/n3pMway9xg8Ovt6CCQo1ozXhmuKTcoNIWhWJJKsSGZP+Rnuq7JgM7mE2A==}
+
   internal-slot@1.1.0:
     resolution: {integrity: sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==}
     engines: {node: '>= 0.4'}
@@ -7327,6 +7399,10 @@ packages:
     resolution: {integrity: sha512-1pC6N8qWJbWoPtEjgcL2xyhQOP491EQjeUo3qTKcmV8YSDDJrOepfG8pcC7h/QgnQHYSv0mJ3Z/ZWxmatVrysg==}
     engines: {node: '>= 0.4'}
 
+  is-fullwidth-code-point@1.0.0:
+    resolution: {integrity: sha512-1pqUqRjkhPJ9miNq9SwMfdvi6lBJcd6eFxvfaivQhaH3SgisfiuudvFntdKOmxuee/77l+FPjKrQjWvmPjWrRw==}
+    engines: {node: '>=0.10.0'}
+
   is-fullwidth-code-point@3.0.0:
     resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==}
     engines: {node: '>=8'}
@@ -8137,6 +8213,9 @@ packages:
   lodash.upperfirst@4.3.1:
     resolution: {integrity: sha512-sReKOYJIJf74dhJONhU4e0/shzi1trVbSWDOhKYE5XV2O+H7Sb2Dihwuc7xWxVl+DgFPyTqIN3zMfT9cq5iWDg==}
 
+  lodash@3.10.1:
+    resolution: {integrity: sha512-9mDDwqVIma6OZX79ZlDACZl8sBm0TEnkf99zV3iMA4GzkIT/9hiqP5mY0HoT1iNLCrKc/R1HByV+yJfRWVJryQ==}
+
   lodash@4.17.21:
     resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
 
@@ -8155,6 +8234,10 @@ packages:
     resolution: {integrity: sha512-i24m8rpwhmPIS4zscNzK6MSEhk0DUWa/8iYQWxhffV8jkI4Phvs3F+quL5xvS0gdQR0FyTCMMH33Y78dDTzzIw==}
     engines: {node: '>=18'}
 
+  log-update@1.0.2:
+    resolution: {integrity: sha512-4vSow8gbiGnwdDNrpy1dyNaXWKSCIPop0EHdE8GrnngHoJujM3QhvHUN/igsYCgPoHo7pFOezlJ61Hlln0KHyA==}
+    engines: {node: '>=0.10.0'}
+
   log-update@6.1.0:
     resolution: {integrity: sha512-9ie8ItPR6tjY5uYJh8K/Zrv/RMZ5VOlOWvtZdEHYSTFKZfIBPQa9tOAEeAWhd+AnIneLJ22w5fjOYtoutpWq5w==}
     engines: {node: '>=18'}
@@ -8444,6 +8527,9 @@ packages:
     resolution: {integrity: sha512-mo+QTzKlx8R7E5ylSXxWzGoXoZbOsRMpyitcht8By2KHvMbf3tjwosZ/Mu/XYU6UuJ3VZnODIrak5ZrPiPyB6A==}
     engines: {node: '>= 10.16.0'}
 
+  mute-stream@0.0.5:
+    resolution: {integrity: sha512-EbrziT4s8cWPmzr47eYVW3wimS4HsvlnV5ri1xw1aR6JQo/OrJX5rkl32K/QQHdxeabJETtfeaROGhd8W7uBgg==}
+
   mute-stream@2.0.0:
     resolution: {integrity: sha512-WWdIxpyjEn+FhQJQQv9aQAYlHoNVdzIzUySNV1gHUPDSdZJ3yZn7pAAbQcV7B56Mvu881q9FZV+0Vx2xC44VWA==}
     engines: {node: ^18.17.0 || >=20.5.0}
@@ -8559,6 +8645,10 @@ packages:
   node-int64@0.4.0:
     resolution: {integrity: sha512-O5lz91xSOeoXP6DulyHfllpq+Eg00MWitZIbtPfoSEvqIHdl5gfcY6hYzDWnj0qD5tz52PI08u9qUvSVeUBeHw==}
 
+  node-localstorage@0.6.0:
+    resolution: {integrity: sha512-t9dKMce8qUs2KK02ZiBgzZSykUxc+5UcML7/20a62ruHwfh7+bNQvrH/auxY5gFNexTwAFdr+DbptxlLq4+7qQ==}
+    engines: {node: '>=0.10'}
+
   node-releases@2.0.47:
     resolution: {integrity: sha512-Uzmd6LXpouKo8EUK68IjH4+E01w/hXyV3R3g/geCJo+rXLNfh1xucB+LOzYEOQPSiUK3h/xZf0cQGcSsmyL2Og==}
     engines: {node: '>=18'}
@@ -8585,6 +8675,10 @@ packages:
   nth-check@2.1.1:
     resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
 
+  number-is-nan@1.0.1:
+    resolution: {integrity: sha512-4jbtZXNAsfZbAHiiqjLPBiCl16dES1zI4Hpzzxw61Tk+loF+sBDBKx1ICKKKwIqQ7M0mFn1TmkN7euSncWgHiQ==}
+    engines: {node: '>=0.10.0'}
+
   nwsapi@2.2.24:
     resolution: {integrity: sha512-7YRhZ3jS45LwmSCT4b2sVFHt/WuovaktDU07QrtOBY2PXskss5a9jfmR9jptyumwXST+rFjrmppMY1KT/yn35A==}
 
@@ -8655,6 +8749,10 @@ packages:
   once@1.4.0:
     resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
 
+  onetime@1.1.0:
+    resolution: {integrity: sha512-GZ+g4jayMqzCRMgB2sol7GiCLjKfS1PINkjmx8spcKce1LiVqcbQreXwqs2YAFXC6R03VIG28ZS31t8M866v6A==}
+    engines: {node: '>=0.10.0'}
+
   onetime@5.1.2:
     resolution: {integrity: sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==}
     engines: {node: '>=6'}
@@ -9462,6 +9560,9 @@ packages:
     resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==}
     engines: {node: '>= 14.18.0'}
 
+  readline2@1.0.1:
+    resolution: {integrity: sha512-8/td4MmwUB6PkZUbV25uKz7dfrmjYWxsW8DVfibWdlHRk/l/DfHKn4pU+dfcoGLFgWOdyGCzINRQD7jn+Bv+/g==}
+
   recast@0.23.11:
     resolution: {integrity: sha512-YTUo+Flmw4ZXiWfQKGcwwc11KnoRAYgzAE2E7mXKCjSviTKShtxBsN6YUUBB2gtaBzKzeKunxhUwNHQuRryhWA==}
     engines: {node: '>= 4'}
@@ -9503,6 +9604,12 @@ packages:
     resolution: {integrity: sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==}
     engines: {node: '>= 0.4'}
 
+  regenerator-runtime@0.10.5:
+    resolution: {integrity: sha512-02YopEIhAgiBHWeoTiA8aitHDt8z6w+rQqNuIftlM+ZtvSl/brTouaU7DW6GO/cHtvxJvS4Hwv2ibKdxIRi24w==}
+
+  regenerator-runtime@0.11.1:
+    resolution: {integrity: sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==}
+
   regenerator-runtime@0.13.11:
     resolution: {integrity: sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==}
 
@@ -9587,6 +9694,10 @@ packages:
     engines: {node: '>= 0.4'}
     hasBin: true
 
+  restore-cursor@1.0.1:
+    resolution: {integrity: sha512-reSjH4HuiFlxlaBaFCiS6O76ZGG2ygKoSlCsipKdaZuKSPx/+bt9mULkn4l0asVzbEfQQmXRg6Wp6gv6m0wElw==}
+    engines: {node: '>=0.10.0'}
+
   restore-cursor@3.1.0:
     resolution: {integrity: sha512-l+sSefzHpj5qimhFSE5a8nufZYAM3sBSVMAPtYkmC+4EH2anSGaEMXSD0izRQbu9nfyQ9y5JrVmp7E8oZrUjvA==}
     engines: {node: '>=8'}
@@ -9658,9 +9769,15 @@ packages:
     resolution: {integrity: sha512-DPe5pVFaAsinSaV6QjQ6gdiedWDcRCbUuiQfQa2wmWV7+xC9bGulGI8+TdRmoFkAPaBXk8CrAbnlY2ISniJ47Q==}
     engines: {node: '>=18'}
 
+  run-async@0.1.0:
+    resolution: {integrity: sha512-qOX+w+IxFgpUpJfkv2oGN0+ExPs68F4sZHfaRRx4dDexAQkG83atugKVEylyT5ARees3HBbfmuvnjbrd8j9Wjw==}
+
   run-parallel@1.2.0:
     resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
 
+  rx-lite@3.1.2:
+    resolution: {integrity: sha512-1I1+G2gteLB8Tkt8YI1sJvSIfa0lWuRtC8GjvtyPBcLSF5jBCCJJqKrpER5JU5r6Bhe+i9/pK3VMuUcXu0kdwQ==}
+
   rxjs@7.8.1:
     resolution: {integrity: sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==}
 
@@ -10011,6 +10128,10 @@ packages:
     resolution: {integrity: sha512-+l6rNN5fYHNhZZy41RXsYptCjA2Igmq4EG7kZAYFQI1E1VTXarr6ZPXBg6eq7Y6eK4FEhY6AJlyuFIb/v/S0VQ==}
     engines: {node: '>=10'}
 
+  string-width@1.0.2:
+    resolution: {integrity: sha512-0XsVpQLnVCXHJfyEs8tC0zpTVIr5PKKsQtkT29IwupnPTjtPmQ3xT/4yCREF9hYkV/3M3kzcUTSAZT6a6h81tw==}
+    engines: {node: '>=0.10.0'}
+
   string-width@4.2.3:
     resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==}
     engines: {node: '>=8'}
@@ -10056,6 +10177,10 @@ packages:
     resolution: {integrity: sha512-zaJYxz2FtcMb4f+g60KsRNFOpVMUyuJgA51Zi5Z1DOTC3S59+OQiVOzE9GZt0x72uBGWKsQIuBKeF9iusmKFsg==}
     engines: {node: '>=14.16'}
 
+  strip-ansi@3.0.1:
+    resolution: {integrity: sha512-VhumSSbBqDTP8p2ZLKj40UjBCV4+v8bUSEpUb4KjRgWk9pbqGF4REFj6KEagidb2f/M6AzC0EmFyDNGaw9OCzg==}
+    engines: {node: '>=0.10.0'}
+
   strip-ansi@6.0.1:
     resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
     engines: {node: '>=8'}
@@ -10146,6 +10271,10 @@ packages:
     resolution: {integrity: sha512-oK8WG9diS3DlhdUkcFn4tkNIiIbBx9lI2ClF8K+b2/m8Eyv47LSawxUzZQSNKUrVb2KsqeTDCcjAAVPYaSLVTA==}
     engines: {node: '>=14.18.0'}
 
+  supports-color@2.0.0:
+    resolution: {integrity: sha512-KKNVtd6pCYgPIKU4cp2733HWYCpplQhddZLBUryaAHou723x+FRzQ5Df824Fj+IyyuiQTRoub4SnIFfIcrp70g==}
+    engines: {node: '>=0.8.0'}
+
   supports-color@5.5.0:
     resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
     engines: {node: '>=4'}
@@ -10922,6 +11051,10 @@ packages:
     resolution: {integrity: sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==}
     engines: {node: '>=0.10.0'}
 
+  vorpal@1.12.0:
+    resolution: {integrity: sha512-lYEhd75l75P3D1LKpm4KqdOSpNyNdDJ9ixEZmC5ZAZUKGy6JNexfMdQ9SNaT5pCHuzuXXRJQedJ+CdqNg/D4Kw==}
+    engines: {iojs: '>= 1.0.0', node: '>= 0.10.0'}
+
   w3c-xmlserializer@5.0.0:
     resolution: {integrity: sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==}
     engines: {node: '>=18'}
@@ -11046,6 +11179,10 @@ packages:
   wordwrap@1.0.0:
     resolution: {integrity: sha512-gvVzJFlPycKc5dZN4yPkP8w7Dc37BtP1yczEneOb4uq34pXZcvrtRTmWV8W+Ume+XCxKgbjM+nevkyFPMybd4Q==}
 
+  wrap-ansi@2.1.0:
+    resolution: {integrity: sha512-vAaEaDM946gbNpH5pLVNR+vX2ht6n0Bt3GXwVB1AuAqZosOvHNF3P7wDnh8KLkSqgUh0uh77le7Owgoz+Z9XBw==}
+    engines: {node: '>=0.10.0'}
+
   wrap-ansi@6.2.0:
     resolution: {integrity: sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==}
     engines: {node: '>=8'}
@@ -12504,6 +12641,15 @@ snapshots:
       react: 19.2.6
       react-dom: 19.2.6(react@19.2.6)
 
+  '@mantine/dates@9.3.2(@mantine/core@9.3.0(@mantine/hooks@9.3.0(react@19.2.6))(@types/react@18.3.31)(react-dom@19.2.6(react@19.2.6))(react@19.2.6))(@mantine/hooks@9.3.0(react@19.2.6))(dayjs@1.11.21)(react-dom@19.2.6(react@19.2.6))(react@19.2.6)':
+    dependencies:
+      '@mantine/core': 9.3.0(@mantine/hooks@9.3.0(react@19.2.6))(@types/react@18.3.31)(react-dom@19.2.6(react@19.2.6))(react@19.2.6)
+      '@mantine/hooks': 9.3.0(react@19.2.6)
+      clsx: 2.1.1
+      dayjs: 1.11.21
+      react: 19.2.6
+      react-dom: 19.2.6(react@19.2.6)
+
   '@mantine/dates@9.3.2(@mantine/core@9.3.2(@mantine/hooks@9.3.2(react@19.2.6))(@types/react@18.3.31)(react-dom@19.2.6(react@19.2.6))(react@19.2.6))(@mantine/hooks@9.3.2(react@19.2.6))(dayjs@1.11.21)(react-dom@19.2.6(react@19.2.6))(react@19.2.6)':
     dependencies:
       '@mantine/core': 9.3.2(@mantine/hooks@9.3.2(react@19.2.6))(@types/react@18.3.31)(react-dom@19.2.6(react@19.2.6))(react@19.2.6)
@@ -15820,6 +15966,8 @@ snapshots:
 
   '@types/validator@13.15.10': {}
 
+  '@types/vorpal@1.12.8': {}
+
   '@types/yargs-parser@21.0.3': {}
 
   '@types/yargs@17.0.35':
@@ -16318,6 +16466,8 @@ snapshots:
     dependencies:
       ansi-wrap: 0.1.0
 
+  ansi-escapes@1.4.0: {}
+
   ansi-escapes@4.3.2:
     dependencies:
       type-fest: 0.21.3
@@ -16358,6 +16508,8 @@ snapshots:
     dependencies:
       ansi-wrap: 0.1.0
 
+  ansi-regex@2.1.1: {}
+
   ansi-regex@5.0.1: {}
 
   ansi-regex@6.2.2: {}
@@ -16370,6 +16522,8 @@ snapshots:
     dependencies:
       ansi-wrap: 0.1.0
 
+  ansi-styles@2.2.1: {}
+
   ansi-styles@4.3.0:
     dependencies:
       color-convert: 2.0.1
@@ -16673,6 +16827,12 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  babel-polyfill@6.26.0:
+    dependencies:
+      babel-runtime: 6.26.0
+      core-js: 2.6.12
+      regenerator-runtime: 0.10.5
+
   babel-preset-current-node-syntax@1.2.0(@babel/core@7.29.7):
     dependencies:
       '@babel/core': 7.29.7
@@ -16698,6 +16858,11 @@ snapshots:
       babel-plugin-jest-hoist: 29.6.3
       babel-preset-current-node-syntax: 1.2.0(@babel/core@7.29.7)
 
+  babel-runtime@6.26.0:
+    dependencies:
+      core-js: 2.6.12
+      regenerator-runtime: 0.11.1
+
   balanced-match@1.0.2: {}
 
   balanced-match@4.0.4: {}
@@ -16994,6 +17159,14 @@ snapshots:
     dependencies:
       traverse: 0.3.9
 
+  chalk@1.1.3:
+    dependencies:
+      ansi-styles: 2.2.1
+      escape-string-regexp: 1.0.5
+      has-ansi: 2.0.0
+      strip-ansi: 3.0.1
+      supports-color: 2.0.0
+
   chalk@4.1.2:
     dependencies:
       ansi-styles: 4.3.0
@@ -17064,6 +17237,10 @@ snapshots:
 
   classnames@2.5.1: {}
 
+  cli-cursor@1.0.2:
+    dependencies:
+      restore-cursor: 1.0.1
+
   cli-cursor@3.1.0:
     dependencies:
       restore-cursor: 3.1.0
@@ -17085,6 +17262,8 @@ snapshots:
       slice-ansi: 5.0.0
       string-width: 7.2.0
 
+  cli-width@1.1.1: {}
+
   cli-width@4.1.0: {}
 
   client-only@0.0.1: {}
@@ -17129,6 +17308,8 @@ snapshots:
 
   code-block-writer@13.0.3: {}
 
+  code-point-at@1.1.0: {}
+
   codepage@1.15.0: {}
 
   collect-v8-coverage@1.0.3: {}
@@ -17245,6 +17426,8 @@ snapshots:
 
   copy-descriptor@0.1.1: {}
 
+  core-js@2.6.12: {}
+
   core-js@3.49.0:
     optional: true
 
@@ -17885,6 +18068,8 @@ snapshots:
 
   escape-html@1.0.3: {}
 
+  escape-string-regexp@1.0.5: {}
+
   escape-string-regexp@2.0.0: {}
 
   escape-string-regexp@4.0.0: {}
@@ -18197,6 +18382,8 @@ snapshots:
       strip-final-newline: 4.0.0
       yoctocolors: 2.1.2
 
+  exit-hook@1.1.1: {}
+
   exit@0.1.2: {}
 
   expand-brackets@2.1.4:
@@ -18409,6 +18596,11 @@ snapshots:
 
   fflate@0.8.3: {}
 
+  figures@1.7.0:
+    dependencies:
+      escape-string-regexp: 1.0.5
+      object-assign: 4.1.1
+
   figures@6.1.0:
     dependencies:
       is-unicode-supported: 2.1.0
@@ -18843,6 +19035,10 @@ snapshots:
     optionalDependencies:
       uglify-js: 3.19.3
 
+  has-ansi@2.0.0:
+    dependencies:
+      ansi-regex: 2.1.1
+
   has-bigints@1.1.0: {}
 
   has-flag@3.0.0: {}
@@ -19035,6 +19231,8 @@ snapshots:
 
   imurmurhash@0.1.4: {}
 
+  in-publish@2.0.1: {}
+
   inflight@1.0.6:
     dependencies:
       once: 1.4.0
@@ -19055,6 +19253,21 @@ snapshots:
       react: 19.2.6
       react-dom: 19.2.6(react@19.2.6)
 
+  inquirer@0.11.0:
+    dependencies:
+      ansi-escapes: 1.4.0
+      ansi-regex: 2.1.1
+      chalk: 1.1.3
+      cli-cursor: 1.0.2
+      cli-width: 1.1.1
+      figures: 1.7.0
+      lodash: 3.10.1
+      readline2: 1.0.1
+      run-async: 0.1.0
+      rx-lite: 3.1.2
+      strip-ansi: 3.0.1
+      through: 2.3.8
+
   internal-slot@1.1.0:
     dependencies:
       es-errors: 1.3.0
@@ -19164,6 +19377,10 @@ snapshots:
     dependencies:
       call-bound: 1.0.4
 
+  is-fullwidth-code-point@1.0.0:
+    dependencies:
+      number-is-nan: 1.0.1
+
   is-fullwidth-code-point@3.0.0: {}
 
   is-fullwidth-code-point@4.0.0: {}
@@ -20126,6 +20343,8 @@ snapshots:
 
   lodash.upperfirst@4.3.1: {}
 
+  lodash@3.10.1: {}
+
   lodash@4.17.21: {}
 
   lodash@4.18.1: {}
@@ -20145,6 +20364,11 @@ snapshots:
       chalk: 5.6.2
       is-unicode-supported: 1.3.0
 
+  log-update@1.0.2:
+    dependencies:
+      ansi-escapes: 1.4.0
+      cli-cursor: 1.0.2
+
   log-update@6.1.0:
     dependencies:
       ansi-escapes: 7.3.0
@@ -20436,6 +20660,8 @@ snapshots:
       concat-stream: 2.0.0
       type-is: 1.6.18
 
+  mute-stream@0.0.5: {}
+
   mute-stream@2.0.0: {}
 
   mute-stream@3.0.0: {}
@@ -20555,6 +20781,8 @@ snapshots:
 
   node-int64@0.4.0: {}
 
+  node-localstorage@0.6.0: {}
+
   node-releases@2.0.47: {}
 
   normalize-path@3.0.0: {}
@@ -20580,6 +20808,8 @@ snapshots:
     dependencies:
       boolbase: 1.0.0
 
+  number-is-nan@1.0.1: {}
+
   nwsapi@2.2.24: {}
 
   nypm@0.6.6:
@@ -20658,6 +20888,8 @@ snapshots:
     dependencies:
       wrappy: 1.0.2
 
+  onetime@1.1.0: {}
+
   onetime@5.1.2:
     dependencies:
       mimic-fn: 2.1.0
@@ -21642,6 +21874,12 @@ snapshots:
 
   readdirp@4.1.2: {}
 
+  readline2@1.0.1:
+    dependencies:
+      code-point-at: 1.1.0
+      is-fullwidth-code-point: 1.0.0
+      mute-stream: 0.0.5
+
   recast@0.23.11:
     dependencies:
       ast-types: 0.16.1
@@ -21708,6 +21946,10 @@ snapshots:
       get-proto: 1.0.1
       which-builtin-type: 1.2.1
 
+  regenerator-runtime@0.10.5: {}
+
+  regenerator-runtime@0.11.1: {}
+
   regenerator-runtime@0.13.11:
     optional: true
 
@@ -21782,6 +22024,11 @@ snapshots:
       path-parse: 1.0.7
       supports-preserve-symlinks-flag: 1.0.0
 
+  restore-cursor@1.0.1:
+    dependencies:
+      exit-hook: 1.1.1
+      onetime: 1.1.0
+
   restore-cursor@3.1.0:
     dependencies:
       onetime: 5.1.2
@@ -21869,10 +22116,16 @@ snapshots:
 
   run-applescript@7.1.0: {}
 
+  run-async@0.1.0:
+    dependencies:
+      once: 1.4.0
+
   run-parallel@1.2.0:
     dependencies:
       queue-microtask: 1.2.3
 
+  rx-lite@3.1.2: {}
+
   rxjs@7.8.1:
     dependencies:
       tslib: 2.8.1
@@ -22316,6 +22569,12 @@ snapshots:
       char-regex: 1.0.2
       strip-ansi: 6.0.1
 
+  string-width@1.0.2:
+    dependencies:
+      code-point-at: 1.1.0
+      is-fullwidth-code-point: 1.0.0
+      strip-ansi: 3.0.1
+
   string-width@4.2.3:
     dependencies:
       emoji-regex: 8.0.0
@@ -22399,6 +22658,10 @@ snapshots:
       is-obj: 3.0.0
       is-regexp: 3.1.0
 
+  strip-ansi@3.0.1:
+    dependencies:
+      ansi-regex: 2.1.1
+
   strip-ansi@6.0.1:
     dependencies:
       ansi-regex: 5.0.1
@@ -22495,6 +22758,8 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  supports-color@2.0.0: {}
+
   supports-color@5.5.0:
     dependencies:
       has-flag: 3.0.0
@@ -23351,6 +23616,19 @@ snapshots:
 
   void-elements@3.1.0: {}
 
+  vorpal@1.12.0:
+    dependencies:
+      babel-polyfill: 6.26.0
+      chalk: 1.1.3
+      in-publish: 2.0.1
+      inquirer: 0.11.0
+      lodash: 4.18.1
+      log-update: 1.0.2
+      minimist: 1.2.8
+      node-localstorage: 0.6.0
+      strip-ansi: 3.0.1
+      wrap-ansi: 2.1.0
+
   w3c-xmlserializer@5.0.0:
     dependencies:
       xml-name-validator: 5.0.0
@@ -23520,6 +23798,11 @@ snapshots:
 
   wordwrap@1.0.0: {}
 
+  wrap-ansi@2.1.0:
+    dependencies:
+      string-width: 1.0.2
+      strip-ansi: 3.0.1
+
   wrap-ansi@6.2.0:
     dependencies:
       ansi-styles: 4.3.0