diff --git a/ts_web/elements/dees-input-datepicker.ts b/ts_web/elements/dees-input-datepicker.ts
index 2b00789..22a74b3 100644
--- a/ts_web/elements/dees-input-datepicker.ts
+++ b/ts_web/elements/dees-input-datepicker.ts
@@ -486,10 +486,10 @@ export class DeesInputDatepicker extends DeesInputBase<DeesInputDatepicker> {
           <div class="icon-container">
             ${this.value && !this.disabled ? html`
               <button class="clear-button" @click=${this.clearValue} title="Clear">
-                <dees-icon .icon="x" iconSize="14"></dees-icon>
+                <dees-icon icon="lucide:x" iconSize="14"></dees-icon>
               </button>
             ` : ''}
-            <dees-icon class="calendar-icon" .icon="calendar" iconSize="16"></dees-icon>
+            <dees-icon class="calendar-icon" icon="lucide:calendar" iconSize="16"></dees-icon>
           </div>
           
           <!-- Calendar Popup -->
@@ -497,13 +497,13 @@ export class DeesInputDatepicker extends DeesInputBase<DeesInputDatepicker> {
             <!-- Month/Year Navigation -->
             <div class="calendar-header">
               <button class="nav-button" @click="${this.previousMonth}">
-                <dees-icon .icon="chevronLeft" iconSize="16"></dees-icon>
+                <dees-icon icon="lucide:chevronLeft" iconSize="16"></dees-icon>
               </button>
               <div class="month-year-display">
                 ${monthNames[this.viewDate.getMonth()]} ${this.viewDate.getFullYear()}
               </div>
               <button class="nav-button" @click="${this.nextMonth}">
-                <dees-icon .icon="chevronRight" iconSize="16"></dees-icon>
+                <dees-icon icon="lucide:chevronRight" iconSize="16"></dees-icon>
               </button>
             </div>