From 120fc2e70cbf9bec79eaa35102cf777bc3b2c453 Mon Sep 17 00:00:00 2001 From: Stringadmin Date: Tue, 16 Jun 2026 12:23:50 +0800 Subject: [PATCH] =?UTF-8?q?refactor(css):=20#6=20=E5=90=8E=E7=BB=AD?= =?UTF-8?q?=E9=98=B6=E6=AE=B5=E2=80=94=E2=80=94@layer=20=E7=BA=A7=E8=81=94?= =?UTF-8?q?=20+=20token=20=E5=8C=96=20+=20=E8=A1=8C=E5=B0=BE=E6=B2=BB?= =?UTF-8?q?=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 引入 @layer ecommerce-core,standalone 覆盖层不再依赖 !important(全站 !important 7812→967) --- .gitattributes | 37 + scripts/cleanup-css-important.mjs | 36 + scripts/cleanup-css-overrides.mjs | 79 + scripts/css-audit.mjs | 6 +- scripts/tokenize-colors.mjs | 93 + src/styles/ecommerce-standalone.css | 14 +- src/styles/index.css | 1 + src/styles/layers.css | 9 + src/styles/pages/ecommerce.css | 25 +- src/styles/standalone/base.css | 11779 ++++++++++++-------------- src/styles/standalone/overrides.css | 4900 +++++------ src/styles/standalone/tokens.css | 65 + 12 files changed, 8027 insertions(+), 9017 deletions(-) create mode 100644 .gitattributes create mode 100644 scripts/cleanup-css-important.mjs create mode 100644 scripts/cleanup-css-overrides.mjs create mode 100644 scripts/tokenize-colors.mjs create mode 100644 src/styles/layers.css create mode 100644 src/styles/standalone/tokens.css diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 0000000..69b784b --- /dev/null +++ b/.gitattributes @@ -0,0 +1,37 @@ +# 默认按文本处理,统一使用 LF 行尾 +* text=auto eol=lf + +# 源码与样式文件强制 LF +*.ts text eol=lf +*.tsx text eol=lf +*.js text eol=lf +*.jsx text eol=lf +*.mjs text eol=lf +*.cjs text eol=lf +*.css text eol=lf +*.html text eol=lf +*.json text eol=lf +*.md text eol=lf +*.yml text eol=lf +*.yaml text eol=lf + +# Windows 专用脚本保留 CRLF +*.bat text eol=crlf +*.cmd text eol=crlf +*.ps1 text eol=crlf + +# 二进制文件,不做行尾转换 +*.png binary +*.jpg binary +*.jpeg binary +*.gif binary +*.webp binary +*.ico binary +*.svg text eol=lf +*.woff binary +*.woff2 binary +*.ttf binary +*.eot binary +*.otf binary +*.pdf binary +*.zip binary diff --git a/scripts/cleanup-css-important.mjs b/scripts/cleanup-css-important.mjs new file mode 100644 index 0000000..59f9666 --- /dev/null +++ b/scripts/cleanup-css-important.mjs @@ -0,0 +1,36 @@ +/** + * Remove all !important declarations from a CSS file. + * For use with base.css and other files that no longer need !important + * because they are unlayered and override layered ecommerce.css by cascade priority. + */ + +import { readFileSync, writeFileSync } from "node:fs"; + +const filePath = process.argv[2]; +if (!filePath) { + console.error("Usage: node cleanup-css-important.mjs "); + process.exit(1); +} + +let content = readFileSync(filePath, "utf-8"); + +// Strip BOM +content = content.replace(/^\uFEFF/, ""); + +// Remove !important +const before = (content.match(/!important/g) || []).length; +content = content.replace(/\s*!important/g, ""); + +// Fix artifacts +content = content.replace(/;\s*;/g, ";"); +content = content.replace(/;\s*}/g, "}"); +content = content.replace(/[ \t]+$/gm, ""); + +const after = (content.match(/!important/g) || []).length; +const lines = content.split("\n").length; + +writeFileSync(filePath, content, "utf-8"); + +console.log(`Processed: ${filePath}`); +console.log(` Lines: ${lines}`); +console.log(` !important: ${before} → ${after} (removed ${before - after})`); diff --git a/scripts/cleanup-css-overrides.mjs b/scripts/cleanup-css-overrides.mjs new file mode 100644 index 0000000..dad78f5 --- /dev/null +++ b/scripts/cleanup-css-overrides.mjs @@ -0,0 +1,79 @@ +/** + * Clean up overrides.css: + * 1. Remove BOM character + * 2. Remove `html body #root ` specificity prefix from selectors + * 3. Remove `html body ` specificity prefix + * 4. Deduplicate doubled class selectors: .foo.foo → .foo + * 5. Deduplicate doubled attribute selectors: [attr="val"][attr="val"] → [attr="val"] + * 6. Remove all `!important` declarations + * 7. Compress multiple consecutive blank lines + */ + +import { readFileSync, writeFileSync } from "node:fs"; + +const filePath = process.argv[2]; +if (!filePath) { + console.error("Usage: node cleanup-css-overrides.mjs "); + process.exit(1); +} + +let content = readFileSync(filePath, "utf-8"); + +// 0. Strip BOM +content = content.replace(/^\uFEFF/, ""); + +// 1. Remove `html body #root ` prefix (with space before the next selector) +content = content.replace(/^(\s*)html\s+body\s+#root\s+/gm, "$1"); + +// 2. Remove `html body ` prefix (remaining ones without #root) +content = content.replace(/^(\s*)html\s+body\s+/gm, "$1"); + +// 3. Deduplicate doubled class selectors: .foo.foo → .foo +// Must not match across word boundaries incorrectly +content = content.replace(/\.([\w-]+)(\.\1)\b/g, ".$1"); + +// 4. Deduplicate doubled attribute selectors: [data-tool="clone"][data-tool="clone"] → [data-tool="clone"] +// Use known patterns +const attrDedup = [ + [/\[data-tool="clone"\]\[data-tool="clone"\]/g, '[data-tool="clone"]'], + [/\[data-tool="kit"\]\[data-tool="kit"\]/g, '[data-tool="kit"]'], + [/\[data-tool="video"\]\[data-tool="video"\]/g, '[data-tool="video"]'], +]; +for (const [pat, repl] of attrDedup) { + content = content.replace(pat, repl); +} + +// 4b. Generic dedup for any other doubled attribute patterns that slipped through +// Match [name] or [name="val"] followed by an exact copy +content = content.replace(/\[(\w[\w-]*(?:="[^"]*")?)\]\1/g, "[$1]"); + +// 5. Remove ` !important` — strip the space and the keyword, keeping the semicolon or newline +content = content.replace(/\s*!important/g, ""); + +// 6. Fix artifacts: +// - " ; " or " ;; " → "; " +content = content.replace(/;\s*;/g, ";"); +// - Lone semicolon before closing brace: ";\n}" → "\n}" (just remove trailing ;) +content = content.replace(/;(\s*\})/g, "$1"); +// - But keep "; " inside rule blocks — only clean up empty declarations + +// 7. Don't collapse " ;}" — we already handled this above +// If after removing !important we have style: value; } → keep it as is + +// 8. Compress multiple blank lines (>2 consecutive newlines) to at most one +content = content.replace(/\n{3,}/g, "\n\n"); + +// 9. Remove trailing whitespace on lines +content = content.replace(/[ \t]+$/gm, ""); + +// 10. Ensure single trailing newline +content = content.trimEnd() + "\n"; + +writeFileSync(filePath, content, "utf-8"); + +// Stats +const importantCount = (content.match(/!important/g) || []).length; +const lines = content.split("\n").length; +console.log(`Processed: ${filePath}`); +console.log(` Lines: ${lines}`); +console.log(` !important remaining: ${importantCount}`); diff --git a/scripts/css-audit.mjs b/scripts/css-audit.mjs index 20ff14c..a39b9d9 100644 --- a/scripts/css-audit.mjs +++ b/scripts/css-audit.mjs @@ -70,9 +70,9 @@ console.log( console.log(""); // Exit non-zero if total !important exceeds a budget threshold. -// Current baseline: ~7795. Set budget slightly above to allow incremental work -// while preventing uncontrolled growth. -const IMPORTANT_BUDGET = 7820; +// Post-@layer refactoring baseline: ~970 (formerly ~7812). +// Budget set to 2000 to prevent regression while allowing controlled growth. +const IMPORTANT_BUDGET = 2000; if (totals.important > IMPORTANT_BUDGET) { console.error( `FAIL: !important count ${totals.important} exceeds budget ${IMPORTANT_BUDGET}. ` + diff --git a/scripts/tokenize-colors.mjs b/scripts/tokenize-colors.mjs new file mode 100644 index 0000000..88ebf1d --- /dev/null +++ b/scripts/tokenize-colors.mjs @@ -0,0 +1,93 @@ +/** + * Replace hardcoded hex colors in base.css / overrides.css with + * CSS variable references defined in standalone/tokens.css. + * + * The replacement table maps exact hex values → var() references. + * Only standalone/*.css files are processed. + */ + +import { readFileSync, writeFileSync } from "node:fs"; + +// Color → variable mappings (ordered so longer/more-specific colors are matched first) +const REPLACEMENTS = [ + // Primary accent + ["#1073cc", "var(--ecom-primary)"], + ["#0f66b3", "var(--ecom-primary-hover)"], + + // Cyan accent + ["#1ebddb", "var(--ecom-accent-cyan)"], + ["#1dbedb", "var(--ecom-accent-cyan)"], // common typo variant + ["#16c8df", "var(--ecom-accent-cyan-light)"], + ["#18bfd2", "var(--ecom-accent-cyan-bright)"], + ["#0f829b", "var(--ecom-accent-cyan-deep)"], + + // White/near-white + ["#feffff", "var(--ecom-bg-near-white)"], + ["#fbfdff", "var(--ecom-bg-near-white)"], + ["#f8fdff", "var(--ecom-bg-near-white)"], + ["#ffffff", "var(--ecom-bg-white)"], + ["#fff", "var(--ecom-bg-white)"], // 3-digit short form + + // Light backgrounds + ["#f8f9fa", "var(--ecom-bg-page)"], + ["#edf8fb", "var(--ecom-bg-tinted)"], + ["#edf8ff", "var(--ecom-bg-tinted)"], + ["#f3f8fa", "var(--ecom-bg-cool)"], + ["#f8fbfc", "var(--ecom-bg-cool)"], + ["#eef6f8", "var(--ecom-bg-cool)"], + + // Dark blue backgrounds + ["#172636", "var(--ecom-bg-dark-blue)"], + ["#163447", "var(--ecom-bg-deep-blue)"], + ["#083c67", "var(--ecom-bg-navy)"], + ["#05233f", "var(--ecom-bg-navy-deep)"], + + // Text + ["#10202c", "var(--ecom-text-primary)"], + ["#f5fbff", "var(--ecom-text-on-dark)"], + ["#738392", "var(--ecom-text-muted)"], + ["#71818e", "var(--ecom-text-muted)"], + ["#66798a", "var(--ecom-text-muted)"], + ["#526474", "var(--ecom-text-muted)"], + ["#8da0ab", "var(--ecom-text-placeholder)"], + + // Border + // NOTE: rgba() colors are NOT replaced — only hex values +]; + +function processFile(filePath) { + let content = readFileSync(filePath, "utf-8"); + let replaced = 0; + + for (const [hex, variable] of REPLACEMENTS) { + // Only replace when the hex appears as a CSS value (not inside comments or var()) + // Match: colon-space-hex, comma-space-hex, space-hex, etc. + // But be careful: don't replace inside existing var() calls + const regex = new RegExp( + `(?"); + process.exit(1); +} + +let total = 0; +for (const f of files) { + total += processFile(f); +} +console.log(`Total: ${total} replacements across ${files.length} file(s)`); diff --git a/src/styles/ecommerce-standalone.css b/src/styles/ecommerce-standalone.css index 07f8d3e..d9c934f 100644 --- a/src/styles/ecommerce-standalone.css +++ b/src/styles/ecommerce-standalone.css @@ -2,13 +2,17 @@ * ecommerce-standalone.css — 聚合入口 * * 电商工作台的全站覆盖样式。按职责拆分为两部分: - * - base.css: 正常选择器(topbar / auth / clone-ai / profile / 功能面板) - * - overrides.css: 超高特异性覆盖层(html body #root ... + !important), - * 用于在 ecommerce.css 之后生效,是 !important 的主要来源(#6 待治理) + * - base.css: 未分层主题覆盖(topbar / auth / clone-ai / profile / 功能面板), + * 通过 CSS @layer 级联自动覆盖 ecommerce-core 层样式。 + * - overrides.css: 响应式布局覆盖(媒体查询 / 小屏适配 / 组件微调), + * 未分层,自动胜出 @layer ecommerce-core。 * - * 不要在此文件直接追加规则。新增样式写入对应子文件; - * 新增 !important 会被 npm run css:audit 拦截(budget 7820)。 + * 级联架构(via @layer): + * 未分层(base / overrides) > @layer ecommerce-core(ecommerce.css) + * + * 不要在此文件直接追加规则。新增样式写入对应子文件。 */ +@import "./standalone/tokens.css"; @import "./standalone/base.css"; @import "./standalone/overrides.css"; diff --git a/src/styles/index.css b/src/styles/index.css index 48360bf..ab72362 100644 --- a/src/styles/index.css +++ b/src/styles/index.css @@ -1,3 +1,4 @@ +@import "./layers.css"; @import "./tokens.css"; @import "./base/reset.css"; @import "./shell/app-shell.css"; diff --git a/src/styles/layers.css b/src/styles/layers.css new file mode 100644 index 0000000..2f2c431 --- /dev/null +++ b/src/styles/layers.css @@ -0,0 +1,9 @@ +/* + * Layer declaration — must be imported first so all @layer rules are resolved + * before any stylesheet that references them. + * + * ecommerce-core: 电商页主样式。较低优先级,方便 standalone 覆盖层在不使用 + * !important 的情况下覆盖。 + */ + +@layer ecommerce-core; diff --git a/src/styles/pages/ecommerce.css b/src/styles/pages/ecommerce.css index 63bdee1..5b3680e 100644 --- a/src/styles/pages/ecommerce.css +++ b/src/styles/pages/ecommerce.css @@ -1,3 +1,4 @@ +@layer ecommerce-core { .product-clone-page { display: grid; grid-template-rows: 54px minmax(0, 1fr); @@ -3113,10 +3114,10 @@ font-weight: 800; } -/* ═══════════════════════════════════════════════ +/* ══════════════════════════════════════════════�? Flowchart Pipeline Layout (参考图风格) - 流程图式布局:原图 → 分镜文本 → 分镜图 → 分镜视频 - ═══════════════════════════════════════════════ */ + 流程图式布局:原�?�?分镜文本 �?分镜�?�?分镜视频 + ══════════════════════════════════════════════�?*/ .clone-ai-flow-pipeline { display: flex; @@ -3260,7 +3261,7 @@ flex-shrink: 0; } -/* ── Connector (分支连接线) ── */ +/* ── Connector (分支连接�? ── */ .clone-ai-flow-connector { display: flex; align-items: center; @@ -3320,7 +3321,7 @@ background: #3a3f48; } -/* ── Flow Arrow (节点间箭头) ── */ +/* ── Flow Arrow (节点间箭�? ── */ .clone-ai-flow-branch .clone-ai-flow-arrow { width: 28px; height: 16px; @@ -3449,9 +3450,9 @@ width: min(100%, 1100px); } -/* ═══════════════════════════════════════════════ +/* ══════════════════════════════════════════════�? End Flowchart Pipeline Styles - ═══════════════════════════════════════════════ */ + ══════════════════════════════════════════════�?*/ .product-clone-page .clone-ai-input-wrapper { position: relative; @@ -12119,7 +12120,7 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } -/* 平台弹窗宽度仅桌面/平板固定;≤640px 由移动端断点的全宽规则接管。 */ +/* 平台弹窗宽度仅桌�?平板固定;≤640px 由移动端断点的全宽规则接管�?*/ @media (min-width: 641px) { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platform { width: min(460px, calc(100% - 24px)) !important; @@ -12127,7 +12128,7 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d } } -/* 平台选项:logo + 名称横排,名称过长省略,避免在窄网格里溢出弹窗。 */ +/* 平台选项:logo + 名称横排,名称过长省略,避免在窄网格里溢出弹窗�?*/ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platform button { display: flex !important; align-items: center !important; @@ -12153,8 +12154,8 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d } } -/* 宽设置面板:固定宽度并靠右对齐 composer,避免从靠右的"设置"按钮左对齐展开时顶出右边缘被裁。 - 仅桌面/平板生效;≤640px 由移动端断点的全宽规则接管。 */ +/* 宽设置面板:固定宽度并靠右对�?composer,避免从靠右�?设置"按钮左对齐展开时顶出右边缘被裁�? + 仅桌�?平板生效;≤640px 由移动端断点的全宽规则接管�?*/ @media (min-width: 641px) { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings { width: min(520px, calc(100% - 24px)) !important; @@ -12209,3 +12210,5 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d margin: 0 !important; font-size: 24px !important; } + +} \ No newline at end of file diff --git a/src/styles/standalone/base.css b/src/styles/standalone/base.css index e9ecde1..f293748 100644 --- a/src/styles/standalone/base.css +++ b/src/styles/standalone/base.css @@ -1,15 +1,13 @@ -.ecommerce-standalone-body { +.ecommerce-standalone-body { overflow: hidden; - background: #0d0f10; -} + background: #0d0f10} .ecommerce-standalone { min-height: 100vh; color: #f7faf8; background: radial-gradient(circle at 18% 0%, rgba(34, 197, 94, 0.16), transparent 32rem), - linear-gradient(135deg, #0b0f0d 0%, #111616 42%, #101412 100%); -} + linear-gradient(135deg, #0b0f0d 0%, #111616 42%, #101412 100%)} .ecommerce-standalone__topbar { position: fixed; @@ -23,27 +21,23 @@ padding: 10px clamp(16px, 3vw, 32px); border-bottom: 1px solid rgba(255, 255, 255, 0.08); background: rgba(8, 12, 10, 0.78); - backdrop-filter: blur(18px); -} + backdrop-filter: blur(18px)} .ecommerce-standalone__brand, .ecommerce-standalone__account { display: flex; align-items: center; - gap: 12px; -} + gap: 12px} .ecommerce-standalone__brand strong { font-size: 16px; - font-weight: 800; -} + font-weight: 800} .ecommerce-standalone__brand span, .ecommerce-standalone__credits, .ecommerce-standalone__user { color: rgba(247, 250, 248, 0.66); - font-size: 13px; -} + font-size: 13px} .ecommerce-standalone__account button { display: inline-flex; @@ -56,47 +50,38 @@ border-radius: 8px; color: #f7faf8; background: rgba(255, 255, 255, 0.08); - cursor: pointer; -} + cursor: pointer} .ecommerce-standalone__account button:hover { border-color: rgba(59, 232, 139, 0.58); - background: rgba(59, 232, 139, 0.14); -} + background: rgba(59, 232, 139, 0.14)} .ecommerce-standalone__content { height: 100vh; - padding-top: 64px; -} + padding-top: 64px} /* 工作台与个人中心常驻同层,用 hidden 切换以保活生成任务状态。 wrapper 需要撑满内容区,让内部 .product-clone-page/.local-profile-page 的 height:100% 生效。 */ .ecommerce-standalone__page { height: 100%; - min-height: 0; -} + min-height: 0} .ecommerce-standalone__page[hidden] { - display: none !important; -} + display: none} .ecommerce-standalone__content > .error-boundary, .ecommerce-standalone__content .product-clone-page { - height: 100%; -} + height: 100%} .ecommerce-standalone__content .page-loading-center { - background: #f8f9fa; -} + background: var(--ecom-bg-page)} .ecommerce-standalone__content .page-loading-center__text { - color: rgba(16, 32, 44, 0.55); -} + color: rgba(16, 32, 44, 0.55)} .ecommerce-standalone__content .page-loading-spinner { border-color: rgba(16, 115, 204, 0.16); - border-top-color: #1073cc; -} + border-top-color: var(--ecom-primary)} .ecommerce-auth-modal { position: fixed; @@ -104,15 +89,13 @@ z-index: 200; display: grid; place-items: center; - padding: 20px; -} + padding: 20px} .ecommerce-auth-modal__scrim { position: absolute; inset: 0; border: 0; - background: rgba(0, 0, 0, 0.62); -} + background: rgba(0, 0, 0, 0.62)} .ecommerce-auth-modal__panel { position: relative; @@ -122,8 +105,7 @@ border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 8px; background: rgba(15, 22, 18, 0.96); - box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42); -} + box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42)} .ecommerce-auth-modal__close { position: absolute; @@ -135,27 +117,23 @@ border-radius: 8px; color: #f7faf8; background: rgba(255, 255, 255, 0.06); - cursor: pointer; -} + cursor: pointer} .ecommerce-auth-modal__eyebrow { color: #52f49f; font-size: 12px; - font-weight: 800; -} + font-weight: 800} .ecommerce-auth-modal h2 { margin: 8px 0 18px; - font-size: 24px; -} + font-size: 24px} .ecommerce-auth-modal label { display: grid; gap: 7px; margin-top: 12px; color: rgba(247, 250, 248, 0.72); - font-size: 13px; -} + font-size: 13px} .ecommerce-auth-modal input { width: 100%; @@ -165,28 +143,23 @@ padding: 0 12px; color: #f7faf8; background: rgba(255, 255, 255, 0.07); - outline: none; -} + outline: none} .ecommerce-auth-modal input:focus { border-color: rgba(59, 232, 139, 0.68); - box-shadow: 0 0 0 3px rgba(59, 232, 139, 0.14); -} + box-shadow: 0 0 0 3px rgba(59, 232, 139, 0.14)} .ecommerce-auth-modal__notice, .ecommerce-auth-modal__error { margin: 0 0 10px; font-size: 13px; - line-height: 1.6; -} + line-height: 1.6} .ecommerce-auth-modal__notice { - color: rgba(247, 250, 248, 0.72); -} + color: rgba(247, 250, 248, 0.72)} .ecommerce-auth-modal__error { - color: #ff9a9a; -} + color: #ff9a9a} .ecommerce-auth-modal__submit, .ecommerce-auth-modal__switch { @@ -194,8 +167,7 @@ min-height: 42px; margin-top: 16px; border-radius: 8px; - cursor: pointer; -} + cursor: pointer} .ecommerce-auth-modal__submit { display: inline-flex; @@ -205,53 +177,44 @@ border: 0; color: #062012; background: #52f49f; - font-weight: 800; -} + font-weight: 800} .ecommerce-auth-modal__submit:disabled { opacity: 0.7; - cursor: wait; -} + cursor: wait} .ecommerce-auth-modal__switch { border: 0; color: rgba(247, 250, 248, 0.78); - background: transparent; -} + background: transparent} @media (max-width: 720px) { .ecommerce-standalone__topbar { - min-height: 58px; - } + min-height: 58px} .ecommerce-standalone__brand span, .ecommerce-standalone__credits { - display: none; - } + display: none} .ecommerce-standalone__content { - padding-top: 58px; - } + padding-top: 58px} } /* Standalone ecommerce blue/white theme overrides. */ .ecommerce-standalone-body { - background: #05233f; -} + background: var(--ecom-bg-navy-deep)} .ecommerce-standalone { - color: #f5fbff; + color: var(--ecom-text-on-dark); background: radial-gradient(circle at 13% 0%, rgba(22, 200, 223, 0.42), transparent 31rem), radial-gradient(circle at 80% 10%, rgba(8, 118, 216, 0.36), transparent 34rem), - linear-gradient(135deg, #083c67 0%, #062a4e 45%, #051f3d 100%); -} + linear-gradient(135deg, var(--ecom-bg-navy) 0%, #062a4e 45%, #051f3d 100%)} .ecommerce-standalone__topbar { border-bottom-color: rgba(126, 235, 255, 0.22); background: - linear-gradient(90deg, rgba(7, 72, 121, 0.94), rgba(4, 37, 75, 0.92)); -} + linear-gradient(90deg, rgba(7, 72, 121, 0.94), rgba(4, 37, 75, 0.92))} .ecommerce-standalone__brand::before { width: 34px; @@ -259,71 +222,58 @@ flex: 0 0 auto; border-radius: 10px; background: - linear-gradient(135deg, #16c8df 0 46%, transparent 46% 54%, #31d7f0 54% 100%), - linear-gradient(45deg, #0876d8, #16c8df); + linear-gradient(135deg, var(--ecom-accent-cyan-light) 0 46%, transparent 46% 54%, #31d7f0 54% 100%), + linear-gradient(45deg, #0876d8, var(--ecom-accent-cyan-light)); box-shadow: 0 10px 26px rgba(22, 200, 223, 0.34); content: ""; - transform: rotate(45deg); -} + transform: rotate(45deg)} .ecommerce-standalone__brand strong { - color: #f7fbff; -} + color: #f7fbff} .ecommerce-standalone__brand span, .ecommerce-standalone__credits, .ecommerce-standalone__user { - color: rgba(226, 242, 255, 0.62); -} + color: rgba(226, 242, 255, 0.62)} .ecommerce-standalone__account button { border-color: rgba(126, 235, 255, 0.22); - color: #f5fbff; - background: rgba(3, 35, 68, 0.5); -} + color: var(--ecom-text-on-dark); + background: rgba(3, 35, 68, 0.5)} .ecommerce-standalone__account button:hover { border-color: rgba(22, 200, 223, 0.66); - background: rgba(22, 200, 223, 0.18); -} + background: rgba(22, 200, 223, 0.18)} .ecommerce-auth-modal__panel { border-color: rgba(126, 235, 255, 0.24); - background: linear-gradient(180deg, rgba(6, 54, 94, 0.98), rgba(4, 35, 68, 0.98)); -} + background: linear-gradient(180deg, rgba(6, 54, 94, 0.98), rgba(4, 35, 68, 0.98))} .ecommerce-auth-modal__eyebrow { - color: #16c8df; -} + color: var(--ecom-accent-cyan-light)} .ecommerce-auth-modal input:focus { border-color: rgba(22, 200, 223, 0.7); - box-shadow: 0 0 0 3px rgba(22, 200, 223, 0.16); -} + box-shadow: 0 0 0 3px rgba(22, 200, 223, 0.16)} .ecommerce-auth-modal__submit { color: #021b2e; - background: linear-gradient(135deg, #16c8df, #18a7ff); -} + background: linear-gradient(135deg, var(--ecom-accent-cyan-light), #18a7ff)} -/* Standalone ecommerce: final white theme with #1ebddb accent. */ +/* Standalone ecommerce: final white theme with var(--ecom-accent-cyan) accent. */ .ecommerce-standalone-body { - background: #f8f9fa !important; -} + background: var(--ecom-bg-page)} .ecommerce-standalone { - color: #10202c !important; - background: #f8f9fa !important; -} + color: var(--ecom-text-primary); + background: var(--ecom-bg-page)} .ecommerce-standalone__topbar { - border-bottom-color: rgba(30, 189, 219, 0.16) !important; - background: #f8f9fa !important; -} + border-bottom-color: rgba(30, 189, 219, 0.16); + background: var(--ecom-bg-page)} .ecommerce-standalone__brand::before { - content: none !important; -} + content: none} .ecommerce-standalone__logo { position: relative; @@ -332,48 +282,41 @@ height: 36px; flex: 0 0 36px; overflow: hidden; - border-radius: 10px; -} + border-radius: 10px} .ecommerce-standalone__logo i { position: absolute; width: 22px; height: 22px; - border-radius: 8px; -} + border-radius: 8px} .ecommerce-standalone__logo i:nth-child(1) { left: 1px; top: 1px; - background: linear-gradient(135deg, #1f86df 0%, #1974c7 100%); -} + background: linear-gradient(135deg, #1f86df 0%, #1974c7 100%)} .ecommerce-standalone__logo i:nth-child(2) { right: 1px; top: 1px; - background: linear-gradient(135deg, #24c9ee 0%, #16a7d8 100%); -} + background: linear-gradient(135deg, #24c9ee 0%, #16a7d8 100%)} .ecommerce-standalone__logo i:nth-child(3) { left: 1px; bottom: 1px; - background: linear-gradient(135deg, #26c8e9 0%, #17addb 100%); -} + background: linear-gradient(135deg, #26c8e9 0%, #17addb 100%)} .ecommerce-standalone__logo i:nth-child(4) { right: 1px; bottom: 1px; - background: linear-gradient(135deg, #1778ca 0%, #116abd 100%); -} + background: linear-gradient(135deg, #1778ca 0%, #116abd 100%)} .ecommerce-standalone__logo::before { position: absolute; inset: 8px; z-index: 2; - background: #f8f9fa; + background: var(--ecom-bg-page); content: ""; - transform: rotate(45deg); -} + transform: rotate(45deg)} .ecommerce-standalone__logo::after { position: absolute; @@ -382,87 +325,72 @@ border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(16, 32, 44, 0.03); content: ""; - pointer-events: none; -} + pointer-events: none} .ecommerce-standalone__brand strong { - color: #10202c !important; -} + color: var(--ecom-text-primary)} .ecommerce-standalone__brand span, .ecommerce-standalone__credits, .ecommerce-standalone__user { - color: #6b7c88 !important; -} + color: #6b7c88} .ecommerce-standalone__account button { - border-color: rgba(30, 189, 219, 0.22) !important; - color: #10202c !important; - background: #fbfdfe !important; -} + border-color: rgba(30, 189, 219, 0.22); + color: var(--ecom-text-primary); + background: #fbfdfe} .ecommerce-standalone__account button:hover { - border-color: #1ebddb !important; - background: rgba(30, 189, 219, 0.1) !important; -} + border-color: var(--ecom-accent-cyan); + background: rgba(30, 189, 219, 0.1)} .ecommerce-auth-modal__panel { - border-color: rgba(30, 189, 219, 0.22) !important; - background: #fbfdfe !important; -} + border-color: rgba(30, 189, 219, 0.22); + background: #fbfdfe} .ecommerce-auth-modal__eyebrow { - color: #1ebddb !important; -} + color: var(--ecom-accent-cyan)} .ecommerce-auth-modal h2, .ecommerce-auth-modal label { - color: #10202c !important; -} + color: var(--ecom-text-primary)} .ecommerce-auth-modal input { - color: #10202c !important; - background: #f7fbfc !important; - border-color: rgba(30, 189, 219, 0.2) !important; -} + color: var(--ecom-text-primary); + background: #f7fbfc; + border-color: rgba(30, 189, 219, 0.2)} .ecommerce-auth-modal input:focus { - border-color: #1ebddb !important; - box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.14) !important; -} + border-color: var(--ecom-accent-cyan); + box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.14)} .ecommerce-auth-modal__submit { - color: #ffffff !important; - background: #1ebddb !important; -} + color: var(--ecom-bg-white); + background: var(--ecom-accent-cyan)} /* Auth modal: dark OmniAI commerce sign-in/register experience. */ .ecommerce-auth-modal { - place-items: start center !important; + place-items: start center; overflow: auto; - padding: clamp(28px, 7vh, 58px) 18px 34px !important; -} + padding: clamp(28px, 7vh, 58px) 18px 34px} .ecommerce-auth-modal__scrim { - background: rgba(12, 15, 17, 0.78) !important; - backdrop-filter: blur(8px); -} + background: rgba(12, 15, 17, 0.78); + backdrop-filter: blur(8px)} .ecommerce-auth-modal__panel { - width: min(560px, 100%) !important; - padding: 28px clamp(24px, 5vw, 48px) 30px !important; - border-color: rgba(255, 255, 255, 0.08) !important; - border-radius: 0 !important; - color: #f6fbff !important; - background: linear-gradient(180deg, #171b1d 0%, #15191b 100%) !important; - box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42) !important; -} + width: min(560px, 100%); + padding: 28px clamp(24px, 5vw, 48px) 30px; + border-color: rgba(255, 255, 255, 0.08); + border-radius: 0; + color: #f6fbff; + background: linear-gradient(180deg, #171b1d 0%, #15191b 100%); + box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42)} .ecommerce-auth-modal__close { - border-color: rgba(255, 255, 255, 0.1) !important; - color: #aab5bb !important; - background: rgba(255, 255, 255, 0.04) !important; -} + border-color: rgba(255, 255, 255, 0.1); + color: #aab5bb; + background: rgba(255, 255, 255, 0.04)} .ecommerce-auth-modal__logo { position: relative; @@ -474,45 +402,38 @@ overflow: visible; border-radius: 0; background: transparent; - box-shadow: none; -} + box-shadow: none} .ecommerce-auth-modal__logo img { display: block; width: 58px; height: 58px; - object-fit: contain; -} + object-fit: contain} .ecommerce-auth-modal__logo i, .ecommerce-auth-modal__logo::before { - content: none !important; - display: none !important; -} + content: none; + display: none} .ecommerce-auth-modal__logo i:nth-child(1) { left: 1px; top: 1px; - background: linear-gradient(135deg, #2289e6, #176fc2); -} + background: linear-gradient(135deg, #2289e6, #176fc2)} .ecommerce-auth-modal__logo i:nth-child(2) { right: 1px; top: 1px; - background: linear-gradient(135deg, #29d2ee, #18a9d8); -} + background: linear-gradient(135deg, #29d2ee, #18a9d8)} .ecommerce-auth-modal__logo i:nth-child(3) { left: 1px; bottom: 1px; - background: linear-gradient(135deg, #2ed1ea, #17acd8); -} + background: linear-gradient(135deg, #2ed1ea, #17acd8)} .ecommerce-auth-modal__logo i:nth-child(4) { right: 1px; bottom: 1px; - background: linear-gradient(135deg, #1879ca, #1268b9); -} + background: linear-gradient(135deg, #1879ca, #1268b9)} .ecommerce-auth-modal__logo::before { position: absolute; @@ -520,43 +441,37 @@ z-index: 2; background: #171b1d; content: ""; - transform: rotate(45deg); -} + transform: rotate(45deg)} .ecommerce-auth-modal h2 { - margin: 0 !important; - color: #f7fbff !important; - font-size: 30px !important; + margin: 0; + color: #f7fbff; + font-size: 30px; font-weight: 900; line-height: 1.15; - text-align: center; -} + text-align: center} .ecommerce-auth-modal__subtitle { margin: 8px 0 24px; color: #95a3aa; font-size: 15px; - text-align: center; -} + text-align: center} .ecommerce-auth-modal__tabs, .ecommerce-auth-modal__methods { display: grid; - gap: 8px; -} + gap: 8px} .ecommerce-auth-modal__tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 22px; padding: 4px; border: 1px solid rgba(255, 255, 255, 0.1); - border-radius: 10px; -} + border-radius: 10px} .ecommerce-auth-modal__methods { grid-template-columns: repeat(3, minmax(0, 1fr)); - margin-bottom: 18px; -} + margin-bottom: 18px} .ecommerce-auth-modal__tabs button, .ecommerce-auth-modal__methods button { @@ -567,71 +482,60 @@ background: transparent; font-size: 15px; font-weight: 900; - cursor: pointer; -} + cursor: pointer} .ecommerce-auth-modal__methods button { border-color: rgba(255, 255, 255, 0.1); - background: rgba(255, 255, 255, 0.025); -} + background: rgba(255, 255, 255, 0.025)} .ecommerce-auth-modal__tabs button.is-active, .ecommerce-auth-modal__methods button.is-active { border-color: rgba(30, 189, 219, 0.74); color: #0df7a8; - background: rgba(15, 235, 154, 0.18); -} + background: rgba(15, 235, 154, 0.18)} .ecommerce-auth-field { - display: grid !important; - gap: 8px !important; - margin-top: 14px !important; - color: #d9e5e9 !important; - font-size: 14px !important; - font-weight: 900; -} + display: grid; + gap: 8px; + margin-top: 14px; + color: #d9e5e9; + font-size: 14px; + font-weight: 900} .ecommerce-auth-field > span { display: inline-flex; align-items: center; - gap: 7px; -} + gap: 7px} .ecommerce-auth-modal input, .ecommerce-auth-phone-row, .ecommerce-auth-code-row { - min-height: 50px; -} + min-height: 50px} .ecommerce-auth-modal input { width: 100%; - border: 1px solid rgba(255, 255, 255, 0.1) !important; - border-radius: 10px !important; - padding: 0 14px !important; - color: #eaf6f8 !important; - background: rgba(255, 255, 255, 0.035) !important; - font-size: 16px; -} + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 10px; + padding: 0 14px; + color: #eaf6f8; + background: rgba(255, 255, 255, 0.035); + font-size: 16px} .ecommerce-auth-modal input::placeholder { - color: #82919a; -} + color: #82919a} .ecommerce-auth-modal input:focus { - border-color: #1ebddb !important; - box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.2) !important; -} + border-color: var(--ecom-accent-cyan); + box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.2)} .ecommerce-auth-phone-row, .ecommerce-auth-code-row { display: grid; align-items: center; - gap: 12px; -} + gap: 12px} .ecommerce-auth-phone-row { - grid-template-columns: 58px minmax(0, 1fr); -} + grid-template-columns: 58px minmax(0, 1fr)} .ecommerce-auth-phone-row b { display: grid; @@ -640,16 +544,13 @@ border-right: 1px solid rgba(255, 255, 255, 0.08); color: #dce8ec; background: rgba(255, 255, 255, 0.035); - border-radius: 10px 0 0 10px; -} + border-radius: 10px 0 0 10px} .ecommerce-auth-phone-row input { - border-radius: 0 10px 10px 0 !important; -} + border-radius: 0 10px 10px 0} .ecommerce-auth-code-row { - grid-template-columns: minmax(0, 1fr) 112px; -} + grid-template-columns: minmax(0, 1fr) 112px} .ecommerce-auth-code-row button { min-height: 50px; @@ -657,8 +558,7 @@ border-radius: 10px; color: #8f9da5; background: rgba(255, 255, 255, 0.035); - font-weight: 900; -} + font-weight: 900} .ecommerce-auth-modal__forgot { display: block; @@ -667,37 +567,32 @@ color: #0df7a8; background: transparent; font-weight: 900; - cursor: pointer; -} + cursor: pointer} .ecommerce-auth-modal__error { - margin: 10px 0 0 !important; - color: #ff6b74 !important; -} + margin: 10px 0 0; + color: #ff6b74} .ecommerce-auth-modal__submit { - min-height: 52px !important; - margin-top: 18px !important; - border: 0 !important; - border-radius: 10px !important; - color: #061817 !important; - background: linear-gradient(135deg, #0df7a8, #00f089) !important; + min-height: 52px; + margin-top: 18px; + border: 0; + border-radius: 10px; + color: #061817; + background: linear-gradient(135deg, #0df7a8, #00f089); font-size: 17px; - font-weight: 950; -} + font-weight: 950} .ecommerce-auth-modal__agreement { margin: 16px 0 20px; color: #83919a; font-size: 12px; - text-align: center; -} + text-align: center} .ecommerce-auth-modal__agreement a { color: #0df7a8; font-weight: 900; - text-decoration: none; -} + text-decoration: none} .ecommerce-auth-modal__divider { display: grid; @@ -705,15 +600,13 @@ align-items: center; gap: 12px; color: #737f86; - font-size: 13px; -} + font-size: 13px} .ecommerce-auth-modal__divider::before, .ecommerce-auth-modal__divider::after { height: 1px; background: rgba(255, 255, 255, 0.08); - content: ""; -} + content: ""} .ecommerce-auth-modal__mobile-alt { display: grid; @@ -726,150 +619,125 @@ color: #d2dde2; background: rgba(255, 255, 255, 0.035); font-size: 20px; - cursor: pointer; -} + cursor: pointer} @media (max-width: 620px) { .ecommerce-auth-modal__panel { - padding: 24px 18px 28px !important; - } + padding: 24px 18px 28px} .ecommerce-auth-modal__methods, .ecommerce-auth-code-row { - grid-template-columns: minmax(0, 1fr); - } + grid-template-columns: minmax(0, 1fr)} } /* Auth modal localized to the ecommerce blue/white UI. */ .ecommerce-auth-modal { min-height: 100dvh; - place-items: center !important; + place-items: center; overflow: auto; - padding: clamp(18px, 4vh, 42px) 18px !important; -} + padding: clamp(18px, 4vh, 42px) 18px} .ecommerce-auth-modal__scrim { background: radial-gradient(circle at 50% 42%, rgba(29, 190, 219, 0.18), transparent 34rem), - rgba(248, 249, 250, 0.72) !important; - animation: ecommerce-auth-scrim-in 180ms ease both; -} + rgba(248, 249, 250, 0.72); + animation: ecommerce-auth-scrim-in 180ms ease both} .ecommerce-auth-modal__panel { - border-color: rgba(16, 115, 204, 0.14) !important; - color: #10202c !important; - background: #feffff !important; - box-shadow: 0 28px 90px rgba(16, 115, 204, 0.16), 0 12px 34px rgba(20, 80, 100, 0.08) !important; - animation: ecommerce-auth-panel-in 220ms cubic-bezier(0.22, 1, 0.36, 1) both; -} + border-color: rgba(16, 115, 204, 0.14); + color: var(--ecom-text-primary); + background: var(--ecom-bg-near-white); + box-shadow: 0 28px 90px rgba(16, 115, 204, 0.16), 0 12px 34px rgba(20, 80, 100, 0.08); + animation: ecommerce-auth-panel-in 220ms cubic-bezier(0.22, 1, 0.36, 1) both} .ecommerce-auth-modal__close, .ecommerce-auth-modal__mobile-alt, .ecommerce-auth-code-row button { - border-color: rgba(16, 115, 204, 0.14) !important; - color: #566b78 !important; - background: #f8fbfc !important; -} + border-color: rgba(16, 115, 204, 0.14); + color: #566b78; + background: var(--ecom-bg-cool)} .ecommerce-auth-modal__logo::before { - background: #feffff !important; -} + background: var(--ecom-bg-near-white)} .ecommerce-auth-modal h2 { - color: #10202c !important; -} + color: var(--ecom-text-primary)} .ecommerce-auth-modal__subtitle, .ecommerce-auth-modal__agreement, .ecommerce-auth-modal__divider { - color: #6b7c88 !important; -} + color: #6b7c88} .ecommerce-auth-modal__tabs { - border-color: rgba(16, 115, 204, 0.14) !important; - background: #f3f8fa; -} + border-color: rgba(16, 115, 204, 0.14); + background: var(--ecom-bg-cool)} .ecommerce-auth-modal__tabs button, .ecommerce-auth-modal__methods button { - color: #425765 !important; -} + color: #425765} .ecommerce-auth-modal__methods button { - border-color: rgba(16, 115, 204, 0.14) !important; - background: #feffff !important; -} + border-color: rgba(16, 115, 204, 0.14); + background: var(--ecom-bg-near-white)} .ecommerce-auth-modal__tabs button.is-active, .ecommerce-auth-modal__methods button.is-active { - border-color: rgba(29, 190, 219, 0.66) !important; - color: #1073cc !important; - background: rgba(29, 190, 219, 0.12) !important; - box-shadow: inset 0 0 0 1px rgba(16, 115, 204, 0.08); -} + border-color: rgba(29, 190, 219, 0.66); + color: var(--ecom-primary); + background: rgba(29, 190, 219, 0.12); + box-shadow: inset 0 0 0 1px rgba(16, 115, 204, 0.08)} .ecommerce-auth-field { - color: #10202c !important; -} + color: var(--ecom-text-primary)} .ecommerce-auth-modal input { - border-color: rgba(16, 115, 204, 0.14) !important; - color: #10202c !important; - background: #f8fbfc !important; -} + border-color: rgba(16, 115, 204, 0.14); + color: var(--ecom-text-primary); + background: var(--ecom-bg-cool)} .ecommerce-auth-modal input::placeholder { - color: #8da0ab !important; -} + color: var(--ecom-text-placeholder)} .ecommerce-auth-modal input:focus { - border-color: #1dbedb !important; - box-shadow: 0 0 0 3px rgba(29, 190, 219, 0.16) !important; -} + border-color: var(--ecom-accent-cyan); + box-shadow: 0 0 0 3px rgba(29, 190, 219, 0.16)} .ecommerce-auth-phone-row b { - border-right-color: rgba(16, 115, 204, 0.14) !important; - color: #1073cc !important; - background: #f3f8fa !important; -} + border-right-color: rgba(16, 115, 204, 0.14); + color: var(--ecom-primary); + background: var(--ecom-bg-cool)} .ecommerce-auth-modal__forgot, .ecommerce-auth-modal__agreement a { - color: #1073cc !important; -} + color: var(--ecom-primary)} .ecommerce-auth-modal__submit { - color: #ffffff !important; - background: linear-gradient(135deg, #1073cc, #1dbedb) !important; - box-shadow: 0 16px 34px rgba(29, 190, 219, 0.24); -} + color: var(--ecom-bg-white); + background: linear-gradient(135deg, var(--ecom-primary), var(--ecom-accent-cyan)); + box-shadow: 0 16px 34px rgba(29, 190, 219, 0.24)} .ecommerce-auth-modal__divider::before, .ecommerce-auth-modal__divider::after { - background: rgba(16, 115, 204, 0.12) !important; -} + background: rgba(16, 115, 204, 0.12)} @keyframes ecommerce-auth-scrim-in { - from { opacity: 0; } - to { opacity: 1; } + from { opacity: 0} + to { opacity: 1} } @keyframes ecommerce-auth-panel-in { from { opacity: 0; - transform: translateY(14px) scale(0.985); - } + transform: translateY(14px) scale(0.985)} to { opacity: 1; - transform: translateY(0) scale(1); - } + transform: translateY(0) scale(1)} } @media (prefers-reduced-motion: reduce) { .ecommerce-auth-modal__scrim, .ecommerce-auth-modal__panel { - animation: none !important; - } + animation: none} } /* Local auth UI typography and rounder modal controls. */ @@ -879,22 +747,18 @@ .ecommerce-auth-modal, .ecommerce-auth-modal button, .ecommerce-auth-modal input { - font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif !important; -} + font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif} .ecommerce-auth-modal { - color: #10202c; - font-weight: 500; -} + color: var(--ecom-text-primary); + font-weight: 500} .ecommerce-auth-modal__panel { - border-radius: 30px !important; -} + border-radius: 30px} .ecommerce-auth-modal h2 { - color: #10202c !important; - font-weight: 900 !important; -} + color: var(--ecom-text-primary); + font-weight: 900} .ecommerce-auth-modal__eyebrow, .ecommerce-auth-modal__subtitle, @@ -902,8 +766,7 @@ .ecommerce-auth-modal__divider, .ecommerce-auth-field, .ecommerce-auth-modal input { - font-weight: 500 !important; -} + font-weight: 500} .ecommerce-auth-modal__tabs button, .ecommerce-auth-modal__methods button, @@ -912,8 +775,7 @@ .ecommerce-auth-modal__submit, .ecommerce-auth-modal__switch, .ecommerce-auth-modal__mobile-alt { - font-weight: 600 !important; -} + font-weight: 600} .ecommerce-auth-modal__close, .ecommerce-auth-modal__tabs, @@ -923,41 +785,35 @@ .ecommerce-auth-modal input, .ecommerce-auth-code-row button, .ecommerce-auth-modal__submit { - border-radius: 16px !important; -} + border-radius: 16px} .ecommerce-auth-phone-row b { - font-weight: 600 !important; - border-radius: 16px 0 0 16px !important; -} + font-weight: 600; + border-radius: 16px 0 0 16px} .ecommerce-auth-phone-row input { - border-radius: 0 16px 16px 0 !important; -} + border-radius: 0 16px 16px 0} /* Logged-in profile menu and standalone profile page. */ .ecommerce-standalone__brand { border: 0; color: inherit; background: transparent; - cursor: pointer; -} + cursor: pointer} .ecommerce-profile-menu { position: relative; display: flex; align-items: center; - gap: 12px; -} + gap: 12px} .ecommerce-profile-menu__trigger { - min-height: 42px !important; - padding: 0 14px 0 6px !important; - border-radius: 16px !important; - color: #10202c !important; - background: #feffff !important; - box-shadow: 0 10px 28px rgba(16, 115, 204, 0.08); -} + min-height: 42px; + padding: 0 14px 0 6px; + border-radius: 16px; + color: var(--ecom-text-primary); + background: var(--ecom-bg-near-white); + box-shadow: 0 10px 28px rgba(16, 115, 204, 0.08)} .local-user-avatar { display: inline-grid; @@ -966,32 +822,27 @@ overflow: hidden; border: 2px solid rgba(30, 189, 219, 0.62); border-radius: 14px; - color: #fff; - background: linear-gradient(135deg, #1073cc, #1dbedb); - font-weight: 800; -} + color: var(--ecom-bg-white); + background: linear-gradient(135deg, var(--ecom-primary), var(--ecom-accent-cyan)); + font-weight: 800} .local-user-avatar img { width: 100%; height: 100%; - object-fit: cover; -} + object-fit: cover} .local-user-avatar--sm { width: 34px; - height: 34px; -} + height: 34px} .local-user-avatar--md { width: 52px; - height: 52px; -} + height: 52px} .local-user-avatar--lg { width: 96px; height: 96px; - border-radius: 28px; -} + border-radius: 28px} .ecommerce-profile-popover { position: absolute; @@ -1002,71 +853,61 @@ padding: 20px; border: 1px solid rgba(16, 115, 204, 0.14); border-radius: 24px; - color: #10202c; + color: var(--ecom-text-primary); background: rgba(254, 255, 255, 0.98); box-shadow: 0 28px 80px rgba(16, 115, 204, 0.18); - animation: ecommerce-auth-panel-in 180ms cubic-bezier(0.22, 1, 0.36, 1) both; -} + animation: ecommerce-auth-panel-in 180ms cubic-bezier(0.22, 1, 0.36, 1) both} .ecommerce-profile-popover__head { display: flex; align-items: center; gap: 14px; padding-bottom: 16px; - border-bottom: 1px solid rgba(16, 115, 204, 0.12); -} + border-bottom: 1px solid rgba(16, 115, 204, 0.12)} .ecommerce-profile-popover__head strong { display: block; - color: #10202c; + color: var(--ecom-text-primary); font-size: 18px; - font-weight: 900; -} + font-weight: 900} .ecommerce-profile-popover__head span { display: block; margin-top: 2px; color: #526675; - font-weight: 500; -} + font-weight: 500} .ecommerce-profile-popover__stats { display: grid; gap: 9px; margin: 16px 0; padding-bottom: 16px; - border-bottom: 1px solid rgba(16, 115, 204, 0.12); -} + border-bottom: 1px solid rgba(16, 115, 204, 0.12)} .ecommerce-profile-popover__stats div { display: flex; align-items: center; justify-content: space-between; - gap: 12px; -} + gap: 12px} .ecommerce-profile-popover__stats dt, .ecommerce-profile-popover__stats dd { - margin: 0; -} + margin: 0} .ecommerce-profile-popover__stats dt { display: inline-flex; align-items: center; gap: 8px; color: #526675; - font-weight: 500; -} + font-weight: 500} .ecommerce-profile-popover__stats dd { - color: #10202c; - font-weight: 700; -} + color: var(--ecom-text-primary); + font-weight: 700} .ecommerce-profile-popover__actions { display: grid; - gap: 12px; -} + gap: 12px} .ecommerce-profile-popover__actions button, .local-profile-card button, @@ -1078,32 +919,28 @@ min-height: 42px; border: 1px solid rgba(16, 115, 204, 0.14); border-radius: 15px; - color: #10202c; - background: #f8fbfc; + color: var(--ecom-text-primary); + background: var(--ecom-bg-cool); font-weight: 600; - cursor: pointer; -} + cursor: pointer} .ecommerce-profile-popover__actions button.is-primary, .local-profile-card__primary { - border-color: rgba(29, 190, 219, 0.45) !important; - color: #fff !important; - background: linear-gradient(135deg, #1073cc, #1dbedb) !important; -} + border-color: rgba(29, 190, 219, 0.45); + color: var(--ecom-bg-white); + background: linear-gradient(135deg, var(--ecom-primary), var(--ecom-accent-cyan))} .ecommerce-profile-popover__actions button.is-danger, .local-profile-card__danger { - color: #d04444 !important; -} + color: #d04444} .local-profile-page { height: 100%; overflow: auto; - color: #10202c; + color: var(--ecom-text-primary); background: radial-gradient(42rem 18rem at 48% 7%, rgba(29, 190, 219, 0.18), transparent 72%), - linear-gradient(180deg, #f8f9fa 0%, #eef9fc 46%, #f8f9fa 100%); -} + linear-gradient(180deg, var(--ecom-bg-page) 0%, #eef9fc 46%, var(--ecom-bg-page) 100%)} .local-profile-page__hero { position: relative; @@ -1111,24 +948,21 @@ background: linear-gradient(180deg, rgba(16, 115, 204, 0.2), rgba(248, 249, 250, 0.92)), radial-gradient(36rem 15rem at 34% 8%, rgba(16, 115, 204, 0.34), transparent 70%), - radial-gradient(32rem 14rem at 66% 18%, rgba(29, 190, 219, 0.28), transparent 72%); -} + radial-gradient(32rem 14rem at 66% 18%, rgba(29, 190, 219, 0.28), transparent 72%)} .local-profile-page__back { position: absolute; top: 24px; right: 32px; background: rgba(254, 255, 255, 0.84); - backdrop-filter: blur(14px); -} + backdrop-filter: blur(14px)} .local-profile-page__body { display: grid; grid-template-columns: 342px minmax(0, 1fr); gap: 30px; width: min(1380px, calc(100% - 56px)); - margin: -72px auto 48px; -} + margin: -72px auto 48px} .local-profile-card, .local-profile-tabs, @@ -1136,61 +970,52 @@ border: 1px solid rgba(16, 115, 204, 0.12); border-radius: 24px; background: rgba(254, 255, 255, 0.94); - box-shadow: 0 24px 70px rgba(16, 115, 204, 0.1); -} + box-shadow: 0 24px 70px rgba(16, 115, 204, 0.1)} .local-profile-card { position: sticky; top: 84px; align-self: start; - padding: 24px; -} + padding: 24px} .local-profile-card__head { display: grid; justify-items: center; gap: 10px; - text-align: center; -} + text-align: center} .local-profile-card__avatar-wrap { - position: relative; -} + position: relative} .local-profile-card__avatar-wrap > .anticon { position: absolute; right: -2px; bottom: 6px; - color: #1dbedb; - background: #feffff; + color: var(--ecom-accent-cyan); + background: var(--ecom-bg-near-white); border-radius: 999px; - font-size: 20px; -} + font-size: 20px} .local-profile-card__head strong { font-size: 24px; - font-weight: 900; -} + font-weight: 900} .local-profile-card__uid { width: 100%; padding: 10px 12px; border: 1px solid rgba(16, 115, 204, 0.12); border-radius: 999px; - color: #526675; -} + color: #526675} .local-profile-card__stats, .local-profile-card__credits, .local-profile-card__meta { display: grid; gap: 10px; - margin-top: 18px; -} + margin-top: 18px} .local-profile-card__stats { - grid-template-columns: repeat(3, minmax(0, 1fr)); -} + grid-template-columns: repeat(3, minmax(0, 1fr))} .local-profile-card__stats span, .local-profile-card__credits span, @@ -1200,107 +1025,90 @@ padding: 14px; border: 1px solid rgba(16, 115, 204, 0.12); border-radius: 16px; - background: #f8fbfc; -} + background: var(--ecom-bg-cool)} .local-profile-card strong { - color: #10202c; -} + color: var(--ecom-text-primary)} .local-profile-card em { color: #637889; font-style: normal; - font-weight: 500; -} + font-weight: 500} .local-profile-card__credits { - grid-template-columns: 1fr 1fr; -} + grid-template-columns: 1fr 1fr} .local-profile-card__credits span:first-child { grid-column: span 2; - color: #1073cc; - background: rgba(29, 190, 219, 0.1); -} + color: var(--ecom-primary); + background: rgba(29, 190, 219, 0.1)} .local-profile-card__credits strong, .local-profile-card__meta strong { - font-size: 18px; -} + font-size: 18px} .local-profile-card__primary, .local-profile-card__secondary, .local-profile-card__danger { width: 100%; - margin-top: 12px; -} + margin-top: 12px} .local-profile-main { display: grid; gap: 18px; - min-width: 0; -} + min-width: 0} .local-profile-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; - padding: 8px; -} + padding: 8px} .local-profile-tabs button { min-height: 44px; border: 1px solid rgba(16, 115, 204, 0.12); border-radius: 16px; color: #526675; - background: #f8fbfc; - font-weight: 700; -} + background: var(--ecom-bg-cool); + font-weight: 700} .local-profile-tabs button.is-active { border-color: rgba(29, 190, 219, 0.5); - color: #1073cc; - background: rgba(29, 190, 219, 0.12); -} + color: var(--ecom-primary); + background: rgba(29, 190, 219, 0.12)} .local-profile-works { - padding: 24px; -} + padding: 24px} .local-profile-works header { display: flex; align-items: center; justify-content: space-between; gap: 16px; - margin-bottom: 18px; -} + margin-bottom: 18px} .local-profile-works header strong { display: block; font-size: 22px; - font-weight: 900; -} + font-weight: 900} .local-profile-works header span, .local-profile-works header em { color: #637889; font-style: normal; - font-weight: 500; -} + font-weight: 500} .local-profile-works header em { padding: 7px 14px; border: 1px solid rgba(29, 190, 219, 0.32); border-radius: 999px; - color: #1073cc; - background: rgba(29, 190, 219, 0.08); -} + color: var(--ecom-primary); + background: rgba(29, 190, 219, 0.08)} .local-profile-work-grid { display: grid; grid-template-columns: repeat(3, minmax(220px, 1fr)); - gap: 14px; -} + gap: 14px} .local-profile-work-card { display: grid; @@ -1310,15 +1118,13 @@ padding: 14px; border: 1px solid rgba(16, 115, 204, 0.12); border-radius: 18px; - background: #f8fbfc; -} + background: var(--ecom-bg-cool)} .local-profile-work-card img { width: 106px; height: 106px; border-radius: 14px; - object-fit: cover; -} + object-fit: cover} .local-profile-work-card span { display: inline-flex; @@ -1326,20 +1132,18 @@ margin-bottom: 5px; padding: 3px 9px; border-radius: 999px; - color: #1073cc; + color: var(--ecom-primary); background: rgba(29, 190, 219, 0.12); font-size: 12px; - font-weight: 700; -} + font-weight: 700} .local-profile-work-card strong { display: block; overflow: hidden; - color: #10202c; + color: var(--ecom-text-primary); font-weight: 900; text-overflow: ellipsis; - white-space: nowrap; -} + white-space: nowrap} .local-profile-work-card p { display: -webkit-box; @@ -1348,18 +1152,15 @@ color: #526675; font-weight: 500; -webkit-box-orient: vertical; - -webkit-line-clamp: 2; -} + -webkit-line-clamp: 2} .local-profile-work-card em { color: #7b8e9a; font-style: normal; - font-weight: 500; -} + font-weight: 500} .local-profile-work-grid--empty { - display: block; -} + display: block} .local-profile-empty { display: grid; @@ -1371,443 +1172,385 @@ border-radius: 18px; color: #6c7d88; text-align: center; - background: #f8fbfc; -} + background: var(--ecom-bg-cool)} .local-profile-empty strong { - color: #10202c; - font-size: 15px; -} + color: var(--ecom-text-primary); + font-size: 15px} .local-profile-empty span { max-width: 360px; font-size: 13px; - line-height: 1.6; -} + line-height: 1.6} @media (max-width: 980px) { .local-profile-page__body { - grid-template-columns: minmax(0, 1fr); - } + grid-template-columns: minmax(0, 1fr)} .local-profile-card { - position: static; - } + position: static} .local-profile-work-grid { - grid-template-columns: repeat(2, minmax(0, 1fr)); - } + grid-template-columns: repeat(2, minmax(0, 1fr))} } @media (max-width: 640px) { .ecommerce-profile-popover { right: -8px; - width: min(336px, calc(100vw - 24px)); - } + width: min(336px, calc(100vw - 24px))} .local-profile-page__body { - width: calc(100% - 24px); - } + width: calc(100% - 24px)} .local-profile-tabs, .local-profile-work-grid { - grid-template-columns: minmax(0, 1fr); - } + grid-template-columns: minmax(0, 1fr)} } /* Final account popover corrections: independent modal, compact metric rows. */ .ecommerce-standalone .ecommerce-profile-menu { - position: static !important; -} + position: static} .ecommerce-standalone .ecommerce-profile-menu__trigger { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 9px !important; - min-height: 44px !important; - padding: 0 15px 0 7px !important; - border-radius: 16px !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + gap: 9px; + min-height: 44px; + padding: 0 15px 0 7px; + border-radius: 16px} .ecommerce-standalone .ecommerce-standalone__credits { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - min-height: 40px !important; - padding: 0 14px !important; - border: 1px solid rgba(30, 189, 219, 0.14) !important; - border-radius: 15px !important; - color: #10202c !important; - background: #f8f9fa !important; - box-shadow: 0 10px 26px rgba(16, 115, 204, 0.06) !important; - font-size: 13px !important; - font-weight: 600 !important; - line-height: 1 !important; - white-space: nowrap !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + min-height: 40px; + padding: 0 14px; + border: 1px solid rgba(30, 189, 219, 0.14); + border-radius: 15px; + color: var(--ecom-text-primary); + background: var(--ecom-bg-page); + box-shadow: 0 10px 26px rgba(16, 115, 204, 0.06); + font-size: 13px; + font-weight: 600; + line-height: 1; + white-space: nowrap} .ecommerce-standalone .ecommerce-profile-popover__backdrop { - position: fixed !important; - inset: 0 !important; - z-index: 118 !important; - min-height: 0 !important; - padding: 0 !important; - border: 0 !important; - border-radius: 0 !important; - background: transparent !important; - box-shadow: none !important; -} + position: fixed; + inset: 0; + z-index: 118; + min-height: 0; + padding: 0; + border: 0; + border-radius: 0; + background: transparent; + box-shadow: none} .ecommerce-standalone .ecommerce-profile-popover { - position: fixed !important; - top: 62px !important; - right: 22px !important; - z-index: 130 !important; - display: block !important; - width: min(338px, calc(100vw - 28px)) !important; + position: fixed; + top: 62px; + right: 22px; + z-index: 130; + display: block; + width: min(338px, calc(100vw - 28px)); max-height: calc(100vh - 82px); overflow: auto; - padding: 20px !important; - border: 1px solid rgba(16, 115, 204, 0.16) !important; - border-radius: 20px !important; - color: #10202c !important; - background: rgba(254, 255, 255, 0.98) !important; - box-shadow: 0 28px 80px rgba(16, 115, 204, 0.18) !important; -} + padding: 20px; + border: 1px solid rgba(16, 115, 204, 0.16); + border-radius: 20px; + color: var(--ecom-text-primary); + background: rgba(254, 255, 255, 0.98); + box-shadow: 0 28px 80px rgba(16, 115, 204, 0.18)} .ecommerce-standalone .ecommerce-profile-popover__stats { - display: grid !important; - grid-template-columns: minmax(0, 1fr) !important; - gap: 10px !important; - margin: 16px 0 !important; - padding: 0 0 16px !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: 10px; + margin: 16px 0; + padding: 0 0 16px} .ecommerce-standalone .ecommerce-profile-popover__stats div { - display: flex !important; - flex-direction: row !important; - align-items: center !important; - justify-content: space-between !important; - gap: 16px !important; - min-height: 24px !important; -} + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + gap: 16px; + min-height: 24px} .ecommerce-standalone .ecommerce-profile-popover__stats dt, .ecommerce-standalone .ecommerce-profile-popover__stats dd { - display: inline-flex !important; - align-items: center !important; - margin: 0 !important; - white-space: nowrap !important; -} + display: inline-flex; + align-items: center; + margin: 0; + white-space: nowrap} .ecommerce-standalone .ecommerce-profile-popover__stats dt { - gap: 7px !important; - min-width: 72px !important; -} + gap: 7px; + min-width: 72px} .ecommerce-standalone .ecommerce-profile-popover__stats dd { - justify-content: flex-end !important; - flex: 1 1 auto !important; - text-align: right !important; - font-weight: 800 !important; -} + justify-content: flex-end; + flex: 1 1 auto; + text-align: right; + font-weight: 800} .ecommerce-standalone .ecommerce-profile-popover__actions { - display: grid !important; - grid-template-columns: minmax(0, 1fr) !important; - gap: 11px !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: 11px} .ecommerce-standalone .ecommerce-profile-popover__actions button { - width: 100% !important; - min-height: 40px !important; - padding: 0 14px !important; -} + width: 100%; + min-height: 40px; + padding: 0 14px} /* Profile page tabs should be a compact segmented control, not tall cards. */ .ecommerce-standalone .local-profile-main { - align-content: start !important; -} + align-content: start} .ecommerce-standalone .local-profile-tabs { - display: grid !important; - grid-template-columns: repeat(4, minmax(0, 1fr)) !important; - align-items: center !important; - gap: 8px !important; - height: auto !important; - min-height: 60px !important; - padding: 8px !important; - border-radius: 18px !important; - background: rgba(254, 255, 255, 0.94) !important; -} + display: grid; + grid-template-columns: repeat(4, minmax(0, 1fr)); + align-items: center; + gap: 8px; + height: auto; + min-height: 60px; + padding: 8px; + border-radius: 18px; + background: rgba(254, 255, 255, 0.94)} .ecommerce-standalone .local-profile-tabs button { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - width: 100% !important; - height: 44px !important; - min-height: 44px !important; - padding: 0 14px !important; - border-radius: 13px !important; - color: #526675 !important; - line-height: 1 !important; - white-space: nowrap !important; - background: #f8fbfc !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + width: 100%; + height: 44px; + min-height: 44px; + padding: 0 14px; + border-radius: 13px; + color: #526675; + line-height: 1; + white-space: nowrap; + background: var(--ecom-bg-cool)} .ecommerce-standalone .local-profile-tabs button.is-active { - color: #1073cc !important; - background: rgba(29, 190, 219, 0.12) !important; -} + color: var(--ecom-primary); + background: rgba(29, 190, 219, 0.12)} /* Keep the profile dashboard evenly inset on both sides. */ .ecommerce-standalone .local-profile-page { - overflow-x: hidden !important; -} + overflow-x: hidden} .ecommerce-standalone .local-profile-page__body { - box-sizing: border-box !important; - grid-template-columns: minmax(280px, 342px) minmax(0, 1fr) !important; - width: 100% !important; - max-width: 1380px !important; - padding: 0 clamp(24px, 4vw, 56px) !important; - margin-right: auto !important; - margin-left: auto !important; -} + box-sizing: border-box; + grid-template-columns: minmax(280px, 342px) minmax(0, 1fr); + width: 100%; + max-width: 1380px; + padding: 0 clamp(24px, 4vw, 56px); + margin-right: auto; + margin-left: auto} .ecommerce-standalone .local-profile-main, .ecommerce-standalone .local-profile-tabs, .ecommerce-standalone .local-profile-works { - box-sizing: border-box !important; - min-width: 0 !important; - max-width: 100% !important; -} + box-sizing: border-box; + min-width: 0; + max-width: 100%} .ecommerce-standalone .local-profile-tabs { - overflow: hidden !important; -} + overflow: hidden} .ecommerce-standalone .local-profile-page__back { - right: clamp(24px, 4vw, 56px) !important; -} + right: clamp(24px, 4vw, 56px)} /* Final ecommerce header, inline uploads, and compact setting buttons. */ .ecommerce-standalone .ecommerce-standalone__brand { - gap: 10px !important; -} + gap: 10px} .ecommerce-standalone .ecommerce-standalone__brand strong { - font-weight: 900 !important; - letter-spacing: 0 !important; -} + font-weight: 900; + letter-spacing: 0} .ecommerce-standalone .ecommerce-standalone__logo { - position: relative !important; - width: 40px !important; - height: 40px !important; - flex-basis: 40px !important; - border-radius: 8px !important; - background: #101820 !important; - box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04) !important; -} + position: relative; + width: 40px; + height: 40px; + flex-basis: 40px; + border-radius: 8px; + background: #101820; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04)} .ecommerce-standalone .ecommerce-standalone__logo i { - position: absolute !important; - width: 25px !important; - height: 25px !important; - border-radius: 7px !important; - transform: rotate(45deg) !important; -} + position: absolute; + width: 25px; + height: 25px; + border-radius: 7px; + transform: rotate(45deg)} .ecommerce-standalone .ecommerce-standalone__logo i:nth-child(1) { - left: 3px !important; - top: 3px !important; - background: linear-gradient(135deg, #1c86df, #126dc4) !important; -} + left: 3px; + top: 3px; + background: linear-gradient(135deg, #1c86df, #126dc4)} .ecommerce-standalone .ecommerce-standalone__logo i:nth-child(2) { - right: 3px !important; - top: 3px !important; - background: linear-gradient(135deg, #25d1ef, #1697d5) !important; -} + right: 3px; + top: 3px; + background: linear-gradient(135deg, #25d1ef, #1697d5)} .ecommerce-standalone .ecommerce-standalone__logo i:nth-child(3) { - left: 3px !important; - bottom: 3px !important; - background: linear-gradient(135deg, #19c6e4, #12a4d9) !important; -} + left: 3px; + bottom: 3px; + background: linear-gradient(135deg, #19c6e4, #12a4d9)} .ecommerce-standalone .ecommerce-standalone__logo i:nth-child(4) { - right: 3px !important; - bottom: 3px !important; - background: linear-gradient(135deg, #1a7fd5, #1265b4) !important; -} + right: 3px; + bottom: 3px; + background: linear-gradient(135deg, #1a7fd5, #1265b4)} .ecommerce-standalone .ecommerce-standalone__logo::before { - position: absolute !important; - inset: 11px !important; - z-index: 3 !important; - border-radius: 3px !important; - background: #101820 !important; - content: "" !important; - transform: rotate(45deg) !important; -} + position: absolute; + inset: 11px; + z-index: 3; + border-radius: 3px; + background: #101820; + content: ""; + transform: rotate(45deg)} .ecommerce-standalone .ecommerce-standalone__logo::after { - content: none !important; -} + content: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - grid-template-columns: minmax(0, 1fr) !important; - grid-template-rows: auto minmax(64px, auto) auto !important; - row-gap: 12px !important; - min-height: 0 !important; - padding: 18px 20px 16px !important; - overflow: visible !important; -} + grid-template-columns: minmax(0, 1fr); + grid-template-rows: auto minmax(64px, auto) auto; + row-gap: 12px; + min-height: 0; + padding: 18px 20px 16px; + overflow: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference { - position: absolute !important; - left: 18px !important; - bottom: 15px !important; - z-index: 8 !important; - display: inline-grid !important; - grid-auto-flow: column !important; - place-items: center !important; - gap: 8px !important; - width: auto !important; - min-width: 42px !important; - height: 40px !important; - min-height: 40px !important; - margin: 0 !important; - padding: 0 10px !important; - border: 0 !important; - border-radius: 12px !important; - background: transparent !important; - transform: none !important; - pointer-events: auto !important; -} + position: absolute; + left: 18px; + bottom: 15px; + z-index: 8; + display: inline-grid; + grid-auto-flow: column; + place-items: center; + gap: 8px; + width: auto; + min-width: 42px; + height: 40px; + min-height: 40px; + margin: 0; + padding: 0 10px; + border: 0; + border-radius: 12px; + background: transparent; + transform: none; + pointer-events: auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference span { - font-size: 28px !important; - line-height: 1 !important; -} + font-size: 28px; + line-height: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference strong { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover { - position: static !important; - grid-column: 1 !important; - grid-row: 1 !important; - display: flex !important; - align-items: center !important; - justify-content: flex-start !important; - gap: 10px !important; - width: 100% !important; - max-width: 100% !important; - min-height: 70px !important; - padding: 12px 14px !important; - border: 0 !important; - border-bottom: 1px solid rgba(16, 115, 204, 0.08) !important; - border-radius: 22px 22px 0 0 !important; + position: static; + grid-column: 1; + grid-row: 1; + display: flex; + align-items: center; + justify-content: flex-start; + gap: 10px; + width: 100%; + max-width: 100%; + min-height: 70px; + padding: 12px 14px; + border: 0; + border-bottom: 1px solid rgba(16, 115, 204, 0.08); + border-radius: 22px 22px 0 0; background: radial-gradient(circle at 30% 0%, rgba(30, 189, 219, 0.08), transparent 18rem), - linear-gradient(90deg, rgba(16, 115, 204, 0.035), rgba(30, 189, 219, 0.045), rgba(255, 225, 180, 0.04)) !important; - box-shadow: none !important; - animation: none !important; - transform: none !important; -} + linear-gradient(90deg, rgba(16, 115, 204, 0.035), rgba(30, 189, 219, 0.045), rgba(255, 225, 180, 0.04)); + box-shadow: none; + animation: none; + transform: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb { - width: 78px !important; - height: 78px !important; - border-radius: 14px !important; - overflow: visible !important; - background: #f2f6f8 !important; -} + width: 78px; + height: 78px; + border-radius: 14px; + overflow: visible; + background: #f2f6f8} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb img, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb video { - border-radius: 14px !important; -} + border-radius: 14px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb > button { - top: -7px !important; - right: -7px !important; -} + top: -7px; + right: -7px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-add { - width: 44px !important; - height: 44px !important; - border: 0 !important; - border-radius: 12px !important; - background: #f3f8fa !important; - font-size: 28px !important; -} + width: 44px; + height: 44px; + border: 0; + border-radius: 12px; + background: var(--ecom-bg-cool); + font-size: 28px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { - grid-column: 1 !important; - grid-row: 2 !important; - min-height: 56px !important; - padding: 8px 0 !important; -} + grid-column: 1; + grid-row: 2; + min-height: 56px; + padding: 8px 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { - grid-column: 1 !important; - grid-row: 3 !important; - align-items: center !important; - justify-content: space-between !important; - gap: 12px !important; - padding-top: 8px !important; - padding-left: 52px !important; -} + grid-column: 1; + grid-row: 3; + align-items: center; + justify-content: space-between; + gap: 12px; + padding-top: 8px; + padding-left: 52px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row { - flex: 0 1 auto !important; - flex-wrap: wrap !important; - gap: 6px !important; - padding-left: 0 !important; -} + flex: 0 1 auto; + flex-wrap: wrap; + gap: 6px; + padding-left: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button { - flex: 0 0 auto !important; - width: auto !important; - max-width: 148px !important; - min-width: 0 !important; - min-height: 34px !important; - padding: 0 9px !important; - gap: 4px !important; - border-radius: 11px !important; -} + flex: 0 0 auto; + width: auto; + max-width: 148px; + min-width: 0; + min-height: 34px; + padding: 0 9px; + gap: 4px; + border-radius: 11px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button span { - max-width: none !important; -} + max-width: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-submit-row { - flex: 0 0 auto !important; -} + flex: 0 0 auto} /* Remove oversized blanks in composer popovers and keep the logo on white. */ .ecommerce-standalone .ecommerce-standalone__logo { - background: #ffffff !important; - box-shadow: none !important; -} + background: var(--ecom-bg-white); + box-shadow: none} .ecommerce-standalone .ecommerce-standalone__logo::before { - background: #ffffff !important; -} + background: var(--ecom-bg-white)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover { - right: auto !important; - width: max-content !important; - min-width: min(360px, calc(100vw - 56px)) !important; - max-width: min(760px, calc(100vw - 56px)) !important; -} + right: auto; + width: max-content; + min-width: min(360px, calc(100vw - 56px)); + max-width: min(760px, calc(100vw - 56px))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--grid, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--list, @@ -1816,643 +1559,561 @@ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--detail, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--model, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--video { - display: flex !important; - flex-wrap: wrap !important; - align-items: flex-start !important; - justify-content: flex-start !important; - grid-template-columns: none !important; - gap: 8px !important; -} + display: flex; + flex-wrap: wrap; + align-items: flex-start; + justify-content: flex-start; + grid-template-columns: none; + gap: 8px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--detail button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--model button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--video button { - flex: 0 0 auto !important; - width: auto !important; - min-width: 84px !important; - max-width: 190px !important; - min-height: 38px !important; - padding: 8px 13px !important; - white-space: nowrap !important; -} + flex: 0 0 auto; + width: auto; + min-width: 84px; + max-width: 190px; + min-height: 38px; + padding: 8px 13px; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings { - width: max-content !important; - max-width: 100% !important; -} + width: max-content; + max-width: 100%} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--split { - display: flex !important; - flex-wrap: wrap !important; -} + display: flex; + flex-wrap: wrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--split > div { - width: max-content !important; - min-width: 0 !important; - max-width: 100% !important; -} + width: max-content; + min-width: 0; + max-width: 100%} /* All command popovers: three columns, two visible rows, scroll for the rest. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover { - width: min(620px, calc(100vw - 56px)) !important; - min-width: 0 !important; - max-width: min(620px, calc(100vw - 56px)) !important; - max-height: 178px !important; - overflow-x: hidden !important; - overflow-y: auto !important; - scrollbar-gutter: stable; -} + width: min(620px, calc(100vw - 56px)); + min-width: 0; + max-width: min(620px, calc(100vw - 56px)); + max-height: 178px; + overflow-x: hidden; + overflow-y: auto; + scrollbar-gutter: stable} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--grid, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--list, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--languages { - display: grid !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - align-items: start !important; - gap: 8px !important; -} + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + align-items: start; + gap: 8px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings { - display: grid !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - align-items: start !important; - gap: 10px !important; - max-height: 214px !important; -} + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + align-items: start; + gap: 10px; + max-height: 214px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover header, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover-note, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-range, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-layout { - grid-column: 1 / -1 !important; -} + grid-column: 1 / -1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--detail, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--model, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--video, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-levels { - grid-column: 1 / -1 !important; - display: grid !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - gap: 8px !important; - max-height: 104px !important; - overflow-x: hidden !important; - overflow-y: auto !important; -} + grid-column: 1 / -1; + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 8px; + max-height: 104px; + overflow-x: hidden; + overflow-y: auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-levels button { - width: 100% !important; - min-width: 0 !important; - max-width: none !important; - min-height: 44px !important; - padding: 8px 12px !important; - white-space: nowrap !important; -} + width: 100%; + min-width: 0; + max-width: none; + min-height: 44px; + padding: 8px 12px; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row { - display: grid !important; - grid-template-columns: minmax(0, 1fr) auto !important; - min-width: 0 !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr) auto; + min-width: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings > .ecom-command-count-row { - grid-column: span 1 !important; - min-height: 72px !important; -} + grid-column: span 1; + min-height: 72px} /* Settings exceptions: counters and hot-replicate layout should not be crushed. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings { - max-height: 260px !important; -} + max-height: 260px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings > .ecom-command-count-row { - min-height: 86px !important; - padding: 12px !important; -} + min-height: 86px; + padding: 12px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings:has(> .ecom-command-count-row) { - width: min(720px, calc(100vw - 56px)) !important; - max-width: min(720px, calc(100vw - 56px)) !important; -} + width: min(720px, calc(100vw - 56px)); + max-width: min(720px, calc(100vw - 56px))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings:has(> .ecom-command-count-row) { - grid-template-columns: repeat(3, minmax(190px, 1fr)) !important; -} + grid-template-columns: repeat(3, minmax(190px, 1fr))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > span { - min-width: 0 !important; -} + min-width: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > span strong, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > span em { - display: block !important; - overflow: hidden !important; - text-overflow: ellipsis !important; -} + display: block; + overflow: hidden; + text-overflow: ellipsis} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > div { - display: inline-flex !important; - align-items: center !important; - gap: 6px !important; -} + display: inline-flex; + align-items: center; + gap: 6px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > div button { - width: 28px !important; - min-width: 28px !important; - max-width: 28px !important; - height: 28px !important; - min-height: 28px !important; - padding: 0 !important; -} + width: 28px; + min-width: 28px; + max-width: 28px; + height: 28px; + min-height: 28px; + padding: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-layout { - display: grid !important; - grid-template-columns: minmax(220px, 1fr) minmax(160px, 0.62fr) !important; - gap: 12px !important; - max-height: none !important; - overflow: visible !important; -} + display: grid; + grid-template-columns: minmax(220px, 1fr) minmax(160px, 0.62fr); + gap: 12px; + max-height: none; + overflow: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-layout .ecom-command-hot-upload { - min-height: 156px !important; -} + min-height: 156px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-levels { - grid-column: auto !important; - display: grid !important; - grid-template-columns: minmax(0, 1fr) !important; - grid-template-rows: repeat(2, minmax(0, 1fr)) !important; - gap: 10px !important; - max-height: none !important; - overflow: visible !important; -} + grid-column: auto; + display: grid; + grid-template-columns: minmax(0, 1fr); + grid-template-rows: repeat(2, minmax(0, 1fr)); + gap: 10px; + max-height: none; + overflow: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-levels button { - min-height: 72px !important; - white-space: normal !important; -} + min-height: 72px; + white-space: normal} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-thumb-grid { - display: grid !important; - grid-template-columns: repeat(3, 54px) !important; - gap: 8px !important; - max-height: 118px !important; - overflow-x: visible !important; - overflow-y: auto !important; - padding: 2px 4px 2px 2px !important; -} + display: grid; + grid-template-columns: repeat(3, 54px); + gap: 8px; + max-height: 118px; + overflow-x: visible; + overflow-y: auto; + padding: 2px 4px 2px 2px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-thumb { - position: relative !important; - display: block !important; - width: 54px !important; - height: 54px !important; - border-radius: 10px !important; - background: #eef6f8 !important; -} + position: relative; + display: block; + width: 54px; + height: 54px; + border-radius: 10px; + background: var(--ecom-bg-cool)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-thumb > img { - display: block !important; - width: 100% !important; - height: 100% !important; - border-radius: inherit !important; - object-fit: cover !important; -} + display: block; + width: 100%; + height: 100%; + border-radius: inherit; + object-fit: cover} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-zoom { - position: absolute !important; - left: calc(100% + 12px) !important; - top: 50% !important; - z-index: 200 !important; - display: none !important; - width: min(320px, 70vw) !important; - max-height: min(360px, 70vh) !important; - padding: 8px !important; - border: 1px solid rgba(30, 189, 219, 0.28) !important; - border-radius: 16px !important; - background: #feffff !important; - box-shadow: 0 18px 46px rgba(20, 80, 100, 0.18) !important; - pointer-events: none !important; - transform: translateY(-50%) !important; -} + position: absolute; + left: calc(100% + 12px); + top: 50%; + z-index: 200; + display: none; + width: min(320px, 70vw); + max-height: min(360px, 70vh); + padding: 8px; + border: 1px solid rgba(30, 189, 219, 0.28); + border-radius: 16px; + background: var(--ecom-bg-near-white); + box-shadow: 0 18px 46px rgba(20, 80, 100, 0.18); + pointer-events: none; + transform: translateY(-50%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-thumb:hover .ecom-command-hot-zoom { - display: block !important; -} + display: block} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-zoom img { - display: block !important; - width: 100% !important; - height: auto !important; - max-height: calc(min(360px, 70vh) - 16px) !important; - border-radius: 10px !important; - object-fit: contain !important; -} + display: block; + width: 100%; + height: auto; + max-height: calc(min(360px, 70vh) - 16px); + border-radius: 10px; + object-fit: contain} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--grid, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--list, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages { - display: grid !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - grid-auto-rows: minmax(44px, auto) !important; - max-height: 122px !important; -} + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + grid-auto-rows: minmax(44px, auto); + max-height: 122px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--grid button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--list button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button { - width: 100% !important; - min-width: 0 !important; - max-width: none !important; -} + width: 100%; + min-width: 0; + max-width: none} /* Make the upload entry obvious and keep it out of the text input area. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - padding-bottom: 18px !important; -} + padding-bottom: 18px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference { - left: 20px !important; - bottom: 18px !important; - width: auto !important; - min-width: 76px !important; - height: 44px !important; - min-height: 44px !important; - padding: 0 15px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 999px !important; - color: #10202c !important; - background: #feffff !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.08) !important; -} + left: 20px; + bottom: 18px; + width: auto; + min-width: 76px; + height: 44px; + min-height: 44px; + padding: 0 15px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 999px; + color: var(--ecom-text-primary); + background: var(--ecom-bg-near-white); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference span { - display: inline-block !important; - color: #10202c !important; - font-size: 32px !important; - font-weight: 300 !important; - line-height: 1 !important; - transform: translateY(-1px); -} + display: inline-block; + color: var(--ecom-text-primary); + font-size: 32px; + font-weight: 300; + line-height: 1; + transform: translateY(-1px)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference strong { - display: inline !important; - max-width: none !important; - color: #10202c !important; - font-size: 15px !important; - font-weight: 600 !important; - line-height: 1 !important; -} + display: inline; + max-width: none; + color: var(--ecom-text-primary); + font-size: 15px; + font-weight: 600; + line-height: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference:hover, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference.has-images, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference.is-dragging { - border-color: rgba(30, 189, 219, 0.55) !important; - color: #1073cc !important; - background: rgba(30, 189, 219, 0.08) !important; -} + border-color: rgba(30, 189, 219, 0.55); + color: var(--ecom-primary); + background: rgba(30, 189, 219, 0.08)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { - grid-row: 1 / 3 !important; - min-height: 96px !important; - padding: 10px 0 58px !important; -} + grid-row: 1 / 3; + min-height: 96px; + padding: 10px 0 58px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover + textarea, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover ~ textarea { - grid-row: 2 !important; - min-height: 58px !important; - padding: 18px 0 12px !important; -} + grid-row: 2; + min-height: 58px; + padding: 18px 0 12px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { - position: relative !important; - z-index: 6 !important; - padding-left: 104px !important; -} + position: relative; + z-index: 6; + padding-left: 104px} /* Ratio popover: no oversized blank space from long size labels. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--ratio { - width: min(520px, calc(100vw - 56px)) !important; - max-width: min(520px, calc(100vw - 56px)) !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; -} + width: min(520px, calc(100vw - 56px)); + max-width: min(520px, calc(100vw - 56px)); + grid-template-columns: repeat(3, minmax(0, 1fr))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--ratio button { - display: block !important; - overflow: hidden !important; - min-width: 0 !important; - width: 100% !important; - max-width: none !important; - text-align: left !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; -} + display: block; + overflow: hidden; + min-width: 0; + width: 100%; + max-width: none; + text-align: left; + text-overflow: ellipsis; + white-space: nowrap} /* Right history panel should sit flush with the content top. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history { - top: 0 !important; -} + top: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__tools { - padding-top: 12px !important; -} + padding-top: 12px} /* Prevent long option labels from overflowing their buttons. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover *, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row * { - box-sizing: border-box !important; -} + box-sizing: border-box} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button { - overflow: hidden !important; -} + overflow: hidden} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-button-text, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button > strong, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button > span, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button > span { - display: block !important; - min-width: 0 !important; - max-width: 100% !important; - overflow: hidden !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; -} + display: block; + min-width: 0; + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--ratio { - width: min(480px, calc(100vw - 56px)) !important; - max-width: min(480px, calc(100vw - 56px)) !important; -} + width: min(480px, calc(100vw - 56px)); + max-width: min(480px, calc(100vw - 56px))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--ratio button { - min-width: 0 !important; - padding-right: 10px !important; - padding-left: 10px !important; -} + min-width: 0; + padding-right: 10px; + padding-left: 10px} /* Final composer sizing pass: buttons use their content width and keep full labels visible. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { - padding-left: 0 !important; -} + padding-left: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row { - display: flex !important; - flex: 1 1 auto !important; - flex-wrap: wrap !important; - align-items: center !important; - justify-content: flex-start !important; - gap: 6px !important; - min-width: 0 !important; -} + display: flex; + flex: 1 1 auto; + flex-wrap: wrap; + align-items: center; + justify-content: flex-start; + gap: 6px; + min-width: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button { - flex: 0 0 auto !important; - width: max-content !important; - min-width: 0 !important; - max-width: none !important; - height: 34px !important; - min-height: 34px !important; - padding: 0 10px !important; - gap: 5px !important; - white-space: nowrap !important; - overflow: visible !important; -} + flex: 0 0 auto; + width: max-content; + min-width: 0; + max-width: none; + height: 34px; + min-height: 34px; + padding: 0 10px; + gap: 5px; + white-space: nowrap; + overflow: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button > span { - display: inline !important; - flex: 0 0 auto !important; - width: auto !important; - min-width: 0 !important; - max-width: none !important; - overflow: visible !important; - text-overflow: clip !important; - white-space: nowrap !important; -} + display: inline; + flex: 0 0 auto; + width: auto; + min-width: 0; + max-width: none; + overflow: visible; + text-overflow: clip; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button > .ecom-command-option-icon { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - flex: 0 0 16px !important; - width: 16px !important; - height: 16px !important; - min-width: 16px !important; - color: #4d7184 !important; - font-size: 15px !important; - line-height: 1 !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + flex: 0 0 16px; + width: 16px; + height: 16px; + min-width: 16px; + color: #4d7184; + font-size: 15px; + line-height: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button.is-active > .ecom-command-option-icon, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:hover > .ecom-command-option-icon { - color: #1073cc !important; -} + color: var(--ecom-primary)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference { - position: absolute !important; - grid-column: 1 !important; - grid-row: 3 !important; - left: 20px !important; - top: 8px !important; - bottom: auto !important; - z-index: 8 !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 4px !important; - width: auto !important; - min-width: 78px !important; - max-width: none !important; - height: 34px !important; - min-height: 34px !important; - padding: 0 11px !important; - border-radius: 11px !important; -} + position: absolute; + grid-column: 1; + grid-row: 3; + left: 20px; + top: 8px; + bottom: auto; + z-index: 8; + display: inline-flex; + align-items: center; + justify-content: center; + gap: 4px; + width: auto; + min-width: 78px; + max-width: none; + height: 34px; + min-height: 34px; + padding: 0 11px; + border-radius: 11px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference span { - font-size: 20px !important; - line-height: 1 !important; - transform: none !important; -} + font-size: 20px; + line-height: 1; + transform: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference strong { - display: inline !important; - font-size: 13px !important; - line-height: 1 !important; -} + display: inline; + font-size: 13px; + line-height: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--grid { - width: max-content !important; - min-width: 0 !important; - max-width: min(620px, calc(100vw - 56px)) !important; - display: flex !important; - flex-wrap: wrap !important; - align-items: flex-start !important; - justify-content: flex-start !important; - gap: 8px !important; - max-height: 122px !important; - overflow-x: hidden !important; - overflow-y: auto !important; -} + width: max-content; + min-width: 0; + max-width: min(620px, calc(100vw - 56px)); + display: flex; + flex-wrap: wrap; + align-items: flex-start; + justify-content: flex-start; + gap: 8px; + max-height: 122px; + overflow-x: hidden; + overflow-y: auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--grid button { - flex: 0 0 auto !important; - width: max-content !important; - min-width: 0 !important; - max-width: none !important; - padding: 8px 15px !important; - overflow: visible !important; - white-space: nowrap !important; -} + flex: 0 0 auto; + width: max-content; + min-width: 0; + max-width: none; + padding: 8px 15px; + overflow: visible; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--list:not(.ecom-command-popover--ratio), .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages { - grid-template-columns: repeat(3, max-content) !important; - width: max-content !important; - min-width: 0 !important; - max-width: min(680px, calc(100vw - 56px)) !important; -} + grid-template-columns: repeat(3, max-content); + width: max-content; + min-width: 0; + max-width: min(680px, calc(100vw - 56px))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--list:not(.ecom-command-popover--ratio) button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button { - width: max-content !important; - min-width: 0 !important; - max-width: none !important; - overflow: visible !important; - white-space: nowrap !important; -} + width: max-content; + min-width: 0; + max-width: none; + overflow: visible; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--ratio { - grid-template-columns: repeat(3, max-content) !important; - width: max-content !important; - min-width: 0 !important; - max-width: min(860px, calc(100vw - 56px)) !important; -} + grid-template-columns: repeat(3, max-content); + width: max-content; + min-width: 0; + max-width: min(860px, calc(100vw - 56px))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--ratio button { - display: inline-flex !important; - width: max-content !important; - min-width: 0 !important; - max-width: none !important; - overflow: visible !important; - text-align: left !important; - text-overflow: clip !important; - white-space: nowrap !important; -} + display: inline-flex; + width: max-content; + min-width: 0; + max-width: none; + overflow: visible; + text-align: left; + text-overflow: clip; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-button-text { - display: inline !important; - max-width: none !important; - overflow: visible !important; - text-overflow: clip !important; - white-space: nowrap !important; -} + display: inline; + max-width: none; + overflow: visible; + text-overflow: clip; + white-space: nowrap} /* Keep command popovers visually attached to the composer. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover { - bottom: -2px !important; -} + bottom: -2px} /* Softer popover and side-panel motion. */ @keyframes ecommerce-soft-popover-in { 0% { opacity: 0; filter: blur(2px); - transform: translate3d(0, 12px, 0) scale(0.972); - } + transform: translate3d(0, 12px, 0) scale(0.972)} 58% { opacity: 1; filter: blur(0); - transform: translate3d(0, -2px, 0) scale(1.004); - } + transform: translate3d(0, -2px, 0) scale(1.004)} 100% { opacity: 1; filter: blur(0); - transform: translate3d(0, 0, 0) scale(1); - } + transform: translate3d(0, 0, 0) scale(1)} } @keyframes ecommerce-soft-drop-in { 0% { opacity: 0; filter: blur(2px); - transform: translate3d(0, -10px, 0) scale(0.976); - } + transform: translate3d(0, -10px, 0) scale(0.976)} 62% { opacity: 1; filter: blur(0); - transform: translate3d(0, 2px, 0) scale(1.003); - } + transform: translate3d(0, 2px, 0) scale(1.003)} 100% { opacity: 1; filter: blur(0); - transform: translate3d(0, 0, 0) scale(1); - } + transform: translate3d(0, 0, 0) scale(1)} } @keyframes ecommerce-soft-scrim-in { from { - opacity: 0; - } + opacity: 0} to { - opacity: 1; - } + opacity: 1} } .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover, .ecommerce-standalone .ecommerce-profile-popover, .ecommerce-standalone .product-set-preview-modal { - transform-origin: top left !important; - will-change: opacity, transform, filter !important; - animation: ecommerce-soft-popover-in 420ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + transform-origin: top left; + will-change: opacity, transform, filter; + animation: ecommerce-soft-popover-in 420ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecommerce-auth-modal__panel { - transform-origin: center !important; - will-change: opacity, transform, filter !important; - animation: ecommerce-soft-popover-in 460ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + transform-origin: center; + will-change: opacity, transform, filter; + animation: ecommerce-soft-popover-in 460ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecommerce-auth-modal__scrim, .ecommerce-standalone .ecommerce-profile-popover__backdrop, .ecommerce-standalone .product-set-preview-backdrop { - animation: ecommerce-soft-scrim-in 300ms ease-out both !important; -} + animation: ecommerce-soft-scrim-in 300ms ease-out both} .ecommerce-standalone .ecom-command-asset-popover { - transform-origin: top left !important; - will-change: opacity, transform, filter !important; - animation: ecommerce-soft-drop-in 380ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + transform-origin: top left; + will-change: opacity, transform, filter; + animation: ecommerce-soft-drop-in 380ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history { transition: transform 440ms cubic-bezier(0.16, 1, 0.3, 1), opacity 300ms ease, box-shadow 320ms ease, - border-color 320ms ease !important; - will-change: transform, opacity !important; -} + border-color 320ms ease; + will-change: transform, opacity} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__tools, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list { transition: opacity 260ms ease, - transform 360ms cubic-bezier(0.16, 1, 0.3, 1) !important; -} + transform 360ms cubic-bezier(0.16, 1, 0.3, 1)} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__tools, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__list { - opacity: 0.96 !important; -} + opacity: 0.96} @media (prefers-reduced-motion: reduce) { .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover, @@ -2477,177 +2138,159 @@ .ecommerce-standalone .ecom-tool-page-enter .ecom-quick-set-panel > section, .ecommerce-standalone .ecom-tool-page-enter .ecom-watermark-panel, .ecommerce-standalone .ecom-tool-page-enter .ecom-image-workbench-panel { - animation: none !important; - } + animation: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__tools, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list { - transition: none !important; - } + transition: none} } /* Align the upload action with the command pill buttons. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer > .ecom-command-reference:not(.ecom-command-reference--inline) { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference { - box-sizing: border-box !important; - position: static !important; - grid-column: auto !important; - grid-row: auto !important; - inset: auto !important; - z-index: auto !important; - flex: 0 0 auto !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 5px !important; - width: max-content !important; - min-width: 0 !important; - max-width: none !important; - height: 34px !important; - min-height: 34px !important; - padding: 0 10px !important; - border: 1px solid rgba(30, 189, 219, 0.22) !important; - border-radius: 11px !important; - color: #10202c !important; - background: #f3f8fa !important; - box-shadow: none !important; - font-size: 13px !important; - font-weight: 500 !important; - line-height: 1 !important; -} + box-sizing: border-box; + position: static; + grid-column: auto; + grid-row: auto; + inset: auto; + z-index: auto; + flex: 0 0 auto; + display: inline-flex; + align-items: center; + justify-content: center; + gap: 5px; + width: max-content; + min-width: 0; + max-width: none; + height: 34px; + min-height: 34px; + padding: 0 10px; + border: 1px solid rgba(30, 189, 219, 0.22); + border-radius: 11px; + color: var(--ecom-text-primary); + background: var(--ecom-bg-cool); + box-shadow: none; + font-size: 13px; + font-weight: 500; + line-height: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference span { - display: inline !important; - color: inherit !important; - font-size: 13px !important; - font-weight: 500 !important; - line-height: 1 !important; - transform: none !important; -} + display: inline; + color: inherit; + font-size: 13px; + font-weight: 500; + line-height: 1; + transform: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference strong { - display: inline !important; - color: inherit !important; - font-size: 13px !important; - font-weight: 500 !important; - line-height: 1 !important; -} + display: inline; + color: inherit; + font-size: 13px; + font-weight: 500; + line-height: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference.has-images, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference.is-dragging, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference:hover { - border-color: rgba(30, 189, 219, 0.42) !important; - color: #1073cc !important; - background: linear-gradient(180deg, rgba(254, 255, 255, 0.96), rgba(234, 250, 254, 0.9)) !important; -} + border-color: rgba(30, 189, 219, 0.42); + color: var(--ecom-primary); + background: linear-gradient(180deg, rgba(254, 255, 255, 0.96), rgba(234, 250, 254, 0.9))} /* Match the official OmniAI logo lockup on the local soft-white surface. */ .ecommerce-standalone .ecommerce-standalone__brand { - gap: 10px !important; - min-height: 36px !important; - padding: 0 6px !important; - border-radius: 12px !important; - color: #10202c !important; - background: #f8f9fa !important; - box-shadow: inset 0 0 0 1px rgba(30, 189, 219, 0.08) !important; -} + gap: 10px; + min-height: 36px; + padding: 0 6px; + border-radius: 12px; + color: var(--ecom-text-primary); + background: var(--ecom-bg-page); + box-shadow: inset 0 0 0 1px rgba(30, 189, 219, 0.08)} .ecommerce-standalone .ecommerce-standalone__brand strong { - color: #10202c !important; - font-size: 15px !important; - font-weight: 700 !important; - line-height: 1 !important; -} + color: var(--ecom-text-primary); + font-size: 15px; + font-weight: 700; + line-height: 1} .ecommerce-standalone .ecommerce-standalone__logo { - position: relative !important; - display: inline-flex !important; - flex: 0 0 28px !important; - align-items: center !important; - justify-content: center !important; - width: 28px !important; - height: 28px !important; - border-radius: 8px !important; - background: #f8f9fa !important; - box-shadow: none !important; -} + position: relative; + display: inline-flex; + flex: 0 0 28px; + align-items: center; + justify-content: center; + width: 28px; + height: 28px; + border-radius: 8px; + background: var(--ecom-bg-page); + box-shadow: none} .ecommerce-standalone .ecommerce-standalone__logo img { - display: block !important; - width: 28px !important; - height: 28px !important; - object-fit: contain !important; -} + display: block; + width: 28px; + height: 28px; + object-fit: contain} .ecommerce-standalone .ecommerce-standalone__logo i, .ecommerce-standalone .ecommerce-standalone__logo::before, .ecommerce-standalone .ecommerce-standalone__logo::after { - content: none !important; - display: none !important; -} + content: none; + display: none} /* Language popover only: restore the compact inline language style. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages { - display: grid !important; - grid-template-columns: repeat(3, max-content) !important; - align-items: start !important; - gap: 8px !important; - width: max-content !important; - min-width: 0 !important; - max-width: min(680px, calc(100vw - 56px)) !important; - max-height: 122px !important; -} + display: grid; + grid-template-columns: repeat(3, max-content); + align-items: start; + gap: 8px; + width: max-content; + min-width: 0; + max-width: min(680px, calc(100vw - 56px)); + max-height: 122px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button { - display: inline-flex !important; - align-items: center !important; - justify-content: flex-start !important; - gap: 5px !important; - width: max-content !important; - min-width: 0 !important; - max-width: none !important; - min-height: 34px !important; - padding: 0 12px !important; - white-space: nowrap !important; -} + display: inline-flex; + align-items: center; + justify-content: flex-start; + gap: 5px; + width: max-content; + min-width: 0; + max-width: none; + min-height: 34px; + padding: 0 12px; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button strong, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button span { - display: inline !important; - width: auto !important; - min-width: 0 !important; - max-width: none !important; - overflow: visible !important; - line-height: 1 !important; - text-overflow: clip !important; - white-space: nowrap !important; -} + display: inline; + width: auto; + min-width: 0; + max-width: none; + overflow: visible; + line-height: 1; + text-overflow: clip; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button strong { - color: #10202c !important; - font-size: 13px !important; - font-weight: 600 !important; -} + color: var(--ecom-text-primary); + font-size: 13px; + font-weight: 600} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button span { - color: #6b7c88 !important; - font-size: 12px !important; - font-weight: 500 !important; -} + color: #6b7c88; + font-size: 12px; + font-weight: 500} /* Settings popover: center non-set-mode option text only. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-levels button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-upload { - align-items: center !important; - justify-content: center !important; - justify-items: center !important; - text-align: center !important; -} + align-items: center; + justify-content: center; + justify-items: center; + text-align: center} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid button > strong, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid button > span, @@ -2655,188 +2298,160 @@ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-levels button > span, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-upload > strong, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-upload > span { - width: 100% !important; - text-align: center !important; -} + width: 100%; + text-align: center} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings > .ecom-command-count-row, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings > .ecom-command-count-row * { - text-align: initial !important; -} + text-align: initial} /* Uploaded asset strip: no tinted background or divider line. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover { - border-bottom: 0 !important; - background: transparent !important; -} + border-bottom: 0; + background: transparent} /* Command popovers must open below the composer; animation transforms should not control placement. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover { - top: calc(100% + 2px) !important; - bottom: auto !important; -} + top: calc(100% + 2px); + bottom: auto} /* Generated workspace: compact composer, textured canvas, mouse-centered zoom and middle-button panning. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview { - grid-template-rows: auto minmax(0, 1fr) !important; - align-content: stretch !important; - gap: 14px !important; - overflow: auto !important; - cursor: default !important; + grid-template-rows: auto minmax(0, 1fr); + align-content: stretch; + gap: 14px; + overflow: auto; + cursor: default; background: radial-gradient(circle at 18% 18%, rgba(30, 189, 219, 0.08), transparent 24rem), radial-gradient(circle at 82% 28%, rgba(16, 115, 204, 0.06), transparent 22rem), linear-gradient(rgba(16, 115, 204, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(16, 115, 204, 0.035) 1px, transparent 1px), - #f8f9fa !important; - background-size: auto, auto, 28px 28px, 28px 28px, auto !important; -} + var(--ecom-bg-page); + background-size: auto, auto, 28px 28px, 28px 28px, auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview.is-middle-panning { - cursor: grabbing !important; - user-select: none !important; -} + cursor: grabbing; + user-select: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview-zoom-wrap { - width: max-content !important; - min-width: 100% !important; - transform-origin: 0 0 !important; -} + width: max-content; + min-width: 100%; + transform-origin: 0 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview-showcase, .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-flow-pipeline, .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-empty-state { - position: relative !important; - grid-row: 2 !important; - margin-top: 0 !important; -} + position: relative; + grid-row: 2; + margin-top: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact { - gap: 0 !important; - cursor: text !important; -} + gap: 0; + cursor: text} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-title { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .clone-ai-input-wrapper.ecom-command-composer { - grid-template-rows: auto auto !important; - row-gap: 8px !important; - min-height: 92px !important; - padding: 12px 16px !important; - border-radius: 22px !important; - box-shadow: 0 14px 36px rgba(16, 115, 204, 0.1) !important; -} + grid-template-rows: auto auto; + row-gap: 8px; + min-height: 92px; + padding: 12px 16px; + border-radius: 22px; + box-shadow: 0 14px 36px rgba(16, 115, 204, 0.1)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-asset-popover { - max-height: 42px !important; - overflow: hidden !important; -} + max-height: 42px; + overflow: hidden} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-composer textarea { - min-height: 34px !important; - max-height: 38px !important; - padding-top: 4px !important; - padding-bottom: 0 !important; - overflow: hidden !important; -} + min-height: 34px; + max-height: 38px; + padding-top: 4px; + padding-bottom: 0; + overflow: hidden} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-toolbar { - padding-top: 4px !important; - border-top: 0 !important; -} + padding-top: 4px; + border-top: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list button.is-active, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item.is-active .ecom-command-history__item-main { - border-color: rgba(30, 189, 219, 0.42) !important; - background: rgba(30, 189, 219, 0.12) !important; -} + border-color: rgba(30, 189, 219, 0.42); + background: rgba(30, 189, 219, 0.12)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__empty { - margin: 10px 8px 0 !important; - padding: 18px 12px !important; - border: 1px dashed rgba(30, 189, 219, 0.22) !important; - border-radius: 14px !important; - color: #7a8c98 !important; - background: rgba(248, 249, 250, 0.72) !important; - font-size: 13px !important; - font-weight: 500 !important; - text-align: center !important; -} + margin: 10px 8px 0; + padding: 18px 12px; + border: 1px dashed rgba(30, 189, 219, 0.22); + border-radius: 14px; + color: #7a8c98; + background: rgba(248, 249, 250, 0.72); + font-size: 13px; + font-weight: 500; + text-align: center} .ecommerce-standalone .product-clone-page[data-tool="clone"] { - padding-left: 0 !important; -} + padding-left: 0} /* Final canvas alignment: keep the composer centered in the generation area and make middle-button panning visible. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview { - position: relative !important; - overflow: hidden !important; - padding-right: 0 !important; - padding-left: 0 !important; -} + position: relative; + overflow: hidden; + padding-right: 0; + padding-left: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { - position: absolute !important; - left: 50% !important; - z-index: 12 !important; - width: min(1036px, calc(100% - 56px)) !important; - margin-right: 0 !important; - margin-left: 0 !important; -; + position: absolute; + left: 50%; + z-index: 12; + width: min(1036px, calc(100% - 56px)); + margin-right: 0; + margin-left: 0; transition: top 520ms cubic-bezier(0.16, 1, 0.3, 1), transform 520ms cubic-bezier(0.16, 1, 0.3, 1), - width 520ms cubic-bezier(0.16, 1, 0.3, 1) !important; -} + width 520ms cubic-bezier(0.16, 1, 0.3, 1)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-before-generate { - top: calc(50% - clamp(24px, 3.5vh, 36px)) !important; - transform: translate(-50%, -50%) !important; -} + top: calc(50% - clamp(24px, 3.5vh, 36px)); + transform: translate(-50%, -50%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated { - top: 48px !important; - transform: translateX(-50%) !important; -} + top: 48px; + transform: translateX(-50%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview[data-status="done"] { - padding-top: 156px !important; -} + padding-top: 156px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview[data-status="done"]:has(.ecom-command-composer-wrap:not(.is-compact)) { - padding-top: 360px !important; -} + padding-top: 360px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview-zoom-wrap { - display: inline-flex !important; - align-items: flex-start !important; - justify-content: center !important; - width: auto !important; - min-width: 100% !important; - transform-origin: 0 0 !important; - will-change: transform !important; - transition: transform 120ms ease-out !important; -} + display: inline-flex; + align-items: flex-start; + justify-content: center; + width: auto; + min-width: 100%; + transform-origin: 0 0; + will-change: transform; + transition: transform 120ms ease-out} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview.is-middle-panning .clone-ai-preview-zoom-wrap { - transition: none !important; -} + transition: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview-showcase { - width: min(1120px, calc(100vw - 420px)) !important; - min-width: 980px !important; - margin-right: auto !important; - margin-left: auto !important; -} + width: min(1120px, calc(100vw - 420px)); + min-width: 980px; + margin-right: auto; + margin-left: auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-nodes { position: relative; width: max-content; min-width: min(1120px, calc(100vw - 420px)); min-height: 200px; - padding: 24px; -} + padding: 24px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node { position: absolute; @@ -2851,12 +2466,10 @@ border: 1px solid rgba(30, 189, 219, 0.18); background: rgba(255, 255, 255, 0.96); box-shadow: 0 4px 20px rgba(16, 115, 204, 0.08); - transition: box-shadow 200ms ease; -} + transition: box-shadow 200ms ease} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node:hover { - box-shadow: 0 8px 32px rgba(16, 115, 204, 0.14); -} + box-shadow: 0 8px 32px rgba(16, 115, 204, 0.14)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-node-drag-handle { position: absolute; @@ -2871,12 +2484,10 @@ border-radius: 18px 18px 0 0; cursor: grab; user-select: none; - touch-action: none; -} + touch-action: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-node-drag-handle:active { - cursor: grabbing; -} + cursor: grabbing} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-main-result { flex: 0 0 auto; @@ -2885,38 +2496,32 @@ overflow: hidden; border: 1px solid rgba(30, 189, 219, 0.12); cursor: pointer; - background: #f4f8fa; -} + background: #f4f8fa} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-main-result img { width: 100%; height: auto; - display: block; -} + display: block} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-main-result span { display: block; text-align: center; font-size: 11px; color: #68818f; - padding: 4px; -} + padding: 4px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-source-stack { position: relative; - flex: 0 0 auto; -} + flex: 0 0 auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-result-grid { display: flex; gap: 12px; - flex-wrap: wrap; -} + flex-wrap: wrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-result-stack { position: relative; - flex: 0 0 auto; -} + flex: 0 0 auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-source-corner-action { position: absolute; @@ -2938,13 +2543,11 @@ line-height: 1; white-space: nowrap; cursor: pointer; - transform: translate(-50%, -100%); -} + transform: translate(-50%, -100%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-source-corner-action:hover { border-color: rgba(30, 189, 219, 0.45); - color: #0f7895; -} + color: #0f7895} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-result-grid button { width: 140px; @@ -2953,26 +2556,22 @@ border: 1px solid rgba(30, 189, 219, 0.12); background: #f4f8fa; cursor: pointer; - transition: border-color 200ms; -} + transition: border-color 200ms} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-result-grid button:hover { - border-color: rgba(30, 189, 219, 0.4); -} + border-color: rgba(30, 189, 219, 0.4)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-result-grid img { width: 100%; height: auto; - display: block; -} + display: block} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-result-grid span { display: block; text-align: center; font-size: 11px; color: #68818f; - padding: 4px; -} + padding: 4px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-node-label { font-size: 11px; @@ -2980,8 +2579,7 @@ color: rgba(30, 189, 219, 0.8); background: rgba(30, 189, 219, 0.08); padding: 2px 8px; - border-radius: 8px; -} + border-radius: 8px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-result-stack > .clone-ai-node-label { position: absolute; @@ -2989,8 +2587,7 @@ left: 50%; z-index: 5; transform: translate(-50%, -100%); - white-space: nowrap; -} + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node.is-generating { justify-content: center; @@ -2998,1227 +2595,1070 @@ min-height: 120px; color: #68818f; font-size: 14px; - gap: 10px; -} + gap: 10px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview { - cursor: grab; -} + cursor: grab} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview.is-middle-panning { - cursor: grabbing; -} + cursor: grabbing} /* History sidebar is an overlay drawer; do NOT shift the underlying content. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-empty-state, .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-flow-pipeline { - transform: none !important; -} + transform: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview-zoom-wrap { - margin-left: 0 !important; -} + margin-left: 0} /* Header polish: remove the logo frame trace and match credit/user pill surfaces. */ .ecommerce-standalone .ecommerce-standalone__brand { - background: transparent !important; - box-shadow: none !important; -} + background: transparent; + box-shadow: none} .ecommerce-standalone .ecommerce-standalone__logo { - overflow: visible !important; - border: 0 !important; - border-radius: 0 !important; - background: transparent !important; - box-shadow: none !important; -} + overflow: visible; + border: 0; + border-radius: 0; + background: transparent; + box-shadow: none} .ecommerce-standalone .ecommerce-standalone__logo img { - border: 0 !important; - border-radius: 0 !important; - background: transparent !important; - box-shadow: none !important; -} + border: 0; + border-radius: 0; + background: transparent; + box-shadow: none} .ecommerce-standalone .ecommerce-standalone__credits, .ecommerce-standalone .ecommerce-profile-menu__trigger { - min-height: 42px !important; - border: 1px solid rgba(30, 189, 219, 0.18) !important; - border-radius: 15px !important; - color: #10202c !important; - background: #fbfdfe !important; - box-shadow: 0 10px 26px rgba(16, 115, 204, 0.06) !important; -} + min-height: 42px; + border: 1px solid rgba(30, 189, 219, 0.18); + border-radius: 15px; + color: var(--ecom-text-primary); + background: #fbfdfe; + box-shadow: 0 10px 26px rgba(16, 115, 204, 0.06)} .ecommerce-standalone .ecommerce-standalone__credits { - padding: 0 14px !important; -} + padding: 0 14px} .ecommerce-standalone .ecommerce-profile-menu__trigger { - padding: 0 15px 0 7px !important; -} + padding: 0 15px 0 7px} /* Compact generated composer: keep uploaded thumbnails visible and collapse the text band. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .clone-ai-input-wrapper.ecom-command-composer { - grid-template-rows: auto 24px auto !important; - row-gap: 6px !important; - min-height: 124px !important; - padding: 10px 16px 12px !important; - overflow: visible !important; -} + grid-template-rows: auto 24px auto; + row-gap: 6px; + min-height: 124px; + padding: 10px 16px 12px; + overflow: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-asset-popover { - min-height: 56px !important; - max-height: 56px !important; - padding: 7px 12px 5px !important; - overflow: visible !important; -} + min-height: 56px; + max-height: 56px; + padding: 7px 12px 5px; + overflow: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-asset-thumb { - width: 44px !important; - height: 44px !important; - border-radius: 10px !important; -} + width: 44px; + height: 44px; + border-radius: 10px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-asset-thumb img, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-asset-thumb video { - border-radius: 10px !important; -} + border-radius: 10px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-asset-thumb > button { - top: -4px !important; - right: -4px !important; - width: 18px !important; - height: 18px !important; - min-height: 18px !important; - font-size: 12px !important; -} + top: -4px; + right: -4px; + width: 18px; + height: 18px; + min-height: 18px; + font-size: 12px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-asset-add { - width: 42px !important; - height: 42px !important; - min-height: 42px !important; -} + width: 42px; + height: 42px; + min-height: 42px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-composer textarea { - min-height: 22px !important; - max-height: 24px !important; - padding: 0 !important; - font-size: 14px !important; - line-height: 22px !important; - white-space: nowrap !important; - text-overflow: ellipsis !important; -} + min-height: 22px; + max-height: 24px; + padding: 0; + font-size: 14px; + line-height: 22px; + white-space: nowrap; + text-overflow: ellipsis} /* Composer final pass: viewport-centered position, icon-only upload, platform marks, and language-only sizing. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { - position: fixed !important; - left: 50vw !important; - right: auto !important; - width: min(1036px, calc(100vw - 56px)) !important; -} + position: fixed; + left: 50vw; + right: auto; + width: min(1036px, calc(100vw - 56px))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-before-generate { - top: calc(50vh + 32px) !important; - transform: translate(-50%, -50%) !important; -} + top: calc(50vh + 32px); + transform: translate(-50%, -50%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated { - top: 88px !important; - transform: translateX(-50%) !important; -} + top: 88px; + transform: translateX(-50%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline { - width: 34px !important; - min-width: 34px !important; - max-width: 34px !important; - padding: 0 !important; -} + width: 34px; + min-width: 34px; + max-width: 34px; + padding: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline strong { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline span { - font-size: 20px !important; - font-weight: 600 !important; -} + font-size: 20px; + font-weight: 600} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-platform-logo-mark { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - flex: 0 0 20px !important; - width: 20px !important; - height: 20px !important; - padding: 0 !important; - overflow: hidden !important; - border-radius: 6px !important; - color: inherit !important; - background: transparent !important; - box-shadow: none !important; - font-size: 0 !important; - font-style: normal !important; - font-weight: 800 !important; - line-height: 1 !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + flex: 0 0 20px; + width: 20px; + height: 20px; + padding: 0; + overflow: hidden; + border-radius: 6px; + color: inherit; + background: transparent; + box-shadow: none; + font-size: 0; + font-style: normal; + font-weight: 800; + line-height: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-platform-logo-mark--duo { - flex-basis: 42px !important; - width: 42px !important; - gap: 2px !important; - overflow: visible !important; -} + flex-basis: 42px; + width: 42px; + gap: 2px; + overflow: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-platform-logo-mark img { - display: block !important; - width: 20px !important; - height: 20px !important; - flex: 0 0 20px !important; - object-fit: contain !important; - border-radius: 5px !important; - background: transparent !important; -} + display: block; + width: 20px; + height: 20px; + flex: 0 0 20px; + object-fit: contain; + border-radius: 5px; + background: transparent} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--platform button, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:has(.ecom-platform-logo-mark) { - display: inline-flex !important; - align-items: center !important; - gap: 6px !important; -} + display: inline-flex; + align-items: center; + gap: 6px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-platform-name { - display: inline !important; - width: auto !important; - max-width: none !important; - overflow: visible !important; - color: inherit !important; - text-overflow: clip !important; - white-space: nowrap !important; -} + display: inline; + width: auto; + max-width: none; + overflow: visible; + color: inherit; + text-overflow: clip; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages { - grid-template-columns: repeat(3, minmax(118px, 1fr)) !important; - width: min(520px, calc(100vw - 56px)) !important; - min-width: 0 !important; - max-width: min(520px, calc(100vw - 56px)) !important; -} + grid-template-columns: repeat(3, minmax(118px, 1fr)); + width: min(520px, calc(100vw - 56px)); + min-width: 0; + max-width: min(520px, calc(100vw - 56px))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button { - display: grid !important; - grid-template-columns: minmax(0, 1fr) !important; - align-content: center !important; - justify-items: center !important; - gap: 4px !important; - width: 100% !important; - min-width: 0 !important; - max-width: none !important; - min-height: 52px !important; - padding: 8px 10px !important; - text-align: center !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr); + align-content: center; + justify-items: center; + gap: 4px; + width: 100%; + min-width: 0; + max-width: none; + min-height: 52px; + padding: 8px 10px; + text-align: center} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button strong, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button span { - width: 100% !important; - min-width: 0 !important; - max-width: 100% !important; - overflow: hidden !important; - text-align: center !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; -} + width: 100%; + min-width: 0; + max-width: 100%; + overflow: hidden; + text-align: center; + text-overflow: ellipsis; + white-space: nowrap} /* Restore composer scale: only center dynamically, do not enlarge the input or upload strip. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] { - --ecom-history-offset: 0px; -} + --ecom-history-offset: 0px} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed { - --ecom-history-offset: 0px; -} + --ecom-history-offset: 0px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { - position: absolute !important; - left: calc(50% + var(--ecom-history-offset)) !important; - right: auto !important; - bottom: auto !important; - height: auto !important; - width: min(1036px, calc(100% - 56px)) !important; - align-content: start !important; - grid-template-rows: auto auto !important; -} + position: absolute; + left: calc(50% + var(--ecom-history-offset)); + right: auto; + bottom: auto; + height: auto; + width: min(1036px, calc(100% - 56px)); + align-content: start; + grid-template-rows: auto auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-before-generate { - top: calc(50% - clamp(24px, 3.5vh, 36px)) !important; - transform: translate(-50%, -50%) !important; -} + top: calc(50% - clamp(24px, 3.5vh, 36px)); + transform: translate(-50%, -50%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated { - top: 24px !important; - transform: translateX(-50%) !important; -} + top: 24px; + transform: translateX(-50%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title { - font-size: clamp(28px, 2.7vw, 40px) !important; - line-height: 1.12 !important; -} + font-size: clamp(28px, 2.7vw, 40px); + line-height: 1.12} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - grid-template-rows: auto minmax(40px, auto) auto !important; - row-gap: 8px !important; - min-height: 184px !important; - padding: 14px 20px 14px !important; -} + grid-template-rows: auto minmax(40px, auto) auto; + row-gap: 8px; + min-height: 184px; + padding: 14px 20px 14px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover { - min-height: 54px !important; - max-height: 62px !important; - padding: 6px 12px !important; - overflow: visible !important; -} + min-height: 54px; + max-height: 62px; + padding: 6px 12px; + overflow: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb { - width: 48px !important; - height: 48px !important; - border-radius: 10px !important; -} + width: 48px; + height: 48px; + border-radius: 10px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb img, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb video { - border-radius: 10px !important; -} + border-radius: 10px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb > button { - top: -5px !important; - right: -5px !important; -} + top: -5px; + right: -5px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-add { - width: 42px !important; - height: 42px !important; - min-height: 42px !important; -} + width: 42px; + height: 42px; + min-height: 42px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover + textarea, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover ~ textarea, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { - min-height: 42px !important; - max-height: 62px !important; - padding: 8px 0 6px !important; - font-size: 16px !important; - line-height: 24px !important; -} + min-height: 42px; + max-height: 62px; + padding: 8px 0 6px; + font-size: 16px; + line-height: 24px} /* Size rollback: keep the previous compact composer proportions while preserving dynamic centering. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { - gap: 18px !important; -} + gap: 18px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title { - max-width: 100% !important; - font-size: clamp(24px, 2.2vw, 32px) !important; - line-height: 1.15 !important; - white-space: nowrap !important; -} + max-width: 100%; + font-size: clamp(24px, 2.2vw, 32px); + line-height: 1.15; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - grid-template-rows: 54px 32px auto !important; - row-gap: 6px !important; - min-height: 164px !important; - padding: 12px 18px !important; -} + grid-template-rows: 54px 32px auto; + row-gap: 6px; + min-height: 164px; + padding: 12px 18px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover { - min-height: 54px !important; - max-height: 54px !important; - padding: 5px 10px !important; -} + min-height: 54px; + max-height: 54px; + padding: 5px 10px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb { - width: 44px !important; - height: 44px !important; -} + width: 44px; + height: 44px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-add { - width: 40px !important; - height: 40px !important; - min-height: 40px !important; -} + width: 40px; + height: 40px; + min-height: 40px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover + textarea, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover ~ textarea { - min-height: 32px !important; - max-height: 32px !important; - padding: 3px 0 0 !important; - line-height: 24px !important; -} + min-height: 32px; + max-height: 32px; + padding: 3px 0 0; + line-height: 24px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { - min-height: 42px !important; - padding-top: 4px !important; -} + min-height: 42px; + padding-top: 4px} /* Hidden utility nodes must not create rows in the composer grid. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hidden-file { - position: absolute !important; - width: 1px !important; - height: 1px !important; - min-height: 0 !important; - overflow: hidden !important; - opacity: 0 !important; - pointer-events: none !important; - transform: translate(-9999px, -9999px) !important; -} + position: absolute; + width: 1px; + height: 1px; + min-height: 0; + overflow: hidden; + opacity: 0; + pointer-events: none; + transform: translate(-9999px, -9999px)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-char-count { - position: absolute !important; - right: 10px !important; - bottom: -18px !important; - height: auto !important; - margin: 0 !important; - line-height: 1 !important; -} + position: absolute; + right: 10px; + bottom: -18px; + height: auto; + margin: 0; + line-height: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title { - height: auto !important; - min-height: 0 !important; - max-height: 38px !important; - overflow: hidden !important; -} + height: auto; + min-height: 0; + max-height: 38px; + overflow: hidden} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - height: auto !important; - max-height: 190px !important; - align-content: start !important; -} + height: auto; + max-height: 190px; + align-content: start} /* Horizontal centering only: keep the original vertical placement and visual scale. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-before-generate { - top: clamp(44px, 4.6vh, 58px) !important; - transform: translateX(-50%) !important; -} + top: clamp(44px, 4.6vh, 58px); + transform: translateX(-50%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title { - height: auto !important; - max-height: none !important; - overflow: visible !important; - font-size: clamp(30px, 3.3vw, 46px) !important; - line-height: 1.1 !important; - white-space: normal !important; -} + height: auto; + max-height: none; + overflow: visible; + font-size: clamp(30px, 3.3vw, 46px); + line-height: 1.1; + white-space: normal} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - grid-template-rows: minmax(92px, auto) auto !important; - min-height: 206px !important; - max-height: none !important; - padding: 18px 20px !important; - row-gap: 16px !important; -} + grid-template-rows: minmax(92px, auto) auto; + min-height: 206px; + max-height: none; + padding: 18px 20px; + row-gap: 16px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board { - display: grid !important; - grid-template-columns: repeat(6, minmax(0, 1fr)) !important; - width: min(1036px, 100%) !important; - min-height: 148px !important; - overflow: hidden !important; - border: 1px solid rgba(30, 189, 219, 0.13) !important; - border-radius: 18px !important; - background: rgba(254, 255, 255, 0.92) !important; - box-shadow: 0 18px 42px rgba(16, 115, 204, 0.08) !important; - backdrop-filter: blur(14px) !important; - -webkit-backdrop-filter: blur(14px) !important; -} + display: grid; + grid-template-columns: repeat(6, minmax(0, 1fr)); + width: min(1036px, 100%); + min-height: 148px; + overflow: hidden; + border: 1px solid rgba(30, 189, 219, 0.13); + border-radius: 18px; + background: rgba(254, 255, 255, 0.92); + box-shadow: 0 18px 42px rgba(16, 115, 204, 0.08); + backdrop-filter: blur(14px); + -webkit-backdrop-filter: blur(14px)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button { - position: relative !important; - display: flex !important; - align-items: center !important; - justify-content: center !important; - gap: 9px !important; - min-width: 0 !important; - min-height: 74px !important; - padding: 14px 12px !important; - border: 0 !important; - border-radius: 0 !important; - color: #172636 !important; - background: transparent !important; - font-family: "PingFang SC", "Microsoft YaHei", sans-serif !important; - cursor: default !important; - transition: background 0.22s ease, color 0.22s ease !important; -} + position: relative; + display: flex; + align-items: center; + justify-content: center; + gap: 9px; + min-width: 0; + min-height: 74px; + padding: 14px 12px; + border: 0; + border-radius: 0; + color: var(--ecom-bg-dark-blue); + background: transparent; + font-family: "PingFang SC", "Microsoft YaHei", sans-serif; + cursor: default; + transition: background 0.22s ease, color 0.22s ease} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:not(:nth-child(6n + 1))::before { - position: absolute !important; - top: 14px !important; - bottom: 14px !important; - left: 0 !important; - width: 1px !important; - content: "" !important; - background: rgba(30, 189, 219, 0.12) !important; -} + position: absolute; + top: 14px; + bottom: 14px; + left: 0; + width: 1px; + content: ""; + background: rgba(30, 189, 219, 0.12)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:nth-child(n + 7)::after { - position: absolute !important; - top: 0 !important; - left: 16px !important; - right: 16px !important; - height: 1px !important; - content: "" !important; - background: rgba(30, 189, 219, 0.12) !important; -} + position: absolute; + top: 0; + left: 16px; + right: 16px; + height: 1px; + content: ""; + background: rgba(30, 189, 219, 0.12)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:hover { - color: #1073cc !important; - background: rgba(30, 189, 219, 0.09) !important; -} + color: var(--ecom-primary); + background: rgba(30, 189, 219, 0.09)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button span { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - flex: 0 0 auto !important; - width: 20px !important; - height: 20px !important; - color: currentColor !important; - font-size: 18px !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + flex: 0 0 auto; + width: 20px; + height: 20px; + color: currentColor; + font-size: 18px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button strong { - overflow: hidden !important; - color: currentColor !important; - font-size: 13px !important; - font-weight: 600 !important; - line-height: 1.2 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; -} + overflow: hidden; + color: currentColor; + font-size: 13px; + font-weight: 600; + line-height: 1.2; + text-overflow: ellipsis; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated .ecom-command-quick-board, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-compact .ecom-command-quick-board { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { - grid-row: 1 / 3 !important; - min-height: 96px !important; - max-height: 183px !important; - padding: 10px 0 58px !important; - font-size: 14px !important; - line-height: 1.55 !important; -} + grid-row: 1 / 3; + min-height: 96px; + max-height: 183px; + padding: 10px 0 58px; + font-size: 14px; + line-height: 1.55} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { - min-height: auto !important; - padding-top: 8px !important; -} + min-height: auto; + padding-top: 8px} /* Match the target top spacing. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-before-generate { - top: clamp(-28px, -1.6vh, -12px) !important; - transform: translateX(-50%) !important; -} + top: clamp(-28px, -1.6vh, -12px); + transform: translateX(-50%)} /* Set-mode settings should read as a vertical category list. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-set { - grid-template-columns: minmax(0, 1fr) !important; - width: min(420px, calc(100vw - 56px)) !important; - max-width: min(420px, calc(100vw - 56px)) !important; - max-height: 360px !important; -} + grid-template-columns: minmax(0, 1fr); + width: min(420px, calc(100vw - 56px)); + max-width: min(420px, calc(100vw - 56px)); + max-height: 360px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--settings.ecom-command-popover--settings-set:has(> .ecom-command-count-row) { - grid-template-columns: minmax(0, 1fr) !important; - width: min(420px, calc(100vw - 56px)) !important; - max-width: min(420px, calc(100vw - 56px)) !important; -} + grid-template-columns: minmax(0, 1fr); + width: min(420px, calc(100vw - 56px)); + max-width: min(420px, calc(100vw - 56px))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-set > .ecom-command-count-row { - grid-column: 1 !important; - min-height: 64px !important; - padding: 10px 12px !important; -} + grid-column: 1; + min-height: 64px; + padding: 10px 12px} /* Upload action: keep only a larger plus sign. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline { - width: 28px !important; - min-width: 28px !important; - max-width: 28px !important; - height: 34px !important; - min-height: 34px !important; - padding: 0 !important; - border: 0 !important; - border-radius: 0 !important; - color: #10202c !important; - background: transparent !important; - box-shadow: none !important; -} + width: 28px; + min-width: 28px; + max-width: 28px; + height: 34px; + min-height: 34px; + padding: 0; + border: 0; + border-radius: 0; + color: var(--ecom-text-primary); + background: transparent; + box-shadow: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline:hover, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline.has-images, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline.is-dragging { - border: 0 !important; - color: #1073cc !important; - background: transparent !important; - box-shadow: none !important; -} + border: 0; + color: var(--ecom-primary); + background: transparent; + box-shadow: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline span { - font-size: 28px !important; - font-weight: 500 !important; - line-height: 1 !important; -} + font-size: 28px; + font-weight: 500; + line-height: 1} /* Platform popover: center short labels while allowing long labels to keep their natural width. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--platform button { - justify-content: center !important; - gap: 4px !important; - text-align: center !important; -} + justify-content: center; + gap: 4px; + text-align: center} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--platform .ecom-platform-name { - text-align: center !important; -} + text-align: center} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--platform .ecom-platform-logo-mark--duo { - flex-basis: 28px !important; - width: 28px !important; - gap: 0 !important; -} + flex-basis: 28px; + width: 28px; + gap: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--platform .ecom-platform-logo-mark--duo img + img { - margin-left: -12px !important; -} + margin-left: -12px} /* Uploaded state: place thumbnails at the upper-left and move the prompt below them. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - grid-template-rows: 99px minmax(44px, auto) auto !important; - row-gap: 8px !important; - min-height: 276px !important; - padding: 32px 20px 16px !important; -} + grid-template-rows: 99px minmax(44px, auto) auto; + row-gap: 8px; + min-height: 276px; + padding: 32px 20px 16px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover { - grid-row: 1 !important; - align-self: start !important; - display: flex !important; - align-items: flex-start !important; - justify-content: flex-start !important; - gap: 10px !important; - width: max-content !important; - max-width: 100% !important; - min-height: 82px !important; - max-height: 86px !important; - padding: 0 0 0 14px !important; - overflow: visible !important; - border: 0 !important; - background: transparent !important; -} + grid-row: 1; + align-self: start; + display: flex; + align-items: flex-start; + justify-content: flex-start; + gap: 10px; + width: max-content; + max-width: 100%; + min-height: 82px; + max-height: 86px; + padding: 0 0 0 14px; + overflow: visible; + border: 0; + background: transparent} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb { - flex: 0 0 78px !important; - width: 78px !important; - height: 78px !important; - border-radius: 12px !important; -} + flex: 0 0 78px; + width: 78px; + height: 78px; + border-radius: 12px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb img, .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb video { - border-radius: 12px !important; -} + border-radius: 12px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add { - flex: 0 0 44px !important; - width: 44px !important; - height: 44px !important; - min-height: 44px !important; - margin-top: 18px !important; -} + flex: 0 0 44px; + width: 44px; + height: 44px; + min-height: 44px; + margin-top: 18px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { - grid-row: 2 !important; - min-height: 44px !important; - max-height: 72px !important; - padding: 6px 0 0 !important; -} + grid-row: 2; + min-height: 44px; + max-height: 72px; + padding: 6px 0 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-toolbar { - grid-row: 3 !important; - min-height: 42px !important; - padding-top: 8px !important; -} + grid-row: 3; + min-height: 42px; + padding-top: 8px} /* Generated-state final guard: fixed positioning so the composer never goes behind the topbar. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated { - position: fixed !important; - top: calc(var(--ecommerce-topbar-height, 64px) + 10px) !important; - left: calc(50vw + var(--ecom-history-offset, 0px)) !important; - transform: translateX(-50%) !important; - z-index: 90 !important; -} + position: fixed; + top: calc(var(--ecommerce-topbar-height, 64px) + 10px); + left: calc(50vw + var(--ecom-history-offset, 0px)); + transform: translateX(-50%); + z-index: 90} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact { - gap: 0 !important; -} + gap: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-title { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - grid-template-rows: 44px 22px 34px !important; - row-gap: 4px !important; - min-height: 118px !important; - max-height: 126px !important; - padding: 10px 18px 10px !important; - overflow: visible !important; - border-radius: 22px !important; - border: 1px solid rgba(30, 189, 219, 0.14) !important; - background: rgba(254, 255, 255, 0.94) !important; + grid-template-rows: 44px 22px 34px; + row-gap: 4px; + min-height: 118px; + max-height: 126px; + padding: 10px 18px 10px; + overflow: visible; + border-radius: 22px; + border: 1px solid rgba(30, 189, 219, 0.14); + background: rgba(254, 255, 255, 0.94); box-shadow: 0 8px 32px rgba(16, 115, 204, 0.07), - 0 2px 8px rgba(16, 115, 204, 0.04) !important; - backdrop-filter: blur(16px) !important; - -webkit-backdrop-filter: blur(16px) !important; -} + 0 2px 8px rgba(16, 115, 204, 0.04); + backdrop-filter: blur(16px); + -webkit-backdrop-filter: blur(16px)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-popover, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover { - grid-row: 1 !important; - min-height: 44px !important; - max-height: 44px !important; - padding: 0 !important; - overflow: visible !important; - background: transparent !important; -} + grid-row: 1; + min-height: 44px; + max-height: 44px; + padding: 0; + overflow: visible; + background: transparent} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb { - flex: 0 0 44px !important; - width: 44px !important; - height: 44px !important; -} + flex: 0 0 44px; + width: 44px; + height: 44px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-add, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add { - flex: 0 0 34px !important; - width: 34px !important; - height: 34px !important; - min-height: 34px !important; - margin-top: 5px !important; -} + flex: 0 0 34px; + width: 34px; + height: 34px; + min-height: 34px; + margin-top: 5px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-composer textarea, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { - grid-row: 2 !important; - min-height: 22px !important; - max-height: 22px !important; - padding: 0 !important; - overflow: hidden !important; - font-size: 14px !important; - line-height: 22px !important; - white-space: nowrap !important; - text-overflow: ellipsis !important; -} + grid-row: 2; + min-height: 22px; + max-height: 22px; + padding: 0; + overflow: hidden; + font-size: 14px; + line-height: 22px; + white-space: nowrap; + text-overflow: ellipsis} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-toolbar, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-toolbar { - grid-row: 3 !important; - min-height: 34px !important; - padding-top: 2px !important; -} + grid-row: 3; + min-height: 34px; + padding-top: 2px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview[data-status="done"] { - padding-top: 138px !important; -} + padding-top: 138px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview[data-status="done"]:has(.ecom-command-composer-wrap:not(.is-compact)) { - padding-top: 320px !important; -} + padding-top: 320px} /* Generated composer top alignment: compensate preview padding so the box sits below the topbar. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview[data-status="done"] .ecom-command-composer-wrap.has-generated { - top: calc(var(--ecommerce-topbar-height, 64px) + 10px) !important; -} + top: calc(var(--ecommerce-topbar-height, 64px) + 10px)} .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: calc(var(--ecommerce-topbar-height, 64px) + 10px) !important; -} + top: calc(var(--ecommerce-topbar-height, 64px) + 10px)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history { - z-index: 80 !important; - pointer-events: auto !important; -} + z-index: 80; + pointer-events: auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__tools, .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, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list button { - pointer-events: auto !important; -} + pointer-events: auto} /* Right generation history: explicit functional panel with a visible collapsed handle. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] { - --ecom-history-panel-width: 292px; -} + --ecom-history-panel-width: 292px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history { - position: fixed !important; - top: 0 !important; - right: 0 !important; - bottom: 0 !important; - z-index: 90 !important; - display: grid !important; - grid-template-rows: auto auto auto minmax(0, 1fr) !important; - width: var(--ecom-history-panel-width) !important; - overflow: visible !important; - border-left: 1px solid rgba(30, 189, 219, 0.18) !important; - background: rgba(254, 255, 255, 0.96) !important; - box-shadow: -18px 0 42px rgba(16, 115, 204, 0.08) !important; - backdrop-filter: blur(18px) !important; - -webkit-backdrop-filter: blur(18px) !important; - transform: translateX(0) !important; + position: fixed; + top: 0; + right: 0; + bottom: 0; + z-index: 90; + display: grid; + grid-template-rows: auto auto auto minmax(0, 1fr); + width: var(--ecom-history-panel-width); + overflow: visible; + border-left: 1px solid rgba(30, 189, 219, 0.18); + background: rgba(254, 255, 255, 0.96); + box-shadow: -18px 0 42px rgba(16, 115, 204, 0.08); + backdrop-filter: blur(18px); + -webkit-backdrop-filter: blur(18px); + transform: translateX(0); transition: transform 520ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 360ms ease, - border-color 360ms ease !important; -} + border-color 360ms ease} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history { - transform: translateX(100%) !important; - box-shadow: none !important; -} + transform: translateX(100%); + box-shadow: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__backdrop { - position: fixed !important; - inset: 0 !important; - z-index: 85 !important; - background: rgba(16, 38, 56, 0.28) !important; - backdrop-filter: blur(2px) !important; - -webkit-backdrop-filter: blur(2px) !important; - animation: ecommerce-soft-scrim-in 240ms ease-out both !important; -} + position: fixed; + inset: 0; + z-index: 85; + background: rgba(16, 38, 56, 0.28); + backdrop-filter: blur(2px); + -webkit-backdrop-filter: blur(2px); + animation: ecommerce-soft-scrim-in 240ms ease-out both} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__tools { - display: grid !important; - grid-template-columns: 40px minmax(0, 1fr) 40px !important; - align-items: center !important; - gap: 8px !important; - padding: 12px 12px 10px !important; - border-bottom: 0 !important; - background: transparent !important; -} + display: grid; + grid-template-columns: 40px minmax(0, 1fr) 40px; + align-items: center; + gap: 8px; + padding: 12px 12px 10px; + border-bottom: 0; + background: transparent} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__tools button { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - min-width: 0 !important; - min-height: 38px !important; - height: 38px !important; - border: 1px solid rgba(30, 189, 219, 0.22) !important; - border-radius: 13px !important; - color: #10202c !important; - background: #f3f8fa !important; - box-shadow: none !important; - font-size: 14px !important; - font-weight: 600 !important; - cursor: pointer !important; + display: inline-flex; + align-items: center; + justify-content: center; + min-width: 0; + min-height: 38px; + height: 38px; + border: 1px solid rgba(30, 189, 219, 0.22); + border-radius: 13px; + color: var(--ecom-text-primary); + background: var(--ecom-bg-cool); + box-shadow: none; + font-size: 14px; + font-weight: 600; + cursor: pointer; transition: transform 180ms ease, border-color 220ms ease, background 220ms ease, - color 220ms ease !important; -} + color 220ms ease} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__tools button:hover { - border-color: rgba(30, 189, 219, 0.5) !important; - color: #1073cc !important; - background: rgba(30, 189, 219, 0.1) !important; - transform: translateY(-1px) !important; -} + border-color: rgba(30, 189, 219, 0.5); + color: var(--ecom-primary); + background: rgba(30, 189, 219, 0.1); + transform: translateY(-1px)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__toggle { - position: static !important; - width: 40px !important; - min-width: 40px !important; - padding: 0 !important; - font-size: 25px !important; - line-height: 1 !important; -} + position: static; + width: 40px; + min-width: 40px; + padding: 0; + font-size: 25px; + line-height: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__toggle { - position: absolute !important; - top: 50% !important; - left: -52px !important; - right: auto !important; - z-index: 100 !important; - width: 42px !important; - height: 42px !important; - min-height: 42px !important; - border-radius: 15px !important; - background: #feffff !important; - box-shadow: 0 16px 34px rgba(16, 115, 204, 0.14) !important; - transform: translateY(-50%) !important; - pointer-events: auto !important; - visibility: visible !important; - opacity: 1 !important; -} + position: absolute; + top: 50%; + left: -52px; + right: auto; + z-index: 100; + width: 42px; + height: 42px; + min-height: 42px; + border-radius: 15px; + background: var(--ecom-bg-near-white); + box-shadow: 0 16px 34px rgba(16, 115, 204, 0.14); + transform: translateY(-50%); + pointer-events: auto; + visibility: visible; + opacity: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__new, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__refresh, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__heading, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__refresh-note, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__list { - opacity: 0 !important; - visibility: hidden !important; - pointer-events: none !important; -} + opacity: 0; + visibility: hidden; + pointer-events: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__new { - border-color: rgba(30, 189, 219, 0.46) !important; - color: #0f6678 !important; - background: rgba(30, 189, 219, 0.12) !important; -} + border-color: rgba(30, 189, 219, 0.46); + color: #0f6678; + background: rgba(30, 189, 219, 0.12)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__refresh { - font-size: 18px !important; -} + font-size: 18px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__refresh.is-refreshing { - color: #1073cc !important; - background: rgba(30, 189, 219, 0.14) !important; - animation: ecom-history-refresh-spin 680ms linear infinite !important; - cursor: wait !important; -} + color: var(--ecom-primary); + background: rgba(30, 189, 219, 0.14); + animation: ecom-history-refresh-spin 680ms linear infinite; + cursor: wait} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__refresh:disabled { - opacity: 0.78 !important; -} + opacity: 0.78} @keyframes ecom-history-refresh-spin { from { - transform: rotate(0deg); - } + transform: rotate(0deg)} to { - transform: rotate(360deg); - } + transform: rotate(360deg)} } .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__heading { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; - gap: 12px !important; - margin: 2px 12px 10px !important; - padding: 12px 12px !important; - border: 1px solid rgba(30, 189, 219, 0.14) !important; - border-radius: 14px !important; - background: #f8f9fa !important; -} + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + margin: 2px 12px 10px; + padding: 12px 12px; + border: 1px solid rgba(30, 189, 219, 0.14); + border-radius: 14px; + background: var(--ecom-bg-page)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__heading strong { - color: #10202c !important; - font-size: 14px !important; - font-weight: 700 !important; -} + color: var(--ecom-text-primary); + font-size: 14px; + font-weight: 700} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__heading span { - color: #68818f !important; - font-size: 12px !important; - font-weight: 500 !important; -} + color: #68818f; + font-size: 12px; + font-weight: 500} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__refresh-note { - margin: -2px 12px 10px !important; - padding: 8px 10px !important; - border: 1px solid rgba(30, 189, 219, 0.18) !important; - border-radius: 12px !important; - color: #0f6678 !important; - background: rgba(30, 189, 219, 0.08) !important; - font-size: 12px !important; - font-weight: 500 !important; - text-align: center !important; - animation: ecommerce-soft-drop-in 260ms ease-out both !important; -} + margin: -2px 12px 10px; + padding: 8px 10px; + border: 1px solid rgba(30, 189, 219, 0.18); + border-radius: 12px; + color: #0f6678; + background: rgba(30, 189, 219, 0.08); + font-size: 12px; + font-weight: 500; + text-align: center; + animation: ecommerce-soft-drop-in 260ms ease-out both} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list { - display: grid !important; - align-content: start !important; - gap: 8px !important; - min-height: 0 !important; - overflow: auto !important; - padding: 0 12px 18px !important; - background: transparent !important; -} + display: grid; + align-content: start; + gap: 8px; + min-height: 0; + overflow: auto; + padding: 0 12px 18px; + background: transparent} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list button { - display: grid !important; - gap: 6px !important; - min-height: 66px !important; - padding: 12px 12px !important; - border: 1px solid rgba(30, 189, 219, 0.12) !important; - border-radius: 14px !important; - color: #10202c !important; - background: #feffff !important; - box-shadow: 0 8px 20px rgba(16, 115, 204, 0.045) !important; - text-align: left !important; - cursor: pointer !important; -} + display: grid; + gap: 6px; + min-height: 66px; + padding: 12px 12px; + border: 1px solid rgba(30, 189, 219, 0.12); + border-radius: 14px; + color: var(--ecom-text-primary); + background: var(--ecom-bg-near-white); + box-shadow: 0 8px 20px rgba(16, 115, 204, 0.045); + text-align: left; + cursor: pointer} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list button:hover, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list button.is-active { - border-color: rgba(30, 189, 219, 0.38) !important; - background: rgba(30, 189, 219, 0.1) !important; -} + border-color: rgba(30, 189, 219, 0.38); + background: rgba(30, 189, 219, 0.1)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item { - position: relative !important; - display: grid !important; - grid-template-columns: 1fr auto !important; - align-items: stretch !important; -} + position: relative; + display: grid; + grid-template-columns: 1fr auto; + align-items: stretch} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-main { - grid-column: 1 / -1 !important; - grid-row: 1 !important; -} + grid-column: 1 / -1; + grid-row: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete { - grid-column: 2 !important; - grid-row: 1 !important; - z-index: 2 !important; - align-self: center !important; - width: 28px !important; - height: 28px !important; - min-height: 28px !important; - margin-right: 6px !important; - padding: 0 !important; - border: none !important; - border-radius: 6px !important; - color: #99a8b2 !important; - background: rgba(255, 255, 255, 0.92) !important; - box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08) !important; - font-size: 13px !important; - cursor: pointer !important; - opacity: 0 !important; - transition: opacity 160ms ease, color 120ms ease, background 120ms ease !important; - pointer-events: none !important; -} + grid-column: 2; + grid-row: 1; + z-index: 2; + align-self: center; + width: 28px; + height: 28px; + min-height: 28px; + margin-right: 6px; + padding: 0; + border: none; + border-radius: 6px; + color: #99a8b2; + background: rgba(255, 255, 255, 0.92); + box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08); + font-size: 13px; + cursor: pointer; + opacity: 0; + transition: opacity 160ms ease, color 120ms ease, background 120ms ease; + pointer-events: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item:hover .ecom-command-history__item-delete { - opacity: 1 !important; - pointer-events: auto !important; -} + opacity: 1; + pointer-events: auto} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete:hover { - color: #ff4d4f !important; - background: rgba(255, 77, 79, 0.1) !important; -} + color: #ff4d4f; + background: rgba(255, 77, 79, 0.1)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item.is-active .ecom-command-history__item-main { - border-color: rgba(30, 189, 219, 0.42) !important; - background: rgba(30, 189, 219, 0.12) !important; -} + border-color: rgba(30, 189, 219, 0.42); + background: rgba(30, 189, 219, 0.12)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list strong { - display: block !important; - overflow: hidden !important; - color: #10202c !important; - font-size: 14px !important; - font-weight: 700 !important; - line-height: 1.35 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; -} + display: block; + overflow: hidden; + color: var(--ecom-text-primary); + font-size: 14px; + font-weight: 700; + line-height: 1.35; + text-overflow: ellipsis; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list span { - overflow: hidden !important; - color: #68818f !important; - font-size: 12px !important; - font-weight: 500 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; -} + overflow: hidden; + color: #68818f; + font-size: 12px; + font-weight: 500; + text-overflow: ellipsis; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__empty { - margin: 0 !important; - padding: 26px 12px !important; - border: 1px dashed rgba(30, 189, 219, 0.24) !important; - border-radius: 14px !important; - color: #68818f !important; - background: #f8f9fa !important; - font-size: 13px !important; - font-weight: 500 !important; - text-align: center !important; -} + margin: 0; + padding: 26px 12px; + border: 1px dashed rgba(30, 189, 219, 0.24); + border-radius: 14px; + color: #68818f; + background: var(--ecom-bg-page); + font-size: 13px; + font-weight: 500; + text-align: center} /* Platform menu: logos only appear in the popover, and the list opens fully without scrollbars. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform { - grid-template-columns: repeat(4, 132px) !important; - align-items: start !important; - justify-items: stretch !important; - gap: 10px !important; - width: max-content !important; - min-width: 0 !important; - max-width: calc(100vw - 96px) !important; - max-height: none !important; - overflow: visible !important; - overflow-x: visible !important; - overflow-y: visible !important; -} + grid-template-columns: repeat(4, 132px); + align-items: start; + justify-items: stretch; + gap: 10px; + width: max-content; + min-width: 0; + max-width: calc(100vw - 96px); + max-height: none; + overflow: visible; + overflow-x: visible; + overflow-y: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform button { - width: 100% !important; - min-width: 0 !important; - max-width: none !important; - overflow: hidden !important; - justify-content: flex-start !important; - gap: 8px !important; - padding: 8px 10px !important; - white-space: nowrap !important; -} + width: 100%; + min-width: 0; + max-width: none; + overflow: hidden; + justify-content: flex-start; + gap: 8px; + padding: 8px 10px; + white-space: nowrap} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark { - position: relative !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - flex: 0 0 30px !important; - width: 30px !important; - height: 30px !important; - padding: 0 !important; - border-radius: 9px !important; - overflow: visible !important; - color: #fff !important; - background: transparent !important; - box-shadow: 0 8px 18px rgba(16, 32, 44, 0.12) !important; -} + position: relative; + display: inline-flex; + align-items: center; + justify-content: center; + flex: 0 0 30px; + width: 30px; + height: 30px; + padding: 0; + border-radius: 9px; + overflow: visible; + color: var(--ecom-bg-white); + background: transparent; + box-shadow: 0 8px 18px rgba(16, 32, 44, 0.12)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--duo { - flex-basis: 45px !important; - width: 45px !important; - gap: 3px !important; -} + flex-basis: 45px; + width: 45px; + gap: 3px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark__tile { - position: relative !important; - display: inline-grid !important; - place-items: center !important; - width: 30px !important; - height: 30px !important; - border-radius: 9px !important; - color: #fff !important; - font-size: 14px !important; - font-weight: 900 !important; - line-height: 1 !important; - letter-spacing: 0 !important; - text-shadow: 0 1px 2px rgba(0, 0, 0, 0.18) !important; -} + position: relative; + display: inline-grid; + place-items: center; + width: 30px; + height: 30px; + border-radius: 9px; + color: var(--ecom-bg-white); + font-size: 14px; + font-weight: 900; + line-height: 1; + letter-spacing: 0; + text-shadow: 0 1px 2px rgba(0, 0, 0, 0.18)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--duo .ecom-platform-logo-mark__tile { - width: 21px !important; - height: 30px !important; - border-radius: 8px !important; - font-size: 13px !important; -} + width: 21px; + height: 30px; + border-radius: 8px; + font-size: 13px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark__tile--wide { - font-size: 11px !important; -} + font-size: 11px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--taobao .ecom-platform-logo-mark__tile:first-child { - background: linear-gradient(135deg, #ff8a00, #ff4d00) !important; -} + background: linear-gradient(135deg, #ff8a00, #ff4d00)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--taobao .ecom-platform-logo-mark__tile:last-child { - background: linear-gradient(135deg, #ff3d5f, #c9002b) !important; -} + background: linear-gradient(135deg, #ff3d5f, #c9002b)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--jd .ecom-platform-logo-mark__tile { - background: linear-gradient(135deg, #f22735, #bd0016) !important; -} + background: linear-gradient(135deg, #f22735, #bd0016)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--pdd .ecom-platform-logo-mark__tile { - background: linear-gradient(135deg, #ff5b35, #e60012) !important; -} + background: linear-gradient(135deg, #ff5b35, #e60012)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--douyin .ecom-platform-logo-mark__tile, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--tiktok .ecom-platform-logo-mark__tile { - background: #111318 !important; - text-shadow: -1px 0 #25f4ee, 1px 0 #fe2c55 !important; -} + background: #111318; + text-shadow: -1px 0 #25f4ee, 1px 0 #fe2c55} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--amazon .ecom-platform-logo-mark__tile { - align-items: start !important; - padding-top: 5px !important; - background: #18202a !important; - font-family: Arial, Helvetica, sans-serif !important; - font-size: 19px !important; -} + align-items: start; + padding-top: 5px; + background: #18202a; + font-family: Arial, Helvetica, sans-serif; + font-size: 19px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--amazon::after { - content: "" !important; - position: absolute !important; - left: 8px !important; - right: 7px !important; - bottom: 7px !important; - height: 5px !important; - border-bottom: 2px solid #ff9900 !important; - border-radius: 0 0 999px 999px !important; - transform: rotate(-8deg) !important; -} + content: ""; + position: absolute; + left: 8px; + right: 7px; + bottom: 7px; + height: 5px; + border-bottom: 2px solid #ff9900; + border-radius: 0 0 999px 999px; + transform: rotate(-8deg)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--shopee .ecom-platform-logo-mark__tile { - background: linear-gradient(135deg, #ff7043, #ee4d2d) !important; -} + background: linear-gradient(135deg, #ff7043, #ee4d2d)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--shopee::before { - content: "" !important; - position: absolute !important; - top: 5px !important; - left: 9px !important; - width: 12px !important; - height: 8px !important; - border: 2px solid rgba(255, 255, 255, 0.9) !important; - border-bottom: 0 !important; - border-radius: 999px 999px 0 0 !important; - z-index: 2 !important; -} + content: ""; + position: absolute; + top: 5px; + left: 9px; + width: 12px; + height: 8px; + border: 2px solid rgba(255, 255, 255, 0.9); + border-bottom: 0; + border-radius: 999px 999px 0 0; + z-index: 2} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--lazada .ecom-platform-logo-mark__tile { - background: linear-gradient(135deg, #2335d6, #8b2cff 48%, #ff7a00) !important; -} + background: linear-gradient(135deg, #2335d6, #8b2cff 48%, #ff7a00)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--instagram .ecom-platform-logo-mark__tile { - background: radial-gradient(circle at 28% 92%, #ffd86b 0 22%, transparent 23%), linear-gradient(135deg, #405de6, #833ab4 38%, #e1306c 68%, #fd1d1d 84%, #fcb045) !important; - font-size: 10px !important; -} + background: radial-gradient(circle at 28% 92%, #ffd86b 0 22%, transparent 23%), linear-gradient(135deg, #405de6, #833ab4 38%, #e1306c 68%, #fd1d1d 84%, #fcb045); + font-size: 10px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--aliexpress .ecom-platform-logo-mark__tile { - background: linear-gradient(135deg, #ff4f1f, #d71920) !important; - font-size: 10px !important; -} + background: linear-gradient(135deg, #ff4f1f, #d71920); + font-size: 10px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--ebay .ecom-platform-logo-mark__tile { - background: #fff !important; - color: #1d60b8 !important; - text-shadow: 1px 0 #e53238, 2px 0 #f5af02, 3px 0 #86b817 !important; -} + background: var(--ecom-bg-white); + color: #1d60b8; + text-shadow: 1px 0 #e53238, 2px 0 #f5af02, 3px 0 #86b817} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--platform .ecom-platform-logo-mark--default .ecom-platform-logo-mark__tile { - background: linear-gradient(135deg, #18b7d6, #1073cc) !important; -} + background: linear-gradient(135deg, #18b7d6, var(--ecom-primary))} /* Language menu: show all rows directly, no inner scrollbar. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages { - max-height: none !important; - overflow: visible !important; - overflow-x: visible !important; - overflow-y: visible !important; - scrollbar-gutter: auto !important; -} + max-height: none; + overflow: visible; + overflow-x: visible; + overflow-y: visible; + scrollbar-gutter: auto} /* Command menus: every option panel expands fully instead of using inner scrollbars. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover, @@ -4237,59 +3677,53 @@ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-module-grid--video, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-levels, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-hot-thumb-grid { - max-height: none !important; - overflow: visible !important; - overflow-x: visible !important; - overflow-y: visible !important; - scrollbar-gutter: auto !important; -} + max-height: none; + overflow: visible; + overflow-x: visible; + overflow-y: visible; + scrollbar-gutter: auto} /* Soft premium motion: brand halo, credit shimmer, and active-tag glints. */ .ecommerce-standalone .ecommerce-standalone__logo { - position: relative !important; - overflow: visible !important; - isolation: isolate !important; -} + position: relative; + overflow: visible; + isolation: isolate} .ecommerce-standalone .ecommerce-standalone__logo::before { - position: absolute !important; - inset: -7px !important; - z-index: -1 !important; - display: block !important; - border-radius: 999px !important; - content: "" !important; + position: absolute; + inset: -7px; + z-index: -1; + display: block; + border-radius: 999px; + content: ""; background: - radial-gradient(circle, rgba(30, 189, 219, 0.28), rgba(16, 115, 204, 0.12) 44%, transparent 70%) !important; - filter: blur(2px) !important; - opacity: 0.52 !important; - transform: scale(0.92) !important; - animation: ecom-brand-halo-breathe 4.8s ease-in-out infinite !important; -} + radial-gradient(circle, rgba(30, 189, 219, 0.28), rgba(16, 115, 204, 0.12) 44%, transparent 70%); + filter: blur(2px); + opacity: 0.52; + transform: scale(0.92); + animation: ecom-brand-halo-breathe 4.8s ease-in-out infinite} .ecommerce-standalone .ecommerce-standalone__credits { - position: relative !important; - overflow: hidden !important; - isolation: isolate !important; -} + position: relative; + overflow: hidden; + isolation: isolate} .ecommerce-standalone .ecommerce-standalone__credits::after { - position: absolute !important; - top: -38% !important; - bottom: -38% !important; - left: -42% !important; - z-index: 1 !important; - width: 34% !important; - pointer-events: none !important; - content: "" !important; - background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.74) 48%, transparent 100%) !important; - transform: translateX(-160%) skewX(-18deg) !important; - animation: ecom-credit-shimmer 7.2s ease-in-out infinite !important; -} + position: absolute; + top: -38%; + bottom: -38%; + left: -42%; + z-index: 1; + width: 34%; + pointer-events: none; + content: ""; + background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.74) 48%, transparent 100%); + transform: translateX(-160%) skewX(-18deg); + animation: ecom-credit-shimmer 7.2s ease-in-out infinite} .ecommerce-standalone .ecommerce-standalone__credits > * { - position: relative !important; - z-index: 2 !important; -} + position: relative; + z-index: 2} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button.is-active, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button.is-active, @@ -4299,10 +3733,9 @@ .ecommerce-standalone .ecommerce-auth-modal__tabs button.is-active, .ecommerce-standalone .ecommerce-auth-modal__methods button.is-active, .ecommerce-standalone .local-profile-tabs button.is-active { - position: relative !important; - overflow: hidden !important; - isolation: isolate !important; -} + position: relative; + overflow: hidden; + isolation: isolate} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button.is-active::after, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button.is-active::after, @@ -4312,18 +3745,17 @@ .ecommerce-standalone .ecommerce-auth-modal__tabs button.is-active::after, .ecommerce-standalone .ecommerce-auth-modal__methods button.is-active::after, .ecommerce-standalone .local-profile-tabs button.is-active::after { - position: absolute !important; - top: -45% !important; - bottom: -45% !important; - left: -46% !important; - z-index: 1 !important; - width: 28% !important; - pointer-events: none !important; - content: "" !important; - background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.72) 48%, transparent 100%) !important; - transform: translateX(-170%) skewX(-18deg) !important; - animation: ecom-active-tag-glint 5.6s ease-in-out infinite !important; -} + position: absolute; + top: -45%; + bottom: -45%; + left: -46%; + z-index: 1; + width: 28%; + pointer-events: none; + content: ""; + background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.72) 48%, transparent 100%); + transform: translateX(-170%) skewX(-18deg); + animation: ecom-active-tag-glint 5.6s ease-in-out infinite} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button.is-active > *, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover button.is-active > *, @@ -4333,4097 +3765,3626 @@ .ecommerce-standalone .ecommerce-auth-modal__tabs button.is-active > *, .ecommerce-standalone .ecommerce-auth-modal__methods button.is-active > *, .ecommerce-standalone .local-profile-tabs button.is-active > * { - position: relative !important; - z-index: 2 !important; -} + position: relative; + z-index: 2} @keyframes ecom-brand-halo-breathe { 0%, 100% { opacity: 0.42; - transform: scale(0.9); - } + transform: scale(0.9)} 50% { opacity: 0.78; - transform: scale(1.16); - } + transform: scale(1.16)} } @keyframes ecom-credit-shimmer { 0%, 62% { - transform: translateX(-180%) skewX(-18deg); - } + transform: translateX(-180%) skewX(-18deg)} 76%, 100% { - transform: translateX(460%) skewX(-18deg); - } + transform: translateX(460%) skewX(-18deg)} } @keyframes ecom-active-tag-glint { 0%, 56% { - transform: translateX(-180%) skewX(-18deg); - } + transform: translateX(-180%) skewX(-18deg)} 72%, 100% { - transform: translateX(480%) skewX(-18deg); - } + transform: translateX(480%) skewX(-18deg)} } /* Model settings: expose model appearance controls inside the command popover. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model { - grid-template-columns: repeat(3, minmax(138px, 1fr)) !important; - width: min(720px, calc(100vw - 56px)) !important; - max-width: min(720px, calc(100vw - 56px)) !important; - margin-left: -128px !important; -} + grid-template-columns: repeat(3, minmax(138px, 1fr)); + width: min(720px, calc(100vw - 56px)); + max-width: min(720px, calc(100vw - 56px)); + margin-left: -128px} .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; -} + grid-column: 1 / -1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model header { - order: 0 !important; -} + order: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile { - order: 1 !important; -} + order: 1} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { - order: 2 !important; -} + order: 2} .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; -} + display: grid; + grid-template-columns: 1fr; + gap: 8px; + padding: 0; + border: 0; + border-radius: 0; + background: transparent} .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; -} + grid-column: 1 / -1; + color: var(--ecom-text-primary); + font-size: 13px; + font-weight: 700} .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; -} + display: grid; + grid-template-columns: 52px minmax(0, 1fr); + align-items: center; + gap: 8px; + min-width: 0; + padding: 0; + border: 0; + border-radius: 0; + background: transparent} .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; -} + color: #526f7e; + font-size: 12px; + font-weight: 700} .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; -} + display: flex; + flex-wrap: wrap; + gap: 6px; + min-width: 0} .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; -} + width: auto; + min-width: 0; + min-height: 32px; + padding: 6px 12px; + font-size: 12px} .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; -} + display: grid; + gap: 7px; + padding: 0; + border: 0; + border-radius: 0; + background: transparent} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-text > strong { - order: 0 !important; -} + order: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-text > textarea { - order: 1 !important; -} + order: 1} .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; - background: #f3f8fa !important; - font-family: "PingFang SC", "Microsoft YaHei", sans-serif !important; - font-size: 13px !important; - font-weight: 500 !important; - line-height: 1.45 !important; -} + min-height: 58px; + resize: vertical; + border: 1px solid rgba(30, 189, 219, 0.22); + border-radius: 13px; + padding: 10px 12px; + color: #122534; + background: var(--ecom-bg-cool); + font-family: "PingFang SC", "Microsoft YaHei", sans-serif; + font-size: 13px; + font-weight: 500; + line-height: 1.45} /* Smart cutout quick tool: standalone upload and editor flow. */ .ecommerce-standalone .product-clone-page[data-tool="clone"].is-smart-cutout-page { - display: block !important; - width: 100% !important; - min-width: 100% !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - overflow: hidden !important; - background: #feffff !important; -} + display: block; + width: 100%; + min-width: 100%; + height: 100%; + min-height: calc(100vh - 58px); + overflow: hidden; + background: var(--ecom-bg-near-white)} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-smart-cutout-page .product-clone-shell { - display: block !important; - width: 100% !important; - min-width: 100% !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - padding: 0 !important; -} + display: block; + width: 100%; + min-width: 100%; + height: 100%; + min-height: calc(100vh - 58px); + padding: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-smart-cutout-page .product-clone-rail, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-smart-cutout-page .product-clone-panel, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-smart-cutout-page .clone-ai-settings-toggle, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-smart-cutout-page .ecom-command-history { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-smart-cutout-page .ecom-command-hidden-file { - position: absolute !important; - width: 1px !important; - height: 1px !important; - overflow: hidden !important; - opacity: 0 !important; - pointer-events: none !important; -} + position: absolute; + width: 1px; + height: 1px; + overflow: hidden; + opacity: 0; + pointer-events: none} /* Product set quick tool: standalone task page. */ .ecommerce-standalone .product-clone-page[data-tool="clone"].is-quick-set-page { - display: block !important; - overflow: hidden !important; - background: #f3f5f8 !important; -} + display: block; + overflow: hidden; + background: #f3f5f8} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-quick-set-page .product-clone-shell { - display: block !important; - width: 100% !important; - height: 100% !important; - padding: 0 !important; -} + display: block; + width: 100%; + height: 100%; + padding: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-quick-set-page .product-clone-rail, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-quick-set-page .product-clone-panel, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-quick-set-page .clone-ai-settings-toggle, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-quick-set-page .ecom-command-history { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-watermark-page { - display: block !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - overflow: hidden !important; - background: #f8f9fa !important; -} + display: block; + height: 100%; + min-height: calc(100vh - 58px); + overflow: hidden; + background: var(--ecom-bg-page)} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-watermark-page .product-clone-shell { - display: block !important; - width: 100% !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - padding: 0 !important; -} + display: block; + width: 100%; + height: 100%; + min-height: calc(100vh - 58px); + padding: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-watermark-page .product-clone-rail, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-watermark-page .product-clone-panel, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-watermark-page .clone-ai-settings-toggle, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-watermark-page .ecom-command-history { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-image-workbench-page { - display: block !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - overflow: hidden !important; - background: #f8f9fa !important; -} + display: block; + height: 100%; + min-height: calc(100vh - 58px); + overflow: hidden; + background: var(--ecom-bg-page)} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-image-workbench-page .product-clone-shell { - display: block !important; - width: 100% !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - padding: 0 !important; -} + display: block; + width: 100%; + height: 100%; + min-height: calc(100vh - 58px); + padding: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-image-workbench-page .product-clone-rail, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-image-workbench-page .product-clone-panel, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-image-workbench-page .clone-ai-settings-toggle, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-image-workbench-page .ecom-command-history { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-watermark-page .ecom-command-hidden-file { - position: absolute !important; - width: 1px !important; - height: 1px !important; - overflow: hidden !important; - opacity: 0 !important; - pointer-events: none !important; -} + position: absolute; + width: 1px; + height: 1px; + overflow: hidden; + opacity: 0; + pointer-events: none} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-translate-page { - display: block !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - overflow: hidden !important; - background: #f8f9fa !important; -} + display: block; + height: 100%; + min-height: calc(100vh - 58px); + overflow: hidden; + background: var(--ecom-bg-page)} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-translate-page .product-clone-shell { - display: block !important; - width: 100% !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - padding: 0 !important; -} + display: block; + width: 100%; + height: 100%; + min-height: calc(100vh - 58px); + padding: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-translate-page .product-clone-rail, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-translate-page .product-clone-panel, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-translate-page .clone-ai-settings-toggle, .ecommerce-standalone .product-clone-page[data-tool="clone"].is-translate-page .ecom-command-history { - display: none !important; -} + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-translate-page .ecom-command-hidden-file { - position: absolute !important; - width: 1px !important; - height: 1px !important; - overflow: hidden !important; - opacity: 0 !important; - pointer-events: none !important; -} + position: absolute; + width: 1px; + height: 1px; + overflow: hidden; + opacity: 0; + pointer-events: none} .ecommerce-standalone .product-clone-page[data-tool="clone"].is-image-workbench-page .ecom-command-hidden-file { - position: absolute !important; - width: 1px !important; - height: 1px !important; - overflow: hidden !important; - opacity: 0 !important; - pointer-events: none !important; -} + position: absolute; + width: 1px; + height: 1px; + overflow: hidden; + opacity: 0; + pointer-events: none} /* ── Quick Page Sidebar — shared left nav for set / detail ── */ .ecommerce-standalone .ecom-quick-page-wrap { - position: absolute !important; - inset: 0 !important; - display: flex !important; - min-height: 0 !important; -} + position: absolute; + inset: 0; + display: flex; + min-height: 0} .ecommerce-standalone .ecom-quick-page-sidebar { - display: flex !important; - flex-direction: column !important; - align-items: center !important; - gap: 4px !important; - flex: 0 0 88px !important; - width: 88px !important; - padding: 20px 10px !important; - border-right: 1px solid rgba(30, 189, 219, 0.1) !important; + display: flex; + flex-direction: column; + align-items: center; + gap: 4px; + flex: 0 0 88px; + width: 88px; + padding: 20px 10px; + border-right: 1px solid rgba(30, 189, 219, 0.1); background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 250, 252, 0.94) 50%, - rgba(243, 247, 250, 0.92) 100%) !important; - backdrop-filter: blur(20px) !important; - -webkit-backdrop-filter: blur(20px) !important; -} + rgba(243, 247, 250, 0.92) 100%); + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px)} .ecommerce-standalone .ecom-quick-page-sidebar button { - position: relative !important; - display: flex !important; - flex-direction: column !important; - align-items: center !important; - justify-content: center !important; - gap: 4px !important; - width: 100% !important; - min-height: 66px !important; - padding: 10px 6px !important; - border: 0 !important; - border-radius: 12px !important; - background: transparent !important; - color: #7c8a96 !important; - font-size: 10px !important; - font-family: "PingFang SC", "Microsoft YaHei", sans-serif !important; - font-weight: 500 !important; - letter-spacing: 0.01em !important; - line-height: 1.2 !important; - cursor: pointer !important; + position: relative; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 4px; + width: 100%; + min-height: 66px; + padding: 10px 6px; + border: 0; + border-radius: 12px; + background: transparent; + color: #7c8a96; + font-size: 10px; + font-family: "PingFang SC", "Microsoft YaHei", sans-serif; + font-weight: 500; + letter-spacing: 0.01em; + line-height: 1.2; + cursor: pointer; transition: background 0.22s cubic-bezier(0.16, 1, 0.3, 1), color 0.22s cubic-bezier(0.16, 1, 0.3, 1), transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), - box-shadow 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important; -} + box-shadow 0.22s cubic-bezier(0.16, 1, 0.3, 1)} .ecommerce-standalone .ecom-quick-page-sidebar button .anticon { - font-size: 22px !important; - transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important; -} + font-size: 22px; + transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1)} .ecommerce-standalone .ecom-quick-page-sidebar button span:last-child { - display: block !important; - font-size: 10px !important; - font-weight: 500 !important; - letter-spacing: 0.02em !important; - line-height: 1.2 !important; - white-space: nowrap !important; -} + display: block; + font-size: 10px; + font-weight: 500; + letter-spacing: 0.02em; + line-height: 1.2; + white-space: nowrap} .ecommerce-standalone .ecom-quick-page-sidebar button:hover { - background: rgba(30, 189, 219, 0.07) !important; - color: #0d6bb8 !important; - transform: translateY(-1px) !important; - box-shadow: 0 4px 12px rgba(16, 115, 204, 0.08) !important; -} + background: rgba(30, 189, 219, 0.07); + color: #0d6bb8; + transform: translateY(-1px); + box-shadow: 0 4px 12px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-page-sidebar button:hover .anticon { - transform: scale(1.08) !important; -} + transform: scale(1.08)} .ecommerce-standalone .ecom-quick-page-sidebar button:active { - transform: translateY(0) !important; - box-shadow: none !important; -} + transform: translateY(0); + box-shadow: none} .ecommerce-standalone .ecom-quick-page-sidebar button.is-active { background: linear-gradient(135deg, rgba(16, 115, 204, 0.12) 0%, - rgba(30, 189, 219, 0.08) 100%) !important; - color: #0d6bb8 !important; - font-weight: 700 !important; + rgba(30, 189, 219, 0.08) 100%); + color: #0d6bb8; + font-weight: 700; box-shadow: 0 2px 8px rgba(16, 115, 204, 0.1), - inset 0 1px 0 rgba(255, 255, 255, 0.6) !important; -} + inset 0 1px 0 rgba(255, 255, 255, 0.6)} .ecommerce-standalone .ecom-quick-page-sidebar button.is-active::before { - content: "" !important; - position: absolute !important; - left: 0 !important; - top: 14px !important; - bottom: 14px !important; - width: 3px !important; - border-radius: 0 3px 3px 0 !important; + content: ""; + position: absolute; + left: 0; + top: 14px; + bottom: 14px; + width: 3px; + border-radius: 0 3px 3px 0; background: linear-gradient(180deg, - #1073cc 0%, - #1ebddb 100%) !important; -} + var(--ecom-primary) 0%, + var(--ecom-accent-cyan) 100%)} .ecommerce-standalone .ecom-quick-page-sidebar button.is-active .anticon { - color: #1073cc !important; -} + color: var(--ecom-primary)} .ecommerce-standalone .ecom-quick-page-wrap > :not(.ecom-quick-page-sidebar) { - flex: 1 1 0% !important; - min-width: 0 !important; - min-height: 0 !important; -} + flex: 1 1 0%; + min-width: 0; + min-height: 0} .ecommerce-standalone .ecom-image-workbench-page { - position: relative !important; - display: grid !important; - grid-template-columns: 350px minmax(0, 1fr) !important; - gap: 18px !important; - align-items: stretch !important; - width: 100% !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - box-sizing: border-box !important; - padding: 18px !important; - color: #172636 !important; + position: relative; + display: grid; + grid-template-columns: 350px minmax(0, 1fr); + gap: 18px; + align-items: stretch; + width: 100%; + height: 100%; + min-height: calc(100vh - 58px); + box-sizing: border-box; + padding: 18px; + color: var(--ecom-bg-dark-blue); background: radial-gradient(circle at 54% 48%, rgba(30, 189, 219, 0.07), transparent 28rem), - #f8f9fa !important; - font-family: "PingFang SC", "Microsoft YaHei", sans-serif !important; - animation: ecom-smart-page-enter 440ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + var(--ecom-bg-page); + font-family: "PingFang SC", "Microsoft YaHei", sans-serif; + animation: ecom-smart-page-enter 440ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecom-image-workbench-nav { - display: none !important; -} + display: none} .ecommerce-standalone .ecom-image-workbench-nav button, .ecommerce-standalone .ecom-image-workbench-url-row button { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 7px !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 10px !important; - color: #1073cc !important; - background: #ffffff !important; - box-shadow: 0 8px 20px rgba(16, 115, 204, 0.06) !important; - font-weight: 850 !important; - cursor: pointer !important; - transition: transform 180ms ease, color 180ms ease, background 180ms ease, box-shadow 180ms ease !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + gap: 7px; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 10px; + color: var(--ecom-primary); + background: var(--ecom-bg-white); + box-shadow: 0 8px 20px rgba(16, 115, 204, 0.06); + font-weight: 850; + cursor: pointer; + transition: transform 180ms ease, color 180ms ease, background 180ms ease, box-shadow 180ms ease} .ecommerce-standalone .ecom-image-workbench-nav button { - min-height: 32px !important; - padding: 0 14px !important; - font-size: 13px !important; -} + min-height: 32px; + padding: 0 14px; + font-size: 13px} .ecommerce-standalone .ecom-image-workbench-nav button:hover, .ecommerce-standalone .ecom-image-workbench-url-row button:hover { - color: #ffffff !important; - background: #1073cc !important; - box-shadow: 0 12px 26px rgba(16, 115, 204, 0.18) !important; - transform: translateY(-1px) !important; -} + color: var(--ecom-bg-white); + background: var(--ecom-primary); + box-shadow: 0 12px 26px rgba(16, 115, 204, 0.18); + transform: translateY(-1px)} .ecommerce-standalone .ecom-image-workbench-side { - display: flex !important; - flex-direction: column !important; - gap: 12px !important; - height: 100% !important; - min-height: 0 !important; - padding: 18px 16px !important; - overflow: auto !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 14px !important; + display: flex; + flex-direction: column; + gap: 12px; + height: 100%; + min-height: 0; + padding: 18px 16px; + overflow: auto; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 14px; background: linear-gradient(180deg, rgba(16, 115, 204, 0.055), transparent 180px), - #ffffff !important; - box-shadow: 0 14px 34px rgba(16, 115, 204, 0.08) !important; -} + var(--ecom-bg-white); + box-shadow: 0 14px 34px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-image-workbench-panel-head { - flex: 0 0 auto !important; - margin-bottom: 4px !important; -} + flex: 0 0 auto; + margin-bottom: 4px} .ecommerce-standalone .ecom-image-workbench-intro { - margin: -2px 2px 2px !important; - color: #66798a !important; - font-size: 12px !important; - font-weight: 750 !important; - line-height: 1.65 !important; -} + margin: -2px 2px 2px; + color: var(--ecom-text-muted); + font-size: 12px; + font-weight: 750; + line-height: 1.65} .ecommerce-standalone .ecom-image-workbench-heading { - display: grid !important; - gap: 7px !important; - padding: 2px 2px 6px !important; -} + display: grid; + gap: 7px; + padding: 2px 2px 6px} .ecommerce-standalone .ecom-image-workbench-heading span { - width: fit-content !important; - padding: 3px 9px !important; - border-radius: 999px !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 11px !important; - font-weight: 850 !important; -} + width: fit-content; + padding: 3px 9px; + border-radius: 999px; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 11px; + font-weight: 850} .ecommerce-standalone .ecom-image-workbench-heading strong { - color: #172636 !important; - font-size: 22px !important; - font-weight: 950 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 22px; + font-weight: 950} .ecommerce-standalone .ecom-image-workbench-heading p { - max-width: 286px !important; - margin: 0 !important; - color: #66798a !important; - font-size: 12px !important; - font-weight: 750 !important; - line-height: 1.7 !important; -} + max-width: 286px; + margin: 0; + color: var(--ecom-text-muted); + font-size: 12px; + font-weight: 750; + line-height: 1.7} .ecommerce-standalone .ecom-image-workbench-panel { - display: grid !important; - gap: 12px !important; - padding: 14px !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 12px !important; + display: grid; + gap: 12px; + padding: 14px; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 12px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.5), transparent), - #ffffff !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 10px 28px rgba(16, 115, 204, 0.035) !important; -} + var(--ecom-bg-white); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 10px 28px rgba(16, 115, 204, 0.035)} .ecommerce-standalone .ecom-image-workbench-panel header { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; -} + display: flex; + align-items: center; + justify-content: space-between} .ecommerce-standalone .ecom-image-workbench-panel strong, .ecommerce-standalone .ecom-image-workbench-upload strong { - color: #132435 !important; - font-size: 13px !important; - font-weight: 950 !important; -} + color: #132435; + font-size: 13px; + font-weight: 950} .ecommerce-standalone .ecom-image-workbench-panel header span { - padding: 3px 9px !important; - border-radius: 999px !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 11px !important; - font-weight: 850 !important; -} + padding: 3px 9px; + border-radius: 999px; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 11px; + font-weight: 850} .ecommerce-standalone .ecom-image-workbench-upload { - position: relative !important; - display: grid !important; - grid-template-columns: 74px minmax(0, 1fr) !important; - align-items: center !important; - gap: 12px !important; - min-height: 104px !important; - padding: 12px !important; - border: 1px dashed rgba(30, 189, 219, 0.5) !important; - border-radius: 12px !important; - color: #607485 !important; - background: #fbfdff !important; - cursor: pointer !important; - transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease !important; -} + position: relative; + display: grid; + grid-template-columns: 74px minmax(0, 1fr); + align-items: center; + gap: 12px; + min-height: 104px; + padding: 12px; + border: 1px dashed rgba(30, 189, 219, 0.5); + border-radius: 12px; + color: #607485; + background: var(--ecom-bg-near-white); + cursor: pointer; + transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease} .ecommerce-standalone .ecom-image-workbench-upload:not(.has-image) { - grid-template-columns: 1fr !important; - justify-items: center !important; - text-align: center !important; -} + grid-template-columns: 1fr; + justify-items: center; + text-align: center} .ecommerce-standalone .ecom-image-workbench-upload.is-dragging, .ecommerce-standalone .ecom-image-workbench-upload:hover { - border-color: #1ebddb !important; - background: #f6fcff !important; - box-shadow: 0 12px 28px rgba(16, 115, 204, 0.12) !important; -} + border-color: var(--ecom-accent-cyan); + background: #f6fcff; + box-shadow: 0 12px 28px rgba(16, 115, 204, 0.12)} .ecommerce-standalone .ecom-image-workbench-upload > .anticon { - color: #1ebddb !important; - font-size: 30px !important; -} + color: var(--ecom-accent-cyan); + font-size: 30px} .ecommerce-standalone .ecom-image-workbench-upload figure { - width: 74px !important; - height: 74px !important; - margin: 0 !important; - overflow: hidden !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 10px !important; - background: #f8f9fa !important; -} + width: 74px; + height: 74px; + margin: 0; + overflow: hidden; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 10px; + background: var(--ecom-bg-page)} .ecommerce-standalone .ecom-image-workbench-upload img { - width: 100% !important; - height: 100% !important; - object-fit: cover !important; -} + width: 100%; + height: 100%; + object-fit: cover} .ecommerce-standalone .ecom-image-workbench-upload div { - display: grid !important; - gap: 8px !important; - min-width: 0 !important; -} + display: grid; + gap: 8px; + min-width: 0} .ecommerce-standalone .ecom-image-workbench-upload div strong { - overflow: hidden !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; -} + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap} .ecommerce-standalone .ecom-image-workbench-upload span { - color: #627485 !important; - font-size: 12px !important; - font-weight: 750 !important; -} + color: #627485; + font-size: 12px; + font-weight: 750} .ecommerce-standalone .ecom-image-workbench-remove { - position: absolute !important; - top: 8px !important; - right: 8px !important; - z-index: 2 !important; - display: inline-grid !important; - place-items: center !important; - width: 24px !important; - height: 24px !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 50% !important; - color: #526474 !important; - background: rgba(255, 255, 255, 0.92) !important; - box-shadow: 0 6px 14px rgba(16, 115, 204, 0.12) !important; - font-size: 16px !important; - font-weight: 850 !important; - line-height: 1 !important; - cursor: pointer !important; -} + position: absolute; + top: 8px; + right: 8px; + z-index: 2; + display: inline-grid; + place-items: center; + width: 24px; + height: 24px; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 50%; + color: var(--ecom-text-muted); + background: rgba(255, 255, 255, 0.92); + box-shadow: 0 6px 14px rgba(16, 115, 204, 0.12); + font-size: 16px; + font-weight: 850; + line-height: 1; + cursor: pointer} .ecommerce-standalone .ecom-image-workbench-url-row { - display: grid !important; - grid-template-columns: minmax(0, 1fr) 58px !important; - gap: 8px !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr) 58px; + gap: 8px} .ecommerce-standalone .ecom-image-workbench-url-row input, .ecommerce-standalone .ecom-image-workbench-panel textarea { - width: 100% !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 9px !important; - color: #172636 !important; - background: #f8fafc !important; - outline: none !important; - font-size: 12px !important; - font-weight: 800 !important; -} + width: 100%; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 9px; + color: var(--ecom-bg-dark-blue); + background: #f8fafc; + outline: none; + font-size: 12px; + font-weight: 800} .ecommerce-standalone .ecom-image-workbench-url-row input { - min-height: 36px !important; - padding: 0 12px !important; -} + min-height: 36px; + padding: 0 12px} .ecommerce-standalone .ecom-image-workbench-url-row button { - min-height: 36px !important; - padding: 0 12px !important; - font-size: 12px !important; -} + min-height: 36px; + padding: 0 12px; + font-size: 12px} .ecommerce-standalone .ecom-image-workbench-panel textarea { - min-height: 112px !important; - padding: 12px !important; - resize: vertical !important; - line-height: 1.7 !important; -} + min-height: 112px; + padding: 12px; + resize: vertical; + line-height: 1.7} .ecommerce-standalone .ecom-image-workbench-slider { - display: grid !important; - grid-template-columns: 44px minmax(0, 1fr) 44px !important; - align-items: center !important; - gap: 10px !important; - color: #526474 !important; - font-size: 12px !important; - font-weight: 850 !important; -} + display: grid; + grid-template-columns: 44px minmax(0, 1fr) 44px; + align-items: center; + gap: 10px; + color: var(--ecom-text-muted); + font-size: 12px; + font-weight: 850} .ecommerce-standalone .ecom-image-workbench-slider input { - accent-color: #1ebddb !important; -} + accent-color: var(--ecom-accent-cyan)} .ecommerce-standalone .ecom-image-workbench-slider em { - color: #738392 !important; - font-style: normal !important; - text-align: right !important; -} + color: var(--ecom-text-muted); + font-style: normal; + text-align: right} .ecommerce-standalone .ecom-image-workbench-clear { - min-height: 34px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 9px !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 12px !important; - font-weight: 900 !important; - cursor: pointer !important; -} + min-height: 34px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 9px; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 12px; + font-weight: 900; + cursor: pointer} .ecommerce-standalone .ecom-image-workbench-clear:disabled { - color: #9badba !important; - background: #f1f4f6 !important; - cursor: not-allowed !important; -} + color: #9badba; + background: #f1f4f6; + cursor: not-allowed} .ecommerce-standalone .ecom-image-workbench-ratios { - display: grid !important; - grid-template-columns: repeat(5, minmax(0, 1fr)) !important; - gap: 6px !important; - padding: 4px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 10px !important; - background: #f8fafc !important; -} + display: grid; + grid-template-columns: repeat(5, minmax(0, 1fr)); + gap: 6px; + padding: 4px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 10px; + background: #f8fafc} .ecommerce-standalone .ecom-image-workbench-ratios button { - min-height: 30px !important; - border: 0 !important; - border-radius: 7px !important; - color: #526474 !important; - background: transparent !important; - font-size: 12px !important; - font-weight: 900 !important; -} + min-height: 30px; + border: 0; + border-radius: 7px; + color: var(--ecom-text-muted); + background: transparent; + font-size: 12px; + font-weight: 900} .ecommerce-standalone .ecom-image-workbench-ratios button.is-active { - color: #1073cc !important; - background: #edf8ff !important; - box-shadow: inset 0 0 0 1px rgba(30, 189, 219, 0.22) !important; -} + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + box-shadow: inset 0 0 0 1px rgba(30, 189, 219, 0.22)} .ecommerce-standalone .ecom-image-workbench-primary { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 9px !important; - min-height: 48px !important; - width: 100% !important; - margin-top: 2px !important; - border: 0 !important; - border-radius: 13px !important; - color: #ffffff !important; - background: linear-gradient(135deg, #1073cc, #1ebddb) !important; - box-shadow: 0 18px 38px rgba(16, 115, 204, 0.24) !important; - font-size: 15px !important; - font-weight: 950 !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + gap: 9px; + min-height: 48px; + width: 100%; + margin-top: 2px; + border: 0; + border-radius: 13px; + color: var(--ecom-bg-white); + background: linear-gradient(135deg, var(--ecom-primary), var(--ecom-accent-cyan)); + box-shadow: 0 18px 38px rgba(16, 115, 204, 0.24); + font-size: 15px; + font-weight: 950} .ecommerce-standalone .ecom-image-workbench-primary:disabled { - color: #8ea0ad !important; - background: #edf1f4 !important; - box-shadow: none !important; -} + color: #8ea0ad; + background: #edf1f4; + box-shadow: none} .ecommerce-standalone .ecom-image-workbench-stage { - display: grid !important; - place-items: stretch !important; - min-width: 0 !important; - min-height: 0 !important; - height: 100% !important; - padding: 0 !important; - overflow: hidden !important; - border: none !important; - border-radius: 0 !important; - background: #f8f9fa !important; - box-shadow: none !important; -} + display: grid; + place-items: stretch; + min-width: 0; + min-height: 0; + height: 100%; + padding: 0; + overflow: hidden; + border: none; + border-radius: 0; + background: var(--ecom-bg-page); + box-shadow: none} .ecommerce-standalone .ecom-image-workbench-canvas { - position: relative !important; - display: grid !important; - place-items: center !important; - width: 100% !important; - height: 100% !important; - min-height: 0 !important; - overflow: hidden !important; - border: 1px dashed rgba(30, 189, 219, 0.42) !important; - border-radius: 0 !important; + position: relative; + display: grid; + place-items: center; + width: 100%; + height: 100%; + min-height: 0; + overflow: hidden; + border: 1px dashed rgba(30, 189, 219, 0.42); + border-radius: 0; background: radial-gradient(circle, rgba(30, 189, 219, 0.18) 1px, transparent 1px), - linear-gradient(90deg, rgba(30, 189, 219, 0.04), rgba(16, 115, 204, 0.02)) !important; - background-color: #fbfdff !important; - background-size: 18px 18px, 100% 100% !important; - cursor: pointer !important; -} + linear-gradient(90deg, rgba(30, 189, 219, 0.04), rgba(16, 115, 204, 0.02)); + background-color: var(--ecom-bg-near-white); + background-size: 18px 18px, 100% 100%; + cursor: pointer} .ecommerce-standalone .ecom-image-workbench-canvas.is-dragging, .ecommerce-standalone .ecom-image-workbench-canvas:hover { - border-color: rgba(30, 189, 219, 0.58) !important; -} + border-color: rgba(30, 189, 219, 0.58)} .ecommerce-standalone .ecom-image-workbench-empty { - display: grid !important; - place-items: center !important; - gap: 12px !important; - max-width: 460px !important; - text-align: center !important; -} + display: grid; + place-items: center; + gap: 12px; + max-width: 460px; + text-align: center} .ecommerce-standalone .ecom-image-workbench-empty .anticon { - display: inline-grid !important; - place-items: center !important; - width: 56px !important; - height: 56px !important; - border-radius: 16px !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 26px !important; -} + display: inline-grid; + place-items: center; + width: 56px; + height: 56px; + border-radius: 16px; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 26px} .ecommerce-standalone .ecom-image-workbench-empty strong { - color: #172636 !important; - font-size: 18px !important; - font-weight: 950 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 18px; + font-weight: 950} .ecommerce-standalone .ecom-image-workbench-empty span { - color: #66798a !important; - font-size: 12px !important; - font-weight: 750 !important; -} + color: var(--ecom-text-muted); + font-size: 12px; + font-weight: 750} .ecommerce-standalone .ecom-image-workbench-preview { - position: relative !important; - display: grid !important; - place-items: center !important; - width: min(72%, 760px) !important; - max-height: 78vh !important; - padding: 18px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 16px !important; - background: #ffffff !important; - box-shadow: 0 16px 44px rgba(16, 115, 204, 0.08) !important; -} + position: relative; + display: grid; + place-items: center; + width: min(72%, 760px); + max-height: 78vh; + padding: 18px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 16px; + background: var(--ecom-bg-white); + box-shadow: 0 16px 44px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-image-workbench-image-frame { - position: relative !important; - display: block !important; - justify-self: center !important; - width: fit-content !important; - height: fit-content !important; - max-width: 100% !important; - max-height: 68vh !important; - overflow: hidden !important; - border-radius: 12px !important; - cursor: crosshair !important; - line-height: 0 !important; - touch-action: none !important; - user-select: none !important; -} + position: relative; + display: block; + justify-self: center; + width: fit-content; + height: fit-content; + max-width: 100%; + max-height: 68vh; + overflow: hidden; + border-radius: 12px; + cursor: crosshair; + line-height: 0; + touch-action: none; + user-select: none} .ecommerce-standalone .ecom-image-workbench-image-frame img { - display: block !important; - max-width: 100% !important; - max-height: 68vh !important; - border-radius: 12px !important; - object-fit: contain !important; - user-select: none !important; - pointer-events: none !important; - -webkit-user-drag: none !important; -} + display: block; + max-width: 100%; + max-height: 68vh; + border-radius: 12px; + object-fit: contain; + user-select: none; + pointer-events: none; + -webkit-user-drag: none} .ecommerce-standalone .ecom-image-workbench-preview em { - position: absolute !important; - left: 18px !important; - top: 18px !important; - padding: 5px 11px !important; - border-radius: 999px !important; - color: #1073cc !important; - background: rgba(237, 248, 255, 0.92) !important; - font-size: 12px !important; - font-style: normal !important; - font-weight: 950 !important; -} + position: absolute; + left: 18px; + top: 18px; + padding: 5px 11px; + border-radius: 999px; + color: var(--ecom-primary); + background: rgba(237, 248, 255, 0.92); + font-size: 12px; + font-style: normal; + font-weight: 950} .ecommerce-standalone .ecom-image-workbench-brush { - position: absolute !important; - z-index: 4 !important; - display: none !important; - border: 2px solid rgba(30, 189, 219, 0.72) !important; - border-radius: 50% !important; - background: rgba(30, 189, 219, 0.16) !important; - box-shadow: 0 0 0 6px rgba(30, 189, 219, 0.08) !important; - transform: translate(-50%, -50%) !important; - pointer-events: none !important; -} + position: absolute; + z-index: 4; + display: none; + border: 2px solid rgba(30, 189, 219, 0.72); + border-radius: 50%; + background: rgba(30, 189, 219, 0.16); + box-shadow: 0 0 0 6px rgba(30, 189, 219, 0.08); + transform: translate(-50%, -50%); + pointer-events: none} .ecommerce-standalone .ecom-image-workbench-mask-layer { - position: absolute !important; - inset: 0 !important; - z-index: 3 !important; - width: 100% !important; - height: 100% !important; - overflow: hidden !important; - border-radius: 12px !important; - pointer-events: none !important; -} + position: absolute; + inset: 0; + z-index: 3; + width: 100%; + height: 100%; + overflow: hidden; + border-radius: 12px; + pointer-events: none} .ecommerce-standalone .ecom-image-workbench-result { - display: grid !important; - place-items: center !important; - gap: 16px !important; - width: 100% !important; -} + display: grid; + place-items: center; + gap: 16px; + width: 100%} .ecommerce-standalone .ecom-image-workbench-result img { - display: block !important; - max-width: 100% !important; - max-height: 60vh !important; - border-radius: 12px !important; - object-fit: contain !important; -} + display: block; + max-width: 100%; + max-height: 60vh; + border-radius: 12px; + object-fit: contain} .ecommerce-standalone .ecom-image-workbench-generating { - position: relative !important; - display: grid !important; - place-items: center !important; - width: 100% !important; -} + position: relative; + display: grid; + place-items: center; + width: 100%} .ecommerce-standalone .ecom-watermark-page { - position: relative !important; - display: grid !important; - grid-template-columns: 350px minmax(0, 1fr) !important; - gap: 0 !important; - align-items: stretch !important; - width: 100% !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - box-sizing: border-box !important; - padding: 0 !important; - color: #172636 !important; - background: #f8f9fa !important; - font-family: "PingFang SC", "Microsoft YaHei", sans-serif !important; - animation: ecom-smart-page-enter 440ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + position: relative; + display: grid; + grid-template-columns: 350px minmax(0, 1fr); + gap: 0; + align-items: stretch; + width: 100%; + height: 100%; + min-height: calc(100vh - 58px); + box-sizing: border-box; + padding: 0; + color: var(--ecom-bg-dark-blue); + background: var(--ecom-bg-page); + font-family: "PingFang SC", "Microsoft YaHei", sans-serif; + animation: ecom-smart-page-enter 440ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecom-watermark-nav { - display: none !important; -} + display: none} .ecommerce-standalone .ecom-watermark-nav button, .ecommerce-standalone .ecom-watermark-url-row button, .ecommerce-standalone .ecom-watermark-actions button { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 7px !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 10px !important; - color: #1073cc !important; - background: #ffffff !important; - box-shadow: 0 8px 20px rgba(16, 115, 204, 0.06) !important; - font-weight: 850 !important; - cursor: pointer !important; - transition: transform 180ms ease, color 180ms ease, background 180ms ease, box-shadow 180ms ease !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + gap: 7px; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 10px; + color: var(--ecom-primary); + background: var(--ecom-bg-white); + box-shadow: 0 8px 20px rgba(16, 115, 204, 0.06); + font-weight: 850; + cursor: pointer; + transition: transform 180ms ease, color 180ms ease, background 180ms ease, box-shadow 180ms ease} .ecommerce-standalone .ecom-watermark-nav button { - min-height: 32px !important; - padding: 0 14px !important; - font-size: 13px !important; -} + min-height: 32px; + padding: 0 14px; + font-size: 13px} .ecommerce-standalone .ecom-watermark-nav button:hover, .ecommerce-standalone .ecom-watermark-url-row button:hover, .ecommerce-standalone .ecom-watermark-actions button:hover:not(:disabled) { - color: #ffffff !important; - background: #1073cc !important; - box-shadow: 0 12px 26px rgba(16, 115, 204, 0.18) !important; - transform: translateY(-1px) !important; -} + color: var(--ecom-bg-white); + background: var(--ecom-primary); + box-shadow: 0 12px 26px rgba(16, 115, 204, 0.18); + transform: translateY(-1px)} .ecommerce-standalone .ecom-watermark-side { - display: flex !important; - flex-direction: column !important; - gap: 10px !important; - height: 100% !important; - min-height: 0 !important; - padding: 14px 16px !important; - overflow: auto !important; - border: none !important; - border-right: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 0 !important; - background: #ffffff !important; - box-shadow: none !important; -} + display: flex; + flex-direction: column; + gap: 10px; + height: 100%; + min-height: 0; + padding: 14px 16px; + overflow: auto; + border: none; + border-right: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 0; + background: var(--ecom-bg-white); + box-shadow: none} .ecommerce-standalone .ecom-watermark-panel-head { - flex: 0 0 auto !important; - margin-bottom: 0 !important; -} + flex: 0 0 auto; + margin-bottom: 0} .ecommerce-standalone .ecom-watermark-intro { - margin: 0 2px 0 !important; - color: #66798a !important; - font-size: 12px !important; - font-weight: 750 !important; - line-height: 1.65 !important; -} + margin: 0 2px 0; + color: var(--ecom-text-muted); + font-size: 12px; + font-weight: 750; + line-height: 1.65} .ecommerce-standalone .ecom-watermark-heading { - display: grid !important; - gap: 7px !important; - padding: 2px 2px 6px !important; -} + display: grid; + gap: 7px; + padding: 2px 2px 6px} .ecommerce-standalone .ecom-watermark-heading span { - width: fit-content !important; - padding: 3px 9px !important; - border-radius: 999px !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 11px !important; - font-weight: 850 !important; -} + width: fit-content; + padding: 3px 9px; + border-radius: 999px; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 11px; + font-weight: 850} .ecommerce-standalone .ecom-watermark-heading strong { - color: #172636 !important; - font-size: 22px !important; - font-weight: 950 !important; - letter-spacing: 0 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 22px; + font-weight: 950; + letter-spacing: 0} .ecommerce-standalone .ecom-watermark-heading p { - max-width: 280px !important; - margin: 0 !important; - color: #66798a !important; - font-size: 12px !important; - font-weight: 750 !important; - line-height: 1.7 !important; -} + max-width: 280px; + margin: 0; + color: var(--ecom-text-muted); + font-size: 12px; + font-weight: 750; + line-height: 1.7} .ecommerce-standalone .ecom-watermark-panel { - display: grid !important; - gap: 10px !important; - padding: 12px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 12px !important; - background: rgba(248, 252, 255, 0.6) !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75) !important; -} + display: grid; + gap: 10px; + padding: 12px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 12px; + background: rgba(248, 252, 255, 0.6); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75)} .ecommerce-standalone .ecom-watermark-panel header { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; -} + display: flex; + align-items: center; + justify-content: space-between} .ecommerce-standalone .ecom-watermark-panel strong, .ecommerce-standalone .ecom-watermark-upload-card strong { - color: #132435 !important; - font-size: 13px !important; - font-weight: 950 !important; -} + color: #132435; + font-size: 13px; + font-weight: 950} .ecommerce-standalone .ecom-watermark-panel header span { - padding: 3px 9px !important; - border-radius: 999px !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 11px !important; - font-weight: 850 !important; -} + padding: 3px 9px; + border-radius: 999px; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 11px; + font-weight: 850} .ecommerce-standalone .ecom-watermark-upload-card { - position: relative !important; - display: grid !important; - grid-template-columns: 68px minmax(0, 1fr) !important; - align-items: center !important; - gap: 12px !important; - min-height: 92px !important; - padding: 10px 12px !important; - border: 1px dashed rgba(30, 189, 219, 0.45) !important; - border-radius: 12px !important; - color: #607485 !important; - background: #fbfdff !important; - cursor: pointer !important; - transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease !important; -} + position: relative; + display: grid; + grid-template-columns: 68px minmax(0, 1fr); + align-items: center; + gap: 12px; + min-height: 92px; + padding: 10px 12px; + border: 1px dashed rgba(30, 189, 219, 0.45); + border-radius: 12px; + color: #607485; + background: var(--ecom-bg-near-white); + cursor: pointer; + transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease} .ecommerce-standalone .ecom-watermark-remove { - position: absolute !important; - top: 8px !important; - right: 8px !important; - z-index: 2 !important; - display: inline-grid !important; - place-items: center !important; - width: 24px !important; - height: 24px !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 50% !important; - color: #526474 !important; - background: rgba(255, 255, 255, 0.92) !important; - box-shadow: 0 6px 14px rgba(16, 115, 204, 0.12) !important; - font-size: 16px !important; - font-weight: 850 !important; - line-height: 1 !important; - cursor: pointer !important; - transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease !important; -} + position: absolute; + top: 8px; + right: 8px; + z-index: 2; + display: inline-grid; + place-items: center; + width: 24px; + height: 24px; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 50%; + color: var(--ecom-text-muted); + background: rgba(255, 255, 255, 0.92); + box-shadow: 0 6px 14px rgba(16, 115, 204, 0.12); + font-size: 16px; + font-weight: 850; + line-height: 1; + cursor: pointer; + transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease} .ecommerce-standalone .ecom-watermark-remove:hover { - border-color: rgba(16, 115, 204, 0.38) !important; - color: #1073cc !important; - background: #edf8ff !important; - transform: scale(1.04) !important; -} + border-color: rgba(16, 115, 204, 0.38); + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + transform: scale(1.04)} .ecommerce-standalone .ecom-watermark-upload-card:not(.has-image) { - grid-template-columns: 1fr !important; - justify-items: center !important; - text-align: center !important; -} + grid-template-columns: 1fr; + justify-items: center; + text-align: center} .ecommerce-standalone .ecom-watermark-upload-card.is-dragging, .ecommerce-standalone .ecom-watermark-upload-card:hover { - border-color: #1ebddb !important; - background: #f6fcff !important; - box-shadow: 0 12px 28px rgba(16, 115, 204, 0.12) !important; -} + border-color: var(--ecom-accent-cyan); + background: #f6fcff; + box-shadow: 0 12px 28px rgba(16, 115, 204, 0.12)} .ecommerce-standalone .ecom-watermark-upload-card > .anticon { - color: #1ebddb !important; - font-size: 30px !important; -} + color: var(--ecom-accent-cyan); + font-size: 30px} .ecommerce-standalone .ecom-watermark-upload-card figure { - width: 68px !important; - height: 68px !important; - margin: 0 !important; - overflow: hidden !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 10px !important; - background: #f8f9fa !important; -} + width: 68px; + height: 68px; + margin: 0; + overflow: hidden; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 10px; + background: var(--ecom-bg-page)} .ecommerce-standalone .ecom-watermark-upload-card img { - width: 100% !important; - height: 100% !important; - object-fit: cover !important; -} + width: 100%; + height: 100%; + object-fit: cover} .ecommerce-standalone .ecom-watermark-upload-card div { - display: grid !important; - gap: 10px !important; - min-width: 0 !important; -} + display: grid; + gap: 10px; + min-width: 0} .ecommerce-standalone .ecom-watermark-upload-card span, .ecommerce-standalone .ecom-watermark-panel p { - margin: 0 !important; - color: #627485 !important; - font-size: 12px !important; - font-weight: 750 !important; - line-height: 1.65 !important; -} + margin: 0; + color: #627485; + font-size: 12px; + font-weight: 750; + line-height: 1.65} .ecommerce-standalone .ecom-watermark-upload-card div strong { - overflow: hidden !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; -} + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap} .ecommerce-standalone .ecom-watermark-url-row { - display: grid !important; - grid-template-columns: minmax(0, 1fr) 58px !important; - gap: 8px !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr) 58px; + gap: 8px} .ecommerce-standalone .ecom-watermark-url-row input { - min-height: 36px !important; - padding: 0 12px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 9px !important; - color: #172636 !important; - background: #f8fafc !important; - outline: none !important; - font-size: 12px !important; - font-weight: 800 !important; -} + min-height: 36px; + padding: 0 12px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 9px; + color: var(--ecom-bg-dark-blue); + background: #f8fafc; + outline: none; + font-size: 12px; + font-weight: 800} .ecommerce-standalone .ecom-watermark-url-row button { - min-height: 36px !important; - padding: 0 12px !important; - font-size: 12px !important; -} + min-height: 36px; + padding: 0 12px; + font-size: 12px} .ecommerce-standalone .ecom-watermark-primary { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 9px !important; - min-height: 44px !important; - width: 100% !important; - margin-top: auto !important; - border: 0 !important; - border-radius: 12px !important; - color: #ffffff !important; - background: linear-gradient(135deg, #1073cc, #1ebddb) !important; - box-shadow: 0 12px 28px rgba(16, 115, 204, 0.2) !important; - font-size: 14px !important; - font-weight: 950 !important; - cursor: pointer !important; - transition: box-shadow 180ms ease, transform 180ms ease !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + gap: 9px; + min-height: 44px; + width: 100%; + margin-top: auto; + border: 0; + border-radius: 12px; + color: var(--ecom-bg-white); + background: linear-gradient(135deg, var(--ecom-primary), var(--ecom-accent-cyan)); + box-shadow: 0 12px 28px rgba(16, 115, 204, 0.2); + font-size: 14px; + font-weight: 950; + cursor: pointer; + transition: box-shadow 180ms ease, transform 180ms ease} .ecommerce-standalone .ecom-watermark-primary:hover:not(:disabled) { - box-shadow: 0 16px 36px rgba(16, 115, 204, 0.28) !important; - transform: translateY(-1px) !important; -} + box-shadow: 0 16px 36px rgba(16, 115, 204, 0.28); + transform: translateY(-1px)} .ecommerce-standalone .ecom-watermark-primary:disabled { - color: #8ea0ad !important; - background: #edf1f4 !important; - box-shadow: none !important; -} + color: #8ea0ad; + background: #edf1f4; + box-shadow: none} .ecommerce-standalone .ecom-watermark-workspace { - display: grid !important; - place-items: stretch !important; - min-width: 0 !important; - min-height: 0 !important; - height: 100% !important; - padding: 0 !important; - overflow: hidden !important; - border: none !important; - border-radius: 0 !important; - background: #f8f9fa !important; - box-shadow: none !important; -} + display: grid; + place-items: stretch; + min-width: 0; + min-height: 0; + height: 100%; + padding: 0; + overflow: hidden; + border: none; + border-radius: 0; + background: var(--ecom-bg-page); + box-shadow: none} .ecommerce-standalone .ecom-watermark-dropzone { - display: grid !important; - place-items: center !important; - align-content: center !important; - gap: 12px !important; - width: 100% !important; - height: 100% !important; - min-height: 0 !important; - border: 1px dashed rgba(30, 189, 219, 0.42) !important; - border-radius: 0 !important; - color: #657686 !important; - background: #fbfdff !important; - text-align: center !important; - cursor: pointer !important; - transition: border-color 180ms ease, background 180ms ease, color 180ms ease !important; -} + display: grid; + place-items: center; + align-content: center; + gap: 12px; + width: 100%; + height: 100%; + min-height: 0; + border: 1px dashed rgba(30, 189, 219, 0.42); + border-radius: 0; + color: #657686; + background: var(--ecom-bg-near-white); + text-align: center; + cursor: pointer; + transition: border-color 180ms ease, background 180ms ease, color 180ms ease} .ecommerce-standalone .ecom-watermark-dropzone:hover, .ecommerce-standalone .ecom-watermark-dropzone.is-dragging { - border-color: rgba(30, 189, 219, 0.72) !important; - color: #1073cc !important; - background: #f6fcff !important; -} + border-color: rgba(30, 189, 219, 0.72); + color: var(--ecom-primary); + background: #f6fcff} .ecommerce-standalone .ecom-watermark-dropzone .anticon { - display: inline-grid !important; - place-items: center !important; - width: 50px !important; - height: 50px !important; - border-radius: 14px !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 24px !important; -} + display: inline-grid; + place-items: center; + width: 50px; + height: 50px; + border-radius: 14px; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 24px} .ecommerce-standalone .ecom-watermark-dropzone strong { - color: #172636 !important; - font-size: 15px !important; - font-weight: 950 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 15px; + font-weight: 950} .ecommerce-standalone .ecom-watermark-dropzone span { - max-width: 360px !important; - color: #71818e !important; - font-size: 12px !important; - font-weight: 750 !important; - line-height: 1.6 !important; -} + max-width: 360px; + color: var(--ecom-text-muted); + font-size: 12px; + font-weight: 750; + line-height: 1.6} .ecommerce-standalone .ecom-watermark-grid { - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 0 !important; - width: 100% !important; - height: 100% !important; - overflow: hidden !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 0 !important; - background: #ffffff !important; - box-shadow: none !important; -} + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 0; + width: 100%; + height: 100%; + overflow: hidden; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 0; + background: var(--ecom-bg-white); + box-shadow: none} .ecommerce-standalone .ecom-watermark-preview-card { - position: relative !important; - display: grid !important; - grid-template-rows: minmax(0, 1fr) auto !important; - align-items: center !important; - justify-items: center !important; - min-width: 0 !important; - min-height: 0 !important; - padding: 24px !important; - overflow: hidden !important; - border: 0 !important; - border-radius: 0 !important; - background: #ffffff !important; - box-shadow: none !important; -} + position: relative; + display: grid; + grid-template-rows: minmax(0, 1fr) auto; + align-items: center; + justify-items: center; + min-width: 0; + min-height: 0; + padding: 24px; + overflow: hidden; + border: 0; + border-radius: 0; + background: var(--ecom-bg-white); + box-shadow: none} .ecommerce-standalone .ecom-watermark-preview-card:first-child { - border-right: 1px solid rgba(16, 115, 204, 0.1) !important; -} + border-right: 1px solid rgba(16, 115, 204, 0.1)} .ecommerce-standalone .ecom-watermark-preview-card > span { - position: absolute !important; - top: 14px !important; - left: 14px !important; - z-index: 2 !important; - padding: 4px 10px !important; - border-radius: 999px !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 12px !important; - font-weight: 950 !important; -} + position: absolute; + top: 14px; + left: 14px; + z-index: 2; + padding: 4px 10px; + border-radius: 999px; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 12px; + font-weight: 950} .ecommerce-standalone .ecom-watermark-preview-card > img { - display: block !important; - max-width: 100% !important; - max-height: 70vh !important; - object-fit: contain !important; - border-radius: 10px !important; - box-shadow: 0 12px 30px rgba(16, 115, 204, 0.1) !important; -} + display: block; + max-width: 100%; + max-height: 70vh; + object-fit: contain; + border-radius: 10px; + box-shadow: 0 12px 30px rgba(16, 115, 204, 0.1)} .ecommerce-standalone .ecom-watermark-preview-card .ecom-image-workbench-image-frame { - position: relative !important; - display: block !important; - width: fit-content !important; - max-width: 100% !important; - max-height: 70vh !important; - overflow: hidden !important; - border-radius: 10px !important; - box-shadow: 0 12px 30px rgba(16, 115, 204, 0.1) !important; - cursor: crosshair !important; - touch-action: none !important; - user-select: none !important; - line-height: 0 !important; -} + position: relative; + display: block; + width: fit-content; + max-width: 100%; + max-height: 70vh; + overflow: hidden; + border-radius: 10px; + box-shadow: 0 12px 30px rgba(16, 115, 204, 0.1); + cursor: crosshair; + touch-action: none; + user-select: none; + line-height: 0} .ecommerce-standalone .ecom-watermark-preview-card .ecom-image-workbench-image-frame img { - display: block !important; - max-width: 100% !important; - max-height: 70vh !important; - object-fit: contain !important; - border-radius: 10px !important; - user-select: none !important; - pointer-events: none !important; - -webkit-user-drag: none !important; -} + display: block; + max-width: 100%; + max-height: 70vh; + object-fit: contain; + border-radius: 10px; + user-select: none; + pointer-events: none; + -webkit-user-drag: none} .ecommerce-standalone .ecom-watermark-preview-card .ecom-image-workbench-mask-layer { - position: absolute !important; - inset: 0 !important; - z-index: 3 !important; - width: 100% !important; - height: 100% !important; - overflow: hidden !important; - border-radius: 10px !important; - pointer-events: none !important; -} + position: absolute; + inset: 0; + z-index: 3; + width: 100%; + height: 100%; + overflow: hidden; + border-radius: 10px; + pointer-events: none} .ecommerce-standalone .ecom-watermark-preview-card .ecom-image-workbench-brush { - position: absolute !important; - z-index: 4 !important; - border: 2px solid rgba(30, 189, 219, 0.72) !important; - border-radius: 50% !important; - background: rgba(30, 189, 219, 0.16) !important; - box-shadow: 0 0 0 6px rgba(30, 189, 219, 0.08) !important; - transform: translate(-50%, -50%) !important; - pointer-events: none !important; -} + position: absolute; + z-index: 4; + border: 2px solid rgba(30, 189, 219, 0.72); + border-radius: 50%; + background: rgba(30, 189, 219, 0.16); + box-shadow: 0 0 0 6px rgba(30, 189, 219, 0.08); + transform: translate(-50%, -50%); + pointer-events: none} .ecommerce-standalone .ecom-watermark-empty, .ecommerce-standalone .ecom-watermark-processing { - display: grid !important; - place-items: center !important; - gap: 10px !important; - width: min(360px, 80%) !important; - min-height: 190px !important; - padding: 24px !important; - border: 1px dashed rgba(16, 115, 204, 0.16) !important; - border-radius: 16px !important; - color: #6b7e8d !important; - background: #fbfdff !important; - text-align: center !important; -} + display: grid; + place-items: center; + gap: 10px; + width: min(360px, 80%); + min-height: 190px; + padding: 24px; + border: 1px dashed rgba(16, 115, 204, 0.16); + border-radius: 16px; + color: #6b7e8d; + background: var(--ecom-bg-near-white); + text-align: center} .ecommerce-standalone .ecom-watermark-empty .anticon, .ecommerce-standalone .ecom-watermark-processing .anticon { - color: #1ebddb !important; - font-size: 30px !important; -} + color: var(--ecom-accent-cyan); + font-size: 30px} .ecommerce-standalone .ecom-watermark-empty strong, .ecommerce-standalone .ecom-watermark-processing strong { - color: #172636 !important; - font-size: 16px !important; - font-weight: 950 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 16px; + font-weight: 950} .ecommerce-standalone .ecom-watermark-empty em, .ecommerce-standalone .ecom-watermark-processing em { - color: #71818e !important; - font-size: 12px !important; - font-style: normal !important; - font-weight: 750 !important; -} + color: var(--ecom-text-muted); + font-size: 12px; + font-style: normal; + font-weight: 750} .ecommerce-standalone .ecom-watermark-zoom { - position: absolute !important; - top: 14px !important; - right: 14px !important; - display: inline-grid !important; - place-items: center !important; - width: 34px !important; - height: 34px !important; - border: 0 !important; - border-radius: 50% !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 17px !important; -} + position: absolute; + top: 14px; + right: 14px; + display: inline-grid; + place-items: center; + width: 34px; + height: 34px; + border: 0; + border-radius: 50%; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 17px} .ecommerce-standalone .ecom-watermark-actions { - display: flex !important; - justify-content: center !important; - gap: 14px !important; - width: 100% !important; - padding-top: 16px !important; -} + display: flex; + justify-content: center; + gap: 14px; + width: 100%; + padding-top: 16px} .ecommerce-standalone .ecom-watermark-actions button { - min-width: 138px !important; - min-height: 44px !important; - padding: 0 18px !important; - color: #172636 !important; - font-size: 13px !important; -} + min-width: 138px; + min-height: 44px; + padding: 0 18px; + color: var(--ecom-bg-dark-blue); + font-size: 13px} .ecommerce-standalone .ecom-watermark-actions button:disabled { - opacity: 0.45 !important; - cursor: not-allowed !important; - transform: none !important; -} + opacity: 0.45; + cursor: not-allowed; + transform: none} .ecommerce-standalone .ecom-translate-lang-panel header { - margin-bottom: 8px !important; -} + margin-bottom: 8px} .ecommerce-standalone .ecom-translate-lang-select { - display: block !important; - width: 100% !important; - height: 38px !important; - padding: 0 12px !important; - border: 1px solid #e0e6ed !important; - border-radius: 10px !important; - color: #172636 !important; - background: #ffffff !important; - font-size: 13px !important; - font-weight: 600 !important; - font-family: inherit !important; - cursor: pointer !important; - transition: border-color 180ms ease, box-shadow 180ms ease !important; - appearance: none !important; - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 5l3 3 3-3' fill='none' stroke='%23596775' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; - background-repeat: no-repeat !important; - background-position: right 12px center !important; -} + display: block; + width: 100%; + height: 38px; + padding: 0 12px; + border: 1px solid #e0e6ed; + border-radius: 10px; + color: var(--ecom-bg-dark-blue); + background: var(--ecom-bg-white); + font-size: 13px; + font-weight: 600; + font-family: inherit; + cursor: pointer; + transition: border-color 180ms ease, box-shadow 180ms ease; + appearance: none; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 5l3 3 3-3' fill='none' stroke='%23596775' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); + background-repeat: no-repeat; + background-position: right 12px center} .ecommerce-standalone .ecom-translate-lang-select:focus { - border-color: #1073cc !important; - box-shadow: 0 0 0 3px rgba(16, 115, 204, 0.1) !important; - outline: none !important; -} + border-color: var(--ecom-primary); + box-shadow: 0 0 0 3px rgba(16, 115, 204, 0.1); + outline: none} .ecommerce-standalone .ecom-translate-lang-select:hover { - border-color: #1073cc !important; -} + border-color: var(--ecom-primary)} .ecommerce-standalone .ecom-quick-set-page { - position: relative !important; - display: grid !important; - grid-template-rows: 42px minmax(0, 1fr) !important; - width: 100% !important; - height: 100% !important; - min-height: 720px !important; - color: #111827 !important; - background: #f3f5f8 !important; - font-family: "PingFang SC", "Microsoft YaHei", sans-serif !important; -} + position: relative; + display: grid; + grid-template-rows: 42px minmax(0, 1fr); + width: 100%; + height: 100%; + min-height: 720px; + color: #111827; + background: #f3f5f8; + font-family: "PingFang SC", "Microsoft YaHei", sans-serif} .ecommerce-standalone .ecom-quick-set-topbar { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; - gap: 18px !important; - padding: 0 16px !important; - border-bottom: 1px solid rgba(15, 23, 42, 0.06) !important; - background: rgba(255, 255, 255, 0.92) !important; -} + display: flex; + align-items: center; + justify-content: space-between; + gap: 18px; + padding: 0 16px; + border-bottom: 1px solid rgba(15, 23, 42, 0.06); + background: rgba(255, 255, 255, 0.92)} .ecommerce-standalone .ecom-quick-set-brand, .ecommerce-standalone .ecom-quick-set-actions { - display: flex !important; - align-items: center !important; - gap: 8px !important; -} + display: flex; + align-items: center; + gap: 8px} .ecommerce-standalone .ecom-quick-set-brand > span { - display: inline-grid !important; - place-items: center !important; - width: 22px !important; - height: 22px !important; - border-radius: 7px !important; - color: #ffffff !important; - background: linear-gradient(135deg, #ff3366, #1ebddb 55%, #111827) !important; - font-size: 13px !important; -} + display: inline-grid; + place-items: center; + width: 22px; + height: 22px; + border-radius: 7px; + color: var(--ecom-bg-white); + background: linear-gradient(135deg, #ff3366, var(--ecom-accent-cyan) 55%, #111827); + font-size: 13px} .ecommerce-standalone .ecom-quick-set-brand strong { - font-size: 14px !important; - font-weight: 900 !important; -} + font-size: 14px; + font-weight: 900} .ecommerce-standalone .ecom-quick-set-brand button, .ecommerce-standalone .ecom-quick-set-actions button, .ecommerce-standalone .ecom-quick-set-actions span { - min-height: 26px !important; - padding: 0 10px !important; - border: 0 !important; - border-radius: 7px !important; - color: #26323f !important; - background: #f4f6f8 !important; - font-size: 12px !important; - font-weight: 800 !important; -} + min-height: 26px; + padding: 0 10px; + border: 0; + border-radius: 7px; + color: #26323f; + background: #f4f6f8; + font-size: 12px; + font-weight: 800} .ecommerce-standalone .ecom-quick-set-actions button:first-child { - color: #9a5623 !important; - background: #ffe0c7 !important; -} + color: #9a5623; + background: #ffe0c7} .ecommerce-standalone .ecom-quick-set-actions i { - width: 26px !important; - height: 26px !important; - border-radius: 50% !important; - background: #d7dde4 !important; -} + width: 26px; + height: 26px; + border-radius: 50%; + background: #d7dde4} .ecommerce-standalone .ecom-quick-set-body { - display: grid !important; - grid-template-columns: 54px 322px minmax(0, 1fr) !important; - min-height: 0 !important; -} + display: grid; + grid-template-columns: 54px 322px minmax(0, 1fr); + min-height: 0} .ecommerce-standalone .ecom-quick-set-rail { - display: grid !important; - align-content: start !important; - gap: 16px !important; - padding: 14px 8px !important; - border-right: 1px solid rgba(15, 23, 42, 0.06) !important; - background: #ffffff !important; -} + display: grid; + align-content: start; + gap: 16px; + padding: 14px 8px; + border-right: 1px solid rgba(15, 23, 42, 0.06); + background: var(--ecom-bg-white)} .ecommerce-standalone .ecom-quick-set-rail button { - display: grid !important; - justify-items: center !important; - gap: 5px !important; - min-height: 48px !important; - border: 0 !important; - border-radius: 9px !important; - color: #2c3642 !important; - background: transparent !important; - font-size: 11px !important; - font-weight: 800 !important; -} + display: grid; + justify-items: center; + gap: 5px; + min-height: 48px; + border: 0; + border-radius: 9px; + color: #2c3642; + background: transparent; + font-size: 11px; + font-weight: 800} .ecommerce-standalone .ecom-quick-set-rail button.is-active { - color: #1073cc !important; - background: #eef8ff !important; -} + color: var(--ecom-primary); + background: #eef8ff} .ecommerce-standalone .ecom-quick-set-panel { - position: relative !important; - display: grid !important; - grid-template-rows: auto auto auto auto auto minmax(0, 1fr) !important; - gap: 14px !important; - padding: 18px 16px 70px !important; - border-right: 1px solid rgba(15, 23, 42, 0.06) !important; - background: #ffffff !important; - overflow-y: auto !important; -} + position: relative; + display: grid; + grid-template-rows: auto auto auto auto auto minmax(0, 1fr); + gap: 14px; + padding: 18px 16px 70px; + border-right: 1px solid rgba(15, 23, 42, 0.06); + background: var(--ecom-bg-white); + overflow-y: auto} .ecommerce-standalone .ecom-quick-set-panel section { - display: grid !important; - gap: 10px !important; -} + display: grid; + gap: 10px} .ecommerce-standalone .ecom-quick-set-panel strong, .ecommerce-standalone .ecom-quick-set-section-head strong { - font-size: 13px !important; - font-weight: 900 !important; -} + font-size: 13px; + font-weight: 900} .ecommerce-standalone .ecom-quick-set-upload { - display: grid !important; - place-items: center !important; - gap: 8px !important; - min-height: 84px !important; - border: 1px dashed rgba(16, 115, 204, 0.22) !important; - border-radius: 10px !important; - color: #5f6f7c !important; - background: #fbfdff !important; -} + display: grid; + place-items: center; + gap: 8px; + min-height: 84px; + border: 1px dashed rgba(16, 115, 204, 0.22); + border-radius: 10px; + color: #5f6f7c; + background: var(--ecom-bg-near-white)} .ecommerce-standalone .ecom-quick-set-upload span { - padding: 7px 14px !important; - border-radius: 8px !important; - color: #344250 !important; - background: #f3f5f8 !important; - font-size: 13px !important; - font-weight: 900 !important; -} + padding: 7px 14px; + border-radius: 8px; + color: #344250; + background: #f3f5f8; + font-size: 13px; + font-weight: 900} .ecommerce-standalone .ecom-quick-set-upload em { - color: #a0a9b2 !important; - font-style: normal !important; - font-size: 12px !important; - font-weight: 700 !important; -} + color: #a0a9b2; + font-style: normal; + font-size: 12px; + font-weight: 700} .ecommerce-standalone .ecom-quick-set-selects { - display: grid !important; - grid-template-columns: 1fr 1fr !important; - gap: 8px !important; -} + display: grid; + grid-template-columns: 1fr 1fr; + gap: 8px} .ecommerce-standalone .ecom-quick-set-selects button { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; - min-height: 34px !important; - padding: 0 10px !important; - border: 0 !important; - border-radius: 8px !important; - background: #f3f5f8 !important; - font-size: 13px !important; - font-weight: 800 !important; -} + display: flex; + align-items: center; + justify-content: space-between; + min-height: 34px; + padding: 0 10px; + border: 0; + border-radius: 8px; + background: #f3f5f8; + font-size: 13px; + font-weight: 800} .ecommerce-standalone .ecom-quick-set-section-head { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; - gap: 10px !important; -} + display: flex; + align-items: center; + justify-content: space-between; + gap: 10px} .ecommerce-standalone .ecom-quick-set-section-head button { - min-height: 26px !important; - padding: 0 10px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 999px !important; - color: #3386ef !important; - background: #f6fbff !important; - font-size: 12px !important; - font-weight: 900 !important; -} + min-height: 26px; + padding: 0 10px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 999px; + color: #3386ef; + background: #f6fbff; + font-size: 12px; + font-weight: 900} .ecommerce-standalone .ecom-quick-set-panel textarea { - min-height: 102px !important; - resize: none !important; - padding: 12px !important; - border: 1px solid rgba(15, 23, 42, 0.08) !important; - border-radius: 10px !important; - color: #253443 !important; - background: #ffffff !important; - font-size: 12px !important; - font-weight: 700 !important; - line-height: 1.65 !important; - outline: none !important; -} + min-height: 102px; + resize: none; + padding: 12px; + border: 1px solid rgba(15, 23, 42, 0.08); + border-radius: 10px; + color: #253443; + background: var(--ecom-bg-white); + font-size: 12px; + font-weight: 700; + line-height: 1.65; + outline: none} .ecommerce-standalone .ecom-quick-set-config { - display: grid !important; - gap: 8px !important; -} + display: grid; + gap: 8px} .ecommerce-standalone .ecom-quick-set-config button { - display: grid !important; - grid-template-columns: minmax(0, 1fr) 18px !important; - gap: 4px 10px !important; - min-height: 58px !important; - padding: 12px !important; - border: 1px solid rgba(15, 23, 42, 0.08) !important; - border-radius: 10px !important; - color: #253443 !important; - background: #ffffff !important; - text-align: left !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr) 18px; + gap: 4px 10px; + min-height: 58px; + padding: 12px; + border: 1px solid rgba(15, 23, 42, 0.08); + border-radius: 10px; + color: #253443; + background: var(--ecom-bg-white); + text-align: left} .ecommerce-standalone .ecom-quick-set-config button::after { - grid-row: 1 / span 2 !important; - grid-column: 2 !important; - align-self: center !important; - width: 14px !important; - height: 14px !important; - border: 1px solid #c9d3dc !important; - border-radius: 4px !important; - content: "" !important; -} + grid-row: 1 / span 2; + grid-column: 2; + align-self: center; + width: 14px; + height: 14px; + border: 1px solid #c9d3dc; + border-radius: 4px; + content: ""} .ecommerce-standalone .ecom-quick-set-config button.is-active::after { - border-color: #3386ef !important; - background: #3386ef !important; - box-shadow: inset 0 0 0 3px #ffffff !important; -} + border-color: #3386ef; + background: #3386ef; + box-shadow: inset 0 0 0 3px var(--ecom-bg-white)} .ecommerce-standalone .ecom-quick-set-config button strong, .ecommerce-standalone .ecom-quick-set-config button span { - grid-column: 1 !important; -} + grid-column: 1} .ecommerce-standalone .ecom-quick-set-config button span { - color: #909aa5 !important; - font-size: 12px !important; - font-weight: 700 !important; -} + color: #909aa5; + font-size: 12px; + font-weight: 700} .ecommerce-standalone .ecom-quick-set-analysis { - min-height: 34px !important; - border: 0 !important; - border-radius: 8px !important; - color: #7aa9f8 !important; - background: #f3f5f8 !important; - font-weight: 900 !important; -} + min-height: 34px; + border: 0; + border-radius: 8px; + color: #7aa9f8; + background: #f3f5f8; + font-weight: 900} .ecommerce-standalone .ecom-quick-set-panel footer { - position: absolute !important; - left: 16px !important; - right: 16px !important; - bottom: 16px !important; -} + position: absolute; + left: 16px; + right: 16px; + bottom: 16px} .ecommerce-standalone .ecom-quick-set-panel footer button { - width: 100% !important; - min-height: 38px !important; - border: 0 !important; - border-radius: 8px !important; - color: #ffffff !important; - background: #b8b8b8 !important; - font-size: 13px !important; - font-weight: 900 !important; -} + width: 100%; + min-height: 38px; + border: 0; + border-radius: 8px; + color: var(--ecom-bg-white); + background: #b8b8b8; + font-size: 13px; + font-weight: 900} .ecommerce-standalone .ecom-quick-set-stage { - display: grid !important; - place-items: center !important; - padding: 42px 48px !important; - overflow: auto !important; -} + display: grid; + place-items: center; + padding: 42px 48px; + overflow: auto} .ecommerce-standalone .ecom-quick-set-hero { - display: grid !important; - justify-items: center !important; - gap: 22px !important; - width: min(720px, 100%) !important; -} + display: grid; + justify-items: center; + gap: 22px; + width: min(720px, 100%)} .ecommerce-standalone .ecom-quick-set-hero h1 { - margin: 0 !important; - font-size: 30px !important; - font-weight: 950 !important; - letter-spacing: 0 !important; -} + margin: 0; + font-size: 30px; + font-weight: 950; + letter-spacing: 0} .ecommerce-standalone .ecom-quick-set-hero p { - margin: -8px 0 16px !important; - color: #6b7684 !important; - font-size: 14px !important; - font-weight: 700 !important; -} + margin: -8px 0 16px; + color: #6b7684; + font-size: 14px; + font-weight: 700} .ecommerce-standalone .ecom-quick-set-hero p span { - color: #3386ef !important; -} + color: #3386ef} .ecommerce-standalone .ecom-quick-set-preview-card { - display: grid !important; - grid-template-columns: 1.2fr 40px 1fr !important; - align-items: center !important; - gap: 18px !important; - width: 100% !important; - min-height: 300px !important; - padding: 22px !important; - border-radius: 18px !important; - background: #ffffff !important; - box-shadow: 0 20px 60px rgba(23, 31, 44, 0.08) !important; -} + display: grid; + grid-template-columns: 1.2fr 40px 1fr; + align-items: center; + gap: 18px; + width: 100%; + min-height: 300px; + padding: 22px; + border-radius: 18px; + background: var(--ecom-bg-white); + box-shadow: 0 20px 60px rgba(23, 31, 44, 0.08)} .ecommerce-standalone .ecom-quick-set-preview-card figure { - position: relative !important; - margin: 0 !important; - overflow: hidden !important; - border-radius: 12px !important; - background: #f3f5f8 !important; -} + position: relative; + margin: 0; + overflow: hidden; + border-radius: 12px; + background: #f3f5f8} .ecommerce-standalone .ecom-quick-set-preview-card figure span { - position: absolute !important; - top: 9px !important; - left: 10px !important; - z-index: 1 !important; - padding: 4px 9px !important; - border-radius: 999px !important; - color: #536171 !important; - background: rgba(255, 255, 255, 0.86) !important; - font-size: 11px !important; - font-weight: 900 !important; -} + position: absolute; + top: 9px; + left: 10px; + z-index: 1; + padding: 4px 9px; + border-radius: 999px; + color: #536171; + background: rgba(255, 255, 255, 0.86); + font-size: 11px; + font-weight: 900} .ecommerce-standalone .ecom-quick-set-preview-card img { - display: block !important; - width: 100% !important; - height: 100% !important; - object-fit: cover !important; -} + display: block; + width: 100%; + height: 100%; + object-fit: cover} .ecommerce-standalone .ecom-quick-set-preview-main { - height: 250px !important; -} + height: 250px} .ecommerce-standalone .ecom-quick-set-preview-arrow { - display: grid !important; - place-items: center !important; - width: 40px !important; - height: 40px !important; - border-radius: 50% !important; - color: #c8d1db !important; - font-size: 42px !important; - font-weight: 700 !important; -} + display: grid; + place-items: center; + width: 40px; + height: 40px; + border-radius: 50%; + color: #c8d1db; + font-size: 42px; + font-weight: 700} .ecommerce-standalone .ecom-quick-set-preview-grid { - display: grid !important; - grid-template-columns: 1fr 1fr !important; - gap: 10px !important; -} + display: grid; + grid-template-columns: 1fr 1fr; + gap: 10px} .ecommerce-standalone .ecom-quick-set-preview-grid figure { - height: 120px !important; -} + height: 120px} .ecommerce-standalone .ecom-quick-set-help { - position: absolute !important; - right: 18px !important; - bottom: 18px !important; - width: 38px !important; - height: 38px !important; - border: 1px solid rgba(15, 23, 42, 0.08) !important; - border-radius: 50% !important; - color: #6b7280 !important; - background: #ffffff !important; - box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08) !important; - font-size: 20px !important; - font-weight: 900 !important; -} + position: absolute; + right: 18px; + bottom: 18px; + width: 38px; + height: 38px; + border: 1px solid rgba(15, 23, 42, 0.08); + border-radius: 50%; + color: #6b7280; + background: var(--ecom-bg-white); + box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08); + font-size: 20px; + font-weight: 900} /* Localized product set workbench layout. */ .ecommerce-standalone .ecom-quick-set-page { - grid-template-rows: minmax(0, 1fr) !important; - min-height: 100% !important; - color: #172636 !important; - background: #f8f9fa !important; -} + grid-template-rows: minmax(0, 1fr); + min-height: 100%; + color: var(--ecom-bg-dark-blue); + background: var(--ecom-bg-page)} .ecommerce-standalone .ecom-quick-set-body { - grid-template-columns: 440px minmax(0, 1fr) !important; - min-height: 0 !important; - transition: grid-template-columns 680ms cubic-bezier(0.22, 1, 0.36, 1) !important; -} + grid-template-columns: 440px minmax(0, 1fr); + min-height: 0; + transition: grid-template-columns 680ms cubic-bezier(0.22, 1, 0.36, 1)} .ecommerce-standalone .ecom-quick-set-page.is-panel-collapsed .ecom-quick-set-body { - grid-template-columns: 0 minmax(0, 1fr) !important; -} + grid-template-columns: 0 minmax(0, 1fr)} .ecommerce-standalone .ecom-quick-set-panel { - display: flex !important; - flex-direction: column !important; - gap: 14px !important; - padding: 16px 14px 86px !important; - border-right: 1px solid rgba(16, 115, 204, 0.08) !important; - background: #feffff !important; - box-shadow: 18px 0 46px rgba(16, 115, 204, 0.04) !important; - overflow-y: auto !important; - scrollbar-width: none !important; - -ms-overflow-style: none !important; - transform: translateX(0) !important; - opacity: 1 !important; - clip-path: inset(0 0 0 0 round 0) !important; - will-change: transform, opacity, clip-path !important; + display: flex; + flex-direction: column; + gap: 14px; + padding: 16px 14px 86px; + border-right: 1px solid rgba(16, 115, 204, 0.08); + background: var(--ecom-bg-near-white); + box-shadow: 18px 0 46px rgba(16, 115, 204, 0.04); + overflow-y: auto; + scrollbar-width: none; + -ms-overflow-style: none; + transform: translateX(0); + opacity: 1; + clip-path: inset(0 0 0 0 round 0); + will-change: transform, opacity, clip-path; transition: transform 680ms cubic-bezier(0.22, 1, 0.36, 1), opacity 360ms ease, clip-path 680ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 460ms ease, - border-color 460ms ease !important; -} + border-color 460ms ease} .ecommerce-standalone .ecom-quick-set-panel > * { - transform: translateX(0) !important; - opacity: 1 !important; + transform: translateX(0); + opacity: 1; transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1), - opacity 300ms ease !important; -} + opacity 300ms ease} .ecommerce-standalone .ecom-quick-set-page.is-panel-collapsed .ecom-quick-set-panel { - pointer-events: none !important; - opacity: 0 !important; - transform: translateX(-26px) scaleX(0.96) !important; - clip-path: inset(0 100% 0 0 round 0) !important; - box-shadow: none !important; - border-color: transparent !important; -} + pointer-events: none; + opacity: 0; + transform: translateX(-26px) scaleX(0.96); + clip-path: inset(0 100% 0 0 round 0); + box-shadow: none; + border-color: transparent} .ecommerce-standalone .ecom-quick-set-page.is-panel-collapsed .ecom-quick-set-panel > * { - transform: translateX(-18px) !important; - opacity: 0 !important; -} + transform: translateX(-18px); + opacity: 0} .ecommerce-standalone .ecom-quick-set-panel::-webkit-scrollbar { - width: 0 !important; - height: 0 !important; - display: none !important; -} + width: 0; + height: 0; + display: none} .ecommerce-standalone .ecom-quick-set-panel-head { - display: flex !important; - align-items: center !important; - gap: 10px !important; - min-height: 34px !important; -} + display: flex; + align-items: center; + gap: 10px; + min-height: 34px} .ecommerce-standalone .ecom-quick-set-back { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - min-width: 70px !important; - min-height: 32px !important; - padding: 0 13px !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 11px !important; - color: #1073cc !important; - background: #ffffff !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.08) !important; - font-size: 13px !important; - font-weight: 700 !important; - white-space: nowrap !important; - cursor: pointer !important; - transition: color 180ms ease, background 180ms ease, box-shadow 180ms ease !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + min-width: 70px; + min-height: 32px; + padding: 0 13px; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 11px; + color: var(--ecom-primary); + background: var(--ecom-bg-white); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.08); + font-size: 13px; + font-weight: 700; + white-space: nowrap; + cursor: pointer; + transition: color 180ms ease, background 180ms ease, box-shadow 180ms ease} .ecommerce-standalone .ecom-quick-set-back:hover { - color: #ffffff !important; - background: #1073cc !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.18) !important; -} + color: var(--ecom-bg-white); + background: var(--ecom-primary); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.18)} .ecommerce-standalone .ecom-quick-set-panel-head span { - display: inline-grid !important; - place-items: center !important; - width: 25px !important; - height: 25px !important; - border-radius: 8px !important; - color: #ffffff !important; - background: linear-gradient(135deg, #1073cc, #1ebddb) !important; - font-size: 12px !important; - font-weight: 950 !important; -} + display: inline-grid; + place-items: center; + width: 25px; + height: 25px; + border-radius: 8px; + color: var(--ecom-bg-white); + background: linear-gradient(135deg, var(--ecom-primary), var(--ecom-accent-cyan)); + font-size: 12px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-page-title { - margin-right: auto !important; - color: #10202c !important; - font-size: 17px !important; - font-weight: 950 !important; - letter-spacing: 0.02em !important; -} + margin-right: auto; + color: var(--ecom-text-primary); + font-size: 17px; + font-weight: 950; + letter-spacing: 0.02em} .ecommerce-standalone .ecom-quick-set-panel-head strong { - color: #132435 !important; - font-size: 15px !important; - font-weight: 950 !important; -} + color: #132435; + font-size: 15px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-panel section { - position: relative !important; - gap: 9px !important; - padding: 12px !important; - border: 1px solid rgba(16, 115, 204, 0.09) !important; - border-radius: 12px !important; - background: #ffffff !important; - box-shadow: 0 10px 26px rgba(16, 115, 204, 0.035) !important; -} + position: relative; + gap: 9px; + padding: 12px; + border: 1px solid rgba(16, 115, 204, 0.09); + border-radius: 12px; + background: var(--ecom-bg-white); + box-shadow: 0 10px 26px rgba(16, 115, 204, 0.035)} .ecommerce-standalone .ecom-quick-set-panel section > strong { - display: inline-flex !important; - align-items: center !important; - gap: 7px !important; - color: #172636 !important; - font-size: 13px !important; - font-weight: 950 !important; -} + display: inline-flex; + align-items: center; + gap: 7px; + color: var(--ecom-bg-dark-blue); + font-size: 13px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-basic-section { - z-index: 12 !important; - overflow: visible !important; -} + z-index: 12; + overflow: visible} .ecommerce-standalone .ecom-quick-set-select-anchor { - position: relative !important; - z-index: 12 !important; - overflow: visible !important; -} + position: relative; + z-index: 12; + overflow: visible} .ecommerce-standalone .ecom-quick-set-upload { - display: grid !important; - place-items: center !important; - gap: 10px !important; - min-height: 126px !important; - padding: 18px 14px !important; - border: 1px dashed rgba(30, 189, 219, 0.42) !important; - border-radius: 0 !important; - color: #172636 !important; - background: #ffffff !important; - outline: none !important; - cursor: pointer !important; - box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02) !important; - transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease !important; -} + display: grid; + place-items: center; + gap: 10px; + min-height: 126px; + padding: 18px 14px; + border: 1px dashed rgba(30, 189, 219, 0.42); + border-radius: 0; + color: var(--ecom-bg-dark-blue); + background: var(--ecom-bg-white); + outline: none; + cursor: pointer; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02); + transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease} .ecommerce-standalone .ecom-quick-set-upload.has-images { - min-height: 158px !important; - padding: 14px !important; -} + min-height: 158px; + padding: 14px} .ecommerce-standalone .ecom-quick-set-upload:hover, .ecommerce-standalone .ecom-quick-set-upload:focus-visible { - border-color: rgba(30, 189, 219, 0.76) !important; - background: #ffffff !important; - box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.1), 0 14px 34px rgba(16, 115, 204, 0.12) !important; -} + border-color: rgba(30, 189, 219, 0.76); + background: var(--ecom-bg-white); + box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.1), 0 14px 34px rgba(16, 115, 204, 0.12)} .ecommerce-standalone .ecom-quick-set-upload > .anticon { - color: #1ebddb !important; - font-size: 24px !important; -} + color: var(--ecom-accent-cyan); + font-size: 24px} .ecommerce-standalone .ecom-quick-set-upload > span { - color: #253544 !important; - background: transparent !important; - font-size: 15px !important; - font-weight: 950 !important; -} + color: #253544; + background: transparent; + font-size: 15px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-upload b { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - min-height: 46px !important; - padding: 0 34px !important; - border-radius: 12px !important; - color: #ffffff !important; - background: linear-gradient(135deg, #1073cc, #1ebddb) !important; - box-shadow: 0 18px 42px rgba(16, 115, 204, 0.22) !important; - font-size: 16px !important; - font-weight: 950 !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + min-height: 46px; + padding: 0 34px; + border-radius: 12px; + color: var(--ecom-bg-white); + background: linear-gradient(135deg, var(--ecom-primary), var(--ecom-accent-cyan)); + box-shadow: 0 18px 42px rgba(16, 115, 204, 0.22); + font-size: 16px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-upload em { - color: #71818e !important; - font-size: 13px !important; - font-style: normal !important; - font-weight: 850 !important; -} + color: var(--ecom-text-muted); + font-size: 13px; + font-style: normal; + font-weight: 850} .ecommerce-standalone .ecom-quick-upload-thumbs { - position: relative !important; - display: flex !important; - flex-wrap: wrap !important; - justify-content: center !important; - gap: 8px !important; - width: 100% !important; - max-width: 100% !important; -} + position: relative; + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 8px; + width: 100%; + max-width: 100%} .ecommerce-standalone .ecom-quick-upload-thumbs figure { - position: relative !important; - width: 48px !important; - height: 48px !important; - margin: 0 !important; - overflow: visible !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 10px !important; - background: #f8f9fa !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.08) !important; -} + position: relative; + width: 48px; + height: 48px; + margin: 0; + overflow: visible; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 10px; + background: var(--ecom-bg-page); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-upload-thumbs figure > img { - width: 100% !important; - height: 100% !important; - display: block !important; - object-fit: cover !important; - border-radius: 9px !important; -} + width: 100%; + height: 100%; + display: block; + object-fit: cover; + border-radius: 9px} .ecommerce-standalone .ecom-quick-upload-thumbs button { - position: absolute !important; - top: -7px !important; - right: -7px !important; - z-index: 4 !important; - width: 18px !important; - height: 18px !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - padding: 0 !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 999px !important; - color: #344250 !important; - background: #ffffff !important; - box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16) !important; - font-size: 13px !important; - font-weight: 950 !important; - line-height: 1 !important; - cursor: pointer !important; -} + position: absolute; + top: -7px; + right: -7px; + z-index: 4; + width: 18px; + height: 18px; + display: inline-flex; + align-items: center; + justify-content: center; + padding: 0; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 999px; + color: #344250; + background: var(--ecom-bg-white); + box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16); + font-size: 13px; + font-weight: 950; + line-height: 1; + cursor: pointer} .ecommerce-standalone .ecom-quick-upload-zoom { - position: absolute !important; - left: calc(100% + 12px) !important; - top: 50% !important; - z-index: 80 !important; - width: 184px !important; - height: 184px !important; - display: block !important; - padding: 0 !important; - overflow: hidden !important; - border: 1px solid rgba(16, 115, 204, 0.16) !important; - border-radius: 14px !important; - background: #ffffff !important; - box-shadow: 0 22px 54px rgba(15, 23, 42, 0.22) !important; - opacity: 0 !important; - pointer-events: none !important; - transform: translate3d(8px, -50%, 0) scale(0.94) !important; - transition: opacity 180ms ease, transform 180ms ease !important; -} + position: absolute; + left: calc(100% + 12px); + top: 50%; + z-index: 80; + width: 184px; + height: 184px; + display: block; + padding: 0; + overflow: hidden; + border: 1px solid rgba(16, 115, 204, 0.16); + border-radius: 14px; + background: var(--ecom-bg-white); + box-shadow: 0 22px 54px rgba(15, 23, 42, 0.22); + opacity: 0; + pointer-events: none; + transform: translate3d(8px, -50%, 0) scale(0.94); + transition: opacity 180ms ease, transform 180ms ease} .ecommerce-standalone .ecom-quick-upload-zoom img { - width: 100% !important; - height: 100% !important; - display: block !important; - object-fit: contain !important; - background: #ffffff !important; -} + width: 100%; + height: 100%; + display: block; + object-fit: contain; + background: var(--ecom-bg-white)} .ecommerce-standalone .ecom-quick-upload-thumbs figure:hover .ecom-quick-upload-zoom { - opacity: 1 !important; - transform: translate3d(0, -50%, 0) scale(1) !important; -} + opacity: 1; + transform: translate3d(0, -50%, 0) scale(1)} .ecommerce-standalone .ecom-quick-upload-thumbs .ecom-command-asset-zoom { - position: absolute !important; - top: 50% !important; - left: calc(100% + 12px) !important; - z-index: 90 !important; - display: none !important; - width: min(320px, calc(100vw - 48px)) !important; - height: auto !important; - padding: 8px !important; - overflow: visible !important; - border: 1px solid rgba(30, 189, 219, 0.28) !important; - border-radius: 10px !important; - background: #feffff !important; - box-shadow: 0 18px 46px rgba(20, 80, 100, 0.18) !important; - opacity: 1 !important; - pointer-events: none !important; - transform: translateY(-50%) !important; -} + position: absolute; + top: 50%; + left: calc(100% + 12px); + z-index: 90; + display: none; + width: min(320px, calc(100vw - 48px)); + height: auto; + padding: 8px; + overflow: visible; + border: 1px solid rgba(30, 189, 219, 0.28); + border-radius: 10px; + background: var(--ecom-bg-near-white); + box-shadow: 0 18px 46px rgba(20, 80, 100, 0.18); + opacity: 1; + pointer-events: none; + transform: translateY(-50%)} .ecommerce-standalone .ecom-quick-upload-thumbs .ecom-command-asset-thumb:hover .ecom-command-asset-zoom, .ecommerce-standalone .ecom-quick-upload-thumbs .ecom-command-asset-thumb:focus-within .ecom-command-asset-zoom { - display: block !important; - animation: ecom-zoom-preview-in 150ms ease-out both !important; -} + display: block; + animation: ecom-zoom-preview-in 150ms ease-out both} .ecommerce-standalone .ecom-quick-upload-thumbs .ecom-command-asset-zoom img { - display: block !important; - width: 100% !important; - height: auto !important; - max-height: 360px !important; - border-radius: 6px !important; - object-fit: contain !important; - background: transparent !important; -} + display: block; + width: 100%; + height: auto; + max-height: 360px; + border-radius: 6px; + object-fit: contain; + background: transparent} .ecommerce-standalone .ecom-quick-set-label { - color: #6c7b88 !important; - font-size: 12px !important; - font-weight: 850 !important; -} + color: #6c7b88; + font-size: 12px; + font-weight: 850} .ecommerce-standalone .ecom-quick-set-modes { - display: grid !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - gap: 8px !important; -} + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 8px} .ecommerce-standalone .ecom-quick-set-modes button { - min-height: 33px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 9px !important; - color: #253544 !important; - background: #f8f9fa !important; - font-size: 13px !important; - font-weight: 900 !important; -} + min-height: 33px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 9px; + color: #253544; + background: var(--ecom-bg-page); + font-size: 13px; + font-weight: 900} .ecommerce-standalone .ecom-quick-set-modes button.is-active { - border-color: #1073cc !important; - color: #1073cc !important; - background: #edf8ff !important; - box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.12) !important; -} + border-color: var(--ecom-primary); + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.12)} .ecommerce-standalone .ecom-quick-set-selects { - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 8px !important; -} + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 8px} .ecommerce-standalone .ecom-quick-set-selects button { - display: grid !important; - grid-template-columns: minmax(0, 1fr) 16px !important; - grid-template-rows: auto auto !important; - align-items: center !important; - justify-content: initial !important; - column-gap: 6px !important; - row-gap: 3px !important; - min-height: 58px !important; - padding: 9px 10px !important; - border: 1px solid rgba(16, 115, 204, 0.08) !important; - border-radius: 9px !important; - background: #f8f9fa !important; - text-align: left !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr) 16px; + grid-template-rows: auto auto; + align-items: center; + justify-content: initial; + column-gap: 6px; + row-gap: 3px; + min-height: 58px; + padding: 9px 10px; + border: 1px solid rgba(16, 115, 204, 0.08); + border-radius: 9px; + background: var(--ecom-bg-page); + text-align: left} .ecommerce-standalone .ecom-quick-set-selects button span { - display: block !important; - grid-column: 1 !important; - grid-row: 1 !important; - min-width: 0 !important; - color: #71818e !important; - font-size: 11px !important; - font-weight: 800 !important; - white-space: nowrap !important; -} + display: block; + grid-column: 1; + grid-row: 1; + min-width: 0; + color: var(--ecom-text-muted); + font-size: 11px; + font-weight: 800; + white-space: nowrap} .ecommerce-standalone .ecom-quick-set-selects button strong { - display: block !important; - grid-column: 1 !important; - grid-row: 2 !important; - min-width: 0 !important; - margin-top: 0 !important; - overflow: hidden !important; - color: #172636 !important; - font-size: 13px !important; - font-weight: 950 !important; - line-height: 1.25 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; -} + display: block; + grid-column: 1; + grid-row: 2; + min-width: 0; + margin-top: 0; + overflow: hidden; + color: var(--ecom-bg-dark-blue); + font-size: 13px; + font-weight: 950; + line-height: 1.25; + text-overflow: ellipsis; + white-space: nowrap} .ecommerce-standalone .ecom-quick-set-selects button em { - align-self: center !important; - grid-column: 2 !important; - grid-row: 1 / 3 !important; - justify-self: end !important; - color: #82919e !important; - font-style: normal !important; - font-size: 12px !important; -} + align-self: center; + grid-column: 2; + grid-row: 1 / 3; + justify-self: end; + color: #82919e; + font-style: normal; + font-size: 12px} .ecommerce-standalone .ecom-quick-set-selects button.is-active { - border-color: rgba(16, 115, 204, 0.36) !important; - background: #edf8ff !important; - box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.12) !important; -} + border-color: rgba(16, 115, 204, 0.36); + background: var(--ecom-bg-tinted); + box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.12)} .ecommerce-standalone .ecom-quick-set-dropdown { - position: absolute !important; - top: 66px !important; - left: 0 !important; - right: 0 !important; - z-index: 20 !important; - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 8px !important; - padding: 10px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 12px !important; - background: #feffff !important; - box-shadow: 0 16px 36px rgba(16, 115, 204, 0.12) !important; - transform-origin: top left !important; - will-change: opacity, transform, filter !important; - animation: ecomQuickDropdownIn 300ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + position: absolute; + top: 66px; + left: 0; + right: 0; + z-index: 20; + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 8px; + padding: 10px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 12px; + background: var(--ecom-bg-near-white); + box-shadow: 0 16px 36px rgba(16, 115, 204, 0.12); + transform-origin: top left; + will-change: opacity, transform, filter; + animation: ecomQuickDropdownIn 300ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecom-quick-set-dropdown--language, .ecommerce-standalone .ecom-quick-set-dropdown--ratio { - top: 132px !important; -} + top: 132px} .ecommerce-standalone .ecom-quick-set-dropdown.is-closing { - pointer-events: none !important; - animation: ecomQuickDropdownOut 420ms cubic-bezier(0.4, 0, 0.2, 1) both !important; -} + pointer-events: none; + animation: ecomQuickDropdownOut 420ms cubic-bezier(0.4, 0, 0.2, 1) both} .ecommerce-standalone .ecom-quick-set-dropdown button { - min-height: 32px !important; - padding: 0 10px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 8px !important; - color: #273849 !important; - background: #f8f9fa !important; - font-size: 12px !important; - font-weight: 850 !important; -} + min-height: 32px; + padding: 0 10px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 8px; + color: #273849; + background: var(--ecom-bg-page); + font-size: 12px; + font-weight: 850} .ecommerce-standalone .ecom-quick-set-dropdown button.is-active { - border-color: #1073cc !important; - color: #1073cc !important; - background: #edf8ff !important; - font-weight: 950 !important; -} + border-color: var(--ecom-primary); + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-weight: 950} .ecommerce-standalone .ecom-quick-detail-types { - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 8px !important; -} + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 8px} .ecommerce-standalone .ecom-quick-detail-types button { - min-height: 34px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 9px !important; - color: #253544 !important; - background: #f8f9fa !important; - font-size: 13px !important; - font-weight: 900 !important; -} + min-height: 34px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 9px; + color: #253544; + background: var(--ecom-bg-page); + font-size: 13px; + font-weight: 900} .ecommerce-standalone .ecom-quick-detail-types button.is-active { - border-color: #1073cc !important; - color: #1073cc !important; - background: #edf8ff !important; - box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.12) !important; -} + border-color: var(--ecom-primary); + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.12)} .ecommerce-standalone .ecom-quick-detail-thumbs { - display: grid !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - gap: 8px !important; -} + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 8px} .ecommerce-standalone .ecom-quick-detail-thumbs figure { - aspect-ratio: 1 / 1 !important; - margin: 0 !important; - overflow: hidden !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 9px !important; - background: #f8f9fa !important; -} + aspect-ratio: 1 / 1; + margin: 0; + overflow: hidden; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 9px; + background: var(--ecom-bg-page)} .ecommerce-standalone .ecom-quick-detail-thumbs img { - width: 100% !important; - height: 100% !important; - object-fit: cover !important; -} + width: 100%; + height: 100%; + object-fit: cover} .ecommerce-standalone .ecom-quick-detail-modules { - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 8px !important; - max-height: 430px !important; - overflow-y: auto !important; - padding-right: 4px !important; - scrollbar-width: thin !important; - scrollbar-color: rgba(16, 115, 204, 0.34) transparent !important; -} + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 8px; + max-height: 430px; + overflow-y: auto; + padding-right: 4px; + scrollbar-width: thin; + scrollbar-color: rgba(16, 115, 204, 0.34) transparent} .ecommerce-standalone .ecom-quick-detail-modules::-webkit-scrollbar { - width: 6px !important; -} + width: 6px} .ecommerce-standalone .ecom-quick-detail-modules::-webkit-scrollbar-track { - background: transparent !important; -} + background: transparent} .ecommerce-standalone .ecom-quick-detail-modules::-webkit-scrollbar-thumb { - border-radius: 999px !important; - background: rgba(16, 115, 204, 0.28) !important; -} + border-radius: 999px; + background: rgba(16, 115, 204, 0.28)} .ecommerce-standalone .ecom-quick-detail-page .ecom-quick-set-panel { - overflow-y: auto !important; - padding-bottom: 16px !important; - scrollbar-width: auto !important; - scrollbar-color: rgba(16, 115, 204, 0.56) rgba(16, 115, 204, 0.08) !important; -} + overflow-y: auto; + padding-bottom: 16px; + scrollbar-width: auto; + scrollbar-color: rgba(16, 115, 204, 0.56) rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-detail-page .ecom-quick-set-panel::-webkit-scrollbar { - display: block !important; - width: 14px !important; - height: 14px !important; -} + display: block; + width: 14px; + height: 14px} .ecommerce-standalone .ecom-quick-detail-page .ecom-quick-set-panel::-webkit-scrollbar-track { - border-radius: 999px !important; - background: rgba(16, 115, 204, 0.08) !important; -} + border-radius: 999px; + background: rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-detail-page .ecom-quick-set-panel::-webkit-scrollbar-thumb { - border: 3px solid rgba(248, 249, 250, 0.95) !important; - border-radius: 999px !important; - background: rgba(16, 115, 204, 0.56) !important; -} + border: 3px solid rgba(248, 249, 250, 0.95); + border-radius: 999px; + background: rgba(16, 115, 204, 0.56)} .ecommerce-standalone .ecom-quick-detail-page .ecom-quick-set-panel::-webkit-scrollbar-thumb:hover { - background: rgba(16, 115, 204, 0.72) !important; -} + background: rgba(16, 115, 204, 0.72)} .ecommerce-standalone .ecom-quick-detail-page .ecom-quick-detail-modules { - max-height: none !important; - overflow: visible !important; - padding-right: 0 !important; - scrollbar-width: auto !important; -} + max-height: none; + overflow: visible; + padding-right: 0; + scrollbar-width: auto} .ecommerce-standalone .ecom-quick-detail-modules button { - display: grid !important; - gap: 4px !important; - min-height: 58px !important; - padding: 9px 10px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 10px !important; - color: #172636 !important; - background: #f8f9fa !important; - text-align: left !important; -} + display: grid; + gap: 4px; + min-height: 58px; + padding: 9px 10px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 10px; + color: var(--ecom-bg-dark-blue); + background: var(--ecom-bg-page); + text-align: left} .ecommerce-standalone .ecom-quick-detail-modules button.is-active { - border-color: rgba(16, 115, 204, 0.48) !important; - background: #edf8ff !important; - box-shadow: inset 0 0 0 1px rgba(30, 189, 219, 0.08), 0 8px 18px rgba(16, 115, 204, 0.08) !important; -} + border-color: rgba(16, 115, 204, 0.48); + background: var(--ecom-bg-tinted); + box-shadow: inset 0 0 0 1px rgba(30, 189, 219, 0.08), 0 8px 18px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-detail-modules strong { - color: #172636 !important; - font-size: 13px !important; - font-weight: 950 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 13px; + font-weight: 950} .ecommerce-standalone .ecom-quick-detail-modules span { - color: #738392 !important; - font-size: 11px !important; - font-weight: 750 !important; -} + color: var(--ecom-text-muted); + font-size: 11px; + font-weight: 750} @keyframes ecomPopoverIn { from { opacity: 0; - transform: translateY(-6px) scale(0.98); - } + transform: translateY(-6px) scale(0.98)} to { opacity: 1; - transform: translateY(0) scale(1); - } + transform: translateY(0) scale(1)} } @keyframes ecomQuickDropdownIn { from { opacity: 0; filter: blur(5px); - transform: translateY(-8px) scale(0.96); - } + transform: translateY(-8px) scale(0.96)} 60% { opacity: 1; filter: blur(0); - transform: translateY(2px) scale(1.01); - } + transform: translateY(2px) scale(1.01)} to { opacity: 1; filter: blur(0); - transform: translateY(0) scale(1); - } + transform: translateY(0) scale(1)} } @keyframes ecomQuickDropdownOut { from { opacity: 1; filter: blur(0); - transform: translateY(0) scale(1); - } + transform: translateY(0) scale(1)} to { opacity: 0; filter: blur(4px); - transform: translateY(-8px) scale(0.96); - } + transform: translateY(-8px) scale(0.96)} } .ecommerce-standalone .ecom-quick-set-counts { - display: grid !important; - gap: 9px !important; -} + display: grid; + gap: 9px} .ecommerce-standalone .ecom-quick-set-counts article { - display: grid !important; - grid-template-columns: minmax(0, 1fr) auto !important; - align-items: center !important; - gap: 12px !important; - min-height: 58px !important; - padding: 10px !important; - border: 1px solid rgba(16, 115, 204, 0.08) !important; - border-radius: 10px !important; - background: #f8f9fa !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr) auto; + align-items: center; + gap: 12px; + min-height: 58px; + padding: 10px; + border: 1px solid rgba(16, 115, 204, 0.08); + border-radius: 10px; + background: var(--ecom-bg-page)} .ecommerce-standalone .ecom-quick-set-counts article strong { - color: #172636 !important; - font-size: 13px !important; - font-weight: 950 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 13px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-counts article span { - display: block !important; - margin-top: 4px !important; - color: #738392 !important; - font-size: 12px !important; - font-weight: 750 !important; -} + display: block; + margin-top: 4px; + color: var(--ecom-text-muted); + font-size: 12px; + font-weight: 750} .ecommerce-standalone .ecom-quick-set-counts p { - display: inline-grid !important; - grid-template-columns: 26px 28px 26px !important; - align-items: center !important; - margin: 0 !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 9px !important; - background: #ffffff !important; -} + display: inline-grid; + grid-template-columns: 26px 28px 26px; + align-items: center; + margin: 0; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 9px; + background: var(--ecom-bg-white)} .ecommerce-standalone .ecom-quick-set-counts p button, .ecommerce-standalone .ecom-quick-set-counts p b { - display: inline-grid !important; - place-items: center !important; - min-height: 28px !important; - border: 0 !important; - color: #1073cc !important; - background: transparent !important; - font-size: 13px !important; - font-weight: 950 !important; -} + display: inline-grid; + place-items: center; + min-height: 28px; + border: 0; + color: var(--ecom-primary); + background: transparent; + font-size: 13px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-primary { - position: absolute !important; - left: 14px !important; - right: 14px !important; - bottom: 14px !important; - min-height: 54px !important; - border: 0 !important; - border-radius: 13px !important; - color: #ffffff !important; - background: linear-gradient(135deg, #1073cc, #1ebddb) !important; - box-shadow: 0 16px 36px rgba(16, 115, 204, 0.2) !important; - font-size: 17px !important; - font-weight: 950 !important; -} + position: absolute; + left: 14px; + right: 14px; + bottom: 14px; + min-height: 54px; + border: 0; + border-radius: 13px; + color: var(--ecom-bg-white); + background: linear-gradient(135deg, var(--ecom-primary), var(--ecom-accent-cyan)); + box-shadow: 0 16px 36px rgba(16, 115, 204, 0.2); + font-size: 17px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-primary--cancel { - display: block !important; - position: static !important; - left: auto !important; - right: auto !important; - bottom: auto !important; - width: 100% !important; - margin-top: 8px !important; - min-height: 40px !important; - color: #ff4d4f !important; - background: rgba(255, 77, 79, 0.06) !important; - border: 1px solid rgba(255, 77, 79, 0.18) !important; - border-radius: 12px !important; - box-shadow: none !important; - font-size: 14px !important; - font-weight: 700 !important; - cursor: pointer !important; - transition: background 180ms ease, color 180ms ease, border-color 180ms ease !important; -} + display: block; + position: static; + left: auto; + right: auto; + bottom: auto; + width: 100%; + margin-top: 8px; + min-height: 40px; + color: #ff4d4f; + background: rgba(255, 77, 79, 0.06); + border: 1px solid rgba(255, 77, 79, 0.18); + border-radius: 12px; + box-shadow: none; + font-size: 14px; + font-weight: 700; + cursor: pointer; + transition: background 180ms ease, color 180ms ease, border-color 180ms ease} .ecommerce-standalone .ecom-quick-set-primary--cancel:hover { - color: #ffffff !important; - background: #ff4d4f !important; - border-color: #ff4d4f !important; -} + color: var(--ecom-bg-white); + background: #ff4d4f; + border-color: #ff4d4f} .ecommerce-standalone .ecom-quick-set-primary:disabled { - color: #8fa1af !important; - background: #eef2f5 !important; - box-shadow: none !important; -} + color: #8fa1af; + background: #eef2f5; + box-shadow: none} .ecommerce-standalone .ecom-quick-set-page .ecom-quick-set-primary { - position: static !important; - left: auto !important; - right: auto !important; - bottom: auto !important; - width: 100% !important; - margin-top: auto !important; - flex: 0 0 auto !important; -} + position: static; + left: auto; + right: auto; + bottom: auto; + width: 100%; + margin-top: auto; + flex: 0 0 auto} .ecommerce-standalone .ecom-quick-set-page .ecom-quick-set-panel { - overflow-y: auto !important; - padding-bottom: 16px !important; - scrollbar-width: auto !important; - scrollbar-color: rgba(16, 115, 204, 0.56) rgba(16, 115, 204, 0.08) !important; -} + overflow-y: auto; + padding-bottom: 16px; + scrollbar-width: auto; + scrollbar-color: rgba(16, 115, 204, 0.56) rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-set-page .ecom-quick-set-panel::-webkit-scrollbar { - display: block !important; - width: 14px !important; - height: 14px !important; -} + display: block; + width: 14px; + height: 14px} .ecommerce-standalone .ecom-quick-set-page .ecom-quick-set-panel::-webkit-scrollbar-track { - border-radius: 999px !important; - background: rgba(16, 115, 204, 0.08) !important; -} + border-radius: 999px; + background: rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-set-page .ecom-quick-set-panel::-webkit-scrollbar-thumb { - border: 3px solid rgba(248, 249, 250, 0.95) !important; - border-radius: 999px !important; - background: rgba(16, 115, 204, 0.56) !important; -} + border: 3px solid rgba(248, 249, 250, 0.95); + border-radius: 999px; + background: rgba(16, 115, 204, 0.56)} .ecommerce-standalone .ecom-quick-set-page .ecom-quick-set-panel::-webkit-scrollbar-thumb:hover { - background: rgba(16, 115, 204, 0.72) !important; -} + background: rgba(16, 115, 204, 0.72)} .ecommerce-standalone .ecom-quick-detail-page .ecom-quick-set-primary { - position: static !important; - left: auto !important; - right: auto !important; - bottom: auto !important; - width: 100% !important; - margin-top: 2px !important; - flex: 0 0 auto !important; -} + position: static; + left: auto; + right: auto; + bottom: auto; + width: 100%; + margin-top: 2px; + flex: 0 0 auto} .ecommerce-standalone .ecom-quick-set-stage { - position: relative !important; - display: grid !important; - grid-template-rows: auto minmax(0, 1fr) auto !important; - gap: 18px !important; - place-items: stretch !important; - padding: 24px 34px !important; + position: relative; + display: grid; + grid-template-rows: auto minmax(0, 1fr) auto; + gap: 18px; + place-items: stretch; + padding: 24px 34px; background: radial-gradient(circle at 52% 46%, rgba(30, 189, 219, 0.07), transparent 26rem), - #f8f9fa !important; -} + var(--ecom-bg-page)} .ecommerce-standalone .ecom-quick-set-preview-head { - display: grid !important; - gap: 8px !important; - justify-items: start !important; - padding-bottom: 18px !important; - border-bottom: 1px solid rgba(16, 115, 204, 0.08) !important; -} + display: grid; + gap: 8px; + justify-items: start; + padding-bottom: 18px; + border-bottom: 1px solid rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-set-preview-head h1 { - margin: 0 !important; - color: #172636 !important; - font-size: 21px !important; - font-weight: 950 !important; -} + margin: 0; + color: var(--ecom-bg-dark-blue); + font-size: 21px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-preview-head p { - margin: 0 !important; - color: #657686 !important; - font-size: 13px !important; - font-weight: 750 !important; -} + margin: 0; + color: #657686; + font-size: 13px; + font-weight: 750} .ecommerce-standalone .ecom-quick-set-preview-head p span { - color: #1073cc !important; - font-weight: 950 !important; -} + color: var(--ecom-primary); + font-weight: 950} .ecommerce-standalone .ecom-quick-set-preview-head div { - display: inline-flex !important; - align-items: center !important; - gap: 8px !important; -} + display: inline-flex; + align-items: center; + gap: 8px} .ecommerce-standalone .ecom-quick-set-preview-head div button { - width: 24px !important; - height: 24px !important; - border: 0 !important; - border-radius: 7px !important; - color: #1073cc !important; - background: #edf8ff !important; - font-weight: 950 !important; -} + width: 24px; + height: 24px; + border: 0; + border-radius: 7px; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-weight: 950} .ecommerce-standalone .ecom-quick-set-canvas { - display: grid !important; - place-items: center !important; - min-height: 340px !important; -} + display: grid; + place-items: center; + min-height: 340px} .ecommerce-standalone .ecom-quick-set-empty { - display: grid !important; - place-items: center !important; - gap: 12px !important; - width: min(480px, 76%) !important; - min-height: 200px !important; - padding: 28px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 18px !important; - color: #738392 !important; - background: #ffffff !important; - box-shadow: 0 18px 48px rgba(16, 115, 204, 0.06) !important; - text-align: center !important; -} + display: grid; + place-items: center; + gap: 12px; + width: min(480px, 76%); + min-height: 200px; + padding: 28px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 18px; + color: var(--ecom-text-muted); + background: var(--ecom-bg-white); + box-shadow: 0 18px 48px rgba(16, 115, 204, 0.06); + text-align: center} .ecommerce-standalone .ecom-quick-set-empty .anticon { - display: inline-grid !important; - place-items: center !important; - width: 58px !important; - height: 58px !important; - border-radius: 50% !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 26px !important; -} + display: inline-grid; + place-items: center; + width: 58px; + height: 58px; + border-radius: 50%; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 26px} .ecommerce-standalone .ecom-quick-set-empty strong { - color: #172636 !important; - font-size: 19px !important; - font-weight: 950 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 19px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-generating, .ecommerce-standalone .ecom-quick-set-failed { - display: grid !important; - place-items: center !important; - gap: 12px !important; - width: min(480px, 76%) !important; - min-height: 200px !important; - padding: 28px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 18px !important; - color: #738392 !important; - background: #ffffff !important; - box-shadow: 0 18px 48px rgba(16, 115, 204, 0.06) !important; - text-align: center !important; -} + display: grid; + place-items: center; + gap: 12px; + width: min(480px, 76%); + min-height: 200px; + padding: 28px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 18px; + color: var(--ecom-text-muted); + background: var(--ecom-bg-white); + box-shadow: 0 18px 48px rgba(16, 115, 204, 0.06); + text-align: center} .ecommerce-standalone .ecom-quick-set-generating .anticon { - display: inline-grid !important; - place-items: center !important; - width: 58px !important; - height: 58px !important; - border-radius: 50% !important; - color: #1073cc !important; - background: #edf8ff !important; - font-size: 26px !important; - animation: spin 1s linear infinite !important; -} + display: inline-grid; + place-items: center; + width: 58px; + height: 58px; + border-radius: 50%; + color: var(--ecom-primary); + background: var(--ecom-bg-tinted); + font-size: 26px; + animation: spin 1s linear infinite} .ecommerce-standalone .ecom-quick-set-generating strong { - color: #172636 !important; - font-size: 19px !important; - font-weight: 950 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 19px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-generating span { - color: #738392 !important; - font-size: 13px !important; - line-height: 1.5 !important; -} + color: var(--ecom-text-muted); + font-size: 13px; + line-height: 1.5} .ecommerce-standalone .ecom-quick-set-progress { - width: 100% !important; - max-width: 320px !important; - height: 6px !important; - border-radius: 3px !important; - background: #e8eef4 !important; - overflow: hidden !important; -} + width: 100%; + max-width: 320px; + height: 6px; + border-radius: 3px; + background: #e8eef4; + overflow: hidden} .ecommerce-standalone .ecom-quick-set-progress-bar { - height: 100% !important; - border-radius: 3px !important; - background: linear-gradient(90deg, #1073cc, #38bdf8) !important; - transition: width 500ms ease !important; -} + height: 100%; + border-radius: 3px; + background: linear-gradient(90deg, var(--ecom-primary), #38bdf8); + transition: width 500ms ease} .ecommerce-standalone .ecom-quick-set-progress-text { - color: #1073cc !important; - font-size: 13px !important; - font-weight: 700 !important; - font-style: normal !important; -} + color: var(--ecom-primary); + font-size: 13px; + font-weight: 700; + font-style: normal} .ecommerce-standalone .ecom-quick-set-failed .anticon { - display: inline-grid !important; - place-items: center !important; - width: 58px !important; - height: 58px !important; - border-radius: 50% !important; - color: #e04545 !important; - background: #fff0f0 !important; - font-size: 26px !important; -} + display: inline-grid; + place-items: center; + width: 58px; + height: 58px; + border-radius: 50%; + color: #e04545; + background: #fff0f0; + font-size: 26px} .ecommerce-standalone .ecom-quick-set-failed strong { - color: #172636 !important; - font-size: 19px !important; - font-weight: 950 !important; -} + color: var(--ecom-bg-dark-blue); + font-size: 19px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-failed span { - color: #738392 !important; - font-size: 13px !important; - line-height: 1.5 !important; -} + color: var(--ecom-text-muted); + font-size: 13px; + line-height: 1.5} .ecommerce-standalone .ecom-quick-set-failed button { - min-height: 36px !important; - padding: 0 20px !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 10px !important; - color: #1073cc !important; - background: #ffffff !important; - font-size: 13px !important; - font-weight: 700 !important; - cursor: pointer !important; - transition: background 180ms ease, color 180ms ease !important; -} + min-height: 36px; + padding: 0 20px; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 10px; + color: var(--ecom-primary); + background: var(--ecom-bg-white); + font-size: 13px; + font-weight: 700; + cursor: pointer; + transition: background 180ms ease, color 180ms ease} .ecommerce-standalone .ecom-quick-set-failed button:hover:not(:disabled) { - color: #ffffff !important; - background: #1073cc !important; -} + color: var(--ecom-bg-white); + background: var(--ecom-primary)} .ecommerce-standalone .ecom-quick-set-failed button:disabled { - opacity: 0.45 !important; - cursor: not-allowed !important; -} + opacity: 0.45; + cursor: not-allowed} @keyframes spin { - from { transform: rotate(0deg); } - to { transform: rotate(360deg); } + from { transform: rotate(0deg)} + to { transform: rotate(360deg)} } .ecommerce-standalone .ecom-quick-set-result-card { - display: grid !important; - grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) !important; - gap: 16px !important; - width: min(760px, 92%) !important; - padding: 18px !important; - border: 1px solid rgba(16, 115, 204, 0.08) !important; - border-radius: 18px !important; - background: #ffffff !important; - box-shadow: 0 20px 56px rgba(16, 115, 204, 0.08) !important; - transform-origin: center !important; -} + display: grid; + grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); + gap: 16px; + width: min(760px, 92%); + padding: 18px; + border: 1px solid rgba(16, 115, 204, 0.08); + border-radius: 18px; + background: var(--ecom-bg-white); + box-shadow: 0 20px 56px rgba(16, 115, 204, 0.08); + transform-origin: center} .ecommerce-standalone .ecom-quick-set-result-card figure { - position: relative !important; - margin: 0 !important; - overflow: hidden !important; - border-radius: 12px !important; - background: #f3f6f8 !important; -} + position: relative; + margin: 0; + overflow: hidden; + border-radius: 12px; + background: #f3f6f8} .ecommerce-standalone .ecom-quick-set-result-card figure img { - width: 100% !important; - height: 100% !important; - object-fit: cover !important; -} + width: 100%; + height: 100%; + object-fit: cover} .ecommerce-standalone .ecom-quick-set-result-card > figure { - min-height: 280px !important; -} + min-height: 280px} .ecommerce-standalone .ecom-quick-set-result-card > div { - display: grid !important; - grid-template-columns: 1fr 1fr !important; - gap: 10px !important; -} + display: grid; + grid-template-columns: 1fr 1fr; + gap: 10px} .ecommerce-standalone .ecom-quick-set-result-card > div figure { - min-height: 134px !important; -} + min-height: 134px} .ecommerce-standalone .ecom-quick-set-result-card figure span { - position: absolute !important; - top: 9px !important; - left: 9px !important; - padding: 4px 9px !important; - border-radius: 999px !important; - color: #435566 !important; - background: rgba(255, 255, 255, 0.86) !important; - font-size: 11px !important; - font-weight: 950 !important; -} + position: absolute; + top: 9px; + left: 9px; + padding: 4px 9px; + border-radius: 999px; + color: #435566; + background: rgba(255, 255, 255, 0.86); + font-size: 11px; + font-weight: 950} .ecommerce-standalone .ecom-quick-detail-preview-card { - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 12px !important; - width: min(620px, 88%) !important; - padding: 16px !important; - border: 1px solid rgba(16, 115, 204, 0.08) !important; - border-radius: 18px !important; - background: #ffffff !important; - box-shadow: 0 20px 56px rgba(16, 115, 204, 0.08) !important; - transform-origin: center !important; -} + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 12px; + width: min(620px, 88%); + padding: 16px; + border: 1px solid rgba(16, 115, 204, 0.08); + border-radius: 18px; + background: var(--ecom-bg-white); + box-shadow: 0 20px 56px rgba(16, 115, 204, 0.08); + transform-origin: center} .ecommerce-standalone .ecom-quick-detail-preview-card figure, .ecommerce-standalone .ecom-quick-detail-result { - position: relative !important; - margin: 0 !important; - overflow: hidden !important; - border-radius: 12px !important; - background: #f3f6f8 !important; -} + position: relative; + margin: 0; + overflow: hidden; + border-radius: 12px; + background: #f3f6f8} .ecommerce-standalone .ecom-quick-detail-preview-card figure { - min-height: 150px !important; -} + min-height: 150px} .ecommerce-standalone .ecom-quick-detail-preview-card img, .ecommerce-standalone .ecom-quick-detail-result img { - width: 100% !important; - height: 100% !important; - object-fit: cover !important; -} + width: 100%; + height: 100%; + object-fit: cover} .ecommerce-standalone .ecom-quick-detail-preview-card span { - position: absolute !important; - top: 9px !important; - left: 9px !important; - padding: 4px 9px !important; - border-radius: 999px !important; - color: #435566 !important; - background: rgba(255, 255, 255, 0.86) !important; - font-size: 11px !important; - font-weight: 950 !important; -} + position: absolute; + top: 9px; + left: 9px; + padding: 4px 9px; + border-radius: 999px; + color: #435566; + background: rgba(255, 255, 255, 0.86); + font-size: 11px; + font-weight: 950} .ecommerce-standalone .ecom-quick-detail-result { - width: min(520px, 80%) !important; - min-height: 620px !important; - border: 1px solid rgba(16, 115, 204, 0.08) !important; - box-shadow: 0 20px 56px rgba(16, 115, 204, 0.08) !important; - transform-origin: center !important; -} + width: min(520px, 80%); + min-height: 620px; + border: 1px solid rgba(16, 115, 204, 0.08); + box-shadow: 0 20px 56px rgba(16, 115, 204, 0.08); + transform-origin: center} .ecommerce-standalone .ecom-quick-detail-download { - position: absolute !important; - bottom: 16px !important; - right: 16px !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 7px !important; - min-height: 36px !important; - padding: 0 16px !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 10px !important; - color: #1073cc !important; - background: rgba(255, 255, 255, 0.92) !important; - backdrop-filter: blur(6px) !important; - box-shadow: 0 8px 20px rgba(16, 115, 204, 0.06) !important; - font-size: 13px !important; - font-weight: 850 !important; - cursor: pointer !important; - transition: transform 180ms ease, color 180ms ease, background 180ms ease, box-shadow 180ms ease !important; -} + position: absolute; + bottom: 16px; + right: 16px; + display: inline-flex; + align-items: center; + justify-content: center; + gap: 7px; + min-height: 36px; + padding: 0 16px; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 10px; + color: var(--ecom-primary); + background: rgba(255, 255, 255, 0.92); + backdrop-filter: blur(6px); + box-shadow: 0 8px 20px rgba(16, 115, 204, 0.06); + font-size: 13px; + font-weight: 850; + cursor: pointer; + transition: transform 180ms ease, color 180ms ease, background 180ms ease, box-shadow 180ms ease} .ecommerce-standalone .ecom-quick-detail-download:hover { - color: #ffffff !important; - background: #1073cc !important; - box-shadow: 0 12px 26px rgba(16, 115, 204, 0.18) !important; - transform: translateY(-1px) !important; -} + color: var(--ecom-bg-white); + background: var(--ecom-primary); + box-shadow: 0 12px 26px rgba(16, 115, 204, 0.18); + transform: translateY(-1px)} .ecommerce-standalone .ecom-quick-detail-download:active { - transform: scale(0.96) !important; -} + transform: scale(0.96)} .ecommerce-standalone .ecom-quick-set-prompt { - position: relative !important; - display: grid !important; - grid-template-columns: minmax(0, 1fr) 40px !important; - align-items: end !important; - gap: 12px !important; - min-height: 92px !important; - padding: 14px 15px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 17px !important; - background: #ffffff !important; - box-shadow: 0 14px 36px rgba(16, 115, 204, 0.05) !important; -} + position: relative; + display: grid; + grid-template-columns: minmax(0, 1fr) 40px; + align-items: end; + gap: 12px; + min-height: 92px; + padding: 14px 15px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 17px; + background: var(--ecom-bg-white); + box-shadow: 0 14px 36px rgba(16, 115, 204, 0.05)} .ecommerce-standalone .ecom-quick-detail-page .ecom-quick-set-prompt { - grid-template-columns: minmax(0, 1fr) auto !important; -} + grid-template-columns: minmax(0, 1fr) auto} .ecommerce-standalone .ecom-quick-detail-prompt-actions { - display: inline-flex !important; - gap: 8px !important; -} + display: inline-flex; + gap: 8px} .ecommerce-standalone .ecom-quick-set-prompt textarea { - min-height: 62px !important; - resize: none !important; - border: 0 !important; - outline: none !important; - color: #172636 !important; - background: transparent !important; - font-size: 13px !important; - font-weight: 750 !important; -} + min-height: 62px; + resize: none; + border: 0; + outline: none; + color: var(--ecom-bg-dark-blue); + background: transparent; + font-size: 13px; + font-weight: 750} .ecommerce-standalone .ecom-quick-set-prompt button { - width: 40px !important; - height: 40px !important; - border: 0 !important; - border-radius: 50% !important; - color: #ffffff !important; - background: #1073cc !important; - font-size: 18px !important; - font-weight: 950 !important; -} + width: 40px; + height: 40px; + border: 0; + border-radius: 50%; + color: var(--ecom-bg-white); + background: var(--ecom-primary); + font-size: 18px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-prompt button:disabled { - color: #8fa1af !important; - background: #eef2f5 !important; -} + color: #8fa1af; + background: #eef2f5} .ecommerce-standalone .ecom-quick-set-prompt span { - position: absolute !important; - right: 14px !important; - bottom: -22px !important; - color: #71818e !important; - font-size: 12px !important; - font-weight: 850 !important; -} + position: absolute; + right: 14px; + bottom: -22px; + color: var(--ecom-text-muted); + font-size: 12px; + font-weight: 850} .ecommerce-standalone .ecom-quick-set-collapse { - display: none !important; -} + display: none} .ecommerce-standalone .ecom-quick-set-collapse:hover { - border-color: rgba(30, 189, 219, 0.5) !important; - color: #1073cc !important; - background: rgba(30, 189, 219, 0.1) !important; - transform: translateY(-50%) translateY(-1px) !important; -} + border-color: rgba(30, 189, 219, 0.5); + color: var(--ecom-primary); + background: rgba(30, 189, 219, 0.1); + transform: translateY(-50%) translateY(-1px)} .ecommerce-standalone .ecom-quick-set-page.is-panel-collapsed .ecom-quick-set-collapse { - left: 12px !important; -} + left: 12px} .ecommerce-standalone .ecom-smart-cutout-page { - position: relative !important; - width: 100% !important; - min-width: 100% !important; - height: 100% !important; - min-height: calc(100vh - 58px) !important; - overflow: auto !important; - color: #111820 !important; - background: #feffff !important; - font-family: "PingFang SC", "Microsoft YaHei", sans-serif !important; - animation: ecom-smart-page-enter 440ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + position: relative; + width: 100%; + min-width: 100%; + height: 100%; + min-height: calc(100vh - 58px); + overflow: auto; + color: #111820; + background: var(--ecom-bg-near-white); + font-family: "PingFang SC", "Microsoft YaHei", sans-serif; + animation: ecom-smart-page-enter 440ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecom-smart-cutout-nav { - position: sticky !important; - top: 18px !important; - left: 24px !important; - z-index: 12 !important; - display: inline-flex !important; - align-items: center !important; - gap: 10px !important; - margin: 18px 0 -52px 24px !important; - padding: 6px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 15px !important; - background: rgba(254, 255, 255, 0.86) !important; - box-shadow: 0 14px 34px rgba(16, 115, 204, 0.08) !important; - backdrop-filter: blur(12px) !important; - -webkit-backdrop-filter: blur(12px) !important; -} + position: sticky; + top: 18px; + left: 24px; + z-index: 12; + display: inline-flex; + align-items: center; + gap: 10px; + margin: 18px 0 -52px 24px; + padding: 6px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 15px; + background: rgba(254, 255, 255, 0.86); + box-shadow: 0 14px 34px rgba(16, 115, 204, 0.08); + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px)} .ecommerce-standalone .ecom-smart-cutout-nav button { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - min-width: 70px !important; - min-height: 32px !important; - padding: 0 13px !important; - border: 0 !important; - border-radius: 11px !important; - color: #1073cc !important; - background: transparent !important; - font-size: 13px !important; - font-weight: 700 !important; - cursor: pointer !important; - transition: color 180ms ease, background 180ms ease, box-shadow 180ms ease !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + min-width: 70px; + min-height: 32px; + padding: 0 13px; + border: 0; + border-radius: 11px; + color: var(--ecom-primary); + background: transparent; + font-size: 13px; + font-weight: 700; + cursor: pointer; + transition: color 180ms ease, background 180ms ease, box-shadow 180ms ease} .ecommerce-standalone .ecom-smart-cutout-nav button:hover { - color: #ffffff !important; - background: #1073cc !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.18) !important; -} + color: var(--ecom-bg-white); + background: var(--ecom-primary); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.18)} .ecommerce-standalone .ecom-smart-cutout-transition, .ecommerce-standalone .ecom-quick-page-transition { - position: fixed !important; - inset: 64px 0 0 !important; - z-index: 30 !important; - display: grid !important; - place-content: center !important; - justify-items: center !important; - gap: 10px !important; - color: #10202c !important; - background: rgba(248, 253, 255, 0.82) !important; - backdrop-filter: blur(18px) !important; - -webkit-backdrop-filter: blur(18px) !important; - animation: ecom-smart-transition-in 260ms ease both !important; -} + position: fixed; + inset: 64px 0 0; + z-index: 30; + display: grid; + place-content: center; + justify-items: center; + gap: 10px; + color: var(--ecom-text-primary); + background: rgba(248, 253, 255, 0.82); + backdrop-filter: blur(18px); + -webkit-backdrop-filter: blur(18px); + animation: ecom-smart-transition-in 260ms ease both} .ecommerce-standalone .ecom-smart-cutout-transition span, .ecommerce-standalone .ecom-quick-page-transition span { - width: 56px !important; - height: 56px !important; - border: 4px solid rgba(30, 189, 219, 0.16) !important; - border-top-color: #1ebddb !important; - border-radius: 50% !important; - box-shadow: 0 12px 30px rgba(30, 189, 219, 0.18) !important; - animation: ecom-smart-transition-spin 860ms linear infinite !important; -} + width: 56px; + height: 56px; + border: 4px solid rgba(30, 189, 219, 0.16); + border-top-color: var(--ecom-accent-cyan); + border-radius: 50%; + box-shadow: 0 12px 30px rgba(30, 189, 219, 0.18); + animation: ecom-smart-transition-spin 860ms linear infinite} .ecommerce-standalone .ecom-smart-cutout-transition strong, .ecommerce-standalone .ecom-quick-page-transition strong { - margin-top: 8px !important; - color: #10202c !important; - font-size: 20px !important; - font-weight: 800 !important; -} + margin-top: 8px; + color: var(--ecom-text-primary); + font-size: 20px; + font-weight: 800} .ecommerce-standalone .ecom-smart-cutout-transition em, .ecommerce-standalone .ecom-quick-page-transition em { - color: #6d7d88 !important; - font-size: 13px !important; - font-style: normal !important; - font-weight: 600 !important; -} + color: #6d7d88; + font-size: 13px; + font-style: normal; + font-weight: 600} .ecommerce-standalone .ecom-smart-cutout-page.is-transitioning .ecom-smart-cutout-upload, .ecommerce-standalone .ecom-smart-cutout-page.is-transitioning .ecom-smart-editor { - pointer-events: none !important; - animation: ecom-smart-page-hold 620ms ease both !important; -} + pointer-events: none; + animation: ecom-smart-page-hold 620ms ease both} .ecommerce-standalone .ecom-smart-cutout-upload { - position: relative !important; - display: grid !important; - align-content: center !important; - justify-items: center !important; - gap: 28px !important; - min-height: calc(100vh - 64px) !important; - padding: 72px 32px 96px !important; - animation: ecom-smart-upload-enter 460ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + position: relative; + display: grid; + align-content: center; + justify-items: center; + gap: 28px; + min-height: calc(100vh - 64px); + padding: 72px 32px 96px; + animation: ecom-smart-upload-enter 460ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecom-smart-cutout-head { - display: grid !important; - gap: 10px !important; - text-align: center !important; -} + display: grid; + gap: 10px; + text-align: center} .ecommerce-standalone .ecom-smart-cutout-head strong { - color: #101820 !important; - font-size: 34px !important; - font-weight: 800 !important; - line-height: 1.15 !important; - letter-spacing: 0 !important; -} + color: #101820; + font-size: 34px; + font-weight: 800; + line-height: 1.15; + letter-spacing: 0} .ecommerce-standalone .ecom-smart-cutout-head span { - color: #6f7e89 !important; - font-size: 15px !important; - font-weight: 500 !important; -} + color: #6f7e89; + font-size: 15px; + font-weight: 500} .ecommerce-standalone .ecom-smart-cutout-upload__body { - display: grid !important; - grid-template-columns: minmax(280px, 360px) minmax(360px, 520px) !important; - gap: 32px !important; - align-items: stretch !important; - width: min(930px, 100%) !important; -} + display: grid; + grid-template-columns: minmax(280px, 360px) minmax(360px, 520px); + gap: 32px; + align-items: stretch; + width: min(930px, 100%)} .ecommerce-standalone .ecom-smart-cutout-demo { - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 20px !important; - padding: 28px !important; - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 20px !important; - background: #ffffff !important; - box-shadow: 0 18px 46px rgba(16, 115, 204, 0.07) !important; -} + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 20px; + padding: 28px; + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 20px; + background: var(--ecom-bg-white); + box-shadow: 0 18px 46px rgba(16, 115, 204, 0.07)} .ecommerce-standalone .ecom-smart-cutout-demo__tile { - position: relative !important; - min-height: 130px !important; - overflow: hidden !important; - border-radius: 18px !important; - background: #f3f8fa !important; - box-shadow: inset 0 0 0 1px rgba(16, 115, 204, 0.06), 0 12px 24px rgba(16, 115, 204, 0.08) !important; -} + position: relative; + min-height: 130px; + overflow: hidden; + border-radius: 18px; + background: var(--ecom-bg-cool); + box-shadow: inset 0 0 0 1px rgba(16, 115, 204, 0.06), 0 12px 24px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-smart-cutout-demo__tile::before, .ecommerce-standalone .ecom-smart-cutout-demo__tile::after { - position: absolute !important; - content: "" !important; -} + position: absolute; + content: ""} .ecommerce-standalone .ecom-smart-cutout-demo__tile--flower { background: radial-gradient(circle at 52% 38%, #fff9c8 0 9px, transparent 10px), radial-gradient(circle at 43% 44%, #f25f7a 0 7px, transparent 8px), radial-gradient(circle at 61% 48%, #ff9f43 0 8px, transparent 9px), - linear-gradient(135deg, #c9a16d, #6a4622) !important; -} + linear-gradient(135deg, #c9a16d, #6a4622)} .ecommerce-standalone .ecom-smart-cutout-demo__tile--flower::before { - left: 50% !important; - bottom: 18px !important; - width: 52px !important; - height: 58px !important; - border-radius: 12px 12px 20px 20px !important; - background: rgba(255, 255, 255, 0.6) !important; - transform: translateX(-50%) !important; -} + left: 50%; + bottom: 18px; + width: 52px; + height: 58px; + border-radius: 12px 12px 20px 20px; + background: rgba(255, 255, 255, 0.6); + transform: translateX(-50%)} .ecommerce-standalone .ecom-smart-cutout-demo__tile--product { background: - radial-gradient(circle at 50% 34%, #ffffff 0 28px, transparent 29px), - linear-gradient(135deg, #f2f5f7, #6f7680) !important; -} + radial-gradient(circle at 50% 34%, var(--ecom-bg-white) 0 28px, transparent 29px), + linear-gradient(135deg, #f2f5f7, #6f7680)} .ecommerce-standalone .ecom-smart-cutout-demo__tile--product::before { - left: 50% !important; - bottom: 18px !important; - width: 74px !important; - height: 52px !important; - border-radius: 20px 20px 26px 26px !important; - background: linear-gradient(135deg, #37424e, #d5dde4) !important; - transform: translateX(-50%) !important; -} + left: 50%; + bottom: 18px; + width: 74px; + height: 52px; + border-radius: 20px 20px 26px 26px; + background: linear-gradient(135deg, #37424e, #d5dde4); + transform: translateX(-50%)} .ecommerce-standalone .ecom-smart-cutout-demo__tile--poster { - background: #ffffff !important; -} + background: var(--ecom-bg-white)} .ecommerce-standalone .ecom-smart-cutout-demo__tile--poster::before { - inset: 24px 18px !important; - border-radius: 10px !important; + inset: 24px 18px; + border-radius: 10px; background: radial-gradient(circle at 38% 48%, rgba(235, 81, 116, 0.42) 0 24px, transparent 25px), - linear-gradient(12deg, transparent 0 42%, #1073cc 43% 47%, transparent 48%), - linear-gradient(0deg, #f2f7fb 0 100%) !important; -} + linear-gradient(12deg, transparent 0 42%, var(--ecom-primary) 43% 47%, transparent 48%), + linear-gradient(0deg, #f2f7fb 0 100%)} .ecommerce-standalone .ecom-smart-cutout-demo__tile--object { - background: linear-gradient(135deg, #f2eee8, #c7b6a0) !important; -} + background: linear-gradient(135deg, #f2eee8, #c7b6a0)} .ecommerce-standalone .ecom-smart-cutout-demo__tile--object::before { - left: 50% !important; - top: 30px !important; - width: 70px !important; - height: 70px !important; - border: 9px solid #f7fafc !important; - border-radius: 50% !important; - background: repeating-conic-gradient(from 0deg, #d7dee4 0 8deg, #ffffff 9deg 16deg) !important; - transform: translateX(-50%) !important; -} + left: 50%; + top: 30px; + width: 70px; + height: 70px; + border: 9px solid #f7fafc; + border-radius: 50%; + background: repeating-conic-gradient(from 0deg, #d7dee4 0 8deg, var(--ecom-bg-white) 9deg 16deg); + transform: translateX(-50%)} .ecommerce-standalone .ecom-smart-cutout-demo__tile--object::after { - left: 50% !important; - bottom: 18px !important; - width: 42px !important; - height: 48px !important; - border-radius: 12px !important; - background: #f8fbfd !important; - transform: translateX(-50%) !important; -} + left: 50%; + bottom: 18px; + width: 42px; + height: 48px; + border-radius: 12px; + background: #f8fbfd; + transform: translateX(-50%)} .ecommerce-standalone .ecom-smart-cutout-upload-box { - display: grid !important; - align-content: center !important; - justify-items: center !important; - gap: 12px !important; - min-height: 360px !important; - padding: 36px !important; - border: 1.5px dashed rgba(16, 115, 204, 0.46) !important; - border-radius: 20px !important; - background: #ffffff !important; - cursor: pointer !important; - transition: border-color 240ms ease, box-shadow 240ms ease, transform 240ms ease, background 240ms ease !important; -} + display: grid; + align-content: center; + justify-items: center; + gap: 12px; + min-height: 360px; + padding: 36px; + border: 1.5px dashed rgba(16, 115, 204, 0.46); + border-radius: 20px; + background: var(--ecom-bg-white); + cursor: pointer; + transition: border-color 240ms ease, box-shadow 240ms ease, transform 240ms ease, background 240ms ease} .ecommerce-standalone .ecom-smart-cutout-upload-box:hover, .ecommerce-standalone .ecom-smart-cutout-upload-box.is-dragging { - border-color: #1ebddb !important; - background: #f8fdff !important; - box-shadow: 0 18px 46px rgba(30, 189, 219, 0.12) !important; - transform: translateY(-2px) !important; -} + border-color: var(--ecom-accent-cyan); + background: var(--ecom-bg-near-white); + box-shadow: 0 18px 46px rgba(30, 189, 219, 0.12); + transform: translateY(-2px)} .ecommerce-standalone .ecom-smart-cutout-upload-box button { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 8px !important; - width: 190px !important; - min-height: 42px !important; - border-radius: 9px !important; - font-size: 14px !important; - font-weight: 700 !important; - cursor: pointer !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + gap: 8px; + width: 190px; + min-height: 42px; + border-radius: 9px; + font-size: 14px; + font-weight: 700; + cursor: pointer} .ecommerce-standalone .ecom-smart-cutout-upload__primary { - border: 0 !important; - color: #ffffff !important; - background: #1073cc !important; - box-shadow: 0 10px 22px rgba(16, 115, 204, 0.2) !important; -} + border: 0; + color: var(--ecom-bg-white); + background: var(--ecom-primary); + box-shadow: 0 10px 22px rgba(16, 115, 204, 0.2)} .ecommerce-standalone .ecom-smart-cutout-upload__secondary { - border: 1px solid rgba(16, 115, 204, 0.16) !important; - color: #253544 !important; - background: #ffffff !important; -} + border: 1px solid rgba(16, 115, 204, 0.16); + color: #253544; + background: var(--ecom-bg-white)} .ecommerce-standalone .ecom-smart-cutout-upload-box > span { - margin-top: 2px !important; - color: #6b7b86 !important; - font-size: 13px !important; - font-weight: 600 !important; -} + margin-top: 2px; + color: #6b7b86; + font-size: 13px; + font-weight: 600} .ecommerce-standalone .ecom-smart-cutout-back { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - min-height: 34px !important; - padding: 0 14px !important; - border: 1px solid rgba(16, 115, 204, 0.14) !important; - border-radius: 12px !important; - color: #1073cc !important; - background: #f4fbfd !important; - font-size: 13px !important; - font-weight: 700 !important; - cursor: pointer !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + min-height: 34px; + padding: 0 14px; + border: 1px solid rgba(16, 115, 204, 0.14); + border-radius: 12px; + color: var(--ecom-primary); + background: #f4fbfd; + font-size: 13px; + font-weight: 700; + cursor: pointer} .ecommerce-standalone .ecom-smart-cutout-upload > .ecom-smart-cutout-back { - position: absolute !important; - top: 22px !important; - left: 28px !important; -} + position: absolute; + top: 22px; + left: 28px} .ecommerce-standalone .ecom-smart-editor { - display: grid !important; - grid-template-columns: minmax(0, 1fr) 300px !important; - gap: 32px !important; - width: min(1120px, calc(100% - 64px)) !important; - min-height: calc(100vh - 64px) !important; - margin: 0 auto !important; - padding: 22px 0 60px !important; - animation: ecom-smart-editor-enter 520ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + display: grid; + grid-template-columns: minmax(0, 1fr) 300px; + gap: 32px; + width: min(1120px, calc(100% - 64px)); + min-height: calc(100vh - 64px); + margin: 0 auto; + padding: 22px 0 60px; + animation: ecom-smart-editor-enter 520ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecom-smart-editor__workspace { - display: grid !important; - grid-template-rows: auto auto auto !important; - gap: 14px !important; - min-width: 0 !important; -} + display: grid; + grid-template-rows: auto auto auto; + gap: 14px; + min-width: 0} .ecommerce-standalone .ecom-smart-editor__canvas { - position: relative !important; - display: grid !important; - place-items: center !important; - min-height: 430px !important; - overflow: hidden !important; - background: #e8edf3 !important; -} + position: relative; + display: grid; + place-items: center; + min-height: 430px; + overflow: hidden; + background: #e8edf3} .ecommerce-standalone .ecom-smart-editor__checker { - position: relative !important; - display: grid !important; - place-items: center !important; - width: var(--smart-cutout-frame-width, min(520px, 78%)) !important; - min-height: 430px !important; - aspect-ratio: var(--smart-cutout-frame-aspect, auto) !important; - overflow: hidden !important; - background: transparent !important; - transition: width 220ms ease, aspect-ratio 220ms ease, min-height 220ms ease !important; -} + position: relative; + display: grid; + place-items: center; + width: var(--smart-cutout-frame-width, min(520px, 78%)); + min-height: 430px; + aspect-ratio: var(--smart-cutout-frame-aspect, auto); + overflow: hidden; + background: transparent; + transition: width 220ms ease, aspect-ratio 220ms ease, min-height 220ms ease} .ecommerce-standalone .ecom-smart-editor__background-layer { - position: absolute !important; - inset: 0 !important; - z-index: 0 !important; - background: var(--smart-cutout-bg, #ffffff) !important; - transition: background-color 180ms ease, background 180ms ease !important; -} + position: absolute; + inset: 0; + z-index: 0; + background: var(--smart-cutout-bg, #ffffff); + transition: background-color 180ms ease, background 180ms ease} .ecommerce-standalone .ecom-smart-editor__checker:not(.is-size-original):not(.is-size-trim) { - min-height: 0 !important; -} + min-height: 0} .ecommerce-standalone .ecom-smart-editor__checker.is-size-trim { - min-height: 320px !important; - padding: 18px !important; -} + min-height: 320px; + padding: 18px} .ecommerce-standalone .ecom-smart-editor__checker img { - position: relative !important; - z-index: 1 !important; - display: block !important; - max-width: var(--smart-cutout-image-max-width, 78%) !important; - max-height: var(--smart-cutout-image-max-height, 310px) !important; - object-fit: contain !important; - filter: drop-shadow(0 16px 24px rgba(17, 24, 32, 0.14)) !important; - transition: max-width 220ms ease, max-height 220ms ease !important; -} + position: relative; + z-index: 1; + display: block; + max-width: var(--smart-cutout-image-max-width, 78%); + max-height: var(--smart-cutout-image-max-height, 310px); + object-fit: contain; + filter: drop-shadow(0 16px 24px rgba(17, 24, 32, 0.14)); + transition: max-width 220ms ease, max-height 220ms ease} .ecommerce-standalone .ecom-smart-editor__canvas-actions { - position: absolute !important; - top: 20px !important; - right: 18px !important; - display: flex !important; - gap: 8px !important; -} + position: absolute; + top: 20px; + right: 18px; + display: flex; + gap: 8px} .ecommerce-standalone .ecom-smart-editor__canvas-actions button { - min-height: 34px !important; - padding: 0 12px !important; - border: 0 !important; - border-radius: 9px !important; - color: #1e2d38 !important; - background: rgba(255, 255, 255, 0.9) !important; - font-size: 13px !important; - font-weight: 700 !important; -} + min-height: 34px; + padding: 0 12px; + border: 0; + border-radius: 9px; + color: #1e2d38; + background: rgba(255, 255, 255, 0.9); + font-size: 13px; + font-weight: 700} .ecommerce-standalone .ecom-smart-editor__tools-shell { - display: grid !important; - grid-template-columns: 24px minmax(0, 1fr) 24px !important; - grid-template-rows: auto auto !important; - align-items: start !important; - gap: 6px 5px !important; - height: auto !important; - overflow: visible !important; -} + display: grid; + grid-template-columns: 24px minmax(0, 1fr) 24px; + grid-template-rows: auto auto; + align-items: start; + gap: 6px 5px; + height: auto; + overflow: visible} .ecommerce-standalone .ecom-smart-editor__tools-title { - grid-column: 1 / -1 !important; - color: #1c2a35 !important; - font-size: 16px !important; - font-weight: 800 !important; - line-height: 1.15 !important; -} + grid-column: 1 / -1; + color: #1c2a35; + font-size: 16px; + font-weight: 800; + line-height: 1.15} .ecommerce-standalone .ecom-smart-editor__tools { - display: flex !important; - align-items: start !important; - gap: 5px !important; - min-width: 0 !important; - height: auto !important; - overflow-x: auto !important; - overflow-y: visible !important; - scroll-behavior: smooth !important; - scrollbar-width: none !important; -} + display: flex; + align-items: start; + gap: 5px; + min-width: 0; + height: auto; + overflow-x: auto; + overflow-y: visible; + scroll-behavior: smooth; + scrollbar-width: none} .ecommerce-standalone .ecom-smart-editor__tools::-webkit-scrollbar { - display: none !important; -} + display: none} .ecommerce-standalone .ecom-smart-editor__tools-nav { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - width: 24px !important; - height: 100px !important; - min-width: 24px !important; - min-height: 100px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 7px !important; - color: #1073cc !important; - background: #f8fdff !important; - box-shadow: 0 6px 14px rgba(16, 115, 204, 0.06) !important; - font-size: 17px !important; - font-weight: 800 !important; - line-height: 1 !important; - cursor: pointer !important; -} + display: inline-flex; + align-items: center; + justify-content: center; + width: 24px; + height: 100px; + min-width: 24px; + min-height: 100px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 7px; + color: var(--ecom-primary); + background: var(--ecom-bg-near-white); + box-shadow: 0 6px 14px rgba(16, 115, 204, 0.06); + font-size: 17px; + font-weight: 800; + line-height: 1; + cursor: pointer} .ecommerce-standalone .ecom-smart-editor__tools-nav:hover { - border-color: #1ebddb !important; - background: #effbfe !important; -} + border-color: var(--ecom-accent-cyan); + background: #effbfe} .ecommerce-standalone .ecom-smart-editor__tools button { - flex: 0 0 100px !important; - width: 100px !important; - height: 100px !important; - display: inline-grid !important; - place-items: center !important; - min-height: 100px !important; - padding: 10px 8px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 7px !important; - color: #2d3d48 !important; - background: #f2f5f7 !important; - font-size: 9px !important; - font-weight: 700 !important; - cursor: pointer !important; -} + flex: 0 0 100px; + width: 100px; + height: 100px; + display: inline-grid; + place-items: center; + min-height: 100px; + padding: 10px 8px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 7px; + color: #2d3d48; + background: #f2f5f7; + font-size: 9px; + font-weight: 700; + cursor: pointer} .ecommerce-standalone .ecom-smart-editor__tool-item { - flex: 0 0 100px !important; - display: grid !important; - gap: 6px !important; - justify-items: center !important; - width: 100px !important; -} + flex: 0 0 100px; + display: grid; + gap: 6px; + justify-items: center; + width: 100px} .ecommerce-standalone .ecom-smart-editor__tools button.is-active { - border-color: #1073cc !important; - color: #1073cc !important; - background: #f8fdff !important; - box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.16) !important; -} + border-color: var(--ecom-primary); + color: var(--ecom-primary); + background: var(--ecom-bg-near-white); + box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.16)} .ecommerce-standalone .ecom-smart-editor__tool-text { - display: grid !important; - gap: 2px !important; - justify-items: center !important; - max-width: 100% !important; - text-align: center !important; - line-height: 1.18 !important; - color: #2d3d48 !important; - font-size: 10px !important; - font-weight: 800 !important; -} + display: grid; + gap: 2px; + justify-items: center; + max-width: 100%; + text-align: center; + line-height: 1.18; + color: #2d3d48; + font-size: 10px; + font-weight: 800} .ecommerce-standalone .ecom-smart-editor__tool-text > span { - max-width: 100% !important; - overflow: hidden !important; - text-overflow: ellipsis !important; -} + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis} .ecommerce-standalone .ecom-smart-editor__tool-text > span:first-child { - display: -webkit-box !important; - -webkit-box-orient: vertical !important; - -webkit-line-clamp: 2 !important; -} + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2} .ecommerce-standalone .ecom-smart-editor__tool-text > span:last-child:not(:first-child) { - font-size: 9px !important; - font-weight: 800 !important; - color: #6a7c88 !important; -} + font-size: 9px; + font-weight: 800; + color: #6a7c88} .ecommerce-standalone .ecom-smart-editor__tool-icon { - position: relative !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - width: 24px !important; - height: 24px !important; - color: currentColor !important; - transform: scale(0.72) !important; -} + position: relative; + display: inline-flex; + align-items: center; + justify-content: center; + width: 24px; + height: 24px; + color: currentColor; + transform: scale(0.72)} .ecommerce-standalone .ecom-smart-editor__tool-icon::before { - display: block !important; - border: 2px solid currentColor !important; - border-radius: 5px !important; - content: "" !important; -} + display: block; + border: 2px solid currentColor; + border-radius: 5px; + content: ""} .ecommerce-standalone .ecom-smart-editor__tool-icon--image::before { - width: 20px !important; - height: 16px !important; - border-radius: 4px !important; -} + width: 20px; + height: 16px; + border-radius: 4px} .ecommerce-standalone .ecom-smart-editor__tool-icon--image::after { - position: absolute !important; - left: 6px !important; - bottom: 6px !important; - width: 12px !important; - height: 7px !important; - border-radius: 2px 2px 4px 4px !important; - background: linear-gradient(135deg, transparent 0 45%, currentColor 46% 54%, transparent 55%) !important; - content: "" !important; - opacity: 0.8 !important; -} + position: absolute; + left: 6px; + bottom: 6px; + width: 12px; + height: 7px; + border-radius: 2px 2px 4px 4px; + background: linear-gradient(135deg, transparent 0 45%, currentColor 46% 54%, transparent 55%); + content: ""; + opacity: 0.8} .ecommerce-standalone .ecom-smart-editor__tool-icon--crop::before { - width: 18px !important; - height: 18px !important; - border-radius: 3px !important; -} + width: 18px; + height: 18px; + border-radius: 3px} .ecommerce-standalone .ecom-smart-editor__tool-icon--crop::after { - position: absolute !important; - width: 22px !important; - height: 22px !important; - border-top: 2px solid currentColor !important; - border-left: 2px solid currentColor !important; - content: "" !important; - transform: translate(2px, 2px) rotate(-45deg) scale(0.55) !important; - opacity: 0.9 !important; -} + position: absolute; + width: 22px; + height: 22px; + border-top: 2px solid currentColor; + border-left: 2px solid currentColor; + content: ""; + transform: translate(2px, 2px) rotate(-45deg) scale(0.55); + opacity: 0.9} .ecommerce-standalone .ecom-smart-editor__tool-icon--shop::before, .ecommerce-standalone .ecom-smart-editor__tool-icon--pdd::before { - width: 18px !important; - height: 18px !important; - border-radius: 4px !important; -} + width: 18px; + height: 18px; + border-radius: 4px} .ecommerce-standalone .ecom-smart-editor__tool-icon--shop::after, .ecommerce-standalone .ecom-smart-editor__tool-icon--pdd::after { - position: absolute !important; - right: 2px !important; - bottom: 2px !important; - color: currentColor !important; - font-size: 8px !important; - font-weight: 900 !important; - content: "淘" !important; -} + position: absolute; + right: 2px; + bottom: 2px; + color: currentColor; + font-size: 8px; + font-weight: 900; + content: "淘"} .ecommerce-standalone .ecom-smart-editor__tool-icon--pdd::after { - content: "拼" !important; -} + content: "拼"} .ecommerce-standalone .ecom-smart-editor__tool-icon--text::before { - width: 19px !important; - height: 14px !important; - border-radius: 4px !important; -} + width: 19px; + height: 14px; + border-radius: 4px} .ecommerce-standalone .ecom-smart-editor__tool-icon--text::after { - position: absolute !important; - color: currentColor !important; - font-size: 8px !important; - font-weight: 900 !important; - content: "小红书" !important; - transform: scale(0.72) !important; -} + position: absolute; + color: currentColor; + font-size: 8px; + font-weight: 900; + content: "小红书"; + transform: scale(0.72)} .ecommerce-standalone .ecom-smart-editor__tool-icon--portrait::before, .ecommerce-standalone .ecom-smart-editor__tool-icon--portrait-ratio::before, .ecommerce-standalone .ecom-smart-editor__tool-icon--phone::before { - width: 12px !important; - height: 20px !important; - border-radius: 5px !important; -} + width: 12px; + height: 20px; + border-radius: 5px} .ecommerce-standalone .ecom-smart-editor__tool-icon--square::before { - width: 17px !important; - height: 17px !important; - border-radius: 5px !important; -} + width: 17px; + height: 17px; + border-radius: 5px} .ecommerce-standalone .ecom-smart-editor__tool-icon--landscape::before { - width: 20px !important; - height: 13px !important; - border-radius: 5px !important; -} + width: 20px; + height: 13px; + border-radius: 5px} .ecommerce-standalone .ecom-smart-editor__tool-icon--wide::before { - width: 22px !important; - height: 10px !important; - border-radius: 5px !important; -} + width: 22px; + height: 10px; + border-radius: 5px} .ecommerce-standalone .ecom-smart-editor__batch { - display: grid !important; - gap: 10px !important; - min-width: 0 !important; - padding: 12px !important; - border: 1px solid rgba(30, 189, 219, 0.14) !important; - border-radius: 12px !important; - background: rgba(248, 253, 255, 0.82) !important; -} + display: grid; + gap: 10px; + min-width: 0; + padding: 12px; + border: 1px solid rgba(30, 189, 219, 0.14); + border-radius: 12px; + background: rgba(248, 253, 255, 0.82)} .ecommerce-standalone .ecom-smart-editor__batch header { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; - gap: 12px !important; - color: #172636 !important; -} + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + color: var(--ecom-bg-dark-blue)} .ecommerce-standalone .ecom-smart-editor__batch header strong { - font-size: 14px !important; - font-weight: 800 !important; -} + font-size: 14px; + font-weight: 800} .ecommerce-standalone .ecom-smart-editor__batch header span { - color: #6e8290 !important; - font-size: 12px !important; - font-weight: 700 !important; -} + color: #6e8290; + font-size: 12px; + font-weight: 700} .ecommerce-standalone .ecom-smart-editor__batch > div { - display: flex !important; - gap: 10px !important; - min-width: 0 !important; - overflow-x: auto !important; - padding-bottom: 2px !important; -} + display: flex; + gap: 10px; + min-width: 0; + overflow-x: auto; + padding-bottom: 2px} .ecommerce-standalone .ecom-smart-editor__batch button { - position: relative !important; - flex: 0 0 74px !important; - width: 74px !important; - height: 74px !important; - overflow: hidden !important; - border: 2px solid transparent !important; - border-radius: 12px !important; - background: #ffffff !important; - cursor: pointer !important; - box-shadow: 0 10px 22px rgba(16, 115, 204, 0.08) !important; -} + position: relative; + flex: 0 0 74px; + width: 74px; + height: 74px; + overflow: hidden; + border: 2px solid transparent; + border-radius: 12px; + background: var(--ecom-bg-white); + cursor: pointer; + box-shadow: 0 10px 22px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-smart-editor__batch button.is-active { - border-color: #1073cc !important; - box-shadow: 0 12px 26px rgba(16, 115, 204, 0.16) !important; -} + border-color: var(--ecom-primary); + box-shadow: 0 12px 26px rgba(16, 115, 204, 0.16)} .ecommerce-standalone .ecom-smart-editor__batch button img { - display: block !important; - width: 100% !important; - height: 100% !important; - object-fit: cover !important; -} + display: block; + width: 100%; + height: 100%; + object-fit: cover} .ecommerce-standalone .ecom-smart-editor__batch button span { - position: absolute !important; - right: 5px !important; - bottom: 5px !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - min-width: 20px !important; - height: 20px !important; - padding: 0 6px !important; - border-radius: 999px !important; - color: #ffffff !important; - background: rgba(16, 115, 204, 0.88) !important; - font-size: 11px !important; - font-weight: 800 !important; -} + position: absolute; + right: 5px; + bottom: 5px; + display: inline-flex; + align-items: center; + justify-content: center; + min-width: 20px; + height: 20px; + padding: 0 6px; + border-radius: 999px; + color: var(--ecom-bg-white); + background: rgba(16, 115, 204, 0.88); + font-size: 11px; + font-weight: 800} .ecommerce-standalone .ecom-smart-editor__gallery { - display: grid !important; - gap: 14px !important; -} + display: grid; + gap: 14px} .ecommerce-standalone .ecom-smart-editor__gallery header { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; - color: #1c2a35 !important; -} + display: flex; + align-items: center; + justify-content: space-between; + color: #1c2a35} .ecommerce-standalone .ecom-smart-editor__gallery header strong { - font-size: 16px !important; - font-weight: 800 !important; -} + font-size: 16px; + font-weight: 800} .ecommerce-standalone .ecom-smart-editor__gallery header button { - border: 0 !important; - color: #9aa6ad !important; - background: transparent !important; - font-size: 13px !important; - font-weight: 700 !important; -} + border: 0; + color: #9aa6ad; + background: transparent; + font-size: 13px; + font-weight: 700} .ecommerce-standalone .ecom-smart-editor__swatches, .ecommerce-standalone .ecom-smart-editor__scenes { - display: grid !important; - grid-template-columns: repeat(6, minmax(0, 1fr)) !important; - gap: 10px !important; -} + display: grid; + grid-template-columns: repeat(6, minmax(0, 1fr)); + gap: 10px} .ecommerce-standalone .ecom-smart-editor__swatches button, .ecommerce-standalone .ecom-smart-editor__scenes button { - position: relative !important; - min-height: 118px !important; - overflow: hidden !important; - border: 1px solid rgba(16, 115, 204, 0.08) !important; - border-radius: 8px !important; - color: #20313e !important; - background: #f3f8fa !important; - cursor: pointer !important; -} + position: relative; + min-height: 118px; + overflow: hidden; + border: 1px solid rgba(16, 115, 204, 0.08); + border-radius: 8px; + color: #20313e; + background: var(--ecom-bg-cool); + cursor: pointer} .ecommerce-standalone .ecom-smart-editor__swatches button { - background: var(--smart-cutout-swatch-bg, #ffffff) !important; -} + background: var(--smart-cutout-swatch-bg, #ffffff)} .ecommerce-standalone .ecom-smart-editor__swatch-bg { - position: absolute !important; - inset: 0 !important; - z-index: 0 !important; - border-radius: inherit !important; - background: var(--smart-cutout-swatch-bg, #ffffff) !important; - box-shadow: inset 0 0 0 1px rgba(16, 115, 204, 0.06) !important; -} + position: absolute; + inset: 0; + z-index: 0; + border-radius: inherit; + background: var(--smart-cutout-swatch-bg, #ffffff); + box-shadow: inset 0 0 0 1px rgba(16, 115, 204, 0.06)} .ecommerce-standalone .ecom-smart-editor__swatches button img { - position: absolute !important; - left: 50% !important; - top: 50% !important; - z-index: 1 !important; - width: 46% !important; - height: 58% !important; - object-fit: contain !important; - transform: translate(-50%, -50%) !important; - filter: drop-shadow(0 10px 16px rgba(17, 24, 32, 0.12)) !important; -} + position: absolute; + left: 50%; + top: 50%; + z-index: 1; + width: 46%; + height: 58%; + object-fit: contain; + transform: translate(-50%, -50%); + filter: drop-shadow(0 10px 16px rgba(17, 24, 32, 0.12))} .ecommerce-standalone .ecom-smart-editor__swatches button.is-active { - border-color: #1073cc !important; - box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.16) !important; -} + border-color: var(--ecom-primary); + box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.16)} .ecommerce-standalone .ecom-smart-editor__generate { - display: grid !important; - place-items: center !important; - color: #5f83ff !important; - font-size: 20px !important; - font-weight: 800 !important; - background: linear-gradient(135deg, #eefcff, #fff5ff) !important; -} + display: grid; + place-items: center; + color: #5f83ff; + font-size: 20px; + font-weight: 800; + background: linear-gradient(135deg, #eefcff, #fff5ff)} .ecommerce-standalone .ecom-smart-editor__scenes button:not(.ecom-smart-editor__generate) { background: radial-gradient(circle at 22% 18%, rgba(30, 189, 219, 0.2), transparent 34%), - linear-gradient(135deg, #eef4f7, #d9e1e7) !important; -} + linear-gradient(135deg, #eef4f7, #d9e1e7)} .ecommerce-standalone .ecom-smart-editor__scenes button span { - position: absolute !important; - left: 10px !important; - bottom: 9px !important; - color: #243542 !important; - font-size: 12px !important; - font-weight: 800 !important; -} + position: absolute; + left: 10px; + bottom: 9px; + color: #243542; + font-size: 12px; + font-weight: 800} .ecommerce-standalone .ecom-smart-editor__side { - position: sticky !important; - top: 20px !important; - align-self: start !important; - display: grid !important; - gap: 18px !important; - padding: 10px 0 !important; - color: #1c2a35 !important; -} + position: sticky; + top: 20px; + align-self: start; + display: grid; + gap: 18px; + padding: 10px 0; + color: #1c2a35} .ecommerce-standalone .ecom-smart-editor__side > strong { - font-size: 15px !important; - font-weight: 800 !important; -} + font-size: 15px; + font-weight: 800} .ecommerce-standalone .ecom-smart-editor__color-row { - display: flex !important; - flex-wrap: wrap !important; - gap: 9px !important; -} + display: flex; + flex-wrap: wrap; + gap: 9px} .ecommerce-standalone .ecom-smart-editor__color-row button, .ecommerce-standalone .ecom-smart-editor__custom-color { - position: relative !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - width: 44px !important; - height: 44px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 7px !important; - cursor: pointer !important; -} + position: relative; + display: inline-flex; + align-items: center; + justify-content: center; + width: 44px; + height: 44px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 7px; + cursor: pointer} .ecommerce-standalone .ecom-smart-editor__color-wrap { - position: relative !important; - display: inline-flex !important; -} + position: relative; + display: inline-flex} .ecommerce-standalone .ecom-smart-editor__color-row button.is-active, .ecommerce-standalone .ecom-smart-editor__custom-color.is-active, .ecommerce-standalone .ecom-smart-editor__custom-color:focus-visible { - border-color: #1073cc !important; - box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.16) !important; -} + border-color: var(--ecom-primary); + box-shadow: 0 0 0 3px rgba(30, 189, 219, 0.16)} .ecommerce-standalone .ecom-smart-editor__custom-color { - overflow: hidden !important; - color: #ffffff !important; - font-size: 12px !important; - font-weight: 800 !important; - text-shadow: 0 1px 3px rgba(0, 0, 0, 0.32) !important; -} + overflow: hidden; + color: var(--ecom-bg-white); + font-size: 12px; + font-weight: 800; + text-shadow: 0 1px 3px rgba(0, 0, 0, 0.32)} .ecommerce-standalone .ecom-smart-editor__custom-color::before { - position: absolute !important; - inset: 0 !important; - content: "" !important; + position: absolute; + inset: 0; + content: ""; background: linear-gradient(135deg, rgba(255, 255, 255, 0.48), transparent 42%), - linear-gradient(135deg, transparent, rgba(0, 0, 0, 0.18)) !important; -} + linear-gradient(135deg, transparent, rgba(0, 0, 0, 0.18))} .ecommerce-standalone .ecom-smart-editor__custom-color span { - position: relative !important; - z-index: 1 !important; - pointer-events: none !important; -} + position: relative; + z-index: 1; + pointer-events: none} .ecommerce-standalone .ecom-smart-color-picker { - position: absolute !important; - top: -6px !important; - left: calc(100% + 12px) !important; - z-index: 80 !important; - display: grid !important; - gap: 10px !important; - width: 266px !important; - padding: 14px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 14px !important; - background: #ffffff !important; - box-shadow: 0 22px 52px rgba(18, 34, 48, 0.16) !important; - animation: ecommerce-soft-popover-in 260ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + position: absolute; + top: -6px; + left: calc(100% + 12px); + z-index: 80; + display: grid; + gap: 10px; + width: 266px; + padding: 14px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 14px; + background: var(--ecom-bg-white); + box-shadow: 0 22px 52px rgba(18, 34, 48, 0.16); + animation: ecommerce-soft-popover-in 260ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecom-smart-color-picker::after { - position: absolute !important; - top: 22px !important; - left: -7px !important; - width: 14px !important; - height: 14px !important; - border-top: 1px solid rgba(16, 115, 204, 0.12) !important; - border-left: 1px solid rgba(16, 115, 204, 0.12) !important; - border-right: 0 !important; - background: #ffffff !important; - content: "" !important; - transform: rotate(-45deg) !important; -} + position: absolute; + top: 22px; + left: -7px; + width: 14px; + height: 14px; + border-top: 1px solid rgba(16, 115, 204, 0.12); + border-left: 1px solid rgba(16, 115, 204, 0.12); + border-right: 0; + background: var(--ecom-bg-white); + content: ""; + transform: rotate(-45deg)} .ecommerce-standalone .ecom-smart-color-picker__plane { - position: relative !important; - width: 100% !important; - height: 140px !important; - overflow: hidden !important; - border: 0 !important; - border-radius: 10px !important; - cursor: crosshair !important; -} + position: relative; + width: 100%; + height: 140px; + overflow: hidden; + border: 0; + border-radius: 10px; + cursor: crosshair} .ecommerce-standalone .ecom-smart-color-picker__plane span { - position: absolute !important; - width: 13px !important; - height: 13px !important; - border: 2px solid #ffffff !important; - border-radius: 50% !important; - box-shadow: 0 1px 4px rgba(0, 0, 0, 0.36) !important; - transform: translate(-50%, -50%) !important; - pointer-events: none !important; -} + position: absolute; + width: 13px; + height: 13px; + border: 2px solid var(--ecom-bg-white); + border-radius: 50%; + box-shadow: 0 1px 4px rgba(0, 0, 0, 0.36); + transform: translate(-50%, -50%); + pointer-events: none} .ecommerce-standalone .ecom-smart-color-picker__slider { - position: relative !important; - display: grid !important; - grid-template-columns: 26px minmax(0, 1fr) !important; - align-items: center !important; - gap: 8px !important; -} + position: relative; + display: grid; + grid-template-columns: 26px minmax(0, 1fr); + align-items: center; + gap: 8px} .ecommerce-standalone .ecom-smart-color-picker__slider > span { - width: 24px !important; - height: 24px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 7px !important; - box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.42) !important; -} + width: 24px; + height: 24px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 7px; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.42)} .ecommerce-standalone .ecom-smart-color-picker__slider input { - width: 100% !important; - height: 16px !important; - margin: 0 !important; - padding: 0 !important; - border: 0 !important; - border-radius: 999px !important; - appearance: none !important; - cursor: pointer !important; - accent-color: #1073cc !important; -} + width: 100%; + height: 16px; + margin: 0; + padding: 0; + border: 0; + border-radius: 999px; + appearance: none; + cursor: pointer; + accent-color: var(--ecom-primary)} .ecommerce-standalone .ecom-smart-color-picker__slider--hue input { - background: linear-gradient(90deg, #ff2b2b, #ffed00, #1dd85b, #18c8ff, #2f55ff, #b12bff, #ff2b2b) !important; -} + background: linear-gradient(90deg, #ff2b2b, #ffed00, #1dd85b, #18c8ff, #2f55ff, #b12bff, #ff2b2b)} .ecommerce-standalone .ecom-smart-color-picker__slider--alpha input { background: @@ -8431,346 +7392,292 @@ linear-gradient(-45deg, #d8dde1 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #d8dde1 75%), linear-gradient(-45deg, transparent 75%, #d8dde1 75%), - linear-gradient(90deg, transparent, var(--smart-cutout-bg, #ffffff)) !important; - background-position: 0 0, 0 8px, 8px -8px, -8px 0, 0 0 !important; - background-size: 16px 16px, 16px 16px, 16px 16px, 16px 16px, 100% 100% !important; -} + linear-gradient(90deg, transparent, var(--smart-cutout-bg, #ffffff)); + background-position: 0 0, 0 8px, 8px -8px, -8px 0, 0 0; + background-size: 16px 16px, 16px 16px, 16px 16px, 16px 16px, 100% 100%} .ecommerce-standalone .ecom-smart-color-picker__slider input::-webkit-slider-thumb { - width: 14px !important; - height: 14px !important; - border: 2px solid #ffffff !important; - border-radius: 50% !important; - background: #ffffff !important; - appearance: none !important; - box-shadow: 0 1px 5px rgba(0, 0, 0, 0.24) !important; -} + width: 14px; + height: 14px; + border: 2px solid var(--ecom-bg-white); + border-radius: 50%; + background: var(--ecom-bg-white); + appearance: none; + box-shadow: 0 1px 5px rgba(0, 0, 0, 0.24)} .ecommerce-standalone .ecom-smart-color-picker__slider input::-moz-range-thumb { - width: 14px !important; - height: 14px !important; - border: 2px solid #ffffff !important; - border-radius: 50% !important; - background: #ffffff !important; - box-shadow: 0 1px 5px rgba(0, 0, 0, 0.24) !important; -} + width: 14px; + height: 14px; + border: 2px solid var(--ecom-bg-white); + border-radius: 50%; + background: var(--ecom-bg-white); + box-shadow: 0 1px 5px rgba(0, 0, 0, 0.24)} .ecommerce-standalone .ecom-smart-color-picker__fields { - display: grid !important; - grid-template-columns: 1fr 1.4fr 56px 28px !important; - gap: 8px !important; - align-items: center !important; -} + display: grid; + grid-template-columns: 1fr 1.4fr 56px 28px; + gap: 8px; + align-items: center} .ecommerce-standalone .ecom-smart-color-picker__fields span, .ecommerce-standalone .ecom-smart-color-picker__fields input, .ecommerce-standalone .ecom-smart-color-picker__fields strong { - min-width: 0 !important; - height: 30px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 7px !important; - color: #5b6b76 !important; - background: #ffffff !important; - font-size: 12px !important; - font-weight: 700 !important; -} + min-width: 0; + height: 30px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 7px; + color: #5b6b76; + background: var(--ecom-bg-white); + font-size: 12px; + font-weight: 700} .ecommerce-standalone .ecom-smart-color-picker__fields span, .ecommerce-standalone .ecom-smart-color-picker__fields strong { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; -} + display: inline-flex; + align-items: center; + justify-content: center} .ecommerce-standalone .ecom-smart-color-picker__fields input { - width: 100% !important; - padding: 0 8px !important; - outline: none !important; -} + width: 100%; + padding: 0 8px; + outline: none} .ecommerce-standalone .ecom-smart-color-picker p { - margin: 6px 0 0 !important; - color: #657481 !important; - font-size: 12px !important; - font-weight: 700 !important; -} + margin: 6px 0 0; + color: #657481; + font-size: 12px; + font-weight: 700} .ecommerce-standalone .ecom-smart-color-picker__presets { - display: grid !important; - grid-template-columns: repeat(9, 20px) !important; - gap: 7px !important; -} + display: grid; + grid-template-columns: repeat(9, 20px); + gap: 7px} .ecommerce-standalone .ecom-smart-color-picker__presets button { - width: 20px !important; - height: 20px !important; - min-height: 20px !important; - border-radius: 5px !important; - box-shadow: none !important; -} + width: 20px; + height: 20px; + min-height: 20px; + border-radius: 5px; + box-shadow: none} .ecommerce-standalone .ecom-smart-editor__side label { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; - gap: 16px !important; - min-height: 34px !important; - color: #1f2e39 !important; - font-size: 14px !important; - font-weight: 800 !important; -} + display: flex; + align-items: center; + justify-content: space-between; + gap: 16px; + min-height: 34px; + color: #1f2e39; + font-size: 14px; + font-weight: 800} .ecommerce-standalone .ecom-smart-editor__side input { - width: 34px !important; - height: 18px !important; - accent-color: #1073cc !important; -} + width: 34px; + height: 18px; + accent-color: var(--ecom-primary)} .ecommerce-standalone .ecom-smart-editor__side .ecom-smart-color-picker input { - accent-color: #1073cc !important; -} + accent-color: var(--ecom-primary)} .ecommerce-standalone .ecom-smart-editor__side .ecom-smart-color-picker__slider input { - width: 100% !important; - height: 16px !important; -} + width: 100%; + height: 16px} .ecommerce-standalone .ecom-smart-editor__side .ecom-smart-color-picker__fields input { - width: 100% !important; - height: 30px !important; -} + width: 100%; + height: 30px} .ecommerce-standalone .ecom-smart-editor__link { - justify-self: start !important; - border: 0 !important; - color: #1f2e39 !important; - background: transparent !important; - font-size: 14px !important; - font-weight: 800 !important; -} + justify-self: start; + border: 0; + color: #1f2e39; + background: transparent; + font-size: 14px; + font-weight: 800} .ecommerce-standalone .ecom-smart-editor__side-actions { - display: grid !important; - gap: 18px !important; - margin-top: 24px !important; -} + display: grid; + gap: 18px; + margin-top: 24px} .ecommerce-standalone .ecom-smart-editor__side-actions button { - min-height: 46px !important; - border: 0 !important; - border-radius: 9px !important; - color: #1f2e39 !important; - background: #f1f4f6 !important; - font-size: 15px !important; - font-weight: 800 !important; - cursor: pointer !important; -} + min-height: 46px; + border: 0; + border-radius: 9px; + color: #1f2e39; + background: #f1f4f6; + font-size: 15px; + font-weight: 800; + cursor: pointer} .ecommerce-standalone .ecom-smart-editor__download { - color: #ffffff !important; - background: #1073cc !important; - box-shadow: 0 12px 24px rgba(16, 115, 204, 0.18) !important; -} + color: var(--ecom-bg-white); + background: var(--ecom-primary); + box-shadow: 0 12px 24px rgba(16, 115, 204, 0.18)} @media (max-width: 1020px) { .ecommerce-standalone .ecom-smart-cutout-upload__body, .ecommerce-standalone .ecom-smart-editor { - grid-template-columns: 1fr !important; - } + grid-template-columns: 1fr} .ecommerce-standalone .ecom-smart-editor__tools { - grid-template-columns: repeat(6, minmax(0, 1fr)) !important; - } + grid-template-columns: repeat(6, minmax(0, 1fr))} .ecommerce-standalone .ecom-smart-editor__swatches, .ecommerce-standalone .ecom-smart-editor__scenes { - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - } + grid-template-columns: repeat(3, minmax(0, 1fr))} } @keyframes ecom-smart-transition-in { from { - opacity: 0; - } + opacity: 0} to { - opacity: 1; - } + opacity: 1} } @keyframes ecom-smart-page-enter { from { opacity: 0; - transform: translateY(10px); - } + transform: translateY(10px)} to { opacity: 1; - transform: translateY(0); - } + transform: translateY(0)} } @keyframes ecom-tool-page-enter { from { opacity: 0; transform: translateY(14px) scale(0.992); - filter: saturate(0.96); - } + filter: saturate(0.96)} to { opacity: 1; transform: translateY(0) scale(1); - filter: saturate(1); - } + filter: saturate(1)} } @keyframes ecom-tool-panel-enter { from { opacity: 0; - transform: translateY(16px); - } + transform: translateY(16px)} to { opacity: 1; - transform: translateY(0); - } + transform: translateY(0)} } @keyframes ecom-tool-side-enter { from { opacity: 0; - transform: translateX(-14px); - } + transform: translateX(-14px)} to { opacity: 1; - transform: translateX(0); - } + transform: translateX(0)} } @keyframes ecom-tool-stage-enter { from { opacity: 0; - transform: translateX(16px); - } + transform: translateX(16px)} to { opacity: 1; - transform: translateX(0); - } + transform: translateX(0)} } .ecommerce-standalone .ecom-tool-page-enter { - animation: ecom-tool-page-enter 460ms cubic-bezier(0.16, 1, 0.3, 1) both !important; - will-change: opacity, transform; -} + animation: ecom-tool-page-enter 460ms cubic-bezier(0.16, 1, 0.3, 1) both; + will-change: opacity, transform} .ecommerce-standalone .ecom-tool-page-enter .ecom-quick-page-sidebar, .ecommerce-standalone .ecom-tool-page-enter .ecom-quick-set-panel, .ecommerce-standalone .ecom-tool-page-enter .ecom-watermark-side, .ecommerce-standalone .ecom-tool-page-enter .ecom-image-workbench-side, .ecommerce-standalone .ecom-tool-page-enter .ecom-smart-cutout-nav { - animation: ecom-tool-side-enter 430ms cubic-bezier(0.16, 1, 0.3, 1) 40ms both !important; -} + animation: ecom-tool-side-enter 430ms cubic-bezier(0.16, 1, 0.3, 1) 40ms both} .ecommerce-standalone .ecom-tool-page-enter .ecom-quick-set-stage, .ecommerce-standalone .ecom-tool-page-enter .ecom-watermark-workspace, .ecommerce-standalone .ecom-tool-page-enter .ecom-image-workbench-stage, .ecommerce-standalone .ecom-tool-page-enter .ecom-smart-cutout-upload, .ecommerce-standalone .ecom-tool-page-enter .ecom-smart-editor { - animation: ecom-tool-stage-enter 500ms cubic-bezier(0.16, 1, 0.3, 1) 90ms both !important; -} + animation: ecom-tool-stage-enter 500ms cubic-bezier(0.16, 1, 0.3, 1) 90ms both} .ecommerce-standalone .ecom-tool-page-enter .ecom-quick-set-panel > section, .ecommerce-standalone .ecom-tool-page-enter .ecom-watermark-panel, .ecommerce-standalone .ecom-tool-page-enter .ecom-image-workbench-panel { - animation: ecom-tool-panel-enter 420ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + animation: ecom-tool-panel-enter 420ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .ecom-tool-page-enter .ecom-quick-set-panel > section:nth-of-type(1), .ecommerce-standalone .ecom-tool-page-enter .ecom-watermark-panel:nth-of-type(1), .ecommerce-standalone .ecom-tool-page-enter .ecom-image-workbench-panel:nth-of-type(1) { - animation-delay: 80ms !important; -} + animation-delay: 80ms} .ecommerce-standalone .ecom-tool-page-enter .ecom-quick-set-panel > section:nth-of-type(2), .ecommerce-standalone .ecom-tool-page-enter .ecom-watermark-panel:nth-of-type(2), .ecommerce-standalone .ecom-tool-page-enter .ecom-image-workbench-panel:nth-of-type(2) { - animation-delay: 130ms !important; -} + animation-delay: 130ms} .ecommerce-standalone .ecom-tool-page-enter .ecom-quick-set-panel > section:nth-of-type(3), .ecommerce-standalone .ecom-tool-page-enter .ecom-image-workbench-panel:nth-of-type(3) { - animation-delay: 180ms !important; -} + animation-delay: 180ms} @keyframes ecom-smart-upload-enter { from { opacity: 0; - transform: translateY(14px) scale(0.992); - } + transform: translateY(14px) scale(0.992)} to { opacity: 1; - transform: translateY(0) scale(1); - } + transform: translateY(0) scale(1)} } @keyframes ecom-smart-transition-spin { to { - transform: rotate(360deg); - } + transform: rotate(360deg)} } @keyframes ecom-smart-page-hold { 0% { opacity: 1; - transform: scale(1); - } + transform: scale(1)} 100% { opacity: 0.72; - transform: scale(0.985); - } + transform: scale(0.985)} } @keyframes ecom-smart-editor-enter { from { opacity: 0; - transform: translateY(18px) scale(0.985); - } + transform: translateY(18px) scale(0.985)} to { opacity: 1; - transform: translateY(0) scale(1); - } + transform: translateY(0) scale(1)} } /* Final composer layering and stateful canvas texture guards. */ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { - overflow: visible !important; - z-index: 60 !important; -} + overflow: visible; + z-index: 60} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - position: relative !important; - z-index: 30 !important; - overflow: visible !important; -} + position: relative; + z-index: 30; + overflow: visible} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover { - z-index: 120 !important; - background: #feffff !important; - box-shadow: 0 22px 54px rgba(16, 115, 204, 0.16), 0 0 0 1px rgba(30, 189, 219, 0.16) !important; - animation: ecommerce-soft-popover-in 420ms cubic-bezier(0.16, 1, 0.3, 1) both !important; -} + z-index: 120; + background: var(--ecom-bg-near-white); + box-shadow: 0 22px 54px rgba(16, 115, 204, 0.16), 0 0 0 1px rgba(30, 189, 219, 0.16); + animation: ecommerce-soft-popover-in 420ms cubic-bezier(0.16, 1, 0.3, 1) both} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover.is-closing { - pointer-events: none !important; - animation: ecommerce-soft-popover-out 220ms cubic-bezier(0.4, 0, 0.2, 1) both !important; -} + pointer-events: none; + animation: ecommerce-soft-popover-out 220ms cubic-bezier(0.4, 0, 0.2, 1) both} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board { - position: relative !important; - z-index: 0 !important; -} + position: relative; + z-index: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview { - background: #f8f9fa !important; + background: var(--ecom-bg-page); transition: padding-top 520ms cubic-bezier(0.16, 1, 0.3, 1), - background 640ms ease !important; -} + background 640ms ease} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview[data-status="generating"], .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview[data-status="done"] { @@ -8779,92 +7686,78 @@ radial-gradient(circle at 82% 28%, rgba(16, 115, 204, 0.06), transparent 22rem), linear-gradient(rgba(16, 115, 204, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(16, 115, 204, 0.035) 1px, transparent 1px), - #f8f9fa !important; - background-size: auto, auto, 28px 28px, 28px 28px, auto !important; -} + var(--ecom-bg-page); + background-size: auto, auto, 28px 28px, 28px 28px, auto} .ecommerce-standalone .ecom-smart-editor__background-layer { - background-image: none !important; - background-color: var(--smart-cutout-bg, #ffffff) !important; -} + background-image: none; + background-color: var(--smart-cutout-bg, #ffffff)} /* P0 page polish: premium AI commerce landing surface without touching logic. */ .ecommerce-standalone__topbar { - min-height: 66px !important; - border-bottom-color: rgba(30, 189, 219, 0.18) !important; - background: rgba(248, 249, 250, 0.86) !important; - box-shadow: 0 12px 36px rgba(16, 115, 204, 0.055) !important; - backdrop-filter: blur(18px) saturate(1.12) !important; - -webkit-backdrop-filter: blur(18px) saturate(1.12) !important; -} + min-height: 66px; + border-bottom-color: rgba(30, 189, 219, 0.18); + background: rgba(248, 249, 250, 0.86); + box-shadow: 0 12px 36px rgba(16, 115, 204, 0.055); + backdrop-filter: blur(18px) saturate(1.12); + -webkit-backdrop-filter: blur(18px) saturate(1.12)} .ecommerce-standalone__brand { - min-height: 40px !important; -} + min-height: 40px} .ecommerce-standalone__brand strong { - letter-spacing: 0 !important; -} + letter-spacing: 0} .ecommerce-standalone__account button { - min-height: 40px !important; - border-radius: 12px !important; - box-shadow: 0 10px 24px rgba(16, 115, 204, 0.055) !important; - transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease, transform 180ms ease !important; -} + min-height: 40px; + border-radius: 12px; + box-shadow: 0 10px 24px rgba(16, 115, 204, 0.055); + transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease, transform 180ms ease} .ecommerce-standalone__account button:hover { - box-shadow: 0 14px 32px rgba(30, 189, 219, 0.12) !important; - transform: translateY(-1px) !important; -} + box-shadow: 0 14px 32px rgba(30, 189, 219, 0.12); + transform: translateY(-1px)} .ecommerce-standalone .product-clone-page[data-tool="clone"]::before { - opacity: 0.82 !important; - filter: blur(70px) saturate(1.08) !important; -} + opacity: 0.82; + filter: blur(70px) saturate(1.08)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview { background: radial-gradient(circle at 19% 8%, rgba(30, 189, 219, 0.13), transparent 24rem), radial-gradient(circle at 82% 11%, rgba(16, 115, 204, 0.09), transparent 26rem), - linear-gradient(180deg, #fbfdfe 0%, #f8f9fa 54%, #f5f9fb 100%) !important; -} + linear-gradient(180deg, #fbfdfe 0%, var(--ecom-bg-page) 54%, #f5f9fb 100%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title { - color: #10202c !important; - text-wrap: balance !important; - text-shadow: 0 1px 0 rgba(255, 255, 255, 0.72) !important; -} + color: var(--ecom-text-primary); + text-wrap: balance; + text-shadow: 0 1px 0 rgba(255, 255, 255, 0.72)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - border-color: rgba(30, 189, 219, 0.24) !important; + border-color: rgba(30, 189, 219, 0.24); background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(251, 253, 254, 0.94)), - #feffff !important; + var(--ecom-bg-near-white); box-shadow: 0 24px 70px rgba(16, 115, 204, 0.11), 0 10px 26px rgba(30, 189, 219, 0.06), - inset 0 1px 0 rgba(255, 255, 255, 0.98) !important; - transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease !important; -} + inset 0 1px 0 rgba(255, 255, 255, 0.98); + transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:focus-within { - border-color: rgba(30, 189, 219, 0.46) !important; + border-color: rgba(30, 189, 219, 0.46); box-shadow: 0 30px 82px rgba(16, 115, 204, 0.14), 0 0 0 4px rgba(30, 189, 219, 0.09), - inset 0 1px 0 rgba(255, 255, 255, 1) !important; - transform: translateY(-1px) !important; -} + inset 0 1px 0 rgba(255, 255, 255, 1); + transform: translateY(-1px)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { - color: #10202c !important; - caret-color: #1ebddb !important; -} + color: var(--ecom-text-primary); + caret-color: var(--ecom-accent-cyan)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea::placeholder { - color: #7b929e !important; -} + color: #7b929e} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button, @@ -8875,647 +7768,562 @@ background 180ms ease, color 180ms ease, box-shadow 180ms ease, - transform 180ms ease !important; -} + transform 180ms ease} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:hover, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button.is-active { - box-shadow: 0 10px 22px rgba(30, 189, 219, 0.08) !important; -} + box-shadow: 0 10px 22px rgba(30, 189, 219, 0.08)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-send { - background: linear-gradient(135deg, #1073cc 0%, #1ebddb 100%) !important; -} + background: linear-gradient(135deg, var(--ecom-primary) 0%, var(--ecom-accent-cyan) 100%)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-send:hover:not(:disabled) { - box-shadow: 0 18px 38px rgba(30, 189, 219, 0.28) !important; -} + box-shadow: 0 18px 38px rgba(30, 189, 219, 0.28)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-send:disabled { - border-color: rgba(30, 189, 219, 0.18) !important; - background: #eef6f8 !important; -} + border-color: rgba(30, 189, 219, 0.18); + background: var(--ecom-bg-cool)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board { - gap: 0 !important; - border-color: rgba(30, 189, 219, 0.16) !important; - background: rgba(254, 255, 255, 0.96) !important; + gap: 0; + border-color: rgba(30, 189, 219, 0.16); + background: rgba(254, 255, 255, 0.96); box-shadow: 0 22px 56px rgba(16, 115, 204, 0.09), - inset 0 1px 0 rgba(255, 255, 255, 0.95) !important; -} + inset 0 1px 0 rgba(255, 255, 255, 0.95)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button { - isolation: isolate !important; -} + isolation: isolate} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button::before, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button::after { - pointer-events: none !important; -} + pointer-events: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button span { - width: 30px !important; - height: 30px !important; - border: 1px solid rgba(30, 189, 219, 0.16) !important; - border-radius: 10px !important; - background: rgba(30, 189, 219, 0.075) !important; - color: #1073cc !important; - font-size: 16px !important; - transition: border-color 180ms ease, background 180ms ease, color 180ms ease, transform 180ms ease !important; -} + width: 30px; + height: 30px; + border: 1px solid rgba(30, 189, 219, 0.16); + border-radius: 10px; + background: rgba(30, 189, 219, 0.075); + color: var(--ecom-primary); + font-size: 16px; + transition: border-color 180ms ease, background 180ms ease, color 180ms ease, transform 180ms ease} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button strong { - max-width: 100% !important; - letter-spacing: 0 !important; -} + max-width: 100%; + letter-spacing: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:hover { - color: #0f6678 !important; - background: linear-gradient(180deg, rgba(30, 189, 219, 0.12), rgba(30, 189, 219, 0.055)) !important; -} + color: #0f6678; + background: linear-gradient(180deg, rgba(30, 189, 219, 0.12), rgba(30, 189, 219, 0.055))} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:hover span { - border-color: rgba(30, 189, 219, 0.36) !important; - background: #ffffff !important; - color: #1ebddb !important; - transform: translateY(-1px) !important; -} + border-color: rgba(30, 189, 219, 0.36); + background: var(--ecom-bg-white); + color: var(--ecom-accent-cyan); + transform: translateY(-1px)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history { - border-left-color: rgba(30, 189, 219, 0.14) !important; - background: rgba(254, 255, 255, 0.9) !important; - box-shadow: -18px 0 46px rgba(16, 115, 204, 0.065) !important; - backdrop-filter: blur(18px) saturate(1.08) !important; - -webkit-backdrop-filter: blur(18px) saturate(1.08) !important; -} + border-left-color: rgba(30, 189, 219, 0.14); + background: rgba(254, 255, 255, 0.9); + box-shadow: -18px 0 46px rgba(16, 115, 204, 0.065); + backdrop-filter: blur(18px) saturate(1.08); + -webkit-backdrop-filter: blur(18px) saturate(1.08)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__heading, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__empty, .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__list button { - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82) !important; -} + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__empty { - color: #6d8592 !important; + color: #6d8592; background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(248, 249, 250, 0.92)), - #f8f9fa !important; -} + var(--ecom-bg-page)} @media (max-width: 900px) { .ecommerce-standalone .product-clone-page[data-tool="clone"] { - padding-right: 0 !important; - } + padding-right: 0} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.is-before-generate { - left: 18px !important; - right: 18px !important; - width: auto !important; - transform: none !important; - } + left: 18px; + right: 18px; + width: auto; + transform: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history { - display: none !important; - } + display: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board { - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - min-height: 224px !important; - } + grid-template-columns: repeat(3, minmax(0, 1fr)); + min-height: 224px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:not(:nth-child(6n + 1))::before { - content: none !important; - } + content: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:not(:nth-child(3n + 1))::before { - position: absolute !important; - top: 14px !important; - bottom: 14px !important; - left: 0 !important; - width: 1px !important; - content: "" !important; - background: rgba(30, 189, 219, 0.12) !important; - } + position: absolute; + top: 14px; + bottom: 14px; + left: 0; + width: 1px; + content: ""; + background: rgba(30, 189, 219, 0.12)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:nth-child(n + 4)::after { - position: absolute !important; - top: 0 !important; - left: 14px !important; - right: 14px !important; - height: 1px !important; - content: "" !important; - background: rgba(30, 189, 219, 0.12) !important; - } + position: absolute; + top: 0; + left: 14px; + right: 14px; + height: 1px; + content: ""; + background: rgba(30, 189, 219, 0.12)} } @media (max-width: 640px) { .ecommerce-standalone__topbar { - min-height: 60px !important; - } + min-height: 60px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview { - padding-inline: 18px !important; - } + padding-inline: 18px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title { - font-size: clamp(26px, 8vw, 34px) !important; - } + font-size: clamp(26px, 8vw, 34px)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board { - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - min-height: 300px !important; - } + grid-template-columns: repeat(2, minmax(0, 1fr)); + min-height: 300px} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:not(:nth-child(3n + 1))::before { - content: none !important; - } + content: none} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:not(:nth-child(2n + 1))::before { - position: absolute !important; - top: 14px !important; - bottom: 14px !important; - left: 0 !important; - width: 1px !important; - content: "" !important; - background: rgba(30, 189, 219, 0.12) !important; - } + position: absolute; + top: 14px; + bottom: 14px; + left: 0; + width: 1px; + content: ""; + background: rgba(30, 189, 219, 0.12)} .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:nth-child(n + 3)::after { - position: absolute !important; - top: 0 !important; - left: 14px !important; - right: 14px !important; - height: 1px !important; - content: "" !important; - background: rgba(30, 189, 219, 0.12) !important; - } + position: absolute; + top: 0; + left: 14px; + right: 14px; + height: 1px; + content: ""; + background: rgba(30, 189, 219, 0.12)} } @keyframes ecommerce-soft-popover-out { from { opacity: 1; filter: blur(0); - transform: translate3d(0, 0, 0) scale(1); - } + transform: translate3d(0, 0, 0) scale(1)} to { opacity: 0; filter: blur(1px); - transform: translate3d(0, 8px, 0) scale(0.982); - } + transform: translate3d(0, 8px, 0) scale(0.982)} } /* ---- Typewriter cursor blink ---- */ .typewriter-cursor { display: inline-block; - color: #1ebddb; + color: var(--ecom-accent-cyan); font-weight: 400; - animation: typewriter-blink 0.8s steps(1) infinite; -} + animation: typewriter-blink 0.8s steps(1) infinite} @keyframes typewriter-blink { - 0%, 100% { opacity: 1; } - 50% { opacity: 0; } + 0%, 100% { opacity: 1} + 50% { opacity: 0} } /* #/imageWorkbench narrow viewport alignment and history drawer access. */ @media (max-width: 1180px) { .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] { - --ecom-history-offset: 0px !important; - padding-right: 0 !important; - } + --ecom-history-offset: 0px; + padding-right: 0} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview { - width: 100% !important; - max-width: none !important; - justify-items: center !important; - } + width: 100%; + max-width: none; + justify-items: center} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - left: 50% !important; - right: auto !important; - width: min(920px, calc(100vw - 48px)) !important; - max-width: calc(100vw - 48px) !important; - transform: translateX(-50%) !important; - } + left: 50%; + right: auto; + width: min(920px, calc(100vw - 48px)); + max-width: calc(100vw - 48px); + transform: translateX(-50%)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"]:not(.is-history-collapsed) { - overflow: hidden !important; - } + overflow: hidden} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] > .product-clone-shell.product-clone-shell { transition: filter 260ms ease, opacity 260ms ease, - transform 260ms ease !important; - } + transform 260ms ease} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"]:not(.is-history-collapsed) > .product-clone-shell.product-clone-shell { - filter: blur(12px) saturate(0.94) !important; - opacity: 0.36 !important; - transform: scale(0.992) !important; - pointer-events: none !important; - user-select: none !important; - } + filter: blur(12px) saturate(0.94); + opacity: 0.36; + transform: scale(0.992); + pointer-events: none; + user-select: none} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history.ecom-command-history { - position: fixed !important; - top: 0 !important; - right: 0 !important; - bottom: 0 !important; - z-index: 120 !important; - display: grid !important; - width: min(292px, calc(100vw - 72px)) !important; - border-top-left-radius: 22px !important; - border-left-color: rgba(30, 189, 219, 0.28) !important; + position: fixed; + top: 0; + right: 0; + bottom: 0; + z-index: 120; + display: grid; + width: min(292px, calc(100vw - 72px)); + border-top-left-radius: 22px; + border-left-color: rgba(30, 189, 219, 0.28); background: linear-gradient(180deg, rgba(240, 250, 255, 0.92), rgba(226, 243, 255, 0.9)), - rgba(254, 255, 255, 0.94) !important; + rgba(254, 255, 255, 0.94); box-shadow: -28px 0 72px rgba(16, 115, 204, 0.18), - -1px 0 0 rgba(255, 255, 255, 0.8) inset !important; - backdrop-filter: blur(22px) saturate(1.12) !important; - -webkit-backdrop-filter: blur(22px) saturate(1.12) !important; - transform: translateX(0) !important; - pointer-events: auto !important; - } + -1px 0 0 rgba(255, 255, 255, 0.8) inset; + backdrop-filter: blur(22px) saturate(1.12); + -webkit-backdrop-filter: blur(22px) saturate(1.12); + transform: translateX(0); + pointer-events: auto} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-collapsed .ecom-command-history.ecom-command-history { - display: grid !important; - transform: translateX(100%) !important; - } + display: grid; + transform: translateX(100%)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-collapsed .ecom-command-history__toggle.ecom-command-history__toggle { - position: absolute !important; - top: 50% !important; - left: -52px !important; - z-index: 130 !important; - display: inline-flex !important; - visibility: visible !important; - opacity: 1 !important; - pointer-events: auto !important; - } + position: absolute; + top: 50%; + left: -52px; + z-index: 130; + display: inline-flex; + visibility: visible; + opacity: 1; + pointer-events: auto} } @media (max-width: 640px) { .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview { - padding-inline: 0 !important; - } + padding-inline: 0} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - width: calc(100vw - 32px) !important; - max-width: calc(100vw - 32px) !important; - } + width: calc(100vw - 32px); + max-width: calc(100vw - 32px)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history.ecom-command-history { - top: 0 !important; - width: min(300px, calc(100vw - 58px)) !important; - } + top: 0; + width: min(300px, calc(100vw - 58px))} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-collapsed .ecom-command-history__toggle.ecom-command-history__toggle { - left: -46px !important; - width: 40px !important; - height: 40px !important; - min-height: 40px !important; - } + left: -46px; + width: 40px; + height: 40px; + min-height: 40px} } /* #/imageWorkbench mobile composer spacing refinement. */ @media (max-width: 640px) { .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap.is-before-generate { - top: clamp(26px, 5.6vh, 42px) !important; - gap: 18px !important; - } + top: clamp(26px, 5.6vh, 42px); + gap: 18px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - max-width: min(100%, 520px) !important; - margin-inline: auto !important; + max-width: min(100%, 520px); + margin-inline: auto; background: - linear-gradient(96deg, #284a56 0%, #4f7f88 42%, #28a8bd 100%) !important; - -webkit-background-clip: text !important; - background-clip: text !important; - color: transparent !important; - font-size: clamp(26px, 6.4vw, 34px) !important; - line-height: 1.18 !important; - text-align: center !important; - text-shadow: 0 16px 38px rgba(40, 168, 189, 0.14) !important; + linear-gradient(96deg, #284a56 0%, #4f7f88 42%, #28a8bd 100%); + -webkit-background-clip: text; + background-clip: text; + color: transparent; + font-size: clamp(26px, 6.4vw, 34px); + line-height: 1.18; + text-align: center; + text-shadow: 0 16px 38px rgba(40, 168, 189, 0.14); text-wrap: balance; - white-space: normal !important; - } + white-space: normal} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - min-height: 0 !important; - grid-template-columns: minmax(0, 1fr) !important; - grid-template-rows: auto auto !important; - align-items: stretch !important; - gap: 12px !important; - padding: 16px !important; - border-radius: 24px !important; - } + min-height: 0; + grid-template-columns: minmax(0, 1fr); + grid-template-rows: auto auto; + align-items: stretch; + gap: 12px; + padding: 16px; + border-radius: 24px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea { - min-height: 74px !important; - height: 74px !important; - padding: 8px 0 2px !important; - line-height: 1.6 !important; - } + min-height: 74px; + height: 74px; + padding: 8px 0 2px; + line-height: 1.6} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { - display: flex !important; - flex-direction: column !important; - align-items: stretch !important; - justify-content: flex-start !important; - gap: 10px !important; - padding-top: 10px !important; - } + display: flex; + flex-direction: column; + align-items: stretch; + justify-content: flex-start; + gap: 10px; + padding-top: 10px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row { - display: grid !important; - grid-template-columns: repeat(6, 44px) !important; - flex-wrap: nowrap !important; - align-items: center !important; - justify-content: center !important; - gap: 8px !important; - width: 100% !important; - } + display: grid; + grid-template-columns: repeat(6, 44px); + flex-wrap: nowrap; + align-items: center; + justify-content: center; + gap: 8px; + width: 100%} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-upload-inline { - flex: 0 0 44px !important; - width: 44px !important; - min-width: 44px !important; - max-width: 44px !important; - height: 44px !important; - min-height: 44px !important; - justify-content: center !important; - gap: 0 !important; - padding: 0 !important; - overflow: hidden !important; - border-radius: 15px !important; - font-size: 0 !important; - } + flex: 0 0 44px; + width: 44px; + min-width: 44px; + max-width: 44px; + height: 44px; + min-height: 44px; + justify-content: center; + gap: 0; + padding: 0; + overflow: hidden; + border-radius: 15px; + font-size: 0} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) > span:not(.ecom-command-option-icon), .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline strong { - display: none !important; - } + display: none} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row .ecom-command-option-icon, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline > span { - display: inline-flex !important; - width: 26px !important; - height: 26px !important; - align-items: center !important; - justify-content: center !important; - margin: 0 !important; - border-radius: 10px !important; - font-size: 16px !important; - } + display: inline-flex; + width: 26px; + height: 26px; + align-items: center; + justify-content: center; + margin: 0; + border-radius: 10px; + font-size: 16px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-submit-row { - align-self: flex-end !important; - justify-content: flex-end !important; - width: auto !important; - min-width: 46px !important; - margin-top: 0 !important; - } + align-self: flex-end; + justify-content: flex-end; + width: auto; + min-width: 46px; + margin-top: 0} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-send-button.ecom-command-send { - width: 46px !important; - height: 46px !important; - min-width: 46px !important; - min-height: 46px !important; - } + width: 46px; + height: 46px; + min-width: 46px; + min-height: 46px} } @media (max-width: 420px) { .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap.is-before-generate { - top: clamp(72px, 9vh, 88px) !important; - } + top: clamp(72px, 9vh, 88px)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - font-size: clamp(24px, 7.2vw, 30px) !important; - } + font-size: clamp(24px, 7.2vw, 30px)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-upload-inline { - flex-basis: 42px !important; - width: 42px !important; - min-width: 42px !important; - max-width: 42px !important; - height: 42px !important; - min-height: 42px !important; - padding: 0 !important; - } + flex-basis: 42px; + width: 42px; + min-width: 42px; + max-width: 42px; + height: 42px; + min-height: 42px; + padding: 0} } /* #/imageWorkbench mobile header, headline, and upload clarity. */ @media (max-width: 640px) { .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__topbar { - display: grid !important; - grid-template-columns: minmax(116px, 1fr) auto !important; - align-items: center !important; - gap: 8px !important; - min-height: 62px !important; - padding: 8px 12px !important; - } + display: grid; + grid-template-columns: minmax(116px, 1fr) auto; + align-items: center; + gap: 8px; + min-height: 62px; + padding: 8px 12px} .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__brand { - min-width: 0 !important; - gap: 8px !important; - padding: 0 !important; - } + min-width: 0; + gap: 8px; + padding: 0} .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__logo { - flex: 0 0 36px !important; - width: 36px !important; - height: 36px !important; - } + flex: 0 0 36px; + width: 36px; + height: 36px} .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__brand strong { - min-width: 0 !important; - overflow: hidden !important; - color: #10202c !important; - font-size: 15px !important; - font-weight: 900 !important; - line-height: 1.08 !important; - text-overflow: ellipsis !important; - white-space: normal !important; - word-break: keep-all !important; - } + min-width: 0; + overflow: hidden; + color: var(--ecom-text-primary); + font-size: 15px; + font-weight: 900; + line-height: 1.08; + text-overflow: ellipsis; + white-space: normal; + word-break: keep-all} .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__account { - min-width: 0 !important; - gap: 6px !important; - justify-content: flex-end !important; - } + min-width: 0; + gap: 6px; + justify-content: flex-end} .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__credits { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - min-width: 0 !important; - max-width: 94px !important; - min-height: 38px !important; - padding-inline: 10px !important; - overflow: hidden !important; - font-size: 13px !important; - font-weight: 800 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; - } + display: inline-flex; + align-items: center; + justify-content: center; + min-width: 0; + max-width: 94px; + min-height: 38px; + padding-inline: 10px; + overflow: hidden; + font-size: 13px; + font-weight: 800; + text-overflow: ellipsis; + white-space: nowrap} .ecommerce-standalone.ecommerce-standalone .ecommerce-profile-menu__trigger { - min-width: 46px !important; - min-height: 40px !important; - padding: 0 7px !important; - } + min-width: 46px; + min-height: 40px; + padding: 0 7px} .ecommerce-standalone.ecommerce-standalone .ecommerce-profile-menu__trigger > span:not(.local-user-avatar) { - max-width: 58px !important; - overflow: hidden !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; - } + max-width: 58px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - max-width: min(92vw, 520px) !important; - background: linear-gradient(92deg, #10202c 0%, #123d5a 46%, #1073cc 72%, #1ebddb 100%) !important; - -webkit-background-clip: text !important; - background-clip: text !important; - color: transparent !important; - text-shadow: 0 16px 40px rgba(16, 115, 204, 0.12) !important; - } + max-width: min(92vw, 520px); + background: linear-gradient(92deg, var(--ecom-text-primary) 0%, #123d5a 46%, var(--ecom-primary) 72%, var(--ecom-accent-cyan) 100%); + -webkit-background-clip: text; + background-clip: text; + color: transparent; + text-shadow: 0 16px 40px rgba(16, 115, 204, 0.12)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference:not(.ecom-command-reference--inline) { - min-height: 54px !important; - grid-auto-flow: column !important; - grid-template-columns: auto minmax(0, auto) !important; - justify-content: center !important; - gap: 10px !important; - border-style: solid !important; + min-height: 54px; + grid-auto-flow: column; + grid-template-columns: auto minmax(0, auto); + justify-content: center; + gap: 10px; + border-style: solid; background: - linear-gradient(180deg, rgba(245, 253, 255, 0.98), rgba(231, 249, 254, 0.92)) !important; - } + linear-gradient(180deg, rgba(245, 253, 255, 0.98), rgba(231, 249, 254, 0.92))} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference:not(.ecom-command-reference--inline) span { - font-size: 18px !important; - } + font-size: 18px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference:not(.ecom-command-reference--inline) strong { - max-width: none !important; - font-size: 13px !important; - white-space: nowrap !important; - } + max-width: none; + font-size: 13px; + white-space: nowrap} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline { - order: -1 !important; - flex-basis: 100% !important; - justify-content: center !important; - gap: 8px !important; - color: #0f6678 !important; - border-color: rgba(30, 189, 219, 0.32) !important; + order: -1; + flex-basis: 100%; + justify-content: center; + gap: 8px; + color: #0f6678; + border-color: rgba(30, 189, 219, 0.32); background: - linear-gradient(180deg, rgba(241, 252, 255, 0.98), rgba(229, 248, 253, 0.92)) !important; - } + linear-gradient(180deg, rgba(241, 252, 255, 0.98), rgba(229, 248, 253, 0.92))} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline span { - font-size: 16px !important; - } + font-size: 16px} } @media (max-width: 360px) { .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__topbar { - grid-template-columns: minmax(92px, 1fr) auto !important; - gap: 6px !important; - padding-inline: 10px !important; - } + grid-template-columns: minmax(92px, 1fr) auto; + gap: 6px; + padding-inline: 10px} .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__brand strong { - font-size: 0 !important; - } + font-size: 0} .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__brand strong::before { - content: "OmniAI" !important; - font-size: 15px !important; - } + content: "OmniAI"; + font-size: 15px} .ecommerce-standalone.ecommerce-standalone .ecommerce-standalone__credits { - max-width: 88px !important; - min-height: 36px !important; - font-size: 12px !important; - } + max-width: 88px; + min-height: 36px; + font-size: 12px} .ecommerce-standalone.ecommerce-standalone .ecommerce-profile-menu__trigger { - width: 42px !important; - min-width: 42px !important; - padding: 0 !important; - } + width: 42px; + min-width: 42px; + padding: 0} .ecommerce-standalone.ecommerce-standalone .ecommerce-profile-menu__trigger > span:not(.local-user-avatar) { - display: none !important; - } + display: none} } /* #/imageWorkbench unified headline tone and asset removal affordance. */ .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - max-width: min(920px, 92vw) !important; - margin-inline: auto !important; + max-width: min(920px, 92vw); + margin-inline: auto; background: - linear-gradient(96deg, #10202c 0%, #164359 36%, #0f829b 68%, #18bfd2 100%) !important; - -webkit-background-clip: text !important; - background-clip: text !important; - color: transparent !important; - text-shadow: 0 18px 46px rgba(15, 130, 155, 0.13) !important; -} + linear-gradient(96deg, var(--ecom-text-primary) 0%, #164359 36%, var(--ecom-accent-cyan-deep) 68%, var(--ecom-accent-cyan-bright) 100%); + -webkit-background-clip: text; + background-clip: text; + color: transparent; + text-shadow: 0 18px 46px rgba(15, 130, 155, 0.13)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .typewriter-cursor { - color: #18bfd2 !important; - text-shadow: 0 0 18px rgba(24, 191, 210, 0.28) !important; -} + color: var(--ecom-accent-cyan-bright); + text-shadow: 0 0 18px rgba(24, 191, 210, 0.28)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb > button { - width: 30px !important; - height: 30px !important; - min-width: 30px !important; - min-height: 30px !important; - border: 1px solid rgba(255, 255, 255, 0.78) !important; - border-radius: 999px !important; + width: 30px; + height: 30px; + min-width: 30px; + min-height: 30px; + border: 1px solid rgba(255, 255, 255, 0.78); + border-radius: 999px; background: - linear-gradient(135deg, rgba(202, 53, 84, 0.96), rgba(145, 42, 68, 0.96)) !important; + linear-gradient(135deg, rgba(202, 53, 84, 0.96), rgba(145, 42, 68, 0.96)); box-shadow: 0 12px 28px rgba(145, 42, 68, 0.24), - inset 0 1px 0 rgba(255, 255, 255, 0.32) !important; - color: #fff !important; - opacity: 0 !important; - pointer-events: none !important; - transform: translate(6px, -6px) scale(0.92) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.32); + color: var(--ecom-bg-white); + opacity: 0; + pointer-events: none; + transform: translate(6px, -6px) scale(0.92); transition: opacity 160ms ease, transform 160ms ease, box-shadow 160ms ease, - visibility 160ms ease !important; - visibility: hidden !important; -} + visibility 160ms ease; + visibility: hidden} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb:hover > button, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb:focus-within > button { - opacity: 1 !important; - pointer-events: auto !important; - transform: translate(0, 0) scale(1) !important; - visibility: visible !important; -} + opacity: 1; + pointer-events: auto; + transform: translate(0, 0) scale(1); + visibility: visible} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb > button:hover { box-shadow: 0 14px 32px rgba(145, 42, 68, 0.32), - inset 0 1px 0 rgba(255, 255, 255, 0.38) !important; - transform: translate(0, 0) scale(1.04) !important; -} + inset 0 1px 0 rgba(255, 255, 255, 0.38); + transform: translate(0, 0) scale(1.04)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb > button .anticon { - font-size: 14px !important; -} + font-size: 14px} /* Quick tools polish: refined layout, controls, and preview surfaces. */ .ecommerce-standalone .ecom-quick-page-wrap, @@ -9524,152 +8332,135 @@ .ecommerce-standalone .ecom-image-workbench-page { --quick-border: rgba(26, 74, 108, 0.11); --quick-border-strong: rgba(16, 115, 204, 0.2); - --quick-surface: #ffffff; + --quick-surface: var(--ecom-bg-white); --quick-surface-soft: #f7f9fb; - --quick-surface-tint: #edf8ff; + --quick-surface-tint: var(--ecom-bg-tinted); --quick-text: #162535; --quick-muted: #657686; - --quick-accent: #1073cc; - --quick-cyan: #1ebddb; -} + --quick-accent: var(--ecom-primary); + --quick-cyan: var(--ecom-accent-cyan)} .ecommerce-standalone .ecom-quick-page-wrap { background: linear-gradient(90deg, rgba(255, 255, 255, 0.82), transparent 420px), linear-gradient(rgba(16, 115, 204, 0.025) 1px, transparent 1px), linear-gradient(90deg, rgba(16, 115, 204, 0.02) 1px, transparent 1px), - #f6f8fa !important; - background-size: auto, 28px 28px, 28px 28px, auto !important; -} + #f6f8fa; + background-size: auto, 28px 28px, 28px 28px, auto} .ecommerce-standalone .ecom-quick-page-sidebar { - width: 76px !important; - flex: 0 0 76px !important; - gap: 8px !important; - padding: 16px 8px !important; - border-right: 1px solid var(--quick-border) !important; + width: 76px; + flex: 0 0 76px; + gap: 8px; + padding: 16px 8px; + border-right: 1px solid var(--quick-border); background: - linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 253, 0.94)) !important; - box-shadow: 10px 0 28px rgba(16, 115, 204, 0.04) !important; -} + linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 253, 0.94)); + box-shadow: 10px 0 28px rgba(16, 115, 204, 0.04)} .ecommerce-standalone .ecom-quick-page-sidebar button { - min-height: 64px !important; - padding: 8px 4px !important; - border: 1px solid transparent !important; - border-radius: 8px !important; - color: #506475 !important; - background: transparent !important; - box-shadow: none !important; -} + min-height: 64px; + padding: 8px 4px; + border: 1px solid transparent; + border-radius: 8px; + color: #506475; + background: transparent; + box-shadow: none} .ecommerce-standalone .ecom-quick-page-sidebar button:hover { - border-color: rgba(30, 189, 219, 0.18) !important; - background: rgba(237, 248, 255, 0.82) !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.08) !important; -} + border-color: rgba(30, 189, 219, 0.18); + background: rgba(237, 248, 255, 0.82); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-page-sidebar button.is-active { - border-color: rgba(16, 115, 204, 0.22) !important; - color: var(--quick-accent) !important; - background: linear-gradient(180deg, #edf8ff, #f8fdff) !important; - box-shadow: 0 10px 24px rgba(16, 115, 204, 0.1) !important; -} + border-color: rgba(16, 115, 204, 0.22); + color: var(--quick-accent); + background: linear-gradient(180deg, var(--ecom-bg-tinted), var(--ecom-bg-near-white)); + box-shadow: 0 10px 24px rgba(16, 115, 204, 0.1)} .ecommerce-standalone .ecom-quick-page-sidebar button.is-active::before { - left: -8px !important; - top: 12px !important; - bottom: 12px !important; - width: 3px !important; - border-radius: 999px !important; - background: linear-gradient(180deg, var(--quick-cyan), var(--quick-accent)) !important; -} + left: -8px; + top: 12px; + bottom: 12px; + width: 3px; + border-radius: 999px; + background: linear-gradient(180deg, var(--quick-cyan), var(--quick-accent))} .ecommerce-standalone .ecom-quick-set-body { - grid-template-columns: minmax(386px, 420px) minmax(0, 1fr) !important; - background: transparent !important; -} + grid-template-columns: minmax(386px, 420px) minmax(0, 1fr); + background: transparent} .ecommerce-standalone .ecom-hot-video-page .ecom-quick-set-body { - grid-template-columns: minmax(366px, 404px) minmax(0, 1fr) !important; -} + grid-template-columns: minmax(366px, 404px) minmax(0, 1fr)} .ecommerce-standalone .ecom-quick-set-panel, .ecommerce-standalone .ecom-watermark-side, .ecommerce-standalone .ecom-image-workbench-side { - gap: 12px !important; - padding: 18px 16px !important; - border-color: var(--quick-border) !important; - border-radius: 0 !important; + gap: 12px; + padding: 18px 16px; + border-color: var(--quick-border); + border-radius: 0; background: linear-gradient(180deg, rgba(247, 250, 252, 0.92), transparent 150px), - var(--quick-surface) !important; - box-shadow: 12px 0 32px rgba(16, 115, 204, 0.045) !important; - scrollbar-width: thin !important; - scrollbar-color: rgba(16, 115, 204, 0.32) transparent !important; -} + var(--quick-surface); + box-shadow: 12px 0 32px rgba(16, 115, 204, 0.045); + scrollbar-width: thin; + scrollbar-color: rgba(16, 115, 204, 0.32) transparent} .ecommerce-standalone .ecom-watermark-side, .ecommerce-standalone .ecom-image-workbench-side { - border-radius: 8px !important; - box-shadow: 0 14px 34px rgba(16, 115, 204, 0.07) !important; -} + border-radius: 8px; + box-shadow: 0 14px 34px rgba(16, 115, 204, 0.07)} .ecommerce-standalone .ecom-quick-set-panel-head { - position: sticky !important; - top: -18px !important; - z-index: 12 !important; - min-height: 42px !important; - margin: -18px -16px 2px !important; - padding: 14px 16px 10px !important; - border-bottom: 1px solid rgba(16, 115, 204, 0.08) !important; - background: rgba(255, 255, 255, 0.92) !important; - backdrop-filter: blur(14px) !important; - -webkit-backdrop-filter: blur(14px) !important; -} + position: sticky; + top: -18px; + z-index: 12; + min-height: 42px; + margin: -18px -16px 2px; + padding: 14px 16px 10px; + border-bottom: 1px solid rgba(16, 115, 204, 0.08); + background: rgba(255, 255, 255, 0.92); + backdrop-filter: blur(14px); + -webkit-backdrop-filter: blur(14px)} .ecommerce-standalone .ecom-quick-set-page-title { - color: var(--quick-text) !important; - font-size: 18px !important; - font-weight: 950 !important; - line-height: 1.2 !important; -} + color: var(--quick-text); + font-size: 18px; + font-weight: 950; + line-height: 1.2} .ecommerce-standalone .ecom-quick-set-back { - min-height: 30px !important; - padding: 0 10px !important; - border: 1px solid rgba(16, 115, 204, 0.12) !important; - border-radius: 8px !important; - color: #526474 !important; - background: #f7fafc !important; - box-shadow: none !important; -} + min-height: 30px; + padding: 0 10px; + border: 1px solid rgba(16, 115, 204, 0.12); + border-radius: 8px; + color: var(--ecom-text-muted); + background: #f7fafc; + box-shadow: none} .ecommerce-standalone .ecom-quick-set-back:hover { - border-color: rgba(30, 189, 219, 0.32) !important; - color: var(--quick-accent) !important; - background: var(--quick-surface-tint) !important; -} + border-color: rgba(30, 189, 219, 0.32); + color: var(--quick-accent); + background: var(--quick-surface-tint)} .ecommerce-standalone .ecom-watermark-intro, .ecommerce-standalone .ecom-image-workbench-intro { - margin: 0 2px 2px !important; - color: var(--quick-muted) !important; - font-size: 12px !important; - font-weight: 750 !important; - line-height: 1.65 !important; -} + margin: 0 2px 2px; + color: var(--quick-muted); + font-size: 12px; + font-weight: 750; + line-height: 1.65} .ecommerce-standalone .ecom-quick-set-panel section, .ecommerce-standalone .ecom-watermark-panel, .ecommerce-standalone .ecom-image-workbench-panel { - gap: 10px !important; - padding: 13px !important; - border: 1px solid var(--quick-border) !important; - border-radius: 8px !important; - background: #ffffff !important; - box-shadow: none !important; -} + gap: 10px; + padding: 13px; + border: 1px solid var(--quick-border); + border-radius: 8px; + background: var(--ecom-bg-white); + box-shadow: none} .ecommerce-standalone .ecom-quick-set-panel section > strong, .ecommerce-standalone .ecom-watermark-panel > strong, @@ -9677,55 +8468,49 @@ .ecommerce-standalone .ecom-quick-set-panel section header strong, .ecommerce-standalone .ecom-watermark-panel header strong, .ecommerce-standalone .ecom-image-workbench-panel header strong { - color: var(--quick-text) !important; - font-size: 13px !important; - font-weight: 950 !important; -} + color: var(--quick-text); + font-size: 13px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-panel header span, .ecommerce-standalone .ecom-watermark-panel header span, .ecommerce-standalone .ecom-image-workbench-panel header span { - border-radius: 999px !important; - color: #276987 !important; - background: #eef7fa !important; -} + border-radius: 999px; + color: #276987; + background: #eef7fa} .ecommerce-standalone .ecom-quick-set-upload, .ecommerce-standalone .ecom-watermark-upload-card, .ecommerce-standalone .ecom-image-workbench-upload { - min-height: 112px !important; - border-color: rgba(30, 189, 219, 0.34) !important; - border-radius: 8px !important; + min-height: 112px; + border-color: rgba(30, 189, 219, 0.34); + border-radius: 8px; background: - linear-gradient(180deg, rgba(237, 248, 255, 0.72), rgba(255, 255, 255, 0.94)) !important; + linear-gradient(180deg, rgba(237, 248, 255, 0.72), rgba(255, 255, 255, 0.94)); transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, - transform 160ms ease !important; -} + transform 160ms ease} .ecommerce-standalone .ecom-quick-set-upload:hover, .ecommerce-standalone .ecom-watermark-upload-card:hover, .ecommerce-standalone .ecom-image-workbench-upload:hover, .ecommerce-standalone .ecom-watermark-upload-card.is-dragging, .ecommerce-standalone .ecom-image-workbench-upload.is-dragging { - border-color: var(--quick-cyan) !important; - background: #f7fcff !important; - box-shadow: 0 10px 24px rgba(16, 115, 204, 0.09) !important; - transform: translateY(-1px) !important; -} + border-color: var(--quick-cyan); + background: #f7fcff; + box-shadow: 0 10px 24px rgba(16, 115, 204, 0.09); + transform: translateY(-1px)} .ecommerce-standalone .ecom-quick-upload-thumbs { - width: 100% !important; - padding-top: 4px !important; - justify-content: center !important; -} + width: 100%; + padding-top: 4px; + justify-content: center} .ecommerce-standalone .ecom-command-asset-thumb.ecom-quick-upload-thumb { - border-radius: 8px !important; - box-shadow: 0 6px 16px rgba(16, 115, 204, 0.08) !important; -} + border-radius: 8px; + box-shadow: 0 6px 16px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-set-selects button, .ecommerce-standalone .ecom-quick-detail-types button, @@ -9738,395 +8523,334 @@ .ecommerce-standalone .ecom-image-workbench-url-row input, .ecommerce-standalone .ecom-quick-set-panel textarea, .ecommerce-standalone .ecom-image-workbench-panel textarea { - border-radius: 8px !important; -} + border-radius: 8px} .ecommerce-standalone .ecom-quick-set-selects button, .ecommerce-standalone .ecom-quick-detail-types button, .ecommerce-standalone .ecom-hot-video-options button, .ecommerce-standalone .ecom-quick-detail-modules button, .ecommerce-standalone .ecom-quick-set-counts article { - border-color: var(--quick-border) !important; - background: var(--quick-surface-soft) !important; + border-color: var(--quick-border); + background: var(--quick-surface-soft); transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, - transform 160ms ease !important; -} + transform 160ms ease} .ecommerce-standalone .ecom-quick-set-selects button:hover, .ecommerce-standalone .ecom-quick-detail-types button:hover, .ecommerce-standalone .ecom-hot-video-options button:hover, .ecommerce-standalone .ecom-quick-detail-modules button:hover, .ecommerce-standalone .ecom-quick-set-counts article:hover { - border-color: rgba(16, 115, 204, 0.24) !important; - background: #ffffff !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.07) !important; -} + border-color: rgba(16, 115, 204, 0.24); + background: var(--ecom-bg-white); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.07)} .ecommerce-standalone .ecom-quick-set-selects button.is-active, .ecommerce-standalone .ecom-quick-detail-types button.is-active, .ecommerce-standalone .ecom-hot-video-options button.is-active, .ecommerce-standalone .ecom-quick-detail-modules button.is-active { - border-color: rgba(16, 115, 204, 0.34) !important; - background: linear-gradient(180deg, #edf8ff, #f8fdff) !important; - box-shadow: inset 0 0 0 1px rgba(30, 189, 219, 0.08), 0 8px 18px rgba(16, 115, 204, 0.07) !important; -} + border-color: rgba(16, 115, 204, 0.34); + background: linear-gradient(180deg, var(--ecom-bg-tinted), var(--ecom-bg-near-white)); + box-shadow: inset 0 0 0 1px rgba(30, 189, 219, 0.08), 0 8px 18px rgba(16, 115, 204, 0.07)} .ecommerce-standalone .ecom-quick-set-counts p { - border-radius: 8px !important; - background: #ffffff !important; -} + border-radius: 8px; + background: var(--ecom-bg-white)} .ecommerce-standalone .ecom-quick-set-counts p button:disabled { - color: #b3c1ca !important; - cursor: not-allowed !important; -} + color: #b3c1ca; + cursor: not-allowed} .ecommerce-standalone .ecom-quick-set-primary, .ecommerce-standalone .ecom-watermark-primary, .ecommerce-standalone .ecom-image-workbench-primary { - min-height: 48px !important; - border-radius: 8px !important; - background: linear-gradient(135deg, #0f6fbd 0%, #19adc8 100%) !important; - box-shadow: 0 12px 28px rgba(16, 115, 204, 0.18) !important; + min-height: 48px; + border-radius: 8px; + background: linear-gradient(135deg, #0f6fbd 0%, #19adc8 100%); + box-shadow: 0 12px 28px rgba(16, 115, 204, 0.18); transition: transform 160ms ease, box-shadow 160ms ease, - filter 160ms ease !important; -} + filter 160ms ease} .ecommerce-standalone .ecom-quick-set-primary:hover:not(:disabled), .ecommerce-standalone .ecom-watermark-primary:hover:not(:disabled), .ecommerce-standalone .ecom-image-workbench-primary:hover:not(:disabled) { - box-shadow: 0 16px 34px rgba(16, 115, 204, 0.22) !important; - filter: saturate(1.04) !important; - transform: translateY(-1px) !important; -} + box-shadow: 0 16px 34px rgba(16, 115, 204, 0.22); + filter: saturate(1.04); + transform: translateY(-1px)} .ecommerce-standalone .ecom-quick-set-primary:disabled, .ecommerce-standalone .ecom-watermark-primary:disabled, .ecommerce-standalone .ecom-image-workbench-primary:disabled { - color: #8fa1af !important; - background: #edf1f4 !important; - box-shadow: none !important; - transform: none !important; -} + color: #8fa1af; + background: #edf1f4; + box-shadow: none; + transform: none} .ecommerce-standalone .ecom-quick-set-stage, .ecommerce-standalone .ecom-hot-video-page .ecom-quick-set-stage { - gap: 16px !important; - padding: 26px 32px !important; + gap: 16px; + padding: 26px 32px; background: radial-gradient(circle at 20% 18%, rgba(30, 189, 219, 0.08), transparent 20rem), radial-gradient(circle at 82% 22%, rgba(16, 115, 204, 0.055), transparent 22rem), - #f7f9fb !important; -} + #f7f9fb} .ecommerce-standalone .ecom-quick-set-preview-head, .ecommerce-standalone .ecom-hot-video-page .ecom-video-preview-head { - padding-bottom: 16px !important; - border-bottom-color: rgba(26, 74, 108, 0.1) !important; -} + padding-bottom: 16px; + border-bottom-color: rgba(26, 74, 108, 0.1)} .ecommerce-standalone .ecom-quick-set-preview-head h1, .ecommerce-standalone .ecom-hot-video-page .ecom-video-preview-copy h1 { - font-size: 24px !important; - font-weight: 950 !important; -} + font-size: 24px; + font-weight: 950} .ecommerce-standalone .ecom-quick-set-preview-head p, .ecommerce-standalone .ecom-hot-video-page .ecom-video-preview-copy p { - max-width: 720px !important; - color: var(--quick-muted) !important; - line-height: 1.65 !important; -} + max-width: 720px; + color: var(--quick-muted); + line-height: 1.65} .ecommerce-standalone .ecom-quick-set-preview-head div button, .ecommerce-standalone .ecom-hot-video-page .ecom-video-flowbar__zoom button { - border: 1px solid rgba(16, 115, 204, 0.1) !important; - border-radius: 8px !important; - background: #edf8ff !important; -} + border: 1px solid rgba(16, 115, 204, 0.1); + border-radius: 8px; + background: var(--ecom-bg-tinted)} .ecommerce-standalone .ecom-quick-set-canvas, .ecommerce-standalone .ecom-hot-video-page .ecom-video-workspace, .ecommerce-standalone .ecom-watermark-workspace, .ecommerce-standalone .ecom-image-workbench-stage { - border-color: var(--quick-border) !important; - border-radius: 8px !important; + border-color: var(--quick-border); + border-radius: 8px; background: linear-gradient(rgba(16, 115, 204, 0.026) 1px, transparent 1px), linear-gradient(90deg, rgba(16, 115, 204, 0.022) 1px, transparent 1px), - #ffffff !important; - background-size: 26px 26px, 26px 26px, auto !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 12px 30px rgba(16, 115, 204, 0.05) !important; -} + var(--ecom-bg-white); + background-size: 26px 26px, 26px 26px, auto; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 12px 30px rgba(16, 115, 204, 0.05)} .ecommerce-standalone .ecom-quick-set-empty, .ecommerce-standalone .ecom-watermark-dropzone, .ecommerce-standalone .ecom-image-workbench-empty, .ecommerce-standalone .ecom-watermark-empty, .ecommerce-standalone .ecom-watermark-processing { - border-radius: 8px !important; - border-color: rgba(16, 115, 204, 0.13) !important; - background: rgba(255, 255, 255, 0.88) !important; - box-shadow: 0 12px 28px rgba(16, 115, 204, 0.055) !important; -} + border-radius: 8px; + border-color: rgba(16, 115, 204, 0.13); + background: rgba(255, 255, 255, 0.88); + box-shadow: 0 12px 28px rgba(16, 115, 204, 0.055)} .ecommerce-standalone .ecom-quick-set-result-card, .ecommerce-standalone .ecom-quick-detail-preview-card, .ecommerce-standalone .ecom-quick-detail-result { - border-radius: 8px !important; - border-color: var(--quick-border) !important; - box-shadow: 0 18px 44px rgba(16, 115, 204, 0.08) !important; -} + border-radius: 8px; + border-color: var(--quick-border); + box-shadow: 0 18px 44px rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-quick-set-result-card figure, .ecommerce-standalone .ecom-quick-detail-preview-card figure, .ecommerce-standalone .ecom-quick-detail-result, .ecommerce-standalone .ecom-watermark-preview-card > img, .ecommerce-standalone .ecom-image-workbench-preview { - border-radius: 8px !important; -} + border-radius: 8px} .ecommerce-standalone .ecom-quick-set-prompt { - border-radius: 8px !important; - border-color: var(--quick-border) !important; - box-shadow: 0 12px 28px rgba(16, 115, 204, 0.055) !important; -} + border-radius: 8px; + border-color: var(--quick-border); + box-shadow: 0 12px 28px rgba(16, 115, 204, 0.055)} .ecommerce-standalone .ecom-quick-set-prompt textarea { - min-height: 70px !important; - font-size: 13px !important; -} + min-height: 70px; + font-size: 13px} .ecommerce-standalone .ecom-watermark-grid { - border: 0 !important; - border-radius: 8px !important; - gap: 1px !important; - background: rgba(16, 115, 204, 0.08) !important; -} + border: 0; + border-radius: 8px; + gap: 1px; + background: rgba(16, 115, 204, 0.08)} .ecommerce-standalone .ecom-watermark-preview-card { background: linear-gradient(rgba(16, 115, 204, 0.024) 1px, transparent 1px), linear-gradient(90deg, rgba(16, 115, 204, 0.02) 1px, transparent 1px), - #ffffff !important; - background-size: 24px 24px, 24px 24px, auto !important; -} + var(--ecom-bg-white); + background-size: 24px 24px, 24px 24px, auto} .ecommerce-standalone .ecom-watermark-preview-card:first-child { - border-right: 0 !important; -} + border-right: 0} .ecommerce-standalone .ecom-image-workbench-canvas { - border-radius: 8px !important; -} + border-radius: 8px} .ecommerce-standalone .ecom-image-workbench-image-frame { - border-radius: 8px !important; - box-shadow: 0 16px 38px rgba(16, 115, 204, 0.1) !important; -} + border-radius: 8px; + box-shadow: 0 16px 38px rgba(16, 115, 204, 0.1)} .ecommerce-standalone .ecom-hot-video-page .ecom-video-flow-canvas, .ecommerce-standalone .ecom-hot-video-page .ecom-video-canvas { background: linear-gradient(rgba(16, 115, 204, 0.024) 1px, transparent 1px), linear-gradient(90deg, rgba(16, 115, 204, 0.02) 1px, transparent 1px), - #ffffff !important; - background-size: 24px 24px, 24px 24px, auto !important; -} + var(--ecom-bg-white); + background-size: 24px 24px, 24px 24px, auto} .ecommerce-standalone .ecom-quick-set-help { - border-radius: 8px !important; - color: #526474 !important; - background: rgba(255, 255, 255, 0.92) !important; - backdrop-filter: blur(12px) !important; - -webkit-backdrop-filter: blur(12px) !important; -} + border-radius: 8px; + color: var(--ecom-text-muted); + background: rgba(255, 255, 255, 0.92); + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px)} @media (max-width: 1280px) { .ecommerce-standalone .ecom-quick-set-body { - grid-template-columns: minmax(330px, 370px) minmax(0, 1fr) !important; - } + grid-template-columns: minmax(330px, 370px) minmax(0, 1fr)} .ecommerce-standalone .ecom-hot-video-page .ecom-quick-set-body { - grid-template-columns: minmax(320px, 360px) minmax(0, 1fr) !important; - } + grid-template-columns: minmax(320px, 360px) minmax(0, 1fr)} } /* ── Quick Page Responsive ── */ @media (max-width: 1280px) { .ecommerce-standalone .ecom-quick-set-body { - grid-template-columns: minmax(340px, 380px) minmax(0, 1fr) !important; - } + grid-template-columns: minmax(340px, 380px) minmax(0, 1fr)} .ecommerce-standalone .ecom-quick-page-sidebar { - flex: 0 0 68px !important; - width: 68px !important; - padding: 14px 6px !important; - } + flex: 0 0 68px; + width: 68px; + padding: 14px 6px} .ecommerce-standalone .ecom-quick-page-sidebar button { - min-height: 54px !important; - gap: 3px !important; - } + min-height: 54px; + gap: 3px} .ecommerce-standalone .ecom-quick-page-sidebar button .anticon { - font-size: 18px !important; - } + font-size: 18px} .ecommerce-standalone .ecom-quick-page-sidebar button span:last-child { - font-size: 9px !important; - } + font-size: 9px} } @media (max-width: 960px) { .ecommerce-standalone .ecom-quick-set-body { - grid-template-columns: minmax(280px, 320px) minmax(0, 1fr) !important; - } + grid-template-columns: minmax(280px, 320px) minmax(0, 1fr)} .ecommerce-standalone .ecom-quick-page-sidebar { - flex: 0 0 56px !important; - width: 56px !important; - padding: 10px 4px !important; - } + flex: 0 0 56px; + width: 56px; + padding: 10px 4px} .ecommerce-standalone .ecom-quick-page-sidebar button { - min-height: 48px !important; - padding: 6px 3px !important; - } + min-height: 48px; + padding: 6px 3px} .ecommerce-standalone .ecom-quick-page-sidebar button .anticon { - font-size: 16px !important; - } + font-size: 16px} .ecommerce-standalone .ecom-quick-page-sidebar button span:last-child { - font-size: 8px !important; - } + font-size: 8px} } @media (max-width: 720px) { .ecommerce-standalone .ecom-quick-set-body { - grid-template-columns: minmax(0, 1fr) !important; - } + grid-template-columns: minmax(0, 1fr)} .ecommerce-standalone .ecom-quick-set-stage { - display: none !important; - } + display: none} .ecommerce-standalone .ecom-quick-page-sidebar { - flex: 0 0 48px !important; - width: 48px !important; - padding: 8px 3px !important; - gap: 2px !important; - } + flex: 0 0 48px; + width: 48px; + padding: 8px 3px; + gap: 2px} .ecommerce-standalone .ecom-quick-page-sidebar button { - min-height: 42px !important; - padding: 4px 2px !important; - border-radius: 8px !important; - } + min-height: 42px; + padding: 4px 2px; + border-radius: 8px} .ecommerce-standalone .ecom-quick-page-sidebar button .anticon { - font-size: 14px !important; - } + font-size: 14px} .ecommerce-standalone .ecom-quick-page-sidebar button span:last-child { - font-size: 7px !important; - } + font-size: 7px} .ecommerce-standalone .ecom-quick-page-sidebar button.is-active::before { - left: -1px !important; - width: 2px !important; - top: 8px !important; - bottom: 8px !important; - } + left: -1px; + width: 2px; + top: 8px; + bottom: 8px} } /* ── Watermark / Image Workbench Page Responsive ── */ @media (max-width: 960px) { .ecommerce-standalone .ecom-watermark-grid { - grid-template-columns: minmax(0, 1fr) !important; - gap: 14px !important; - padding: 16px !important; - } + grid-template-columns: minmax(0, 1fr); + gap: 14px; + padding: 16px} .ecommerce-standalone .ecom-image-workbench-page .ecom-image-workbench-body { - grid-template-columns: minmax(280px, 340px) minmax(0, 1fr) !important; - } + grid-template-columns: minmax(280px, 340px) minmax(0, 1fr)} } @media (max-width: 720px) { .ecommerce-standalone .ecom-watermark-page .ecom-quick-set-body { - grid-template-columns: minmax(0, 1fr) !important; - } + grid-template-columns: minmax(0, 1fr)} .ecommerce-standalone .ecom-watermark-grid { - grid-template-columns: minmax(0, 1fr) !important; - padding: 10px !important; - gap: 10px !important; - } + grid-template-columns: minmax(0, 1fr); + padding: 10px; + gap: 10px} .ecommerce-standalone .ecom-watermark-preview-card { - padding: 12px !important; - } + padding: 12px} .ecommerce-standalone .ecom-watermark-page .ecom-quick-set-stage { - display: none !important; - } + display: none} .ecommerce-standalone .ecom-image-workbench-page .ecom-image-workbench-body { - grid-template-columns: minmax(0, 1fr) !important; - } + grid-template-columns: minmax(0, 1fr)} .ecommerce-standalone .ecom-image-workbench-page .ecom-image-workbench-stage { - display: none !important; - } + display: none} } /* ── Smart Cutout Page Responsive ── */ @media (max-width: 1280px) { .ecommerce-standalone .ecom-smart-cutout-page .ecom-smart-editor { - grid-template-columns: minmax(260px, 300px) minmax(0, 1fr) !important; - } + grid-template-columns: minmax(260px, 300px) minmax(0, 1fr)} } @media (max-width: 960px) { .ecommerce-standalone .ecom-smart-cutout-page .ecom-smart-editor { - grid-template-columns: minmax(0, 1fr) !important; - } + grid-template-columns: minmax(0, 1fr)} .ecommerce-standalone .ecom-smart-cutout-page .ecom-smart-editor__side { - order: 2 !important; - max-height: 40vh !important; - } + order: 2; + max-height: 40vh} .ecommerce-standalone .ecom-smart-cutout-page .ecom-smart-editor__canvas { - order: 1 !important; - } + order: 1} .ecommerce-standalone .ecom-smart-cutout-nav { - flex-wrap: wrap !important; - gap: 6px !important; - } + flex-wrap: wrap; + gap: 6px} } @media (max-width: 720px) { .ecommerce-standalone .ecom-smart-editor__scenes { - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - } + grid-template-columns: repeat(2, minmax(0, 1fr))} } @media (hover: none) { .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb > button { - opacity: 1 !important; - pointer-events: auto !important; - transform: translate(0, 0) scale(1) !important; - visibility: visible !important; - } + opacity: 1; + pointer-events: auto; + transform: translate(0, 0) scale(1); + visibility: visible} } /* #/imageWorkbench SaaS entry refinement. */ @@ -10140,322 +8864,281 @@ background: radial-gradient(48rem 24rem at 50% 7%, rgba(30, 189, 219, 0.15), transparent 72%), radial-gradient(34rem 20rem at 14% 24%, rgba(16, 115, 204, 0.08), transparent 68%), - linear-gradient(180deg, #f8fbfc 0%, #f5f9fb 48%, #f8fafb 100%) !important; -} + linear-gradient(180deg, var(--ecom-bg-cool) 0%, #f5f9fb 48%, #f8fafb 100%)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview { - padding-top: clamp(56px, 7.6vh, 96px) !important; -} + padding-top: clamp(56px, 7.6vh, 96px)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - gap: clamp(16px, 2.1vw, 24px) !important; - padding-inline: clamp(20px, 3vw, 44px) !important; -} + gap: clamp(16px, 2.1vw, 24px); + padding-inline: clamp(20px, 3vw, 44px)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - min-height: 1.18em !important; - font-weight: 860 !important; - line-height: 1.14 !important; - text-wrap: balance; -} + min-height: 1.18em; + font-weight: 860; + line-height: 1.14; + text-wrap: balance} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - border-color: var(--ecom-entry-border-hairline) !important; - border-radius: 26px !important; + border-color: var(--ecom-entry-border-hairline); + border-radius: 26px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.985), rgba(248, 253, 255, 0.92)), - linear-gradient(135deg, rgba(30, 189, 219, 0.075), rgba(16, 115, 204, 0.035)) !important; + linear-gradient(135deg, rgba(30, 189, 219, 0.075), rgba(16, 115, 204, 0.035)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94), inset 0 -1px 0 rgba(30, 189, 219, 0.05), - var(--ecom-entry-shadow-soft) !important; -} + var(--ecom-entry-shadow-soft)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:hover, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:focus-within { - border-color: var(--ecom-entry-border-active) !important; + border-color: var(--ecom-entry-border-active); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96), 0 0 0 4px rgba(30, 189, 219, 0.08), - var(--ecom-entry-shadow-focus) !important; -} + var(--ecom-entry-shadow-focus)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea { - color: var(--ecom-entry-text) !important; - font-size: 15px !important; - line-height: 1.7 !important; -} + color: var(--ecom-entry-text); + font-size: 15px; + line-height: 1.7} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea::placeholder { - color: rgba(16, 32, 44, 0.42) !important; -} + color: rgba(16, 32, 44, 0.42)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { - border-top-color: rgba(30, 189, 219, 0.1) !important; -} + border-top-color: rgba(30, 189, 219, 0.1)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row { - gap: 9px !important; -} + gap: 9px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-upload-inline { - min-height: 40px !important; - border-color: rgba(30, 189, 219, 0.16) !important; - border-radius: 15px !important; + min-height: 40px; + border-color: rgba(30, 189, 219, 0.16); + border-radius: 15px; background: - linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(244, 252, 254, 0.82)) !important; - color: rgba(16, 32, 44, 0.72) !important; - font-weight: 760 !important; -} + linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(244, 252, 254, 0.82)); + color: rgba(16, 32, 44, 0.72); + font-weight: 760} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button > span, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline strong { - min-width: 0 !important; -} + min-width: 0} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-icon { - width: 22px !important; - height: 22px !important; - border-color: rgba(30, 189, 219, 0.12) !important; - background: rgba(232, 249, 253, 0.74) !important; - color: #0f829b !important; -} + width: 22px; + height: 22px; + border-color: rgba(30, 189, 219, 0.12); + background: rgba(232, 249, 253, 0.74); + color: var(--ecom-accent-cyan-deep)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button:hover, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-upload-inline:hover, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button.is-active { - border-color: var(--ecom-entry-border-active) !important; + border-color: var(--ecom-entry-border-active); background: - linear-gradient(180deg, rgba(246, 254, 255, 0.98), rgba(228, 249, 253, 0.92)) !important; - color: var(--ecom-entry-text) !important; -} + linear-gradient(180deg, rgba(246, 254, 255, 0.98), rgba(228, 249, 253, 0.92)); + color: var(--ecom-entry-text)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-send-button.ecom-command-send { - width: 50px !important; - height: 50px !important; - min-width: 50px !important; - border-radius: 17px !important; + width: 50px; + height: 50px; + min-width: 50px; + border-radius: 17px; box-shadow: 0 18px 38px rgba(30, 189, 219, 0.3), - inset 0 1px 0 rgba(255, 255, 255, 0.38) !important; -} + inset 0 1px 0 rgba(255, 255, 255, 0.38)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board { - overflow: hidden !important; - border-color: rgba(30, 189, 219, 0.1) !important; - border-radius: 24px !important; + overflow: hidden; + border-color: rgba(30, 189, 219, 0.1); + border-radius: 24px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(248, 253, 255, 0.66)), - rgba(255, 255, 255, 0.62) !important; + rgba(255, 255, 255, 0.62); box-shadow: 0 18px 52px rgba(16, 115, 204, 0.075), - inset 0 1px 0 rgba(255, 255, 255, 0.78) !important; -} + inset 0 1px 0 rgba(255, 255, 255, 0.78)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button { - gap: 12px !important; - border-color: rgba(30, 189, 219, 0.075) !important; - border-radius: 0 !important; + gap: 12px; + border-color: rgba(30, 189, 219, 0.075); + border-radius: 0; background: - linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(246, 252, 254, 0.58)) !important; - box-shadow: none !important; -} + linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(246, 252, 254, 0.58)); + box-shadow: none} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button:hover { - border-color: rgba(30, 189, 219, 0.28) !important; + border-color: rgba(30, 189, 219, 0.28); background: - linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(235, 251, 254, 0.92)) !important; + linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(235, 251, 254, 0.92)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84), - 0 16px 34px rgba(16, 115, 204, 0.1) !important; - transform: translateY(-1px) !important; -} + 0 16px 34px rgba(16, 115, 204, 0.1); + transform: translateY(-1px)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button > span { - display: inline-flex !important; - width: 32px !important; - height: 32px !important; - align-items: center !important; - justify-content: center !important; - border: 1px solid rgba(30, 189, 219, 0.15) !important; - border-radius: 12px !important; - background: linear-gradient(180deg, rgba(231, 249, 253, 0.96), rgba(217, 244, 250, 0.86)) !important; - color: #0f829b !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74) !important; -} + display: inline-flex; + width: 32px; + height: 32px; + align-items: center; + justify-content: center; + border: 1px solid rgba(30, 189, 219, 0.15); + border-radius: 12px; + background: linear-gradient(180deg, rgba(231, 249, 253, 0.96), rgba(217, 244, 250, 0.86)); + color: var(--ecom-accent-cyan-deep); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74)} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board strong { - font-weight: 820 !important; -} + font-weight: 820} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__toggle.ecom-command-history__toggle { - border-color: rgba(30, 189, 219, 0.13) !important; - background: rgba(255, 255, 255, 0.76) !important; - color: rgba(16, 32, 44, 0.62) !important; - box-shadow: 0 14px 32px rgba(16, 115, 204, 0.1) !important; -} + border-color: rgba(30, 189, 219, 0.13); + background: rgba(255, 255, 255, 0.76); + color: rgba(16, 32, 44, 0.62); + box-shadow: 0 14px 32px rgba(16, 115, 204, 0.1)} @media (min-width: 1181px) { .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__toggle.ecom-command-history__toggle { - opacity: 0.82 !important; - transform: translateX(2px) !important; - } + opacity: 0.82; + transform: translateX(2px)} } @media (max-width: 760px) { .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview { - padding-top: 18px !important; - } + padding-top: 18px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - gap: 16px !important; - padding-inline: 16px !important; - } + gap: 16px; + padding-inline: 16px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - max-width: min(100%, 520px) !important; - min-height: 2.36em !important; - overflow: visible !important; + max-width: min(100%, 520px); + min-height: 2.36em; + overflow: visible; background: - linear-gradient(96deg, #284a56 0%, #4f7f88 42%, #28a8bd 100%) !important; - -webkit-background-clip: text !important; - background-clip: text !important; - color: transparent !important; - font-size: clamp(26px, 6.4vw, 34px) !important; - line-height: 1.18 !important; - text-shadow: 0 16px 38px rgba(40, 168, 189, 0.14) !important; + linear-gradient(96deg, #284a56 0%, #4f7f88 42%, #28a8bd 100%); + -webkit-background-clip: text; + background-clip: text; + color: transparent; + font-size: clamp(26px, 6.4vw, 34px); + line-height: 1.18; + text-shadow: 0 16px 38px rgba(40, 168, 189, 0.14); text-wrap: balance; - white-space: normal !important; - } + white-space: normal} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - width: min(100%, 352px) !important; - margin-inline: auto !important; - padding: 15px !important; - border-radius: 24px !important; - } + width: min(100%, 352px); + margin-inline: auto; + padding: 15px; + border-radius: 24px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea { - min-height: 86px !important; - font-size: 14px !important; - line-height: 1.62 !important; - } + min-height: 86px; + font-size: 14px; + line-height: 1.62} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { - gap: 12px !important; - padding-top: 12px !important; - } + gap: 12px; + padding-top: 12px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row { - display: grid !important; - grid-template-columns: repeat(6, 44px) !important; - justify-content: center !important; - gap: 8px !important; - } + display: grid; + grid-template-columns: repeat(6, 44px); + justify-content: center; + gap: 8px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-upload-inline { - width: 44px !important; - min-width: 44px !important; - max-width: 44px !important; - height: 44px !important; - min-height: 44px !important; - justify-content: center !important; - gap: 0 !important; - padding: 0 !important; - overflow: hidden !important; - font-size: 0 !important; - } + width: 44px; + min-width: 44px; + max-width: 44px; + height: 44px; + min-height: 44px; + justify-content: center; + gap: 0; + padding: 0; + overflow: hidden; + font-size: 0} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) > span:not(.ecom-command-option-icon), .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline strong { - display: none !important; - } + display: none} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row .ecom-command-option-icon, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline > span { - display: inline-flex !important; - width: 26px !important; - height: 26px !important; - align-items: center !important; - justify-content: center !important; - margin: 0 !important; - font-size: 16px !important; - } + display: inline-flex; + width: 26px; + height: 26px; + align-items: center; + justify-content: center; + margin: 0; + font-size: 16px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-send-button.ecom-command-send { - width: 48px !important; - height: 48px !important; - min-width: 48px !important; - } + width: 48px; + height: 48px; + min-width: 48px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board { - width: min(100%, 352px) !important; - margin-inline: auto !important; - border-radius: 22px !important; - } + width: min(100%, 352px); + margin-inline: auto; + border-radius: 22px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button { - min-height: 70px !important; - padding: 12px 10px !important; - gap: 9px !important; - } + min-height: 70px; + padding: 12px 10px; + gap: 9px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button > span { - width: 30px !important; - height: 30px !important; - border-radius: 11px !important; - } + width: 30px; + height: 30px; + border-radius: 11px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board strong { - font-size: 13px !important; - } + font-size: 13px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover { - position: absolute !important; - top: calc(100% + 12px) !important; - right: auto !important; - bottom: auto !important; - left: 0 !important; - z-index: 140 !important; - box-sizing: border-box !important; - width: 100% !important; - min-width: 0 !important; - max-width: 100% !important; - max-height: min(280px, calc(100dvh - 148px)) !important; - overflow: auto !important; - border-radius: 22px !important; - animation: none !important; + position: absolute; + top: calc(100% + 12px); + right: auto; + bottom: auto; + left: 0; + z-index: 140; + box-sizing: border-box; + width: 100%; + min-width: 0; + max-width: 100%; + max-height: min(280px, calc(100dvh - 148px)); + overflow: auto; + border-radius: 22px; + animation: none; box-shadow: 0 28px 76px rgba(16, 115, 204, 0.2), - inset 0 1px 0 rgba(255, 255, 255, 0.88) !important; - transform: none !important; - translate: none !important; - } + inset 0 1px 0 rgba(255, 255, 255, 0.88); + transform: none; + translate: none} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--grid, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--list, .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages { - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 10px !important; - } + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 10px} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover button { - width: 100% !important; - min-width: 0 !important; - max-width: none !important; - overflow: hidden !important; - text-overflow: ellipsis !important; - } + width: 100%; + min-width: 0; + max-width: none; + overflow: hidden; + text-overflow: ellipsis} .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-collapsed .ecom-command-history__toggle.ecom-command-history__toggle { - left: -42px !important; - width: 38px !important; - height: 44px !important; - min-width: 38px !important; - min-height: 44px !important; - opacity: 0.9 !important; - } + left: -42px; + width: 38px; + height: 44px; + min-width: 38px; + min-height: 44px; + opacity: 0.9} } diff --git a/src/styles/standalone/overrides.css b/src/styles/standalone/overrides.css index 1e7d62b..8b17ac3 100644 --- a/src/styles/standalone/overrides.css +++ b/src/styles/standalone/overrides.css @@ -1,3622 +1,3622 @@ - + @media (max-width: 640px) { - html body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover { - position: absolute !important; - inset: calc(100% + 12px) auto auto 0 !important; - box-sizing: border-box !important; - width: 100% !important; - min-width: 0 !important; - max-width: 100% !important; - max-height: min(280px, calc(100dvh - 150px)) !important; - overflow: auto !important; - animation: none !important; - transform: none !important; - translate: none !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover { + position: absolute; + inset: calc(100% + 12px) auto auto 0; + box-sizing: border-box; + width: 100%; + min-width: 0; + max-width: 100%; + max-height: min(280px, calc(100dvh - 150px)); + overflow: auto; + animation: none; + transform: none; + translate: none } - html body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--grid, - html body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--list, - html body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages { - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 10px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--grid, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--list, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--languages { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 10px } } @media (max-width: 640px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - max-width: min(100%, 520px) !important; - min-height: 2.28em !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title { + max-width: min(100%, 520px); + min-height: 2.28em; background: - linear-gradient(96deg, #10202c 0%, #164359 36%, #0f829b 68%, #18bfd2 100%) !important; - -webkit-background-clip: text !important; - background-clip: text !important; - color: transparent !important; - font-size: clamp(29px, 7.8vw, 34px) !important; - line-height: 1.14 !important; - text-shadow: 0 18px 46px rgba(15, 130, 155, 0.13) !important; + linear-gradient(96deg, var(--ecom-text-primary) 0%, #164359 36%, var(--ecom-accent-cyan-deep) 68%, var(--ecom-accent-cyan-bright) 100%); + -webkit-background-clip: text; + background-clip: text; + color: transparent; + font-size: clamp(29px, 7.8vw, 34px); + line-height: 1.14; + text-shadow: 0 18px 46px rgba(15, 130, 155, 0.13); text-wrap: balance; - white-space: normal !important; + white-space: normal } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-upload-inline { - width: 44px !important; - min-width: 44px !important; - max-width: 44px !important; - height: 44px !important; - min-height: 44px !important; - padding: 0 !important; - overflow: hidden !important; - font-size: 0 !important; - line-height: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-upload-inline { + width: 44px; + min-width: 44px; + max-width: 44px; + height: 44px; + min-height: 44px; + padding: 0; + overflow: hidden; + font-size: 0; + line-height: 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row { - max-width: 100% !important; - overflow: hidden !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row { + max-width: 100%; + overflow: hidden } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) > span:not(.ecom-command-option-icon), - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline strong { - display: none !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) > span:not(.ecom-command-option-icon), + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline strong { + display: none } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row .ecom-command-option-icon, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline > span { - display: inline-flex !important; - width: 26px !important; - height: 26px !important; - align-items: center !important; - justify-content: center !important; - margin: 0 !important; - font-size: 16px !important; - line-height: 1 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row .ecom-command-option-icon, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline > span { + display: inline-flex; + width: 26px; + height: 26px; + align-items: center; + justify-content: center; + margin: 0; + font-size: 16px; + line-height: 1 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover { - position: absolute !important; - inset: calc(100% + 12px) auto auto 0 !important; - box-sizing: border-box !important; - width: 100% !important; - min-width: 0 !important; - max-width: 100% !important; - max-height: min(280px, calc(100dvh - 150px)) !important; - overflow: auto !important; - animation: none !important; - transform: none !important; - translate: none !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover { + position: absolute; + inset: calc(100% + 12px) auto auto 0; + box-sizing: border-box; + width: 100%; + min-width: 0; + max-width: 100%; + max-height: min(280px, calc(100dvh - 150px)); + overflow: auto; + animation: none; + transform: none; + translate: none } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--settings { - display: grid !important; - grid-template-columns: minmax(0, 1fr) !important; - align-content: start !important; - gap: 10px !important; - max-height: min(360px, 42dvh) !important; - overflow-x: hidden !important; - overflow-y: auto !important; - padding: 14px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings { + display: grid; + grid-template-columns: minmax(0, 1fr); + align-content: start; + gap: 10px; + max-height: min(360px, 42dvh); + overflow-x: hidden; + overflow-y: auto; + padding: 14px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings header { - display: flex !important; - grid-column: 1 / -1 !important; - align-items: center !important; - justify-content: space-between !important; - gap: 12px !important; - min-width: 0 !important; - margin: 0 0 2px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings header { + display: flex; + grid-column: 1 / -1; + align-items: center; + justify-content: space-between; + gap: 12px; + min-width: 0; + margin: 0 0 2px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings > .ecom-command-count-row { - grid-column: 1 / -1 !important; - display: grid !important; - grid-template-columns: minmax(0, 1fr) auto !important; - width: 100% !important; - min-width: 0 !important; - min-height: 78px !important; - align-items: center !important; - gap: 10px !important; - padding: 12px !important; - overflow: hidden !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings > .ecom-command-count-row { + grid-column: 1 / -1; + display: grid; + grid-template-columns: minmax(0, 1fr) auto; + width: 100%; + min-width: 0; + min-height: 78px; + align-items: center; + gap: 10px; + padding: 12px; + overflow: hidden } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-count-row > span { - min-width: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > span { + min-width: 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-count-row > span strong, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-count-row > span em { - display: block !important; - max-width: 100% !important; - overflow: hidden !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > span strong, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > span em { + display: block; + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-count-row > div { - display: grid !important; - grid-template-columns: 34px 24px 34px !important; - align-items: center !important; - justify-content: end !important; - gap: 6px !important; - min-width: 98px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > div { + display: grid; + grid-template-columns: 34px 24px 34px; + align-items: center; + justify-content: end; + gap: 6px; + min-width: 98px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-count-row > div button { - width: 34px !important; - min-width: 34px !important; - height: 34px !important; - min-height: 34px !important; - padding: 0 !important; - border-radius: 999px !important; - font-size: 16px !important; - line-height: 1 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > div button { + width: 34px; + min-width: 34px; + height: 34px; + min-height: 34px; + padding: 0; + border-radius: 999px; + font-size: 16px; + line-height: 1 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-count-row > div b { - min-width: 24px !important; - text-align: center !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-count-row > div b { + min-width: 24px; + text-align: center } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid--detail, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid--model, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid--video, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-levels { - grid-column: 1 / -1 !important; - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - width: 100% !important; - min-width: 0 !important; - max-height: none !important; - overflow: visible !important; - gap: 8px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid--detail, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid--model, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid--video, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-levels { + grid-column: 1 / -1; + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + width: 100%; + min-width: 0; + max-height: none; + overflow: visible; + gap: 8px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid button, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-levels button { - width: 100% !important; - min-width: 0 !important; - max-width: none !important; - min-height: 44px !important; - overflow: hidden !important; - white-space: normal !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-module-grid button, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-levels button { + width: 100%; + min-width: 0; + max-width: none; + min-height: 44px; + overflow: hidden; + white-space: normal } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-layout { - grid-column: 1 / -1 !important; - display: grid !important; - grid-template-columns: minmax(0, 1fr) !important; - width: 100% !important; - min-width: 0 !important; - gap: 10px !important; - overflow: visible !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-layout { + grid-column: 1 / -1; + display: grid; + grid-template-columns: minmax(0, 1fr); + width: 100%; + min-width: 0; + gap: 10px; + overflow: visible } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-upload { - width: 100% !important; - min-width: 0 !important; - min-height: 132px !important; - max-width: none !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings .ecom-command-hot-upload { + width: 100%; + min-width: 0; + min-height: 132px; + max-width: none } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-model-profile { - grid-column: 1 / -1 !important; - width: 100% !important; - min-width: 0 !important; - overflow: hidden !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile { + grid-column: 1 / -1; + width: 100%; + min-width: 0; + overflow: hidden } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-model-profile section > div { - display: flex !important; - flex-wrap: wrap !important; - gap: 6px !important; - min-width: 0 !important; - overflow: visible !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile section > div { + display: flex; + flex-wrap: wrap; + gap: 6px; + min-width: 0; + overflow: visible } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-model-profile button { - flex: 1 1 calc(50% - 6px) !important; - min-width: 0 !important; - max-width: none !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile button { + flex: 1 1 calc(50% - 6px); + min-width: 0; + max-width: none } } @media (max-width: 420px) { - .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - font-size: clamp(24px, 7.2vw, 30px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title { + font-size: clamp(24px, 7.2vw, 30px) } - .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - padding: 14px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + padding: 14px } - .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button, - .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-upload-inline { - width: 42px !important; - min-width: 42px !important; - max-width: 42px !important; - height: 42px !important; - min-height: 42px !important; - font-size: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-upload-inline { + width: 42px; + min-width: 42px; + max-width: 42px; + height: 42px; + min-height: 42px; + font-size: 0 } } @media (max-width: 420px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - font-size: clamp(25px, 8vw, 30px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title { + font-size: clamp(25px, 8vw, 30px) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row { - grid-template-columns: repeat(6, minmax(0, clamp(38px, 10.6vw, 42px))) !important; - gap: 7px !important; - justify-content: center !important; - overflow: hidden !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row { + grid-template-columns: repeat(6, minmax(0, clamp(38px, 10.6vw, 42px))); + gap: 7px; + justify-content: center; + overflow: hidden } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-upload-inline { - width: clamp(38px, 10.6vw, 42px) !important; - min-width: 0 !important; - max-width: 42px !important; - height: clamp(38px, 10.6vw, 42px) !important; - min-height: clamp(38px, 10.6vw, 42px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-upload-inline { + width: clamp(38px, 10.6vw, 42px); + min-width: 0; + max-width: 42px; + height: clamp(38px, 10.6vw, 42px); + min-height: clamp(38px, 10.6vw, 42px) } } @media (max-width: 640px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover.ecom-command-popover--settings, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover.ecom-command-popover--settings-set, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover.ecom-command-popover--settings-model, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover.ecom-command-popover--settings-hot { - inset: calc(100% + 12px) auto auto 0 !important; - left: 0 !important; - right: auto !important; - width: 100% !important; - min-width: 0 !important; - max-width: 100% !important; - margin: 0 !important; - overflow-x: hidden !important; - overflow-y: auto !important; - transform: none !important; - translate: none !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-set, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-model, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-hot { + inset: calc(100% + 12px) auto auto 0; + left: 0; + right: auto; + width: 100%; + min-width: 0; + max-width: 100%; + margin: 0; + overflow-x: hidden; + overflow-y: auto; + transform: none; + translate: none } } /* #/imageWorkbench mid-size refinement: keep the composer and floating panels balanced on tablet/small desktop widths. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline { - position: relative !important; - flex: 0 0 48px !important; - width: 48px !important; - min-width: 48px !important; - max-width: 48px !important; - height: 48px !important; - min-height: 48px !important; - justify-content: center !important; - gap: 0 !important; - padding: 0 !important; - border-radius: 17px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline { + position: relative; + flex: 0 0 48px; + width: 48px; + min-width: 48px; + max-width: 48px; + height: 48px; + min-height: 48px; + justify-content: center; + gap: 0; + padding: 0; + border-radius: 17px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline > span { - width: 0 !important; - min-width: 0 !important; - height: 0 !important; - margin: 0 !important; - overflow: hidden !important; - border: 0 !important; - background: transparent !important; - color: transparent !important; - font-size: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline > span { + width: 0; + min-width: 0; + height: 0; + margin: 0; + overflow: hidden; + border: 0; + background: transparent; + color: transparent; + font-size: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline .anticon { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline .anticon { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline strong { - position: absolute !important; - width: 1px !important; - height: 1px !important; - padding: 0 !important; - overflow: hidden !important; - clip: rect(0 0 0 0) !important; - clip-path: inset(50%) !important; - white-space: nowrap !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline strong { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + overflow: hidden; + clip: rect(0 0 0 0); + clip-path: inset(50%); + white-space: nowrap } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline::before { - content: "+" !important; - display: inline-grid !important; - width: 24px !important; - height: 24px !important; - place-items: center !important; - border-radius: 10px !important; - background: linear-gradient(180deg, rgba(235, 252, 255, 0.96), rgba(218, 245, 250, 0.9)) !important; - color: #0f829b !important; - font-size: 22px !important; - font-weight: 760 !important; - line-height: 1 !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline::before { + content: "+"; + display: inline-grid; + width: 24px; + height: 24px; + place-items: center; + border-radius: 10px; + background: linear-gradient(180deg, rgba(235, 252, 255, 0.96), rgba(218, 245, 250, 0.9)); + color: var(--ecom-accent-cyan-deep); + font-size: 22px; + font-weight: 760; + line-height: 1; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78) } @media (min-width: 641px) and (max-width: 1280px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - width: min(1080px, calc(100vw - 96px)) !important; - gap: clamp(14px, 2.2vh, 20px) !important; - padding-inline: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { + width: min(1080px, calc(100vw - 96px)); + gap: clamp(14px, 2.2vh, 20px); + padding-inline: 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - width: 100% !important; - min-height: clamp(258px, 40vh, 304px) !important; - padding: clamp(18px, 2.8vw, 24px) !important; - border-radius: 26px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + width: 100%; + min-height: clamp(258px, 40vh, 304px); + padding: clamp(18px, 2.8vw, 24px); + border-radius: 26px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea { - min-height: clamp(76px, 14vh, 104px) !important; - max-height: clamp(104px, 18vh, 136px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { + min-height: clamp(76px, 14vh, 104px); + max-height: clamp(104px, 18vh, 136px) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { - align-items: end !important; - gap: 12px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { + align-items: end; + gap: 12px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row { - display: flex !important; - flex-wrap: wrap !important; - gap: 10px !important; - max-width: min(100%, 660px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row { + display: flex; + flex-wrap: wrap; + gap: 10px; + max-width: min(100%, 660px) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) { - min-height: 44px !important; - padding-inline: 12px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) { + min-height: 44px; + padding-inline: 12px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover { - inset: calc(100% + 14px) auto auto 0 !important; - left: 0 !important; - right: auto !important; - box-sizing: border-box !important; - width: 100% !important; - min-width: 0 !important; - max-width: 100% !important; - max-height: min(386px, max(220px, calc(100dvh - 470px))) !important; - margin: 0 !important; - overflow-x: hidden !important; - overflow-y: auto !important; - border-radius: 24px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover { + inset: calc(100% + 14px) auto auto 0; + left: 0; + right: auto; + box-sizing: border-box; + width: 100%; + min-width: 0; + max-width: 100%; + max-height: min(386px, max(220px, calc(100dvh - 470px))); + margin: 0; + overflow-x: hidden; + overflow-y: auto; + border-radius: 24px; background: - linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 252, 254, 0.94)) !important; + linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 252, 254, 0.94)); box-shadow: 0 30px 76px rgba(16, 115, 204, 0.17), - inset 0 1px 0 rgba(255, 255, 255, 0.88) !important; - transform: none !important; - translate: none !important; + inset 0 1px 0 rgba(255, 255, 255, 0.88); + transform: none; + translate: none } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages { - display: grid !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - gap: 10px !important; - padding: 18px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--languages { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 10px; + padding: 18px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button { - display: grid !important; - min-height: 68px !important; - align-content: center !important; - gap: 5px !important; - padding: 11px 12px !important; - border-radius: 16px !important; - text-align: center !important; - white-space: normal !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--languages button { + display: grid; + min-height: 68px; + align-content: center; + gap: 5px; + padding: 11px 12px; + border-radius: 16px; + text-align: center; + white-space: normal } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button strong, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages button span { - min-width: 0 !important; - overflow: hidden !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--languages button strong, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--languages button span { + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--settings { - display: grid !important; - gap: 14px !important; - padding: 18px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings { + display: grid; + gap: 14px; + padding: 18px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-layout { - display: grid !important; - grid-template-columns: minmax(260px, 1.08fr) minmax(220px, 0.72fr) !important; - gap: 14px !important; - align-items: stretch !important; - width: 100% !important; - min-width: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-layout { + display: grid; + grid-template-columns: minmax(260px, 1.08fr) minmax(220px, 0.72fr); + gap: 14px; + align-items: stretch; + width: 100%; + min-width: 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-upload { - min-height: 188px !important; - border-radius: 18px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-upload { + min-height: 188px; + border-radius: 18px; background: - linear-gradient(180deg, rgba(250, 254, 255, 0.96), rgba(238, 250, 253, 0.84)) !important; + linear-gradient(180deg, rgba(250, 254, 255, 0.96), rgba(238, 250, 253, 0.84)) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-levels { - display: grid !important; - grid-template-columns: minmax(0, 1fr) !important; - grid-template-rows: repeat(2, minmax(0, 1fr)) !important; - gap: 12px !important; - width: 100% !important; - min-width: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-levels { + display: grid; + grid-template-columns: minmax(0, 1fr); + grid-template-rows: repeat(2, minmax(0, 1fr)); + gap: 12px; + width: 100%; + min-width: 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-levels button { - min-height: 88px !important; - align-content: center !important; - padding: 16px !important; - border-radius: 18px !important; - text-align: left !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-levels button { + min-height: 88px; + align-content: center; + padding: 16px; + border-radius: 18px; + text-align: left } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model { - grid-template-columns: minmax(230px, 0.82fr) minmax(0, 1.18fr) !important; - align-items: start !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model { + grid-template-columns: minmax(230px, 0.82fr) minmax(0, 1.18fr); + align-items: start } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model header { - grid-column: 1 / -1 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model header { + grid-column: 1 / -1 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile { - grid-column: 1 !important; - grid-row: 2 !important; - width: 100% !important; - min-width: 0 !important; - max-height: 286px !important; - overflow-y: auto !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile { + grid-column: 1; + grid-row: 2; + width: 100%; + min-width: 0; + max-height: 286px; + overflow-y: auto } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { - grid-column: 2 !important; - grid-row: 2 !important; - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - width: 100% !important; - min-width: 0 !important; - max-height: 286px !important; - overflow-y: auto !important; - gap: 10px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { + grid-column: 2; + grid-row: 2; + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + width: 100%; + min-width: 0; + max-height: 286px; + overflow-y: auto; + gap: 10px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-model-profile section > div { - display: flex !important; - flex-wrap: wrap !important; - gap: 8px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile section > div { + display: flex; + flex-wrap: wrap; + gap: 8px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-model-profile button { - flex: 1 1 auto !important; - min-width: max-content !important; - max-width: 100% !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-model-profile button { + flex: 1 1 auto; + min-width: max-content; + max-width: 100% } } @media (min-width: 641px) and (max-width: 760px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--languages { - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--languages { + grid-template-columns: repeat(2, minmax(0, 1fr)) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-layout, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model { - grid-template-columns: minmax(0, 1fr) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-hot .ecom-command-hot-layout, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model { + grid-template-columns: minmax(0, 1fr) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { - grid-column: 1 !important; - grid-row: auto !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { + grid-column: 1; + grid-row: auto } } /* #/imageWorkbench targeted polish: compact setting panels and align the history trigger with the panel top. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-char-count { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-char-count { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings { - box-sizing: border-box !important; - width: min(432px, calc(100vw - 48px)) !important; - min-width: 0 !important; - max-width: min(432px, calc(100vw - 48px)) !important; - max-height: min(420px, calc(100dvh - 220px)) !important; - gap: 10px !important; - padding: 14px !important; - border-radius: 20px !important; - overflow-x: hidden !important; - overflow-y: auto !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings { + box-sizing: border-box; + width: min(432px, calc(100vw - 48px)); + min-width: 0; + max-width: min(432px, calc(100vw - 48px)); + max-height: min(420px, calc(100dvh - 220px)); + gap: 10px; + padding: 14px; + border-radius: 20px; + overflow-x: hidden; + overflow-y: auto } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-set { - width: min(396px, calc(100vw - 48px)) !important; - max-width: min(396px, calc(100vw - 48px)) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings-set { + width: min(396px, calc(100vw - 48px)); + max-width: min(396px, calc(100vw - 48px)) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-set > .ecom-command-count-row { - min-height: 60px !important; - gap: 8px !important; - padding: 10px 11px !important; - border-radius: 15px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-set > .ecom-command-count-row { + min-height: 60px; + gap: 8px; + padding: 10px 11px; + border-radius: 15px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-set .ecom-command-count-row > span strong { - font-size: 13px !important; - line-height: 1.35 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-set .ecom-command-count-row > span strong { + font-size: 13px; + line-height: 1.35 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-set .ecom-command-count-row > span em { - font-size: 11px !important; - line-height: 1.35 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-set .ecom-command-count-row > span em { + font-size: 11px; + line-height: 1.35 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-set .ecom-command-count-row > div { - grid-template-columns: 28px 22px 28px !important; - gap: 5px !important; - min-width: 86px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-set .ecom-command-count-row > div { + grid-template-columns: 28px 22px 28px; + gap: 5px; + min-width: 86px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-set .ecom-command-count-row > div button { - width: 28px !important; - min-width: 28px !important; - height: 28px !important; - min-height: 28px !important; - font-size: 14px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-set .ecom-command-count-row > div button { + width: 28px; + min-width: 28px; + height: 28px; + min-height: 28px; + font-size: 14px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-model { - width: min(508px, calc(100vw - 48px)) !important; - max-width: min(508px, calc(100vw - 48px)) !important; - grid-template-columns: minmax(172px, 0.78fr) minmax(0, 1fr) !important; - align-items: start !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings-model { + width: min(508px, calc(100vw - 48px)); + max-width: min(508px, calc(100vw - 48px)); + grid-template-columns: minmax(172px, 0.78fr) minmax(0, 1fr); + align-items: start } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model header { - grid-column: 1 / -1 !important; - margin-bottom: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model header { + grid-column: 1 / -1; + margin-bottom: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile { - grid-column: 1 !important; - grid-row: 2 !important; - max-height: 270px !important; - padding-right: 2px !important; - overflow-y: auto !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile { + grid-column: 1; + grid-row: 2; + max-height: 270px; + padding-right: 2px; + overflow-y: auto } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section { - gap: 7px !important; - padding: 9px 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section { + gap: 7px; + padding: 9px 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > span { - font-size: 12px !important; - line-height: 30px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > span { + font-size: 12px; + line-height: 30px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > div { - gap: 6px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > div { + gap: 6px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile button { - min-height: 30px !important; - padding: 0 10px !important; - border-radius: 999px !important; - font-size: 12px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile button { + min-height: 30px; + padding: 0 10px; + border-radius: 999px; + font-size: 12px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { - grid-column: 2 !important; - grid-row: 2 !important; - display: grid !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - gap: 8px !important; - width: 100% !important; - max-height: 270px !important; - overflow-y: auto !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { + grid-column: 2; + grid-row: 2; + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 8px; + width: 100%; + max-height: 270px; + overflow-y: auto } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model button { - min-height: 38px !important; - padding: 0 10px !important; - border-radius: 13px !important; - text-align: center !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model button { + min-height: 38px; + padding: 0 10px; + border-radius: 13px; + text-align: center } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__toggle { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - font-size: 16px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__toggle { + display: inline-flex; + align-items: center; + justify-content: center; + font-size: 16px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__toggle .anticon { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - font-size: 18px !important; - line-height: 1 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__toggle .anticon { + display: inline-flex; + align-items: center; + justify-content: center; + font-size: 18px; + line-height: 1 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-collapsed .ecom-command-history__toggle.ecom-command-history__toggle { - top: 16px !important; - transform: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__toggle { + top: 16px; + transform: none } @media (max-width: 640px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-set, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-model { - width: 100% !important; - max-width: 100% !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings-set, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings-model { + width: 100%; + max-width: 100% } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model { - grid-template-columns: minmax(0, 1fr) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model { + grid-template-columns: minmax(0, 1fr) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { - grid-column: 1 !important; - grid-row: auto !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { + grid-column: 1; + grid-row: auto } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-collapsed .ecom-command-history__toggle.ecom-command-history__toggle { - top: 12px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__toggle { + top: 12px } } /* #/imageWorkbench follow-up polish: larger adaptive composer, cleaner model panel, and livelier history handle. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - width: min(1128px, calc(100vw - 120px)) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { + width: min(1128px, calc(100vw - 120px)) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - min-height: clamp(248px, 24vh, 306px) !important; - padding: clamp(22px, 2.2vw, 28px) clamp(24px, 2.6vw, 32px) clamp(18px, 2vw, 24px) !important; - border-radius: clamp(26px, 2.2vw, 32px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + min-height: clamp(248px, 24vh, 306px); + padding: clamp(22px, 2.2vw, 28px) clamp(24px, 2.6vw, 32px) clamp(18px, 2vw, 24px); + border-radius: clamp(26px, 2.2vw, 32px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea { - min-height: clamp(118px, 13vh, 162px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { + min-height: clamp(118px, 13vh, 162px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-set { - width: min(372px, calc(100vw - 48px)) !important; - max-width: min(372px, calc(100vw - 48px)) !important; - padding: 13px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings-set { + width: min(372px, calc(100vw - 48px)); + max-width: min(372px, calc(100vw - 48px)); + padding: 13px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-set > .ecom-command-count-row { - width: min(100%, 334px) !important; - margin-inline: auto !important; - grid-template-columns: minmax(0, 1fr) 82px !important; - padding: 9px 10px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-set > .ecom-command-count-row { + width: min(100%, 334px); + margin-inline: auto; + grid-template-columns: minmax(0, 1fr) 82px; + padding: 9px 10px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-model { - width: min(544px, calc(100vw - 48px)) !important; - max-width: min(544px, calc(100vw - 48px)) !important; - max-height: none !important; - grid-template-columns: minmax(214px, 0.9fr) minmax(0, 1fr) !important; - gap: 12px !important; - padding: 15px !important; - overflow: visible !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings-model { + width: min(544px, calc(100vw - 48px)); + max-width: min(544px, calc(100vw - 48px)); + max-height: none; + grid-template-columns: minmax(214px, 0.9fr) minmax(0, 1fr); + gap: 12px; + padding: 15px; + overflow: visible } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model header { - padding-bottom: 6px !important; - border-bottom: 1px solid rgba(30, 189, 219, 0.1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model header { + padding-bottom: 6px; + border-bottom: 1px solid rgba(30, 189, 219, 0.1) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { - max-height: none !important; - overflow: visible !important; - scrollbar-width: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { + max-height: none; + overflow: visible; + scrollbar-width: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile::-webkit-scrollbar, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model::-webkit-scrollbar, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model::-webkit-scrollbar { - width: 0 !important; - height: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile::-webkit-scrollbar, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model::-webkit-scrollbar, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model::-webkit-scrollbar { + width: 0; + height: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile { - display: grid !important; - align-content: start !important; - gap: 8px !important; - padding: 10px !important; - border: 1px solid rgba(30, 189, 219, 0.12) !important; - border-radius: 16px !important; - background: rgba(248, 253, 255, 0.58) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile { + display: grid; + align-content: start; + gap: 8px; + padding: 10px; + border: 1px solid rgba(30, 189, 219, 0.12); + border-radius: 16px; + background: rgba(248, 253, 255, 0.58) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile__title { - margin: 0 0 1px !important; - color: rgba(16, 32, 44, 0.88) !important; - font-size: 13px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile__title { + margin: 0 0 1px; + color: rgba(16, 32, 44, 0.88); + font-size: 13px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section { - display: grid !important; - grid-template-columns: 36px minmax(0, 1fr) !important; - align-items: start !important; - gap: 8px !important; - padding: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section { + display: grid; + grid-template-columns: 36px minmax(0, 1fr); + align-items: start; + gap: 8px; + padding: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > strong { - padding-top: 7px !important; - color: rgba(16, 115, 204, 0.66) !important; - font-size: 12px !important; - line-height: 1.2 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > strong { + padding-top: 7px; + color: rgba(16, 115, 204, 0.66); + font-size: 12px; + line-height: 1.2 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > div { - display: flex !important; - flex-wrap: wrap !important; - gap: 6px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > div { + display: flex; + flex-wrap: wrap; + gap: 6px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { - align-content: start !important; - padding: 10px !important; - border: 1px solid rgba(30, 189, 219, 0.12) !important; - border-radius: 16px !important; - background: rgba(248, 253, 255, 0.58) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model { + align-content: start; + padding: 10px; + border: 1px solid rgba(30, 189, 219, 0.12); + border-radius: 16px; + background: rgba(248, 253, 255, 0.58) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model button { - min-height: 36px !important; - border-radius: 13px !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.68) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-module-grid--model button { + min-height: 36px; + border-radius: 13px; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.68) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__toggle.ecom-command-history__toggle { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__toggle { transition: border-color 180ms ease, background 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1), - opacity 180ms ease !important; + opacity 180ms ease } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__toggle.ecom-command-history__toggle:hover { - border-color: rgba(30, 189, 219, 0.46) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__toggle:hover { + border-color: rgba(30, 189, 219, 0.46); background: - linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(235, 252, 255, 0.92)) !important; - color: #1073cc !important; + linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(235, 252, 255, 0.92)); + color: var(--ecom-primary); box-shadow: 0 18px 38px rgba(16, 115, 204, 0.16), 0 0 0 4px rgba(30, 189, 219, 0.08), - inset 0 1px 0 rgba(255, 255, 255, 0.9) !important; - opacity: 1 !important; - transform: translateY(-2px) scale(1.035) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.9); + opacity: 1; + transform: translateY(-2px) scale(1.035) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"].is-history-collapsed .ecom-command-history__toggle.ecom-command-history__toggle:hover { - transform: translateY(-2px) translateX(-2px) scale(1.035) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-collapsed .ecom-command-history__toggle:hover { + transform: translateY(-2px) translateX(-2px) scale(1.035) } @media (min-width: 1440px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - width: min(1180px, calc(100vw - 152px)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { + width: min(1180px, calc(100vw - 152px)) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - min-height: clamp(276px, 25vh, 334px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + min-height: clamp(276px, 25vh, 334px) } } @media (min-width: 761px) and (max-width: 1180px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - width: min(1000px, calc(100vw - 72px)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { + width: min(1000px, calc(100vw - 72px)) } } @media (max-width: 760px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - width: min(100%, calc(100vw - 28px)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { + width: min(100%, calc(100vw - 28px)) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - min-height: clamp(220px, 36vh, 278px) !important; - padding: 16px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + min-height: clamp(220px, 36vh, 278px); + padding: 16px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea { - min-height: clamp(96px, 20vh, 132px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { + min-height: clamp(96px, 20vh, 132px) } } @media (max-width: 640px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-model { - max-height: min(520px, calc(100dvh - 170px)) !important; - overflow-y: auto !important; - scrollbar-width: thin !important; - scrollbar-color: rgba(16, 115, 204, 0.2) transparent !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings-model { + max-height: min(520px, calc(100dvh - 170px)); + overflow-y: auto; + scrollbar-width: thin; + scrollbar-color: rgba(16, 115, 204, 0.2) transparent } } /* #/imageWorkbench final balance: keep the original composer height while letting width breathe. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - width: min(1088px, calc(100vw - clamp(72px, 11vw, 176px))) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { + width: min(1088px, calc(100vw - clamp(72px, 11vw, 176px))) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - min-height: clamp(218px, 18vh, 238px) !important; - padding: 20px 24px 18px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + min-height: clamp(218px, 18vh, 238px); + padding: 20px 24px 18px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea { - min-height: clamp(92px, 10vh, 118px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { + min-height: clamp(92px, 10vh, 118px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > strong { - color: rgba(16, 32, 44, 0.56) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-model .ecom-command-model-profile section > strong { + color: rgba(16, 32, 44, 0.56) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__toggle.ecom-command-history__toggle:hover { - color: rgba(16, 32, 44, 0.62) !important; - background: rgba(255, 255, 255, 0.86) !important; - border-color: rgba(30, 189, 219, 0.22) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__toggle:hover { + color: rgba(16, 32, 44, 0.62); + background: rgba(255, 255, 255, 0.86); + border-color: rgba(30, 189, 219, 0.22); box-shadow: 0 18px 38px rgba(16, 115, 204, 0.14), 0 0 0 4px rgba(30, 189, 219, 0.06), - inset 0 1px 0 rgba(255, 255, 255, 0.9) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.9) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__toggle.ecom-command-history__toggle:hover .anticon { - color: inherit !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__toggle:hover .anticon { + color: inherit } @media (min-width: 1440px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - min-height: clamp(222px, 18vh, 246px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + min-height: clamp(222px, 18vh, 246px) } } @media (max-width: 760px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap { - width: min(100%, calc(100vw - 28px)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap { + width: min(100%, calc(100vw - 28px)) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - min-height: clamp(214px, 32vh, 250px) !important; - padding: 16px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + min-height: clamp(214px, 32vh, 250px); + padding: 16px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea { - min-height: clamp(86px, 18vh, 112px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { + min-height: clamp(86px, 18vh, 112px) } } /* #/imageWorkbench command surface refinement: quieter hierarchy for daily SaaS usage. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { - gap: 14px !important; - padding-top: 13px !important; - border-top-color: rgba(30, 189, 219, 0.085) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { + gap: 14px; + padding-top: 13px; + border-top-color: rgba(30, 189, 219, 0.085) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row { - gap: 8px !important; - align-items: center !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row { + gap: 8px; + align-items: center } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) { - min-height: 38px !important; - padding: 0 12px !important; - border-color: rgba(30, 189, 219, 0.14) !important; - border-radius: 14px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) { + min-height: 38px; + padding: 0 12px; + border-color: rgba(30, 189, 219, 0.14); + border-radius: 14px; background: - linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(247, 252, 254, 0.78)) !important; - color: rgba(16, 32, 44, 0.76) !important; + linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(247, 252, 254, 0.78)); + color: rgba(16, 32, 44, 0.76); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), - 0 8px 18px rgba(16, 115, 204, 0.035) !important; + 0 8px 18px rgba(16, 115, 204, 0.035); transition: border-color 160ms ease, background 160ms ease, color 160ms ease, box-shadow 180ms ease, - transform 180ms ease !important; + transform 180ms ease } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) > span:not(.ecom-command-option-icon) { - color: rgba(16, 32, 44, 0.46) !important; - font-weight: 650 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline) > span:not(.ecom-command-option-icon) { + color: rgba(16, 32, 44, 0.46); + font-weight: 650 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row .ecom-command-option-icon { - width: 21px !important; - height: 21px !important; - border-color: rgba(30, 189, 219, 0.1) !important; - background: rgba(232, 249, 253, 0.62) !important; - color: rgba(15, 130, 155, 0.82) !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row .ecom-command-option-icon { + width: 21px; + height: 21px; + border-color: rgba(30, 189, 219, 0.1); + background: rgba(232, 249, 253, 0.62); + color: rgba(15, 130, 155, 0.82); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline):hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline).is-active { - border-color: rgba(30, 189, 219, 0.34) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline):hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:not(.ecom-command-reference--inline).is-active { + border-color: rgba(30, 189, 219, 0.34); background: - linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(238, 251, 254, 0.9)) !important; - color: rgba(16, 32, 44, 0.9) !important; + linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(238, 251, 254, 0.9)); + color: rgba(16, 32, 44, 0.9); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84), - 0 11px 24px rgba(16, 115, 204, 0.065) !important; - transform: translateY(-1px) !important; + 0 11px 24px rgba(16, 115, 204, 0.065); + transform: translateY(-1px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline { - width: 46px !important; - min-width: 46px !important; - max-width: 46px !important; - height: 38px !important; - min-height: 38px !important; - border-radius: 14px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline { + width: 46px; + min-width: 46px; + max-width: 46px; + height: 38px; + min-height: 38px; + border-radius: 14px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline::before { - display: none !important; - content: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline::before { + display: none; + content: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline > span { - display: inline-grid !important; - width: 30px !important; - min-width: 30px !important; - height: 30px !important; - place-items: center !important; - margin: 0 !important; - overflow: visible !important; - border: 0 !important; - border-radius: 11px !important; - background: linear-gradient(180deg, rgba(232, 250, 254, 0.96), rgba(212, 244, 250, 0.88)) !important; - color: #0f829b !important; - font-size: 20px !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline > span { + display: inline-grid; + width: 30px; + min-width: 30px; + height: 30px; + place-items: center; + margin: 0; + overflow: visible; + border: 0; + border-radius: 11px; + background: linear-gradient(180deg, rgba(232, 250, 254, 0.96), rgba(212, 244, 250, 0.88)); + color: var(--ecom-accent-cyan-deep); + font-size: 20px; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--inline .anticon { - display: inline-flex !important; - color: inherit !important; - font-size: 20px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--inline .anticon { + display: inline-flex; + color: inherit; + font-size: 20px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--mode { - display: grid !important; - grid-template-columns: repeat(2, minmax(190px, 1fr)) !important; - grid-auto-flow: row !important; - justify-items: stretch !important; - gap: 9px !important; - width: min(460px, calc(100vw - 56px)) !important; - padding: 10px !important; - border-radius: 18px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--mode { + display: grid; + grid-template-columns: repeat(2, minmax(190px, 1fr)); + grid-auto-flow: row; + justify-items: stretch; + gap: 9px; + width: min(460px, calc(100vw - 56px)); + padding: 10px; + border-radius: 18px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button { - display: grid !important; - grid-template-columns: 32px minmax(0, 1fr) !important; - grid-template-rows: auto auto !important; - align-items: center !important; - justify-items: start !important; - column-gap: 8px !important; - row-gap: 1px !important; - width: 100% !important; - min-height: 58px !important; - padding: 9px 10px !important; - border: 0 !important; - border-radius: 14px !important; - text-align: left !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button { + display: grid; + grid-template-columns: 32px minmax(0, 1fr); + grid-template-rows: auto auto; + align-items: center; + justify-items: start; + column-gap: 8px; + row-gap: 1px; + width: 100%; + min-height: 58px; + padding: 9px 10px; + border: 0; + border-radius: 14px; + text-align: left; background: radial-gradient(circle at 18% 18%, color-mix(in srgb, var(--mode-accent, #1ebddb) 16%, transparent), transparent 42%), - linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(245, 252, 254, 0.74)) !important; + linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(245, 252, 254, 0.74)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), - 0 8px 18px rgba(16, 115, 204, 0.045) !important; + 0 8px 18px rgba(16, 115, 204, 0.045) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--hot) { - grid-column: 1 / -1 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--hot) { + grid-column: 1 / -1 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button.is-active, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button:hover { - color: rgba(16, 32, 44, 0.92) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button.is-active, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button:hover { + color: rgba(16, 32, 44, 0.92); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--mode-accent, #1ebddb) 36%, transparent), - 0 12px 26px color-mix(in srgb, var(--mode-accent, #1ebddb) 14%, transparent) !important; + 0 12px 26px color-mix(in srgb, var(--mode-accent, #1ebddb) 14%, transparent) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-icon { - grid-row: 1 / span 2 !important; - display: inline-grid !important; - width: 32px !important; - height: 32px !important; - place-items: center !important; - border-radius: 12px !important; - color: var(--mode-accent, #1073cc) !important; - background: color-mix(in srgb, var(--mode-accent, #1073cc) 13%, #ffffff) !important; - font-size: 16px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-icon { + grid-row: 1 / span 2; + display: inline-grid; + width: 32px; + height: 32px; + place-items: center; + border-radius: 12px; + color: var(--mode-accent, #1073cc); + background: color-mix(in srgb, var(--mode-accent, #1073cc) 13%, var(--ecom-bg-white)); + font-size: 16px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--set) { - --mode-accent: #0f8f72; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--set) { + --mode-accent: #0f8f72 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--detail) { - --mode-accent: #7a5af8; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--detail) { + --mode-accent: #7a5af8 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--model) { - --mode-accent: #1073cc; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--model) { + --mode-accent: var(--ecom-primary) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--video) { - --mode-accent: #cc6b14; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--video) { + --mode-accent: #cc6b14 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--hot) { - --mode-accent: #c04468; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button:has(.ecom-command-mode-icon--hot) { + --mode-accent: #c04468 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button strong { - min-width: 0 !important; - color: rgba(16, 32, 44, 0.86) !important; - font-size: 13px !important; - font-weight: 820 !important; - line-height: 1.15 !important; - white-space: nowrap !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button strong { + min-width: 0; + color: rgba(16, 32, 44, 0.86); + font-size: 13px; + font-weight: 820; + line-height: 1.15; + white-space: nowrap } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--mode button em { - min-width: 0 !important; - overflow: hidden !important; - color: rgba(16, 32, 44, 0.45) !important; - font-size: 10px !important; - font-style: normal !important; - font-weight: 650 !important; - line-height: 1.2 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--mode button em { + min-width: 0; + overflow: hidden; + color: rgba(16, 32, 44, 0.45); + font-size: 10px; + font-style: normal; + font-weight: 650; + line-height: 1.2; + text-overflow: ellipsis; + white-space: nowrap } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--ratio-picker { - grid-template-columns: repeat(auto-fit, minmax(154px, 1fr)) !important; - gap: 8px !important; - width: min(420px, calc(100vw - 56px)) !important; - padding: 10px !important; - border-radius: 18px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--ratio-picker { + grid-template-columns: repeat(auto-fit, minmax(154px, 1fr)); + gap: 8px; + width: min(420px, calc(100vw - 56px)); + padding: 10px; + border-radius: 18px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--ratio-picker button { - display: flex !important; - align-items: center !important; - justify-content: flex-start !important; - gap: 9px !important; - min-height: 52px !important; - padding: 8px 10px !important; - border: 0 !important; - border-radius: 14px !important; - text-align: left !important; - background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(240, 250, 253, 0.78)) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--ratio-picker button { + display: flex; + align-items: center; + justify-content: flex-start; + gap: 9px; + min-height: 52px; + padding: 8px 10px; + border: 0; + border-radius: 14px; + text-align: left; + background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(240, 250, 253, 0.78)) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-ratio-icon { - display: inline-grid !important; - width: 30px !important; - height: 30px !important; - place-items: center !important; - flex: 0 0 30px !important; - border-radius: 11px !important; - color: #1073cc !important; - background: rgba(226, 246, 252, 0.9) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-ratio-icon { + display: inline-grid; + width: 30px; + height: 30px; + place-items: center; + flex: 0 0 30px; + border-radius: 11px; + color: var(--ecom-primary); + background: rgba(226, 246, 252, 0.9) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-ratio-copy { - display: grid !important; - min-width: 0 !important; - gap: 4px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-ratio-copy { + display: grid; + min-width: 0; + gap: 4px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-ratio-copy strong { - min-width: 0 !important; - overflow: hidden !important; - color: rgba(16, 32, 44, 0.82) !important; - font-size: 12px !important; - font-weight: 820 !important; - line-height: 1.15 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-ratio-copy strong { + min-width: 0; + overflow: hidden; + color: rgba(16, 32, 44, 0.82); + font-size: 12px; + font-weight: 820; + line-height: 1.15; + text-overflow: ellipsis; + white-space: nowrap } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-ratio-copy em { - display: inline-grid !important; - width: max-content !important; - min-width: 40px !important; - height: 18px !important; - place-items: center !important; - padding: 0 7px !important; - border-radius: 999px !important; - color: #0f829b !important; - background: rgba(222, 248, 252, 0.94) !important; - font-size: 10px !important; - font-style: normal !important; - font-weight: 820 !important; - line-height: 1 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-ratio-copy em { + display: inline-grid; + width: max-content; + min-width: 40px; + height: 18px; + place-items: center; + padding: 0 7px; + border-radius: 999px; + color: var(--ecom-accent-cyan-deep); + background: rgba(222, 248, 252, 0.94); + font-size: 10px; + font-style: normal; + font-weight: 820; + line-height: 1 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-send-button.ecom-command-send { - width: 48px !important; - height: 48px !important; - min-width: 48px !important; - border-radius: 16px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send { + width: 48px; + height: 48px; + min-width: 48px; + border-radius: 16px; transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease, color 180ms ease, transform 180ms ease, - opacity 180ms ease !important; + opacity 180ms ease } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-send-button.ecom-command-send:not(:disabled) { - border-color: rgba(16, 115, 204, 0.18) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send:not(:disabled) { + border-color: rgba(16, 115, 204, 0.18); background: - linear-gradient(135deg, #1073cc 0%, #1ebddb 100%) !important; + linear-gradient(135deg, var(--ecom-primary) 0%, var(--ecom-accent-cyan) 100%); box-shadow: 0 16px 34px rgba(30, 189, 219, 0.24), - inset 0 1px 0 rgba(255, 255, 255, 0.32) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.32) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-send-button.ecom-command-send:not(:disabled):hover { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send:not(:disabled):hover { box-shadow: 0 20px 42px rgba(30, 189, 219, 0.3), 0 0 0 4px rgba(30, 189, 219, 0.09), - inset 0 1px 0 rgba(255, 255, 255, 0.38) !important; - transform: translateY(-1px) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.38); + transform: translateY(-1px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-send-button.ecom-command-send:disabled { - border: 1px solid rgba(30, 189, 219, 0.11) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send:disabled { + border: 1px solid rgba(30, 189, 219, 0.11); background: - linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(244, 252, 254, 0.68)) !important; - color: rgba(16, 32, 44, 0.22) !important; + linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(244, 252, 254, 0.68)); + color: rgba(16, 32, 44, 0.22); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), - 0 10px 22px rgba(16, 115, 204, 0.035) !important; - cursor: default !important; - opacity: 1 !important; + 0 10px 22px rgba(16, 115, 204, 0.035); + cursor: default; + opacity: 1 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board { - position: relative !important; - display: grid !important; - grid-template-columns: repeat(5, 1fr) !important; - gap: 10px !important; - min-height: 0 !important; - padding: 0 !important; - overflow: visible !important; - border: 0 !important; - border-radius: 0 !important; - background: transparent !important; - box-shadow: none !important; - backdrop-filter: none !important; - -webkit-backdrop-filter: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board { + position: relative; + display: grid; + grid-template-columns: repeat(5, 1fr); + gap: 10px; + min-height: 0; + padding: 0; + overflow: visible; + border: 0; + border-radius: 0; + background: transparent; + box-shadow: none; + backdrop-filter: none; + -webkit-backdrop-filter: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board::before { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board::before { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button { - min-height: 72px !important; - padding: 12px 10px !important; - gap: 8px !important; - border: 0 !important; - border-radius: 16px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button { + min-height: 72px; + padding: 12px 10px; + gap: 8px; + border: 0; + border-radius: 16px; background: radial-gradient(circle at 16% 18%, color-mix(in srgb, var(--quick-accent) 18%, transparent), transparent 38%), - linear-gradient(135deg, rgba(255, 255, 255, 0.94), var(--quick-bg)) !important; - color: var(--quick-text) !important; + linear-gradient(135deg, rgba(255, 255, 255, 0.94), var(--quick-bg)); + color: var(--quick-text); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), - 0 10px 24px rgba(16, 32, 44, 0.04) !important; + 0 10px 24px rgba(16, 32, 44, 0.04); transition: background 170ms ease, color 170ms ease, box-shadow 180ms ease, - transform 180ms ease !important; + transform 180ms ease } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button::before, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button::after { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button::before, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button::after { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button:hover { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:hover { background: radial-gradient(circle at 14% 18%, color-mix(in srgb, var(--quick-accent) 28%, transparent), transparent 40%), - linear-gradient(135deg, #ffffff, color-mix(in srgb, var(--quick-bg) 84%, #ffffff)) !important; - color: var(--quick-accent) !important; + linear-gradient(135deg, var(--ecom-bg-white), color-mix(in srgb, var(--quick-bg) 84%, var(--ecom-bg-white))); + color: var(--quick-accent); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78), - 0 16px 32px color-mix(in srgb, var(--quick-accent) 14%, transparent) !important; - transform: translateY(-2px) !important; + 0 16px 32px color-mix(in srgb, var(--quick-accent) 14%, transparent); + transform: translateY(-2px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button > span { - width: 34px !important; - height: 34px !important; - border: 0 !important; - border-radius: 12px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button > span { + width: 34px; + height: 34px; + border: 0; + border-radius: 12px; background: - linear-gradient(180deg, color-mix(in srgb, var(--quick-accent) 18%, #ffffff), color-mix(in srgb, var(--quick-accent) 8%, #ffffff)) !important; - color: var(--quick-accent) !important; - box-shadow: none !important; + linear-gradient(180deg, color-mix(in srgb, var(--quick-accent) 18%, var(--ecom-bg-white)), color-mix(in srgb, var(--quick-accent) 8%, var(--ecom-bg-white))); + color: var(--quick-accent); + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button:hover > span { - color: var(--quick-accent) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:hover > span { + color: var(--quick-accent); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), - 0 10px 22px color-mix(in srgb, var(--quick-accent) 18%, transparent) !important; + 0 10px 22px color-mix(in srgb, var(--quick-accent) 18%, transparent) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--detail { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--detail { --quick-accent: #7a5af8; --quick-bg: #f1edff; - --quick-text: #2f245d; + --quick-text: #2f245d } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--edit { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--edit { --quick-accent: #cc6b14; --quick-bg: #fff2e5; - --quick-text: #4e2c11; + --quick-text: #4e2c11 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--cutout { - --quick-accent: #1073cc; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--cutout { + --quick-accent: var(--ecom-primary); --quick-bg: #eaf5ff; - --quick-text: #123454; + --quick-text: #123454 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--watermark { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--watermark { --quick-accent: #c04468; --quick-bg: #fff0f5; - --quick-text: #542234; + --quick-text: #542234 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--translate { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--translate { --quick-accent: #0891b2; --quick-bg: #ecfeff; - --quick-text: #164e63; + --quick-text: #164e63 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button > span, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .anticon, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board svg { - border: 0 !important; - outline: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button > span, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .anticon, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board svg { + border: 0; + outline: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button > span { - background: transparent !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button > span { + background: transparent; + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button:hover > span { - background: transparent !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:hover > span { + background: transparent; + box-shadow: none } @media (max-width: 980px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board { - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - min-height: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board { + grid-template-columns: repeat(3, minmax(0, 1fr)); + min-height: 0 } } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__heading { - border-color: rgba(30, 189, 219, 0.1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__heading { + border-color: rgba(30, 189, 219, 0.1); background: - linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(247, 253, 254, 0.72)) !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important; + linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(247, 253, 254, 0.72)); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__empty { - display: grid !important; - min-height: 78px !important; - place-items: center !important; - border: 1px dashed rgba(30, 189, 219, 0.18) !important; - border-radius: 16px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__empty { + display: grid; + min-height: 78px; + place-items: center; + border: 1px dashed rgba(30, 189, 219, 0.18); + border-radius: 16px; background: - linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(247, 253, 254, 0.54)) !important; - color: rgba(16, 32, 44, 0.42) !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.66) !important; + linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(247, 253, 254, 0.54)); + color: rgba(16, 32, 44, 0.42); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.66) } @media (max-width: 760px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board { - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; - padding: 10px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board { + grid-template-columns: repeat(2, minmax(0, 1fr)); + padding: 10px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button { - min-height: 58px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button { + min-height: 58px } } /* #/imageWorkbench uploaded-asset balance: keep thumbnails useful without making the composer feel oversized. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - grid-template-rows: 58px minmax(46px, auto) auto !important; - row-gap: 7px !important; - min-height: clamp(232px, 19vh, 252px) !important; - padding: 20px 24px 18px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { + grid-template-rows: 58px minmax(46px, auto) auto; + row-gap: 7px; + min-height: clamp(232px, 19vh, 252px); + padding: 20px 24px 18px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover { - min-height: 54px !important; - max-height: 58px !important; - padding-left: 0 !important; - gap: 8px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover { + min-height: 54px; + max-height: 58px; + padding-left: 0; + gap: 8px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb { - flex-basis: 54px !important; - width: 54px !important; - height: 54px !important; - border-radius: 12px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb { + flex-basis: 54px; + width: 54px; + height: 54px; + border-radius: 12px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add { - flex-basis: 34px !important; - width: 34px !important; - height: 34px !important; - min-height: 34px !important; - margin-top: 10px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add { + flex-basis: 34px; + width: 34px; + height: 34px; + min-height: 34px; + margin-top: 10px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { - min-height: 50px !important; - max-height: 68px !important; - padding-top: 4px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { + min-height: 50px; + max-height: 68px; + padding-top: 4px } /* #/imageWorkbench detail popover and topbar blend: no inner scrollbar, no hard header split. */ -html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__topbar { - border-bottom-color: transparent !important; +.ecommerce-standalone.web-shell .ecommerce-standalone__topbar { + border-bottom-color: transparent; background: radial-gradient(48rem 14rem at 50% 100%, rgba(30, 189, 219, 0.09), transparent 72%), radial-gradient(28rem 12rem at 12% 100%, rgba(16, 115, 204, 0.045), transparent 68%), - linear-gradient(180deg, #fbfdfe 0%, #f8fbfc 100%) !important; - box-shadow: none !important; - backdrop-filter: none !important; - -webkit-backdrop-filter: none !important; + linear-gradient(180deg, #fbfdfe 0%, var(--ecom-bg-cool) 100%); + box-shadow: none; + backdrop-filter: none; + -webkit-backdrop-filter: none } -html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__topbar::after { - position: absolute !important; - right: 0 !important; - bottom: -1px !important; - left: 0 !important; - height: 1px !important; - background: linear-gradient(90deg, transparent, rgba(30, 189, 219, 0.08), transparent) !important; - content: "" !important; - pointer-events: none !important; +.ecommerce-standalone.web-shell .ecommerce-standalone__topbar::after { + position: absolute; + right: 0; + bottom: -1px; + left: 0; + height: 1px; + background: linear-gradient(90deg, transparent, rgba(30, 189, 219, 0.08), transparent); + content: ""; + pointer-events: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-detail { - width: min(468px, calc(100vw - 48px)) !important; - max-width: min(468px, calc(100vw - 48px)) !important; - max-height: none !important; - padding: 13px !important; - overflow: visible !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings-detail { + width: min(468px, calc(100vw - 48px)); + max-width: min(468px, calc(100vw - 48px)); + max-height: none; + padding: 13px; + overflow: visible } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail header { - min-height: 24px !important; - margin-bottom: 0 !important; - padding-bottom: 4px !important; - border-bottom: 1px solid rgba(30, 189, 219, 0.08) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail header { + min-height: 24px; + margin-bottom: 0; + padding-bottom: 4px; + border-bottom: 1px solid rgba(30, 189, 219, 0.08) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail { - display: grid !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; - gap: 7px !important; - max-height: none !important; - overflow: visible !important; - scrollbar-width: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 7px; + max-height: none; + overflow: visible; + scrollbar-width: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail::-webkit-scrollbar, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail::-webkit-scrollbar { - width: 0 !important; - height: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail::-webkit-scrollbar, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail::-webkit-scrollbar { + width: 0; + height: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button { - min-height: 43px !important; - padding: 7px 9px !important; - border-radius: 13px !important; - align-content: center !important; - gap: 2px !important; - text-align: center !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button { + min-height: 43px; + padding: 7px 9px; + border-radius: 13px; + align-content: center; + gap: 2px; + text-align: center } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button strong, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button span { - max-width: 100% !important; - overflow: hidden !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button strong, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button span { + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button strong { - font-size: 12px !important; - line-height: 1.25 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button strong { + font-size: 12px; + line-height: 1.25 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button span { - font-size: 10px !important; - line-height: 1.25 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail button span { + font-size: 10px; + line-height: 1.25 } @media (max-width: 760px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings-detail { - overflow: auto !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings-detail { + overflow: auto } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail { - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover--settings-detail .ecom-command-module-grid--detail { + grid-template-columns: repeat(2, minmax(0, 1fr)) } } /* #/imageWorkbench topbar seamless blend: the header floats over the same canvas instead of reading as a separate band. */ -html body #root .ecommerce-standalone.web-shell { +.ecommerce-standalone.web-shell { background: radial-gradient(circle at 19% 8%, rgba(30, 189, 219, 0.13), transparent 24rem), radial-gradient(circle at 82% 11%, rgba(16, 115, 204, 0.09), transparent 26rem), - linear-gradient(180deg, #fbfdfe 0%, #f8f9fa 54%, #f5f9fb 100%) !important; + linear-gradient(180deg, #fbfdfe 0%, var(--ecom-bg-page) 54%, #f5f9fb 100%) } -html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__topbar { - background: transparent !important; - box-shadow: none !important; +.ecommerce-standalone.web-shell .ecommerce-standalone__topbar { + background: transparent; + box-shadow: none } -html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__topbar::after { - content: none !important; +.ecommerce-standalone.web-shell .ecommerce-standalone__topbar::after { + content: none } /* #/imageWorkbench inspiration shelves below the toolbox. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview:has(.ecom-inspiration-lab) { - overflow-x: hidden !important; - overflow-y: auto !important; - padding-bottom: 88px !important; - scrollbar-width: thin !important; - scrollbar-color: rgba(16, 115, 204, 0.2) transparent !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview:has(.ecom-inspiration-lab) { + overflow-x: hidden; + overflow-y: auto; + padding-bottom: 88px; + scrollbar-width: thin; + scrollbar-color: rgba(16, 115, 204, 0.2) transparent } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview:has(.ecom-inspiration-lab)::-webkit-scrollbar { - width: 8px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview:has(.ecom-inspiration-lab)::-webkit-scrollbar { + width: 8px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview:has(.ecom-inspiration-lab)::-webkit-scrollbar-thumb { - border: 2px solid transparent !important; - border-radius: 999px !important; - background: rgba(16, 115, 204, 0.18) !important; - background-clip: content-box !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview:has(.ecom-inspiration-lab)::-webkit-scrollbar-thumb { + border: 2px solid transparent; + border-radius: 999px; + background: rgba(16, 115, 204, 0.18); + background-clip: content-box } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab).is-before-generate { - top: clamp(96px, 11vh, 132px) !important; - transform: translateX(-50%) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab).is-before-generate { + top: clamp(96px, 11vh, 132px); + transform: translateX(-50%) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) { - width: min(1220px, calc(100vw - clamp(64px, 8vw, 148px))) !important; - gap: 16px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) { + width: min(1220px, calc(100vw - clamp(64px, 8vw, 148px))); + gap: 16px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .clone-ai-input-wrapper.ecom-command-composer, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-lab { - width: min(100%, 1088px) !important; - margin-inline: auto !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .clone-ai-input-wrapper.ecom-command-composer, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-lab { + width: min(100%, 1088px); + margin-inline: auto } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-lab { - display: grid !important; - gap: 12px !important; - padding: 4px 0 24px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-lab { + display: grid; + gap: 12px; + padding: 4px 0 24px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-tabs { - display: flex !important; - align-items: center !important; - gap: 6px !important; - min-height: 34px !important; - padding: 0 2px !important; - overflow-x: auto !important; - scrollbar-width: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-tabs { + display: flex; + align-items: center; + gap: 6px; + min-height: 34px; + padding: 0 2px; + overflow-x: auto; + scrollbar-width: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-tabs::-webkit-scrollbar { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-tabs::-webkit-scrollbar { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-tabs button { - flex: 0 0 auto !important; - min-height: 30px !important; - padding: 0 12px !important; - border: 1px solid transparent !important; - border-radius: 999px !important; - background: transparent !important; - color: rgba(16, 32, 44, 0.54) !important; - font-size: 12px !important; - font-weight: 760 !important; - cursor: pointer !important; - transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-tabs button { + flex: 0 0 auto; + min-height: 30px; + padding: 0 12px; + border: 1px solid transparent; + border-radius: 999px; + background: transparent; + color: rgba(16, 32, 44, 0.54); + font-size: 12px; + font-weight: 760; + cursor: pointer; + transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-tabs button:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-tabs button.is-active { - border-color: rgba(30, 189, 219, 0.16) !important; - background: rgba(255, 255, 255, 0.72) !important; - color: rgba(16, 32, 44, 0.88) !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.045) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-tabs button:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-tabs button.is-active { + border-color: rgba(30, 189, 219, 0.16); + background: rgba(255, 255, 255, 0.72); + color: rgba(16, 32, 44, 0.88); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.045) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-rows { - display: grid !important; - gap: 14px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-rows { + display: grid; + gap: 14px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row { - display: grid !important; - grid-template-columns: 112px minmax(0, 1fr) !important; - gap: 14px !important; - min-height: 168px !important; - padding: 14px !important; - border: 1px solid rgba(30, 189, 219, 0.1) !important; - border-radius: 22px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row { + display: grid; + grid-template-columns: 112px minmax(0, 1fr); + gap: 14px; + min-height: 168px; + padding: 14px; + border: 1px solid rgba(30, 189, 219, 0.1); + border-radius: 22px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(247, 253, 254, 0.66)), - rgba(255, 255, 255, 0.74) !important; + rgba(255, 255, 255, 0.74); box-shadow: 0 20px 54px rgba(16, 115, 204, 0.06), - inset 0 1px 0 rgba(255, 255, 255, 0.76) !important; - overflow: hidden !important; + inset 0 1px 0 rgba(255, 255, 255, 0.76); + overflow: hidden } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row__meta { - display: grid !important; - grid-template-rows: auto auto 1fr !important; - align-content: start !important; - gap: 7px !important; - min-width: 0 !important; - padding: 10px 6px 8px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row__meta { + display: grid; + grid-template-rows: auto auto 1fr; + align-content: start; + gap: 7px; + min-width: 0; + padding: 10px 6px 8px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row__meta strong { - color: rgba(16, 32, 44, 0.9) !important; - font-size: 15px !important; - font-weight: 860 !important; - line-height: 1.2 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row__meta strong { + color: rgba(16, 32, 44, 0.9); + font-size: 15px; + font-weight: 860; + line-height: 1.2 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row__meta span { - color: rgba(16, 32, 44, 0.45) !important; - font-size: 12px !important; - line-height: 1.45 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row__meta span { + color: rgba(16, 32, 44, 0.45); + font-size: 12px; + line-height: 1.45 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row__controls { - display: flex !important; - align-self: end !important; - gap: 8px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row__controls { + display: flex; + align-self: end; + gap: 8px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row__controls button { - display: inline-grid !important; - width: 30px !important; - height: 30px !important; - place-items: center !important; - border: 1px solid rgba(30, 189, 219, 0.12) !important; - border-radius: 999px !important; - background: rgba(255, 255, 255, 0.72) !important; - color: rgba(16, 32, 44, 0.54) !important; - cursor: pointer !important; - transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row__controls button { + display: inline-grid; + width: 30px; + height: 30px; + place-items: center; + border: 1px solid rgba(30, 189, 219, 0.12); + border-radius: 999px; + background: rgba(255, 255, 255, 0.72); + color: rgba(16, 32, 44, 0.54); + cursor: pointer; + transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row__controls button:hover { - border-color: rgba(30, 189, 219, 0.28) !important; - background: rgba(235, 251, 254, 0.92) !important; - color: rgba(16, 115, 204, 0.82) !important; - transform: translateY(-1px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row__controls button:hover { + border-color: rgba(30, 189, 219, 0.28); + background: rgba(235, 251, 254, 0.92); + color: rgba(16, 115, 204, 0.82); + transform: translateY(-1px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-strip { - display: grid !important; - grid-auto-flow: column !important; - grid-auto-columns: minmax(260px, 1fr) !important; - gap: 10px !important; - min-width: 0 !important; - overflow-x: auto !important; - overflow-y: hidden !important; - overscroll-behavior-x: contain !important; - scroll-snap-type: x proximity !important; - scrollbar-width: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-strip { + display: grid; + grid-auto-flow: column; + grid-auto-columns: minmax(260px, 1fr); + gap: 10px; + min-width: 0; + overflow-x: auto; + overflow-y: hidden; + overscroll-behavior-x: contain; + scroll-snap-type: x proximity; + scrollbar-width: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-strip::-webkit-scrollbar { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-strip::-webkit-scrollbar { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card { - position: relative !important; - display: flex !important; - flex-direction: column !important; - justify-content: flex-end !important; - min-height: 210px !important; - padding: 0 !important; - border: 1px solid rgba(30, 189, 219, 0.09) !important; - border-radius: 16px !important; - background: #edf8fb !important; - scroll-snap-align: start !important; - overflow: hidden !important; - cursor: pointer !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card { + position: relative; + display: flex; + flex-direction: column; + justify-content: flex-end; + min-height: 210px; + padding: 0; + border: 1px solid rgba(30, 189, 219, 0.09); + border-radius: 16px; + background: var(--ecom-bg-tinted); + scroll-snap-align: start; + overflow: hidden; + cursor: pointer } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card__visual { - position: absolute !important; - inset: 0 !important; - height: 100% !important; - min-height: 0 !important; - overflow: hidden !important; - border-radius: 0 !important; - background: #edf8fb !important; - transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card__visual { + position: absolute; + inset: 0; + height: 100%; + min-height: 0; + overflow: hidden; + border-radius: 0; + background: var(--ecom-bg-tinted); + transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card:hover .ecom-inspiration-card__visual { - transform: scale(1.04) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card:hover .ecom-inspiration-card__visual { + transform: scale(1.04) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card__visual img, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card__visual video { - display: block !important; - width: 100% !important; - height: 100% !important; - object-fit: cover !important; - object-position: center !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card__visual img, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card__visual video { + display: block; + width: 100%; + height: 100%; + object-fit: cover; + object-position: center } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card strong { - position: relative !important; - z-index: 2 !important; - margin-top: 0 !important; - padding: 0 14px !important; - overflow: hidden !important; - color: #fff !important; - font-size: 14px !important; - font-weight: 820 !important; - line-height: 1.28 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; - text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45) !important; - opacity: 0 !important; - transform: translateY(8px) !important; - transition: opacity 0.32s cubic-bezier(0.16, 1, 0.3, 1), transform 0.32s cubic-bezier(0.16, 1, 0.3, 1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card strong { + position: relative; + z-index: 2; + margin-top: 0; + padding: 0 14px; + overflow: hidden; + color: var(--ecom-bg-white); + font-size: 14px; + font-weight: 820; + line-height: 1.28; + text-overflow: ellipsis; + white-space: nowrap; + text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45); + opacity: 0; + transform: translateY(8px); + transition: opacity 0.32s cubic-bezier(0.16, 1, 0.3, 1), transform 0.32s cubic-bezier(0.16, 1, 0.3, 1) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card:hover strong { - opacity: 1 !important; - transform: translateY(0) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card:hover strong { + opacity: 1; + transform: translateY(0) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card p { - position: relative !important; - z-index: 2 !important; - margin: 3px 0 0 !important; - padding: 0 14px 14px !important; - overflow: hidden !important; - color: rgba(255, 255, 255, 0.78) !important; - font-size: 11px !important; - line-height: 1.4 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; - text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important; - opacity: 0 !important; - transform: translateY(8px) !important; - transition: opacity 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.04s, transform 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.04s !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card p { + position: relative; + z-index: 2; + margin: 3px 0 0; + padding: 0 14px 14px; + overflow: hidden; + color: rgba(255, 255, 255, 0.78); + font-size: 11px; + line-height: 1.4; + text-overflow: ellipsis; + white-space: nowrap; + text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); + opacity: 0; + transform: translateY(8px); + transition: opacity 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.04s, transform 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.04s } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card:hover p { - opacity: 1 !important; - transform: translateY(0) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card:hover p { + opacity: 1; + transform: translateY(0) } /* hover 底部渐变遮罩 */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card::after { - content: "" !important; - position: absolute !important; - inset: 0 !important; - z-index: 1 !important; - background: linear-gradient(0deg, rgba(0, 0, 0, 0.58) 0%, rgba(0, 0, 0, 0) 55%) !important; - opacity: 0 !important; - transition: opacity 0.36s cubic-bezier(0.16, 1, 0.3, 1) !important; - pointer-events: none !important; - border-radius: 16px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card::after { + content: ""; + position: absolute; + inset: 0; + z-index: 1; + background: linear-gradient(0deg, rgba(0, 0, 0, 0.58) 0%, rgba(0, 0, 0, 0) 55%); + opacity: 0; + transition: opacity 0.36s cubic-bezier(0.16, 1, 0.3, 1); + pointer-events: none; + border-radius: 16px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card:hover::after { - opacity: 1 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card:hover::after { + opacity: 1 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-card em { - position: absolute !important; - top: 12px !important; - right: 14px !important; - z-index: 3 !important; - color: rgba(255, 255, 255, 0.55) !important; - font-size: 10px !important; - font-style: normal !important; - font-weight: 800 !important; - text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-card em { + position: absolute; + top: 12px; + right: 14px; + z-index: 3; + color: rgba(255, 255, 255, 0.55); + font-size: 10px; + font-style: normal; + font-weight: 800; + text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-strip { - grid-auto-columns: minmax(300px, 1fr) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-strip { + grid-auto-columns: minmax(300px, 1fr) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-card { - min-height: 210px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-card { + min-height: 210px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--listing .ecom-inspiration-card { - min-height: 260px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--listing .ecom-inspiration-card { + min-height: 260px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--video .ecom-inspiration-card { - min-height: 492px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--video .ecom-inspiration-card { + min-height: 492px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--video .ecom-inspiration-card__visual { - inset: 0 !important; - height: 100% !important; - min-height: 0 !important; - aspect-ratio: auto !important; - background: #edf8fb !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--video .ecom-inspiration-card__visual { + inset: 0; + height: 100%; + min-height: 0; + aspect-ratio: auto; + background: var(--ecom-bg-tinted) } /* ── Inspiration fullscreen preview ── */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-preview { - position: fixed !important; - inset: 0 !important; - z-index: 9999 !important; - display: flex !important; - align-items: center !important; - justify-content: center !important; - animation: ecom-preview-fade-in 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-preview { + position: fixed; + inset: 0; + z-index: 9999; + display: flex; + align-items: center; + justify-content: center; + animation: ecom-preview-fade-in 0.28s cubic-bezier(0.16, 1, 0.3, 1) } @keyframes ecom-preview-fade-in { - from { opacity: 0; } - to { opacity: 1; } + from { opacity: 0 } + to { opacity: 1 } } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-preview__backdrop { - position: absolute !important; - inset: 0 !important; - background: rgba(0, 0, 0, 0.72) !important; - backdrop-filter: blur(8px) !important; - -webkit-backdrop-filter: blur(8px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-preview__backdrop { + position: absolute; + inset: 0; + background: rgba(0, 0, 0, 0.72); + backdrop-filter: blur(8px); + -webkit-backdrop-filter: blur(8px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-preview__content { - position: relative !important; - z-index: 1 !important; - max-width: 90vw !important; - max-height: 90vh !important; - animation: ecom-preview-scale-in 0.32s cubic-bezier(0.16, 1, 0.3, 1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-preview__content { + position: relative; + z-index: 1; + max-width: 90vw; + max-height: 90vh; + animation: ecom-preview-scale-in 0.32s cubic-bezier(0.16, 1, 0.3, 1) } @keyframes ecom-preview-scale-in { - from { opacity: 0; transform: scale(0.92); } - to { opacity: 1; transform: scale(1); } + from { opacity: 0; transform: scale(0.92) } + to { opacity: 1; transform: scale(1) } } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-preview__media { - display: block !important; - max-width: 90vw !important; - max-height: 85vh !important; - border-radius: 16px !important; - object-fit: contain !important; - box-shadow: 0 24px 80px rgba(0, 0, 0, 0.4) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-preview__media { + display: block; + max-width: 90vw; + max-height: 85vh; + border-radius: 16px; + object-fit: contain; + box-shadow: 0 24px 80px rgba(0, 0, 0, 0.4) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-preview__close { - position: absolute !important; - top: -14px !important; - right: -14px !important; - z-index: 2 !important; - display: flex !important; - align-items: center !important; - justify-content: center !important; - width: 36px !important; - height: 36px !important; - border: 0 !important; - border-radius: 50% !important; - background: rgba(255, 255, 255, 0.92) !important; - color: #1a2a3a !important; - font-size: 16px !important; - line-height: 1 !important; - cursor: pointer !important; - box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18) !important; - transition: background 0.2s, transform 0.2s !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-preview__close { + position: absolute; + top: -14px; + right: -14px; + z-index: 2; + display: flex; + align-items: center; + justify-content: center; + width: 36px; + height: 36px; + border: 0; + border-radius: 50%; + background: rgba(255, 255, 255, 0.92); + color: #1a2a3a; + font-size: 16px; + line-height: 1; + cursor: pointer; + box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18); + transition: background 0.2s, transform 0.2s } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-preview__close:hover { - background: #fff !important; - transform: scale(1.1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-preview__close:hover { + background: var(--ecom-bg-white); + transform: scale(1.1) } body .ecom-inspiration-preview { - position: fixed !important; - inset: 0 !important; - z-index: 2147483000 !important; - display: grid !important; - place-items: center !important; - padding: 32px !important; - overflow: hidden !important; - background: rgba(8, 18, 28, 0.62) !important; - backdrop-filter: blur(10px) !important; - -webkit-backdrop-filter: blur(10px) !important; - animation: ecom-preview-fade-in 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important; + position: fixed; + inset: 0; + z-index: 2147483000; + display: grid; + place-items: center; + padding: 32px; + overflow: hidden; + background: rgba(8, 18, 28, 0.62); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); + animation: ecom-preview-fade-in 0.22s cubic-bezier(0.16, 1, 0.3, 1) } body .ecom-inspiration-preview__backdrop { - position: absolute !important; - inset: 0 !important; + position: absolute; + inset: 0 } body .ecom-inspiration-preview__content { - position: relative !important; - z-index: 1 !important; - display: grid !important; - place-items: center !important; - max-width: min(1280px, calc(100vw - 64px)) !important; - max-height: calc(100vh - 64px) !important; - overflow: hidden !important; - border-radius: 16px !important; - box-shadow: 0 24px 80px rgba(0, 0, 0, 0.34) !important; - animation: ecom-preview-scale-in 0.26s cubic-bezier(0.16, 1, 0.3, 1) !important; + position: relative; + z-index: 1; + display: grid; + place-items: center; + max-width: min(1280px, calc(100vw - 64px)); + max-height: calc(100vh - 64px); + overflow: hidden; + border-radius: 16px; + box-shadow: 0 24px 80px rgba(0, 0, 0, 0.34); + animation: ecom-preview-scale-in 0.26s cubic-bezier(0.16, 1, 0.3, 1) } body .ecom-inspiration-preview__media { - display: block !important; - width: auto !important; - height: auto !important; - max-width: min(1280px, calc(100vw - 64px)) !important; - max-height: calc(100vh - 64px) !important; - object-fit: contain !important; - border-radius: 16px !important; + display: block; + width: auto; + height: auto; + max-width: min(1280px, calc(100vw - 64px)); + max-height: calc(100vh - 64px); + object-fit: contain; + border-radius: 16px } body .ecom-inspiration-preview__close { - display: none !important; + display: none } /* 灵感预览:右下角"使用此提示词"动作条,避开视频底部控制条。 */ body .ecom-inspiration-preview__actions { - position: absolute !important; - right: 16px !important; - bottom: 16px !important; - z-index: 2 !important; - display: flex !important; - gap: 10px !important; + position: absolute; + right: 16px; + bottom: 16px; + z-index: 2; + display: flex; + gap: 10px } body .ecom-inspiration-preview__use-prompt { - display: inline-flex !important; - align-items: center !important; - gap: 8px !important; - padding: 10px 20px !important; - border: 1px solid rgba(255, 255, 255, 0.28) !important; - border-radius: 999px !important; - background: rgba(16, 32, 44, 0.72) !important; - backdrop-filter: blur(8px) !important; - -webkit-backdrop-filter: blur(8px) !important; - color: #ffffff !important; - font-size: 14px !important; - font-weight: 600 !important; - cursor: pointer !important; - box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important; - transition: background 160ms ease, transform 160ms ease, border-color 160ms ease !important; + display: inline-flex; + align-items: center; + gap: 8px; + padding: 10px 20px; + border: 1px solid rgba(255, 255, 255, 0.28); + border-radius: 999px; + background: rgba(16, 32, 44, 0.72); + backdrop-filter: blur(8px); + -webkit-backdrop-filter: blur(8px); + color: var(--ecom-bg-white); + font-size: 14px; + font-weight: 600; + cursor: pointer; + box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28); + transition: background 160ms ease, transform 160ms ease, border-color 160ms ease } body .ecom-inspiration-preview__use-prompt:hover { - border-color: rgba(30, 189, 219, 0.6) !important; - background: rgba(30, 189, 219, 0.92) !important; - transform: translateY(-1px) !important; + border-color: rgba(30, 189, 219, 0.6); + background: rgba(30, 189, 219, 0.92); + transform: translateY(-1px) } @media (max-width: 760px) { body .ecom-inspiration-preview { - padding: 14px !important; + padding: 14px } body .ecom-inspiration-preview__content, body .ecom-inspiration-preview__media { - max-width: calc(100vw - 28px) !important; - max-height: calc(100vh - 28px) !important; + max-width: calc(100vw - 28px); + max-height: calc(100vh - 28px) } } @media (min-width: 1440px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) { - width: min(1360px, calc(100vw - 132px)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) { + width: min(1360px, calc(100vw - 132px)) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-lab { - width: min(100%, 1280px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-lab { + width: min(100%, 1280px) } } @media (max-width: 900px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row { - grid-template-columns: minmax(0, 1fr) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row { + grid-template-columns: minmax(0, 1fr) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row__meta { - grid-template-columns: minmax(0, 1fr) auto !important; - grid-template-rows: auto auto !important; - padding: 2px 2px 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row__meta { + grid-template-columns: minmax(0, 1fr) auto; + grid-template-rows: auto auto; + padding: 2px 2px 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row__controls { - grid-column: 2 !important; - grid-row: 1 / span 2 !important; - align-self: center !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row__controls { + grid-column: 2; + grid-row: 1 / span 2; + align-self: center } } /* #/imageWorkbench inspiration shelves final sizing: make the case shelves immersive without stretching the composer. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"]:has(.ecom-inspiration-lab) { - --ecom-history-offset: 0px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"]:has(.ecom-inspiration-lab) { + --ecom-history-offset: 0px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) { - width: min(1440px, calc(100% - clamp(28px, 2.6vw, 44px))) !important; - padding-inline: clamp(12px, 1.55vw, 24px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) { + width: min(1440px, calc(100% - clamp(28px, 2.6vw, 44px))); + padding-inline: clamp(12px, 1.55vw, 24px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab).is-before-generate { - top: clamp(20px, 3vh, 34px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab).is-before-generate { + top: clamp(20px, 3vh, 34px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .clone-ai-input-wrapper.ecom-command-composer, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { - width: min(100%, 1088px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .clone-ai-input-wrapper.ecom-command-composer, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { + width: min(100%, 1088px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { - width: min(100%, 820px) !important; - min-height: 0 !important; - grid-template-columns: repeat(5, minmax(0, 1fr)) !important; - align-items: stretch !important; - gap: 10px !important; - margin-inline: auto !important; - padding: 0 !important; - border-radius: 0 !important; - background: transparent !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { + width: min(100%, 820px); + min-height: 0; + grid-template-columns: repeat(5, minmax(0, 1fr)); + align-items: stretch; + gap: 10px; + margin-inline: auto; + padding: 0; + border-radius: 0; + background: transparent; + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { - min-height: 58px !important; - justify-content: center !important; - padding: 0 14px !important; - gap: 8px !important; - border-radius: 14px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { + min-height: 58px; + justify-content: center; + padding: 0 14px; + gap: 8px; + border-radius: 14px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { - width: 28px !important; - height: 28px !important; - flex: 0 0 28px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { + width: 28px; + height: 28px; + flex: 0 0 28px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board strong { - font-size: 13px !important; - line-height: 1.2 !important; - white-space: nowrap !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board strong { + font-size: 13px; + line-height: 1.2; + white-space: nowrap } @media (max-width: 760px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { - width: min(100%, 480px) !important; - grid-template-columns: repeat(3, minmax(0, 1fr)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { + width: min(100%, 480px); + grid-template-columns: repeat(3, minmax(0, 1fr)) } } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-lab { - position: relative !important; - width: 100% !important; - max-width: 1400px !important; - margin-inline: auto !important; - padding: 8px clamp(4px, 0.8vw, 12px) 28px !important; - overflow: visible !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-lab { + position: relative; + width: 100%; + max-width: 1400px; + margin-inline: auto; + padding: 8px clamp(4px, 0.8vw, 12px) 28px; + overflow: visible } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-lab::before { - content: "" !important; - position: absolute !important; - z-index: -1 !important; - inset: 22px calc(clamp(4px, 0.8vw, 12px) * -1) 4px !important; - border-radius: 30px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-lab::before { + content: ""; + position: absolute; + z-index: -1; + inset: 22px calc(clamp(4px, 0.8vw, 12px) * -1) 4px; + border-radius: 30px; background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.72) 12%, rgba(255, 255, 255, 0.72) 88%, rgba(255, 255, 255, 0)), - linear-gradient(180deg, rgba(245, 252, 254, 0.4), rgba(245, 249, 251, 0.08)) !important; - pointer-events: none !important; + linear-gradient(180deg, rgba(245, 252, 254, 0.4), rgba(245, 249, 251, 0.08)); + pointer-events: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-tabs { - padding-inline: clamp(4px, 0.7vw, 10px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-tabs { + padding-inline: clamp(4px, 0.7vw, 10px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row { - grid-template-columns: clamp(112px, 9.5vw, 142px) minmax(0, 1fr) !important; - gap: clamp(14px, 1.25vw, 20px) !important; - padding: clamp(14px, 1.15vw, 18px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row { + grid-template-columns: clamp(112px, 9.5vw, 142px) minmax(0, 1fr); + gap: clamp(14px, 1.25vw, 20px); + padding: clamp(14px, 1.15vw, 18px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-strip { - grid-auto-columns: minmax(252px, 0.25fr) !important; - gap: clamp(10px, 0.85vw, 14px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-strip { + grid-auto-columns: minmax(252px, 0.25fr); + gap: clamp(10px, 0.85vw, 14px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-strip { - grid-auto-columns: minmax(286px, 0.25fr) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-strip { + grid-auto-columns: minmax(286px, 0.25fr) } @media (max-width: 900px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) { - width: min(100%, calc(100vw - 24px)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) { + width: min(100%, calc(100vw - 24px)) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-lab { - padding-inline: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-lab { + padding-inline: 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row { - grid-template-columns: minmax(0, 1fr) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row { + grid-template-columns: minmax(0, 1fr) } } /* #/imageWorkbench spacing correction: keep the generation composer close to the original first-screen position. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview:has(.ecom-inspiration-lab) { - padding-top: clamp(18px, 2.5vh, 30px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview:has(.ecom-inspiration-lab) { + padding-top: clamp(18px, 2.5vh, 30px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) { - gap: clamp(12px, 1.25vw, 16px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) { + gap: clamp(12px, 1.25vw, 16px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab).is-before-generate { - top: clamp(8px, 1.35vh, 14px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab).is-before-generate { + top: clamp(8px, 1.35vh, 14px) } @media (max-width: 900px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview:has(.ecom-inspiration-lab) { - padding-top: 12px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview:has(.ecom-inspiration-lab) { + padding-top: 12px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab).is-before-generate { - top: 8px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab).is-before-generate { + top: 8px } } /* Ecommerce viewport fit: keep standalone tool pages inside the visible app area. */ body.ecommerce-standalone-body, body.ecommerce-standalone-body #root { - width: 100% !important; - height: 100% !important; - overflow: hidden !important; + width: 100%; + height: 100%; + overflow: hidden } -html body #root .ecommerce-standalone.web-shell { +.ecommerce-standalone.web-shell { --ecommerce-topbar-height: 66px; - width: 100% !important; - height: 100dvh !important; - min-height: 0 !important; - overflow: hidden !important; + width: 100%; + height: 100dvh; + min-height: 0; + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__topbar { - min-height: var(--ecommerce-topbar-height) !important; +.ecommerce-standalone.web-shell .ecommerce-standalone__topbar { + min-height: var(--ecommerce-topbar-height) } -html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__content { - box-sizing: content-box !important; - height: calc(100dvh - var(--ecommerce-topbar-height)) !important; - min-height: 0 !important; - padding-top: var(--ecommerce-topbar-height) !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .ecommerce-standalone__content { + box-sizing: content-box; + height: calc(100dvh - var(--ecommerce-topbar-height)); + min-height: 0; + padding-top: var(--ecommerce-topbar-height); + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__content > .error-boundary, -html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__content .product-clone-page, -html body #root .ecommerce-standalone.web-shell .product-clone-page > .product-clone-shell { - height: 100% !important; - min-height: 0 !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .ecommerce-standalone__content > .error-boundary, +.ecommerce-standalone.web-shell .ecommerce-standalone__content .product-clone-page, +.ecommerce-standalone.web-shell .product-clone-page > .product-clone-shell { + height: 100%; + min-height: 0; + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-smart-cutout-page, -html body #root .ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-quick-set-page, -html body #root .ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-watermark-page { - --ecom-history-offset: 0px !important; - --ecom-history-panel-width: 0px !important; - box-sizing: border-box !important; - width: 100% !important; - height: 100% !important; - min-height: 0 !important; - padding-right: 0 !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-smart-cutout-page, +.ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-quick-set-page, +.ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-watermark-page { + --ecom-history-offset: 0px; + --ecom-history-panel-width: 0px; + box-sizing: border-box; + width: 100%; + height: 100%; + min-height: 0; + padding-right: 0; + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-translate-page { - --ecom-history-offset: 0px !important; - --ecom-history-panel-width: 0px !important; - box-sizing: border-box !important; - width: 100% !important; - height: 100% !important; - min-height: 0 !important; - padding-right: 0 !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-translate-page { + --ecom-history-offset: 0px; + --ecom-history-panel-width: 0px; + box-sizing: border-box; + width: 100%; + height: 100%; + min-height: 0; + padding-right: 0; + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-smart-cutout-page > .product-clone-shell, -html body #root .ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-quick-set-page > .product-clone-shell, -html body #root .ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-watermark-page > .product-clone-shell, -html body #root .ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-translate-page > .product-clone-shell { - box-sizing: border-box !important; - width: 100% !important; - max-width: none !important; - padding-right: 0 !important; +.ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-smart-cutout-page > .product-clone-shell, +.ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-quick-set-page > .product-clone-shell, +.ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-watermark-page > .product-clone-shell, +.ecommerce-standalone.web-shell .product-clone-page[data-tool="clone"].is-translate-page > .product-clone-shell { + box-sizing: border-box; + width: 100%; + max-width: none; + padding-right: 0 } -html body #root .ecommerce-standalone.web-shell .ecom-smart-cutout-page, -html body #root .ecommerce-standalone.web-shell .ecom-watermark-page, -html body #root .ecommerce-standalone.web-shell .ecom-translate-page, -html body #root .ecommerce-standalone.web-shell .ecom-quick-set-page { - box-sizing: border-box !important; - width: 100% !important; - max-width: none !important; - height: 100% !important; - min-height: 0 !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .ecom-smart-cutout-page, +.ecommerce-standalone.web-shell .ecom-watermark-page, +.ecommerce-standalone.web-shell .ecom-translate-page, +.ecommerce-standalone.web-shell .ecom-quick-set-page { + box-sizing: border-box; + width: 100%; + max-width: none; + height: 100%; + min-height: 0; + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .ecom-smart-cutout-page.is-upload { - display: grid !important; - grid-template-rows: minmax(0, 1fr) !important; +.ecommerce-standalone.web-shell .ecom-smart-cutout-page.is-upload { + display: grid; + grid-template-rows: minmax(0, 1fr) } -html body #root .ecommerce-standalone.web-shell .ecom-smart-cutout-nav { - position: absolute !important; - top: 18px !important; - left: 24px !important; - margin: 0 !important; +.ecommerce-standalone.web-shell .ecom-smart-cutout-nav { + position: absolute; + top: 18px; + left: 24px; + margin: 0 } -html body #root .ecommerce-standalone.web-shell .ecom-smart-cutout-upload { - box-sizing: border-box !important; - width: 100% !important; - height: 100% !important; - min-height: 0 !important; - align-content: center !important; - justify-items: center !important; - padding: clamp(78px, 8vh, 104px) clamp(24px, 4vw, 48px) clamp(28px, 5vh, 56px) !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .ecom-smart-cutout-upload { + box-sizing: border-box; + width: 100%; + height: 100%; + min-height: 0; + align-content: center; + justify-items: center; + padding: clamp(78px, 8vh, 104px) clamp(24px, 4vw, 48px) clamp(28px, 5vh, 56px); + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .ecom-smart-cutout-upload__body { - justify-content: center !important; - align-items: stretch !important; - margin-inline: auto !important; +.ecommerce-standalone.web-shell .ecom-smart-cutout-upload__body { + justify-content: center; + align-items: stretch; + margin-inline: auto } -html body #root .ecommerce-standalone.web-shell .ecom-quick-set-body { - height: 100% !important; - min-height: 0 !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .ecom-quick-set-body { + height: 100%; + min-height: 0; + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .ecom-quick-set-panel { - min-height: 0 !important; - overflow-y: auto !important; - scrollbar-width: none !important; - -ms-overflow-style: none !important; +.ecommerce-standalone.web-shell .ecom-quick-set-panel { + min-height: 0; + overflow-y: auto; + scrollbar-width: none; + -ms-overflow-style: none } -html body #root .ecommerce-standalone.web-shell .ecom-quick-set-panel::-webkit-scrollbar { - width: 0 !important; - height: 0 !important; - display: none !important; +.ecommerce-standalone.web-shell .ecom-quick-set-panel::-webkit-scrollbar { + width: 0; + height: 0; + display: none } -html body #root .ecommerce-standalone.web-shell .ecom-quick-set-stage { - min-height: 0 !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .ecom-quick-set-stage { + min-height: 0; + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .ecom-quick-set-canvas { - min-height: 0 !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .ecom-quick-set-canvas { + min-height: 0; + overflow: hidden } -html body #root .ecommerce-standalone.web-shell .ecom-watermark-page { - grid-template-columns: minmax(320px, 350px) minmax(0, 1fr) !important; - padding-top: 0 !important; - padding-left: 0 !important; - padding-right: 0 !important; - padding-bottom: 0 !important; - gap: 0 !important; +.ecommerce-standalone.web-shell .ecom-watermark-page { + grid-template-columns: minmax(320px, 350px) minmax(0, 1fr); + padding-top: 0; + padding-left: 0; + padding-right: 0; + padding-bottom: 0; + gap: 0 } -html body #root .ecommerce-standalone.web-shell .ecom-translate-page { - grid-template-columns: minmax(320px, 350px) minmax(0, 1fr) !important; - padding-top: 0 !important; - padding-left: 0 !important; - padding-right: 0 !important; - padding-bottom: 0 !important; - gap: 0 !important; +.ecommerce-standalone.web-shell .ecom-translate-page { + grid-template-columns: minmax(320px, 350px) minmax(0, 1fr); + padding-top: 0; + padding-left: 0; + padding-right: 0; + padding-bottom: 0; + gap: 0 } -html body #root .ecommerce-standalone.web-shell .ecom-watermark-side, -html body #root .ecommerce-standalone.web-shell .ecom-watermark-workspace { - min-height: 0 !important; - overflow: hidden !important; +.ecommerce-standalone.web-shell .ecom-watermark-side, +.ecommerce-standalone.web-shell .ecom-watermark-workspace { + min-height: 0; + overflow: hidden } @media (max-width: 1020px) { - html body #root .ecommerce-standalone.web-shell .ecom-smart-cutout-upload { - overflow: auto !important; + .ecommerce-standalone.web-shell .ecom-smart-cutout-upload { + overflow: auto } } @media (max-width: 640px) { - html body #root .ecommerce-standalone.web-shell { - --ecommerce-topbar-height: 62px; + .ecommerce-standalone.web-shell { + --ecommerce-topbar-height: 62px } } /* Preview modal actions stay inside the deliberate image inspection moment. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-modal { - gap: 14px !important; - border-color: rgba(30, 189, 219, 0.16) !important; +.ecommerce-standalone .product-set-preview-modal { + gap: 14px; + border-color: rgba(30, 189, 219, 0.16); box-shadow: 0 26px 72px rgba(16, 32, 44, 0.18), 0 8px 24px rgba(16, 115, 204, 0.08), - inset 0 1px 0 rgba(255, 255, 255, 0.86) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.86) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-footer { - display: flex !important; - align-items: center !important; - justify-content: space-between !important; - gap: 16px !important; - min-width: 0 !important; +.ecommerce-standalone .product-set-preview-footer { + display: flex; + align-items: center; + justify-content: space-between; + gap: 16px; + min-width: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-footer strong { - min-width: 0 !important; - overflow: hidden !important; - color: #10202c !important; - font-size: 15px !important; - font-weight: 800 !important; - line-height: 1.4 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; +.ecommerce-standalone .product-set-preview-footer strong { + min-width: 0; + overflow: hidden; + color: var(--ecom-text-primary); + font-size: 15px; + font-weight: 800; + line-height: 1.4; + text-overflow: ellipsis; + white-space: nowrap } -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-actions { - display: inline-flex !important; - align-items: center !important; - justify-content: flex-end !important; - gap: 10px !important; - flex: 0 0 auto !important; +.ecommerce-standalone .product-set-preview-actions { + display: inline-flex; + align-items: center; + justify-content: flex-end; + gap: 10px; + flex: 0 0 auto } -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-action { - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 7px !important; - height: 38px !important; - min-height: 38px !important; - padding: 0 14px !important; - border: 1px solid rgba(30, 189, 219, 0.2) !important; - border-radius: 999px !important; - color: #1073cc !important; - background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(241, 251, 253, 0.92)) !important; +.ecommerce-standalone .product-set-preview-action { + display: inline-flex; + align-items: center; + justify-content: center; + gap: 7px; + height: 38px; + min-height: 38px; + padding: 0 14px; + border: 1px solid rgba(30, 189, 219, 0.2); + border-radius: 999px; + color: var(--ecom-primary); + background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(241, 251, 253, 0.92)); box-shadow: 0 8px 18px rgba(16, 115, 204, 0.08), - inset 0 1px 0 rgba(255, 255, 255, 0.9) !important; - font-size: 14px !important; - font-weight: 750 !important; - cursor: pointer !important; + inset 0 1px 0 rgba(255, 255, 255, 0.9); + font-size: 14px; + font-weight: 750; + cursor: pointer; transition: border-color 160ms ease, color 160ms ease, background 160ms ease, transform 160ms ease, - box-shadow 160ms ease !important; + box-shadow 160ms ease } -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-action:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-action:focus-visible { - border-color: rgba(30, 189, 219, 0.42) !important; - background: #ffffff !important; - outline: none !important; - transform: translateY(-1px) !important; +.ecommerce-standalone .product-set-preview-action:hover, +.ecommerce-standalone .product-set-preview-action:focus-visible { + border-color: rgba(30, 189, 219, 0.42); + background: var(--ecom-bg-white); + outline: none; + transform: translateY(-1px); box-shadow: 0 12px 24px rgba(16, 115, 204, 0.12), - inset 0 1px 0 rgba(255, 255, 255, 0.94) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.94) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-action--danger { - border-color: rgba(255, 77, 79, 0.16) !important; - color: #d84a4d !important; - background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 246, 246, 0.94)) !important; +.ecommerce-standalone .product-set-preview-action--danger { + border-color: rgba(255, 77, 79, 0.16); + color: #d84a4d; + background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 246, 246, 0.94)) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-action--danger:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-action--danger:focus-visible { - border-color: rgba(255, 77, 79, 0.28) !important; - color: #c93639 !important; +.ecommerce-standalone .product-set-preview-action--danger:hover, +.ecommerce-standalone .product-set-preview-action--danger:focus-visible { + border-color: rgba(255, 77, 79, 0.28); + color: #c93639 } @media (max-width: 640px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-footer { - align-items: stretch !important; - flex-direction: column !important; + .ecommerce-standalone .product-set-preview-footer { + align-items: stretch; + flex-direction: column } - html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-actions { - justify-content: stretch !important; - width: 100% !important; + .ecommerce-standalone .product-set-preview-actions { + justify-content: stretch; + width: 100% } - html body #root .ecommerce-standalone.ecommerce-standalone .product-set-preview-action { - flex: 1 1 0 !important; + .ecommerce-standalone .product-set-preview-action { + flex: 1 1 0 } } /* History record detail: compact composer becomes a stable summary bar, then expands on click. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail { - --history-detail-workspace-width: calc(100vw - var(--ecom-history-panel-width, 292px)); +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail { + --history-detail-workspace-width: calc(100vw - var(--ecom-history-panel-width, 292px)) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact { - position: fixed !important; - top: calc(var(--ecommerce-topbar-height, 66px) + clamp(0px, 0.6vh, 6px)) !important; - left: calc(var(--history-detail-workspace-width) / 2) !important; - width: min(760px, calc(var(--history-detail-workspace-width) - clamp(48px, 8vw, 96px))) !important; - gap: 0 !important; - transform: translateX(-50%) !important; - z-index: 72 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact { + position: fixed; + top: calc(var(--ecommerce-topbar-height, 66px) + clamp(0px, 0.6vh, 6px)); + left: calc(var(--history-detail-workspace-width) / 2); + width: min(760px, calc(var(--history-detail-workspace-width) - clamp(48px, 8vw, 96px))); + gap: 0; + transform: translateX(-50%); + z-index: 72 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-title { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-title { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - display: grid !important; - grid-template-columns: auto minmax(0, 1fr) auto !important; - grid-template-rows: minmax(64px, auto) !important; - align-items: center !important; - column-gap: 16px !important; - min-height: clamp(68px, 8.8vh, 82px) !important; - max-height: 86px !important; - padding: clamp(8px, 1.2vh, 10px) 12px clamp(8px, 1.2vh, 10px) 16px !important; - overflow: hidden !important; - border: 1px solid rgba(30, 189, 219, 0.16) !important; - border-radius: 999px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer, +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { + display: grid; + grid-template-columns: auto minmax(0, 1fr) auto; + grid-template-rows: minmax(64px, auto); + align-items: center; + column-gap: 16px; + min-height: clamp(68px, 8.8vh, 82px); + max-height: 86px; + padding: clamp(8px, 1.2vh, 10px) 12px clamp(8px, 1.2vh, 10px) 16px; + overflow: hidden; + border: 1px solid rgba(30, 189, 219, 0.16); + border-radius: 999px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 253, 254, 0.94)), - #feffff !important; + var(--ecom-bg-near-white); box-shadow: 0 18px 46px rgba(16, 115, 204, 0.1), 0 4px 14px rgba(30, 189, 219, 0.055), - inset 0 1px 0 rgba(255, 255, 255, 0.88) !important; - cursor: text !important; - backdrop-filter: blur(18px) saturate(1.08) !important; - -webkit-backdrop-filter: blur(18px) saturate(1.08) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.88); + cursor: text; + backdrop-filter: blur(18px) saturate(1.08); + -webkit-backdrop-filter: blur(18px) saturate(1.08) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:focus-within { - border-color: rgba(30, 189, 219, 0.32) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:focus-within { + border-color: rgba(30, 189, 219, 0.32); box-shadow: 0 22px 54px rgba(16, 115, 204, 0.12), 0 0 0 4px rgba(30, 189, 219, 0.055), - inset 0 1px 0 rgba(255, 255, 255, 0.9) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.9) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-reference:not(.ecom-command-reference--inline) { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-reference:not(.ecom-command-reference--inline) { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-popover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover { - grid-column: 1 !important; - grid-row: 1 !important; - align-self: center !important; - display: flex !important; - align-items: center !important; - gap: 8px !important; - width: auto !important; - min-width: 52px !important; - max-width: 160px !important; - min-height: 56px !important; - max-height: 56px !important; - padding: 0 !important; - overflow: hidden !important; - border: 0 !important; - background: transparent !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-popover, +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover { + grid-column: 1; + grid-row: 1; + align-self: center; + display: flex; + align-items: center; + gap: 8px; + width: auto; + min-width: 52px; + max-width: 160px; + min-height: 56px; + max-height: 56px; + padding: 0; + overflow: hidden; + border: 0; + background: transparent; + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb { - flex: 0 0 54px !important; - width: 54px !important; - height: 54px !important; - border-radius: 18px !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.12) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb, +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb { + flex: 0 0 54px; + width: 54px; + height: 54px; + border-radius: 18px; + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.12) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb img, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb video { - border-radius: 18px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb img, +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb video { + border-radius: 18px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb > button { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb > button { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-add { - flex: 0 0 46px !important; - width: 46px !important; - height: 46px !important; - min-height: 46px !important; - margin: 0 !important; - border-radius: 50% !important; - color: #10202c !important; - background: rgba(16, 32, 44, 0.045) !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-add { + flex: 0 0 46px; + width: 46px; + height: 46px; + min-height: 46px; + margin: 0; + border-radius: 50%; + color: var(--ecom-text-primary); + background: rgba(16, 32, 44, 0.045); + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-composer textarea, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { - grid-column: 2 !important; - grid-row: 1 !important; - align-self: center !important; - min-height: 34px !important; - max-height: 38px !important; - height: 38px !important; - padding: 4px 0 0 !important; - overflow: hidden !important; - color: rgba(16, 32, 44, 0.72) !important; - background: transparent !important; - font-size: clamp(17px, 1.35vw, 22px) !important; - font-weight: 650 !important; - line-height: 32px !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; - resize: none !important; - opacity: 1 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-composer textarea, +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { + grid-column: 2; + grid-row: 1; + align-self: center; + min-height: 34px; + max-height: 38px; + height: 38px; + padding: 4px 0 0; + overflow: hidden; + color: rgba(16, 32, 44, 0.72); + background: transparent; + font-size: clamp(17px, 1.35vw, 22px); + font-weight: 650; + line-height: 32px; + text-overflow: ellipsis; + white-space: nowrap; + resize: none; + opacity: 1 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-composer textarea::placeholder { - color: rgba(16, 32, 44, 0.48) !important; - opacity: 1 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-composer textarea::placeholder { + color: rgba(16, 32, 44, 0.48); + opacity: 1 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-toolbar, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-toolbar { - grid-column: 3 !important; - grid-row: 1 !important; - align-self: center !important; - display: flex !important; - align-items: center !important; - justify-content: center !important; - min-height: 56px !important; - padding: 0 !important; - overflow: visible !important; - border: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-toolbar, +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-toolbar { + grid-column: 3; + grid-row: 1; + align-self: center; + display: flex; + align-items: center; + justify-content: center; + min-height: 56px; + padding: 0; + overflow: visible; + border: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-option-row { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-option-row { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-submit-row { - display: flex !important; - align-items: center !important; - justify-content: center !important; - padding: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-submit-row { + display: flex; + align-items: center; + justify-content: center; + padding: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-send-button.ecom-command-send { - width: 58px !important; - height: 58px !important; - min-height: 58px !important; - border-radius: 50% !important; - background: linear-gradient(135deg, #1073cc 0%, #1ebddb 100%) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-send-button.ecom-command-send { + width: 58px; + height: 58px; + min-height: 58px; + border-radius: 50%; + background: linear-gradient(135deg, var(--ecom-primary) 0%, var(--ecom-accent-cyan) 100%); box-shadow: 0 14px 28px rgba(16, 115, 204, 0.22), - inset 0 1px 0 rgba(255, 255, 255, 0.32) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.32) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-send-button.ecom-command-send:hover:not(:disabled) { - transform: translateY(-1px) scale(1.02) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-send-button.ecom-command-send:hover:not(:disabled) { + transform: translateY(-1px) scale(1.02) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-preview[data-status="done"] { - padding-top: clamp(132px, 18vh, 160px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-preview[data-status="done"] { + padding-top: clamp(132px, 18vh, 160px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-preview[data-status="done"]:has(.ecom-command-composer-wrap:not(.is-compact)) { - padding-top: 380px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-preview[data-status="done"]:has(.ecom-command-composer-wrap:not(.is-compact)) { + padding-top: 380px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-preview-zoom-wrap { - display: flex !important; - justify-content: center !important; - width: 100% !important; - min-width: 100% !important; - transform-origin: center top !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-preview-zoom-wrap { + display: flex; + justify-content: center; + width: 100%; + min-width: 100%; + transform-origin: center top } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-canvas-nodes { - display: flex !important; - justify-content: center !important; - box-sizing: border-box !important; - width: 100% !important; - min-width: 0 !important; - min-height: 260px !important; - padding: 22px clamp(20px, 4vw, 48px) 44px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-canvas-nodes { + display: flex; + justify-content: center; + box-sizing: border-box; + width: 100%; + min-width: 0; + min-height: 260px; + padding: 22px clamp(20px, 4vw, 48px) 44px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-canvas-node:not(.is-generating) { - position: relative !important; - top: auto !important; - left: auto !important; - max-width: min(860px, calc(var(--history-detail-workspace-width) - 80px)) !important; - transform: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-canvas-node:not(.is-generating) { + position: relative; + top: auto; + left: auto; + max-width: min(860px, calc(var(--history-detail-workspace-width) - 80px)); + transform: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-canvas-node .clone-ai-result-grid { - justify-content: center !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-canvas-node .clone-ai-result-grid { + justify-content: center } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-history__item { - isolation: isolate !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-history__item { + isolation: isolate } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-history__item .ecom-command-history__item-delete { - position: absolute !important; - top: 50% !important; - right: 14px !important; - z-index: 4 !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - width: 34px !important; - height: 34px !important; - min-height: 34px !important; - margin: 0 !important; - padding: 0 !important; - border: 1px solid rgba(30, 189, 219, 0.16) !important; - border-radius: 12px !important; - color: rgba(16, 32, 44, 0.46) !important; - background: rgba(255, 255, 255, 0.86) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-history__item .ecom-command-history__item-delete { + position: absolute; + top: 50%; + right: 14px; + z-index: 4; + display: inline-flex; + align-items: center; + justify-content: center; + width: 34px; + height: 34px; + min-height: 34px; + margin: 0; + padding: 0; + border: 1px solid rgba(30, 189, 219, 0.16); + border-radius: 12px; + color: rgba(16, 32, 44, 0.46); + background: rgba(255, 255, 255, 0.86); box-shadow: 0 8px 18px rgba(16, 115, 204, 0.075), - inset 0 1px 0 rgba(255, 255, 255, 0.82) !important; - font-size: 14px !important; - line-height: 1 !important; - transform: translateY(-50%) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.82); + font-size: 14px; + line-height: 1; + transform: translateY(-50%) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-history__item .ecom-command-history__item-delete:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-history__item .ecom-command-history__item-delete:focus-visible { - color: #ff4d4f !important; - background: rgba(255, 255, 255, 0.95) !important; - border-color: rgba(255, 77, 79, 0.2) !important; - outline: none !important; - transform: translateY(-50%) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-history__item .ecom-command-history__item-delete:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-history__item .ecom-command-history__item-delete:focus-visible { + color: #ff4d4f; + background: rgba(255, 255, 255, 0.95); + border-color: rgba(255, 77, 79, 0.2); + outline: none; + transform: translateY(-50%) } @media (max-width: 900px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail { - --history-detail-workspace-width: 100vw; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail { + --history-detail-workspace-width: 100vw } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact { - left: 50vw !important; - top: calc(var(--ecommerce-topbar-height, 62px) + 2px) !important; - width: min(720px, calc(100vw - 36px)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact { + left: 50vw; + top: calc(var(--ecommerce-topbar-height, 62px) + 2px); + width: min(720px, calc(100vw - 36px)) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - column-gap: 10px !important; - padding-inline: 12px 10px !important; - min-height: 70px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer, + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { + column-gap: 10px; + padding-inline: 12px 10px; + min-height: 70px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-popover { - max-width: 116px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-popover { + max-width: 116px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-canvas-node:not(.is-generating) { - max-width: calc(100vw - 32px) !important; - flex-wrap: wrap !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail .clone-ai-canvas-node:not(.is-generating) { + max-width: calc(100vw - 32px); + flex-wrap: wrap } } /* #/imageWorkbench polish: refine quick action surface and widen inspiration shelves for an immersive first page. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { - width: min(100%, 920px) !important; - padding: 7px !important; - gap: 9px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { + width: min(100%, 920px); + padding: 7px; + gap: 9px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(246, 252, 254, 0.52)), - rgba(255, 255, 255, 0.5) !important; + rgba(255, 255, 255, 0.5); box-shadow: 0 18px 38px rgba(16, 115, 204, 0.05), - inset 0 1px 0 rgba(255, 255, 255, 0.78) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.78) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--detail, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--edit, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--cutout, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--watermark { - --quick-accent: #1073cc !important; - --quick-accent-soft: rgba(30, 189, 219, 0.16) !important; - --quick-bg: rgba(245, 252, 254, 0.82) !important; - --quick-text: #163447 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--detail, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--edit, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--cutout, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--watermark { + --quick-accent: var(--ecom-primary); + --quick-accent-soft: rgba(30, 189, 219, 0.16); + --quick-bg: rgba(245, 252, 254, 0.82); + --quick-text: var(--ecom-bg-deep-blue) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { - min-height: 56px !important; - border: 1px solid rgba(30, 189, 219, 0.09) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { + min-height: 56px; + border: 1px solid rgba(30, 189, 219, 0.09); background: - linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(246, 252, 254, 0.8)) !important; - color: #163447 !important; + linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(246, 252, 254, 0.8)); + color: var(--ecom-bg-deep-blue); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), - 0 8px 18px rgba(16, 115, 204, 0.035) !important; + 0 8px 18px rgba(16, 115, 204, 0.035) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { - width: 30px !important; - height: 30px !important; - flex: 0 0 30px !important; - border-radius: 11px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { + width: 30px; + height: 30px; + flex: 0 0 30px; + border-radius: 11px; background: - linear-gradient(180deg, rgba(30, 189, 219, 0.16), rgba(16, 115, 204, 0.08)) !important; - color: #1073cc !important; + linear-gradient(180deg, rgba(30, 189, 219, 0.16), rgba(16, 115, 204, 0.08)); + color: var(--ecom-primary); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74), - 0 7px 16px rgba(16, 115, 204, 0.08) !important; + 0 7px 16px rgba(16, 115, 204, 0.08) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board strong { - color: #163447 !important; - font-weight: 650 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board strong { + color: var(--ecom-bg-deep-blue); + font-weight: 650 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible { - border-color: rgba(16, 115, 204, 0.18) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible { + border-color: rgba(16, 115, 204, 0.18); background: radial-gradient(circle at 16% 20%, rgba(30, 189, 219, 0.2), transparent 42%), - linear-gradient(135deg, #ffffff, rgba(241, 250, 253, 0.92)) !important; - color: #1073cc !important; + linear-gradient(135deg, var(--ecom-bg-white), rgba(241, 250, 253, 0.92)); + color: var(--ecom-primary); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), - 0 14px 28px rgba(16, 115, 204, 0.08) !important; - outline: none !important; + 0 14px 28px rgba(16, 115, 204, 0.08); + outline: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span { background: - linear-gradient(180deg, rgba(30, 189, 219, 0.22), rgba(16, 115, 204, 0.12)) !important; - color: #0d65b4 !important; + linear-gradient(180deg, rgba(30, 189, 219, 0.22), rgba(16, 115, 204, 0.12)); + color: #0d65b4 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) { - width: min(2360px, calc(100vw - clamp(48px, 4.2vw, 108px))) !important; - max-width: none !important; - padding-inline: clamp(12px, 1.2vw, 22px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) { + width: min(2360px, calc(100vw - clamp(48px, 4.2vw, 108px))); + max-width: none; + padding-inline: clamp(12px, 1.2vw, 22px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-lab { - width: 100% !important; - max-width: none !important; - padding: 8px 0 30px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-lab { + width: 100%; + max-width: none; + padding: 8px 0 30px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-lab::before { - inset: 20px 0 2px !important; - border-radius: 28px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-lab::before { + inset: 20px 0 2px; + border-radius: 28px; background: linear-gradient(90deg, rgba(245, 252, 254, 0.18), rgba(255, 255, 255, 0.78) 10%, rgba(255, 255, 255, 0.78) 90%, rgba(245, 252, 254, 0.18)), - linear-gradient(180deg, rgba(245, 252, 254, 0.58), rgba(255, 255, 255, 0.14)) !important; + linear-gradient(180deg, rgba(245, 252, 254, 0.58), rgba(255, 255, 255, 0.14)) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-tabs { - padding-inline: clamp(12px, 1.2vw, 22px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-tabs { + padding-inline: clamp(12px, 1.2vw, 22px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row { - grid-template-columns: clamp(134px, 7vw, 174px) minmax(0, 1fr) !important; - gap: clamp(16px, 1.15vw, 24px) !important; - padding: clamp(14px, 1vw, 20px) clamp(14px, 1.05vw, 22px) !important; - border-color: rgba(16, 115, 204, 0.07) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row { + grid-template-columns: clamp(134px, 7vw, 174px) minmax(0, 1fr); + gap: clamp(16px, 1.15vw, 24px); + padding: clamp(14px, 1vw, 20px) clamp(14px, 1.05vw, 22px); + border-color: rgba(16, 115, 204, 0.07); background: - linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(247, 252, 254, 0.72)) !important; + linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(247, 252, 254, 0.72)) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row__meta { - min-width: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row__meta { + min-width: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-strip { - grid-auto-columns: clamp(320px, 18.4vw, 470px) !important; - gap: clamp(12px, 0.9vw, 18px) !important; - padding-right: clamp(18px, 1.6vw, 34px) !important; - scroll-padding-inline: clamp(18px, 1.6vw, 34px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-strip { + grid-auto-columns: clamp(320px, 18.4vw, 470px); + gap: clamp(12px, 0.9vw, 18px); + padding-right: clamp(18px, 1.6vw, 34px); + scroll-padding-inline: clamp(18px, 1.6vw, 34px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-strip { - grid-auto-columns: clamp(420px, 24vw, 620px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-strip { + grid-auto-columns: clamp(420px, 24vw, 620px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--listing .ecom-inspiration-strip { - grid-auto-columns: clamp(300px, 16.2vw, 420px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--listing .ecom-inspiration-strip { + grid-auto-columns: clamp(300px, 16.2vw, 420px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--video .ecom-inspiration-strip { - grid-auto-columns: clamp(360px, 21vw, 540px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--video .ecom-inspiration-strip { + grid-auto-columns: clamp(360px, 21vw, 540px) } @media (max-width: 900px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) { - width: min(100%, calc(100vw - 24px)) !important; - padding-inline: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) { + width: min(100%, calc(100vw - 24px)); + padding-inline: 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row { - grid-template-columns: minmax(0, 1fr) !important; - gap: 12px !important; - padding: 14px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row { + grid-template-columns: minmax(0, 1fr); + gap: 12px; + padding: 14px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-strip, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-strip, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--listing .ecom-inspiration-strip, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-inspiration-row--video .ecom-inspiration-strip { - grid-auto-columns: minmax(248px, 76vw) !important; - padding-right: 14px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-strip, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--team .ecom-inspiration-strip, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--listing .ecom-inspiration-strip, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-inspiration-row--video .ecom-inspiration-strip { + grid-auto-columns: minmax(248px, 76vw); + padding-right: 14px } } @media (max-width: 640px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { - width: min(100%, 420px) !important; - grid-template-columns: repeat(2, minmax(0, 1fr)) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { + width: min(100%, 420px); + grid-template-columns: repeat(2, minmax(0, 1fr)) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { - padding-inline: 10px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { + padding-inline: 10px } } /* #/imageWorkbench compact composer centering: when history is collapsed, center on the visible canvas. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed { - --history-detail-workspace-width: 100vw !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed { + --history-detail-workspace-width: 100vw } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact { - left: 50vw !important; - width: min(760px, calc(100vw - clamp(32px, 6vw, 96px))) !important; - transform: translateX(-50%) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact { + left: 50vw; + width: min(760px, calc(100vw - clamp(32px, 6vw, 96px))); + transform: translateX(-50%) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - width: 100% !important; - margin-inline: auto !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer, +.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { + width: 100%; + margin-inline: auto } @media (max-width: 640px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact { - top: calc(var(--ecommerce-topbar-height, 62px) + 8px) !important; - width: min(100vw - 22px, 560px) !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact { + top: calc(var(--ecommerce-topbar-height, 62px) + 8px); + width: min(100vw - 22px, 560px) } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - grid-template-columns: auto minmax(0, 1fr) auto !important; - column-gap: 8px !important; - min-height: 62px !important; - max-height: 72px !important; - padding: 8px 9px 8px 10px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer, + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { + grid-template-columns: auto minmax(0, 1fr) auto; + column-gap: 8px; + min-height: 62px; + max-height: 72px; + padding: 8px 9px 8px 10px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-popover { - min-width: 42px !important; - max-width: 94px !important; - min-height: 46px !important; - max-height: 46px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-popover { + min-width: 42px; + max-width: 94px; + min-height: 46px; + max-height: 46px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb { - flex-basis: 44px !important; - width: 44px !important; - height: 44px !important; - border-radius: 14px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-thumb { + flex-basis: 44px; + width: 44px; + height: 44px; + border-radius: 14px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-add { - flex-basis: 34px !important; - width: 34px !important; - height: 34px !important; - min-height: 34px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-asset-add { + flex-basis: 34px; + width: 34px; + height: 34px; + min-height: 34px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-composer textarea, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { - min-width: 0 !important; - max-height: 32px !important; - font-size: 15px !important; - line-height: 30px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .ecom-command-composer textarea, + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { + min-width: 0; + max-height: 32px; + font-size: 15px; + line-height: 30px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-send-button.ecom-command-send { - width: 48px !important; - height: 48px !important; - min-height: 48px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"].is-history-detail.is-history-collapsed .ecom-command-composer-wrap.has-generated.is-compact .clone-ai-send-button.ecom-command-send { + width: 48px; + height: 48px; + min-height: 48px } } /* #/imageWorkbench quick actions final tone: restore category colors and align icon tones with labels. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--detail { - --quick-accent: #7a5af8 !important; - --quick-bg: #f1edff !important; - --quick-text: #2f245d !important; - --quick-icon: #5f46d9 !important; - --quick-icon-bg: rgba(122, 90, 248, 0.13) !important; - --quick-border: rgba(122, 90, 248, 0.12) !important; - --quick-shadow: rgba(122, 90, 248, 0.1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--detail { + --quick-accent: #7a5af8; + --quick-bg: #f1edff; + --quick-text: #2f245d; + --quick-icon: #5f46d9; + --quick-icon-bg: rgba(122, 90, 248, 0.13); + --quick-border: rgba(122, 90, 248, 0.12); + --quick-shadow: rgba(122, 90, 248, 0.1) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--edit { - --quick-accent: #cc6b14 !important; - --quick-bg: #fff2e5 !important; - --quick-text: #4e2c11 !important; - --quick-icon: #a95616 !important; - --quick-icon-bg: rgba(204, 107, 20, 0.13) !important; - --quick-border: rgba(204, 107, 20, 0.12) !important; - --quick-shadow: rgba(204, 107, 20, 0.1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--edit { + --quick-accent: #cc6b14; + --quick-bg: #fff2e5; + --quick-text: #4e2c11; + --quick-icon: #a95616; + --quick-icon-bg: rgba(204, 107, 20, 0.13); + --quick-border: rgba(204, 107, 20, 0.12); + --quick-shadow: rgba(204, 107, 20, 0.1) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--cutout { - --quick-accent: #1073cc !important; - --quick-bg: #eaf5ff !important; - --quick-text: #123454 !important; - --quick-icon: #0f66b3 !important; - --quick-icon-bg: rgba(16, 115, 204, 0.13) !important; - --quick-border: rgba(16, 115, 204, 0.12) !important; - --quick-shadow: rgba(16, 115, 204, 0.1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--cutout { + --quick-accent: var(--ecom-primary); + --quick-bg: #eaf5ff; + --quick-text: #123454; + --quick-icon: var(--ecom-primary-hover); + --quick-icon-bg: rgba(16, 115, 204, 0.13); + --quick-border: rgba(16, 115, 204, 0.12); + --quick-shadow: rgba(16, 115, 204, 0.1) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--watermark { - --quick-accent: #c04468 !important; - --quick-bg: #fff0f5 !important; - --quick-text: #542234 !important; - --quick-icon: #a63a58 !important; - --quick-icon-bg: rgba(192, 68, 104, 0.13) !important; - --quick-border: rgba(192, 68, 104, 0.12) !important; - --quick-shadow: rgba(192, 68, 104, 0.1) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--watermark { + --quick-accent: #c04468; + --quick-bg: #fff0f5; + --quick-text: #542234; + --quick-icon: #a63a58; + --quick-icon-bg: rgba(192, 68, 104, 0.13); + --quick-border: rgba(192, 68, 104, 0.12); + --quick-shadow: rgba(192, 68, 104, 0.1) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { - border-color: var(--quick-border) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { + border-color: var(--quick-border); background: radial-gradient(circle at 14% 18%, color-mix(in srgb, var(--quick-accent) 15%, transparent), transparent 40%), - linear-gradient(135deg, rgba(255, 255, 255, 0.96), var(--quick-bg)) !important; - color: var(--quick-text) !important; + linear-gradient(135deg, rgba(255, 255, 255, 0.96), var(--quick-bg)); + color: var(--quick-text); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), - 0 8px 18px rgba(16, 32, 44, 0.032) !important; + 0 8px 18px rgba(16, 32, 44, 0.032) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { background: - linear-gradient(180deg, color-mix(in srgb, var(--quick-icon-bg) 78%, #ffffff), rgba(255, 255, 255, 0.62)) !important; - color: var(--quick-icon) !important; + linear-gradient(180deg, color-mix(in srgb, var(--quick-icon-bg) 78%, var(--ecom-bg-white)), rgba(255, 255, 255, 0.62)); + color: var(--quick-icon); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), - 0 7px 16px var(--quick-shadow) !important; + 0 7px 16px var(--quick-shadow) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board strong { - color: var(--quick-text) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board strong { + color: var(--quick-text) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible { - border-color: color-mix(in srgb, var(--quick-accent) 22%, transparent) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible { + border-color: color-mix(in srgb, var(--quick-accent) 22%, transparent); background: radial-gradient(circle at 14% 18%, color-mix(in srgb, var(--quick-accent) 24%, transparent), transparent 42%), - linear-gradient(135deg, #ffffff, color-mix(in srgb, var(--quick-bg) 88%, #ffffff)) !important; - color: var(--quick-icon) !important; + linear-gradient(135deg, var(--ecom-bg-white), color-mix(in srgb, var(--quick-bg) 88%, var(--ecom-bg-white))); + color: var(--quick-icon); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), - 0 14px 28px var(--quick-shadow) !important; + 0 14px 28px var(--quick-shadow) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span { background: - linear-gradient(180deg, color-mix(in srgb, var(--quick-accent) 18%, #ffffff), color-mix(in srgb, var(--quick-bg) 82%, #ffffff)) !important; - color: var(--quick-icon) !important; + linear-gradient(180deg, color-mix(in srgb, var(--quick-accent) 18%, var(--ecom-bg-white)), color-mix(in srgb, var(--quick-bg) 82%, var(--ecom-bg-white))); + color: var(--quick-icon) } /* #/imageWorkbench quick actions: remove visible borders while keeping the category color system. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board button > span { - border: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button > span { + border: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible { - border: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible { + border: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { - border-width: 0 !important; - border-style: none !important; - border-color: transparent !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { + border-width: 0; + border-style: none; + border-color: transparent } /* #/imageWorkbench quick actions: soften each action so the tones blend into the page. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { - background: rgba(255, 255, 255, 0.3) !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board { + background: rgba(255, 255, 255, 0.3); + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button { background: radial-gradient(circle at 16% 18%, color-mix(in srgb, var(--quick-accent) 10%, transparent), transparent 44%), - linear-gradient(135deg, color-mix(in srgb, var(--quick-bg) 86%, #ffffff), color-mix(in srgb, var(--quick-bg) 96%, #ffffff)) !important; - box-shadow: none !important; - color: var(--quick-text) !important; + linear-gradient(135deg, color-mix(in srgb, var(--quick-bg) 86%, var(--ecom-bg-white)), color-mix(in srgb, var(--quick-bg) 96%, var(--ecom-bg-white))); + box-shadow: none; + color: var(--quick-text) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { - background: transparent !important; - color: var(--quick-text) !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span { + background: transparent; + color: var(--quick-text); + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span .anticon, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span svg { - color: inherit !important; - fill: currentColor !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span .anticon, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button > span svg { + color: inherit; + fill: currentColor } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible { background: radial-gradient(circle at 16% 18%, color-mix(in srgb, var(--quick-accent) 14%, transparent), transparent 44%), - linear-gradient(135deg, color-mix(in srgb, var(--quick-bg) 92%, #ffffff), color-mix(in srgb, var(--quick-bg) 98%, #ffffff)) !important; - box-shadow: none !important; - color: var(--quick-text) !important; + linear-gradient(135deg, color-mix(in srgb, var(--quick-bg) 92%, var(--ecom-bg-white)), color-mix(in srgb, var(--quick-bg) 98%, var(--ecom-bg-white))); + box-shadow: none; + color: var(--quick-text) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span { - background: transparent !important; - color: var(--quick-text) !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span { + background: transparent; + color: var(--quick-text); + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span .anticon, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span svg, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span .anticon, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span svg { - color: inherit !important; - fill: currentColor !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span .anticon, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:hover > span svg, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span .anticon, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button:focus-visible > span svg { + color: inherit; + fill: currentColor } /* #/imageWorkbench generated results: remove all visual labels and their reserved space. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node .clone-ai-node-label, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node .clone-ai-main-result > span, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node .clone-ai-result-grid button > span { - display: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-node-label, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-main-result > span, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node .clone-ai-result-grid button > span { + display: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node:not(.is-generating) { - padding-top: 20px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node:not(.is-generating) { + padding-top: 20px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-canvas-node:not(.is-generating) .clone-ai-node-drag-handle { - height: 100% !important; - background: transparent !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-canvas-node:not(.is-generating) .clone-ai-node-drag-handle { + height: 100%; + background: transparent } /* #/imageWorkbench history records: keep hover delete icon centered in the row. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item { - position: relative !important; - display: block !important; - isolation: isolate !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item { + position: relative; + display: block; + isolation: isolate } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-main { - width: 100% !important; - padding-right: 46px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-main { + width: 100%; + padding-right: 46px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item:hover .ecom-command-history__item-delete, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item.is-active .ecom-command-history__item-delete { - grid-column: auto !important; - grid-row: auto !important; - align-self: auto !important; - position: absolute !important; - top: 50% !important; - right: 10px !important; - z-index: 4 !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - width: 28px !important; - height: 28px !important; - min-width: 28px !important; - min-height: 28px !important; - margin: 0 !important; - padding: 0 !important; - line-height: 1 !important; - transform: translateY(-50%) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item:hover .ecom-command-history__item-delete, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item.is-active .ecom-command-history__item-delete { + grid-column: auto; + grid-row: auto; + align-self: auto; + position: absolute; + top: 50%; + right: 10px; + z-index: 4; + display: inline-flex; + align-items: center; + justify-content: center; + width: 28px; + height: 28px; + min-width: 28px; + min-height: 28px; + margin: 0; + padding: 0; + line-height: 1; + transform: translateY(-50%) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete .anticon, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete svg { - display: block !important; - line-height: 1 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete .anticon, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-history__item .ecom-command-history__item-delete svg { + display: block; + line-height: 1 } /* #/imageWorkbench composer redesign: mode tabs outside, settings and assets inside. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs { - display: grid !important; - grid-template-columns: repeat(5, minmax(0, 1fr)) !important; - gap: 8px !important; - width: min(100%, 760px) !important; - margin: 0 auto 12px !important; - padding: 4px !important; - border: 1px solid rgba(30, 189, 219, 0.11) !important; - border-radius: 18px !important; - background: rgba(255, 255, 255, 0.64) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs { + display: grid; + grid-template-columns: repeat(5, minmax(0, 1fr)); + gap: 8px; + width: min(100%, 760px); + margin: 0 auto 12px; + padding: 4px; + border: 1px solid rgba(30, 189, 219, 0.11); + border-radius: 18px; + background: rgba(255, 255, 255, 0.64); box-shadow: 0 14px 34px rgba(16, 115, 204, 0.055), - inset 0 1px 0 rgba(255, 255, 255, 0.78) !important; - backdrop-filter: blur(14px) saturate(1.08) !important; - -webkit-backdrop-filter: blur(14px) saturate(1.08) !important; + inset 0 1px 0 rgba(255, 255, 255, 0.78); + backdrop-filter: blur(14px) saturate(1.08); + -webkit-backdrop-filter: blur(14px) saturate(1.08) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button { - --mode-accent: #1073cc; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 7px !important; - min-width: 0 !important; - min-height: 42px !important; - padding: 0 11px !important; - border: 0 !important; - border-radius: 14px !important; - background: transparent !important; - color: rgba(16, 32, 44, 0.66) !important; - box-shadow: none !important; - cursor: pointer !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs button { + --mode-accent: var(--ecom-primary); + display: inline-flex; + align-items: center; + justify-content: center; + gap: 7px; + min-width: 0; + min-height: 42px; + padding: 0 11px; + border: 0; + border-radius: 14px; + background: transparent; + color: rgba(16, 32, 44, 0.66); + box-shadow: none; + cursor: pointer; transition: background 180ms ease, color 180ms ease, box-shadow 180ms ease, - transform 180ms ease !important; + transform 180ms ease } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--set) { - --mode-accent: #0f8f72; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--set) { + --mode-accent: #0f8f72 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--detail) { - --mode-accent: #7a5af8; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--detail) { + --mode-accent: #7a5af8 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--model) { - --mode-accent: #1073cc; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--model) { + --mode-accent: var(--ecom-primary) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--video) { - --mode-accent: #cc6b14; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--video) { + --mode-accent: #cc6b14 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--hot) { - --mode-accent: #c04468; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs button:has(.ecom-command-mode-icon--hot) { + --mode-accent: #c04468 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button.is-active { +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs button:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs button.is-active { background: radial-gradient(circle at 20% 18%, color-mix(in srgb, var(--mode-accent) 14%, transparent), transparent 58%), - linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 252, 254, 0.9)) !important; - color: rgba(16, 32, 44, 0.9) !important; + linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 252, 254, 0.9)); + color: rgba(16, 32, 44, 0.9); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--mode-accent) 18%, transparent), - 0 10px 22px color-mix(in srgb, var(--mode-accent) 10%, transparent) !important; - transform: translateY(-1px) !important; + 0 10px 22px color-mix(in srgb, var(--mode-accent) 10%, transparent); + transform: translateY(-1px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs .ecom-command-mode-icon { - display: inline-grid !important; - width: 24px !important; - height: 24px !important; - min-width: 24px !important; - place-items: center !important; - border: 0 !important; - border-radius: 9px !important; - background: color-mix(in srgb, var(--mode-accent) 11%, #ffffff) !important; - color: var(--mode-accent) !important; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7) !important; - font-size: 13px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs .ecom-command-mode-icon { + display: inline-grid; + width: 24px; + height: 24px; + min-width: 24px; + place-items: center; + border: 0; + border-radius: 9px; + background: color-mix(in srgb, var(--mode-accent) 11%, var(--ecom-bg-white)); + color: var(--mode-accent); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7); + font-size: 13px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs strong { - min-width: 0 !important; - overflow: hidden !important; - font-size: 13px !important; - font-weight: 760 !important; - letter-spacing: 0 !important; - line-height: 1 !important; - text-overflow: ellipsis !important; - white-space: nowrap !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs strong { + min-width: 0; + overflow: hidden; + font-size: 13px; + font-weight: 760; + letter-spacing: 0; + line-height: 1; + text-overflow: ellipsis; + white-space: nowrap } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - display: grid !important; - grid-template-columns: minmax(0, 1fr) !important; - grid-auto-rows: auto !important; - grid-template-rows: none !important; - align-content: start !important; - row-gap: 12px !important; - min-height: clamp(214px, 17vh, 236px) !important; - padding: 18px 22px 16px !important; - overflow: visible !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + display: grid; + grid-template-columns: minmax(0, 1fr); + grid-auto-rows: auto; + grid-template-rows: none; + align-content: start; + row-gap: 12px; + min-height: clamp(214px, 17vh, 236px); + padding: 18px 22px 16px; + overflow: visible } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - min-height: clamp(256px, 22vh, 286px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { + min-height: clamp(256px, 22vh, 286px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings { - grid-column: 1 !important; - grid-row: auto !important; - display: flex !important; - flex-wrap: wrap !important; - align-items: center !important; - justify-content: flex-start !important; - gap: 8px !important; - width: 100% !important; - padding: 0 0 2px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings { + grid-column: 1; + grid-row: auto; + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: flex-start; + gap: 8px; + width: 100%; + padding: 0 0 2px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button { - min-width: 0 !important; - min-height: 36px !important; - padding: 0 11px !important; - border: 1px solid rgba(30, 189, 219, 0.12) !important; - border-radius: 13px !important; - background: rgba(248, 253, 255, 0.72) !important; - color: rgba(16, 32, 44, 0.72) !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings button { + min-width: 0; + min-height: 36px; + padding: 0 11px; + border: 1px solid rgba(30, 189, 219, 0.12); + border-radius: 13px; + background: rgba(248, 253, 255, 0.72); + color: rgba(16, 32, 44, 0.72); + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button.is-active { - border-color: rgba(30, 189, 219, 0.28) !important; - background: rgba(241, 251, 254, 0.92) !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.055) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings button:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings button.is-active { + border-color: rgba(30, 189, 219, 0.28); + background: rgba(241, 251, 254, 0.92); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.055) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings .ecom-command-option-icon { - width: 20px !important; - height: 20px !important; - border: 0 !important; - background: rgba(232, 249, 253, 0.78) !important; - color: #0f829b !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings .ecom-command-option-icon { + width: 20px; + height: 20px; + border: 0; + background: rgba(232, 249, 253, 0.78); + color: var(--ecom-accent-cyan-deep); + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-popover { - position: static !important; - grid-column: 1 !important; - grid-row: auto !important; - display: flex !important; - align-items: center !important; - justify-content: flex-start !important; - gap: 8px !important; - width: 100% !important; - max-width: 100% !important; - min-height: 62px !important; - max-height: 72px !important; - padding: 8px 2px 10px !important; - overflow-x: auto !important; - overflow-y: visible !important; - border: 0 !important; - border-radius: 0 !important; - background: transparent !important; - box-shadow: none !important; - transform: none !important; - scrollbar-width: thin !important; - scrollbar-color: rgba(16, 115, 204, 0.18) transparent !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover { + position: static; + grid-column: 1; + grid-row: auto; + display: flex; + align-items: center; + justify-content: flex-start; + gap: 8px; + width: 100%; + max-width: 100%; + min-height: 62px; + max-height: 72px; + padding: 8px 2px 10px; + overflow-x: auto; + overflow-y: visible; + border: 0; + border-radius: 0; + background: transparent; + box-shadow: none; + transform: none; + scrollbar-width: thin; + scrollbar-color: rgba(16, 115, 204, 0.18) transparent } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb { - flex: 0 0 58px !important; - width: 58px !important; - height: 58px !important; - border: 1px solid rgba(30, 189, 219, 0.12) !important; - border-radius: 14px !important; - background: rgba(246, 251, 253, 0.9) !important; - box-shadow: 0 8px 18px rgba(16, 115, 204, 0.06) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb { + flex: 0 0 58px; + width: 58px; + height: 58px; + border: 1px solid rgba(30, 189, 219, 0.12); + border-radius: 14px; + background: rgba(246, 251, 253, 0.9); + box-shadow: 0 8px 18px rgba(16, 115, 204, 0.06) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb img, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb video { - border-radius: 13px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb img, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb video { + border-radius: 13px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add { - flex: 0 0 38px !important; - width: 38px !important; - height: 38px !important; - min-height: 38px !important; - margin: 0 !important; - border: 0 !important; - border-radius: 12px !important; - background: rgba(232, 249, 253, 0.72) !important; - color: #0f829b !important; - font-size: 24px !important; - box-shadow: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-add { + flex: 0 0 38px; + width: 38px; + height: 38px; + min-height: 38px; + margin: 0; + border: 0; + border-radius: 12px; + background: rgba(232, 249, 253, 0.72); + color: var(--ecom-accent-cyan-deep); + font-size: 24px; + box-shadow: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer textarea { - grid-column: 1 !important; - grid-row: auto !important; - min-height: clamp(82px, 9vh, 106px) !important; - padding: 2px 0 4px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer textarea { + grid-column: 1; + grid-row: auto; + min-height: clamp(82px, 9vh, 106px); + padding: 2px 0 4px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { - min-height: clamp(68px, 7vh, 92px) !important; - max-height: 112px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea { + min-height: clamp(68px, 7vh, 92px); + max-height: 112px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { - grid-column: 1 !important; - grid-row: auto !important; - display: flex !important; - align-items: center !important; - justify-content: space-between !important; - gap: 12px !important; - width: 100% !important; - padding: 10px 0 0 !important; - border-top: 1px solid rgba(30, 189, 219, 0.085) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { + grid-column: 1; + grid-row: auto; + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + width: 100%; + padding: 10px 0 0; + border-top: 1px solid rgba(30, 189, 219, 0.085) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-actions { - display: flex !important; - align-items: center !important; - justify-content: flex-start !important; - min-width: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-actions { + display: flex; + align-items: center; + justify-content: flex-start; + min-width: 0 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom { - position: static !important; - display: inline-flex !important; - align-items: center !important; - justify-content: center !important; - gap: 7px !important; - width: auto !important; - min-width: 0 !important; - height: 38px !important; - min-height: 38px !important; - margin: 0 !important; - padding: 0 12px !important; - border: 0 !important; - border-radius: 13px !important; - background: rgba(248, 253, 255, 0.78) !important; - color: rgba(16, 32, 44, 0.68) !important; - box-shadow: none !important; - transform: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--bottom { + position: static; + display: inline-flex; + align-items: center; + justify-content: center; + gap: 7px; + width: auto; + min-width: 0; + height: 38px; + min-height: 38px; + margin: 0; + padding: 0 12px; + border: 0; + border-radius: 13px; + background: rgba(248, 253, 255, 0.78); + color: rgba(16, 32, 44, 0.68); + box-shadow: none; + transform: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom:hover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom.is-dragging { - background: rgba(232, 249, 253, 0.9) !important; - color: #0f829b !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--bottom:hover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--bottom.is-dragging { + background: rgba(232, 249, 253, 0.9); + color: var(--ecom-accent-cyan-deep) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom > span { - display: inline-flex !important; - width: 20px !important; - min-width: 20px !important; - height: 20px !important; - place-items: center !important; - margin: 0 !important; - font-size: 17px !important; - line-height: 1 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--bottom > span { + display: inline-flex; + width: 20px; + min-width: 20px; + height: 20px; + place-items: center; + margin: 0; + font-size: 17px; + line-height: 1 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom strong { - display: inline !important; - font-size: 13px !important; - font-weight: 720 !important; - line-height: 1 !important; - white-space: nowrap !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--bottom strong { + display: inline; + font-size: 13px; + font-weight: 720; + line-height: 1; + white-space: nowrap } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-submit-row { - display: flex !important; - align-items: center !important; - justify-content: flex-end !important; - min-width: 0 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-submit-row { + display: flex; + align-items: center; + justify-content: flex-end; + min-width: 0 } @media (max-width: 900px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs { - grid-template-columns: repeat(5, minmax(94px, 1fr)) !important; - width: 100% !important; - overflow-x: auto !important; - overscroll-behavior-x: contain !important; - scrollbar-width: none !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs { + grid-template-columns: repeat(5, minmax(94px, 1fr)); + width: 100%; + overflow-x: auto; + overscroll-behavior-x: contain; + scrollbar-width: none } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs::-webkit-scrollbar { - display: none !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs::-webkit-scrollbar { + display: none } } @media (max-width: 640px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs { - grid-template-columns: repeat(5, minmax(88px, 1fr)) !important; - margin-bottom: 10px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs { + grid-template-columns: repeat(5, minmax(88px, 1fr)); + margin-bottom: 10px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs button { - min-height: 38px !important; - padding-inline: 8px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs button { + min-height: 38px; + padding-inline: 8px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-mode-tabs .ecom-command-mode-icon { - width: 22px !important; - height: 22px !important; - min-width: 22px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-mode-tabs .ecom-command-mode-icon { + width: 22px; + height: 22px; + min-width: 22px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { - min-height: 230px !important; - padding: 15px !important; - row-gap: 10px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + min-height: 230px; + padding: 15px; + row-gap: 10px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button { - flex: 1 1 calc(50% - 5px) !important; - justify-content: flex-start !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings button { + flex: 1 1 calc(50% - 5px); + justify-content: flex-start } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { - align-items: center !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { + align-items: center } } @media (max-width: 420px) { - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings { - display: grid !important; - grid-template-columns: repeat(4, minmax(0, 1fr)) !important; - gap: 7px !important; - justify-content: stretch !important; - overflow: visible !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings { + display: grid; + grid-template-columns: repeat(4, minmax(0, 1fr)); + gap: 7px; + justify-content: stretch; + overflow: visible } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button { - display: inline-flex !important; - width: auto !important; - min-width: 0 !important; - max-width: none !important; - height: 42px !important; - min-height: 42px !important; - padding: 0 !important; - justify-content: center !important; - font-size: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings button { + display: inline-flex; + width: auto; + min-width: 0; + max-width: none; + height: 42px; + min-height: 42px; + padding: 0; + justify-content: center; + font-size: 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button > span:not(.ecom-command-option-icon) { - display: none !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings button > span:not(.ecom-command-option-icon) { + display: none } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings .ecom-command-option-icon { - display: inline-grid !important; - width: 22px !important; - height: 22px !important; - min-width: 22px !important; - margin: 0 !important; - font-size: 14px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row--settings .ecom-command-option-icon { + display: inline-grid; + width: 22px; + height: 22px; + min-width: 22px; + margin: 0; + font-size: 14px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { - flex-direction: row !important; - align-items: center !important; - justify-content: space-between !important; - min-height: 58px !important; - height: auto !important; - padding-top: 10px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar { + flex-direction: row; + align-items: center; + justify-content: space-between; + min-height: 58px; + height: auto; + padding-top: 10px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-actions, - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-submit-row { - width: auto !important; - min-width: 0 !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-actions, + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-submit-row { + width: auto; + min-width: 0 } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom { - width: auto !important; - min-width: 0 !important; - max-width: none !important; - height: 38px !important; - min-height: 38px !important; - padding: 0 12px !important; - font-size: 13px !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--bottom { + width: auto; + min-width: 0; + max-width: none; + height: 38px; + min-height: 38px; + padding: 0 12px; + font-size: 13px } - html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference.ecom-command-reference--bottom strong { - display: inline !important; + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference--bottom strong { + display: inline } } /* Compact composer override: keep the generated-state composer from growing into the canvas. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact:not(.is-history-detail *) .clone-ai-input-wrapper.ecom-command-composer, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact:not(.is-history-detail *) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - min-height: 156px !important; - max-height: 186px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact:not(.is-history-detail *) .clone-ai-input-wrapper.ecom-command-composer, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact:not(.is-history-detail *) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { + min-height: 156px; + max-height: 186px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact:not(.is-history-detail *) .ecom-command-composer textarea { - min-height: 36px !important; - max-height: 36px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap.has-generated.is-compact:not(.is-history-detail *) .ecom-command-composer textarea { + min-height: 36px; + max-height: 36px } /* Composer menu anchors: place option popovers under the clicked control, not under the whole composer. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover { - position: absolute !important; - inset: var(--composer-popover-top, 48px) auto auto var(--composer-popover-left, 0px) !important; - right: auto !important; - bottom: auto !important; - margin: 0 !important; - transform: none !important; - translate: none !important; - z-index: 160 !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover { + position: absolute; + inset: var(--composer-popover-top, 48px) auto auto var(--composer-popover-left, 0px); + right: auto; + bottom: auto; + margin: 0; + transform: none; + translate: none; + z-index: 160 } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platform { - width: min(360px, calc(100% - var(--composer-popover-left, 0px))) !important; - max-width: min(360px, calc(100% - var(--composer-popover-left, 0px))) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--platform { + width: min(360px, calc(100% - var(--composer-popover-left, 0px))); + max-width: min(360px, calc(100% - var(--composer-popover-left, 0px))) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--languages, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--ratio-picker { - width: min(420px, calc(100% - var(--composer-popover-left, 0px))) !important; - max-width: min(420px, calc(100% - var(--composer-popover-left, 0px))) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--languages, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--ratio-picker { + width: min(420px, calc(100% - var(--composer-popover-left, 0px))); + max-width: min(420px, calc(100% - var(--composer-popover-left, 0px))) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings { - width: min(520px, calc(100% - var(--composer-popover-left, 0px))) !important; - max-width: min(520px, calc(100% - var(--composer-popover-left, 0px))) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover--settings { + width: min(520px, calc(100% - var(--composer-popover-left, 0px))); + max-width: min(520px, calc(100% - var(--composer-popover-left, 0px))) } /* Uploaded assets stay as compact attachments inside the composer hierarchy. */ -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { - min-height: clamp(224px, 18vh, 250px) !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) { + min-height: clamp(224px, 18vh, 250px) } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-popover, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover { - position: static !important; - grid-column: 1 !important; - display: inline-flex !important; - align-items: center !important; - justify-content: flex-start !important; - justify-self: start !important; - gap: 8px !important; - width: auto !important; - max-width: min(100%, 420px) !important; - min-height: 48px !important; - max-height: 52px !important; - padding: 0 !important; - overflow-x: auto !important; - overflow-y: visible !important; - border: 0 !important; - border-radius: 0 !important; - background: transparent !important; - box-shadow: none !important; - transform: none !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover { + position: static; + grid-column: 1; + display: inline-flex; + align-items: center; + justify-content: flex-start; + justify-self: start; + gap: 8px; + width: auto; + max-width: min(100%, 420px); + min-height: 48px; + max-height: 52px; + padding: 0; + overflow-x: auto; + overflow-y: visible; + border: 0; + border-radius: 0; + background: transparent; + box-shadow: none; + transform: none } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb { - flex: 0 0 48px !important; - width: 48px !important; - height: 48px !important; - border-radius: 12px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-thumb, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb { + flex: 0 0 48px; + width: 48px; + height: 48px; + border-radius: 12px } -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add, -html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add { - flex: 0 0 34px !important; - width: 34px !important; - height: 34px !important; - min-height: 34px !important; - margin: 0 !important; - font-size: 22px !important; +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-add, +.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add { + flex: 0 0 34px; + width: 34px; + height: 34px; + min-height: 34px; + margin: 0; + font-size: 22px } diff --git a/src/styles/standalone/tokens.css b/src/styles/standalone/tokens.css new file mode 100644 index 0000000..ebdc688 --- /dev/null +++ b/src/styles/standalone/tokens.css @@ -0,0 +1,65 @@ +/* + * Ecommerce standalone color tokens — 蓝色/青色主题色板 + * + * 这些变量替换了 base.css 和 overrides.css 中原先硬编码的 hex 颜色值。 + * 需要更换主题时只需修改此处即可。 + */ +:root { + /* Primary accent — buttons, links, active states */ + --ecom-primary: #1073cc; + --ecom-primary-rgb: 16, 115, 204; + --ecom-primary-hover: #0f66b3; + --ecom-primary-light: rgba(16, 115, 204, 0.12); + + /* Cyan / teal accent — gradients, focus rings, highlights */ + --ecom-accent-cyan: #1ebddb; + --ecom-accent-cyan-rgb: 30, 189, 219; + --ecom-accent-cyan-light: #16c8df; + --ecom-accent-cyan-bright: #18bfd2; + --ecom-accent-cyan-deep: #0f829b; + + /* Background — white / near-white variants */ + --ecom-bg-white: #ffffff; + --ecom-bg-near-white: #feffff; + --ecom-bg-page: #f8f9fa; + --ecom-bg-tinted: #edf8fb; + --ecom-bg-cool: #f3f8fa; + + /* Background — dark blue variants */ + --ecom-bg-dark: #10202c; + --ecom-bg-dark-blue: #172636; + --ecom-bg-deep-blue: #163447; + --ecom-bg-navy: #083c67; + --ecom-bg-navy-deep: #05233f; + + /* Text */ + --ecom-text-primary: #10202c; + --ecom-text-on-dark: #f5fbff; + --ecom-text-muted: #738392; + --ecom-text-placeholder: #8da0ab; + + /* Border */ + --ecom-border-light: rgba(16, 115, 204, 0.14); + --ecom-border-accent: rgba(30, 189, 219, 0.28); + --ecom-border-cyan: rgba(29, 190, 219, 0.66); + + /* Shadow */ + --ecom-shadow-primary: 0 10px 28px rgba(16, 115, 204, 0.08); + --ecom-shadow-accent: 0 16px 34px rgba(29, 190, 219, 0.24); + --ecom-shadow-cyan: 0 18px 46px rgba(15, 130, 155, 0.13); + + /* Spacing */ + --ecom-space-xs: 6px; + --ecom-space-sm: 8px; + --ecom-space-md: 12px; + --ecom-space-lg: 16px; + --ecom-space-xl: 20px; + --ecom-space-2xl: 24px; + + /* Radius */ + --ecom-radius-sm: 8px; + --ecom-radius-md: 10px; + --ecom-radius-lg: 14px; + --ecom-radius-xl: 16px; + --ecom-radius-2xl: 18px; +}