Fix ecommerce UI Chinese display

src/styles/ecommerce-standalone.css

@@ -3362,6 +3362,15 @@
   padding-top: 330px !important;
 }
 
+/* Generated composer top alignment: compensate preview padding so the box is flush with the canvas top. */
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview[data-status="done"] .ecom-command-composer-wrap.has-generated {
+  top: -138px !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview[data-status="done"]:has(.ecom-command-composer-wrap:not(.is-compact)) .ecom-command-composer-wrap.has-generated {
+  top: -330px !important;
+}
+
 .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history {
   z-index: 80 !important;
   pointer-events: auto !important;
@@ -3795,109 +3804,111 @@
   }
 }
 
-/* Visual polish only: refine depth and states without changing layout geometry. */
+/* Model settings: expose model appearance controls inside the command popover. */
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model {
-  border-color: rgba(30, 189, 219, 0.34) !important;
+  grid-template-columns: repeat(3, minmax(138px, 1fr)) !important;
-  background:
+  width: min(720px, calc(100vw - 56px)) !important;
-    linear-gradient(180deg, rgba(254, 255, 255, 0.98), rgba(250, 254, 255, 0.94)) !important;
+  max-width: min(720px, calc(100vw - 56px)) !important;
-  box-shadow:
+  margin-left: -128px !important;
-    0 22px 60px rgba(16, 115, 204, 0.08),
-    0 1px 0 rgba(255, 255, 255, 0.9) inset !important;
 }
 
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea {
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model header,
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model,
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile,
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-text {
+  grid-column: 1 / -1 !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model header {
+  order: 0 !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile {
+  order: 1 !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model {
+  order: 2 !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile {
+  display: grid !important;
+  grid-template-columns: 1fr !important;
+  gap: 8px !important;
+  padding: 0 !important;
+  border: 0 !important;
+  border-radius: 0 !important;
+  background: transparent !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile__title {
+  grid-column: 1 / -1 !important;
+  color: #10202c !important;
+  font-size: 13px !important;
+  font-weight: 700 !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile section {
+  display: grid !important;
+  grid-template-columns: 52px minmax(0, 1fr) !important;
+  align-items: center !important;
+  gap: 8px !important;
+  min-width: 0 !important;
+  padding: 0 !important;
+  border: 0 !important;
+  border-radius: 0 !important;
+  background: transparent !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile section > strong,
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-text > strong {
+  color: #526f7e !important;
+  font-size: 12px !important;
+  font-weight: 700 !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile section > div {
+  display: flex !important;
+  flex-wrap: wrap !important;
+  gap: 6px !important;
+  min-width: 0 !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile button {
+  width: auto !important;
+  min-width: 0 !important;
+  min-height: 32px !important;
+  padding: 6px 12px !important;
+  font-size: 12px !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-text {
+  display: grid !important;
+  gap: 7px !important;
+  padding: 0 !important;
+  border: 0 !important;
+  border-radius: 0 !important;
+  background: transparent !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-text > strong {
+  order: 0 !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-text > textarea {
+  order: 1 !important;
+}
+
+.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-text textarea {
+  min-height: 58px !important;
+  resize: vertical !important;
+  border: 1px solid rgba(30, 189, 219, 0.22) !important;
+  border-radius: 13px !important;
+  padding: 10px 12px !important;
   color: #122534 !important;
-  caret-color: #1073cc !important;
+  background: #f3f8fa !important;
-}
+  font-family: "PingFang SC", "Microsoft YaHei", sans-serif !important;
-
+  font-size: 13px !important;
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea::placeholder {
+  font-weight: 500 !important;
-  color: rgba(82, 111, 126, 0.72) !important;
+  line-height: 1.45 !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar button,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__tools button,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list button {
-  border-color: rgba(30, 189, 219, 0.24) !important;
-  background:
-    linear-gradient(180deg, rgba(254, 255, 255, 0.96), rgba(237, 249, 252, 0.88)) !important;
-  box-shadow:
-    0 1px 0 rgba(255, 255, 255, 0.86) inset,
-    0 6px 14px rgba(16, 115, 204, 0.045) !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar button:hover,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button:hover,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__tools button:hover,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list button:hover {
-  border-color: rgba(30, 189, 219, 0.52) !important;
-  background:
-    linear-gradient(180deg, rgba(254, 255, 255, 1), rgba(224, 247, 252, 0.92)) !important;
-  box-shadow:
-    0 1px 0 rgba(255, 255, 255, 0.92) inset,
-    0 10px 20px rgba(16, 115, 204, 0.08) !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar button.is-active,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button.is-active,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list button.is-active {
-  border-color: rgba(16, 115, 204, 0.54) !important;
-  background:
-    linear-gradient(180deg, rgba(225, 248, 253, 0.98), rgba(207, 243, 251, 0.94)) !important;
-  color: #0d5f8e !important;
-  box-shadow:
-    0 1px 0 rgba(255, 255, 255, 0.9) inset,
-    0 10px 22px rgba(16, 115, 204, 0.1) !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover {
-  border-color: rgba(16, 115, 204, 0.42) !important;
-  background:
-    linear-gradient(180deg, rgba(254, 255, 255, 0.98), rgba(234, 249, 252, 0.96)) !important;
-  box-shadow:
-    0 24px 54px rgba(16, 115, 204, 0.14),
-    0 1px 0 rgba(255, 255, 255, 0.9) inset !important;
-  backdrop-filter: blur(18px) !important;
-  -webkit-backdrop-filter: blur(18px) !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send:not(:disabled) {
-  border-color: rgba(30, 189, 219, 0.52) !important;
-  background:
-    linear-gradient(135deg, rgba(30, 189, 219, 0.92), rgba(16, 115, 204, 0.9)) !important;
-  color: #ffffff !important;
-  box-shadow: 0 12px 24px rgba(16, 115, 204, 0.18) !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send:disabled {
-  border-color: rgba(30, 189, 219, 0.18) !important;
-  background:
-    linear-gradient(180deg, rgba(236, 247, 250, 0.96), rgba(226, 240, 244, 0.92)) !important;
-  color: rgba(70, 104, 120, 0.56) !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history {
-  background:
-    linear-gradient(180deg, rgba(254, 255, 255, 0.98), rgba(247, 252, 253, 0.96)) !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__heading,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__empty {
-  border-color: rgba(30, 189, 219, 0.22) !important;
-  background: rgba(248, 253, 254, 0.78) !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-empty-state strong {
-  color: #122534 !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-empty-state span,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-empty-state p {
-  color: #557184 !important;
-}
-
-.ecommerce-standalone .product-clone-page[data-tool="clone"] button:focus-visible,
-.ecommerce-standalone .product-clone-page[data-tool="clone"] textarea:focus-visible {
-  outline: 2px solid rgba(30, 189, 219, 0.42) !important;
-  outline-offset: 2px !important;
 }