diff --git a/src/styles/ecommerce-standalone.css b/src/styles/ecommerce-standalone.css index 09e5f09..8a6ea7e 100644 --- a/src/styles/ecommerce-standalone.css +++ b/src/styles/ecommerce-standalone.css @@ -5620,11 +5620,19 @@ } .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-title.ecom-command-title { - max-width: min(100%, 440px) !important; + max-width: min(100%, 520px) !important; margin-inline: auto !important; - font-size: clamp(29px, 7.8vw, 34px) !important; - line-height: 1.14 !important; + 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; + text-wrap: balance; + white-space: normal !important; } .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { @@ -5654,21 +5662,46 @@ } .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row { - display: flex !important; - flex-wrap: wrap !important; + display: grid !important; + grid-template-columns: repeat(6, 44px) !important; + flex-wrap: nowrap !important; align-items: center !important; - justify-content: flex-start !important; + justify-content: center !important; gap: 8px !important; width: 100% !important; } .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: 1 1 calc(50% - 8px) !important; - max-width: none !important; - min-height: 38px !important; + 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; - padding-inline: 10px !important; + gap: 0 !important; + padding: 0 !important; + overflow: hidden !important; + border-radius: 15px !important; + font-size: 0 !important; + } + + .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; + } + + .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; } .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-submit-row { @@ -5689,19 +5722,22 @@ @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: 24px !important; + top: clamp(72px, 9vh, 88px) !important; } .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; + font-size: clamp(24px, 7.2vw, 30px) !important; } .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: calc(50% - 8px) !important; - min-height: 36px !important; - font-size: 12px !important; - padding-inline: 8px !important; + 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; } } @@ -5921,3 +5957,860 @@ visibility: visible !important; } } + +/* #/imageWorkbench SaaS entry refinement. */ +.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] { + --ecom-entry-surface: rgba(255, 255, 255, 0.86); + --ecom-entry-surface-strong: rgba(255, 255, 255, 0.96); + --ecom-entry-border-hairline: rgba(30, 189, 219, 0.16); + --ecom-entry-border-active: rgba(30, 189, 219, 0.42); + --ecom-entry-shadow-soft: 0 18px 54px rgba(16, 115, 204, 0.09); + --ecom-entry-shadow-focus: 0 24px 72px rgba(16, 115, 204, 0.14); + 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; +} + +.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; +} + +.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; +} + +.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; +} + +.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; + 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; + 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; +} + +.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; + 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; +} + +.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; +} + +.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; +} + +.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; +} + +.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row { + gap: 9px !important; +} + +.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; + 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; +} + +.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; +} + +.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; +} + +.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; + background: + linear-gradient(180deg, rgba(246, 254, 255, 0.98), rgba(228, 249, 253, 0.92)) !important; + color: var(--ecom-entry-text) !important; +} + +.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; + box-shadow: + 0 18px 38px rgba(30, 189, 219, 0.3), + inset 0 1px 0 rgba(255, 255, 255, 0.38) !important; +} + +.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; + background: + linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(248, 253, 255, 0.66)), + rgba(255, 255, 255, 0.62) !important; + box-shadow: + 0 18px 52px rgba(16, 115, 204, 0.075), + inset 0 1px 0 rgba(255, 255, 255, 0.78) !important; +} + +.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; + background: + linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(246, 252, 254, 0.58)) !important; + box-shadow: none !important; +} + +.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; + background: + linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(235, 251, 254, 0.92)) !important; + 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; +} + +.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; +} + +.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board strong { + font-weight: 820 !important; +} + +.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; +} + +@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; + } +} + +@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; + } + + .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; + } + + .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; + 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; + text-wrap: balance; + white-space: normal !important; + } + + .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; + } + + .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; + } + + .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { + gap: 12px !important; + padding-top: 12px !important; + } + + .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; + } + + .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; + } + + .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; + } + + .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; + } + + .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; + } + + .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; + } + + .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; + } + + .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; + } + + .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board strong { + font-size: 13px !important; + } + + .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; + 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; + } + + .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; + } + + .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; + } + + .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; + } +} + +@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; + } + + 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; + } +} + +@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; + 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; + text-wrap: balance; + white-space: normal !important; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } +} + +@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.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer { + padding: 14px !important; + } + + .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; + } +} + +@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; + } + + 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; + } + + 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; + } +} + +@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; + } +} + +/* #/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; +} + +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; +} + +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; +} + +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; +} + +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; +} + +@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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + background: + linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 252, 254, 0.94)) !important; + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + background: + linear-gradient(180deg, rgba(250, 254, 255, 0.96), rgba(238, 250, 253, 0.84)) !important; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } +} + +@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; + } + + 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; + } + + 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; + } +} diff --git a/src/styles/pages/ecommerce.css b/src/styles/pages/ecommerce.css index 33322a1..7c6af7f 100644 --- a/src/styles/pages/ecommerce.css +++ b/src/styles/pages/ecommerce.css @@ -11477,3 +11477,631 @@ .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview { overflow: visible !important; } + +/* Final #/imageWorkbench entry locks: keep the standalone SaaS landing stable after shared ecommerce styles load. */ +body .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; +} + +body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button, +body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-upload-inline { + border-radius: 15px !important; +} + +body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline strong { + display: inline !important; + min-width: 0 !important; + overflow: hidden !important; + color: inherit !important; + font-size: inherit !important; + line-height: inherit !important; + text-overflow: ellipsis !important; + white-space: nowrap !important; +} + +@media (max-width: 760px) { + body .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; + overflow: visible !important; + 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; + text-wrap: balance; + white-space: normal !important; + } + + body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer, + body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board { + width: min(100%, calc(100vw - 64px), 352px) !important; + margin-inline: auto !important; + } + + body .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; + gap: 8px !important; + justify-content: center !important; + width: 100% !important; + } + + body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row button, + body .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; + overflow: hidden !important; + padding: 0 !important; + font-size: 0 !important; + } + + body .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), + body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-reference--inline strong { + display: none !important; + } + + body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row .ecom-command-option-icon, + body .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; + } + + body .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; + transform: none !important; + translate: none !important; + } + + body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--grid, + body .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover.ecom-command-popover--list, + 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; + } + + body .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; + } +} + +@media (max-width: 420px) { + body .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; + } +} + +@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; + } + + 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; + } +} + +@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; + 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; + text-wrap: balance; + white-space: normal !important; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } +} + +@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; + } + + 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; + } + + 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; + } +} + +@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; + } +} + +/* #/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; +} + +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; +} + +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; +} + +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; +} + +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; +} + +@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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + background: + linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 252, 254, 0.94)) !important; + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + background: + linear-gradient(180deg, rgba(250, 254, 255, 0.96), rgba(238, 250, 253, 0.84)) !important; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } + + 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; + } +} + +@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; + } + + 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; + } + + 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; + } +} diff --git a/src/styles/themes/dark-green.css b/src/styles/themes/dark-green.css index eb58736..1122115 100644 --- a/src/styles/themes/dark-green.css +++ b/src/styles/themes/dark-green.css @@ -10676,6 +10676,177 @@ color: var(--accent); } +/* Final typography normalization. Loaded with the runtime theme so it wins over legacy page CSS. */ +html body #root, +html body #root *:not(svg):not(path):not(use) { + font-family: var(--font-sans) !important; + font-synthesis-weight: none; + letter-spacing: 0 !important; +} + +html body #root :is( + p, + em, + li, + td, + dd, + small, + figcaption, + input, + textarea, + select +) { + font-size: var(--text-base) !important; + font-weight: var(--weight-regular) !important; + line-height: var(--leading-body) !important; +} + +html body #root :is(strong, b) { + font-size: inherit !important; + font-weight: var(--weight-bold) !important; + line-height: inherit !important; +} + +html body #root span:not(.anticon):not(.shell-icon) { + font-weight: var(--weight-regular) !important; + line-height: inherit !important; +} + +html body #root :is( + code, + pre, + kbd, + samp, + [class*="mono"], + [class*="code-block"], + [class*="log-line"], + [class*="uid"] +) { + font-family: var(--font-mono) !important; +} + +html body #root :is(.anticon, .shell-icon, [class*="icon"]) { + font-size: inherit !important; + font-weight: inherit !important; + line-height: 1 !important; +} + +html body #root :is( + button, + label, + th, + [class*="button"], + [class*="btn"], + [class*="tab"], + [class*="chip"], + [class*="badge"], + [class*="tag"], + [class*="pill"], + [class*="label"] +) { + font-size: var(--text-md) !important; + font-weight: var(--weight-semibold) !important; + line-height: var(--leading-control) !important; +} + +html body #root :is(button, [class*="button"], [class*="btn"]) { + font-weight: var(--weight-bold) !important; +} + +html body #root :is( + button, + label, + [class*="button"], + [class*="btn"], + [class*="tab"], + [class*="chip"], + [class*="badge"], + [class*="tag"], + [class*="pill"], + [class*="label"] +) :is(span, strong, b) { + font-size: inherit !important; + font-weight: inherit !important; + line-height: inherit !important; +} + +html body #root :is( + h1, + h2, + h3, + h4, + h5, + h6, + [class*="title"], + [class*="heading"], + [class*="headline"], + [class*="hero-title"], + [class*="section-title"], + [class*="card-title"] +) { + font-family: var(--font-sans) !important; + font-weight: var(--weight-bold) !important; + line-height: var(--leading-heading) !important; + letter-spacing: 0 !important; +} + +html body #root :is(h1, [class*="hero-title"], [class*="page-title"], [class*="headline"]) { + font-size: var(--text-title) !important; + font-weight: var(--weight-heavy) !important; +} + +html body #root :is(h2, [class*="section-title"]) { + font-size: var(--text-3xl) !important; +} + +html body #root :is(h3, [class*="card-title"]) { + font-size: var(--text-xl) !important; +} + +html body #root :is( + [class*="subtitle"], + [class*="desc"], + [class*="description"], + [class*="hint"], + [class*="note"], + [class*="meta"], + [class*="caption"], + [class*="empty"] +) { + font-size: var(--text-md) !important; + font-weight: var(--weight-regular) !important; + line-height: var(--leading-body) !important; +} + +html body #root :is( + [class*="score"], + [class*="number"], + [class*="count"], + [class*="value"], + [class*="amount"], + [class*="price"] +) { + font-size: inherit !important; + font-weight: var(--weight-bold) !important; + letter-spacing: 0 !important; +} + +html body #root :is(h1, h2, h3, h4, h5, h6) :is(span, strong, em, b) { + font-size: inherit !important; + font-weight: inherit !important; + line-height: inherit !important; +} + +@media (max-width: 767px) { + html body #root :is(h1, [class*="hero-title"], [class*="page-title"], [class*="headline"]) { + font-size: clamp(22px, 7vw, 30px) !important; + } + + html body #root :is(h2, [class*="section-title"]) { + font-size: var(--text-2xl) !important; + } +} + @media (max-width: 900px) { .web-shell[data-ui-theme="dark-green"][data-view="canvas"] .studio-canvas-project-bar { top: 70px;