diff --git a/configs/deployment/scripts/build/ui.sh b/configs/deployment/scripts/build/ui.sh
index 48598dfa..4ed68e7f 100644
--- a/configs/deployment/scripts/build/ui.sh
+++ b/configs/deployment/scripts/build/ui.sh
@@ -21,7 +21,14 @@ echo "Build versiyonu: ${VERSION}"
 # Sürüm numarası ve sürüm notları backend'de (Sürüm Notları tablosu) tutulur;
 # UI tarafında üretilecek bir sürüm dosyası yoktur. Buradaki VERSION yalnızca
 # imaj etiketidir.
+# DevExtreme lisansını dosyadan oku (GitHub'a commit edilmemiş; api ile aynı dosya).
+DEVEXPRESS_LICENSE=$(cat ~/sozsoft-platform/api/DevExpress_License.txt 2>/dev/null || echo "")
+if [ -z "${DEVEXPRESS_LICENSE}" ]; then
+  echo "UYARI: api/DevExpress_License.txt bulunamadı. UI, DevExtreme TRIAL anahtarıyla derlenecek ve değerlendirme sürümü uyarısı gösterecek."
+fi
+
 docker build \
+  --build-arg DevExpress_License="${DEVEXPRESS_LICENSE}" \
   -t devops.sozsoft.com/sozsoft/sozsoft-platform-ui:${ENV}-${VERSION} \
   -t devops.sozsoft.com/sozsoft/sozsoft-platform-ui:${ENV}-latest \
   -f Sozsoft.Platform.Ui.Dockerfile --build-arg ENV=${ENV} .
diff --git a/ui/Sozsoft.Platform.Ui.Dockerfile b/ui/Sozsoft.Platform.Ui.Dockerfile
index a3407da6..42ae8f22 100644
--- a/ui/Sozsoft.Platform.Ui.Dockerfile
+++ b/ui/Sozsoft.Platform.Ui.Dockerfile
@@ -14,5 +14,26 @@ RUN npm i && \
     npm install @rolldown/binding-linux-x64-musl @rollup/rollup-linux-x64-musl --save-dev && \
     npm rebuild rollup
 COPY . .
-RUN npm run build:production -- --mode $ENV
+
+# DevExtreme lisansı yalnızca build sırasında gerekli: prebuild:production adımı
+# devextreme-license CLI'ı çalıştırıp src/devextreme-license.ts dosyasını üretiyor.
+# CLI anahtarı sırasıyla DevExpress_License env'inden veya
+# $HOME/.config/DevExpress/DevExpress_License.txt dosyasından okur; anahtar
+# bulunamazsa TRIAL key üretir ve uygulamada değerlendirme sürümü uyarısı çıkar.
+#
+# GÜVENLİK: Gizli olan LCX ana anahtarıdır; imaj katmanında kalmaması için
+# dosya yazma, build ve silme tek RUN içinde yapılıyor. ENV olarak da
+# tanımlanmıyor, aksi halde `docker inspect` ile okunabilir hale gelirdi.
+# Bundle'a gömülen LCP anahtarı ise türetilmiş, istemci tarafı anahtardır.
+ARG DevExpress_License
+RUN if [ -n "$DevExpress_License" ]; then \
+        mkdir -p "$HOME/.config/DevExpress" && \
+        printf '%s\n' "$DevExpress_License" > "$HOME/.config/DevExpress/DevExpress_License.txt"; \
+    else \
+        echo "UYARI: DevExpress_License boş. DevExtreme TRIAL anahtarıyla derleniyor."; \
+    fi; \
+    npm run build:production -- --mode $ENV; \
+    status=$?; \
+    rm -rf "$HOME/.config/DevExpress"; \
+    exit $status
 CMD ["npm", "run", "preview"]
diff --git a/ui/src/views/shared/MenuAddDialog.tsx b/ui/src/views/shared/MenuAddDialog.tsx
index 97eebf88..13a19c7e 100644
--- a/ui/src/views/shared/MenuAddDialog.tsx
+++ b/ui/src/views/shared/MenuAddDialog.tsx
@@ -61,15 +61,19 @@ export function IconPickerField({ value, onChange, invalid }: IconPickerFieldPro
         yarıçapı, dolgu ve açık/koyu tema arka planı diğer form alanlarıyla birebir
         aynı olur. Metin renkleri `!` ile verilir: Button bileşeni variant'ına göre
         kendi `text-*` sınıfını basıyor ve aynı özgüllükte olduğu için eziyordu.
+        Aynı sebeple kenarlık/arka plan da `!` ile verilir: `plain` variant
+        `bg-transparent border border-transparent` bastığı için `.input` kenarlığı
+        eziliyor ve alan açık temada görünmez oluyordu (yalnızca hover'da beliriyordu).
       */}
       <Button
         type="button"
         onClick={() => setOpen((v) => !v)}
         variant="plain"
-        shape="none"
+        shape="round"
         size={controlSize}
-        className={`input flex items-center gap-2 !justify-start !px-3 text-left text-sm !text-gray-700 dark:!text-gray-100 hover:border-indigo-400
-          ${invalid ? 'input-invalid' : ''}`}
+        className={`input flex items-center gap-2 !justify-start !px-3 text-left text-sm !text-gray-700 dark:!text-gray-100
+          !bg-white dark:!bg-transparent !border !border-gray-300 dark:!border-gray-600 hover:!border-indigo-400
+          ${invalid ? 'input-invalid !border-red-500' : ''}`}
       >
         {SelectedIcon ? (
           <span className="flex items-center gap-2 flex-1 truncate">